Skip to content

Commit

Permalink
Merge branch 'develop' of github.com:GoogleChromeLabs/ps-analysis-too…
Browse files Browse the repository at this point in the history 
…l into develop
  • Loading branch information
@amovar18
amovar18 committed Jan 29, 2025
2 parents e8aa307 + 0d1da0c commit 398f1fc
Show file tree
Hide file tree
Showing 4 changed files with 103 additions and 49 deletions.
2 changes: 2 additions & 0 deletions packages/explorable-explanations/src/protectedAudience/components/box.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ const Box = ({
color,
info = false,
isBranchComponent = false,
borderStroke = config.flow.colors.box.borderStroke,
}) => {
x = typeof x === 'function' ? x() : x;
y = typeof y === 'function' ? y() : y;
Expand Down Expand Up @@ -65,6 +66,7 @@ const Box = ({
p.push();
p.textAlign(p.CENTER, p.CENTER);
p.fill(color || background);
p.stroke(...borderStroke);
p.rect(x, y, width, height);
p.strokeWeight(0.1);
p.fill(text);
Expand Down
1 change: 1 addition & 0 deletions packages/explorable-explanations/src/protectedAudience/config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -131,6 +131,7 @@ const config = {
notBrowser: '#ffec99',
noData: '#e9ecef',
text: '#000',
borderStroke: [0, 0, 0],
},
},
},
Expand Down
147 changes: 99 additions & 48 deletions ...xplanations/src/protectedAudience/modules/auctions/multi-seller/setUpComponentAuctions.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
*/
import app from '../../../app';
import config, { publisherData } from '../../../config';
import { Box, ProgressLine, Text, Custom } from '../../../components';
import { Box, ProgressLine, Text } from '../../../components';
import setUpRunadAuction from '../setUpRunadAuction';
import { MULTI_SELLER_CONFIG } from '../../flowConfig.jsx';

Expand Down Expand Up @@ -62,6 +62,7 @@ const setUpComponentAuctions = (steps, index) => {
boxCordinates.y = app.auction.nextTipCoordinates?.y;
return boxCordinates.y;
},
borderStroke: [0, 0, 0, 0],
},
delay: 1000,
callBack: (returnValue) => {
Expand All @@ -75,48 +76,49 @@ const setUpComponentAuctions = (steps, index) => {
x: () =>
app.auction.nextTipCoordinates?.x -
BOX_WIDTH / 2 +
BORDER_BOX_MARGIN * 2 +
20,
y: () => app.auction.nextTipCoordinates?.y - 225 - 15,
BORDER_BOX_MARGIN * 2,
y: () => app.auction.nextTipCoordinates?.y - 240,
info: MULTI_SELLER_CONFIG.SSP_X.info,
sspWebsite: 'https://ssp-a.com',
sspWebsite: publisherData[publisher].ssps[0][1],
ssp: publisherData[publisher].ssps[0][0],
config: {
bidValue: '$10',
},
},
{
title: 'Component Auction',
x: () => app.auction.nextTipCoordinates?.x + BOX_COLUMN_MARGIN,
x: () => app.auction.nextTipCoordinates?.x + BOX_COLUMN_MARGIN + 106.5,
y: () =>
app.auction.nextTipCoordinates?.y -
BOX_HEIGHT +
BORDER_BOX_MARGIN * 2 +
15,
sspWebsite: publisherData[publisher].ssps[1][1],
info: MULTI_SELLER_CONFIG.SSP_X.info,
sspWebsite: 'https://ssp-b.com',
ssp: publisherData[publisher].ssps[1][0],
config: {
bidValue: '$8',
},
},
{
title: 'Component Auction',
x: () => app.auction.nextTipCoordinates?.x + BOX_COLUMN_MARGIN,
x: () => app.auction.nextTipCoordinates?.x + BOX_COLUMN_MARGIN + 106.5,
y: () =>
app.auction.nextTipCoordinates?.y -
BOX_HEIGHT +
BORDER_BOX_MARGIN * 2 +
15,
sspWebsite: publisherData[publisher].ssps[2][1],
info: MULTI_SELLER_CONFIG.SSP_X.info,
sspWebsite: 'https://ssp-c.com',
ssp: publisherData[publisher].ssps[2][0],
config: {
bidValue: '$6',
},
},
];

setUpComponentAuctionStarter(componentAuctions, steps);

