From 13bf57211f4378ca1ca45f7f0d662f911a9fd25f Mon Sep 17 00:00:00 2001 From: rgravitvl Date: Thu, 26 Oct 2023 19:01:23 +0530 Subject: [PATCH 01/52] Updated for product detail page --- scripts/scripts.js | 1 + templates/product/product.js | 38 ++++++++++++++++++++++++++++++++++++ 2 files changed, 39 insertions(+) create mode 100644 templates/product/product.js diff --git a/scripts/scripts.js b/scripts/scripts.js index 5da2bbe93..7322c3e30 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -22,6 +22,7 @@ const LCP_BLOCKS = ['breadcrumb']; // add your LCP blocks to the list const TEMPLATE_LIST = { blog: 'blog', news: 'blog', + 'product-family': 'product', }; /** diff --git a/templates/product/product.js b/templates/product/product.js new file mode 100644 index 000000000..2f34e0803 --- /dev/null +++ b/templates/product/product.js @@ -0,0 +1,38 @@ +function getCoveoApiPayload() { + const sku = window.location.pathname.split('/')?.slice(-1).at(0).split('.').at(0); + const paylod = { + context: { + host: 'stage.lifesciences.danaher.com', + internal: false + }, + q: `@familyid==${sku}`, + pipeline: 'Product Details', + } + return paylod; +} + +async function makeCoveoApiRequest(path, payload = {}) { + const accessToken = window.DanaherConfig !== undefined + ? window.DanaherConfig.familyProductKey + : 'xx2a2e7271-78c3-4e3b-bac3-2fcbab75323b'; + const organizationId = window.DanaherConfig !== undefined + ? window.DanaherConfig.searchOrg + : 'danahernonproduction1892f3fhz'; + const resp = await fetch(`https://${organizationId}.org.coveo.com${path}?organizationId=${organizationId}`, { + method: 'POST', + headers: { + authorization: `Bearer ${accessToken}`, + 'content-type': 'application/json', + }, + body: JSON.stringify(payload), + }); + const jsonData = await resp.json(); + return jsonData; + } + +export default async function buildAutoBlocks() { + const main = document.querySelector('main'); + makeCoveoApiRequest('/rest/search/v2', getCoveoApiPayload()).then((data) => { + console.log(data); + }) +} \ No newline at end of file From a49cfafc62b7bf50bf304ba11093cac7bf5c66dd Mon Sep 17 00:00:00 2001 From: wz914876 Date: Tue, 19 Dec 2023 19:15:04 +0530 Subject: [PATCH 02/52] initial commit --- blocks/header/header.js | 2 +- styles/styles.css | 16 ++++++++++++++++ styles/tailwind.css | 4 ++++ 3 files changed, 21 insertions(+), 1 deletion(-) diff --git a/blocks/header/header.js b/blocks/header/header.js index 82f354b79..918b78c2c 100644 --- a/blocks/header/header.js +++ b/blocks/header/header.js @@ -642,7 +642,7 @@ function buildFlyoutMenus(headerBlock) { { class: 'inline-flex justify-between items-center mb-2' }, span({ class: 'text-left text-xl font-bold py-2 pl-1 text-gray-900 w-1/2' }, menuTitle), menuItemEl.querySelector(':scope > p > a') - ? a({ class: 'btn btn-info', href: menuItemEl.querySelector(':scope > p > a').href }, 'Explore All') : '', + ? a({ class: 'btn btn-info rounded-full', href: menuItemEl.querySelector(':scope > p > a').href }, 'Explore All') : '', ), linkList, ), diff --git a/styles/styles.css b/styles/styles.css index d3443c236..69483a24e 100644 --- a/styles/styles.css +++ b/styles/styles.css @@ -2169,6 +2169,22 @@ main .section.carousel-container { color: rgb(255 255 255 / var(--tw-text-opacity)); } +.btn-info { + --tw-border-opacity: 1; + border-color: rgb(59 199 229 / var(--tw-border-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(59 199 229 / var(--tw-bg-opacity)); + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); +} + +.btn-info:hover { + --tw-border-opacity: 1; + border-color: rgb(1 139 157 / var(--tw-border-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(1 139 157 / var(--tw-bg-opacity)); +} + .sticky-footer { position: fixed; bottom: 0.75rem; diff --git a/styles/tailwind.css b/styles/tailwind.css index 20ab1ebde..60dfe871f 100644 --- a/styles/tailwind.css +++ b/styles/tailwind.css @@ -166,6 +166,10 @@ @apply text-danaherpurple-500 bg-white border-2 border-danaherpurple-500 hover:text-white hover:bg-danaherpurple-500; } + .btn-info { + @apply text-white bg-lightblue-500 hover:bg-lightblue-600 border-lightblue-500 hover:border-lightblue-600; + } + .form-input, .form-select, .form-date { From 95b92fda06e20105f1960f544988f13e57dfa4a7 Mon Sep 17 00:00:00 2001 From: Markus Haack Date: Wed, 20 Dec 2023 13:43:46 +0100 Subject: [PATCH 03/52] feat: add support for folders and product metadata --- fstab.yaml | 6 ++++++ paths.yaml | 1 + 2 files changed, 7 insertions(+) diff --git a/fstab.yaml b/fstab.yaml index b2b9b9a4a..bb13db392 100644 --- a/fstab.yaml +++ b/fstab.yaml @@ -3,3 +3,9 @@ mountpoints: url: https://1050314-569danaherxwalk-stage.adobeioruntime.net/api/v1/web/convert/main/ type: markup suffix: ".html?wcmmode=disabled" + +folders: + /us/en/products/family/: /us/en/products/product-coveo + /us/en/products/sku/: /us/en/products/product-coveo + /us/en/products/bundles/: /us/en/products/product-coveo + \ No newline at end of file diff --git a/paths.yaml b/paths.yaml index ca1df4555..8db3067fa 100644 --- a/paths.yaml +++ b/paths.yaml @@ -5,6 +5,7 @@ mappings: - /content/dam/danaher/franklin/config.json:/.helix/config.json - /content/dam/danaher/franklin/headers.json:/.helix/headers.json - /content/dam/danaher/franklin/metadata.json:/metadata.json + - /content/dam/danaher/franklin/metadata-products.json:/metadata-products.json - /content/dam/danaher/franklin/redirects.json:/redirects.json includes: From 3e80abdd2a4a5cba0d46c058766aabcdc2d37457 Mon Sep 17 00:00:00 2001 From: rgravitvl Date: Wed, 20 Dec 2023 22:45:50 +0530 Subject: [PATCH 04/52] updated converter for product overview --- tools/importer/transformers/columns.js | 73 +++++++++++-------- .../transformers/fullLayoutSection.js | 2 +- tools/importer/transformers/index.js | 2 + tools/importer/transformers/productMenu.js | 5 ++ tools/importer/transformers/util.js | 22 +++++- 5 files changed, 70 insertions(+), 34 deletions(-) create mode 100644 tools/importer/transformers/productMenu.js diff --git a/tools/importer/transformers/columns.js b/tools/importer/transformers/columns.js index 590d15603..372538aca 100644 --- a/tools/importer/transformers/columns.js +++ b/tools/importer/transformers/columns.js @@ -1,8 +1,8 @@ import { - featureImage, imageText, getHeading, getAEMHeading, + featureImage, imageText, getHeading, + getAEMHeading, videoembed, getFutureSectionCard } from './util.js'; /* global WebImporter */ - const render = { featureimage: (item, row, document) => { const featureImages = (item.content) ? item.content.querySelectorAll('div.featureimage') : [item]; @@ -30,27 +30,59 @@ const render = { heading: (item, row, document) => { const heading = item.content ? item.content.querySelector('div.heading') : item; if (heading) { - const headingEL = getHeading(heading, document); - row.push(headingEL); + getHeading(heading, document); + row.push(heading); } }, 'heading-aem': (item, row, document) => { const aemHeading = (item.content) ? item.content.querySelector('div.heading-aem') : item; if (aemHeading) { - const aemHeadingEL = getAEMHeading(aemHeading, document); - row.push(aemHeadingEL); + getAEMHeading(aemHeading, document); + row.push(aemHeading); + } + }, + + 'featuresection-card': (item, row, document) => { + const featureSectionCardEl = (item.content) ? item.content.querySelector('div.featuresection-card') : item; + if (featureSectionCardEl) { + getFutureSectionCard(featureSectionCardEl, document) + row.push(featureSectionCardEl); } }, - script: (template, row) => { - const featureImageEl = template.content.querySelector('div.featureimage'); + script: (item, row) => { + const featureImageEl = item.content.querySelector('div.featureimage'); if (featureImageEl) { row.push(featureImageEl); } }, + + text: (item, row) => { + const text = item.content.querySelector('div.text'); + if (text) row.push(text); + }, + + video: (item, row, document) => { + const videoEl = item.content ? item.content.querySelector('div.video') : item; + videoembed(videoEl, document) + row.push(videoEl); + }, }; +const updateBlockName = (blockName, option) => { + const match = blockName.match(/Columns\s*\(\s*([^)]*)\s*\)/); + if (match) { + const contentInsideParentheses = match[1]; + const updatedString = `Columns (${contentInsideParentheses}, ${option})`; + blockName = updatedString; + } else { + const updatedString = `Columns (${option})`; + blockName = updatedString; + } + return blockName; +} + const createAllColumns = (allColumns, document, noOfColumn) => { allColumns.forEach((item) => { const columns = []; @@ -60,7 +92,7 @@ const createAllColumns = (allColumns, document, noOfColumn) => { else blockName = 'Columns (itemscenter)'; } else if (noOfColumn === 3) blockName = 'Columns (cols-3)'; else blockName = 'Columns'; - + const templates = item.querySelectorAll('template'); [...templates].forEach((template) => { if (template.content.children.length > 0) { @@ -69,28 +101,11 @@ const createAllColumns = (allColumns, document, noOfColumn) => { if (element.className === 'container responsivegrid') { const container = template.content.querySelector('div.cmp-container'); if (container) { - const match = blockName.match(/Columns\s*\(\s*([^)]*)\s*\)/); - if (match) { - const contentInsideParentheses = match[1]; - const updatedString = `Columns (${contentInsideParentheses}, ${container.id})`; - blockName = updatedString; - } else { - const updatedString = `Columns (${container.id})`; - blockName = updatedString; - } + blockName = updateBlockName(blockName, container.id); [...container.children].forEach((childItem) => { render[childItem.className](childItem, row, document); }); } - } else if (element.className === 'script') { - const featureImageElem = template.content.querySelector('div.featureimage'); - - if (featureImageElem) { - row.push(featureImageElem); - } - } else if (element.className === 'text') { - const text = template.content.querySelector('div.text'); - if (text) row.push(text); } else if (element.className !== 'articlecard') { render[element.className](template, row, document); } @@ -100,9 +115,9 @@ const createAllColumns = (allColumns, document, noOfColumn) => { }); const cells = [ [blockName], - [...columns], + columns, ]; - + if (columns.flat(1).length > 0) { const block = WebImporter.DOMUtils.createTable(cells, document); item.append(block); diff --git a/tools/importer/transformers/fullLayoutSection.js b/tools/importer/transformers/fullLayoutSection.js index c6a895eef..70ab19a97 100644 --- a/tools/importer/transformers/fullLayoutSection.js +++ b/tools/importer/transformers/fullLayoutSection.js @@ -10,7 +10,7 @@ const createFullLayoutSection = (main, document) => { const table = WebImporter.DOMUtils.createTable(cells, document); e.after(table); if ((arr.length === 1 || i < arr.length - 1) - && !e.parentNode.nextElementSibling.className.includes('carousel')) { + && !e.parentNode.nextElementSibling?.className.includes('carousel')) { table.after(document.createElement('hr')); } styleIndex += 1; diff --git a/tools/importer/transformers/index.js b/tools/importer/transformers/index.js index b8441d07b..afdadade7 100644 --- a/tools/importer/transformers/index.js +++ b/tools/importer/transformers/index.js @@ -37,6 +37,7 @@ import productCategoryList from './productCategoryList.js'; import opcoHomeArticlesList from './opcoHomeArticlesList.js'; import socialFeeds from './socialFeeds.js'; import postProcessSVGIcons from './postProcessSVGIcons.js'; +import productMenu from './productMenu.js'; // eslint-disable-next-line import/prefer-default-export export const transformers = [ @@ -74,6 +75,7 @@ export const transformers = [ productCategoryList, opcoHomeArticlesList, socialFeeds, + productMenu ]; export const xfTransformers = [ diff --git a/tools/importer/transformers/productMenu.js b/tools/importer/transformers/productMenu.js new file mode 100644 index 000000000..53ba2325c --- /dev/null +++ b/tools/importer/transformers/productMenu.js @@ -0,0 +1,5 @@ +const createProductMenu = (main, document) => { + const productMenu = main.querySelector('div.product-menu'); + console.log(productMenu.outerHTML); +}; +export default createProductMenu; diff --git a/tools/importer/transformers/util.js b/tools/importer/transformers/util.js index 5de6c1bd0..5c970ee2e 100644 --- a/tools/importer/transformers/util.js +++ b/tools/importer/transformers/util.js @@ -45,6 +45,22 @@ const cleanUpHTML = (html) => { return html; }; +export const getFutureSectionCard = (featureSectionCardDiv, document) => { + const featureSectionCardEL = featureSectionCardDiv?.querySelector('featuresection-card'); + const title = featureSectionCardEL?.getAttribute('title') + const description = featureSectionCardEL?.getAttribute('description') + const image = featureSectionCardEL?.getAttribute('card-image') + const titleDivEl = document.createElement('div'); + titleDivEl.textContent = title; + featureSectionCardDiv.append(titleDivEl) + const pEl = document.createElement('p'); + pEl.textContent = description; + featureSectionCardDiv.append(pEl) + const imgEl = document.createElement('img'); + imgEl.src = image; + featureSectionCardDiv.append(imgEl) +}; + export const mapTable = (table, document) => { let tHead = table.querySelector('thead'); if (!tHead) { @@ -64,15 +80,14 @@ export const getHeading = (heading, document) => { if (heading.nextElementSibling && [...heading.nextElementSibling.classList].includes('featureimage')) { const text = document.createElement('strong'); text.textContent = headingEL?.getAttribute('heading'); - headingEL.append(text); + heading.append(text); } else { const hTag = headingEL?.getAttribute('headingtag') ? headingEL?.getAttribute('headingtag') : 'h2'; const headEl = document.createElement(hTag); headEl.textContent = headingEL?.getAttribute('heading'); - headingEL.append(headEl); + heading.append(headEl); } } - return headingEL; }; export const getAEMHeading = (aemHeading, document) => { @@ -84,7 +99,6 @@ export const getAEMHeading = (aemHeading, document) => { } else { aemHeading.append(aemHeading.firstElementChild); } - return aemHeading; }; export const featureImage = (featureImg, document) => { From 6d73273be387429ed5e025141cde19d8028b574e Mon Sep 17 00:00:00 2001 From: rgravitvl Date: Thu, 21 Dec 2023 15:26:45 +0530 Subject: [PATCH 05/52] updated product converter --- .../test/fixtures/product-converted.html | 30 ++------ tools/importer/transformers/columns.js | 71 +------------------ tools/importer/transformers/product.js | 47 ++++++++---- tools/importer/transformers/productMenu.js | 2 +- tools/importer/transformers/util.js | 67 +++++++++++++++++ 5 files changed, 107 insertions(+), 110 deletions(-) diff --git a/tools/actions/convert/test/fixtures/product-converted.html b/tools/actions/convert/test/fixtures/product-converted.html index 640bb1fdc..0f079ce78 100644 --- a/tools/actions/convert/test/fixtures/product-converted.html +++ b/tools/actions/convert/test/fixtures/product-converted.html @@ -26,13 +26,9 @@

