janusweb 1.5.30 → 1.5.34

package/media/assets/webui/apps/comms/voip.js

@@ -202,21 +202,19 @@ elation.elements.define('janus-voip-client-hifi', class extends elation.elements
     let localuser = this.parentNode.localuser;
     this.remoteusers[localuser.userid] = localuser;
 
-console.log('create hifi client', this);
     elation.file.get('js', 'https://hifi-spatial-audio-api.s3.amazonaws.com/releases/latest/HighFidelityAudio-latest.js', (ev) => {
       this.connect();
-console.log('FIRE HIFI INIT');
       elation.events.fire({type: 'init', element: this});
     });
     this.roomid = room.voipid || '2bfa2bd1-9338-46c3-b740-e339303a1225';
   }
   async connect() {
     let currentPosition = new HighFidelityAudio.Point3D({ "x": 0, "y": 0, "z": 0 });
-    let currentOrientation = new HighFidelityAudio.OrientationQuat3D({ x: 0, y: 0, z: 0, w: 1});
+    let currentOrientation = new HighFidelityAudio.Quaternion({ x: 0, y: 0, z: 0, w: 1});
 
     let initialHiFiAudioAPIData = new HighFidelityAudio.HiFiAudioAPIData({
       position: currentPosition,
-      orientationQuat: currentOrientation,
+      orientation: currentOrientation,
       providedUserID: player.getNetworkUsername(),
      });
     let hifiCommunicator = new HighFidelityAudio.HiFiCommunicator({ initialHiFiAudioAPIData });
@@ -236,7 +234,6 @@ console.log('voip picker select?', ev);
     });
 */
 
-console.log('new hifi client has existing input stream?', this.inputstream);
     if (this.inputstream) {
       hifiCommunicator.setInputAudioMediaStream(this.inputstream);
     }
@@ -262,12 +259,12 @@ console.log('new hifi client has existing input stream?', this.inputstream);
       }
     });
 
