@kumologica/sdk 3.0.0

package/src/app/ui/editor-client/src/js/ui/palette.js

@@ -0,0 +1,788 @@
+RED.palette = (function () {
+  var exclusion = ['config', 'unknown', 'deprecated'];
+  // var coreCategories = [
+  //   'subflows',
+  //   'input',
+  //   'output',
+  //   'function',
+  //   'social',
+  //   'mobile',
+  //   'storage',
+  //   'analysis',
+  //   'advanced',
+  // ];
+
+  var coreCategories = [
+    'general',
+    'transformation',
+    'routing',
+    'security',
+    'web',
+    'validation',
+    'testing',
+    'logging',
+    'exception',
+    'kumohub',
+    'aws',
+    'queue',
+    'storage',
+    'file',
+    'social'
+  ]
+
+  var categoryContainers = {};
+  var sidebarControls;
+
+  function createCategory(originalCategory, rootCategory, category, ns) {
+    if ($('#palette-base-category-' + rootCategory).length === 0) {
+      createCategoryContainer(
+        originalCategory,
+        rootCategory,
+        ns + ':palette.label.' + rootCategory
+      );
+    }
+    $('#palette-container-' + rootCategory).show();
+    if ($('#palette-' + category).length === 0) {
+      $('#palette-base-category-' + rootCategory).append(
+        '<div id="palette-' + category + '"></div>'
+      );
+    }
+  }
+  function createCategoryContainer(originalCategory, category, labelId) {
+    var label = RED._(labelId, { defaultValue: category });
+    label = (label || category).replace(/_/g, ' ');
+    var catDiv = $(
+      '<div id="palette-container-' +
+        category +
+        '" class="palette-category palette-close hide">' +
+        '<div id="palette-header-' +
+        category +
+        '" class="palette-header"><i class="expanded fa fa-angle-down"></i><span>' +
+        label +
+        '</span></div>' +
+        '<div class="palette-content" id="palette-base-category-' +
+        category +
+        '">' +
+        '<div id="palette-' +
+        category +
+        '-input"></div>' +
+        '<div id="palette-' +
+        category +
+        '-output"></div>' +
+        '<div id="palette-' +
+        category +
+        '-function"></div>' +
+        '</div>' +
+        '</div>'
+    ).appendTo('#palette-container');
+    catDiv.data('category', originalCategory);
+    catDiv.data('label', label);
+    categoryContainers[category] = {
+      container: catDiv,
+      close: function () {
+        catDiv.removeClass('palette-open');
+        catDiv.addClass('palette-closed');
+        $('#palette-base-category-' + category).slideUp();
+        $('#palette-header-' + category + ' i').removeClass('expanded');
+      },
+      open: function () {
+        catDiv.addClass('palette-open');
+        catDiv.removeClass('palette-closed');
+        $('#palette-base-category-' + category).slideDown();
+        $('#palette-header-' + category + ' i').addClass('expanded');
+      },
+      toggle: function () {
+        if (catDiv.hasClass('palette-open')) {
+          categoryContainers[category].close();
+        } else {
+          categoryContainers[category].open();
+        }
+      },
+    };
+
+    $('#palette-header-' + category).on('click', function (e) {
+      categoryContainers[category].toggle();
+    });
+  }
+
+  function setLabel(type, el, label, info) {
+    var nodeWidth = 120;
+    var nodeHeight = 25;
+    var lineHeight = 20;
+    var portHeight = 10;
+
+    label = RED.utils.sanitize(label);
+
+    var words = label.split(/[ -]/);
+
+    var displayLines = [];
+
+    var currentLine = words[0];
+    var currentLineWidth = RED.view.calculateTextWidth(
+      currentLine,
+      'palette_label',
+      0
+    );
+
+    for (var i = 1; i < words.length; i++) {
+      var newWidth = RED.view.calculateTextWidth(
+        currentLine + ' ' + words[i],
+        'palette_label',
+        0
+      );
+      if (newWidth < nodeWidth) {
+        currentLine += ' ' + words[i];
+        currentLineWidth = newWidth;
+      } else {
+        displayLines.push(currentLine);
+        currentLine = words[i];
+        currentLineWidth = RED.view.calculateTextWidth(
+          currentLine,
+          'palette_label',
+          0
+        );
+      }
+    }
+    displayLines.push(currentLine);
+
+    var lines = displayLines.join('<br/>');
+    var multiLineNodeHeight = 8 + lineHeight * displayLines.length;
+    el.css({ height: multiLineNodeHeight + 'px' });
+
+    var labelElement = el.find('.palette_label');
+    labelElement
+      .html(lines)
+      .attr('dir', RED.text.bidi.resolveBaseTextDir(lines));
+
+    el.find('.palette_port').css({ top: '11px' }); //multiLineNodeHeight / 2 - 5 + 'px' });
+
+    var popOverContent;
+    try {
+      var l =
+        '<p><b>' +
+        RED.text.bidi.enforceTextDirectionWithUCC(label) +
+        '</b></p>';
+      popOverContent = $('<div></div>').append(
+        $(
+          l +
+            (info
+              ? info
+              : $("script[data-help-name='" + type + "']").html() ||
+                '<p>' + RED._('palette.noInfo') + '</p>'
+            ).trim()
+        )
+          .filter(function (n) {
+            return (
+              (this.nodeType == 1 && this.nodeName == 'P') ||
+              (this.nodeType == 3 && this.textContent.trim().length > 0)
+            );
+          })
+          .slice(0, 2)
+      );
+      popOverContent.find('a').each(function () {
+        var linkText = $(this).text();
+        $(this).before(linkText);
+        $(this).remove();
+      });
+
+      var typeInfo = RED.nodes.getType(type);
+
+      if (typeInfo) {
+        var metaData = '';
+        if (typeInfo && !/^subflow:/.test(type)) {
+          metaData = typeInfo.set.module + ' : ';
+        }
+        metaData += type;
+        $('<p>', { style: 'font-size: 0.8em' })
+          .text(metaData)
+          .appendTo(popOverContent);
+      }
+    } catch (err) {
+      // Malformed HTML may cause errors. TODO: need to understand what can break
+      // NON-NLS: internal debug
+      console.log('Error generating pop-over label for ', type);
+      console.log(err.toString());
+      popOverContent =
+        '<p><b>' + label + '</b></p><p>' + RED._('palette.noInfo') + '</p>';
+    }
+
+    el.data('popover').setContent(popOverContent);
+  }
+
+  function setIcon(element, sf) {
+    var icon_url = RED.utils.getNodeIcon(sf._def);
+    var iconContainer = element.find('.palette_icon_container');
+    RED.utils.createIconElement(icon_url, iconContainer, true);
+  }
+
+  function escapeNodeType(nt) {
+    return nt.replace(/[ .:]/g, '_');
+  }
+
+  function addNodeType(nt, def) {
+    var nodeTypeId = escapeNodeType(nt);
+    if (def.defaults['_hidden']){
+      return;
+    }
+    if ($('#palette_node_' + nodeTypeId).length) {
+      return;
+    }
+    if (exclusion.indexOf(def.category) === -1) {
+      var originalCategory = def.category.toLowerCase();
+      var category = originalCategory.replace(/ /g, '_');
+      var rootCategory = category.split('-')[0];
+
+      var d = document.createElement('div');
+      d.id = 'palette_node_' + nodeTypeId;
+      d.type = nt;
+
+      var label = /^(.*?)([ -]in|[ -]out)?$/.exec(nt)[1];
+      if (typeof def.paletteLabel !== 'undefined') {
+        try {
+          label =
+            (typeof def.paletteLabel === 'function'
+              ? def.paletteLabel.call(def)
+              : def.paletteLabel) || '';
+        } catch (err) {
+          console.log('Definition error: ' + nt + '.paletteLabel', err);
+        }
+      }
+
+      $('<div/>', {
+        class: 'palette_label',
+      }).appendTo(d);
+
+      d.className = 'palette_node';
+
+      if (def.icon) {
+        var icon_url = RED.utils.getNodeIcon(def);
+        var iconContainer = $('<div/>', {
+          class: 'palette_icon_container',
+        }).appendTo(d);
+        RED.utils.createIconElement(icon_url, iconContainer, true);
+      }
+
+      // d.style.backgroundColor = RED.utils.getNodeColor(nt, def);
+
+      if (def.outputs > 0) {
+        var portOut = document.createElement('div');
+        portOut.className = 'palette_port palette_port_output';
+        d.appendChild(portOut);
+      }
+
+      if (def.inputs > 0) {
+        var portIn = document.createElement('div');
+        portIn.className = 'palette_port palette_port_input';
+        d.appendChild(portIn);
+      }
+
+      createCategory(
+        def.category,
+        rootCategory,
+        category,
+        coreCategories.indexOf(rootCategory) !== -1
+          ? 'kumologica-core'
+          : def.set.id
+      );
+
+      $('#palette-' + category).append(d);
+
+      $(d).data('category', rootCategory);
+
+      d.onmousedown = function (e) {
+        e.preventDefault();
+      };
+
+      var popover = RED.popover.create({
+        target: $(d),
+        trigger: 'hover',
+        width: '300px',
+        content: 'hi',
+        delay: { show: 750, hide: 50 },
+      });
+      $(d).data('popover', popover);
+
+      // $(d).popover({
+      //     title:d.type,
+      //     placement:"right",
+      //     trigger: "hover",
+      //     delay: { show: 750, hide: 50 },
+      //     html: true,
+      //     container:'body'
+      // });
+      $(d).click(function () {
+        RED.view.focus();
+        var helpText;
+        if (nt.indexOf('subflow:') === 0) {
+          helpText =
+            marked(RED.nodes.subflow(nt.substring(8)).info || '') ||
+            '<span class="node-info-none">' +
+              RED._('sidebar.info.none') +
+              '</span>';
+        } else {
+          helpText =
+            $("script[data-help-name='" + d.type + "']").html() ||
+            '<span class="node-info-none">' +
+              RED._('sidebar.info.none') +
+              '</span>';
+        }
+        RED.sidebar.info.set(helpText, RED._('sidebar.info.nodeHelp'));
+      });
+      var chart = $('#chart');
+      var chartSVG = $('#chart>svg').get(0);
+      var activeSpliceLink;
+      var mouseX;
+      var mouseY;
+      var spliceTimer;
+      var paletteWidth;
+      var paletteTop;
+      $(d).draggable({
+        helper: 'clone',
+        appendTo: 'body',
+        revert: 'invalid',
+        revertDuration: 300,
+        containment: '#main-container',
+        start: function () {
+          paletteWidth = $('#palette').width();
+          paletteTop =
+            $('#palette').parent().position().top +
+            $('#palette-container').position().top;
+          RED.view.focus();
+        },
+        stop: function () {
+          d3.select('.link_splice').classed('link_splice', false);
+          if (spliceTimer) {
+            clearTimeout(spliceTimer);
+            spliceTimer = null;
+          }
+        },
+        drag: function (e, ui) {
+          ui.originalPosition.left = $('#' + e.target.id).offset().left;
+
+          if (def.inputs > 0 && def.outputs > 0) {
+            mouseX =
+              ui.position.left -
+              paletteWidth +
+              ui.helper.width() / 2 +
+              chart.scrollLeft();
+            mouseY =
+              ui.position.top -
+              paletteTop +
+              ui.helper.height() / 2 +
+              chart.scrollTop();
+            if (!spliceTimer) {
+              spliceTimer = setTimeout(function () {
+                var nodes = [];
+                var bestDistance = Infinity;
+                var bestLink = null;
+                if (chartSVG.getIntersectionList) {
+                  var svgRect = chartSVG.createSVGRect();
+                  svgRect.x = mouseX;
+                  svgRect.y = mouseY;
+                  svgRect.width = 1;
+                  svgRect.height = 1;
+                  nodes = chartSVG.getIntersectionList(svgRect, chartSVG);
+                  mouseX /= RED.view.scale();
+                  mouseY /= RED.view.scale();
+                } else {
+                  // Firefox doesn't do getIntersectionList and that
+                  // makes us sad
+                  mouseX /= RED.view.scale();
+                  mouseY /= RED.view.scale();
+                  nodes = RED.view.getLinksAtPoint(mouseX, mouseY);
+                }
+
+                for (var i = 0; i < nodes.length; i++) {
+                  var node = d3.select(nodes[i]);
+                  if (
+                    node.classed('link_background') &&
+                    !node.classed('link_link')
+                  ) {
+                    var length = nodes[i].getTotalLength();
+                    for (var j = 0; j < length; j += 10) {
+                      var p = nodes[i].getPointAtLength(j);
+                      var d2 =
+                        (p.x - mouseX) * (p.x - mouseX) +
+                        (p.y - mouseY) * (p.y - mouseY);
+                      if (d2 < 200 && d2 < bestDistance) {
+                        bestDistance = d2;
+                        bestLink = nodes[i];
+                      }
+                    }
+                  }
+                }
+                if (activeSpliceLink && activeSpliceLink !== bestLink) {
+                  d3.select(activeSpliceLink.parentNode).classed(
+                    'link_splice',
+                    false
+                  );
+                }
+                if (bestLink) {
+                  d3.select(bestLink.parentNode).classed('link_splice', true);
+                } else {
+                  d3.select('.link_splice').classed('link_splice', false);
+                }
+                if (activeSpliceLink !== bestLink) {
+                  if (bestLink) {
+                    $(ui.helper).data('splice', d3.select(bestLink).data()[0]);
+                  } else {
+                    $(ui.helper).removeData('splice');
+                  }
+                }
+                activeSpliceLink = bestLink;
+                spliceTimer = null;
+              }, 200);
+            }
+          }
+        },
+      });
+
+      var nodeInfo = null;
+      if (nt.indexOf('subflow:') === 0) {
+        $(d).dblclick(function (e) {
+          RED.workspaces.show(nt.substring(8));
+          e.preventDefault();
+        });
+        nodeInfo = marked(def.info || '');
+      }
+      setLabel(nt, $(d), label, nodeInfo);
+
+      var categoryNode = $('#palette-container-' + rootCategory);
+      if (categoryNode.find('.palette_node').length === 1) {
+        categoryContainers[rootCategory].close(); // close
+      }
+    }
+  }
+
+  function removeNodeType(nt) {
+    var nodeTypeId = escapeNodeType(nt);
+    var paletteNode = $('#palette_node_' + nodeTypeId);
+    var categoryNode = paletteNode.closest('.palette-category');
+    paletteNode.remove();
+    if (categoryNode.find('.palette_node').length === 0) {
+      if (categoryNode.find('i').hasClass('expanded')) {
+        categoryNode.find('.palette-content').slideToggle();
+        categoryNode.find('i').toggleClass('expanded');
+      }
+    }
+  }
+
+  function hideNodeType(nt) {
+    var nodeTypeId = escapeNodeType(nt);
+    var paletteNode = $('#palette_node_' + nodeTypeId);
+    paletteNode.hide();
+    var categoryNode = paletteNode.closest('.palette-category');
+    var cl = categoryNode.find('.palette_node');
+    var c = 0;
+    for (var i = 0; i < cl.length; i++) {
+      if ($(cl[i]).css('display') === 'none') {
+        c += 1;
+      }
+    }
+    if (c === cl.length) {
+      categoryNode.hide();
+    }
+  }
+
+  function showNodeType(nt) {
+    var nodeTypeId = escapeNodeType(nt);
+    var paletteNode = $('#palette_node_' + nodeTypeId);
+    var categoryNode = paletteNode.closest('.palette-category');
+    categoryNode.show();
+    paletteNode.show();
+  }
+
+  function refreshNodeTypes() {
+    RED.nodes.eachSubflow(function (sf) {
+      var paletteNode = $('#palette_node_subflow_' + sf.id.replace('.', '_'));
+      var portInput = paletteNode.find('.palette_port_input');
+      var portOutput = paletteNode.find('.palette_port_output');
+
+      var paletteLabel = paletteNode.find('.palette_label');
+      paletteLabel.attr('class', 'palette_label');
+
+      var paletteIconContainer = paletteNode.find('.palette_icon_container');
+      paletteIconContainer.attr(
+        'class',
+        'palette_icon_container'
+        // +
+        //   ((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) ||
+        //   'right' === sf._def.align
+        //     ? ' palette_icon_container_right'
+        //     : '')
+      );
+
+      if (portInput.length === 0 && sf.in.length > 0) {
+        var portIn = document.createElement('div');
+        portIn.className = 'palette_port palette_port_input';
+        paletteNode.append(portIn);
+      } else if (portInput.length !== 0 && sf.in.length === 0) {
+        portInput.remove();
+      }
+
+      if (portOutput.length === 0 && sf.out.length > 0) {
+        var portOut = document.createElement('div');
+        portOut.className = 'palette_port palette_port_output';
+        paletteNode.append(portOut);
+      } else if (portOutput.length !== 0 && sf.out.length === 0) {
+        portOutput.remove();
+      }
+      setLabel(
+        sf.type + ':' + sf.id,
+        paletteNode,
+        sf.name,
+        marked(sf.info || '')
+      );
+      setIcon(paletteNode, sf);
+
+      var currentCategory = paletteNode.data('category');
+      var newCategory = sf.category || 'subflows';
+      if (currentCategory !== newCategory) {
+        var category = newCategory.replace(/ /g, '_');
+        createCategory(newCategory, category, category, 'kumologica-core');
+
+        var currentCategoryNode = paletteNode.closest('.palette-category');
+        var newCategoryNode = $('#palette-' + category);
+        newCategoryNode.append(paletteNode);
+        if (newCategoryNode.find('.palette_node').length === 1) {
+          categoryContainers[category].open();
+        }
+
+        paletteNode.data('category', newCategory);
+        if (currentCategoryNode.find('.palette_node').length === 0) {
+          if (currentCategoryNode.find('i').hasClass('expanded')) {
+            currentCategoryNode.find('.palette-content').slideToggle();
+            currentCategoryNode.find('i').toggleClass('expanded');
+          }
+        }
+      }
+    });
+  }
+
+  function filterChange(val) {
+    // console.log('[palette] filterChange - val=', val);
+    let keepPaletteCollapsed = false;
+    if (val === ''){
+      // console.log('[palette] collapsing the palette');
+      collapseAllPalette();
+      keepPaletteCollapsed = true;
+    }
+
+    // console.log('[palette] Filtering the change: val=', val);
+    var re = new RegExp(val.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'i');
+    $('#palette-container .palette_node').each(function (i, el) {
+      var currentLabel = $(el).find('.palette_label').text();
+      if (val === '' || re.test(el.id) || re.test(currentLabel)) {
+        // console.log('[palette] Showing element:', $(this));
+        $(this).show();
+      } else {
+        // console.log('[palette] Hidding element:', $(this));
+        $(this).hide();
+      }
+    });
+
+    for (var category in categoryContainers) {
+      if (categoryContainers.hasOwnProperty(category)) {
+        if (
+          categoryContainers[category].container
+            .find('.palette_node')
+            .filter(function () {
+              return $(this).css('display') !== 'none';
+            }).length === 0 
+        ) {
+          categoryContainers[category].close();
+        } else {
+          if (!keepPaletteCollapsed){
+            // console.log('[palette] Open the category:', category);
+            categoryContainers[category].open();
+          }
+         
+        }
+      }
+    }
+
+  }
+
+  function collapseAllPalette() {
+    for (var cat in categoryContainers) {
+      if (categoryContainers.hasOwnProperty(cat)) {
+        categoryContainers[cat].close();
+      }
+    }
+  }
+
+  function init() {
+    RED.events.on('registry:node-type-added', function (nodeType) {
+      var def = RED.nodes.getType(nodeType);
+      addNodeType(nodeType, def);
+      if (def.onpaletteadd && typeof def.onpaletteadd === 'function') {
+        def.onpaletteadd.call(def);
+      }
+    });
+    RED.events.on('registry:node-type-removed', function (nodeType) {
+      removeNodeType(nodeType);
+    });
+    RED.events.on('registry:node-set-enabled', function (nodeSet) {
+      for (var j = 0; j < nodeSet.types.length; j++) {
+        showNodeType(nodeSet.types[j]);
+        var def = RED.nodes.getType(nodeSet.types[j]);
+        if (def && def.onpaletteadd && typeof def.onpaletteadd === 'function') {
+          def.onpaletteadd.call(def);
+        }
+      }
+    });
+    RED.events.on('registry:node-set-disabled', function (nodeSet) {
+      for (var j = 0; j < nodeSet.types.length; j++) {
+        hideNodeType(nodeSet.types[j]);
+        var def = RED.nodes.getType(nodeSet.types[j]);
+        if (
+          def &&
+          def.onpaletteremove &&
+          typeof def.onpaletteremove === 'function'
+        ) {
+          def.onpaletteremove.call(def);
+        }
+      }
+    });
+    RED.events.on('registry:node-set-removed', function (nodeSet) {
+      if (nodeSet.added) {
+        for (var j = 0; j < nodeSet.types.length; j++) {
+          removeNodeType(nodeSet.types[j]);
+          var def = RED.nodes.getType(nodeSet.types[j]);
+          if (
+            def &&
+            def.onpaletteremove &&
+            typeof def.onpaletteremove === 'function'
+          ) {
+            def.onpaletteremove.call(def);
+          }
+        }
+      }
+    });
+
+    $('#palette > .palette-spinner').show();
+
+    $('#palette-search input').searchBox({
+      delay: 100,
+      change: function () {
+        filterChange($(this).val());
+      },
+    });
+
+    sidebarControls = $(
+      '<div class="sidebar-control-left"><i class="fa fa-chevron-left"</div>'
+    ).appendTo($('#palette'));
+    RED.popover.tooltip(
+      sidebarControls,
+      RED._('keyboard.togglePalette'),
+      'core:toggle-palette'
+    );
+
+    sidebarControls.click(function () {
+      RED.menu.toggleSelected('menu-item-palette');
+    });
+    $('#palette').on('mouseenter', function () {
+      sidebarControls.toggle('slide', { direction: 'left' }, 200);
+    });
+    $('#palette').on('mouseleave', function () {
+      sidebarControls.hide();
+    });
+
+    var categoryList = coreCategories;
+    if (RED.settings.paletteCategories) {
+      categoryList = RED.settings.paletteCategories;
+    } else if (RED.settings.theme('palette.categories')) {
+      categoryList = RED.settings.theme('palette.categories');
+    }
+    if (!Array.isArray(categoryList)) {
+      categoryList = coreCategories;
+    }
+
+    categoryList.forEach(function (category) {
+      createCategoryContainer(category, category, 'palette.label.' + category);
+    });
+
+    $('#palette-collapse-all').on('click', function (e) {
+      e.preventDefault();
+      for (var cat in categoryContainers) {
+        if (categoryContainers.hasOwnProperty(cat)) {
+          categoryContainers[cat].close();
+        }
+      }
+    });
+
+    RED.popover.tooltip(
+      $('#palette-collapse-all'),
+      RED._('palette.actions.collapse-all')
+    );
+
+    $('#palette-expand-all').on('click', function (e) {
+      e.preventDefault();
+      for (var cat in categoryContainers) {
+        if (categoryContainers.hasOwnProperty(cat)) {
+          categoryContainers[cat].open();
+        }
+      }
+    });
+    RED.popover.tooltip(
+      $('#palette-expand-all'),
+      RED._('palette.actions.expand-all')
+    );
+
+    RED.actions.add('core:palette-collapse-all', function (state) {
+      for (var cat in categoryContainers) {
+        if (categoryContainers.hasOwnProperty(cat)) {
+          categoryContainers[cat].close();
+        }
+      }
+    });
+
+    RED.actions.add('core:toggle-palette', function (state) {
+      if (state === undefined) {
+        RED.menu.toggleSelected('menu-item-palette');
+      } else {
+        togglePalette(state);
+      }
+    });
+  }
+  function closePalette() {
+    $('#main-container').addClass('palette-closed');
+  }
+
+  function togglePalette(state) {
+    if (!state) {
+      $('#main-container').addClass('palette-closed');
+      sidebarControls.hide();
+      sidebarControls
+        .find('i')
+        .addClass('fa-chevron-right')
+        .removeClass('fa-chevron-left');
+    } else {
+      $('#main-container').removeClass('palette-closed');
+      sidebarControls
+        .find('i')
+        .removeClass('fa-chevron-right')
+        .addClass('fa-chevron-left');
+    }
+    setTimeout(function () {
+      $(window).resize();
+    }, 200);
+  }
+
+  function getCategories() {
+    var categories = [];
+    $('#palette-container .palette-category').each(function (i, d) {
+      categories.push({ id: $(d).data('category'), label: $(d).data('label') });
+    });
+    return categories;
+  }
+  return {
+    init: init,
+    add: addNodeType,
+    remove: removeNodeType,
+    hide: hideNodeType,
+    show: showNodeType,
+    refresh: refreshNodeTypes,
+    getCategories: getCategories,
+  };
+})();