-
icon
+
tabIcon
/content/dam/danaher/system/icons/Bookmark.svg
-
-
tabId
-
overview
-
tabName
Overview
@@ -50,13 +46,9 @@

-
icon
+
tabIcon
/content/dam/danaher/system/icons/Chart bar.svg
-
-
tabId
-
specification
-
tabName
Specifications
@@ -65,13 +57,9 @@
-
icon
+
tabIcon
/content/dam/danaher/system/icons/Cube.svg
-
-
tabId
-
products
-
tabName
Products
@@ -81,13 +69,9 @@

Resource page from Coveo atomic template

-
icon
+
tabIcon
/content/dam/danaher/system/icons/Collection.svg
-
-
tabId
-
resources
-
tabName
Resources
@@ -99,13 +83,9 @@

-
icon
+
tabIcon
/content/dam/danaher/system/icons/Clipboard list.svg
-
-
tabId
-
citations
-
tabName
Citations
diff --git a/tools/importer/transformers/columns.js b/tools/importer/transformers/columns.js index 372538aca..c06473220 100644 --- a/tools/importer/transformers/columns.js +++ b/tools/importer/transformers/columns.js @@ -1,74 +1,5 @@ -import { - featureImage, imageText, getHeading, - getAEMHeading, videoembed, getFutureSectionCard -} from './util.js'; +import { render } from './util.js'; /* global WebImporter */ -const render = { - featureimage: (item, row, document) => { - const featureImages = (item.content) ? item.content.querySelectorAll('div.featureimage') : [item]; - featureImages.forEach((featureImageEL) => { - if (featureImageEL?.firstElementChild?.localName === 'feature-image') { - featureImage(featureImageEL, document); - WebImporter.DOMUtils.remove(featureImageEL, ['feature-image']); - } - if (featureImageEL) { - row.push(featureImageEL); - } - }); - return row; - }, - - imagetext: (item, row, document) => { - const imageTextEl = item.content - ? imageText(item.content, document) - : imageText(item, document); - if (imageTextEl) { - row.push(imageTextEl); - } - }, - - heading: (item, row, document) => { - const heading = item.content ? item.content.querySelector('div.heading') : item; - if (heading) { - getHeading(heading, document); - row.push(heading); - } - }, - - 'heading-aem': (item, row, document) => { - const aemHeading = (item.content) ? item.content.querySelector('div.heading-aem') : item; - if (aemHeading) { - getAEMHeading(aemHeading, document); - row.push(aemHeading); - } - }, - - 'featuresection-card': (item, row, document) => { - const featureSectionCardEl = (item.content) ? item.content.querySelector('div.featuresection-card') : item; - if (featureSectionCardEl) { - getFutureSectionCard(featureSectionCardEl, document) - row.push(featureSectionCardEl); - } - }, - - script: (item, row) => { - const featureImageEl = item.content.querySelector('div.featureimage'); - if (featureImageEl) { - row.push(featureImageEl); - } - }, - - text: (item, row) => { - const text = item.content.querySelector('div.text'); - if (text) row.push(text); - }, - - video: (item, row, document) => { - const videoEl = item.content ? item.content.querySelector('div.video') : item; - videoembed(videoEl, document) - row.push(videoEl); - }, -}; const updateBlockName = (blockName, option) => { const match = blockName.match(/Columns\s*\(\s*([^)]*)\s*\)/); diff --git a/tools/importer/transformers/product.js b/tools/importer/transformers/product.js index b0d443a05..5404e0054 100644 --- a/tools/importer/transformers/product.js +++ b/tools/importer/transformers/product.js @@ -1,7 +1,31 @@ import { - featureImage, imageText, appendText, productcitations, + featureImage, imageText, appendText, productcitations, getHeading } from './util.js'; /* global WebImporter */ + +const render = (main, element, document) => { + switch (element.className) { + case 'imagetext': + main.append(imageText(element, document)); + break; + case 'heading': { + getHeading(element, document) + main.append(element); + break; + } + case 'text': + main.append(appendText(element)); + break; + case 'product-citations': + main.append(productcitations(element)); + break; + default: { + featureImage(element, document) + main.append(element); + } + } +} + const createProductPage = (main, document) => { const product = main.querySelector('product-page'); if (product) { @@ -18,7 +42,7 @@ const createProductPage = (main, document) => { const tabs = JSON.parse(product.getAttribute('producttabs')); tabs.forEach((tab, i, arr) => { - const sectionCells = [['Section Metadata'], ['icon', tab.icon], ['tabId', tab.tabId], ['tabName', tab.tabName]]; + const sectionCells = [['Section Metadata'], ['tabIcon', tab.icon], ['tabName', tab.tabName]]; const attributeCells = []; const template = product.querySelector(`template[v-slot:${tab.tabId}]`); @@ -36,18 +60,13 @@ const createProductPage = (main, document) => { const elementsArray = Array.from(template.content.childNodes); elementsArray.forEach((element) => { if (element.outerHTML) { - switch (element.className) { - case 'imagetext': - main.append(imageText(element, document)); - break; - case 'text': - main.append(appendText(element)); - break; - case 'product-citations': - main.append(productcitations(element)); - break; - default: - main.append(featureImage(element, document)); + if(element.className === 'container-fullwidth'){ + const childArray = Array.from(element.querySelector('fulllayout > div > div > div').children); + childArray.forEach((item) => { + render(main, item, document); + }); + }else { + render(main, element, document); } } }); diff --git a/tools/importer/transformers/productMenu.js b/tools/importer/transformers/productMenu.js index 53ba2325c..5502c3e9d 100644 --- a/tools/importer/transformers/productMenu.js +++ b/tools/importer/transformers/productMenu.js @@ -1,5 +1,5 @@ const createProductMenu = (main, document) => { const productMenu = main.querySelector('div.product-menu'); - console.log(productMenu.outerHTML); + //console.log(productMenu.outerHTML); }; export default createProductMenu; diff --git a/tools/importer/transformers/util.js b/tools/importer/transformers/util.js index 5c970ee2e..75c8c307e 100644 --- a/tools/importer/transformers/util.js +++ b/tools/importer/transformers/util.js @@ -201,3 +201,70 @@ export const testimonial = (testimonialElement, document) => { const table = WebImporter.DOMUtils.createTable(block, document); testimonialEl.replaceWith(table); }; + +export const render = { + featureimage: (item, row, document) => { + const featureImages = (item.content) ? item.content.querySelectorAll('div.featureimage') : [item]; + featureImages.forEach((featureImageEL) => { + if (featureImageEL?.firstElementChild?.localName === 'feature-image') { + featureImage(featureImageEL, document); + WebImporter.DOMUtils.remove(featureImageEL, ['feature-image']); + } + if (featureImageEL) { + row.push(featureImageEL); + } + }); + return row; + }, + + imagetext: (item, row, document) => { + const imageTextEl = item.content + ? imageText(item.content, document) + : imageText(item, document); + if (imageTextEl) { + row.push(imageTextEl); + } + }, + + heading: (item, row, document) => { + const heading = item.content ? item.content.querySelector('div.heading') : item; + if (heading) { + getHeading(heading, document); + row.push(heading); + } + }, + + 'heading-aem': (item, row, document) => { + const aemHeading = (item.content) ? item.content.querySelector('div.heading-aem') : item; + if (aemHeading) { + getAEMHeading(aemHeading, document); + row.push(aemHeading); + } + }, + + 'featuresection-card': (item, row, document) => { + const featureSectionCardEl = (item.content) ? item.content.querySelector('div.featuresection-card') : item; + if (featureSectionCardEl) { + getFutureSectionCard(featureSectionCardEl, document) + row.push(featureSectionCardEl); + } + }, + + script: (item, row) => { + const featureImageEl = item.content.querySelector('div.featureimage'); + if (featureImageEl) { + row.push(featureImageEl); + } + }, + + text: (item, row) => { + const text = item.content.querySelector('div.text'); + if (text) row.push(text); + }, + + video: (item, row, document) => { + const videoEl = item.content ? item.content.querySelector('div.video') : item; + videoembed(videoEl, document) + row.push(videoEl); + }, +}; From 0c97ae8ebecb1914afdcd9e0bb31ed0f9aa9e57b Mon Sep 17 00:00:00 2001 From: rgravitvl Date: Thu, 21 Dec 2023 18:04:16 +0530 Subject: [PATCH 06/52] fixed lint issues --- tools/importer/transformers/columns.js | 13 +++++++------ tools/importer/transformers/index.js | 2 +- tools/importer/transformers/product.js | 14 +++++++------- tools/importer/transformers/productMenu.js | 6 +++--- tools/importer/transformers/util.js | 16 ++++++++-------- 5 files changed, 26 insertions(+), 25 deletions(-) diff --git a/tools/importer/transformers/columns.js b/tools/importer/transformers/columns.js index c06473220..54d19deb0 100644 --- a/tools/importer/transformers/columns.js +++ b/tools/importer/transformers/columns.js @@ -3,16 +3,17 @@ import { render } from './util.js'; const updateBlockName = (blockName, option) => { const match = blockName.match(/Columns\s*\(\s*([^)]*)\s*\)/); + let bName; if (match) { const contentInsideParentheses = match[1]; const updatedString = `Columns (${contentInsideParentheses}, ${option})`; - blockName = updatedString; + bName = updatedString; } else { const updatedString = `Columns (${option})`; - blockName = updatedString; + bName = updatedString; } - return blockName; -} + return bName; +}; const createAllColumns = (allColumns, document, noOfColumn) => { allColumns.forEach((item) => { @@ -23,7 +24,7 @@ const createAllColumns = (allColumns, document, noOfColumn) => { else blockName = 'Columns (itemscenter)'; } else if (noOfColumn === 3) blockName = 'Columns (cols-3)'; else blockName = 'Columns'; - + const templates = item.querySelectorAll('template'); [...templates].forEach((template) => { if (template.content.children.length > 0) { @@ -48,7 +49,7 @@ const createAllColumns = (allColumns, document, noOfColumn) => { [blockName], columns, ]; - + if (columns.flat(1).length > 0) { const block = WebImporter.DOMUtils.createTable(cells, document); item.append(block); diff --git a/tools/importer/transformers/index.js b/tools/importer/transformers/index.js index afdadade7..f61090994 100644 --- a/tools/importer/transformers/index.js +++ b/tools/importer/transformers/index.js @@ -75,7 +75,7 @@ export const transformers = [ productCategoryList, opcoHomeArticlesList, socialFeeds, - productMenu + productMenu, ]; export const xfTransformers = [ diff --git a/tools/importer/transformers/product.js b/tools/importer/transformers/product.js index 5404e0054..97e6804a6 100644 --- a/tools/importer/transformers/product.js +++ b/tools/importer/transformers/product.js @@ -1,5 +1,5 @@ import { - featureImage, imageText, appendText, productcitations, getHeading + featureImage, imageText, appendText, productcitations, getHeading, } from './util.js'; /* global WebImporter */ @@ -9,7 +9,7 @@ const render = (main, element, document) => { main.append(imageText(element, document)); break; case 'heading': { - getHeading(element, document) + getHeading(element, document); main.append(element); break; } @@ -20,11 +20,11 @@ const render = (main, element, document) => { main.append(productcitations(element)); break; default: { - featureImage(element, document) + featureImage(element, document); main.append(element); } } -} +}; const createProductPage = (main, document) => { const product = main.querySelector('product-page'); @@ -60,13 +60,13 @@ const createProductPage = (main, document) => { const elementsArray = Array.from(template.content.childNodes); elementsArray.forEach((element) => { if (element.outerHTML) { - if(element.className === 'container-fullwidth'){ + if (element.className === 'container-fullwidth') { const childArray = Array.from(element.querySelector('fulllayout > div > div > div').children); childArray.forEach((item) => { render(main, item, document); }); - }else { - render(main, element, document); + } else { + render(main, element, document); } } }); diff --git a/tools/importer/transformers/productMenu.js b/tools/importer/transformers/productMenu.js index 5502c3e9d..67baf425b 100644 --- a/tools/importer/transformers/productMenu.js +++ b/tools/importer/transformers/productMenu.js @@ -1,5 +1,5 @@ -const createProductMenu = (main, document) => { - const productMenu = main.querySelector('div.product-menu'); - //console.log(productMenu.outerHTML); +const createProductMenu = () => { + // const productMenu = main.querySelector('div.product-menu'); + }; export default createProductMenu; diff --git a/tools/importer/transformers/util.js b/tools/importer/transformers/util.js index 75c8c307e..b8914ff1f 100644 --- a/tools/importer/transformers/util.js +++ b/tools/importer/transformers/util.js @@ -47,18 +47,18 @@ const cleanUpHTML = (html) => { export const getFutureSectionCard = (featureSectionCardDiv, document) => { const featureSectionCardEL = featureSectionCardDiv?.querySelector('featuresection-card'); - const title = featureSectionCardEL?.getAttribute('title') - const description = featureSectionCardEL?.getAttribute('description') - const image = featureSectionCardEL?.getAttribute('card-image') + const title = featureSectionCardEL?.getAttribute('title'); + const description = featureSectionCardEL?.getAttribute('description'); + const image = featureSectionCardEL?.getAttribute('card-image'); const titleDivEl = document.createElement('div'); titleDivEl.textContent = title; - featureSectionCardDiv.append(titleDivEl) + featureSectionCardDiv.append(titleDivEl); const pEl = document.createElement('p'); pEl.textContent = description; - featureSectionCardDiv.append(pEl) + featureSectionCardDiv.append(pEl); const imgEl = document.createElement('img'); imgEl.src = image; - featureSectionCardDiv.append(imgEl) + featureSectionCardDiv.append(imgEl); }; export const mapTable = (table, document) => { @@ -245,7 +245,7 @@ export const render = { 'featuresection-card': (item, row, document) => { const featureSectionCardEl = (item.content) ? item.content.querySelector('div.featuresection-card') : item; if (featureSectionCardEl) { - getFutureSectionCard(featureSectionCardEl, document) + getFutureSectionCard(featureSectionCardEl, document); row.push(featureSectionCardEl); } }, @@ -264,7 +264,7 @@ export const render = { video: (item, row, document) => { const videoEl = item.content ? item.content.querySelector('div.video') : item; - videoembed(videoEl, document) + videoembed(videoEl, document); row.push(videoEl); }, }; From ca93fe146cd13f5879bee9c6623a3651dc7353e9 Mon Sep 17 00:00:00 2001 From: rgravitvl Date: Fri, 22 Dec 2023 11:06:51 +0530 Subject: [PATCH 07/52] added more tests --- .../test/fixtures/product-home-converted.html | 204 +++ .../convert/test/fixtures/product-home.html | 1135 +++++++++++++ .../test/fixtures/product1-converted.html | 224 ++- .../convert/test/fixtures/product1.html | 1132 +++++++++---- .../test/fixtures/product2-converted.html | 273 +++ .../convert/test/fixtures/product2.html | 1398 +++++++++++++++ .../test/fixtures/product3-converted.html | 219 +++ .../convert/test/fixtures/product3.html | 1506 +++++++++++++++++ 8 files changed, 5680 insertions(+), 411 deletions(-) create mode 100644 tools/actions/convert/test/fixtures/product-home-converted.html create mode 100644 tools/actions/convert/test/fixtures/product-home.html create mode 100644 tools/actions/convert/test/fixtures/product2-converted.html create mode 100644 tools/actions/convert/test/fixtures/product2.html create mode 100644 tools/actions/convert/test/fixtures/product3-converted.html create mode 100644 tools/actions/convert/test/fixtures/product3.html diff --git a/tools/actions/convert/test/fixtures/product-home-converted.html b/tools/actions/convert/test/fixtures/product-home-converted.html new file mode 100644 index 000000000..0d7d96ca9 --- /dev/null +++ b/tools/actions/convert/test/fixtures/product-home-converted.html @@ -0,0 +1,204 @@ + + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+

Just One Heading

+
+
+ closeup +
+
+
+
+

We see a way to identify high producing cell lines in 15 minutes

+

Talk to an Expert

+
+
+ futuristic +
+
+
+
+

We see a way to access multidimensional data in minutes instead of weeks

+

The Intabio ZT system couples icIEF separation and UV detection with high resolution mass spectrometry on the ZenoTOF 7600 system.

+

Request a Quote

+
+
+ group-of-people +
+
+
+
+

This is a tab with just the hero image

+

Button to Blogs

+
+
+ hero +
+
+
+
Square image without title
+
+ dave +
+
+
+
+

Categories

+
+
+
+
+
+
+
+
:dam-User:
+
+

Talk to an Expert

+

Schedule a call today

+
+
+
+
:dam-View_list:
+
+

Request a quote

+

Get your quote today

+
+
+
+
:dam-View_list:
+
+

View our workflow solutions

+

End to end soltions

+
+
+
+
+
+
+

Discover products across the life science companies of Danaher

+
+
We bridge the gap between research and practical application, enabling the development of revolutionary innovations such as biopharmaceuticals and enhanced synthetic biologics—helping people live longer, healthier lives.
+
+
+
+
+
+
+ Sciex +
+
+

opco

+

Sciex

+

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

+
+
+
+
+ IDBS +
+
+

opco

+

IDBS

+

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

+
+
+
+
+ Sciex +
+
+

opco

+

Sciex

+

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

+
+
+
+
+ Sciex +
+
+

opco

+

Sciex

+

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

+
+
+
+
+ Phenomenex +
+
+

opco

+

Phenomenex

+

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

+
+
+
+
+ Sciex +
+
+

opco

+

Sciex

+

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

+
+
+
+
+
+
style
+
bg-white
+
+
+
+
+
+
+

Leica Microsystems

+

Intabio ZT System

+

Comprehensive charge variant analysis made simple. The Intabio ZT system couples icIEF separation and UV detection with high resolution mass spectrometry on the ZenoTOF 7600 system

+

+

Learn More

+
+
+ hero +
+
+
+
+
+
Title
+
product1
+
+ +
+
creationDate
+
Fri, 24 Nov 2023 06:27:32 GMT
+
+
+
updateDate
+
Fri, 08 Dec 2023 10:37:45 GMT
+
+
+
+
+
+ + \ No newline at end of file diff --git a/tools/actions/convert/test/fixtures/product-home.html b/tools/actions/convert/test/fixtures/product-home.html new file mode 100644 index 000000000..eaabb8d94 --- /dev/null +++ b/tools/actions/convert/test/fixtures/product-home.html @@ -0,0 +1,1135 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + product1 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ + + +
+ + + + + + +
+
+ + + + +
+ +
+ + + + +
+
+ + + +
+ + +
+ + +
+ + +
+ +
+ +
+ +
+
+
+
+
+ + + + + + + + + +
+ + +
+ +
+ + +
+
+ + + +

Categories

+ + +
+
+ +

Product Category List

+ +
+ + + +
+
+ + + +
+ + + + + + +
+
+ + +
+
+ +

mini-teaser

+ +
+ + + +
+
+ + + + + + + + + +
+ + +
+
+ +
+ +
+
+
+ + + + + + + + +
+
+ + +
+
+
+ + + + + + +
+ + + + + + + + +
+ + + + +
+ + + + + + + + +
+ + +
+
+
+
+
+ + +
+ + +
+
+ + +
+ + + +
+ + + + + + +
+
+ + + + +
+ +
+ + + +
+
+
+ +
+
+
+
+window.onload = function() { + +var anchors = document.getElementsByTagName("a"); + +for (var i = 0; i < anchors.length; i++) { + anchors[i].href = anchors[i].href.replace("/content/danaher/ls", "") + + if (anchors[i].href.includes("?") || anchors[i].href.includes("lifesciences.danaher.com") ) { + + } else { + anchors[i].href = anchors[i].href.concat("?utm_source=dhls_website") + } +} + +} + + + + .btn.orange { + background-color: #dc6016; + color: white; + } +
+
+ + +
+ +
+ +
+ +
+
+ + + +
+ +
+ + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/tools/actions/convert/test/fixtures/product1-converted.html b/tools/actions/convert/test/fixtures/product1-converted.html index 0d7d96ca9..934a58697 100644 --- a/tools/actions/convert/test/fixtures/product1-converted.html +++ b/tools/actions/convert/test/fixtures/product1-converted.html @@ -7,194 +7,184 @@
-
+
-
-

Just One Heading

-
-
- closeup -
+
Request for Quote
+
+
+

Next-generation fluorescent imaging solution for the assurance of monoclonality and automated confluence across diverse cell types

+

Demonstrating that cell lines are monoclonal – or that a gene was edited as expected – can be a time-consuming and highly-subjective process when relying on conventional technologies. The CloneSelect® Imager and CloneSelect® Imager FL are high-throughput automated solutions for imaging and analyzing mammalian cells. Tracking the formation of a colony from a single cell is effortless as barcoded plates are tracked over time. Automated acquisition and analysis provides accurate, objective, and consistent results.

+

With high-resolution white light imaging, the CloneSelect Imager provides automated confluence, monoclonality assurance and industry-leading acquisition times with the ability to image a 96-well plate in under two minutes.

+

The all-new CloneSelect Imager FL features high-contrast multichannel fluorescent and white light imaging that allows for accurate single-cell detection and proof of monoclonality at day 0. Streamline your workflow with comparative confluence assays to identify and verify gene edits.

+
-

We see a way to identify high producing cell lines in 15 minutes

-

Talk to an Expert

-
-
- futuristic +

Demonstrated IND success

+

The Monoclonality Report feature streamlines the creation of supporting documentation for regulatory agencies. Reports are automatically generated based on the parameters you select. The Monoclonality Report is an audit-ready document that supports filing for an Investigational New Drug (IND) Application with the FDA. (21 CFR Part 312)

+

:dam-check-box:

+

Demonstrated IND success

+

The Monoclonality Report feature streamlines the creation of supporting documentation for regulatory agencies. Reports are automatically generated based on the parameters you select. The Monoclonality Report is an audit-ready document that supports filing for an Investigational New Drug (IND) Application with the FDA. (21 CFR Part 312)

+

:dam-check-box:

+

Demonstrated IND success

+

The Monoclonality Report feature streamlines the creation of supporting documentation for regulatory agencies. Reports are automatically generated based on the parameters you select. The Monoclonality Report is an audit-ready document that supports filing for an Investigational New Drug (IND) Application with the FDA. (21 CFR Part 312)

+

:dam-check-box:

+
+
+

Highlights

+
-

We see a way to access multidimensional data in minutes instead of weeks

-

The Intabio ZT system couples icIEF separation and UV detection with high resolution mass spectrometry on the ZenoTOF 7600 system.

-

Request a Quote

+

White light and fluorescent imaging

+

Image every well in every plate with rapid acquisition times with label-free white light. Multichannel fluorescence imaging provides additional confidence of monoclonality and comparative confluence assays (red vs green).

+

:dam-code:

+
+
+

Data tools to accelerate research timelines

+

The software automatically calculates confluence measurements and generates growth curves, heatmaps, and image montages. Measurements for every well are automatically tracked over time. Streamline multiple steps (imaging, sample tracking, data analysis and report generation) in the cell line development workflow for IND filing.

+

:dam-line-chart:

- group-of-people +

Quickly image a variety of plate formats and cell types

+

Image a 96-well plate in under two minutes. Compatible with adherent or settled suspension cell types such as CHO, HEK, hybridomas, iPSCs, and many other cell types.

+

:dam-volume:

+
+
-

This is a tab with just the hero image

-

Button to Blogs

+

Intelligent analysis with easy-to-use software

+

The software automatically calculates confluence for each imaging time point. The growth curve, image montage, total growth, and mean rate are generated automatically and are exportable. Guided software user interface allows for simple 1-hour training.

+

:dam-simpified-bar:

- hero +

High-resolution images

+

High-speed fluorescence and high-resolution white light imaging with accurate detection of single cells including debris. Image visualization and data tracking over multiple days.

+

:dam-high-res-image:

-
-
-
Square image without title
- dave +

Custom automation options*

+

The Automation and Customization Team offers a variety of custom services from robotic plate loading to fully automated workstations with liquid handling and incubation. We have built our custom automated work cells with the CloneSelect Imager for iPSC workflows, full assay systems and drug toxicity and characterization research.

+

:dam-robot-arm:

-
-

Categories

-
-
-
-
-
-
+
-
:dam-User:
-

Talk to an Expert

-

Schedule a call today

+

CloneSelect Imager FL

+

The CloneSelect workflow you know, now with high contrast multichannel fluorescent imaging that allows for verification of gene edits and proof of monoclonality at day zero.

+

Calculate cell growth curves in every well with multichannel fluorescence and white light imaging across diverse cell types.

-
-
-
:dam-View_list:
-

Request a quote

-

Get your quote today

+ Danaher Corporation
+
+

Streamlined Workflow

+
-
:dam-View_list:
-
-

View our workflow solutions

-

End to end soltions

-
+
tabIcon
+
/content/dam/danaher/system/icons/Bookmark.svg
-
-
-
-

Discover products across the life science companies of Danaher

-
-
We bridge the gap between research and practical application, enabling the development of revolutionary innovations such as biopharmaceuticals and enhanced synthetic biologics—helping people live longer, healthier lives.
+
tabName
+
Overview
-
+
-
- Sciex -
-
-

opco

-

Sciex

-

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

-
+
Dimensions
+
dimensions
-
- IDBS -
-
-

opco

-

IDBS

-

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

-
+
Specifications
+
specifications
+
+
-
- Sciex -
-
-

opco

-

Sciex

-

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

-
+
tabIcon
+
/content/dam/danaher/system/icons/Chart bar.svg
-
- Sciex -
-
-

opco

-

Sciex

-

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

-
+
tabName
+
Specifications
+
+
+
-
- Phenomenex -
-
-

opco

-

Phenomenex

-

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

-
+
tabIcon
+
/content/dam/danaher/system/icons/Cube.svg
-
- Sciex -
-
-

opco

-

Sciex

-

SCIEX has led the field of mass spectrometry and capillary electrophoresis for over 50 years, pioneering innovative solutions for the precision detection of quantification of molecules. Our products and services have supported thousands of scientists and influenced life-changing research that has positively impacted the lives of people around the world.Browse Products

-
+
tabName
+
Products
+
-
style
-
bg-white
+
tabIcon
+
/content/dam/danaher/system/icons/Collection.svg
+
+
+
tabName
+
Resources
-
+

+ Powered by Bioz See more details on Bioz +

+
-
-

Leica Microsystems

-

Intabio ZT System

-

Comprehensive charge variant analysis made simple. The Intabio ZT system couples icIEF separation and UV detection with high resolution mass spectrometry on the ZenoTOF 7600 system

-

-

Learn More

-
-
- hero -
+
tabIcon
+
/content/dam/danaher/system/icons/Clipboard list.svg
+
+
+
tabName
+
Citations
Title
-
product1
+
CloneSelect Imager, Fluorescent Imaging | Danaher Life Sciences
+
+
Description
+
CloneSelect® is a high-throughput automated solution for imaging mammalian cells. It has an industry-leading ability to image 96-cell plates. Request a quote!
+
+
+
Image
+
+ +
creationDate
-
Fri, 24 Nov 2023 06:27:32 GMT
+
Fri, 21 Jul 2023 18:49:47 GMT
updateDate
-
Fri, 08 Dec 2023 10:37:45 GMT
+
Thu, 21 Dec 2023 07:06:23 GMT
diff --git a/tools/actions/convert/test/fixtures/product1.html b/tools/actions/convert/test/fixtures/product1.html index eaabb8d94..cf21c00bb 100644 --- a/tools/actions/convert/test/fixtures/product1.html +++ b/tools/actions/convert/test/fixtures/product1.html @@ -19,7 +19,7 @@ - + @@ -43,100 +43,15 @@ - - - - - - - product1 - - - + CloneSelect Imager, Fluorescent Imaging | Danaher Life Sciences + + + - + - + @@ -152,81 +67,12 @@ dataLayer = [{ 'user': {"customerID":"","accountType":"guest","marketCode":"","company":"","role":"","city":"","state":"","country":"","postalCode":"","lastVisit":""} },{ - 'page': {"title":"product1","language":"en","locale":"US","level":"top","type":"webpage","keywords":"","creationDate":"Nov 24, 2023 06:27:32 AM","updateDate":"Dec 08, 2023 10:37:45 AM"} + 'page': {"title":"CloneSelect Imager, Fluorescent Imaging | Danaher Life Sciences","language":"en","locale":"US","level":"top","type":"webpage","keywords":"","creationDate":"Jul 21, 2023 06:49:47 PM","updateDate":"Dec 21, 2023 07:06:23 AM"} }]; - - - - - - - - - - - - - @@ -245,14 +91,14 @@ - + @@ -360,6 +206,7 @@ + @@ -369,7 +216,7 @@ -
+
@@ -416,7 +263,7 @@ } - +
@@ -424,7 +271,7 @@