@kumologica/sdk 3.2.0-beta9 → 4.0.0-alpha2

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

@@ -1,322 +0,0 @@
- 
-(function($) {
-
-/**
- * options:
- *   - addButton : boolean|string - text for add label, default 'add'
- *   - height : number|'auto'
- *   - resize : function - called when list as a whole is resized
- *   - resizeItem : function(item) - called to resize individual item
- *   - sortable : boolean|string - string is the css selector for handle
- *   - sortItems : function(items) - when order of items changes
- *   - connectWith : css selector of other sortables
- *   - removable : boolean - whether to display delete button on items
- *   - addItem : function(row,index,itemData) - when an item is added
- *   - removeItem : function(itemData) - called when an item is removed
- *   - filter : function(itemData) - called for each item to determine if it should be shown
- *   - sort : function(itemDataA,itemDataB) - called to sort items
- *   - scrollOnAdd : boolean - whether to scroll to newly added items
- * methods:
- *   - addItem(itemData)
- *   - removeItem(itemData)
- *   - width(width)
- *   - height(height)
- *   - items()
- *   - empty()
- *   - filter(filter)
- *   - sort(sort)
- *   - length()
- */
-    $.widget( "nodered.editableList", {
-        _create: function() {
-            var that = this;
-
-            this.element.addClass('red-ui-editableList-list');
-            this.uiWidth = this.element.width();
-            this.uiContainer = this.element
-                .wrap( "<div>" )
-                .parent();
-
-            if (this.options.header) {
-                this.options.header.addClass("red-ui-editableList-header");
-                this.borderContainer = this.uiContainer.wrap("<div>").parent();
-                this.borderContainer.prepend(this.options.header);
-                this.topContainer = this.borderContainer.wrap("<div>").parent();
-            } else {
-                this.topContainer = this.uiContainer.wrap("<div>").parent();
-            }
-            this.topContainer.addClass('red-ui-editableList');
-            if (this.options.class) {
-                this.topContainer.addClass(this.options.class);
-            }
-
-            if (this.options.addButton !== false) {
-                var addLabel;
-                if (typeof this.options.addButton === 'string') {
-                    addLabel = this.options.addButton
-                } else {
-                    addLabel = 'add';
-                }
-                $('<a href="#" class="editor-button editor-button-small red-ui-editableList-addButton" style="margin-top: 4px;"><i class="fa fa-plus"></i> '+addLabel+'</a>')
-                    .appendTo(this.topContainer)
-                    .click(function(evt) {
-                        evt.preventDefault();
-                        that.addItem({});
-                    });
-            }
-            if (this.element.css("position") === "absolute") {
-                ["top","left","bottom","right"].forEach(function(s) {
-                    var v = that.element.css(s);
-                    if (v!=="auto" && v!=="") {
-                        that.topContainer.css(s,v);
-                        that.uiContainer.css(s,"0");
-                        that.element.css(s,'auto');
-                    }
-                })
-                this.element.css("position","static");
-                this.topContainer.css("position","absolute");
-                this.uiContainer.css("position","absolute");
-
-            }
-            if (this.options.header) {
-                this.borderContainer.addClass("red-ui-editableList-border");
-            } else {
-                this.uiContainer.addClass("red-ui-editableList-border");
-            }
-            this.uiContainer.addClass("red-ui-editableList-container");
-
-            this.uiHeight = this.element.height();
-
-            this.activeFilter = this.options.filter||null;
-            this.activeSort = this.options.sort||null;
-            this.scrollOnAdd = this.options.scrollOnAdd;
-            if (this.scrollOnAdd === undefined) {
-                this.scrollOnAdd = true;
-            }
-            var minHeight = this.element.css("minHeight");
-            if (minHeight !== '0px') {
-                this.uiContainer.css("minHeight",minHeight);
-                this.element.css("minHeight",0);
-            }
-            var maxHeight = this.element.css("maxHeight");
-            if (maxHeight !== '0px') {
-                this.uiContainer.css("maxHeight",maxHeight);
-                this.element.css("maxHeight",null);
-            }
-            if (this.options.height !== 'auto') {
-                this.uiContainer.css("overflow-y","scroll");
-                if (!isNaN(this.options.height)) {
-                    this.uiHeight = this.options.height;
-                }
-            }
-            this.element.height('auto');
-
-            var attrStyle = this.element.attr('style');
-            var m;
-            if ((m = /width\s*:\s*(\d+%)/i.exec(attrStyle)) !== null) {
-                this.element.width('100%');
-                this.uiContainer.width(m[1]);
-            }
-            if (this.options.sortable) {
-                var handle = (typeof this.options.sortable === 'string')?
-                                this.options.sortable :
-                                ".red-ui-editableList-item-handle";
-                var sortOptions = {
-                    axis: "y",
-                    update: function( event, ui ) {
-                        if (that.options.sortItems) {
-                            that.options.sortItems(that.items());
-                        }
-                    },
-                    handle:handle,
-                    cursor: "move",
-                    tolerance: "pointer",
-                    forcePlaceholderSize:true,
-                    placeholder: "red-ui-editabelList-item-placeholder",
-                    start: function(e, ui){
-                        ui.placeholder.height(ui.item.height()-4);
-                    }
-                };
-                if (this.options.connectWith) {
-                    sortOptions.connectWith = this.options.connectWith;
-                }
-
-                this.element.sortable(sortOptions);
-            }
-
-            this._resize();
-
-            // this.menu = this._createMenu(this.types, function(v) { that.type(v) });
-            // this.type(this.options.default||this.types[0].value);
-        },
-        _resize: function() {
-            var currentFullHeight = this.topContainer.height();
-            var innerHeight = this.uiContainer.height();
-            var delta = currentFullHeight - innerHeight;
-            if (this.uiHeight !== 0) {
-                this.uiContainer.height(this.uiHeight-delta);
-            }
-            if (this.options.resize) {
-                this.options.resize();
-            }
-            if (this.options.resizeItem) {
-                var that = this;
-                this.element.children().each(function(i) {
-                    that.options.resizeItem($(this).find(".red-ui-editableList-item-content"),i);
-                });
-            }
-        },
-        _destroy: function() {
-        },
-        _refreshFilter: function() {
-            var that = this;
-            var count = 0;
-            if (!this.activeFilter) {
-                return this.element.children().show();
-            }
-            var items = this.items();
-            items.each(function (i,el) {
-                var data = el.data('data');
-                try {
-                    if (that.activeFilter(data)) {
-                        el.parent().show();
-                        count++;
-                    } else {
-                        el.parent().hide();
-                    }
-                } catch(err) {
-                    console.log(err);
-                    el.parent().show();
-                    count++;
-                }
-            });
-            return count;
-        },
-        _refreshSort: function() {
-            if (this.activeSort) {
-                var items = this.element.children();
-                var that = this;
-                items.sort(function(A,B) {
-                    return that.activeSort($(A).find(".red-ui-editableList-item-content").data('data'),$(B).find(".red-ui-editableList-item-content").data('data'));
-                });
-                $.each(items,function(idx,li) {
-                    that.element.append(li);
-                })
-            }
-        },
-        width: function(desiredWidth) {
-            this.uiWidth = desiredWidth;
-            this._resize();
-        },
-        height: function(desiredHeight) {
-            this.uiHeight = desiredHeight;
-            this._resize();
-        },
-        addItem: function(data) {
-            var that = this;
-            data = data || {};
-            var li = $('<li>');
-            var added = false;
-            if (this.activeSort) {
-                var items = this.items();
-                var skip = false;
-                items.each(function(i,el) {
-                    if (added) { return }
-                    var itemData = el.data('data');
-                    if (that.activeSort(data,itemData) < 0) {
-                         li.insertBefore(el.closest("li"));
-                         added = true;
-                    }
-                });
-            }
-            if (!added) {
-                li.appendTo(this.element);
-            }
-            var row = $('<div/>').addClass("red-ui-editableList-item-content").appendTo(li);
-            row.data('data',data);
-            if (this.options.sortable === true) {
-                $('<i class="red-ui-editableList-item-handle fa fa-bars"></i>').appendTo(li);
-                li.addClass("red-ui-editableList-item-sortable");
-            }
-            if (this.options.removable) {
-                var deleteButton = $('<a/>',{href:"#",class:"red-ui-editableList-item-remove editor-button editor-button-small"}).appendTo(li);
-                $('<i/>',{class:"fa fa-remove"}).appendTo(deleteButton);
-                li.addClass("red-ui-editableList-item-removable");
-                deleteButton.click(function(evt) {
-                    evt.preventDefault();
-                    var data = row.data('data');
-                    li.addClass("red-ui-editableList-item-deleting")
-                    li.fadeOut(300, function() {
-                        $(this).remove();
-                        if (that.options.removeItem) {
-                            that.options.removeItem(data);
-                        }
-                    });
-                });
-            }
-            if (this.options.addItem) {
-                var index = that.element.children().length-1;
-                setTimeout(function() {
-                    that.options.addItem(row,index,data);
-                    if (that.activeFilter) {
-                        try {
-                            if (!that.activeFilter(data)) {
-                                li.hide();
-                            }
-                        } catch(err) {
-                        }
-                    }
-
-                    if (!that.activeSort && that.scrollOnAdd) {
-                        setTimeout(function() {
-                            that.uiContainer.scrollTop(that.element.height());
-                        },0);
-                    }
-                },0);
-            }
-        },
-        addItems: function(items) {
-            for (var i=0; i<items.length;i++) {
-                this.addItem(items[i]);
-            }
-        },
-        removeItem: function(data) {
-            var items = this.element.children().filter(function(f) {
-                return data === $(this).find(".red-ui-editableList-item-content").data('data');
-            });
-            items.remove();
-            if (this.options.removeItem) {
-                this.options.removeItem(data);
-            }
-        },
-        items: function() {
-            return this.element.children().map(function(i) { return $(this).find(".red-ui-editableList-item-content"); });
-        },
-        empty: function() {
-            this.element.empty();
-        },
-        filter: function(filter) {
-            if (filter !== undefined) {
-                this.activeFilter = filter;
-            }
-            return this._refreshFilter();
-        },
-        sort: function(sort) {
-            if (sort !== undefined) {
-                this.activeSort = sort;
-            }
-            return this._refreshSort();
-        },
-        length: function() {
-            return this.element.children().length;
-        },
-        show: function(item) {
-            var items = this.element.children().filter(function(f) {
-                return item === $(this).find(".red-ui-editableList-item-content").data('data');
-            });
-            if (items.length > 0) {
-                this.uiContainer.scrollTop(this.uiContainer.scrollTop()+items.position().top)
-            }
-        }
-    });
-})(jQuery);

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

