clean up verto demo and add examples of moderator controls

diff --git a/html5/verto/demo/index.html b/html5/verto/demo/index.html
index 114bea91fd886488c947e2898a5c7cc0ce52e092..724e92b96f5260e3fd55e88bd54a77575e4053dd 100644 (file)
--- a/html5/verto/demo/index.html
+++ b/html5/verto/demo/index.html
@@ -14,6 +14,19 @@
       font-weight: normal;
       height: 27px;
       }
+
+      .ctlbtn {
+        border: 0px;
+       color: #eeeeee;
+       background-color: #0000ae;
+       font-face: arial;
+      }              
+
+      .ctlbtn:hover {
+      color: #ffffae;
+      cursor: pointer;
+      }        
+
     </style>
 
   </head>
@@ -74,8 +87,6 @@
 
       <div id="conf">
        <div style="color:black;font-family: verdana" align="center" id="conf_count"></div>
-       <div id="conf_mod"></div>
-       <div id="conf_display"></div>
        <table width="800" cellspacing="0" cellpadding="0" border="0" align="center" id="conf_list" class="jsDataTable">
        </table>
       </div>
@@ -105,12 +116,13 @@
        <button class="dtmf" data-inline="true">0</button>
        <button class="dtmf" data-inline="true">#</button>
       </div>
+       <div id="conf_mod"></div>
+       <div style="color:blue" id="conf_display"></div>
 
-      <br>
       <button data-inline="true" id="hold">HOLD</button>
       <button data-inline="true" id="hupbtn">End Call</button>
       <button data-inline="true" class="startxferbtn">Transfer</button>
-      <Br><br>
+<br><br>
       <img src="img/verto_black_web.gif" width="300"><br><br>
       <div id="media"> 
        <video width=800 id="webcam" autoplay="autoplay" hidden="true"></video>

