Changes after merge

Orange-OpenSource · Apr 25, 2024 · 3a74eeb · 3a74eeb
1 parent 0f150d7
commit 3a74eeb
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 70 deletions.
diff --git a/docs/examples/donut-chart.html b/docs/examples/donut-chart.html
@@ -1,50 +1,36 @@
-<!DOCTYPE html>
+8<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Pie Charts - Examples - ODS Charts</title>
-    <link
-      href="https://cdn.jsdelivr.net"
-      rel="preconnect"
-      crossorigin="anonymous"
-    />
-    <link rel="apple-touch-icon" href="../images/favicons/apple-touch-icon.png" sizes="180x180">
-    <link rel="icon" href="../images/favicons/favicon-32x32.png" sizes="32x32" type="image/png">
-    <link rel="icon" href="../images/favicons/favicon-16x16.png" sizes="16x16" type="image/png">
-    <link rel="manifest" href="../images/favicons/manifest.json">
-    <link rel="mask-icon" href="../images/favicons/safari-pinned-tab.svg" color="#000">
-    <link rel="icon" href="../images/favicons/favicon.ico">
-    <meta name="msapplication-config" content="../images/favicons/browserconfig.xml">
-    <meta name="theme-color" content="#000">
-
-    <!--------------------------------------------------
-       Echarts 
-      -------------------------------------------------->
-    <script src="
-    https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js
-    "></script>
+    <title>Donut Charts - Examples - ODS Charts</title>
+    <link href="https://cdn.jsdelivr.net" rel="preconnect" crossorigin="anonymous" />
+    <link href="https://cdn.jsdelivr.net/npm/boosted@5.3.3/dist/css/orange-helvetica.min.css" rel="stylesheet" integrity="sha384-A0Qk1uKfS1i83/YuU13i2nx5pk79PkIfNFOVzTcjCMPGKIDj9Lqx9lJmV7cdBVQZ" crossorigin="anonymous" />
+    <link href="https://cdn.jsdelivr.net/npm/boosted@5.3.3/dist/css/boosted.min.css" rel="stylesheet" integrity="sha384-laZ3JUZ5Ln2YqhfBvadDpNyBo7w5qmWaRnnXuRwNhJeTEFuSdGbzl4ZGHAEnTozR" crossorigin="anonymous" />
+    <link href="../assets/tarteaucitron-config.css" rel="stylesheet" />
+    <link rel="apple-touch-icon" href="../images/favicons/apple-touch-icon.png" sizes="180x180" />
+    <link rel="icon" href="../images/favicons/favicon-32x32.png" sizes="32x32" type="image/png" />
+    <link rel="icon" href="../images/favicons/favicon-16x16.png" sizes="16x16" type="image/png" />
+    <link rel="manifest" href="../images/favicons/manifest.json" />
+    <link rel="mask-icon" href="../images/favicons/safari-pinned-tab.svg" color="#000" />
+    <link rel="icon" href="../images/favicons/favicon.ico" />
+    <meta name="msapplication-config" content="../images/favicons/browserconfig.xml" />
+    <meta name="theme-color" content="#000" />
+    <!--
+      `ods-charts.js` is already imported by the iframe. However, it is imported here too to access the enums that are used in `index.js`.
+    -->
     <script type="text/javascript" src="../../dist/ods-charts.js"></script>
     <script type="module" src="./index.js"></script>
   </head>
   <body>
     <header data-bs-theme="dark">
-      <nav
-        class="navbar navbar-expand-lg"
-        aria-label="Global navigation - With one line title example"
-      >
+      <nav class="navbar navbar-expand-lg" aria-label="Global navigation">
         <div class="container-xxl">
           <div class="navbar-brand me-auto me-lg-4">
             <a class="stretched-link" href="./">
-              <img
-                src="../images/orange-logo.svg"
-                width="50"
-                height="50"
-                alt="ODS Charts - Back to Home"
-                loading="lazy"
-              />
+              <img src="../images/orange-logo.svg" width="50" height="50" alt="ODS Charts - Back to Home" loading="lazy" />
             </a>
-            <h1 class="title">Pie Charts example</h1>
+            <h1 class="title">Orange Design System Charts</h1>
           </div>
         </div>
       </nav>
@@ -65,5 +51,8 @@ <h5 class="card-title">Donut chart</h5>
         </div>
       </div>
     </main>
+    <script src="https://cdn.jsdelivr.net/npm/boosted@5.3.3/dist/js/boosted.bundle.min.js" integrity="sha384-3RoJImQ+Yz4jAyP6xW29kJhqJOE3rdjuu9wkNycjCuDnGAtC/crm79mLcwj1w2o/" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/tarteaucitronjs@1.17.0/tarteaucitron.min.js" integrity="sha384-g6Xxn1zA15svldHyZ/Ow+wUUeRxHf/v7eOOO2sMafcnMPFD25n80Yz/3bbhJBSoN" crossorigin="anonymous"></script>
+    <script src="../assets/tarteaucitron-config.js"></script>
   </body>
 </html>
diff --git a/docs/examples/index.js b/docs/examples/index.js
@@ -264,7 +264,6 @@ async function displayChart(
     document.getElementById(id).dataset.initialOptions =
       JSON.stringify(options);
   }
-  console.log(options)
   if (!cssThemeName) {
     cssThemeName = iframe.contentWindow.ODSCharts.ODSChartsCSSThemesNames.BOOSTED5;
   }