@@ -1,277 +0,0 @@
- 
-RED.menu = (function() {
-  var menuItems = {};
-
-  function createMenuItem(opt) {
-    var item;
-
-    if (opt !== null && opt.id) {
-      var themeSetting = RED.settings.theme('menu.' + opt.id);
-      if (themeSetting === false) {
-        return null;
-      }
-    }
-
-    function setInitialState() {
-      var savedStateActive = RED.settings.get('menu-' + opt.id);
-      if (opt.setting) {
-        // May need to migrate pre-0.17 setting
-
-        if (savedStateActive !== null) {
-          RED.settings.set(opt.setting, savedStateActive);
-          RED.settings.remove('menu-' + opt.id);
-        } else {
-          savedStateActive = RED.settings.get(opt.setting);
-        }
-      }
-      if (savedStateActive) {
-        link.addClass('active');
-        triggerAction(opt.id, true);
-      } else if (savedStateActive === false) {
-        link.removeClass('active');
-        triggerAction(opt.id, false);
-      } else if (opt.hasOwnProperty('selected')) {
-        if (opt.selected) {
-          link.addClass('active');
-        } else {
-          link.removeClass('active');
-        }
-        triggerAction(opt.id, opt.selected);
-      }
-    }
-
-    if (opt === null) {
-      item = $('<li class="divider"></li>');
-    } else {
-      item = $('<li></li>');
-
-      if (opt.group) {
-        item.addClass('menu-group-' + opt.group);
-      }
-      var linkContent =
-        '<a ' +
-        (opt.id ? 'id="' + opt.id + '" ' : '') +
-        'tabindex="-1" href="#">';
-      if (opt.toggle) {
-        linkContent += '<i class="fa fa-square pull-left"></i>';
-        linkContent += '<i class="fa fa-check-square pull-left"></i>';
-      }
-      if (opt.icon !== undefined) {
-        if (/\.png/.test(opt.icon)) {
-          linkContent += '<img src="' + opt.icon + '"/> ';
-        } else {
-          linkContent +=
-            '<i class="' +
-            (opt.icon ? opt.icon : '" style="display: inline-block;"') +
-            '"></i> ';
-        }
-      }
-
-      if (opt.sublabel) {
-        linkContent +=
-          '<span class="menu-label-container"><span class="menu-label">' +
-          opt.label +
-          '</span>' +
-          '<span class="menu-sublabel">' +
-          opt.sublabel +
-          '</span></span>';
-      } else {
-        linkContent += '<span class="menu-label">' + opt.label + '</span>';
-      }
-
-      linkContent += '</a>';
-
-      var link = $(linkContent).appendTo(item);
-
-      menuItems[opt.id] = opt;
-
-      if (opt.onselect) {
-        link.click(function(e) {
-          e.preventDefault();
-          if (
-            $(this)
-              .parent()
-              .hasClass('disabled')
-          ) {
-            return;
-          }
-          if (opt.toggle) {
-            var selected = isSelected(opt.id);
-            if (typeof opt.toggle === 'string') {
-              if (!selected) {
-                for (var m in menuItems) {
-                  if (menuItems.hasOwnProperty(m)) {
-                    var mi = menuItems[m];
-                    if (mi.id != opt.id && opt.toggle == mi.toggle) {
-                      setSelected(mi.id, false);
-                    }
-                  }
-                }
-                setSelected(opt.id, true);
-              }
-            } else {
-              setSelected(opt.id, !selected);
-            }
-          } else {
-            triggerAction(opt.id);
-          }
-        });
-        if (opt.toggle) {
-          setInitialState();
-        }
-      } else if (opt.href) {
-        link.attr('target', '_blank').attr('href', opt.href);
-      } else if (!opt.options) {
-        item.addClass('disabled');
-        link.click(function(event) {
-          event.preventDefault();
-        });
-      }
-      if (opt.options) {
-        item.addClass('dropdown-submenu pull-left');
-        var submenu = $(
-          '<ul id="' + opt.id + '-submenu" class="dropdown-menu"></ul>'
-        ).appendTo(item);
-
-        for (var i = 0; i < opt.options.length; i++) {
-          var li = createMenuItem(opt.options[i]);
-          if (li) {
-            li.appendTo(submenu);
-          }
-        }
-      }
-      if (opt.disabled) {
-        item.addClass('disabled');
-      }
-    }
-
-    return item;
-  }
-  function createMenu(options) {
-    var topMenu = $('<ul/>', { class: 'dropdown-menu pull-right' });
-
-    if (options.id) {
-      topMenu.attr({ id: options.id + '-submenu' });
-      var menuParent = $('#' + options.id);
-      if (menuParent.length === 1) {
-        topMenu.insertAfter(menuParent);
-      }
-    }
-
-    var lastAddedSeparator = false;
-    for (var i = 0; i < options.options.length; i++) {
-      var opt = options.options[i];
-      if (opt !== null || !lastAddedSeparator) {
-        var li = createMenuItem(opt);
-        if (li) {
-          li.appendTo(topMenu);
-          lastAddedSeparator = opt === null;
-        }
-      }
-    }
-    return topMenu;
-  }
-
-  function triggerAction(id, args) {
-    var opt = menuItems[id];
-    //console.log(opt);
-    var callback = opt.onselect;
-    if (typeof opt.onselect === 'string') {
-      callback = RED.actions.get(opt.onselect);
-      //console.log(callback);
-    }
-    if (callback) {
-      callback.call(opt, args);
-    } else {
-      //console.log('No callback for', id, opt.onselect);
-    }
-  }
-
-  function isSelected(id) {
-    return $('#' + id).hasClass('active');
-  }
-
-  function setSelected(id, state) {
-    if (isSelected(id) == state) {
-      return;
-    }
-    var opt = menuItems[id];
-    if (state) {
-      $('#' + id).addClass('active');
-    } else {
-      $('#' + id).removeClass('active');
-    }
-    if (opt && opt.onselect) {
-      triggerAction(opt.id, state);
-    }
-    RED.settings.set(opt.setting || 'menu-' + opt.id, state);
-  }
-
-  function toggleSelected(id) {
-    setSelected(id, !isSelected(id));
-  }
-
-  function setDisabled(id, state) {
-    if (state) {
-      $('#' + id)
-        .parent()
-        .addClass('disabled');
-    } else {
-      $('#' + id)
-        .parent()
-        .removeClass('disabled');
-    }
-  }
-
-  function addItem(id, opt) {
-    var item = createMenuItem(opt);
-    if (opt.group) {
-      var groupItems = $('#' + id + '-submenu').children(
-        '.menu-group-' + opt.group
-      );
-      if (groupItems.length === 0) {
-        item.appendTo('#' + id + '-submenu');
-      } else {
-        for (var i = 0; i < groupItems.length; i++) {
-          var groupItem = groupItems[i];
-          var label = $(groupItem)
-            .find('.menu-label')
-            .html();
-          if (opt.label < label) {
-            $(groupItem).before(item);
-            break;
-          }
-        }
-        if (i === groupItems.length) {
-          item.appendTo('#' + id + '-submenu');
-        }
-      }
-    } else {
-      item.appendTo('#' + id + '-submenu');
-    }
-  }
-  function removeItem(id) {
-    $('#' + id)
-      .parent()
-      .remove();
-  }
-
-  function setAction(id, action) {
-    var opt = menuItems[id];
-    if (opt) {
-      opt.onselect = action;
-    }
-  }
-
-  return {
-    init: createMenu,
-    setSelected: setSelected,
-    isSelected: isSelected,
-    toggleSelected: toggleSelected,
-    setDisabled: setDisabled,
-    addItem: addItem,
-    removeItem: removeItem,
-    setAction: setAction
-    //TODO: add an api for replacing a submenu - see library.js:loadFlowLibrary
-  };
-})();

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

