From 225a11132fccc25d5260f1c44e946e3349545e3a Mon Sep 17 00:00:00 2001
From: Thulinma <jaron@vietors.com>
Date: Sat, 14 Feb 2015 00:03:38 +0100
Subject: [PATCH] More LSP updates from Carina.

---
 Makefile                         |   2 +-
 lsp/main.css                     |  44 ++-
 lsp/mist.js                      | 538 ++++++++++++++++++++++++-------
 lsp/plugins/jquery.qrcode.min.js |   2 +
 lsp/server.html                  |   1 +
 src/embed.js                     |   2 +-
 6 files changed, 461 insertions(+), 128 deletions(-)
 create mode 100644 lsp/plugins/jquery.qrcode.min.js

diff --git a/Makefile b/Makefile
index f44ff66b..a702e533 100644
--- a/Makefile
+++ b/Makefile
@@ -179,7 +179,7 @@ MistOutJSON: src/output/mist_out.cpp src/output/output.cpp src/output/output_htt
 	$(CXX) $(LDFLAGS) $(CPPFLAGS) $^ $(LDLIBS) -o $@
 
 lspSOURCES=lsp/plugins/md5.js lsp/plugins/cattablesort.js lsp/mist.js
-lspSOURCESmin=lsp/plugins/jquery.js lsp/plugins/jquery.flot.min.js lsp/plugins/jquery.flot.time.min.js
+lspSOURCESmin=lsp/plugins/jquery.js lsp/plugins/jquery.flot.min.js lsp/plugins/jquery.flot.time.min.js lsp/plugins/jquery.qrcode.min.js
 lspDATA=lsp/header.html lsp/main.css lsp/footer.html
 
 JAVA := $(shell which java 2> /dev/null)