@@ -569,7 +568,7 @@ myChart.setOption(themeManager.getChartOptions());
     themeManager.externalizeLegends(myChart, `#${id}_legend`);
     iframe.style.height = `calc(60vh + 2.375rem)`; // Fix to avoid having a vertical scrollbar within the iframe for the first rendering
   } else {
-    document.getElementById(id + '_legend').innerHTML = '';
+    iframe.contentDocument.getElementById(`${id}_legend`).innerHTML = '';
   }
   themeManager.manageChartResize(myChart, chartId);
   if ('none' !== popoverInput) {

diff --git a/docs/examples/pie-chart.html b/docs/examples/pie-chart.html
@@ -1,50 +1,36 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Pie Charts - Examples - ODS Charts</title>
-    <link
-      href="https://cdn.jsdelivr.net"
-      rel="preconnect"
-      crossorigin="anonymous"
-    />
-    <link rel="apple-touch-icon" href="../images/favicons/apple-touch-icon.png" sizes="180x180">
-    <link rel="icon" href="../images/favicons/favicon-32x32.png" sizes="32x32" type="image/png">
-    <link rel="icon" href="../images/favicons/favicon-16x16.png" sizes="16x16" type="image/png">
-    <link rel="manifest" href="../images/favicons/manifest.json">
-    <link rel="mask-icon" href="../images/favicons/safari-pinned-tab.svg" color="#000">
-    <link rel="icon" href="../images/favicons/favicon.ico">
-    <meta name="msapplication-config" content="../images/favicons/browserconfig.xml">
-    <meta name="theme-color" content="#000">
-
-    <!--------------------------------------------------
-       Echarts 
-      -------------------------------------------------->
-    <script src="
-    https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js
-    "></script>
+    <title>Pie - Examples - ODS Charts</title>
+    <link href="https://cdn.jsdelivr.net" rel="preconnect" crossorigin="anonymous" />
+    <link href="https://cdn.jsdelivr.net/npm/boosted@5.3.3/dist/css/orange-helvetica.min.css" rel="stylesheet" integrity="sha384-A0Qk1uKfS1i83/YuU13i2nx5pk79PkIfNFOVzTcjCMPGKIDj9Lqx9lJmV7cdBVQZ" crossorigin="anonymous" />
+    <link href="https://cdn.jsdelivr.net/npm/boosted@5.3.3/dist/css/boosted.min.css" rel="stylesheet" integrity="sha384-laZ3JUZ5Ln2YqhfBvadDpNyBo7w5qmWaRnnXuRwNhJeTEFuSdGbzl4ZGHAEnTozR" crossorigin="anonymous" />
+    <link href="../assets/tarteaucitron-config.css" rel="stylesheet" />
+    <link rel="apple-touch-icon" href="../images/favicons/apple-touch-icon.png" sizes="180x180" />
+    <link rel="icon" href="../images/favicons/favicon-32x32.png" sizes="32x32" type="image/png" />
+    <link rel="icon" href="../images/favicons/favicon-16x16.png" sizes="16x16" type="image/png" />
+    <link rel="manifest" href="../images/favicons/manifest.json" />
+    <link rel="mask-icon" href="../images/favicons/safari-pinned-tab.svg" color="#000" />
+    <link rel="icon" href="../images/favicons/favicon.ico" />
+    <meta name="msapplication-config" content="../images/favicons/browserconfig.xml" />
+    <meta name="theme-color" content="#000" />
+    <!--
+      `ods-charts.js` is already imported by the iframe. However, it is imported here too to access the enums that are used in `index.js`.
+    -->
     <script type="text/javascript" src="../../dist/ods-charts.js"></script>
     <script type="module" src="./index.js"></script>
   </head>
   <body>
     <header data-bs-theme="dark">
-      <nav
-        class="navbar navbar-expand-lg"
-        aria-label="Global navigation - With one line title example"
-      >
+      <nav class="navbar navbar-expand-lg" aria-label="Global navigation">
         <div class="container-xxl">
           <div class="navbar-brand me-auto me-lg-4">
             <a class="stretched-link" href="./">
-              <img
-                src="../images/orange-logo.svg"
-                width="50"
-                height="50"
-                alt="ODS Charts - Back to Home"
-                loading="lazy"
-              />
+              <img src="../images/orange-logo.svg" width="50" height="50" alt="ODS Charts - Back to Home" loading="lazy" />
             </a>
-            <h1 class="title">Pie Charts example</h1>
+            <h1 class="title">Orange Design System Charts</h1>
           </div>
         </div>
       </nav>
@@ -65,5 +51,8 @@ <h5 class="card-title">Pie chart</h5>
         </div>
       </div>
     </main>
+    <script src="https://cdn.jsdelivr.net/npm/boosted@5.3.3/dist/js/boosted.bundle.min.js" integrity="sha384-3RoJImQ+Yz4jAyP6xW29kJhqJOE3rdjuu9wkNycjCuDnGAtC/crm79mLcwj1w2o/" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/tarteaucitronjs@1.17.0/tarteaucitron.min.js" integrity="sha384-g6Xxn1zA15svldHyZ/Ow+wUUeRxHf/v7eOOO2sMafcnMPFD25n80Yz/3bbhJBSoN" crossorigin="anonymous"></script>
+    <script src="../assets/tarteaucitron-config.js"></script>
   </body>
 </html>