-    elation.events.add(janus.engine, 'engine_frame', ev => this.handleFrameUpdate(ev))
+    elation.events.add(janus.engine, 'engine_frame', ev => this.handleFrameUpdate(ev));
 
     let newUserDataSubscription = new HighFidelityAudio.UserDataSubscription({
       components: [
         HighFidelityAudio.AvailableUserDataSubscriptionComponents.Position,
-        HighFidelityAudio.AvailableUserDataSubscriptionComponents.OrientationQuat,
+        HighFidelityAudio.AvailableUserDataSubscriptionComponents.Orientation,
         HighFidelityAudio.AvailableUserDataSubscriptionComponents.VolumeDecibels
       ],
       callback: audioDataArray => this.handleUserDataSubscription(audioDataArray)
@@ -278,7 +275,7 @@ console.log('new hifi client has existing input stream?', this.inputstream);
 /*
     this.userData = {
       position: currentPosition,
-      orientationQuat: currentOrientation,
+      orientation: currentOrientation,
       providedUserID: player.getNetworkUsername(),
     };
 */
@@ -313,10 +310,10 @@ console.log('new hifi client has existing input stream?', this.inputstream);
       this.userData.position.y = pos.y * scale;
       this.userData.position.z = pos.z * scale;
 
-      this.userData.orientationQuat.x = orientation.x;
-      this.userData.orientationQuat.y = orientation.y;
-      this.userData.orientationQuat.z = orientation.z;
-      this.userData.orientationQuat.w = orientation.w;
+      this.userData.orientation.x = orientation.x;
+      this.userData.orientation.y = orientation.y;
+      this.userData.orientation.z = orientation.z;
+      this.userData.orientation.w = orientation.w;
 
       if (this.hifiCommunicator._currentHiFiAudioAPIData) {
         this.hifiCommunicator.updateUserDataAndTransmit(this.userData);
@@ -371,7 +368,7 @@ elation.elements.define('janus-voip-localuser', class extends elation.elements.b
     this.defineAttribute('userid', { type: 'string', });
     this.defineAttribute('muted', { type: 'boolean', default: true, });
     this.defineAttribute('speaking', { type: 'boolean', default: false });
-
+    this.defineAttribute('threshold', { type: 'float', default: .2 });
   }
   create() {
     this.userid = player.getNetworkUsername();
@@ -433,6 +430,30 @@ elation.elements.define('janus-voip-localuser', class extends elation.elements.b
 */
     this.stream = data;
 
+    let listener = player.engine.systems.sound.getRealListener();
+    let context = listener.context;
+    let analyser = context.createAnalyser();
+    let source = context.createMediaStreamSource(this.stream);
+    source.connect(analyser);
+
+    analyser.fftSize = 32;
+    this.analyser = analyser;
+    this.audiobuffer = new Uint8Array(analyser.frequencyBinCount);
+
+    if (this.updateVolumeInterval) {
+      clearInterval(this.updateVolumeInterval);
+      this.updateVolumeInterval = false;
+    }
+    this.updateVolumeInterval = setInterval(() => {
+      analyser.getByteFrequencyData(this.audiobuffer);
+      let sum = 0;
+      for (let i = 0; i < this.audiobuffer.length; i++) {
+        sum += this.audiobuffer[i];
+      }
+      let avg = sum / this.audiobuffer.length;
+      this.updateVolume(avg / 100);
+    }, 20);
+
 /*
     player.createObject('object', {
       id: 'cone',
@@ -462,15 +483,24 @@ elation.elements.define('janus-voip-localuser', class extends elation.elements.b
     this.averagevolume = (percent * .6 + this.averagevolume * .4)
     if (isNaN(this.averagevolume)) this.averagevolume = 0;
     //this.style.opacity = percent;
-    if (this.averagevolume > .1) {
+    if (this.averagevolume > this.threshold) {
       this.speaking = true;
+      player.defaultanimation = 'speak';
       if (this.colorreset) {
         clearTimeout(this.colorreset);
       } 
       this.colorreset = setTimeout(() => {
         this.speaking = false;
         this.colorreset = false;
+        player.defaultanimation = 'idle';
       }, 200);
+      if (player.ghost) {
+        player.ghost.setSpeakingVolume(this.averagevolume);
+      }
+    } else {
+      if (player.ghost) {
+        player.ghost.setSpeakingVolume(0);
+      }
     }
   }
   
@@ -481,9 +511,9 @@ elation.elements.define('janus-voip-remoteuser', class extends elation.elements.
       'muted': { type: 'boolean', default: false },
       'hasaudio': { type: 'boolean', default: false },
       'hasvideo': { type: 'boolean', default: false },
-      'hasvideo': { type: 'boolean', default: false },
       'averagevolume': { type: 'float', default: 0 },
       'speaking': { type: 'boolean', default: false },
+      'threshold': { type: 'float', default: .2 },
     });
     this.lastposition = V();
     setTimeout(() => this.setAttribute('active', true), 100);
@@ -525,6 +555,30 @@ elation.elements.define('janus-voip-remoteuser', class extends elation.elements.
       this.audio = audio;
       this.appendChild(audio);
       this.hasaudio = true;
+
+      let listener = player.engine.systems.sound.getRealListener();
+      let context = listener.context;
+      let analyser = context.createAnalyser();
+      let source = context.createMediaStreamSource(audio.srcObject);
+      source.connect(analyser);
+
+      analyser.fftSize = 32;
+      this.analyser = analyser;
+      this.audiobuffer = new Uint8Array(analyser.frequencyBinCount);
+
+      if (this.updateVolumeInterval) {
+        clearInterval(this.updateVolumeInterval);
+        this.updateVolumeInterval = false;
+      }
+      this.updateVolumeInterval = setInterval(() => {
+        analyser.getByteFrequencyData(this.audiobuffer);
+        let sum = 0;
+        for (let i = 0; i < this.audiobuffer.length; i++) {
+          sum += this.audiobuffer[i];
+        }
+        let avg = sum / this.audiobuffer.length;
+        this.updateVolume(avg / 100);
+      }, 20);
     }
 
     let remoteuser = janus.network.remoteplayers[this.id];
@@ -603,7 +657,9 @@ elation.elements.define('janus-voip-remoteuser', class extends elation.elements.
 
       elation.events.add(this.remoteuser, 'update', ev => {
         // Store user's last known position so we know where they were once they leave
-        this.remoteuser.localToWorld(this.lastposition.set(0,0,0));
+        if (this.lastposition) {
+          this.remoteuser.localToWorld(this.lastposition.set(0,0,0));
+        }
       });
     }
 
@@ -658,7 +714,7 @@ elation.elements.define('janus-voip-remoteuser', class extends elation.elements.
     if (isNaN(this.averagevolume)) this.averagevolume = 0;
     //this.style.opacity = percent;
 //console.log('update volume', percent, this);
-    if (this.averagevolume > .1) {
+    if (this.averagevolume > this.threshold) {
       this.speaking = true;
       if (this.colorreset) {
         clearTimeout(this.colorreset);
@@ -669,10 +725,9 @@ elation.elements.define('janus-voip-remoteuser', class extends elation.elements.
       }, 200);
     }
 
-    let scale = 1 + this.averagevolume / 2.5;
     if (this.label3d) {
       this.label3d.setAudioVolume(this.averagevolume);
-      this.label3d.scale.set(scale, scale, scale);
+      this.remoteuser.setSpeakingVolume(this.averagevolume);
     }
   }
 });
@@ -685,6 +740,9 @@ elation.elements.define('janus-voip-picker', class extends elation.elements.base
          <!-- li><ui-togglebutton name="video" disabled="1">With my webcam</ui-togglebutton></li -->
        </ul>
     `, this);
+    this.defineAttributes({
+      'showvideo': { type: 'boolean', default: true },
+    });
 
     elation.events.add(this.elements.none, 'click', (ev) => this.handleSelectNone());
     elation.events.add(this.elements.audio, 'click', (ev) => this.handleSelectAudio(ev));
@@ -694,7 +752,7 @@ elation.elements.define('janus-voip-picker', class extends elation.elements.base
     if (this.voipconfig) {
       // FIXME - starting the audio without explicitly asking the user within this session is bad, but we want to resume across refreshes
       //         We should use a session cookie-based timeout in addition to the localStorage settings
-      //this.handleSelectAudio({detail: 1});
+      this.handleSelectAudio({detail: 1});
     }
     console.log('voip picker loaded config', this.voipconfig);
   }
@@ -715,7 +773,7 @@ elation.elements.define('janus-voip-picker', class extends elation.elements.base
     console.log('selected audio', ev.detail, this.voipconfig);
     //janus.engine.systems.sound.enableSound();
     if (!this.subpicker) {
-      this.subpicker = elation.elements.create('janus-voip-picker-audio', { config: (this.voipconfig ? JSON.stringify(this.voipconfig) : false) });
+      this.subpicker = elation.elements.create('janus-voip-picker-audio', { config: (this.voipconfig ? JSON.stringify(this.voipconfig) : false), showvideo: this.showvideo });
       elation.events.add(this.subpicker, 'select', ev => {
 console.log('SELECTED', ev.detail);
         document.dispatchEvent(new CustomEvent('voip-picker-select', { detail: ev.detail }));
@@ -739,8 +797,9 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
   create() {
     this.defineAttributes({
       'config': { type: 'object', default: false },
+      'showvideo': { type: 'boolean', default: true },
     });
-    this.elements = elation.elements.fromString(`
+    let tplstr = `
       <div class="permissions" name="permissions">
         <ui-spinner></ui-spinner>
         Waiting for permission to be granted
@@ -752,20 +811,27 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
           <janus-voip-picker-mictest name="mictest" width="75" height="25"></janus-voip-picker-mictest>
         </li>
         <!-- li><ui-select name="outputDevice" label="Output"></ui-select></li -->
-        <li><ui-toggle name="echoCancellation" label="Echo Cancellation"></ui-toggle></li>
-        <li><ui-toggle name="noiseSuppression" label="Noise Reduction"></ui-toggle></li>
-      </ul>
-      <h3>Video</h3>
-      <ul>
-        <li><ui-toggle name="webcamEnabled" label="Webcam"></ui-toggle></li>
-        <li>
-          <ui-select name="videoDevice" label="Webcam" hidden="1"></ui-select>
-          <janus-voip-picker-videotest name="videotest" width="150" height="150"></janus-voip-picker-videotest>
-        </li>
+        <li><ui-toggle name="echoCancellation" label="Echo Cancellation" checked></ui-toggle></li>
+        <li><ui-toggle name="noiseSuppression" label="Noise Reduction" checked></ui-toggle></li>
       </ul>
+    `;
+  
+    if (this.showvideo && this.showvideo != 'false') {
+       tplstr += `<h3>Video</h3>
+        <ul>
+          <li><ui-toggle name="webcamEnabled" label="Webcam"></ui-toggle></li>
+          <li>
+            <ui-select name="videoDevice" label="Webcam" hidden="1"></ui-select>
+            <janus-voip-picker-videotest name="videotest" width="150" height="150"></janus-voip-picker-videotest>
+          </li>
+        </ul>
+      `;
+    }
+    tplstr += `
       <ui-label name="error" hidden></ui-label>
       <ui-button name="submit">Continue</ui-button>
-    `, this);
+    `;
+    this.elements = elation.elements.fromString(tplstr, this);
 
     if (this.config) {
       console.log('I have a config!', this.config);
@@ -776,7 +842,9 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
     //this.getUserMedia();
 
     this.elements.inputDevice.addEventListener('change', (ev) => this.getUserMedia());
-    this.elements.videoDevice.addEventListener('change', (ev) => this.getUserMedia());
+    if (this.elements.videoDevice) {
+      this.elements.videoDevice.addEventListener('change', (ev) => this.getUserMedia());
+    }
     //this.elements.outputDevice.addEventListener('change', (ev) => this.getUserMedia());
     elation.events.add(this.elements.echoCancellation, 'toggle', (ev) => this.getUserMedia());
     elation.events.add(this.elements.noiseSuppression, 'toggle', (ev) => this.getUserMedia());
@@ -808,11 +876,13 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
 
         // FIXME - I'm not really using these UI elements properly here, I shouldn't be mucking with the HTML elements directly
         inputs.select.innerHTML = '';
-        cameras.select.innerHTML = '';
-        //outputs.select.innerHTML = '';
-
         let hasWebcamPermission = true;
-        let webcamDisabled = elation.elements.create('option', {innerHTML: 'Disabled', value: 'none', append: cameras.select});
+        if (cameras) {
+          cameras.select.innerHTML = '';
+          //outputs.select.innerHTML = '';
+
+          this.webcamDisabledElement = elation.elements.create('option', {innerHTML: 'Disabled', value: 'none', append: cameras.select});
+        }
         devices.forEach(d => {
           if (d.kind == 'audioinput') {
             elation.elements.create('option', {innerHTML: d.label, value: d.deviceId, append: inputs.select});
@@ -826,16 +896,18 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
             elation.elements.create('option', {innerHTML: d.label, value: d.deviceId, append: outputs.select});
           }
         });        
-        if (hasWebcamPermission && this.elements.videoDevice.hidden ) {
-          this.elements.webcamEnabled.hide();
-          this.elements.videoDevice.show();
-          let option = this.elements.videoDevice.select.childNodes[0];
-          option.selected = true;
-          this.elements.videoDevice.select.value = option.value;
-        } else {
-          console.log('NO WEBCAM PERMISSION');
-          this.elements.webcamEnabled.show();
-          this.elements.videoDevice.hide();
+        if (this.elements.videoDevice) {
+          if (hasWebcamPermission && this.elements.videoDevice.hidden ) {
+            this.elements.webcamEnabled.hide();
+            this.elements.videoDevice.show();
+            let option = this.elements.videoDevice.select.childNodes[0];
+            option.selected = true;
+            this.elements.videoDevice.select.value = option.value;
+          } else {
+            console.log('NO WEBCAM PERMISSION');
+            this.elements.webcamEnabled.show();
+            this.elements.videoDevice.hide();
+          }
         }
         this.elements.permissions.style.display = 'none';
 
@@ -845,7 +917,7 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
             //this.elements.inputDevice.select.value = this.voipconfig.inputDevice;
             this.elements.inputDevice.setSelected(voipconfig.inputDevice);
           }
-          if (voipconfig.videoDevice) {
+          if (voipconfig.videoDevice && this.elements.videoDevice) {
             this.elements.videoDevice.setSelected(voipconfig.videoDevice);
           }
           //this.dispatchEvent(new CustomEvent('select', {detail: this.stream})); 
@@ -867,7 +939,7 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
       console.log('input!', this.elements.inputDevice.value);
       constraints.audio.deviceId = { exact: this.elements.inputDevice.value };
     }
-    if (this.elements.videoDevice.value && this.elements.videoDevice.value != 'none') {
+    if (this.elements.videoDevice && this.elements.videoDevice.value && this.elements.videoDevice.value != 'none') {
       console.log('video!', this.elements.videoDevice.value);
       constraints.video = {
         deviceId: { exact: this.elements.videoDevice.value },
@@ -891,7 +963,9 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
       .then(stream => {
         this.elements.submit.disabled = false;
         this.elements.mictest.setStream(stream);
-        this.elements.videotest.setStream(stream);
+        if (this.elements.videotest) {
+          this.elements.videotest.setStream(stream);
+        }
         if (this.stream) {
           let tracks = this.stream.getTracks();
           tracks.forEach(t => {
@@ -928,10 +1002,12 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
     ];
     keys.forEach(k => {
       let el = this.elements[k];
-      if (el instanceof elation.elements.ui.toggle) {
-        settings[k] = this.elements[k].checked;
-      } else {
-        settings[k] = this.elements[k].value;
+      if (this.elements[k]) {
+        if (el instanceof elation.elements.ui.toggle) {
+          settings[k] = this.elements[k].checked;
+        } else {
+          settings[k] = this.elements[k].value;
+        }
       }
     });
     return settings;
@@ -954,8 +1030,8 @@ elation.elements.define('janus-voip-picker-audio', class extends elation.element
       if ('inputDevice' in settings) this.elements['inputDevice'].setSelected(settings['inputDevice']);
       if ('echoCancellation' in settings) this.elements['echoCancellation'].checked = settings['echoCancellation'];
       if ('noiseSuppression' in settings) this.elements['noiseSuppression'].checked = settings['noiseSuppression'];
-      if ('webcamEnabled' in settings) this.elements['webcamEnabled'].checked = settings['webcamEnabled'];
-      if ('videoDevice' in settings) this.elements['videoDevice'].setSelected(settings['videoDevice']);
+      if ('webcamEnabled' in settings && this.elements['webcamEnabled']) this.elements['webcamEnabled'].checked = settings['webcamEnabled'];
+      if ('videoDevice' in settings && this.elements['videoDevice']) this.elements['videoDevice'].setSelected(settings['videoDevice']);
 
       this.currentsettings = settings;
     }

package/media/assets/webui/apps/editor/codemirror/addon/hint/javascript-hint.js

@@ -0,0 +1,162 @@
+// CodeMirror, copyright (c) by Marijn Haverbeke and others
+// Distributed under an MIT license: https://codemirror.net/LICENSE
+
+(function(mod) {
+  if (typeof exports == "object" && typeof module == "object") // CommonJS
+    mod(require("../../lib/codemirror"));
+  else if (typeof define == "function" && define.amd) // AMD
+    define(["../../lib/codemirror"], mod);
+  else // Plain browser env
+    mod(CodeMirror);
+})(function(CodeMirror) {
+  var Pos = CodeMirror.Pos;
+
+  function forEach(arr, f) {
+    for (var i = 0, e = arr.length; i < e; ++i) f(arr[i]);
+  }
+
+  function arrayContains(arr, item) {
+    if (!Array.prototype.indexOf) {
+      var i = arr.length;
+      while (i--) {
+        if (arr[i] === item) {
+          return true;
+        }
+      }
+      return false;
+    }
+    return arr.indexOf(item) != -1;
+  }
+
+  function scriptHint(editor, keywords, getToken, options) {
+    // Find the token at the cursor
+    var cur = editor.getCursor(), token = getToken(editor, cur);
+    if (/\b(?:string|comment)\b/.test(token.type)) return;
+    var innerMode = CodeMirror.innerMode(editor.getMode(), token.state);
+    if (innerMode.mode.helperType === "json") return;
+    token.state = innerMode.state;
+
+    // If it's not a 'word-style' token, ignore the token.
+    if (!/^[\w$_]*$/.test(token.string)) {
+      token = {start: cur.ch, end: cur.ch, string: "", state: token.state,
+               type: token.string == "." ? "property" : null};
+    } else if (token.end > cur.ch) {
+      token.end = cur.ch;
+      token.string = token.string.slice(0, cur.ch - token.start);
+    }
+
+    var tprop = token;
+    // If it is a property, find out what it is a property of.
+    while (tprop.type == "property") {
+      tprop = getToken(editor, Pos(cur.line, tprop.start));
+      if (tprop.string != ".") return;
+      tprop = getToken(editor, Pos(cur.line, tprop.start));
+      if (!context) var context = [];
+      context.push(tprop);
+    }
+    return {list: getCompletions(token, context, keywords, options),
+            from: Pos(cur.line, token.start),
+            to: Pos(cur.line, token.end)};
+  }
+
+  function javascriptHint(editor, options) {
+    return scriptHint(editor, javascriptKeywords,
+                      function (e, cur) {return e.getTokenAt(cur);},
+                      options);
+  };
+  CodeMirror.registerHelper("hint", "javascript", javascriptHint);
+
+  function getCoffeeScriptToken(editor, cur) {
+  // This getToken, it is for coffeescript, imitates the behavior of
+  // getTokenAt method in javascript.js, that is, returning "property"
+  // type and treat "." as independent token.
+    var token = editor.getTokenAt(cur);
+    if (cur.ch == token.start + 1 && token.string.charAt(0) == '.') {
+      token.end = token.start;
+      token.string = '.';
+      token.type = "property";
+    }
+    else if (/^\.[\w$_]*$/.test(token.string)) {
+      token.type = "property";
+      token.start++;
+      token.string = token.string.replace(/\./, '');
+    }
+    return token;
+  }
+
+  function coffeescriptHint(editor, options) {
+    return scriptHint(editor, coffeescriptKeywords, getCoffeeScriptToken, options);
+  }
+  CodeMirror.registerHelper("hint", "coffeescript", coffeescriptHint);
+
+  var stringProps = ("charAt charCodeAt indexOf lastIndexOf substring substr slice trim trimLeft trimRight " +
+                     "toUpperCase toLowerCase split concat match replace search").split(" ");
+  var arrayProps = ("length concat join splice push pop shift unshift slice reverse sort indexOf " +
+                    "lastIndexOf every some filter forEach map reduce reduceRight ").split(" ");
+  var funcProps = "prototype apply call bind".split(" ");
+  var javascriptKeywords = ("break case catch class const continue debugger default delete do else export extends false finally for function " +
+                  "if in import instanceof new null return super switch this throw true try typeof var void while with yield").split(" ");
+  var coffeescriptKeywords = ("and break catch class continue delete do else extends false finally for " +
+                  "if in instanceof isnt new no not null of off on or return switch then throw true try typeof until void while with yes").split(" ");
+
+  function forAllProps(obj, callback) {
+    if (!Object.getOwnPropertyNames || !Object.getPrototypeOf) {
+      for (var name in obj) callback(name)
+    } else {
+      for (var o = obj; o; o = Object.getPrototypeOf(o))
+        Object.getOwnPropertyNames(o).forEach(callback)
+    }
+  }
+
+  function getCompletions(token, context, keywords, options) {
+    var found = [], start = token.string, global = options && options.globalScope || window;
+    function maybeAdd(str) {
+      if (str.lastIndexOf(start, 0) == 0 && !arrayContains(found, str)) found.push(str);
+    }
+    function gatherCompletions(obj) {
+      if (typeof obj == "string") forEach(stringProps, maybeAdd);
+      else if (obj instanceof Array) forEach(arrayProps, maybeAdd);
+      else if (obj instanceof Function) forEach(funcProps, maybeAdd);
+      forAllProps(obj, maybeAdd)
+    }
+
+    if (context && context.length) {
+      // If this is a property, see if it belongs to some object we can
+      // find in the current environment.
+      var obj = context.pop(), base;
+      if (obj.type && obj.type.indexOf("variable") === 0) {
+        if (options && options.additionalContext)
+          base = options.additionalContext[obj.string];
+        if (!options || options.useGlobalScope !== false)
+          base = base || global[obj.string];
+      } else if (obj.type == "string") {
+        base = "";
+      } else if (obj.type == "atom") {
+        base = 1;
+      } else if (obj.type == "function") {
+        if (global.jQuery != null && (obj.string == '$' || obj.string == 'jQuery') &&
+            (typeof global.jQuery == 'function'))
+          base = global.jQuery();
+        else if (global._ != null && (obj.string == '_') && (typeof global._ == 'function'))
+          base = global._();
+      }
+      while (base != null && context.length)
+        base = base[context.pop().string];
+      if (base != null) gatherCompletions(base);
+    } else {
+      // If not, just look in the global object, any local scope, and optional additional-context
+      // (reading into JS mode internals to get at the local and global variables)
+      for (var v = token.state.localVars; v; v = v.next) maybeAdd(v.name);
+      for (var c = token.state.context; c; c = c.prev)
+        for (var v = c.vars; v; v = v.next) maybeAdd(v.name)
+      for (var v = token.state.globalVars; v; v = v.next) maybeAdd(v.name);
+      if (options && options.additionalContext != null)
+        for (var key in options.additionalContext)
+          maybeAdd(key);
+      if (!options || options.useGlobalScope !== false)
+        gatherCompletions(global);
+      forEach(keywords, maybeAdd);
+    }
+    return found;
+  }
+});

package/media/assets/webui/apps/editor/codemirror/addon/hint/show-hint.css

@@ -0,0 +1,36 @@
+.CodeMirror-hints {
+  position: absolute;
+  z-index: 10;
+  overflow: hidden;
+  list-style: none;
+
+  margin: 0;
+  padding: 2px;
+
+  -webkit-box-shadow: 2px 3px 5px rgba(0,0,0,.2);
+  -moz-box-shadow: 2px 3px 5px rgba(0,0,0,.2);
+  box-shadow: 2px 3px 5px rgba(0,0,0,.2);
+  border-radius: 3px;
+  border: 1px solid silver;
+
+  background: white;
+  font-size: 90%;
+  font-family: monospace;
+
+  max-height: 20em;
+  overflow-y: auto;
+}
+
+.CodeMirror-hint {
+  margin: 0;
+  padding: 0 4px;
+  border-radius: 2px;
+  white-space: pre;
+  color: black;
+  cursor: pointer;
+}
+
+li.CodeMirror-hint-active {
+  background: #08f;
+  color: white;
+}