@kumologica/sdk 3.2.0-beta9 → 4.0.0-alpha2

package/src/app/ui/editor-client/src/js/ui/common/popover.js

@@ -1,268 +0,0 @@
-RED.popover = (function () {
-  var deltaSizes = {
-    default: {
-      top: 10,
-      topTop: 30,
-      leftRight: 17,
-      leftLeft: 25,
-      leftBottom: 8,
-      leftTop: 11,
-    },
-    small: {
-      top: 6,
-      topTop: 20,
-      leftRight: 8,
-      leftLeft: 26,
-      leftBottom: 8,
-      leftTop: 9,
-    },
-  };
-  function createPopover(options) {
-    var target = options.target;
-    var direction = options.direction || 'right';
-    var trigger = options.trigger;
-    var content = options.content;
-    var delay = options.delay || { show: 750, hide: 50 };
-    var autoClose = options.autoClose;
-    var width = options.width || 'auto';
-    var size = options.size || 'default';
-    if (!deltaSizes[size]) {
-      throw new Error('Invalid RED.popover size value:', size);
-    }
-
-    var timer = null;
-    var active;
-    var div;
-
-    var openPopup = function (instant) {
-      if (active) {
-        div = $('<div class="red-ui-popover"></div>');
-        if (size !== 'default') {
-          div.addClass('red-ui-popover-size-' + size);
-        }
-        if (typeof content === 'function') {
-          var result = content.call(res);
-          if (result === null) {
-            return;
-          }
-          if (typeof result === 'string') {
-            div.text(result);
-          } else {
-            div.append(result);
-          }
-        } else {
-          div.html(content);
-        }
-        if (width !== 'auto') {
-          div.width(width);
-        }
-        div.appendTo('body');
-
-        var targetPos = target.offset();
-        var targetWidth = target.outerWidth();
-        var targetHeight = target.outerHeight();
-        var divHeight = div.height();
-        var divWidth = div.width();
-
-        var viewportTop = $(window).scrollTop();
-        var viewportLeft = $(window).scrollLeft();
-        var viewportBottom = viewportTop + $(window).height();
-        var viewportRight = viewportLeft + $(window).width();
-        var top = 0;
-        var left = 0;
-        var d = direction;
-        if (d === 'right') {
-          top =
-            targetPos.top +
-            targetHeight / 2 -
-            divHeight / 2 -
-            deltaSizes[size].top;
-          left = targetPos.left + targetWidth + deltaSizes[size].leftRight;
-        } else if (d === 'left') {
-          top =
-            targetPos.top +
-            targetHeight / 2 -
-            divHeight / 2 -
-            deltaSizes[size].top;
-          left = targetPos.left - deltaSizes[size].leftLeft - divWidth;
-        } else if (d === 'bottom') {
-          top = targetPos.top + targetHeight + deltaSizes[size].top;
-          left =
-            targetPos.left +
-            targetWidth / 2 -
-            divWidth / 2 -
-            deltaSizes[size].leftBottom;
-          if (left < 0) {
-            d = 'right';
-            top =
-              targetPos.top +
-              targetHeight / 2 -
-              divHeight / 2 -
-              deltaSizes[size].top;
-            left = targetPos.left + targetWidth + deltaSizes[size].leftRight;
-          } else if (left + divWidth > viewportRight) {
-            d = 'left';
-            top =
-              targetPos.top +
-              targetHeight / 2 -
-              divHeight / 2 -
-              deltaSizes[size].top;
-            left = targetPos.left - deltaSizes[size].leftLeft - divWidth;
-            if (top + divHeight + targetHeight / 2 + 5 > viewportBottom) {
-              top -= top + divHeight + targetHeight / 2 - viewportBottom + 5;
-            }
-          } else if (top + divHeight > viewportBottom) {
-            d = 'top';
-            top = targetPos.top - deltaSizes[size].topTop - divHeight;
-            left =
-              targetPos.left +
-              targetWidth / 2 -
-              divWidth / 2 -
-              deltaSizes[size].leftTop;
-          }
-        } else if (d === 'top') {
-          top = targetPos.top - deltaSizes[size].topTop - divHeight;
-          left =
-            targetPos.left +
-            targetWidth / 2 -
-            divWidth / 2 -
-            deltaSizes[size].leftTop;
-          if (top < 0) {
-            d = 'bottom';
-            top = targetPos.top + targetHeight + deltaSizes[size].top;
-            left =
-              targetPos.left +
-              targetWidth / 2 -
-              divWidth / 2 -
-              deltaSizes[size].leftBottom;
-          }
-        }
-        div.addClass('red-ui-popover-' + d).css({ top: top, left: left });
-
-        if (instant) {
-          div.show();
-        } else {
-          div.fadeIn('fast');
-        }
-      }
-    };
-    var closePopup = function (instant) {
-      $(document).off('mousedown.modal-popover-close');
-      if (!active) {
-        if (div) {
-          if (instant) {
-            div.remove();
-          } else {
-            div.fadeOut('fast', function () {
-              $(this).remove();
-            });
-          }
-          div = null;
-        }
-      }
-    };
-
-    if (trigger === 'hover') {
-      target.on('mouseenter', function (e) {
-        clearTimeout(timer);
-        active = true;
-        timer = setTimeout(openPopup, delay.show);
-      });
-      target.on('mouseleave disabled', function (e) {
-        if (timer) {
-          clearTimeout(timer);
-        }
-        if (active) {
-          active = false;
-          setTimeout(closePopup, delay.hide);
-        }
-      });
-    } else if (trigger === 'click') {
-      target.click(function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        active = !active;
-        if (!active) {
-          closePopup();
-        } else {
-          openPopup();
-        }
-      });
-      if (autoClose) {
-        target.on('mouseleave disabled', function (e) {
-          if (timer) {
-            clearTimeout(timer);
-          }
-          if (active) {
-            active = false;
-            setTimeout(closePopup, autoClose);
-          }
-        });
-      }
-    } else if (trigger === 'modal') {
-      $(document).on('mousedown.modal-popover-close', function (event) {
-        var target = event.target;
-        while (target.nodeName !== 'BODY' && target !== div[0]) {
-          target = target.parentElement;
-        }
-        if (target.nodeName === 'BODY') {
-          active = false;
-          closePopup();
-        }
-      });
-    } else if (autoClose) {
-      setTimeout(function () {
-        active = false;
-        closePopup();
-      }, autoClose);
-    }
-    var res = {
-      setContent: function (_content) {
-        content = _content;
-        return res;
-      },
-      open: function (instant) {
-        active = true;
-        openPopup(instant);
-        return res;
-      },
-      close: function (instant) {
-        active = false;
-        closePopup(instant);
-        return res;
-      },
-    };
-    return res;
-  }
-
-  return {
-    create: createPopover,
-    tooltip: function (target, content, action) {
-      var label = content;
-      if (action) {
-        label = function () {
-          var label = content;
-          var shortcut = RED.keyboard.getShortcut(action);
-          if (shortcut && shortcut.key) {
-            label = $(
-              '<span>' +
-                content +
-                ' <span class="red-ui-popover-key">' +
-                RED.keyboard.formatKey(shortcut.key, true) +
-                '</span></span>'
-            );
-          }
-          return label;
-        };
-      }
-      return RED.popover.create({
-        target: target,
-        trigger: 'hover',
-        size: 'small',
-        direction: 'bottom',
-        content: label,
-        delay: { show: 750, hide: 50 },
-      });
-    },
-  };
-})();