@@ -1,104 +0,0 @@
- 
-
-
-RED.panels = (function() {
-
-    function createPanel(options) {
-        var container = options.container || $("#"+options.id);
-        var children = container.children();
-        if (children.length !== 2) {
-            throw new Error("Container must have exactly two children");
-        }
-        var vertical = (!options.dir || options.dir === "vertical");
-        container.addClass("red-ui-panels");
-        if (!vertical) {
-            container.addClass("red-ui-panels-horizontal");
-        }
-        var separator = $('<div class="red-ui-panels-separator"></div>').insertAfter(children[0]);
-        var startPosition;
-        var panelSizes = [];
-        var modifiedSizes = false;
-        var panelRatio = 0.5;
-        separator.draggable({
-                axis: vertical?"y":"x",
-                containment: container,
-                scroll: false,
-                start:function(event,ui) {
-                    startPosition = vertical?ui.position.top:ui.position.left;
-
-                    panelSizes = [
-                        vertical?$(children[0]).height():$(children[0]).width(),
-                        vertical?$(children[1]).height():$(children[1]).width()
-                    ];
-                },
-                drag: function(event,ui) {
-                    var size = vertical?container.height():container.width();
-                    var delta = (vertical?ui.position.top:ui.position.left)-startPosition;
-                    var newSizes = [panelSizes[0]+delta,panelSizes[1]-delta];
-                    if (vertical) {
-                        $(children[0]).height(newSizes[0]);
-                        $(children[1]).height(newSizes[1]);
-                        ui.position.top -= delta;
-                    } else {
-                        $(children[0]).width(newSizes[0]);
-                        $(children[1]).width(newSizes[1]);
-                        ui.position.left -= delta;
-                    }
-                    if (options.resize) {
-                        options.resize(newSizes[0],newSizes[1]);
-                    }
-                    panelRatio = newSizes[0]/(size-8);
-                },
-                stop:function(event,ui) {
-                    modifiedSizes = true;
-                }
-        });
-
-        var panel = {
-            ratio: function(ratio) {
-                panelRatio = ratio;
-                modifiedSizes = true;
-                if (ratio === 0 || ratio === 1) {
-                    separator.hide();
-                } else {
-                    separator.show();
-                }
-                if (vertical) {
-                    panel.resize(container.height());
-                } else {
-                    panel.resize(container.width());
-                }
-            },
-            resize: function(size) {
-                var panelSizes;
-                if (vertical) {
-                    panelSizes = [$(children[0]).height(),$(children[1]).height()];
-                    container.height(size);
-                } else {
-                    panelSizes = [$(children[0]).width(),$(children[1]).width()];
-                    container.width(size);
-                }
-                if (modifiedSizes) {
-                    var topPanelSize = panelRatio*(size-8);
-                    var bottomPanelSize = size - topPanelSize - 8;
-                    panelSizes = [topPanelSize,bottomPanelSize];
-                    if (vertical) {
-                        $(children[0]).outerHeight(panelSizes[0]);
-                        $(children[1]).outerHeight(panelSizes[1]);
-                    } else {
-                        $(children[0]).outerWidth(panelSizes[0]);
-                        $(children[1]).outerWidth(panelSizes[1]);
-                    }
-                }
-                if (options.resize) {
-                    options.resize(panelSizes[0],panelSizes[1]);
-                }
-            }
-        }
-        return panel;
-    }
-
-    return {
-        create: createPanel
-    }
-})();