From 8d50f6402d45f11b5bcf8171556d65756b3e953b Mon Sep 17 00:00:00 2001 From: Vasyl Ilba Date: Wed, 11 Sep 2024 16:48:28 +0300 Subject: [PATCH] add favicon & brand logo --- src/preview/dist/Favicon_black_32X32.png | Bin 0 -> 452 bytes src/preview/dist/Monks-Logo_Small_White.png | Bin 0 -> 6485 bytes src/preview/dist/index.html | 2 +- src/preview/dist/js/index_bundle.js | 4 ++-- src/preview/public/Favicon_black_32X32.png | Bin 0 -> 452 bytes src/preview/public/Monks-Logo_Small_White.png | Bin 0 -> 6485 bytes src/preview/public/index.html | 2 +- src/preview/src/components/Previews.js | 18 ++++++++++++++---- src/preview/src/index.css | 15 +++++++++++++++ src/webpack/buildPreview.js | 3 +++ src/webpack/devServer.js | 3 ++- src/webpack/devServerParallel.js | 3 ++- 12 files changed, 40 insertions(+), 10 deletions(-) create mode 100644 src/preview/dist/Favicon_black_32X32.png create mode 100644 src/preview/dist/Monks-Logo_Small_White.png create mode 100644 src/preview/public/Favicon_black_32X32.png create mode 100644 src/preview/public/Monks-Logo_Small_White.png diff --git a/src/preview/dist/Favicon_black_32X32.png b/src/preview/dist/Favicon_black_32X32.png new file mode 100644 index 0000000000000000000000000000000000000000..632f80d6e95ae4c01197b7d8415a7432ce8ff9dd GIT binary patch literal 452 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 literal 0 HcmV?d00001 diff --git a/src/preview/dist/index.html b/src/preview/dist/index.html index 964c670..d70a2ee 100644 --- a/src/preview/dist/index.html +++ b/src/preview/dist/index.html @@ -2,7 +2,7 @@ - + diff --git a/src/preview/dist/js/index_bundle.js b/src/preview/dist/js/index_bundle.js index 300e014..63676ff 100644 --- a/src/preview/dist/js/index_bundle.js +++ b/src/preview/dist/js/index_bundle.js @@ -3448,7 +3448,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ Previews)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Previews_module_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Previews.module.scss */ \"./src/components/Previews.module.scss\");\n/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-router-dom */ \"./node_modules/react-router-dom/dist/index.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/AppBar/AppBar.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Toolbar/Toolbar.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Box/Box.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Tooltip/Tooltip.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Button/Button.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Typography/Typography.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/FormControl/FormControl.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/InputLabel/InputLabel.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Select/Select.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/OutlinedInput/OutlinedInput.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Chip/Chip.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/ListSubheader/ListSubheader.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/MenuItem/MenuItem.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/TablePagination/TablePagination.js\");\n/* harmony import */ var _mui_icons_material_Cancel__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! @mui/icons-material/Cancel */ \"./node_modules/@mui/icons-material/Cancel.js\");\n/* harmony import */ var _mui_icons_material_Cached__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @mui/icons-material/Cached */ \"./node_modules/@mui/icons-material/Cached.js\");\n/* harmony import */ var _AdPreview__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./AdPreview */ \"./src/components/AdPreview.js\");\n\n\n\n\n\n\n\n\nconst paginate = (array, page_size, page_number) => {\n return array.slice((page_number - 1) * page_size, page_number * page_size);\n};\nconst getFiltersFromAds = (ads, searchParams) => {\n // returns array with all the filtergroup arrays containing all the unique filters\n // it also initially sets the filters based on the searchparams\n let filterGroups = [];\n ads.forEach(ad => {\n const bundleSplits = ad.bundleName.split(\"_\");\n bundleSplits.forEach((bundleSplit, index) => {\n if (!filterGroups[index]) filterGroups[index] = [];\n filterGroups[index].push(bundleSplit);\n });\n });\n filterGroups = filterGroups.map(filterGroup => [...new Set(filterGroup)]); // make them all unique\n\n // get the initial filter(s) from the searchParams ?filter=hk,en;friendsfamily;160x600\n const searchParamsArray = searchParams.get(\"filter\") ? searchParams.get(\"filter\").split(\";\").map(filterGroup => filterGroup.split(\",\")) : [];\n return filterGroups.map(filterGroup => {\n return filterGroup.map(filter => {\n return {\n value: filter,\n selected: searchParamsArray.flat().includes(filter)\n };\n });\n });\n};\nconst composeSearchParamsFromFilters = filters => {\n return filters.map(filterGroup => {\n return filterGroup.filter(filter => filter.selected).map(filter => filter.value).join(\",\");\n }).filter(filterGroup => filterGroup.length > 0).join(\";\");\n};\nconst getAdsListFromFilters = (adsList, filters) => {\n return adsList.filter(ad => {\n // en_friendsfamily_ill_300x250\n return ad.bundleName.split(\"_\").every((bundleSplit, index) => {\n const isFilteringOnGroup = filters[index].filter(filter => filter.selected).length > 0; // if any of the 'selected' keys are true in these objects, it means we're filtering on that group.\n\n if (isFilteringOnGroup) {\n const [filterValue] = filters[index].filter(filter => filter.value === bundleSplit).map(filter => filter.selected);\n return filterValue;\n } else {\n return true; // if we're not filtering on this group, all keys in this group are allowed (because no specific filter is selected in that group)\n }\n });\n });\n};\n\nconst getLabelFromFilterGroup = filterGroup => {\n if (filterGroup.every(filter => filter.value.match(/[0-9]+x[0-9]+/i))) return \"Dimensions\"; // if it matches dimensions, like 300x500 ;\n if (filterGroup.every(filter => filter.value.match(/^[a-z]{2}$/i))) return \"Language\"; // if string is 2 chars long and a-z or A-Z\n return \"Category\";\n};\nfunction Previews({\n data\n}) {\n const [searchParams, setSearchParams] = (0,react_router_dom__WEBPACK_IMPORTED_MODULE_3__.useSearchParams)();\n const [gsdevtools, setGSDevTools] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(searchParams.get('gsdevtools'));\n const [ads, setAds] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([]);\n const [filters, setFilters] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(getFiltersFromAds(data.ads, searchParams));\n const [page, setPage] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(+searchParams.get('page') || 0);\n const [itemsPerPage, setItemsPerPage] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(+searchParams.get('perpage') || 10);\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n setAds(getAdsListFromFilters(data.ads, filters));\n const filter = decodeURI(composeSearchParamsFromFilters(filters));\n const collectFilters = {};\n filter && (collectFilters.filter = filter);\n gsdevtools && (collectFilters.gsdevtools = gsdevtools);\n page && (collectFilters.page = page);\n itemsPerPage && itemsPerPage != 10 && (collectFilters.perpage = itemsPerPage);\n setSearchParams(collectFilters);\n }, [filters, page, itemsPerPage, gsdevtools]);\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n if (gsdevtools !== \"true\") return;\n window.addEventListener('keydown', e => {\n if (e.defaultPrevented) return;\n if (e.key === \" \") {\n e.preventDefault();\n }\n });\n }, []);\n const getSelectedFilters = () => {\n // returns flat array of selected filters i.e. [\"en\",\"300x400\"] (the input element needs this as a value)\n return filters.flat().filter(filter => filter.selected).map(filter => filter.value);\n };\n const handleChangeFilter = event => {\n // make deep copy of filters state\n let updatedFilters = JSON.parse(JSON.stringify(filters));\n\n // set each filter's selected value based on the value from the event\n updatedFilters.flat().forEach(filter => {\n filter.selected = event.target.value.includes(filter.value);\n });\n setFilters(updatedFilters);\n setPage(0);\n };\n function handleFilterDelete(e, value) {\n let updatedFilters = JSON.parse(JSON.stringify(filters));\n\n // set each filter's selected value based on the value from the event\n updatedFilters.flat().forEach(filter => {\n if (filter.value === value) {\n filter.selected = false;\n }\n });\n setFilters(updatedFilters);\n setPage(0);\n }\n\n // handle button(s)\n\n const handleDownloadZips = event => {\n // console.log(event);\n window.open(\"all.zip\");\n };\n const handleReloadDynamicData = async e => {\n const res = await fetch('reload_dynamic_data');\n if (res.status === 200) location.reload();\n };\n\n // handle pages\n const handleChangePage = (event, newPage) => {\n setPage(newPage);\n };\n const handleChangeRowsPerPage = event => {\n setItemsPerPage(parseInt(event.target.value, 10));\n setPage(0);\n };\n const pageAds = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => {\n return paginate(ads, itemsPerPage, page + 1);\n }, [page, itemsPerPage, ads]);\n\n // toggle devtools\n let GSKeySequence = [];\n document.addEventListener('keydown', event => {\n GSKeySequence.push(event.key);\n if (GSKeySequence.includes('g') && GSKeySequence.includes('s')) {\n setGSDevTools(!gsdevtools);\n window.location.reload();\n }\n });\n document.addEventListener('keyup', event => {\n GSKeySequence = GSKeySequence.filter(key => key !== event.key);\n });\n\n // generate page\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n position: \"sticky\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_5__[\"default\"], {\n className: _Previews_module_scss__WEBPACK_IMPORTED_MODULE_1__[\"default\"].toolbar\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n sx: {\n display: 'flex',\n gap: '10px'\n }\n }, data.isGoogleSpreadsheetBanner ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n title: \"Reload dynamic data\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n onClick: handleReloadDynamicData,\n color: \"inherit\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_icons_material_Cached__WEBPACK_IMPORTED_MODULE_9__[\"default\"], null))) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n title: new Date(data.timestamp).toLocaleString()\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n align: \"left\",\n variant: \"h5\",\n component: \"div\"\n }, \"Preview\"))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_11__[\"default\"], {\n sx: {\n m: 1,\n minWidth: 150,\n maxWidth: \"40%\"\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n id: \"demo-multiple-chip-label\"\n }, \"Filters\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_13__[\"default\"], {\n labelId: \"demo-multiple-chip-label\",\n id: \"demo-multiple-chip\",\n multiple: true,\n value: getSelectedFilters(),\n onChange: handleChangeFilter,\n input: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_14__[\"default\"], {\n id: \"select-multiple-chip\",\n label: \"Filters\"\n }),\n renderValue: selected => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n sx: {\n display: \"flex\",\n flexWrap: \"wrap\",\n gap: 0.5\n }\n }, selected.map(value => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_15__[\"default\"], {\n onDelete: e => handleFilterDelete(e, value),\n key: value,\n label: value,\n deleteIcon: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_icons_material_Cancel__WEBPACK_IMPORTED_MODULE_16__[\"default\"], {\n onMouseDown: event => event.stopPropagation()\n })\n })))\n }, filters.filter(filterGroup => filterGroup.length > 1) // only show filtergroups with more than 1 filter\n .map((filterGroup, filterGroupIndex) => [/*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_17__[\"default\"], null, getLabelFromFilterGroup(filterGroup)), filterGroup.map((filter, filterIndex) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_18__[\"default\"], {\n key: filter.value,\n value: filter.value\n }, filter.value))]))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_19__[\"default\"], {\n labelRowsPerPage: \"Ads per page:\",\n component: \"div\",\n count: ads.length,\n page: ads.length ? page : 0,\n onPageChange: handleChangePage,\n rowsPerPage: itemsPerPage,\n onRowsPerPageChange: handleChangeRowsPerPage\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n onClick: handleDownloadZips,\n color: \"inherit\"\n }, \"Download Zips\"))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n className: _Previews_module_scss__WEBPACK_IMPORTED_MODULE_1__[\"default\"].previews\n }, pageAds.length > 0 && pageAds.map(ad => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_AdPreview__WEBPACK_IMPORTED_MODULE_2__.AdPreview, {\n gsdevtools: gsdevtools,\n key: ad.bundleName,\n ad: ad,\n maxFileSize: ad.maxFileSize,\n timestamp: data.timestamp\n })), pageAds.length < 1 && \"No ads found with the current combination of filters\"));\n}\n\n//# sourceURL=webpack://display-dev-server-preview/./src/components/Previews.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ Previews)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Previews_module_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Previews.module.scss */ \"./src/components/Previews.module.scss\");\n/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-router-dom */ \"./node_modules/react-router-dom/dist/index.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/AppBar/AppBar.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Toolbar/Toolbar.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Box/Box.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Tooltip/Tooltip.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Button/Button.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Typography/Typography.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/FormControl/FormControl.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/InputLabel/InputLabel.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Select/Select.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/OutlinedInput/OutlinedInput.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Chip/Chip.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/ListSubheader/ListSubheader.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/MenuItem/MenuItem.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/TablePagination/TablePagination.js\");\n/* harmony import */ var _mui_icons_material_Cancel__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! @mui/icons-material/Cancel */ \"./node_modules/@mui/icons-material/Cancel.js\");\n/* harmony import */ var _mui_icons_material_Cached__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @mui/icons-material/Cached */ \"./node_modules/@mui/icons-material/Cached.js\");\n/* harmony import */ var _AdPreview__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./AdPreview */ \"./src/components/AdPreview.js\");\n\n\n\n\n\n\n\n\nconst paginate = (array, page_size, page_number) => {\n return array.slice((page_number - 1) * page_size, page_number * page_size);\n};\nconst getFiltersFromAds = (ads, searchParams) => {\n // returns array with all the filtergroup arrays containing all the unique filters\n // it also initially sets the filters based on the searchparams\n let filterGroups = [];\n ads.forEach(ad => {\n const bundleSplits = ad.bundleName.split(\"_\");\n bundleSplits.forEach((bundleSplit, index) => {\n if (!filterGroups[index]) filterGroups[index] = [];\n filterGroups[index].push(bundleSplit);\n });\n });\n filterGroups = filterGroups.map(filterGroup => [...new Set(filterGroup)]); // make them all unique\n\n // get the initial filter(s) from the searchParams ?filter=hk,en;friendsfamily;160x600\n const searchParamsArray = searchParams.get(\"filter\") ? searchParams.get(\"filter\").split(\";\").map(filterGroup => filterGroup.split(\",\")) : [];\n return filterGroups.map(filterGroup => {\n return filterGroup.map(filter => {\n return {\n value: filter,\n selected: searchParamsArray.flat().includes(filter)\n };\n });\n });\n};\nconst composeSearchParamsFromFilters = filters => {\n return filters.map(filterGroup => {\n return filterGroup.filter(filter => filter.selected).map(filter => filter.value).join(\",\");\n }).filter(filterGroup => filterGroup.length > 0).join(\";\");\n};\nconst getAdsListFromFilters = (adsList, filters) => {\n return adsList.filter(ad => {\n // en_friendsfamily_ill_300x250\n return ad.bundleName.split(\"_\").every((bundleSplit, index) => {\n const isFilteringOnGroup = filters[index].filter(filter => filter.selected).length > 0; // if any of the 'selected' keys are true in these objects, it means we're filtering on that group.\n\n if (isFilteringOnGroup) {\n const [filterValue] = filters[index].filter(filter => filter.value === bundleSplit).map(filter => filter.selected);\n return filterValue;\n } else {\n return true; // if we're not filtering on this group, all keys in this group are allowed (because no specific filter is selected in that group)\n }\n });\n });\n};\n\nconst getLabelFromFilterGroup = filterGroup => {\n if (filterGroup.every(filter => filter.value.match(/[0-9]+x[0-9]+/i))) return \"Dimensions\"; // if it matches dimensions, like 300x500 ;\n if (filterGroup.every(filter => filter.value.match(/^[a-z]{2}$/i))) return \"Language\"; // if string is 2 chars long and a-z or A-Z\n return \"Category\";\n};\nfunction Previews({\n data\n}) {\n const [searchParams, setSearchParams] = (0,react_router_dom__WEBPACK_IMPORTED_MODULE_3__.useSearchParams)();\n const [gsdevtools, setGSDevTools] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(searchParams.get('gsdevtools'));\n const [ads, setAds] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([]);\n const [filters, setFilters] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(getFiltersFromAds(data.ads, searchParams));\n const [page, setPage] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(+searchParams.get('page') || 0);\n const [itemsPerPage, setItemsPerPage] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(+searchParams.get('perpage') || 10);\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n setAds(getAdsListFromFilters(data.ads, filters));\n const filter = decodeURI(composeSearchParamsFromFilters(filters));\n const collectFilters = {};\n filter && (collectFilters.filter = filter);\n gsdevtools && (collectFilters.gsdevtools = gsdevtools);\n page && (collectFilters.page = page);\n itemsPerPage && itemsPerPage != 10 && (collectFilters.perpage = itemsPerPage);\n setSearchParams(collectFilters);\n }, [filters, page, itemsPerPage, gsdevtools]);\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n if (gsdevtools !== \"true\") return;\n window.addEventListener('keydown', e => {\n if (e.defaultPrevented) return;\n if (e.key === \" \") {\n e.preventDefault();\n }\n });\n }, []);\n const getSelectedFilters = () => {\n // returns flat array of selected filters i.e. [\"en\",\"300x400\"] (the input element needs this as a value)\n return filters.flat().filter(filter => filter.selected).map(filter => filter.value);\n };\n const handleChangeFilter = event => {\n // make deep copy of filters state\n let updatedFilters = JSON.parse(JSON.stringify(filters));\n\n // set each filter's selected value based on the value from the event\n updatedFilters.flat().forEach(filter => {\n filter.selected = event.target.value.includes(filter.value);\n });\n setFilters(updatedFilters);\n setPage(0);\n };\n function handleFilterDelete(e, value) {\n let updatedFilters = JSON.parse(JSON.stringify(filters));\n\n // set each filter's selected value based on the value from the event\n updatedFilters.flat().forEach(filter => {\n if (filter.value === value) {\n filter.selected = false;\n }\n });\n setFilters(updatedFilters);\n setPage(0);\n }\n\n // handle button(s)\n\n const handleDownloadZips = event => {\n // console.log(event);\n window.open(\"all.zip\");\n };\n const handleReloadDynamicData = async e => {\n const res = await fetch('reload_dynamic_data');\n if (res.status === 200) location.reload();\n };\n\n // handle pages\n const handleChangePage = (event, newPage) => {\n setPage(newPage);\n };\n const handleChangeRowsPerPage = event => {\n setItemsPerPage(parseInt(event.target.value, 10));\n setPage(0);\n };\n const pageAds = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => {\n return paginate(ads, itemsPerPage, page + 1);\n }, [page, itemsPerPage, ads]);\n\n // toggle devtools\n let GSKeySequence = [];\n document.addEventListener('keydown', event => {\n GSKeySequence.push(event.key);\n if (GSKeySequence.includes('g') && GSKeySequence.includes('s')) {\n setGSDevTools(!gsdevtools);\n window.location.reload();\n }\n });\n document.addEventListener('keyup', event => {\n GSKeySequence = GSKeySequence.filter(key => key !== event.key);\n });\n\n // generate page\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n position: \"sticky\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_5__[\"default\"], {\n className: _Previews_module_scss__WEBPACK_IMPORTED_MODULE_1__[\"default\"].toolbar\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n sx: {\n display: 'flex',\n alignItems: 'center'\n }\n }, data.isGoogleSpreadsheetBanner ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n title: \"Reload dynamic data\",\n sx: {\n marginRight: \"10px\"\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n className: \"dynamic-reload\",\n onClick: handleReloadDynamicData,\n color: \"inherit\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_icons_material_Cached__WEBPACK_IMPORTED_MODULE_9__[\"default\"], null))) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n className: \"logos\",\n display: \"flex\",\n gap: \"0px\",\n alignItems: \"center\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"img\", {\n src: \"Monks-Logo_Small_White.png\"\n }), pageAds.length > 0 && pageAds[0].client && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n display: \"flex\",\n gap: \"10px\",\n alignItems: \"center\",\n sx: {\n marginRight: \"10px\"\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"span\", null, \"\\xD7\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"img\", {\n src: pageAds[0].client\n }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n title: new Date(data.timestamp).toLocaleString(),\n sx: {\n marginLeft: \"10px\"\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n align: \"left\",\n variant: \"h5\",\n component: \"div\"\n }, \"Preview\"))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_11__[\"default\"], {\n sx: {\n m: 1,\n minWidth: 150,\n maxWidth: \"40%\"\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n id: \"demo-multiple-chip-label\"\n }, \"Filters\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_13__[\"default\"], {\n labelId: \"demo-multiple-chip-label\",\n id: \"demo-multiple-chip\",\n multiple: true,\n value: getSelectedFilters(),\n onChange: handleChangeFilter,\n input: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_14__[\"default\"], {\n id: \"select-multiple-chip\",\n label: \"Filters\"\n }),\n renderValue: selected => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n sx: {\n display: \"flex\",\n flexWrap: \"wrap\",\n gap: 0.5\n }\n }, selected.map(value => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_15__[\"default\"], {\n onDelete: e => handleFilterDelete(e, value),\n key: value,\n label: value,\n deleteIcon: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_icons_material_Cancel__WEBPACK_IMPORTED_MODULE_16__[\"default\"], {\n onMouseDown: event => event.stopPropagation()\n })\n })))\n }, filters.filter(filterGroup => filterGroup.length > 1) // only show filtergroups with more than 1 filter\n .map((filterGroup, filterGroupIndex) => [/*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_17__[\"default\"], null, getLabelFromFilterGroup(filterGroup)), filterGroup.map((filter, filterIndex) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_18__[\"default\"], {\n key: filter.value,\n value: filter.value\n }, filter.value))]))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_19__[\"default\"], {\n labelRowsPerPage: \"Ads per page:\",\n component: \"div\",\n count: ads.length,\n page: ads.length ? page : 0,\n onPageChange: handleChangePage,\n rowsPerPage: itemsPerPage,\n onRowsPerPageChange: handleChangeRowsPerPage\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n onClick: handleDownloadZips,\n color: \"inherit\"\n }, \"Download Zips\"))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n className: _Previews_module_scss__WEBPACK_IMPORTED_MODULE_1__[\"default\"].previews\n }, pageAds.length > 0 && pageAds.map(ad => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_AdPreview__WEBPACK_IMPORTED_MODULE_2__.AdPreview, {\n gsdevtools: gsdevtools,\n key: ad.bundleName,\n ad: ad,\n maxFileSize: ad.maxFileSize,\n timestamp: data.timestamp\n })), pageAds.length < 1 && \"No ads found with the current combination of filters\"));\n}\n\n//# sourceURL=webpack://display-dev-server-preview/./src/components/Previews.js?"); /***/ }), @@ -3558,7 +3558,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"body {\\n margin: 0;\\n font-family: -apple-system, BlinkMacSystemFont, \\\"Segoe UI\\\", \\\"Roboto\\\", \\\"Oxygen\\\", \\\"Ubuntu\\\", \\\"Cantarell\\\", \\\"Fira Sans\\\", \\\"Droid Sans\\\", \\\"Helvetica Neue\\\", sans-serif;\\n -webkit-font-smoothing: antialiased;\\n -moz-osx-font-smoothing: grayscale;\\n background-color: #0d1117;\\n}\\n\\ncode {\\n font-family: source-code-pro, Menlo, Monaco, Consolas, \\\"Courier New\\\", monospace;\\n}\\n\\n.card {\\n container-type: inline-size;\\n}\\n\\n@container (min-width: 360px) {\\n .chips {\\n position: relative;\\n justify-content: unset !important;\\n }\\n .chips .quality {\\n position: absolute;\\n right: 0;\\n }\\n}\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://display-dev-server-preview/./src/index.css?./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"body {\\n margin: 0;\\n font-family: -apple-system, BlinkMacSystemFont, \\\"Segoe UI\\\", \\\"Roboto\\\", \\\"Oxygen\\\", \\\"Ubuntu\\\", \\\"Cantarell\\\", \\\"Fira Sans\\\", \\\"Droid Sans\\\", \\\"Helvetica Neue\\\", sans-serif;\\n -webkit-font-smoothing: antialiased;\\n -moz-osx-font-smoothing: grayscale;\\n background-color: #0d1117;\\n}\\n\\ncode {\\n font-family: source-code-pro, Menlo, Monaco, Consolas, \\\"Courier New\\\", monospace;\\n}\\n\\n.card {\\n container-type: inline-size;\\n}\\n\\n@container (min-width: 360px) {\\n .chips {\\n position: relative;\\n justify-content: unset !important;\\n }\\n .chips .quality {\\n position: absolute;\\n right: 0;\\n }\\n}\\n.logos img {\\n height: 30px;\\n}\\n\\n.logos span {\\n height: 36px;\\n line-height: 36px;\\n}\\n\\n.dynamic-reload {\\n height: 36px !important;\\n min-width: auto !important;\\n aspect-ratio: 1/1 !important;\\n}\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://display-dev-server-preview/./src/index.css?./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js"); /***/ }), diff --git a/src/preview/public/Favicon_black_32X32.png b/src/preview/public/Favicon_black_32X32.png new file mode 100644 index 0000000000000000000000000000000000000000..632f80d6e95ae4c01197b7d8415a7432ce8ff9dd GIT binary patch literal 452 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 literal 0 HcmV?d00001 diff --git a/src/preview/public/index.html b/src/preview/public/index.html index 423daea..cadd487 100644 --- a/src/preview/public/index.html +++ b/src/preview/public/index.html @@ -2,7 +2,7 @@ - + diff --git a/src/preview/src/components/Previews.js b/src/preview/src/components/Previews.js index 2ab771f..29c1dac 100644 --- a/src/preview/src/components/Previews.js +++ b/src/preview/src/components/Previews.js @@ -192,17 +192,27 @@ export default function Previews({ data }) { <> - + { data.isGoogleSpreadsheetBanner - ? - : <> } - + + + { + (pageAds.length > 0 && pageAds[0].client) && + + × + + + } + + Preview diff --git a/src/preview/src/index.css b/src/preview/src/index.css index 08e373f..c0b8d2f 100644 --- a/src/preview/src/index.css +++ b/src/preview/src/index.css @@ -29,3 +29,18 @@ code { } } } + +.logos img { + height: 30px; +} + +.logos span { + height: 36px; + line-height: 36px; +} + +.dynamic-reload { + height: 36px !important; + min-width: auto !important; + aspect-ratio: 1 / 1 !important; +} diff --git a/src/webpack/buildPreview.js b/src/webpack/buildPreview.js index 0fab258..7df729d 100644 --- a/src/webpack/buildPreview.js +++ b/src/webpack/buildPreview.js @@ -115,6 +115,9 @@ module.exports = async function buildPreview(result, qualities, outputDir) { }, info: (result && result[bundleName]) ? result[bundleName].settings.data.settings.info + : undefined, + client: (result && result[bundleName]) + ? result[bundleName].settings.data.settings.client : undefined } }) diff --git a/src/webpack/devServer.js b/src/webpack/devServer.js index ba9d810..70b0ef0 100644 --- a/src/webpack/devServer.js +++ b/src/webpack/devServer.js @@ -100,7 +100,8 @@ ${chalk.grey.bold('-------------------------------------------------------')} url, }, }, - info: e.data.settings.info + info: e.data.settings.info, + client: e.data.settings.client, } }) }) diff --git a/src/webpack/devServerParallel.js b/src/webpack/devServerParallel.js index 4fa6dde..c57b2e7 100644 --- a/src/webpack/devServerParallel.js +++ b/src/webpack/devServerParallel.js @@ -114,7 +114,8 @@ ${chalk.grey.bold('-------------------------------------------------------')} url, }, }, - info: e.data.settings.info + info: e.data.settings.info, + client: e.data.settings.client, } }) })