package/src/app/ui/editor-client/src/js/ui/common/searchBox.js

@@ -1,98 +0,0 @@
- 
-(function($) {
-
-/**
- * options:
- *   - minimumLength : the minimum length of text before firing a change event
- *   - delay : delay, in ms, after a keystroke before firing change event
- *
- * methods:
- *   - value([val]) - gets the current value, or, if `val` is provided, sets the value
- *   - count - sets or clears a sub-label on the input. This can be used to provide
- *             a feedback on the number of matches, or number of available entries to search
- *   - change - trigger a change event
- *
- */
-
-    $.widget( "nodered.searchBox", {
-        _create: function() {
-            var that = this;
-
-            this.currentTimeout = null;
-            this.lastSent = "";
-            this.element.val("");
-            this.uiContainer = this.element.wrap("<div>").parent();
-            this.uiContainer.addClass("red-ui-searchBox-container");
-
-            $('<i class="fa fa-search"></i>').prependTo(this.uiContainer);
-            this.clearButton = $('<a href="#"><i class="fa fa-times"></i></a>').appendTo(this.uiContainer);
-            this.clearButton.on("click",function(e) {
-                e.preventDefault();
-                that.element.val("");
-                that._change("",true);
-                that.element.focus();
-            });
-
-            this.resultCount = $('<span>',{class:"red-ui-searchBox-resultCount hide"}).appendTo(this.uiContainer);
-
-            this.element.val("");
-            this.element.on("keydown",function(evt) {
-                if (evt.keyCode === 27) {
-                    that.element.val("");
-                }
-            })
-            this.element.on("keyup",function(evt) {
-                that._change($(this).val());
-            });
-
-            this.element.on("focus",function() {
-                $("body").one("mousedown",function() {
-                    that.element.blur();
-                });
-            });
-
-        },
-        _change: function(val,instant) {
-            var fireEvent = false;
-            if (val === "") {
-                this.clearButton.hide();
-                fireEvent = true;
-            } else {
-                this.clearButton.show();
-                fireEvent = (val.length >= (this.options.minimumLength||0));
-            }
-            var current = this.element.val();
-            fireEvent = fireEvent && current !== this.lastSent;
-            if (fireEvent) {
-                if (!instant && this.options.delay > 0) {
-                    clearTimeout(this.currentTimeout);
-                    var that = this;
-                    this.currentTimeout = setTimeout(function() {
-                        that.lastSent = that.element.val();
-                        that._trigger("change");
-                    },this.options.delay);
-                } else {
-                    this._trigger("change");
-                }
-            }
-        },
-        value: function(val) {
-            if (val === undefined) {
-                return this.element.val();
-            } else {
-                this.element.val(val);
-                this._change(val);
-            }
-        },
-        count: function(val) {
-            if (val === undefined || val === null || val === "") {
-                this.resultCount.text("").hide();
-            } else {
-                this.resultCount.text(val).show();
-            }
-        },
-        change: function() {
-            this._trigger("change");
-        }
-    });
-})(jQuery);

