@kumologica/sdk 3.2.0-beta9 → 4.0.0-alpha2

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

@@ -1,240 +0,0 @@
-RED.terminal = (function () {
-  const DEFAULT_HEIGHT = 180;
-  const MAX_HEIGHT = 900;
-
-  let activeTerminalID = 'terminal-output'; // default first tab
-  let activeTerminalHeight;
-  // Terminals
-  let terminals = [];
-
-  class TerminalWrapper {
-    constructor(id) {
-      const {
-        opts,
-        Terminal,
-        FitAddon,
-        eventEmitter,
-      } = window.__kumologica.editor.terminal;
-      this.id = id;
-      this.eventEmitter = eventEmitter;
-      this.fitAddon = new FitAddon();
-      this.term = new Terminal(opts);
-      // apply the addon
-      this.term.loadAddon(this.fitAddon);
-      this.term.open(this.getElement()[0]);
-      this.term.attachCustomKeyEventHandler(function (e) {
-        // Ctrl + Shift + C
-        if (e.ctrlKey && e.shiftKey && e.keyCode == 3) {
-          document.execCommand('copy');
-          return false;
-        }
-      });
-      this.hide();
-      this.subscribeEvents();
-    }
-    subscribeEvents() {
-      this.eventEmitter.on(`${this.id}`, (data) => {
-        // splitting data by new line character, terminal is not handling
-        // line break without cr (#13#10) (lf instead of crlf).
-        const lines = data.split('\n');
-        for (var i = 0; i < lines.length; i++) {
-          if (lines[i]) {
-            this.term.writeln(lines[i]);
-          }
-        }
-      });
-    }
-    getElement() {
-      return $(`#${this.id}`);
-    }
-    isVisible() {
-      return this.getElement().is(':visible');
-    }
-    show() {
-      this.getElement().show();
-      this.fitAddon.fit();
-    }
-    hide() {
-      this.getElement().hide();
-    }
-    clear() {
-      this.term.clear();
-    }
-    fit() {
-      this.fitAddon.fit();
-    }
-  }
-
-  function init() {
-    initHeader();
-    initTerminals();
-  }
-
-  function resetSelectionClasses(id) {
-    $(`#${id}`).removeClass('terminal-tab-unselected');
-    $(`#${id}`).removeClass('terminal-tab-selected');
-  }
-
-  function selectTabOutput() {
-    // reset
-    resetSelectionClasses('terminal-tab-output');
-    resetSelectionClasses('terminal-tab-cloud');
-    // attach the selection class
-    $('#terminal-tab-output').addClass('terminal-tab-selected');
-    $('#terminal-tab-cloud').addClass('terminal-tab-unselected');
-  }
-
-  function selectTabCloud() {
-    // reset
-    resetSelectionClasses('terminal-tab-output');
-    resetSelectionClasses('terminal-tab-cloud');
-    // attach the selection class
-    $('#terminal-tab-cloud').addClass('terminal-tab-selected');
-    $('#terminal-tab-output').addClass('terminal-tab-unselected');
-  }
-
-  function initHeader() {
-    // Tabs Section
-    // Select the first tab (output)
-    $('#terminal-tab-output').addClass('terminal-tab-selected');
-    $('#terminal-tab-cloud').addClass('terminal-tab-unselected');
-
-    // attach the click events to the headers
-    $('#terminal-tab-output').click((e) => {
-      e.preventDefault();
-      selectTabOutput();
-      showTerminal('terminal-output');
-    });
-
-    $('#terminal-tab-cloud').click((e) => {
-      e.preventDefault();
-      selectTabCloud();
-      showTerminal('terminal-cloud');
-    });
-
-    // Action Section
-    $('#btn-terminal-max').click((e) => {
-      var chartHeight = $('#chart').height();
-      var terminalHeight = $('#terminal-header').height();
-      var extraHeight = 50; // 6 separator, 10 margin
-
-      var deltaToGrow = chartHeight - terminalHeight + extraHeight;
-      var currentHeight = $(`#${activeTerminalID}`).height();
-
-      $(`#${activeTerminalID}`).height(currentHeight + deltaToGrow);
-
-      // update the height of the xterm-screen
-      activeTerminalHeight = MAX_HEIGHT;
-      findTerminalById(`${activeTerminalID}`).fit();
-      // Change the icon to minimize
-      $('#btn-terminal-max').hide();
-      $('#btn-terminal-min').show();
-    });
-
-    $('#btn-terminal-min').click((e) => {
-      $(`#${activeTerminalID}`).height(DEFAULT_HEIGHT);
-      // update the height of the xterm-screen
-      activeTerminalHeight = DEFAULT_HEIGHT;
-      findTerminalById(`${activeTerminalID}`).fit();
-      // Change the icon to minimize
-      $('#btn-terminal-min').hide();
-      $('#btn-terminal-max').show();
-    });
-
-    $('#btn-terminal-close').click((e) => {
-      toggleTerminal();
-    });
-
-    $('#btn-clear-logs').click((e) => {
-      e.preventDefault();
-      let terminal = findTerminalById(activeTerminalID);
-      terminal.clear();
-    });
-  }
-
-  function findTerminalById(id) {
-    for (let i = 0; i < terminals.length; i++) {
-      if (terminals[i].id === id) {
-        return terminals[i].terminal;
-      }
-    }
-    return undefined;
-  }
-
-  function toggleTerminal() {
-     // close terminal via shelve btn
-     $('#shelve-middle').click();
-  }
-
-  function initTerminals() {
-    // Initialize the separator
-    setupTerminalSeparator();
-
-    // Instantiate the terminal (xtermjs)
-    let termOutput = new TerminalWrapper('terminal-output');
-    terminals.push({ id: 'terminal-output', terminal: termOutput });
-
-    //let termCloud = new TerminalWrapper('terminal-cloud');
-    //terminals.push({ id: 'terminal-cloud', terminal: termCloud });
-
-    showTerminal();
-  }
-
-  function showTerminal(id) {
-    let idSelected = id || 'terminal-output';
-    // Show the respective terminal to the given tab
-    let terminalSelected = findTerminalById(idSelected);
-    if (terminalSelected) {
-      if (idSelected === activeTerminalID) {
-        findTerminalById(activeTerminalID).show();
-      } else {
-        let prevTerminalID = activeTerminalID;
-        activeTerminalID = idSelected;
-
-        findTerminalById(prevTerminalID).hide();
-        findTerminalById(activeTerminalID).show();
-      }
-      // set the height of the selected terminal like the previous one
-      console.log('[terminal] activeTerminalID=', activeTerminalID);
-      console.log('[terminal] activeTerminalHeight=', activeTerminalHeight);
-      if (!activeTerminalHeight){
-        activeTerminalHeight = DEFAULT_HEIGHT;
-      }
-
-      $(`#${activeTerminalID}`).height(`${activeTerminalHeight}`);
-      // $(`#${activeTerminalID}`).fit();
-    } else {
-      throw new Error(`Terminal not defined: ${id}`);
-    }
-  }
-
-  function setupTerminalSeparator() {
-    let newHeight;
-    $('#terminal-separator').draggable({
-      axis: 'y',
-      start: function (event, ui) {
-        activeTerminalHeight = $(`#${activeTerminalID}`).height();
-        //$('#terminal-separator').css('top', '4px');
-      },
-      drag: function (event, ui) {
-        // update the height of terminal window
-        newHeight = activeTerminalHeight - ui.position.top;
-        $(`#${activeTerminalID}`).height(newHeight);
-
-        // update the height of the xterm-screen
-        findTerminalById(`${activeTerminalID}`).fit();
-
-        // Keep the separator in his original place
-        ui.position.top = 0;
-      },
-      stop: function (event, ui) {
-        activeTerminalHeight = newHeight;
-        // $('#terminal-separator').css('top', '4px');
-      },
-    });
-  }
-
-  return {
-    init: init,
-  };
-})();