diff --git a/html5/verto/demo/js/verto-min.js b/html5/verto/demo/js/verto-min.js
index a4ceded633316b69daa4afb41fdd5596294ada0a..6c5f942a1d2b6f356c2dbc4b689e11283404f1b9 100644 (file)
--- a/html5/verto/demo/js/verto-min.js
+++ b/html5/verto/demo/js/verto-min.js
@@ -166,14 +166,14 @@ if(args.redraw>-1){dt.fnClearTable();dt.fnAddData(obj.asArray());}else{dt.fnAddD
 dt.fnAdjustColumnSizing();break;case"modify":if(!args.data){return;}
 console.debug(args,index);dt.fnUpdate(args.data,index);dt.fnAdjustColumnSizing();break;case"del":dt.fnDeleteRow(index);dt.fnAdjustColumnSizing();break;case"clear":dt.fnClearTable();break;case"reorder":dt.fnClearTable();dt.fnAddData(obj.asArray());break;case"hide":jq.hide();break;case"show":jq.show();break;}}catch(err){console.error("ERROR: "+err);iserr++;}
 if(iserr){obj.errs++;if(obj.errs<3){obj.bootstrap(obj.user_obj);}}else{obj.errs=0;}};la.onChange(la,{action:"init"});};var CONFMAN_SERNO=1;$.verto.confMan=function(verto,params){var confMan=this;conf
-confMan.params=$.extend({tableID:null,statusID:null,mainModID:null,dialog:null,hasVid:false,laData:null,onBroadcast:null,onLaChange:null,onLaRow:null},params);confMan.verto=verto;confMan.serno=CONFMAN_SERNO++;function genMainMod(jq){var play_id="play_"+confMan.serno;var stop_id="stop_"+confMan.serno;var recording_id="recording_"+confMan.serno;var rec_stop_id="recording_stop"+confMan.serno;var div_id="confman_"+confMan.serno;var html="<div id='"+div_id+"'><br>"+"<button id='"+play_id+"'>Play</button>"+"<button id='"+stop_id+"'>Stop</button>"+"<button id='"+recording_id+"'>Record</button>"+"<button id='"+rec_stop_id+"'>Record Stop</button>"
+confMan.params=$.extend({tableID:null,statusID:null,mainModID:null,dialog:null,hasVid:false,laData:null,onBroadcast:null,onLaChange:null,onLaRow:null},params);confMan.verto=verto;confMan.serno=CONFMAN_SERNO++;function genMainMod(jq){var play_id="play_"+confMan.serno;var stop_id="stop_"+confMan.serno;var recording_id="recording_"+confMan.serno;var rec_stop_id="recording_stop"+confMan.serno;var div_id="confman_"+confMan.serno;var html="<div id='"+div_id+"'><br>"+"<button class='ctlbtn' id='"+play_id+"'>Play</button>"+"<button class='ctlbtn' id='"+stop_id+"'>Stop</button>"+"<button class='ctlbtn' id='"+recording_id+"'>Record</button>"+"<button class='ctlbtn' id='"+rec_stop_id+"'>Record Stop</button>"
 +"<br><br></div>";jq.html(html);$("#"+play_id).click(function(){var file=prompt("Please enter file name","");confMan.modCommand("play",null,file);});$("#"+stop_id).click(function(){confMan.modCommand("stop",null,"all");});$("#"+recording_id).click(function(){var file=prompt("Please enter file name","");confMan.modCommand("recording",null,["start",file]);});$("#"+rec_stop_id).click(function(){confMan.modCommand("recording",null,["stop","all"]);});}
-function genControls(jq,rowid){var x=parseInt(rowid);var kick_id="kick_"+x;var tmute_id="tmute_"+x;var box_id="box_"+x;var volup_id="volume_in_up"+x;var voldn_id="volume_in_dn"+x;var html="<div id='"+box_id+"'>"+"<button id='"+kick_id+"'>KICK</button>"+"<button id='"+tmute_id+"'>MUTE</button>"+"<button id='"+voldn_id+"'>vol -</button>"+"<button id='"+volup_id+"'>vol +</button>"+"</div>";jq.html(html);if(!jq.data("mouse")){$("#"+box_id).hide();}
+function genControls(jq,rowid){var x=parseInt(rowid);var kick_id="kick_"+x;var tmute_id="tmute_"+x;var box_id="box_"+x;var volup_id="volume_in_up"+x;var voldn_id="volume_in_dn"+x;var html="<div id='"+box_id+"'>"+"<button class='ctlbtn' id='"+kick_id+"'>KICK</button>"+"<button class='ctlbtn' id='"+tmute_id+"'>MUTE</button>"+"<button class='ctlbtn' id='"+voldn_id+"'>vol -</button>"+"<button class='ctlbtn' id='"+volup_id+"'>vol +</button>"+"</div>";jq.html(html);if(!jq.data("mouse")){$("#"+box_id).hide();}
 jq.mouseover(function(e){jq.data({"mouse":true});$("#"+box_id).show();});jq.mouseout(function(e){jq.data({"mouse":false});$("#"+box_id).hide();});$("#"+kick_id).click(function(){confMan.modCommand("kick",x);});$("#"+tmute_id).click(function(){confMan.modCommand("tmute",x);});$("#"+volup_id).click(function(){confMan.modCommand("volume_in",x,"up");});$("#"+voldn_id).click(function(){confMan.modCommand("volume_in",x,"down");});return html;}
-var atitle="";var awidth=0;$(".jsDataTable").width(confMan.params.hasVid?"900px":"800px");if(confMan.params.laData.role==="moderator"){atitle="Action";awidth=200;if(confMan.params.mainModID){genMainMod($(confMan.params.mainModID));}else{$(confMan.params.mainModID).html("");}
+var atitle="";var awidth=0;$(".jsDataTable").width(confMan.params.hasVid?"900px":"800px");if(confMan.params.laData.role==="moderator"){atitle="Action";awidth=200;if(confMan.params.mainModID){genMainMod($(confMan.params.mainModID));$(confMan.params.displayID).html("Moderator Controls Ready<br><br>")}else{$(confMan.params.mainModID).html("");}
 verto.subscribe(confMan.params.laData.modChannel,{handler:function(v,e){console.error("MODDATA:",e.data);if(confMan.params.onBroadcast){confMan.params.onBroadcast(verto,confMan,e.data);}
 if(confMan.params.displayID){$(confMan.params.displayID).html(e.data.response+"<br><br>");if(confMan.lastTimeout){clearTimeout(confMan.lastTimeout);confMan.lastTimeout=0;}
-confMan.lastTimeout=setTimeout(function(){$(confMan.params.displayID).html("")},4000);}}});}
+confMan.lastTimeout=setTimeout(function(){$(confMan.params.displayID).html("Moderator Controls Ready<br><br>")},4000);}}});}
 var row_callback=null;if(confMan.params.laData.role==="moderator"){row_callback=function(nRow,aData,iDisplayIndex,iDisplayIndexFull){if(!aData[5]){var $row=$('td:eq(5)',nRow);genControls($row,aData);if(confMan.params.onLaRow){confMan.params.onLaRow(verto,confMan,$row,aData);}}};}
 confMan.lt=new $.verto.liveTable(verto,confMan.params.laData.laChannel,confMan.params.laData.laName,$(confMan.params.tableID),{subParams:{callID:confMan.params.dialog?confMan.params.dialog.callID:null},"onChange":function(obj,args){$(confMan.params.statusID).text("Conference Members: "+" ("+obj.arrayLen()+" Total)");if(confMan.params.onLaChange){confMan.params.onLaChange(verto,confMan,$.verto.enum.confEvent.laChange,obj,args);}},"aaData":[],"aoColumns":[{"sTitle":"ID"},{"sTitle":"Number"},{"sTitle":"Name"},{"sTitle":"Codec"},{"sTitle":"Status","sWidth":confMan.params.hasVid?"300px":"150px"},{"sTitle":atitle,"sWidth":awidth,}],"bAutoWidth":true,"bDestroy":true,"bSort":false,"bInfo":false,"bFilter":false,"bLengthChange":false,"bPaginate":false,"iDisplayLength":1000,"oLanguage":{"sEmptyTable":"The Conference is Empty....."},"fnRowCallback":row_callback});}
 $.verto.confMan.prototype.modCommand=function(cmd,id,value){var confMan=this;confMan.verto.sendMethod("verto.broadcast",{"eventChannel":confMan.params.laData.modChannel,"data":{"application":"conf-control","command":cmd,"id":id,"value":value}});}

