@datarailsshared/dr_renderer 1.2.41-beta → 1.2.41

package/src/published_items_renderer.js

@@ -0,0 +1,308 @@
+let getPublishedItemsRenderer = function (publishedItemsRenderer) {
+
+  publishedItemsRenderer.formulaCellClicked = function (event, scope, options, window) {
+    event.stopPropagation();
+    event.preventDefault();
+    try {
+      const td = event.currentTarget;
+      const a = td.querySelector('a');
+      const locationId = a.getAttribute('location_id');
+      scope.callFromPublishItem(event, options.widgetId, options.dashboardId, locationId, window.published_item_sheetname);
+    } catch (e) {
+    }
+    return false;
+  }
+
+  publishedItemsRenderer.resizeTable = function (options, window) {
+    options.alreadySetTimeout = null;
+    const publish_item_image = window.document.getElementById('publish_item_image');
+    const table = window.document.getElementsByTagName("table")[0];
+    const body = window.document.getElementsByTagName("body")[0];
+    let body_zoom = body.style.zoom;
+    body_zoom = parseFloat(body_zoom);
+
+    if (!body_zoom) {
+      body_zoom = 1;
+    }
+
+    if (table && options.autoResize) {
+      let zoom = table.style.zoom;
+      zoom = parseFloat(zoom);
+
+      if (!zoom) {
+        zoom = 1;
+      }
+
+      const positionInfo = table.getBoundingClientRect();
+      let height = (positionInfo.height + positionInfo.y * 2) * zoom * body_zoom;
+      let width = (positionInfo.width + positionInfo.x * 2) * zoom * body_zoom;
+
+      if (height < window.innerHeight && width < window.innerWidth) {
+        zoom += 0.05;
+        height = (positionInfo.height + positionInfo.y * 2) * zoom * body_zoom;
+        width = (positionInfo.width + positionInfo.x * 2) * zoom * body_zoom;
+        if (height < window.innerHeight && width < window.innerWidth) {
+          table.style.zoom = zoom;
+          setTimeout(function () {
+            publishedItemsRenderer.resizeTable(options, window);
+          }, 10);
+        }
+      } else if (height >= window.innerHeight || width >= window.innerWidth) {
+        zoom -= 0.05;
+        height = (positionInfo.height + positionInfo.y * 2) * zoom * body_zoom;
+        width = (positionInfo.width + positionInfo.x * 2) * zoom * body_zoom;
+        table.style.zoom = zoom;
+        if (height >= window.innerHeight || width >= window.innerWidth) {
+          setTimeout(function () {
+            publishedItemsRenderer.resizeTable(options, window);
+          }, 10);
+        }
+      }
+    }
+    if (publish_item_image) {
+      if (publish_item_image.style.height === '100%') {
+        publish_item_image.style.height = 'auto';
+        publish_item_image.style.width = '100%';
+        publish_item_image.style.marginTop = "";
+        setTimeout(function () {
+          publishedItemsRenderer.resizeTable(options, window);
+        }, 10);
+      }
+
+      const imgPositionInfo = publish_item_image.getBoundingClientRect();
+      const height = (imgPositionInfo.height + imgPositionInfo.y * 2) * body_zoom;
+      if (height > window.innerHeight) {
+        publish_item_image.style.height = '100%';
+        publish_item_image.style.width = 'auto';
+      } else if (height < window.innerHeight) {
+        const temp = (window.innerHeight - height) / 2;
+        publish_item_image.style.marginTop = (temp / body_zoom + imgPositionInfo.y) + "px";
+      }
+    }
+  }
+
+  publishedItemsRenderer.resetTableZoom = function (document) {
+    const table = document.getElementsByTagName("table")[0];
+    if (table) {
+      table.style.zoom = 1;
+    }
+  }
+
+  publishedItemsRenderer.changedAutoResize = function (new_auto_resize, options, window, document) {
+    if (options.autoResize !== new_auto_resize) {
+      options.autoResize = new_auto_resize;
+      if (!options.autoResize) {
+        publishedItemsRenderer.resetTableZoom(document);
+      } else {
+        if (!options.alreadySetTimeout) {
+          options.alreadySetTimeout = setTimeout(function () {
+            publishedItemsRenderer.resizeTable(options, window);
+          }, 100);
+        }
+      }
+    }
+  }
+
+  publishedItemsRenderer.changedInputValue = function (firstTime, scope, options) {
+    const input_values = [];
+    if (options.inputValuesData) {
+      for (let key in options.inputValuesData) {
+        input_values.push(options.inputValuesData[key]);
+      }
+    }
+
+    try {
+      scope.changedInputValues(input_values, options.widgetId, options.dashboardId, firstTime);
+    } catch (e) {
+      console.error(e);
+    }
+  }
+
+  publishedItemsRenderer.changedInputElement = function (event, scope, options) {
+    const inputElement = event.currentTarget;
+    const name = inputElement.getAttribute('name');
+    const metaData = options.inputValuesData ? options.inputValuesData[name] : null;
+    let newValue = inputElement.value;
+    if (metaData) {
+      if (metaData.type === 'editInput')
+        newValue = parseFloat(newValue);
+
+      if (metaData.value !== newValue) {
+        metaData.value = newValue;
+        publishedItemsRenderer.changedInputValue(false, scope, options);
+      }
+    }
+  }
+
+  publishedItemsRenderer.createInputElement = function (tdElement, inputMetaData, formatValue, scope, options, document) {
+    tdElement.innerHTML = '';
+    if (inputMetaData) {
+      switch (inputMetaData.type) {
+        case "editInput":
+        case "editInputPercent":
+          let inEl = document.createElement("INPUT");
+          let labelEl = document.createElement("LABEL");
+
+          if (inputMetaData.value === 'DR_INPUT') {
+            labelEl.innerText = null;
+          } else {
+            labelEl.innerText = inputMetaData.format ? formatValue('n', inputMetaData.format, inputMetaData.value).value : inputMetaData.value;
+          }
+          labelEl.setAttribute("style", "background: transparent;width: calc(100% - 15px);border: 0;margin: 6px;text-align: inherit;display: block; cursor: pointer;");
+          labelEl.addEventListener("click", function (event) {
+            event.stopPropagation();
+            labelEl.style.display = 'none';
+            inEl.style.display = 'block';
+            setTimeout(function () {
+              inEl.focus();
+            }, 1)
+          });
+
+          if (inputMetaData.type === 'editInputPercent')
+            inEl.setAttribute("type", "text");
+          else if (inputMetaData.type === 'editInput')
+            inEl.setAttribute("type", "number");
+
+          inEl.setAttribute("name", inputMetaData.name);
+          inEl.setAttribute("style", "background: transparent;width: calc(100% - 15px);border: 0;margin: 5px;text-align: inherit;display: none;");
+          inEl.value = inputMetaData.value;
+          inEl.addEventListener("focusout", function (event) {
+            event.preventDefault();
+            publishedItemsRenderer.changedInputElement(event, scope, options);
+            inEl.style.display = 'none';
+            labelEl.innerText = inEl.value;
+            labelEl.innerText = inputMetaData.format ? formatValue('n', inputMetaData.format, inEl.value).value : inputMetaData.value;
+            labelEl.style.display = 'block';
+          });
+          inEl.addEventListener("keyup", function (event) {
+            // Number 13 is the "Enter" key on the keyboard
+            if (event.keyCode === 13) {
+              // Cancel the default action, if needed
+              event.preventDefault();
+              publishedItemsRenderer.changedInputElement(event, scope, options);
+              inEl.style.display = 'none';
+              labelEl.innerText = inputMetaData.format ? formatValue('n', inputMetaData.format, inEl.value).value : inputMetaData.value;
+              labelEl.style.display = 'block';
+            }
+          });
+          tdElement.appendChild(inEl);
+          tdElement.appendChild(labelEl);
+          break;
+        case "dateInput":
+          let dateEl = document.createElement("DIV");
+          const format = inputMetaData.format ? inputMetaData.format.toUpperCase() : 'MM/DD/YYYY';
+          const formattedDate = formatValue('d', format, inputMetaData.value).value
+          dateEl.innerHTML = '<label class="value" style="cursor: pointer;">' + formattedDate + '</label>';
+          tdElement.appendChild(dateEl);
+          tdElement.classList.toggle("input-filter-list-td");
+          tdElement.setAttribute("name", inputMetaData.name);
+          tdElement.addEventListener("click", function (event) {
+            try {
+              scope.openDatePickerFromPublishedItem(event, options.widgetId, options.dashboardId, inputMetaData, format);
+            } catch (e) {
+              console.error(e);
+            }
+          })
+          break;
+        case "excelList":
+          let selectEl = document.createElement("SELECT");
+          selectEl.setAttribute("name", inputMetaData.name);
+          selectEl.setAttribute("class", "dr_input");
+          for (let i = 0; i < inputMetaData.values.length; i++) {
+            let option = document.createElement("option");
+            option.setAttribute("value", inputMetaData.values[i]);
+            option.innerText = inputMetaData.values[i];
+            if (inputMetaData.values[i] === inputMetaData.value) {
+              option.setAttribute("selected", "");
+            }
+            selectEl.appendChild(option);
+          }
+          selectEl.addEventListener("change", function (event) {
+            publishedItemsRenderer.changedInputElement(event, scope, options)
+          });
+          tdElement.appendChild(selectEl);
+          break;
+        case "filterList":
+          let listHolderEl = document.createElement("DIV");
+          listHolderEl.setAttribute("class", "filter_list_holder");
+          listHolderEl.innerHTML = '<label class="value">' + inputMetaData.value + '</label><i class="filter_icon"></i>';
+          tdElement.appendChild(listHolderEl);
+          tdElement.classList.toggle("input-filter-list-td");
+          tdElement.setAttribute("name", inputMetaData.name);
+          tdElement.addEventListener("click", function (event) {
+            let inputElement = event.currentTarget;
+            let name = inputElement.getAttribute('name');
+            let metaData = options.inputValuesData ? options.inputValuesData[name] : null;
+            if (metaData) {
+              try {
+                scope.openFilterListFromPublishedItem(event, options.widgetId, options.dashboardId, metaData);
+              } catch (e) {
+                console.error(e);
+              }
+            }
+          });
+          break;
+      }
+    }
+  }
+
+  publishedItemsRenderer.changedInputFilterValue = function (metaData, newValue, document) {
+    let tdLabelElement = document.querySelector('td[name="' + metaData.name + '"]>div>label[class="value"]');
+    if (tdLabelElement) {
+      tdLabelElement.innerText = newValue;
+    }
+    console.log(tdLabelElement, newValue);
+  }
+
+  publishedItemsRenderer.prepareInputCells = function (document, scope, options) {
+    let inputCells = document.querySelectorAll('td>a[href="DR_INPUT"], td>div>a[href="DR_INPUT"]');
+    if (!options.inputValuesData) {
+      options.inputValuesData = {};
+    }
+    if (inputCells.length > 0) {
+      for (let i = 0; i < inputCells.length; i++) {
+        let tdElement = inputCells[i].parentElement;
+        let inputId = inputCells[i].getAttribute('name') || 'no_attribute';
+        publishedItemsRenderer.createInputElement(tdElement, options.inputValuesData[inputId], scope.highchartsRenderer.formatValue, scope, options, document);
+      }
+    }
+  }
+
+  publishedItemsRenderer.addEventListeners = function (document, window, scope, options) {
+    document.addEventListener("DOMContentLoaded", function () {
+      if (!options.alreadySetTimeout) {
+        options.alreadySetTimeout = setTimeout(function () {
+          publishedItemsRenderer.resizeTable(options, window);
+        }, 50);
+      }
+    });
+    window.addEventListener("resize", function () {
+      if (!options.alreadySetTimeout) {
+        options.alreadySetTimeout = setTimeout(function () {
+          publishedItemsRenderer.resizeTable(options, window);
+        }, 100);
+      }
+    });
+
+    // Add click event to cell with formula
+    let all_a_hrefs = document.querySelectorAll('td a[location_id]');
+    for (let i = 0; i < all_a_hrefs.length; i++) {
+      let td_elem = all_a_hrefs[i].closest('td');
+      td_elem.classList.add("apply_hover");
+      td_elem.addEventListener('click', function (event) {
+        publishedItemsRenderer.formulaCellClicked(event, scope, options, window)
+      });
+    }
+  }
+
+  publishedItemsRenderer.initPublishedItem = function (document, window, scope, options) {
+    publishedItemsRenderer.prepareInputCells(document, scope, options);
+    publishedItemsRenderer.addEventListeners(document, window, scope, options);
+
+    setTimeout(function () {
+      publishedItemsRenderer.changedInputValue(true, scope, options);
+    }, 500);
+  }
+}
+
+module.exports = getPublishedItemsRenderer;

package/start_run.sh

@@ -1,3 +1,3 @@
-#!/bin/bash
-source ~/.nvm/nvm.sh
-nvm use 14.15.1
+#!/bin/bash
+source ~/.nvm/nvm.sh
+nvm use 14.15.1