package/src/app/ui/editor-client/src/js/ui/touch/radialMenu.js

@@ -1,170 +0,0 @@
- 
-
-RED.touch = RED.touch||{};
-RED.touch.radialMenu = (function() {
-    
-    
-    var touchMenu = null;
-    var isActive = false;
-    var isOutside = false;
-    var activeOption = null;
-
-    
-    function createRadial(obj,pos,options) {
-        isActive = true;
-        try {
-            var w = $("body").width();
-            var h = $("body").height();
-            
-            touchMenu = d3.select("body").append("div")
-                .style({
-                        position:"absolute",
-                        top: 0,
-                        left:0,
-                        bottom:0,
-                        right:0,
-                        "z-index": 1000
-                })
-                .on('touchstart',function() {
-                    hide();
-                    d3.event.preventDefault();
-                });
-                    
-            
-
-    
-            var menu = touchMenu.append("div")
-                .style({
-                        position: "absolute",
-                        top: (pos[1]-80)+"px",
-                        left:(pos[0]-80)+"px",
-                        "border-radius": "80px",
-                        width: "160px",
-                        height: "160px",
-                        background: "rgba(255,255,255,0.6)",
-                        border: "1px solid #666"
-                });
-                
-            var menuOpts = [];
-            var createMenuOpt = function(x,y,opt) {
-                opt.el = menu.append("div")
-                    .style({
-                        position: "absolute",
-                        top: (y+80-25)+"px",
-                        left:(x+80-25)+"px",
-                        "border-radius": "20px",
-                        width: "50px",
-                        height: "50px",
-                        background: "#fff",
-                        border: "2px solid #666",
-                        "text-align": "center",
-                        "line-height":"50px"
-                    });
-                    
-                opt.el.html(opt.name);
-                
-                if (opt.disabled) {
-                    opt.el.style({"border-color":"#ccc",color:"#ccc"});
-                }
-                opt.x = x;
-                opt.y = y;
-                menuOpts.push(opt);
-                
-                opt.el.on('touchstart',function() {
-                    opt.el.style("background","#999");
-                    d3.event.preventDefault();
-                    d3.event.stopPropagation();
-                });
-                opt.el.on('touchend',function() {
-                    hide();
-                    opt.onselect();
-                    d3.event.preventDefault();
-                    d3.event.stopPropagation();
-                });
-            }
-            
-            var n = options.length;
-            var dang = Math.max(Math.PI/(n-1),Math.PI/4);
-            var ang = Math.PI;
-            for (var i=0;i<n;i++) {
-                var x = Math.floor(Math.cos(ang)*80);
-                var y = Math.floor(Math.sin(ang)*80);
-                if (options[i].name) {
-                    createMenuOpt(x,y,options[i]);
-                }
-                ang += dang;
-            }
-            
-
-            var hide = function() {
-                isActive = false;
-                activeOption = null;
-                touchMenu.remove();
-                touchMenu = null;
-            }
-                    
-            obj.on('touchend.radial',function() {
-                    obj.on('touchend.radial',null);
-                    obj.on('touchmenu.radial',null);
-                    
-                    if (activeOption) {
-                        try {
-                            activeOption.onselect();
-                        } catch(err) {
-                            RED._debug(err);
-                        }
-                        hide();
-                    } else if (isOutside) {
-                        hide();
-                    }
-            });
-
-
-            
-            obj.on('touchmove.radial',function() {
-            try {
-                var touch0 = d3.event.touches.item(0);
-                var p = [touch0.pageX - pos[0],touch0.pageY-pos[1]];
-                for (var i=0;i<menuOpts.length;i++) {
-                    var opt = menuOpts[i];
-                    if (!opt.disabled) {
-                        if (p[0]>opt.x-30 && p[0]<opt.x+30 && p[1]>opt.y-30 && p[1]<opt.y+30) {
-                            if (opt !== activeOption) {
-                                opt.el.style("background","#999");
-                                activeOption = opt;
-                            }
-                        } else if (opt === activeOption) {
-                            opt.el.style("background","#fff");
-                            activeOption = null;
-                        } else {
-                            opt.el.style("background","#fff");
-                        }
-                    }
-                }
-                if (!activeOption) {
-                    var d = Math.abs((p[0]*p[0])+(p[1]*p[1]));
-                    isOutside = (d > 80*80);
-                }
-                
-            } catch(err) {
-                RED._debug(err);
-            }
-
-                
-            });
-            
-        } catch(err) {
-            RED._debug(err);
-        }
-    }    
-
-    
-    return {
-        show: createRadial,
-        active: function() {
-            return isActive;
-        }
-    }
-
-})();
-