diff --git a/html5/verto/js/src/jquery.verto.js b/html5/verto/js/src/jquery.verto.js
index ca7f56e8cbd7a830cc6a934ccecaf8c8bc951665..2fc091bdd2220f0689d75e56ef3cd92ef46813b9 100644 (file)
--- a/html5/verto/js/src/jquery.verto.js
+++ b/html5/verto/js/src/jquery.verto.js
@@ -1150,10 +1150,10 @@
            var div_id = "confman_" + confMan.serno;
 
            var html =  "<div id='" + div_id + "'><br>" +
-               "<button id='" + play_id + "'>Play</button>" +
-               "<button id='" + stop_id + "'>Stop</button>" +
-               "<button id='" + recording_id + "'>Record</button>" +
-               "<button id='" + rec_stop_id + "'>Record Stop</button>" 
+               "<button class='ctlbtn' id='" + play_id + "'>Play</button>" +
+               "<button class='ctlbtn' id='" + stop_id + "'>Stop</button>" +
+               "<button class='ctlbtn' id='" + recording_id + "'>Record</button>" +
+               "<button class='ctlbtn' id='" + rec_stop_id + "'>Record Stop</button>" 
 
            + "<br><br></div>";
 
@@ -1189,10 +1189,10 @@
 
            
            var html = "<div id='" + box_id + "'>" + 
-               "<button id='" + kick_id + "'>KICK</button>" + 
-               "<button id='" + tmute_id + "'>MUTE</button>" +
-               "<button id='" + voldn_id + "'>vol -</button>" +
-               "<button id='" + volup_id + "'>vol +</button>" +
+               "<button class='ctlbtn' id='" + kick_id + "'>KICK</button>" + 
+               "<button class='ctlbtn' id='" + tmute_id + "'>MUTE</button>" +
+               "<button class='ctlbtn' id='" + voldn_id + "'>vol -</button>" +
+               "<button class='ctlbtn' id='" + volup_id + "'>vol +</button>" +
                "</div>"
            ;
            
@@ -1244,6 +1244,7 @@
            
            if (confMan.params.mainModID) {
                genMainMod($(confMan.params.mainModID));
+               $(confMan.params.displayID).html("Moderator Controls Ready<br><br>")
            } else {
                $(confMan.params.mainModID).html("");
            }
@@ -1260,7 +1261,7 @@
                            clearTimeout(confMan.lastTimeout);
                            confMan.lastTimeout = 0;
                        }
-                       confMan.lastTimeout = setTimeout(function() { $(confMan.params.displayID).html("")}, 4000);
+                       confMan.lastTimeout = setTimeout(function() { $(confMan.params.displayID).html("Moderator Controls Ready<br><br>")}, 4000);
                    }
 
                }