refactoring

docs/HistogramTable.js

@@ -40,15 +40,14 @@ class HistogramTable {
                             ]
                         },
                         {
-                            render: (data, type, row, meta) => {
+                            render: frequency =>
-                                // FK-TODO: refactor
+                                NumberWithBarElementFactory
-                                const numberWithBar = UIUtils.instantiateTemplate('template-number-with-bar');
+                                    .createNumberWithBarElement(
-                                const bar = numberWithBar.querySelector('.bar');
+                                        {
-                                bar.style.width = (data / this.#sumFrequencies * 100).toString() + "%";
+                                            number: frequency,
-                                const number = numberWithBar.querySelector('.number');
+                                            barLenInPercent: frequency / this.#sumFrequencies * 100
-                                number.textContent = data;
+                                        })
-                                return numberWithBar.outerHTML;
+                                    .outerHTML,
-                            },
                             targets: [this.#getColumnIndex('Frequency')]
                         }
                     ]

docs/NumberWithBarElementFactory.js

@@ -0,0 +1,14 @@
+class NumberWithBarElementFactory {
+
+    static createNumberWithBarElement({ number, barLenInPercent }) {
+        const numberWithBarElement = UIUtils.instantiateTemplate('template-number-with-bar');
+
+        const barElement = numberWithBarElement.querySelector('.bar');
+        barElement.style.width = barLenInPercent.toString() + "%";
+
+        const numberElement = numberWithBarElement.querySelector('.number');
+        numberElement.textContent = number;
+
+        return numberWithBarElement;
+    }
+}

docs/batchCodeTable.html

@@ -28,6 +28,7 @@
   <link href="forkMeOnGitHub.css" rel="stylesheet" type="text/css" />
   <script src="./Utils.js"></script>
   <script src="./UIUtils.js"></script>
+  <script src="./NumberWithBarElementFactory.js"></script>
   <script src="./GoogleAnalytics.js"></script>
   <script src="./BatchCodeSelectInitializer.js"></script>
   <script src="./HistoDescrsProvider.js"></script>