diff --git a/lsp/main.css b/lsp/main.css
index 65247cae..ba9d7aa3 100644
--- a/lsp/main.css
+++ b/lsp/main.css
@@ -258,7 +258,6 @@ main > button {
 }
 textarea {
   font-size: 0.8em;
-  height: 20em;
 }
 .unit {
   color: #777;
@@ -401,13 +400,14 @@ table td.vheader {
   padding: 0.8em 0.2em;
   border-right: 1px solid #ccc;
   background-image: linear-gradient(to left, #ddd, #eee);
+  width: 1.5em;
 }
 table td.vheader span {
   transform: translate( calc(-50% + 0.75em) ) rotate(-90deg);
   transform-origin: 50% 50%;
   white-space: nowrap;
   display: block;
-  width: 1.5em;
+  position: absolute;
 }
 table td, table th, .flextable .td, .flextable .th {
   padding: 0.2em 0.8em;
@@ -589,6 +589,11 @@ input[type=radio] {
   border: 1px solid #ccc;
   padding: 0.5em 1em;
 }
+.legend > .close {
+  position: absolute;
+  top: 0.5em;
+  right: 0.5em;
+}
 .legend-list > label {
   display: block;
 }
@@ -599,6 +604,10 @@ input[type=radio] {
   margin: 0 0.5em;
   box-shadow: 0.1em 0.1em 0.2em rgba(0,0,0,0.2);
 }
+.legend-list .close {
+  position: absolute;
+  right: 0.5em;
+}
 #tooltip {
   position: absolute;
   display: none;
@@ -639,7 +648,36 @@ body:not(.helpme) .input_container .description {
 body:not(.helpme) .input_container .ih_balloon {
   display: none;
 }
-
+#popup {
+  position: fixed;
+  top: 5%;
+  left: 5%;
+  bottom: 5%;
+  right: 5%;
+  border: 1px solid #b4b4b4;
+  background-color: #fff;
+  box-shadow: 0.2em 0.2em 0.5em rgba(0,0,0,0.2);
+  padding: 0.5em;
+  z-index: 10;
+  color: rgba(0,0,0,0.9);
+}
+#popup > .close {
+  position: absolute;
+  top: 0.5em;
+  right: 0.5em;
+}
+.qr_container {
+  display: flex;
+  flex-flow: column nowrap;
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  padding: 1em;
+  box-sizing: border-box;
+}
+.qr_container .qrcode {
+  flex-grow: 1;
+}
 
 @font-face {
   font-family: FuturaICGLight;
diff --git a/lsp/mist.js b/lsp/mist.js
index 7f4ea576..4ccdfb1e 100644
--- a/lsp/mist.js
+++ b/lsp/mist.js
@@ -58,7 +58,26 @@ var UI = {
       helpme: true
     }
   },
-  interval: false,
+  interval: {
+    clear: function(){
+      if (typeof this.opts == 'undefined') {
+        return;
+      }
+      clearInterval(this.opts.id);
+      delete this.opts;
+    },
+    set: function(callback,delay){
+      if (this.opts) {
+        log('[interval]','Set called on interval, but an interval is already active.');
+      }
+      
+      this.opts = {
+        delay: delay,
+        callback: callback
+      };
+      this.opts.id = setInterval(callback,delay);
+    }
+  },
   returnTab: ['Overview'],
   countrylist: {'AF':'Afghanistan','AX':'&Aring;land Islands','AL':'Albania','DZ':'Algeria','AS':'American Samoa','AD':'Andorra',
     'AO':'Angola','AI':'Anguilla','AQ':'Antarctica','AG':'Antigua and Barbuda','AR':'Argentina','AM':'Armenia','AW':'Aruba',
@@ -131,6 +150,20 @@ var UI = {
     },
     element: $('<div>').attr('id','tooltip')
   },
+  popup: {
+    element: null,
+    show: function(content) {
+      this.element = $('<div>').attr('id','popup').append(
+        $('<button>').text('Close').addClass('close').click(function(){
+          UI.popup.element.fadeOut('fast',function(){
+            UI.popup.element.remove();
+            UI.popup.element = null;
+          });
+        })
+      ).append(content);
+      $('body').append(this.element);
+    }
+  },
   menu: [
     {
       Overview: {},
@@ -429,7 +462,7 @@ var UI = {
           $field = $('<div>').addClass('radioselect');
           for (var i in e.radioselect) {
             var $radio = $('<input>').attr('type','radio').val(e.radioselect[i][0]).attr('name',e.label);
-            if (('LTSonly' in e) && (!mist.data.LTS)) {
+            if ((('LTSonly' in e) && (!mist.data.LTS)) || (e.readonly)) {
               $radio.prop('disabled',true);
             }
             var $label = $('<label>').append(
@@ -443,7 +476,7 @@ var UI = {
                 $(this).parent().find('input[type=radio]:enabled').prop('checked','true');
               });
               $label.append($select);
-              if (('LTSonly' in e) && (!mist.data.LTS)) {
+              if ((('LTSonly' in e) && (!mist.data.LTS)) || (e.readonly)) {
                 $select.prop('disabled',true);
               }
               for (var j in e.radioselect[i][2]) {
@@ -486,6 +519,25 @@ var UI = {
           $(this).select();
         });
       }
+      if ('qrcode' in e) {
+        $fc.append(
+          $('<span>').addClass('unit').html(
+            $('<button>').text('QR').click(function(){
+              var text = String($(this).closest('.field_container').find('.field').getval());
+              var $qr = $('<div>').addClass('qrcode');
+              UI.popup.show(
+                $('<span>').addClass('qr_container').append(
+                  $('<p>').text(text)
+                ).append($qr)
+              );
+              $qr.qrcode({
+                text: text,
+                size: Math.min($qr.width(),$qr.height())
+              })
+            })
+          )
+        );
+      }
       if ('rows' in e) {
         $field.attr('rows',e.rows);
       }
@@ -792,7 +844,9 @@ var UI = {
           var f = $(this).data('validate');
           f($(this));
         });
-        $field.trigger('change');
+        if ($field.getval() != '') {
+          $field.trigger('change');
+        }
       }
       
       if ('function' in e) {
@@ -1014,7 +1068,28 @@ var UI = {
     return $c.children();
   },
   plot: {
+    addGraph: function(saveas,$graph_c){
+      var graph = {
+        id: saveas.id,
+        xaxis: saveas.xaxis,
+        datasets: [],
+        elements: {
+          cont: $('<div>').addClass('graph'),
+          plot: $('<div>').addClass('plot'),
+          legend: $('<div>').addClass('legend')
+        }
+      }
+      graph.elements.cont.append(
+        graph.elements.plot
+      ).append(
+        graph.elements.legend
+      );
+      $graph_c.append(graph.elements.cont);
+      return graph;
+    },
     go: function(graphs) {
+      if (Object.keys(graphs).length < 1) { return; }
+      
       //get plotdata
       //build request object
       var reqobj = {
@@ -1093,10 +1168,25 @@ var UI = {
               var $list = $('<div>').addClass('legend-list').addClass('checklist');
               graph.elements.legend.html(
                 $('<h3>').text(graph.id)
+              ).append(
+                $('<button>').data('opts',graph).text('X').addClass('close').click(function(){
+                  var graph = $(this).data('opts');
+                  if (confirm('Are you sure you want to remove '+graph.id+'?')) {
+                    graph.elements.cont.remove();
+                    var $opt = $('.graph_ids option:contains('+graph.id+')');
+                    var $select = $opt.parent();
+                    $opt.remove();
+                    UI.plot.del(graph.id);
+                    delete graphs[graph.id];
+                    $select.trigger('change');
+                    UI.plot.go(graphs);
+                  }
+                })
               ).append($list);
               var plotdata = graph.plot.getOptions();
               for (var i in graph.datasets) {
-                var $checkbox = $('<input>').attr('type','checkbox').data('index',i).click(function(){
+                var $checkbox = $('<input>').attr('type','checkbox').data('index',i).data('graph',graph).click(function(){
+                  var graph = $(this).data('graph');
                   if ($(this).is(':checked')) {
                     graph.datasets[$(this).data('index')].display = true;
                   }
@@ -1117,6 +1207,32 @@ var UI = {
                     $('<div>').addClass('series-color').css('background-color',graph.datasets[i].color)
                   ).append(
                     graph.datasets[i].label
+                  ).append(
+                    $('<button>').text('X').addClass('close').data('index',i).data('graph',graph).click(function(){
+                      var i = $(this).data('index');
+                      var graph = $(this).data('graph');
+                      if (confirm('Are you sure you want to remove '+graph.datasets[i].label+' from '+graph.id+'?')) {
+                        graph.datasets.splice(i,1);
+                        
+                        if (graph.datasets.length == 0) {
+                          graph.elements.cont.remove();
+                          var $opt = $('.graph_ids option:contains('+graph.id+')');
+                          var $select = $opt.parent();
+                          $opt.remove();
+                          $select.trigger('change');
+                          UI.plot.del(graph.id);
+                          delete graphs[graph.id];
+                          UI.plot.go(graphs);
+                        }
+                        else {
+                          UI.plot.save(graph);
+                          
+                          var obj = {};
+                          obj[graph.id] = graph;
+                          UI.plot.go(obj);
+                        }
+                      }
+                    })
                   )
                 );
               }
@@ -1159,6 +1275,29 @@ var UI = {
         }
       },reqobj)
     },
+    save: function(opts){
+      var graph = {
+        id: opts.id,
+        xaxis: opts.xaxis,
+        datasets: []
+      };
+      for (var i in opts.datasets) {
+        graph.datasets.push({
+          origin: opts.datasets[i].origin,
+          datatype: opts.datasets[i].datatype
+        });
+      }
+      
+      var graphs = mist.stored.get().graphs || {};
+      
+      graphs[graph.id] = graph;
+      mist.stored.set('graphs',graphs);
+    },
+    del: function(graphid){
+      var graphs = mist.stored.get().graphs || {};
+      delete graphs[graphid];
+      mist.stored.set('graphs',graphs);
+    },
     datatype: {
       getOptions: function (opts) {
         var general = $.extend(true,{},UI.plot.datatype.templates.general);
@@ -1185,7 +1324,7 @@ var UI = {
         
         //slightly randomize the color
         var color = [];
-        var variation = 75;
+        var variation = 50;
         for (var i in opts.basecolor) {
           var c = opts.basecolor[i];
           c += variation * (0.5 - Math.random());
@@ -1514,20 +1653,38 @@ var UI = {
     }
   },
   navto: function(tab,other){
-    var hash = location.hash.split('@');
+    var prevhash = location.hash;
+    var hash = prevhash.split('@');
     hash[0] = [mist.user.name,mist.user.host].join('&');
     hash[1] = [tab,other].join('&');
     location.hash = hash.join('@');
-    $(window).trigger('hashchange');
-    clearInterval(UI.interval);
+    if (location.hash == prevhash) {
+      //manually trigger hashchange even though hash hasn't changed
+      $(window).trigger('hashchange');
+    }
   },
   showTab: function(tab,other) {
-    UI.elements.menu.css('visibility','visible').find('.button').removeClass('active').filter(function(){
-      if ($(this).find('.plain').text() == tab) { return true; }
-    }).addClass('active');
-    UI.elements.secondary_menu.html('');
     var $main = UI.elements.main;
-    clearInterval(UI.interval);
+    
+    if ((mist.user.loggedin) && (!('ui_settings' in mist.data))) {
+      $main.html('Loading..');
+      mist.send(function(){
+        UI.showTab(tab,other);
+      },{ui_settings: true});
+      return;
+    }
+    
+    var $currbut = UI.elements.menu.css('visibility','visible').find('.button').filter(function(){
+      if ($(this).find('.plain').text() == tab) { return true; }
+    });
+    if ($currbut.length > 0) {
+      //only remove previous button highlight if the current tab is found in the menu
+      UI.elements.menu.find('.button.active').removeClass('active');
+      $currbut.addClass('active');
+    }
+    
+    UI.elements.secondary_menu.html('');
+    UI.interval.clear();
     $main.html(
       $('<h2>').text(tab)
     );
@@ -1793,15 +1950,16 @@ var UI = {
         ]));
         if (mist.data.LTS) {
           function update_update() {
-            if (!('uptodate' in mist.data.update)) {
+            var info = mist.stored.get().update || {};
+            if (!('uptodate' in info)) {
               $versioncheck.text('Unknown');
               return;
             }
-            else if (mist.data.update.error) {
-              $versioncheck.addClass('red').text(mist.data.update.error);
+            else if (info.error) {
+              $versioncheck.addClass('red').text(info.error);
               return;
             }
-            else if (mist.data.update.uptodate) {
+            else if (info.uptodate) {
               $versioncheck.text('Your version is up to date.').addClass('green');
               return;
             }
@@ -1816,10 +1974,11 @@ var UI = {
             }
           }
           
-          if ((!mist.data.update) || (!mist.data.update.lastchecked) || ((new Date()).getTime()-mist.data.update.lastchecked > 3600e3)) {
-            if (!('update' in mist.data)) { mist.data.update = {}; }
-            mist.data.update.lastchecked = (new Date()).getTime();
+          if ((!mist.stored.get().update) || ((new Date()).getTime()-mist.stored.get().update.lastchecked > 24*3600e3)) {
+            var update = mist.stored.get().update || {};
+            update.lastchecked = (new Date()).getTime();
             mist.send(function(d){
+              mist.stored.set('update',$.extend(true,update,d.update));
               update_update();
             },{checkupdate: true});
           }
@@ -1848,7 +2007,7 @@ var UI = {
           else {
             var active = '?';
           }
-          $streamsonline.text(active+' active, '+Object.keys(mist.data.streams).length+' configured');
+          $streamsonline.text(active+' active, '+(mist.data.streams ? Object.keys(mist.data.streams).length : 0)+' configured');
           if (('totals' in mist.data) && ('all_streams' in mist.data.totals)) {
             var clients = mist.data.totals.all_streams.all_protocols.clients;
             clients = (clients.length ? UI.format.number(clients[clients.length-1][1]) : 0);
@@ -1861,7 +2020,7 @@ var UI = {
         }
         updateViewers();
         enterStats();
-        UI.interval = setInterval(updateViewers,30e3);
+        UI.interval.set(updateViewers,30e3);
         
         break;
       case 'Protocols':
@@ -1953,7 +2112,7 @@ var UI = {
           }
         }
         updateProtocols();
-        UI.interval = setInterval(function(){
+        UI.interval.set(function(){
           mist.send(function(){
             updateProtocols();
           });
@@ -1993,6 +2152,9 @@ var UI = {
                   mist.data.config.protocols[other] = saveas;
                 }
                 else {
+                  if (!mist.data.config.protocols) {
+                    mist.data.config.protocols = [];
+                  }
                   mist.data.config.protocols.push(saveas);
                 }
                 mist.send(function(d){
@@ -2177,7 +2339,7 @@ var UI = {
               $('<tr>').data('index',streamname).html(
                 $('<td>').html(streamnamelabel).attr('title',streamname).addClass('overflow_ellipsis')
               ).append(
-                $('<td>').text(stream.source).addClass('description')
+                $('<td>').text(stream.source).attr('title',stream.source).addClass('description').addClass('overflow_ellipsis').css('max-width','20em')
               ).append(
                 $('<td>').data('sort-value',stream.online).html(UI.format.status(stream))
               ).append(
@@ -2231,13 +2393,16 @@ var UI = {
           for (var s in mist.data.streams) {
             if (mist.inputMatch(mist.data.capabilities.inputs.Folder.source_match,mist.data.streams[s].source)) {
               //this is a folder stream
-              mist.send(function(){
+              allstreams[s].source += '*';
+              mist.send(function(d,opts){
+                var s = opts.stream;
                 for (var i in mist.data.browse.files) {
                   for (var j in mist.data.capabilities.inputs) {
                     if ((j == 'Buffer') || (j == 'Folder')) { continue; }
                     if (mist.inputMatch(mist.data.capabilities.inputs[j].source_match,'/'+mist.data.browse.files[i])) {
                       var streamname = s+'+'+mist.data.browse.files[i];
                       allstreams[streamname] = createWcStreamObject(streamname,mist.data.streams[s]);
+                      allstreams[streamname].source = mist.data.streams[s].source+mist.data.browse.files[i];
                     }
                   }
                 }
@@ -2247,11 +2412,11 @@ var UI = {
                     updateStreams();
                   },{active_streams: true});
                   
-                  UI.interval = setInterval(function(){
+                  UI.interval.set(function(){
                     updateStreams();
                   },30e3);
                 }
-              },{browse:mist.data.streams[s].source});
+              },{browse:mist.data.streams[s].source},{stream: s});
               browserequests++;
             }
           }
@@ -2260,7 +2425,7 @@ var UI = {
               updateStreams();
             },{active_streams: true});
             
-            UI.interval = setInterval(function(){
+            UI.interval.set(function(){
               updateStreams();
             },30e3);
           }
@@ -2270,7 +2435,7 @@ var UI = {
             updateStreams();
           },{active_streams: true});
           
-          UI.interval = setInterval(function(){
+          UI.interval.set(function(){
             updateStreams();
           },30e3);
         }
@@ -2407,6 +2572,10 @@ var UI = {
                 type: 'save',
                 label: 'Save',
                 'function': function(){
+                  if (!mist.data.streams) {
+                    mist.data.streams = {};
+                  }
+                  
                   mist.data.streams[saveas.name] = saveas;
                   if (other != saveas.name) {
                     delete mist.data.streams[other];
@@ -2580,6 +2749,20 @@ var UI = {
           return retobj;
         }
         var embedbase = 'http://'+parseURL(mist.user.host).host+http_port+'/';
+        var embedoptions = {};
+        function embedhtml(opts) {
+          var open = ['div'];
+          var inner = "\n"+'   <script src="'+embedbase+'embed_'+other+'.js"><'+'/script>'+"\n"; //don't leave the closing script tag complete
+          if (opts.autoplay) {
+            open.push('data-autoplay');
+          }
+          if ((opts.forceprotocol) && (opts.forceprotocol != '')) {
+            open.push('data-forcetype="'+opts.forceprotocol+'"');
+          }
+          return '<'+open.join(' ')+'>'+inner+'</div>';
+        }
+        
+        var $protocolurls = $('<span>');
         $embedlinks.append(
           $('<h3>').text('Embed urls')
         ).append(UI.buildUI([
@@ -2587,21 +2770,49 @@ var UI = {
             label: 'Embed url',
             type: 'str',
             value: embedbase+'embed_'+other+'.js',
-            readonly: true
-          },{
-            label: 'Embed code',
-            type: 'textarea',
-            value: '<div>'+"\n"+'   <"+"script src="'+embedbase+'embed_'+other+'.js"><"+"/script>'+"\n"+'</div>',
-            rows: 4,
-            readonly: true
+            readonly: true,
+            qrcode: true
           },{
             label: 'Info url',
             type: 'str',
             value: embedbase+'info_'+other+'.js',
+            qrcode: true,
             readonly: true
-          }
+          },$('<h3>').text('Embed code'),{
+            label: 'Embed code',
+            type: 'textarea',
+            value: embedhtml(embedoptions),
+            rows: 4,
+            readonly: true,
+            classes: ['embed_code']
+          },$('<h4>').text('Embed code options').css('margin-top',0),{
+            label: 'Autoplay',
+            type: 'checkbox',
+            pointer: {
+              main: embedoptions,
+              index: 'autoplay'
+            },
+            'function': function(){
+              embedoptions.autoplay = $(this).getval();
+              $('.embed_code').setval(embedhtml(embedoptions));
+            }
+          },{
+            label: 'Force protocol',
+            type: 'select',
+            select: [['','Automatic']],
+            pointer: {
+              main: embedoptions,
+              index: 'protocol'
+            },
+            classes: ['embed_code_forceprotocol'],
+            'function': function(){
+              embedoptions.forceprotocol = $(this).getval();
+              $('.embed_code').setval(embedhtml(embedoptions));
+            }
+          },$('<h3>').text('Protocol stream urls'),$protocolurls
         ]));
         
+        
         var $trackinfo = $('<span>').append(
           $('<h3>').text('Meta information')
         ).hide();
@@ -2714,7 +2925,7 @@ var UI = {
         var $protocols = $('<div>').css('float','left');
         $preview.append($video).append($protocols);
         
-        if (UI.stored.vars.autoplay) {
+        if (mist.stored.get().autoplay) {
           $video.attr('data-autoplay','');
         }
         
@@ -2726,26 +2937,37 @@ var UI = {
           var script = document.createElement('script');
           script.src = embedbase+'embed_'+other+'.js';
           script.onerror = function(){
-            $video.text('Error loading "'+script.src+'".');
+            $video.html('Error loading "'+script.src+'".<br>').append(
+              $('<button>').text('Try again').click(function(){
+                loadVideo();
+              })
+            );
+            $protocols.text('');
           };
           script.onload = function(){
             if (typeof mistvideo[other].error != 'undefined') {
-              $video.text(mistvideo[other].error);
+              $video.html(mistvideo[other].error+'"<br>').append(
+                $('<button>').text('Try again').click(function(){
+                  loadVideo();
+                })
+              );
+              $protocols.text('');
               return;
             }
             
             var vid = mistvideo[other];
             var $url = UI.buildUI([{
-              label: 'Stream embed url',
+              label: 'Protocol stream url',
               type: 'str',
               readonly: true,
-              value: (vid.embedded ? vid.embedded.url : '')
+              value: (vid.embedded ? vid.embedded.url : ''),
+              qrcode: true
             },{
               label: 'Autoplay (from now on)',
               type: 'checkbox',
-              value: UI.stored.vars.autoplay,
+              value: mist.stored.get().autoplay,
               'function': function(){
-                UI.stored.saveOpt('autoplay',$(this).getval());
+                mist.stored.set('autoplay',($(this).getval() ? 1 : 0));
               }
             }]);
             $url.find('.help_container').remove();
@@ -2771,48 +2993,72 @@ var UI = {
             $protocols.html($table);
             var $tbody = $('<tbody>');
             $table.append($tbody);
+            var $protoselect = $('.embed_code_forceprotocol');
+            var buildurls = [];
+            $protoselect.find('.clear').remove();
             for (var i in vid.source) {
               var source = vid.source[i];
               var type = source.type.split('/');
               var humantype = type[0];
+              if (humantype.length < 6) {
+                humantype = humantype.toUpperCase();
+              }
               switch (type.length) {
                 case 1:
                   break;
                 case 2:
-                  humantype += ' v'+type[1];
+                  humantype = UI.format.capital(type[0])+' v'+type[1];
                   if (type[0] == 'flash') {
                     switch (type[1]) {
                       case '7':
-                        humantype = 'Progressive ('+humantype.charAt(0).toUpperCase()+humantype.slice(1)+')';
+                        humantype = 'Progressive ('+humantype+')';
                         break;
                       case '10':
-                        humantype = 'RTMP ('+humantype.charAt(0).toUpperCase()+humantype.slice(1)+')';
+                        humantype = 'RTMP ('+humantype+')';
                         break;
                       case '11':
-                        humantype = 'HDS ('+humantype.charAt(0).toUpperCase()+humantype.slice(1)+')';
+                        humantype = 'HDS ('+humantype+')';
                         break;
                     }
                   }
                   break;
                 case 3:
                   switch (type[2]) {
-                    case 'mp4':
-                      humantype += ' MP4';
-                      break;
                     case 'vnd.apple.mpegurl':
                       humantype += ' HLS';
                       break;
                     case 'vnd.ms-ss':
                       humantype += ' Smooth';
                       break;
+                    case 'mp2t':
+                      humantype += ' TS';
+                      break;
                     default:
-                      humantype = source.type;
+                      if (type[2].length < 6) {
+                        type[2] = type[2].toUpperCase();
+                      }
+                      humantype += ' '+type[2];
+                      if (type[1] != 'video') {
+                        humantype += ' ('+type[1]+')';
+                      }
                   }
                   break;
                 default:
                   humantype = source.type;
               }
               humantype = UI.format.capital(humantype);
+              
+              $protoselect.append(
+                $('<option>').text(humantype).val(source.type).addClass('clear')
+              );
+              buildurls.push({
+                label: humantype,
+                type: 'str',
+                value: source.url,
+                readonly: true,
+                qrcode: true
+              });
+              
               var $tr = $('<tr>');
               $tbody.append($tr);
               $tr.html(
@@ -2836,6 +3082,9 @@ var UI = {
                 $tr.find('input[type=radio]').prop('checked',true);
               }
             }
+            $protocolurls.html(
+              UI.buildUI(buildurls)
+            );
           };
           $video.html('')[0].appendChild(script);
         }
@@ -2908,10 +3157,7 @@ var UI = {
             ['server','The entire server'],
             ['stream','The stream:',thestreams]
           ];
-          if ((UI.returnTab[0] == 'Edit Stream') && (UI.returnTab[1])) {
-            var value = ['stream',UI.returnTab[1]];
-          }
-          build.push({
+          var appliesto = {
             label: 'Applies to',
             type: 'radioselect',
             radioselect: select,
@@ -2920,9 +3166,13 @@ var UI = {
               index: 'applies_to'
             },
             LTSonly: true,
-            validate: ['required'],
-            value: value
-          });
+            validate: ['required']
+          };
+          if ((UI.returnTab[0] == 'Edit Stream') && (UI.returnTab[1])) {
+            appliesto.value = ['stream',UI.returnTab[1]];
+            appliesto.readonly = true;
+          }
+          build.push(appliesto);
         }
         else {
           var pointer = other.split('^');
@@ -3049,7 +3299,7 @@ var UI = {
                   delete saveas.applies_to;
                   switch (pointer[0]) {
                     case 'server':
-                      if (typeof mist.data.config.limits == 'undefined') {
+                      if (!mist.data.config.limits) {
                         mist.data.config.limits = [];
                       }
                       mist.data.config.limits.push(saveas);
@@ -3103,7 +3353,7 @@ var UI = {
           value: 30,
           'function': function(){
             clearInterval(UI.interval);
-            UI.interval = setInterval(function(){
+            UI.interval.set(function(){
               mist.send(function(){
                 buildLogsTable();
               });
@@ -3166,7 +3416,7 @@ var UI = {
         $main.append($UI);
         
         var saveas = {};
-        var graphs = {};
+        var graphs = (mist.stored.get().graphs ? $.extend(true,{},mist.stored.get().graphs) : {});
         
         var thestreams = {};
         //let's not bother with folder streams, if they aren't active anyway
@@ -3205,18 +3455,38 @@ var UI = {
             'function': function(){
               if (! $(this).val()) { return; }
               var $s = $UI.find('.graph_xaxis');
+              var $id = $UI.find('.graph_id');
               if ($(this).val() == 'new') {
                 $s.children('option').prop('disabled',false);
+                $id.setval('Graph '+(Object.keys(graphs).length +1)).closest('label').show();
               }
               else {
                 var xaxistype = graphs[$(this).val()].xaxis;
                 $s.children('option').prop('disabled',true).filter('[value="'+xaxistype+'"]').prop('disabled',false);
+                $id.closest('label').hide();
               }
               if ($s.children('option[value="'+$s.val()+'"]:disabled').length) {
                 $s.val($s.children('option:enabled').first().val());
-                $s.trigger('change');
               }
+              $s.trigger('change');
             }
+          },{
+            label: 'Graph id',
+            type: 'str',
+            pointer: {
+              main: saveas,
+              index: 'id'
+            },
+            classes: ['graph_id'],
+            validate: [function(val,me){
+              if (val in graphs) {
+                return { 
+                  msg:'This graph id has already been used. Please enter something else.',
+                  classes: ['red']
+                }
+              }
+              return false;
+            }]
           },{
             label: 'Axis type',
             type: 'select',
@@ -3239,7 +3509,7 @@ var UI = {
                   $s.children('option').prop('disabled',false).filter('[value="coords"]').prop('disabled',true);
                   break;
               }
-              if ($s.children('option[value="'+$s.val()+'"]:disabled').length) {
+              if ((!$s.val()) || ($s.children('option[value="'+$s.val()+'"]:disabled').length)) {
                 $s.val($s.children('option:enabled').first().val());
                 $s.trigger('change');
               }
@@ -3294,24 +3564,10 @@ var UI = {
               type: 'save',
               'function': function(){
                 //the graph options
+                var graph;
                 if (saveas.graph == 'new') {
-                  var graph = {
-                    id: 'Graph '+(Object.keys(graphs).length+1),
-                    xaxis: saveas.xaxis,
-                    datasets: [],
-                    elements: {
-                      cont: $('<div>').addClass('graph'),
-                      plot: $('<div>').addClass('plot'),
-                      legend: $('<div>').addClass('legend')
-                    }
-                  }
+                  graph = UI.plot.addGraph(saveas,$graph_c);
                   graphs[graph.id] = graph;
-                  graph.elements.cont.append(
-                    graph.elements.plot
-                  ).append(
-                    graph.elements.legend
-                  );
-                  $graph_c.append(graph.elements.cont);
                   $UI.find('select.graph_ids').append(
                     $('<option>').text(graph.id)
                   ).val(graph.id).trigger('change');
@@ -3325,20 +3581,42 @@ var UI = {
                   origin: saveas.origin
                 });
                 graph.datasets.push(opts);
+                UI.plot.save(graph);
                 UI.plot.go(graphs);
               }
             }]
           }]));
-          $UI.find('.graph_xaxis').trigger('change');
           
           var $graph_c = $('<div>').addClass('graph_container');
           $main.append($graph_c);
           
-        },{active_streams: true, capabilities: true});
-        
-        UI.interval = setInterval(function(){
+          var $graph_ids = $UI.find('select.graph_ids');
+          for (var i in graphs) {
+            var graph = UI.plot.addGraph(graphs[i],$graph_c);
+            $graph_ids.append(
+              $('<option>').text(graph.id)
+            ).val(graph.id);
+            
+            //the dataset options
+            var datasets = [];
+            for (var j in graphs[i].datasets) {
+              var opts = UI.plot.datatype.getOptions({
+                datatype: graphs[i].datasets[j].datatype,
+                origin: graphs[i].datasets[j].origin
+              });
+              datasets.push(opts);
+            }
+            graph.datasets = datasets;
+            graphs[graph.id] = graph;
+          }
+          $graph_ids.trigger('change');
           UI.plot.go(graphs);
-        },10e3);
+          
+          UI.interval.set(function(){
+            UI.plot.go(graphs);
+          },10e3);
+          
+        },{active_streams: true, capabilities: true});
         
         break;
       case 'Server Stats':
@@ -3411,21 +3689,13 @@ var UI = {
             vheader: 'Load average',
             labels: ['1 minute','5 minutes','15 minutes',''],
             content: [{
-              header: 'Absolute',
+              header: '&nbsp;',
               body: [
                 UI.format.number(load.one/100),
                 UI.format.number(load.five/100),
                 UI.format.number(load.fifteen/100),
                 ''
               ]
-            },{
-              header: 'Per core',
-              body: [
-                UI.format.addUnit(load.one/cores,'%'),
-                UI.format.addUnit(load.five/cores,'%'),
-                UI.format.addUnit(load.fifteen/cores,'%'),
-                ''
-              ]
             }]
           };
           var nload = UI.buildVheaderTable(loading);
@@ -3453,7 +3723,7 @@ var UI = {
           )
         );
         
-        UI.interval = setInterval(function(){
+        UI.interval.set(function(){
           mist.send(function(){
             buildstattables();
           },{capabilities: true});
@@ -3509,6 +3779,7 @@ var UI = {
             }
           },{
             type: 'textarea',
+            rows: 20,
             label: 'Your message',
             validate: ['required'],
             pointer: {
@@ -3517,6 +3788,7 @@ var UI = {
             }
           },{
             type: 'textarea',
+            rows: 20,
             label: 'Your config file',
             readonly: true,
             value: config,
@@ -3565,7 +3837,7 @@ var mist = {
   user: {
     name: '',
     password: '',
-    host: 'http://localhost:4242/api'
+    host: 'http://'+(location.hostname ? location.hostname : 'localhost')+':4242/api'
   },
   send: function(callback,sendData,opts){
     sendData = sendData || {};
@@ -3591,34 +3863,36 @@ var mist = {
       timeout: opts.timeout*1000,
       async: true,
       error: function(jqXHR,textStatus,errorThrown){
-          //connection failed
-          
-          if (!opts.hide) {
-            switch (textStatus) {
-              case 'timeout':
-                textStatus = $('<i>').text('The connection timed out. ');
-                break;
-              case 'abort':
-                textStatus = $('<i>').text('The connection was aborted. ');
-                break;
-              default:
-                textStatus = $('<i>').text(textStatus+'. ').css('text-transform','capitalize');
-            }
-            $('#message').addClass('red').text('An error occurred while attempting to communicate with MistServer:').append(
-              $('<br>')
-            ).append(
-              textStatus
-            ).append(
-              $('<a>').text('Send server request again').click(function(){
-                mist.send(callback,sendData,opts);
-              })
-            );
+        //connection failed
+        delete mist.user.loggedin;
+        
+        if (!opts.hide) {
+          switch (textStatus) {
+            case 'timeout':
+              textStatus = $('<i>').text('The connection timed out. ');
+              break;
+            case 'abort':
+              textStatus = $('<i>').text('The connection was aborted. ');
+              break;
+            default:
+              textStatus = $('<i>').text(textStatus+'. ').css('text-transform','capitalize');
           }
-          
-          UI.navto('Login');
+          $('#message').addClass('red').text('An error occurred while attempting to communicate with MistServer:').append(
+            $('<br>')
+          ).append(
+            textStatus
+          ).append(
+            $('<a>').text('Send server request again').click(function(){
+              mist.send(callback,sendData,opts);
+            })
+          );
+        }
+        
+        UI.navto('Login');
       },
       success: function(d){
-        log('Received',$.extend(true,{},d));
+        log('Receive',$.extend(true,{},d));
+        delete mist.user.loggedin;
         switch (d.authorize.status) {
           case 'OK':
             //communication succesfull
@@ -3747,7 +4021,7 @@ var mist = {
               }
             }
             
-            if (callback) { callback(d); }
+            if (callback) { callback(d,opts); }
             break;
           case 'CHALL':
             if (d.authorize.challenge == mist.user.authstring) {
@@ -3862,6 +4136,24 @@ var mist = {
       }
     }
     return build;
+  },
+  stored: {
+    get: function(){
+      return mist.data.ui_settings || {};
+    },
+    set: function(name,val){
+      var settings = this.get();
+      settings[name] = val;
+      mist.send(function(){
+        
+      },{ui_settings: settings});
+    },
+    del: function(name){
+      delete mist.data.ui_settings[name];
+      mist.send(function(){
+        
+      },{ui_settings: mist.data.ui_settings});
+    }
   }
 };
 
diff --git a/lsp/plugins/jquery.qrcode.min.js b/lsp/plugins/jquery.qrcode.min.js
new file mode 100644
index 00000000..6e2dbcde
--- /dev/null
+++ b/lsp/plugins/jquery.qrcode.min.js
@@ -0,0 +1,2 @@
+/* jQuery.qrcode 0.11.0 - http://larsjung.de/jquery-qrcode/ - uses //github.com/kazuhikoarase/qrcode-generator (MIT) */
+!function(){"use strict";function r(r,t,e,n){function o(r,t){return r-=n,t-=n,0>r||r>=a||0>t||t>=a?!1:i.isDark(r,t)}var i=y(e,t);i.addData(r),i.make(),n=n||0;var a=i.getModuleCount(),u=i.getModuleCount()+2*n,f=function(r,t,e,n){var o=this.isDark,i=1/u;this.isDark=function(a,u){var f=u*i,l=a*i,c=f+i,g=l+i;return o(a,u)&&(r>c||f>e||t>g||l>n)}};this.text=r,this.level=t,this.version=e,this.moduleCount=u,this.isDark=o,this.addBlank=f}function t(t,e,n,o,i){n=Math.max(1,n||1),o=Math.min(40,o||40);for(var a=n;o>=a;a+=1)try{return new r(t,e,a,i)}catch(u){}}function e(r,t,e){var n=e.size,o="bold "+e.mSize*n+"px "+e.fontname,i=d("<canvas/>")[0].getContext("2d");i.font=o;var a=i.measureText(e.label).width,u=e.mSize,f=a/n,l=(1-f)*e.mPosX,c=(1-u)*e.mPosY,g=l+f,s=c+u,h=.01;1===e.mode?r.addBlank(0,c-h,n,s+h):r.addBlank(l-h,c-h,g+h,s+h),t.fillStyle=e.fontcolor,t.font=o,t.fillText(e.label,l*n,c*n+.75*e.mSize*n)}function n(r,t,e){var n=e.size,o=e.image.naturalWidth||1,i=e.image.naturalHeight||1,a=e.mSize,u=a*o/i,f=(1-u)*e.mPosX,l=(1-a)*e.mPosY,c=f+u,g=l+a,s=.01;3===e.mode?r.addBlank(0,l-s,n,g+s):r.addBlank(f-s,l-s,c+s,g+s),t.drawImage(e.image,f*n,l*n,u*n,a*n)}function o(r,t,o){d(o.background).is("img")?t.drawImage(o.background,0,0,o.size,o.size):o.background&&(t.fillStyle=o.background,t.fillRect(o.left,o.top,o.size,o.size));var i=o.mode;1===i||2===i?e(r,t,o):(3===i||4===i)&&n(r,t,o)}function i(r,t,e,n,o,i,a,u){r.isDark(a,u)&&t.rect(n,o,i,i)}function a(r,t,e,n,o,i,a,u,f,l){a?r.moveTo(t+i,e):r.moveTo(t,e),u?(r.lineTo(n-i,e),r.arcTo(n,e,n,o,i)):r.lineTo(n,e),f?(r.lineTo(n,o-i),r.arcTo(n,o,t,o,i)):r.lineTo(n,o),l?(r.lineTo(t+i,o),r.arcTo(t,o,t,e,i)):r.lineTo(t,o),a?(r.lineTo(t,e+i),r.arcTo(t,e,n,e,i)):r.lineTo(t,e)}function u(r,t,e,n,o,i,a,u,f,l){a&&(r.moveTo(t+i,e),r.lineTo(t,e),r.lineTo(t,e+i),r.arcTo(t,e,t+i,e,i)),u&&(r.moveTo(n-i,e),r.lineTo(n,e),r.lineTo(n,e+i),r.arcTo(n,e,n-i,e,i)),f&&(r.moveTo(n-i,o),r.lineTo(n,o),r.lineTo(n,o-i),r.arcTo(n,o,n-i,o,i)),l&&(r.moveTo(t+i,o),r.lineTo(t,o),r.lineTo(t,o-i),r.arcTo(t,o,t+i,o,i))}function f(r,t,e,n,o,i,f,l){var c=r.isDark,g=n+i,s=o+i,h=e.radius*i,v=f-1,d=f+1,w=l-1,m=l+1,T=c(f,l),y=c(v,w),p=c(v,l),B=c(v,m),E=c(f,m),k=c(d,m),A=c(d,l),M=c(d,w),D=c(f,w);T?a(t,n,o,g,s,h,!p&&!D,!p&&!E,!A&&!E,!A&&!D):u(t,n,o,g,s,h,p&&D&&y,p&&E&&B,A&&E&&k,A&&D&&M)}function l(r,t,e){var n,o,a=r.moduleCount,u=e.size/a,l=i;for(m&&e.radius>0&&e.radius<=.5&&(l=f),t.beginPath(),n=0;a>n;n+=1)for(o=0;a>o;o+=1){var c=e.left+o*u,g=e.top+n*u,s=u;l(r,t,e,c,g,s,n,o)}if(d(e.fill).is("img")){t.strokeStyle="rgba(0,0,0,0.5)",t.lineWidth=2,t.stroke();var h=t.globalCompositeOperation;t.globalCompositeOperation="destination-out",t.fill(),t.globalCompositeOperation=h,t.clip(),t.drawImage(e.fill,0,0,e.size,e.size),t.restore()}else t.fillStyle=e.fill,t.fill()}function c(r,e){var n=t(e.text,e.ecLevel,e.minVersion,e.maxVersion,e.quiet);if(!n)return null;var i=d(r).data("qrcode",n),a=i[0].getContext("2d");return o(n,a,e),l(n,a,e),i}function g(r){var t=d("<canvas/>").attr("width",r.size).attr("height",r.size);return c(t,r)}function s(r){return d("<img/>").attr("src",g(r)[0].toDataURL("image/png"))}function h(r){var e=t(r.text,r.ecLevel,r.minVersion,r.maxVersion,r.quiet);if(!e)return null;var n,o,i=r.size,a=r.background,u=Math.floor,f=e.moduleCount,l=u(i/f),c=u(.5*(i-l*f)),g={position:"relative",left:0,top:0,padding:0,margin:0,width:i,height:i},s={position:"absolute",padding:0,margin:0,width:l,height:l,"background-color":r.fill},h=d("<div/>").data("qrcode",e).css(g);for(a&&h.css("background-color",a),n=0;f>n;n+=1)for(o=0;f>o;o+=1)e.isDark(n,o)&&d("<div/>").css(s).css({left:c+o*l,top:c+n*l}).appendTo(h);return h}function v(r){return w&&"canvas"===r.render?g(r):w&&"image"===r.render?s(r):h(r)}var d=jQuery,w=function(){var r=document.createElement("canvas");return!(!r.getContext||!r.getContext("2d"))}(),m="[object Opera]"!==Object.prototype.toString.call(window.opera),T={render:"canvas",minVersion:1,maxVersion:40,ecLevel:"L",left:0,top:0,size:200,fill:"#000",background:null,text:"no text",radius:0,quiet:0,mode:0,mSize:.1,mPosX:.5,mPosY:.5,label:"no label",fontname:"sans",fontcolor:"#000",image:null};d.fn.qrcode=function(r){var t=d.extend({},T,r);return this.each(function(){"canvas"===this.nodeName.toLowerCase()?c(this,t):d(this).append(v(t))})};var y=function(){function r(t,e){if("undefined"==typeof t.length)throw new Error(t.length+"/"+e);var n=function(){for(var r=0;r<t.length&&0==t[r];)r+=1;for(var n=new Array(t.length-r+e),o=0;o<t.length-r;o+=1)n[o]=t[o+r];return n}(),o={};return o.get=function(r){return n[r]},o.getLength=function(){return n.length},o.multiply=function(t){for(var e=new Array(o.getLength()+t.getLength()-1),n=0;n<o.getLength();n+=1)for(var i=0;i<t.getLength();i+=1)e[n+i]^=a.gexp(a.glog(o.get(n))+a.glog(t.get(i)));return r(e,0)},o.mod=function(t){if(o.getLength()-t.getLength()<0)return o;for(var e=a.glog(o.get(0))-a.glog(t.get(0)),n=new Array(o.getLength()),i=0;i<o.getLength();i+=1)n[i]=o.get(i);for(var i=0;i<t.getLength();i+=1)n[i]^=a.gexp(a.glog(t.get(i))+e);return r(n,0).mod(t)},o}var t=function(t,e){var o=236,a=17,c=t,g=n[e],s=null,h=0,d=null,w=new Array,m={},T=function(r,t){h=4*c+17,s=function(r){for(var t=new Array(r),e=0;r>e;e+=1){t[e]=new Array(r);for(var n=0;r>n;n+=1)t[e][n]=null}return t}(h),y(0,0),y(h-7,0),y(0,h-7),E(),B(),A(r,t),c>=7&&k(r),null==d&&(d=C(c,g,w)),M(d,t)},y=function(r,t){for(var e=-1;7>=e;e+=1)if(!(-1>=r+e||r+e>=h))for(var n=-1;7>=n;n+=1)-1>=t+n||t+n>=h||(s[r+e][t+n]=e>=0&&6>=e&&(0==n||6==n)||n>=0&&6>=n&&(0==e||6==e)||e>=2&&4>=e&&n>=2&&4>=n?!0:!1)},p=function(){for(var r=0,t=0,e=0;8>e;e+=1){T(!0,e);var n=i.getLostPoint(m);(0==e||r>n)&&(r=n,t=e)}return t},B=function(){for(var r=8;h-8>r;r+=1)null==s[r][6]&&(s[r][6]=r%2==0);for(var t=8;h-8>t;t+=1)null==s[6][t]&&(s[6][t]=t%2==0)},E=function(){for(var r=i.getPatternPosition(c),t=0;t<r.length;t+=1)for(var e=0;e<r.length;e+=1){var n=r[t],o=r[e];if(null==s[n][o])for(var a=-2;2>=a;a+=1)for(var u=-2;2>=u;u+=1)s[n+a][o+u]=-2==a||2==a||-2==u||2==u||0==a&&0==u?!0:!1}},k=function(r){for(var t=i.getBCHTypeNumber(c),e=0;18>e;e+=1){var n=!r&&1==(t>>e&1);s[Math.floor(e/3)][e%3+h-8-3]=n}for(var e=0;18>e;e+=1){var n=!r&&1==(t>>e&1);s[e%3+h-8-3][Math.floor(e/3)]=n}},A=function(r,t){for(var e=g<<3|t,n=i.getBCHTypeInfo(e),o=0;15>o;o+=1){var a=!r&&1==(n>>o&1);6>o?s[o][8]=a:8>o?s[o+1][8]=a:s[h-15+o][8]=a}for(var o=0;15>o;o+=1){var a=!r&&1==(n>>o&1);8>o?s[8][h-o-1]=a:9>o?s[8][15-o-1+1]=a:s[8][15-o-1]=a}s[h-8][8]=!r},M=function(r,t){for(var e=-1,n=h-1,o=7,a=0,u=i.getMaskFunction(t),f=h-1;f>0;f-=2)for(6==f&&(f-=1);;){for(var l=0;2>l;l+=1)if(null==s[n][f-l]){var c=!1;a<r.length&&(c=1==(r[a]>>>o&1));var g=u(n,f-l);g&&(c=!c),s[n][f-l]=c,o-=1,-1==o&&(a+=1,o=7)}if(n+=e,0>n||n>=h){n-=e,e=-e;break}}},D=function(t,e){for(var n=0,o=0,a=0,u=new Array(e.length),f=new Array(e.length),l=0;l<e.length;l+=1){var c=e[l].dataCount,g=e[l].totalCount-c;o=Math.max(o,c),a=Math.max(a,g),u[l]=new Array(c);for(var s=0;s<u[l].length;s+=1)u[l][s]=255&t.getBuffer()[s+n];n+=c;var h=i.getErrorCorrectPolynomial(g),v=r(u[l],h.getLength()-1),d=v.mod(h);f[l]=new Array(h.getLength()-1);for(var s=0;s<f[l].length;s+=1){var w=s+d.getLength()-f[l].length;f[l][s]=w>=0?d.get(w):0}}for(var m=0,s=0;s<e.length;s+=1)m+=e[s].totalCount;for(var T=new Array(m),y=0,s=0;o>s;s+=1)for(var l=0;l<e.length;l+=1)s<u[l].length&&(T[y]=u[l][s],y+=1);for(var s=0;a>s;s+=1)for(var l=0;l<e.length;l+=1)s<f[l].length&&(T[y]=f[l][s],y+=1);return T},C=function(r,t,e){for(var n=u.getRSBlocks(r,t),l=f(),c=0;c<e.length;c+=1){var g=e[c];l.put(g.getMode(),4),l.put(g.getLength(),i.getLengthInBits(g.getMode(),r)),g.write(l)}for(var s=0,c=0;c<n.length;c+=1)s+=n[c].dataCount;if(l.getLengthInBits()>8*s)throw new Error("code length overflow. ("+l.getLengthInBits()+">"+8*s+")");for(l.getLengthInBits()+4<=8*s&&l.put(0,4);l.getLengthInBits()%8!=0;)l.putBit(!1);for(;;){if(l.getLengthInBits()>=8*s)break;if(l.put(o,8),l.getLengthInBits()>=8*s)break;l.put(a,8)}return D(l,n)};return m.addData=function(r){var t=l(r);w.push(t),d=null},m.isDark=function(r,t){if(0>r||r>=h||0>t||t>=h)throw new Error(r+","+t);return s[r][t]},m.getModuleCount=function(){return h},m.make=function(){T(!1,p())},m.createTableTag=function(r,t){r=r||2,t="undefined"==typeof t?4*r:t;var e="";e+='<table style="',e+=" border-width: 0px; border-style: none;",e+=" border-collapse: collapse;",e+=" padding: 0px; margin: "+t+"px;",e+='">',e+="<tbody>";for(var n=0;n<m.getModuleCount();n+=1){e+="<tr>";for(var o=0;o<m.getModuleCount();o+=1)e+='<td style="',e+=" border-width: 0px; border-style: none;",e+=" border-collapse: collapse;",e+=" padding: 0px; margin: 0px;",e+=" width: "+r+"px;",e+=" height: "+r+"px;",e+=" background-color: ",e+=m.isDark(n,o)?"#000000":"#ffffff",e+=";",e+='"/>';e+="</tr>"}return e+="</tbody>",e+="</table>"},m.createImgTag=function(r,t){r=r||2,t="undefined"==typeof t?4*r:t;var e=m.getModuleCount()*r+2*t,n=t,o=e-t;return v(e,e,function(t,e){if(t>=n&&o>t&&e>=n&&o>e){var i=Math.floor((t-n)/r),a=Math.floor((e-n)/r);return m.isDark(a,i)?0:1}return 1})},m};t.stringToBytes=function(r){for(var t=new Array,e=0;e<r.length;e+=1){var n=r.charCodeAt(e);t.push(255&n)}return t},t.createStringToBytes=function(r,t){var e=function(){for(var e=s(r),n=function(){var r=e.read();if(-1==r)throw new Error;return r},o=0,i={};;){var a=e.read();if(-1==a)break;var u=n(),f=n(),l=n(),c=String.fromCharCode(a<<8|u),g=f<<8|l;i[c]=g,o+=1}if(o!=t)throw new Error(o+" != "+t);return i}(),n="?".charCodeAt(0);return function(r){for(var t=new Array,o=0;o<r.length;o+=1){var i=r.charCodeAt(o);if(128>i)t.push(i);else{var a=e[r.charAt(o)];"number"==typeof a?(255&a)==a?t.push(a):(t.push(a>>>8),t.push(255&a)):t.push(n)}}return t}};var e={MODE_NUMBER:1,MODE_ALPHA_NUM:2,MODE_8BIT_BYTE:4,MODE_KANJI:8},n={L:1,M:0,Q:3,H:2},o={PATTERN000:0,PATTERN001:1,PATTERN010:2,PATTERN011:3,PATTERN100:4,PATTERN101:5,PATTERN110:6,PATTERN111:7},i=function(){var t=[[],[6,18],[6,22],[6,26],[6,30],[6,34],[6,22,38],[6,24,42],[6,26,46],[6,28,50],[6,30,54],[6,32,58],[6,34,62],[6,26,46,66],[6,26,48,70],[6,26,50,74],[6,30,54,78],[6,30,56,82],[6,30,58,86],[6,34,62,90],[6,28,50,72,94],[6,26,50,74,98],[6,30,54,78,102],[6,28,54,80,106],[6,32,58,84,110],[6,30,58,86,114],[6,34,62,90,118],[6,26,50,74,98,122],[6,30,54,78,102,126],[6,26,52,78,104,130],[6,30,56,82,108,134],[6,34,60,86,112,138],[6,30,58,86,114,142],[6,34,62,90,118,146],[6,30,54,78,102,126,150],[6,24,50,76,102,128,154],[6,28,54,80,106,132,158],[6,32,58,84,110,136,162],[6,26,54,82,110,138,166],[6,30,58,86,114,142,170]],n=1335,i=7973,u=21522,f={},l=function(r){for(var t=0;0!=r;)t+=1,r>>>=1;return t};return f.getBCHTypeInfo=function(r){for(var t=r<<10;l(t)-l(n)>=0;)t^=n<<l(t)-l(n);return(r<<10|t)^u},f.getBCHTypeNumber=function(r){for(var t=r<<12;l(t)-l(i)>=0;)t^=i<<l(t)-l(i);return r<<12|t},f.getPatternPosition=function(r){return t[r-1]},f.getMaskFunction=function(r){switch(r){case o.PATTERN000:return function(r,t){return(r+t)%2==0};case o.PATTERN001:return function(r){return r%2==0};case o.PATTERN010:return function(r,t){return t%3==0};case o.PATTERN011:return function(r,t){return(r+t)%3==0};case o.PATTERN100:return function(r,t){return(Math.floor(r/2)+Math.floor(t/3))%2==0};case o.PATTERN101:return function(r,t){return r*t%2+r*t%3==0};case o.PATTERN110:return function(r,t){return(r*t%2+r*t%3)%2==0};case o.PATTERN111:return function(r,t){return(r*t%3+(r+t)%2)%2==0};default:throw new Error("bad maskPattern:"+r)}},f.getErrorCorrectPolynomial=function(t){for(var e=r([1],0),n=0;t>n;n+=1)e=e.multiply(r([1,a.gexp(n)],0));return e},f.getLengthInBits=function(r,t){if(t>=1&&10>t)switch(r){case e.MODE_NUMBER:return 10;case e.MODE_ALPHA_NUM:return 9;case e.MODE_8BIT_BYTE:return 8;case e.MODE_KANJI:return 8;default:throw new Error("mode:"+r)}else if(27>t)switch(r){case e.MODE_NUMBER:return 12;case e.MODE_ALPHA_NUM:return 11;case e.MODE_8BIT_BYTE:return 16;case e.MODE_KANJI:return 10;default:throw new Error("mode:"+r)}else{if(!(41>t))throw new Error("type:"+t);switch(r){case e.MODE_NUMBER:return 14;case e.MODE_ALPHA_NUM:return 13;case e.MODE_8BIT_BYTE:return 16;case e.MODE_KANJI:return 12;default:throw new Error("mode:"+r)}}},f.getLostPoint=function(r){for(var t=r.getModuleCount(),e=0,n=0;t>n;n+=1)for(var o=0;t>o;o+=1){for(var i=0,a=r.isDark(n,o),u=-1;1>=u;u+=1)if(!(0>n+u||n+u>=t))for(var f=-1;1>=f;f+=1)0>o+f||o+f>=t||(0!=u||0!=f)&&a==r.isDark(n+u,o+f)&&(i+=1);i>5&&(e+=3+i-5)}for(var n=0;t-1>n;n+=1)for(var o=0;t-1>o;o+=1){var l=0;r.isDark(n,o)&&(l+=1),r.isDark(n+1,o)&&(l+=1),r.isDark(n,o+1)&&(l+=1),r.isDark(n+1,o+1)&&(l+=1),(0==l||4==l)&&(e+=3)}for(var n=0;t>n;n+=1)for(var o=0;t-6>o;o+=1)r.isDark(n,o)&&!r.isDark(n,o+1)&&r.isDark(n,o+2)&&r.isDark(n,o+3)&&r.isDark(n,o+4)&&!r.isDark(n,o+5)&&r.isDark(n,o+6)&&(e+=40);for(var o=0;t>o;o+=1)for(var n=0;t-6>n;n+=1)r.isDark(n,o)&&!r.isDark(n+1,o)&&r.isDark(n+2,o)&&r.isDark(n+3,o)&&r.isDark(n+4,o)&&!r.isDark(n+5,o)&&r.isDark(n+6,o)&&(e+=40);for(var c=0,o=0;t>o;o+=1)for(var n=0;t>n;n+=1)r.isDark(n,o)&&(c+=1);var g=Math.abs(100*c/t/t-50)/5;return e+=10*g},f}(),a=function(){for(var r=new Array(256),t=new Array(256),e=0;8>e;e+=1)r[e]=1<<e;for(var e=8;256>e;e+=1)r[e]=r[e-4]^r[e-5]^r[e-6]^r[e-8];for(var e=0;255>e;e+=1)t[r[e]]=e;var n={};return n.glog=function(r){if(1>r)throw new Error("glog("+r+")");return t[r]},n.gexp=function(t){for(;0>t;)t+=255;for(;t>=256;)t-=255;return r[t]},n}(),u=function(){var r=[[1,26,19],[1,26,16],[1,26,13],[1,26,9],[1,44,34],[1,44,28],[1,44,22],[1,44,16],[1,70,55],[1,70,44],[2,35,17],[2,35,13],[1,100,80],[2,50,32],[2,50,24],[4,25,9],[1,134,108],[2,67,43],[2,33,15,2,34,16],[2,33,11,2,34,12],[2,86,68],[4,43,27],[4,43,19],[4,43,15],[2,98,78],[4,49,31],[2,32,14,4,33,15],[4,39,13,1,40,14],[2,121,97],[2,60,38,2,61,39],[4,40,18,2,41,19],[4,40,14,2,41,15],[2,146,116],[3,58,36,2,59,37],[4,36,16,4,37,17],[4,36,12,4,37,13],[2,86,68,2,87,69],[4,69,43,1,70,44],[6,43,19,2,44,20],[6,43,15,2,44,16],[4,101,81],[1,80,50,4,81,51],[4,50,22,4,51,23],[3,36,12,8,37,13],[2,116,92,2,117,93],[6,58,36,2,59,37],[4,46,20,6,47,21],[7,42,14,4,43,15],[4,133,107],[8,59,37,1,60,38],[8,44,20,4,45,21],[12,33,11,4,34,12],[3,145,115,1,146,116],[4,64,40,5,65,41],[11,36,16,5,37,17],[11,36,12,5,37,13],[5,109,87,1,110,88],[5,65,41,5,66,42],[5,54,24,7,55,25],[11,36,12],[5,122,98,1,123,99],[7,73,45,3,74,46],[15,43,19,2,44,20],[3,45,15,13,46,16],[1,135,107,5,136,108],[10,74,46,1,75,47],[1,50,22,15,51,23],[2,42,14,17,43,15],[5,150,120,1,151,121],[9,69,43,4,70,44],[17,50,22,1,51,23],[2,42,14,19,43,15],[3,141,113,4,142,114],[3,70,44,11,71,45],[17,47,21,4,48,22],[9,39,13,16,40,14],[3,135,107,5,136,108],[3,67,41,13,68,42],[15,54,24,5,55,25],[15,43,15,10,44,16],[4,144,116,4,145,117],[17,68,42],[17,50,22,6,51,23],[19,46,16,6,47,17],[2,139,111,7,140,112],[17,74,46],[7,54,24,16,55,25],[34,37,13],[4,151,121,5,152,122],[4,75,47,14,76,48],[11,54,24,14,55,25],[16,45,15,14,46,16],[6,147,117,4,148,118],[6,73,45,14,74,46],[11,54,24,16,55,25],[30,46,16,2,47,17],[8,132,106,4,133,107],[8,75,47,13,76,48],[7,54,24,22,55,25],[22,45,15,13,46,16],[10,142,114,2,143,115],[19,74,46,4,75,47],[28,50,22,6,51,23],[33,46,16,4,47,17],[8,152,122,4,153,123],[22,73,45,3,74,46],[8,53,23,26,54,24],[12,45,15,28,46,16],[3,147,117,10,148,118],[3,73,45,23,74,46],[4,54,24,31,55,25],[11,45,15,31,46,16],[7,146,116,7,147,117],[21,73,45,7,74,46],[1,53,23,37,54,24],[19,45,15,26,46,16],[5,145,115,10,146,116],[19,75,47,10,76,48],[15,54,24,25,55,25],[23,45,15,25,46,16],[13,145,115,3,146,116],[2,74,46,29,75,47],[42,54,24,1,55,25],[23,45,15,28,46,16],[17,145,115],[10,74,46,23,75,47],[10,54,24,35,55,25],[19,45,15,35,46,16],[17,145,115,1,146,116],[14,74,46,21,75,47],[29,54,24,19,55,25],[11,45,15,46,46,16],[13,145,115,6,146,116],[14,74,46,23,75,47],[44,54,24,7,55,25],[59,46,16,1,47,17],[12,151,121,7,152,122],[12,75,47,26,76,48],[39,54,24,14,55,25],[22,45,15,41,46,16],[6,151,121,14,152,122],[6,75,47,34,76,48],[46,54,24,10,55,25],[2,45,15,64,46,16],[17,152,122,4,153,123],[29,74,46,14,75,47],[49,54,24,10,55,25],[24,45,15,46,46,16],[4,152,122,18,153,123],[13,74,46,32,75,47],[48,54,24,14,55,25],[42,45,15,32,46,16],[20,147,117,4,148,118],[40,75,47,7,76,48],[43,54,24,22,55,25],[10,45,15,67,46,16],[19,148,118,6,149,119],[18,75,47,31,76,48],[34,54,24,34,55,25],[20,45,15,61,46,16]],t=function(r,t){var e={};return e.totalCount=r,e.dataCount=t,e},e={},o=function(t,e){switch(e){case n.L:return r[4*(t-1)+0];case n.M:return r[4*(t-1)+1];case n.Q:return r[4*(t-1)+2];case n.H:return r[4*(t-1)+3];default:return void 0}};return e.getRSBlocks=function(r,e){var n=o(r,e);if("undefined"==typeof n)throw new Error("bad rs block @ typeNumber:"+r+"/errorCorrectLevel:"+e);for(var i=n.length/3,a=new Array,u=0;i>u;u+=1)for(var f=n[3*u+0],l=n[3*u+1],c=n[3*u+2],g=0;f>g;g+=1)a.push(t(l,c));return a},e}(),f=function(){var r=new Array,t=0,e={};return e.getBuffer=function(){return r},e.get=function(t){var e=Math.floor(t/8);return 1==(r[e]>>>7-t%8&1)},e.put=function(r,t){for(var n=0;t>n;n+=1)e.putBit(1==(r>>>t-n-1&1))},e.getLengthInBits=function(){return t},e.putBit=function(e){var n=Math.floor(t/8);r.length<=n&&r.push(0),e&&(r[n]|=128>>>t%8),t+=1},e},l=function(r){var n=e.MODE_8BIT_BYTE,o=t.stringToBytes(r),i={};return i.getMode=function(){return n},i.getLength=function(){return o.length},i.write=function(r){for(var t=0;t<o.length;t+=1)r.put(o[t],8)},i},c=function(){var r=new Array,t={};return t.writeByte=function(t){r.push(255&t)},t.writeShort=function(r){t.writeByte(r),t.writeByte(r>>>8)},t.writeBytes=function(r,e,n){e=e||0,n=n||r.length;for(var o=0;n>o;o+=1)t.writeByte(r[o+e])},t.writeString=function(r){for(var e=0;e<r.length;e+=1)t.writeByte(r.charCodeAt(e))},t.toByteArray=function(){return r},t.toString=function(){var t="";t+="[";for(var e=0;e<r.length;e+=1)e>0&&(t+=","),t+=r[e];return t+="]"},t},g=function(){var r=0,t=0,e=0,n="",o={},i=function(r){n+=String.fromCharCode(a(63&r))},a=function(r){if(0>r);else{if(26>r)return 65+r;if(52>r)return 97+(r-26);if(62>r)return 48+(r-52);if(62==r)return 43;if(63==r)return 47}throw new Error("n:"+r)};return o.writeByte=function(n){for(r=r<<8|255&n,t+=8,e+=1;t>=6;)i(r>>>t-6),t-=6},o.flush=function(){if(t>0&&(i(r<<6-t),r=0,t=0),e%3!=0)for(var o=3-e%3,a=0;o>a;a+=1)n+="="},o.toString=function(){return n},o},s=function(r){var t=r,e=0,n=0,o=0,i={};i.read=function(){for(;8>o;){if(e>=t.length){if(0==o)return-1;throw new Error("unexpected end of file./"+o)}var r=t.charAt(e);if(e+=1,"="==r)return o=0,-1;r.match(/^\s$/)||(n=n<<6|a(r.charCodeAt(0)),o+=6)}var i=n>>>o-8&255;return o-=8,i};var a=function(r){if(r>=65&&90>=r)return r-65;if(r>=97&&122>=r)return r-97+26;if(r>=48&&57>=r)return r-48+52;if(43==r)return 62;if(47==r)return 63;throw new Error("c:"+r)};return i},h=function(r,t){var e=r,n=t,o=new Array(r*t),i={};i.setPixel=function(r,t,n){o[t*e+r]=n},i.write=function(r){r.writeString("GIF87a"),r.writeShort(e),r.writeShort(n),r.writeByte(128),r.writeByte(0),r.writeByte(0),r.writeByte(0),r.writeByte(0),r.writeByte(0),r.writeByte(255),r.writeByte(255),r.writeByte(255),r.writeString(","),r.writeShort(0),r.writeShort(0),r.writeShort(e),r.writeShort(n),r.writeByte(0);var t=2,o=u(t);r.writeByte(t);for(var i=0;o.length-i>255;)r.writeByte(255),r.writeBytes(o,i,255),i+=255;r.writeByte(o.length-i),r.writeBytes(o,i,o.length-i),r.writeByte(0),r.writeString(";")};var a=function(r){var t=r,e=0,n=0,o={};return o.write=function(r,o){if(r>>>o!=0)throw new Error("length over");for(;e+o>=8;)t.writeByte(255&(r<<e|n)),o-=8-e,r>>>=8-e,n=0,e=0;n=r<<e|n,e+=o},o.flush=function(){e>0&&t.writeByte(n)},o},u=function(r){for(var t=1<<r,e=(1<<r)+1,n=r+1,i=f(),u=0;t>u;u+=1)i.add(String.fromCharCode(u));i.add(String.fromCharCode(t)),i.add(String.fromCharCode(e));var l=c(),g=a(l);g.write(t,n);var s=0,h=String.fromCharCode(o[s]);for(s+=1;s<o.length;){var v=String.fromCharCode(o[s]);s+=1,i.contains(h+v)?h+=v:(g.write(i.indexOf(h),n),i.size()<4095&&(i.size()==1<<n&&(n+=1),i.add(h+v)),h=v)}return g.write(i.indexOf(h),n),g.write(e,n),g.flush(),l.toByteArray()},f=function(){var r={},t=0,e={};return e.add=function(n){if(e.contains(n))throw new Error("dup key:"+n);r[n]=t,t+=1},e.size=function(){return t},e.indexOf=function(t){return r[t]},e.contains=function(t){return"undefined"!=typeof r[t]},e};return i},v=function(r,t,e,n){for(var o=h(r,t),i=0;t>i;i+=1)for(var a=0;r>a;a+=1)o.setPixel(a,i,e(a,i));var u=c();o.write(u);for(var f=g(),l=u.toByteArray(),s=0;s<l.length;s+=1)f.writeByte(l[s]);f.flush();var v="";return v+="<img",v+=' src="',v+="data:image/gif;base64,",v+=f,v+='"',v+=' width="',v+=r,v+='"',v+=' height="',v+=t,v+='"',n&&(v+=' alt="',v+=n,v+='"'),v+="/>"};return t}()}();
\ No newline at end of file
diff --git a/lsp/server.html b/lsp/server.html
index d8bea01d..0f8d852d 100644
--- a/lsp/server.html
+++ b/lsp/server.html
@@ -11,6 +11,7 @@
     <script src='plugins/cattablesort.js'></script>
     <script src='plugins/jquery.flot.min.js'></script>
     <script src='plugins/jquery.flot.time.min.js'></script>
+    <script src='plugins/jquery.qrcode.min.js'></script>
     <script src='mist.js'></script>
   </head>
   <body>
diff --git a/src/embed.js b/src/embed.js
index 7b4d1c26..99b213dd 100644
--- a/src/embed.js
+++ b/src/embed.js
@@ -183,7 +183,7 @@ function mistembed(streamname) {
       break;
       default:
         container.innerHTML += '<strong>Missing embed code for output type "'+src.type+'"</strong>';
-
+        video.error = 'Missing embed code for output type "'+src.type;
     }
   }