componentAuctions.forEach((componentAuction, idx) => {
setUpComponentAuction(
steps,
Expand All @@ -131,11 +133,90 @@ const setUpComponentAuctions = (steps, index) => {
setupAfterComponentAuctionFlow(steps);
};

const setUpComponentAuctionStarter = (componentAuctions, steps) => {
// This callback does not update the app.auction.nextTipCoordinates.
// TODO: Update the return value callbacks in this function, this change will affect the whole flow coordinates. So recalculate the coordinates.

let returnCoordinates = {};

const getStartingCoordinates = (index) => {
if (index === 0) {
return app.auction.nextTipCoordinates;
}

return returnCoordinates;
};

const renderBoxes = ({ title, ssp }, index) => {
steps.push({
component: ProgressLine,
props: {
direction: 'down',
x1: () =>
getStartingCoordinates(index).x -
BOX_WIDTH / 2 +
BORDER_BOX_MARGIN * 2,
y1: () => getStartingCoordinates(index).y - 275,
customHeight: 20,
noArrow: true,
},
});

steps.push({
component: Text,
props: {
text: title,
x: () =>
getStartingCoordinates(index).x -
BOX_WIDTH / 2 +
BORDER_BOX_MARGIN * 2,
y: () => getStartingCoordinates(index).y - 240,
},
delay: 1000,
callBack: (returnValue) => {
returnCoordinates = returnValue;
},
});

steps.push({
component: Box,
props: {
title: ssp,
x: () => returnCoordinates?.x - BORDER_BOX_MARGIN - 12,
y: () => returnCoordinates?.y + 20,
},
delay: 1000,
callBack: () => {
returnCoordinates = {
x: app.auction.nextTipCoordinates?.x + 500 * (index + 1),
y: app.auction.nextTipCoordinates?.y,
};
},
});
};

// Create a line that span over the boxes
steps.push({
component: ProgressLine,
props: {
direction: 'right',
x1: () => app.auction.nextTipCoordinates?.x - 500,
y1: () => app.auction.nextTipCoordinates?.y - 275,
customWidth: 1000,
noArrow: true,
isBranch: true,
},
});

componentAuctions.forEach((componentAuction, index) => {
renderBoxes(componentAuction, index);
});
};

const setUpComponentAuction = (
steps,
{ title, x, y, ssp, info, sspWebsite },
{ bidValue },
index
{ title, x, y, ssp, info },
{ bidValue }
) => {
const { box, arrowSize } = config.flow;

Expand All @@ -156,8 +237,7 @@ const setUpComponentAuction = (
component: Box,
props: {
title: ssp,
ssp: sspWebsite,
x: () => app.auction.nextTipCoordinates?.x - BORDER_BOX_MARGIN - 15,
x: () => app.auction.nextTipCoordinates?.x - BORDER_BOX_MARGIN - 12,
y: () => app.auction.nextTipCoordinates?.y + 20,
info,
},
Expand Down Expand Up @@ -185,36 +265,7 @@ const setUpComponentAuction = (
},
});

setUpRunadAuction(
steps,
() => {
return {
component: Custom,
props: {
render: () => {
const p = app.p;

if (index === 2) {
p.push();
p.noFill();
p.rect(boxCordinates.x, boxCordinates.y, BOX_WIDTH, BOX_HEIGHT);
p.strokeWeight(0.1);
p.pop();
}

return {
down: app.auction.nextTipCoordinates,
};
},
},
delay: 1000,
callBack: (returnValue) => {
app.auction.nextTipCoordinates = returnValue.down;
},
};
},
sspWebsite
);
setUpRunadAuction(steps);

steps.push({
component: ProgressLine,
Expand Down Expand Up @@ -251,7 +302,7 @@ const setUpTPoint = (steps) => {
direction: 'left',
x1: () => app.auction.nextTipCoordinates?.x - 25,
y1: () => app.auction.nextTipCoordinates?.y,
customWidth: BOX_COLUMN_MARGIN - 55,
customWidth: BOX_COLUMN_MARGIN + 60,
noArrow: true,
},
callBack: (returnValue) => {
Expand All @@ -263,9 +314,9 @@ const setUpTPoint = (steps) => {
component: ProgressLine,
props: {
direction: 'left',
x1: () => app.auction.nextTipCoordinates?.x - 55,
x1: () => app.auction.nextTipCoordinates?.x - 50,
y1: () => app.auction.nextTipCoordinates?.y,
customWidth: BOX_COLUMN_MARGIN - 55,
customWidth: BOX_COLUMN_MARGIN + 60,
noArrow: true,
},
callBack: (returnValue) => {
Expand All @@ -277,7 +328,7 @@ const setUpTPoint = (steps) => {
component: ProgressLine,
props: {
direction: 'down',
x1: () => app.auction.nextTipCoordinates?.x + BOX_COLUMN_MARGIN - 28,
x1: () => app.auction.nextTipCoordinates?.x + BOX_COLUMN_MARGIN + 85,
y1: () => app.auction.nextTipCoordinates?.y + 20,
customHeight: 100,
},
Expand Down
2 changes: 1 addition & 1 deletion packages/extension/src/view/devtools/e2e-tests/settings/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ describe('Settings Page', () => {
await puppeteer.close();
}, 40000);

test('Should be able to validate the multitab setting option', async () => {
test.skip('Should be able to validate the multitab setting option', async () => {
await page.goto('https://bbc.com');

const devtools = await puppeteer.getDevtools();
Expand Down

0 comments on commit 398f1fc

Please sign in to comment.