package/src/app/ui/editor-client/src/js/ui/common/stack.js

@@ -1,184 +0,0 @@
-RED.stack = (function() {
-  function createStack(options) {
-    var container = options.container;
-    container.addClass('red-ui-stack');
-    var contentHeight = 0;
-    var entries = [];
-
-    var visible = true;
-    // TODO: make this a singleton function - and watch out for stacks no longer
-    //       in the DOM
-    var resizeStack = function() {
-      if (entries.length > 0) {
-        var headerHeight = 0;
-        entries.forEach(function(entry) {
-          headerHeight += entry.header.outerHeight();
-        });
-
-        var height = container.innerHeight();
-        contentHeight = height - headerHeight - (entries.length - 1);
-        entries.forEach(function(e) {
-          e.contentWrap.height(contentHeight);
-        });
-      }
-    };
-    if (options.fill && options.singleExpanded) {
-      $(window).resize(resizeStack);
-      $(window).focus(resizeStack);
-    }
-    return {
-      remove: function(entry) {
-        entries.remove(entry);
-      },
-
-      removeAll: function() {
-        entries = [];
-      },
-
-      add: function(entry) {
-        entries.push(entry);
-        entry.container = $('<div class="palette-category">').appendTo(
-          container
-        );
-        if (!visible) {
-          entry.container.hide();
-        }
-        var header = $('<div class="palette-header"></div>').appendTo(
-          entry.container
-        );
-        entry.header = header;
-        entry.contentWrap = $('<div></div>', {
-          style: 'position:relative'
-        }).appendTo(entry.container);
-        if (options.fill) {
-          entry.contentWrap.css('height', contentHeight);
-        }
-        entry.content = $('<div></div>').appendTo(entry.contentWrap);
-        if (entry.collapsible !== false) {
-          header.click(function() {
-            if (options.singleExpanded) {
-              if (!entry.isExpanded()) {
-                for (var i = 0; i < entries.length; i++) {
-                  if (entries[i].isExpanded()) {
-                    entries[i].collapse();
-                  }
-                }
-                entry.expand();
-              } else if (entries.length === 2) {
-                if (entries[0] === entry) {
-                  entries[0].collapse();
-                  entries[1].expand();
-                } else {
-                  entries[1].collapse();
-                  entries[0].expand();
-                }
-              }
-            } else {
-              entry.toggle();
-            }
-          });
-          var icon = $('<i class="fa fa-angle-down"></i>').appendTo(header);
-
-          if (entry.expanded) {
-            entry.container.addClass('palette-category-expanded');
-            icon.addClass('expanded');
-          } else {
-            entry.contentWrap.hide();
-          }
-        } else {
-          $(
-            '<i style="opacity: 0.5;" class="fa fa-angle-down expanded"></i>'
-          ).appendTo(header);
-          header.css('cursor', 'default');
-        }
-        entry.title = $(`<span id="${entry.titleId}"></span>`)
-          .html(entry.title)
-          .appendTo(header);
-
-        entry.toggle = function() {
-          if (entry.isExpanded()) {
-            entry.collapse();
-            return false;
-          } else {
-            entry.expand();
-            return true;
-          }
-        };
-        entry.expand = function() {
-          if (!entry.isExpanded()) {
-            if (entry.onexpand) {
-              entry.onexpand.call(entry);
-            }
-            if (options.singleExpanded) {
-              entries.forEach(function(e) {
-                if (e !== entry) {
-                  e.collapse();
-                }
-              });
-            }
-
-            icon.addClass('expanded');
-            entry.container.addClass('palette-category-expanded');
-            entry.contentWrap.slideDown(200);
-            return true;
-          }
-        };
-        entry.collapse = function() {
-          if (entry.isExpanded()) {
-            icon.removeClass('expanded');
-            entry.container.removeClass('palette-category-expanded');
-            entry.contentWrap.slideUp(200);
-            return true;
-          }
-        };
-        entry.isExpanded = function() {
-          return entry.container.hasClass('palette-category-expanded');
-        };
-        if (options.fill && options.singleExpanded) {
-          resizeStack();
-        }
-        return entry;
-      },
-
-      hide: function() {
-        visible = false;
-        entries.forEach(function(entry) {
-          entry.container.hide();
-        });
-        return this;
-      },
-
-      expandLastEntry: function() {
-        console.log('[stack] entries=', entries);
-        let numEntries = entries.length;
-        if (numEntries === 0) {
-          return;
-        } else if (numEntries === 1) {
-          entries[0].expand();
-        } else {
-          for (let i = 0; i < numEntries -1; i ++) {
-            entries[i].collapse();
-          }
-          entries[numEntries -1].expand();
-        }
-      },
-
-      show: function() {
-        visible = true;
-        entries.forEach(function(entry) {
-          entry.container.show();
-        });
-        return this;
-      },
-      resize: function() {
-        if (resizeStack) {
-          resizeStack();
-        }
-      }
-    };
-  }
-
-  return {
-    create: createStack
-  };
-})();