Built motion from commit 3e059bc2.|2.5.32
[motion2.git] / demo / phonebar / index.html
index 3e80be6..e0b6232 100644 (file)
 <html>
+
 <head>
-       <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
-       <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
-       <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
-       <script>
-       function getValue(elem){
-               $("#url").val(elem.innerHTML);
-       }
-       function request(){
-               $.ajax({
-                       url: $("#url").val(),
-                       success: function(data) {
-                               $("#res").html(JSON.stringify(data, null, 2));
-                       },
-                       error: function(data) {
-                               $("#res").html(JSON.stringify(data, null, 2));
-                       },
-                       dataType: "json"
-               });
-       }
-       function originate(){
-               $.ajax({
-                       url: 'http://127.0.0.1:9888/api/originate/' + $("#origin").val(),
-                       success: function(data) {
-                               $("#iMessage").removeClass('alert-danger');
-                               $("#iMessage").removeClass('alert-info');
-                               $("#iMessage").addClass('alert-success');
-                               $("#iMessage").html(data.description || 'Operation completed');
-                       },
-                       error: function(data) {
-                               $("#iMessage").removeClass('alert-success');
-                               $("#iMessage").removeClass('alert-info');
-                               $("#iMessage").addClass('alert-danger');
-                               $("#iMessage").html(data.description || 'API error');
-                       },
-                       dataType: "json"
-               });
-       }
-       (function poll() {
-               setTimeout(function() {
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
+  <script>
+    function getValue(elem) {
+      $("#url").val(elem.innerHTML);
+    }
+
+    function request() {
+      $.ajax({
+        url: $("#url").val(),
+        success: function(data) {
+          $("#res").html(JSON.stringify(data, null, 2));
+        },
+        error: function(data) {
+          $("#res").html(JSON.stringify(data, null, 2));
+        },
+        dataType: "json"
+      });
+    }
+
+    function originate() {
+      $.ajax({
+        url: 'http://127.0.0.1:9888/api/originate/' + $("#origin").val(),
+        success: function(data) {
+          $("#iMessage").removeClass('alert-danger');
+          $("#iMessage").removeClass('alert-info');
+          $("#iMessage").addClass('alert-success');
+          $("#iMessage").html(data.description || 'Operation completed');
+        },
+        error: function(data) {
+          $("#iMessage").removeClass('alert-success');
+          $("#iMessage").removeClass('alert-info');
+          $("#iMessage").addClass('alert-danger');
+          $("#iMessage").html(data.description || 'API error');
+        },
+        dataType: "json"
+      });
+    }
+    (function poll() {
+      setTimeout(function() {
 
-                       $.ajax({
-                               url: "http://127.0.0.1:9888/api/calls",
-                               success: function(data) {
+        $.ajax({
+          url: "http://127.0.0.1:9888/api/calls",
+          success: function(data) {
 
-                                       $("#statusMessage").html('Status: <strong>CONNECTED</strong>');
-                                       $("#statusMessage").removeClass('alert-danger');
-                                       $("#statusMessage").removeClass('alert-info');
-                                       $("#statusMessage").addClass('alert-success');
-                                       $("#calls").empty();
+            $("#statusMessage").html('Status: <strong>CONNECTED</strong>');
+            $("#statusMessage").removeClass('alert-danger');
+            $("#statusMessage").removeClass('alert-info');
+            $("#statusMessage").addClass('alert-success');
+            $("#calls").empty();
 
-                                       if (data.length)
-                                       {
-                                               for (var i = 0; i < data.length; i++) {
-                                                       var row = $('<tr></tr>').appendTo("#calls");
-                                                       $('<td></td>').text(data[i].callingnumber).appendTo(row);
-                                                       $('<td></td>').text(data[i].callingname).appendTo(row);
-                                                       $('<td></td>').text(data[i].session).attr("id", "session" + i).appendTo(row);
-                                                       $('<td></td>').text(data[i].incoming).appendTo(row);
-                                                       $('<td></td>').text(data[i].stateid).appendTo(row);
-                                                       $('<td></td>').attr("id", "action" + i).appendTo(row);
-                                                       $('<button class="btn btn-success btn-xs">Answer</button>').click(function () {
-                                                               $.ajax({
-                                                                       url: "http://127.0.0.1:9888/api/answer/" + $("#session" + 1).text(),
-                                                                       success: function(data) {
-                                                                               $("#iMessage").removeClass('alert-danger');
-                                                                               $("#iMessage").removeClass('alert-info');
-                                                                               $("#iMessage").addClass('alert-success');
-                                                                               $("#iMessage").html(data.description || 'Operation completed');
-                                                                       },
-                                                                       error: function(data) {
-                                                                               $("#iMessage").removeClass('alert-success');
-                                                                               $("#iMessage").removeClass('alert-info');
-                                                                               $("#iMessage").addClass('alert-danger');
-                                                                               $("#iMessage").html(data.description || 'API error');
-                                                                       },
-                                                                       dataType: "json"
-                                                               });
-                                                       }).appendTo("#action" + i);
-                                                       $('<button class="btn btn-warning btn-xs" style="margin-left:5px;">Hold</button>').click(function () {
-                                                               $.ajax({
-                                                                       url: "http://127.0.0.1:9888/api/hold/" + $("#session" + 1).text(),
-                                                                       success: function(data) {
-                                                                               $("#iMessage").removeClass('alert-danger');
-                                                                               $("#iMessage").removeClass('alert-info');
-                                                                               $("#iMessage").addClass('alert-success');
-                                                                               $("#iMessage").html(data.description || 'Operation completed');
-                                                                       },
-                                                                       error: function(data) {
-                                                                               $("#iMessage").removeClass('alert-success');
-                                                                               $("#iMessage").removeClass('alert-info');
-                                                                               $("#iMessage").addClass('alert-danger');
-                                                                               $("#iMessage").html(data.description || 'API error');
-                                                                       },
-                                                                       dataType: "json"
-                                                               });
-                                                       }).appendTo("#action" + i);
-                                                       $('<button class="btn btn-danger btn-xs" style="margin-left:5px;">Hangup</button>').click(function () {
-                                                               $.ajax({
-                                                                       url: "http://127.0.0.1:9888/api/hangup/" + $("#session" + 1).text(),
-                                                                       success: function(data) {
-                                                                               $("#iMessage").removeClass('alert-danger');
-                                                                               $("#iMessage").removeClass('alert-info');
-                                                                               $("#iMessage").addClass('alert-success');
-                                                                               $("#iMessage").html(data.description || 'Operation completed');
-                                                                       },
-                                                                       error: function(data) {
-                                                                               $("#iMessage").removeClass('alert-success');
-                                                                               $("#iMessage").removeClass('alert-info');
-                                                                               $("#iMessage").addClass('alert-danger');
-                                                                               $("#iMessage").html(data.description || 'API error');
-                                                                       },
-                                                                       dataType: "json"
-                                                               });
-                                                       }).appendTo("#action" + i);
-                                               }
-                                       }
-                                       else
-                                       {
-                                               var row = $('<tr></tr>').appendTo("#calls");
-                                               $('<td></td>').text("No Active Calls").attr('colspan',6).appendTo(row);
-                                       }
+            if (data.length) {
+              for (var i = 0; i < data.length; i++) {
+                var row = $('<tr></tr>').appendTo("#calls");
+                $('<td></td>').text(data[i].callingnumber).appendTo(row);
+                $('<td></td>').text(data[i].callingname).appendTo(row);
+                $('<td></td>').text(data[i].session).attr("id", "session" + i).appendTo(row);
+                $('<td></td>').text(data[i].incoming).appendTo(row);
+                $('<td></td>').text(data[i].stateid).appendTo(row);
+                $('<td></td>').attr("id", "action" + i).appendTo(row);
+                $('<button class="btn btn-success btn-xs">Answer</button>').click(function() {
+                  $.ajax({
+                    url: "http://127.0.0.1:9888/api/answer/" + $("#session" + 1).text(),
+                    success: function(data) {
+                      $("#iMessage").removeClass('alert-danger');
+                      $("#iMessage").removeClass('alert-info');
+                      $("#iMessage").addClass('alert-success');
+                      $("#iMessage").html(data.description || 'Operation completed');
+                    },
+                    error: function(data) {
+                      $("#iMessage").removeClass('alert-success');
+                      $("#iMessage").removeClass('alert-info');
+                      $("#iMessage").addClass('alert-danger');
+                      $("#iMessage").html(data.description || 'API error');
+                    },
+                    dataType: "json"
+                  });
+                }).appendTo("#action" + i);
+                $('<button class="btn btn-warning btn-xs" style="margin-left:5px;">Hold</button>').click(function() {
+                  $.ajax({
+                    url: "http://127.0.0.1:9888/api/hold/" + $("#session" + 1).text(),
+                    success: function(data) {
+                      $("#iMessage").removeClass('alert-danger');
+                      $("#iMessage").removeClass('alert-info');
+                      $("#iMessage").addClass('alert-success');
+                      $("#iMessage").html(data.description || 'Operation completed');
+                    },
+                    error: function(data) {
+                      $("#iMessage").removeClass('alert-success');
+                      $("#iMessage").removeClass('alert-info');
+                      $("#iMessage").addClass('alert-danger');
+                      $("#iMessage").html(data.description || 'API error');
+                    },
+                    dataType: "json"
+                  });
+                }).appendTo("#action" + i);
+                $('<button class="btn btn-danger btn-xs" style="margin-left:5px;">Hangup</button>').click(function() {
+                  $.ajax({
+                    url: "http://127.0.0.1:9888/api/hangup/" + $("#session" + 1).text(),
+                    success: function(data) {
+                      $("#iMessage").removeClass('alert-danger');
+                      $("#iMessage").removeClass('alert-info');
+                      $("#iMessage").addClass('alert-success');
+                      $("#iMessage").html(data.description || 'Operation completed');
+                    },
+                    error: function(data) {
+                      $("#iMessage").removeClass('alert-success');
+                      $("#iMessage").removeClass('alert-info');
+                      $("#iMessage").addClass('alert-danger');
+                      $("#iMessage").html(data.description || 'API error');
+                    },
+                    dataType: "json"
+                  });
+                }).appendTo("#action" + i);
+              }
+            } else {
+              var row = $('<tr></tr>').appendTo("#calls");
+              $('<td></td>').text("No Active Calls").attr('colspan', 6).appendTo(row);
+            }
 
-                               },
-                               error: function(data) {
-                                       $("#statusMessage").html('Status: <strong>DISCONNECTED</strong>');
-                                       $("#statusMessage").removeClass('alert-success');
-                                       $("#statusMessage").removeClass('alert-info');
-                                       $("#statusMessage").addClass('alert-danger');
-                               },
-                               dataType: "json",
-                               complete: poll }
-                       );
-               }, 2000);
-       })();
-       </script>
+          },
+          error: function(data) {
+            $("#statusMessage").html('Status: <strong>DISCONNECTED</strong>');
+            $("#statusMessage").removeClass('alert-success');
+            $("#statusMessage").removeClass('alert-info');
+            $("#statusMessage").addClass('alert-danger');
+          },
+          dataType: "json",
+          complete: poll
+        });
+      }, 2000);
+    })();
+  </script>
 </head>
+
 <body style="padding:10px;">
-       <div class="widget stacked widget-table action-table">
-               <div class="alert alert-info" id="statusMessage">
-                       Checking api status...
-               </div>
-               <div class="panel panel-default">
-                       <div class="panel-heading" role="tab" id="headingOne">
-                               <h4 class="panel-title">
-                                       <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
-                                               Api Test (click to expand/collapse)
-                                       </a>
-                               </h4>
-                       </div>
-                       <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
-                               <div class="panel-body">
-                                       <div class="widget-header">
-                                               <i class="icon-th-list"></i>
-                                               <h3>Api</h3>
-                                       </div> <!-- /widget-header -->
+  <div class="widget stacked widget-table action-table">
+    <div class="alert alert-info" id="statusMessage">
+      Checking api status...
+    </div>
+    <div class="panel panel-default">
+      <div class="panel-heading" role="tab" id="headingOne">
+        <h4 class="panel-title">
+          <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
+            Api Test (click to expand/collapse)
+          </a>
+        </h4>
+      </div>
+      <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
+        <div class="panel-body">
+          <div class="widget-header">
+            <i class="icon-th-list"></i>
+            <h3>Api</h3>
+          </div> <!-- /widget-header -->
 
-                                       <div class="widget-content">
+          <div class="widget-content">
 
-                                               <table class="table table-striped table-bordered table-condensed table-hover">
-                                                       <thead>
-                                                       </thead>
-                                                       <tbody>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/agent</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/answer</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/answer/{session}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/hangup</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/hangup/{session}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/transfer?number={number}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/transfer/{session}?number={number}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/transfer/attended/{session}/{partnerSession}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/hold</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/hold/{session}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/conference</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/originate/{number}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/dtmf?digit={digit}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/dtmf/{session}?digit={digit}</td>
-                                                               </tr>
-                                                               <tr>
-                                                                       <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/calls</td>
-                                                               </tr>
-                                                       </tbody>
-                                               </table>
+            <table class="table table-striped table-bordered table-condensed table-hover">
+              <thead>
+              </thead>
+              <tbody>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/agent</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/answer</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/answer/{session}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/hangup</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/hangup/{session}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/transfer?number={number}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/transfer/{session}?number={number}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/transfer/attended/{session}/{partnerSession}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/hold</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/hold/{session}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/conference</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/originate/{number}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/dtmf?digit={digit}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/dtmf/{session}?digit={digit}</td>
+                </tr>
+                <tr>
+                  <td style="cursor:pointer;" onclick="getValue(this)">http://127.0.0.1:9888/api/calls</td>
+                </tr>
+              </tbody>
+            </table>
 
-                                       </div> <!-- /widget-content -->
+          </div> <!-- /widget-content -->
 
-                                       <div class="widget-header">
-                                               <i class="icon-th-list"></i>
-                                               <h3>Request</h3>
-                                       </div> <!-- /widget-header -->
+          <div class="widget-header">
+            <i class="icon-th-list"></i>
+            <h3>Request</h3>
+          </div> <!-- /widget-header -->
 
-                                       <div>
-                                               <input id="url" type="text" style="width:100%" placeholder="http://127.0.0.1:9888/api/"/></br></br>
-                                               <button class="btn btn-primary" onclick="request()">Send</button>
-                                       </div>
+          <div>
+            <input id="url" type="text" style="width:100%" placeholder="http://127.0.0.1:9888/api/" /></br></br>
+            <button class="btn btn-primary" onclick="request()">Send</button>
+          </div>
 
-                                       <div class="widget-header">
-                                               <i class="icon-th-list"></i>
-                                               <h3>Result</h3>
-                                       </div> <!-- /widget-header -->
+          <div class="widget-header">
+            <i class="icon-th-list"></i>
+            <h3>Result</h3>
+          </div> <!-- /widget-header -->
 
-                                       <pre id="res">
+          <pre id="res">
                                        </pre>
-                               </div>
-                       </div>
-               </div>
+        </div>
+      </div>
+    </div>
 
-               <div class="panel panel-default">
-                       <div class="panel-heading" role="tab" id="headingOne">
-                               <h4 class="panel-title">
-                                       <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="true" aria-controls="collapseOne">
-                                               Interface Example (click to expand/collapse)
-                                       </a>
-                               </h4>
-                       </div>
-                       <div id="collapseTwo" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
-                               <div class="panel-body">
+    <div class="panel panel-default">
+      <div class="panel-heading" role="tab" id="headingOne">
+        <h4 class="panel-title">
+          <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="true" aria-controls="collapseOne">
+            Interface Example (click to expand/collapse)
+          </a>
+        </h4>
+      </div>
+      <div id="collapseTwo" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
+        <div class="panel-body">
 
-                                       <div class="widget-header">
-                                               <i class="icon-th-list"></i>
-                                               <h3>Originate a call</h3>
-                                       </div> <!-- /widget-header -->
+          <div class="widget-header">
+            <i class="icon-th-list"></i>
+            <h3>Originate a call</h3>
+          </div> <!-- /widget-header -->
 
-                                       <div>
-                                               <input id="origin" type="text" placeholder="john.doe" value="john.doe"/> <button class="btn btn-success btn-xs" onclick="originate()">Call</button>
-                                       </div>
+          <div>
+            <input id="origin" type="text" placeholder="john.doe" value="john.doe" /> <button class="btn btn-success btn-xs" onclick="originate()">Call</button>
+          </div>
 
-                                       <div class="widget-header">
-                                               <i class="icon-th-list"></i>
-                                               <h3>Active Calls</h3>
-                                       </div> <!-- /widget-header -->
+          <div class="widget-header">
+            <i class="icon-th-list"></i>
+            <h3>Active Calls</h3>
+          </div> <!-- /widget-header -->
 
-                                       <div class="widget-content">
+          <div class="widget-content">
 
-                                               <table class="table table-striped table-bordered table-condensed table-hover">
-                                                       <thead>
-                                                               <th>Calling Number</th>
-                                                               <th>Calling Name</th>
-                                                               <th>Session</th>
-                                                               <th>Incoming</th>
-                                                               <th>StateID</th>
-                                                               <th>Actions</th>
-                                                       </thead>
-                                                       <tbody id="calls">
-                                                               <td colspan="6">No Active Calls</td>
-                                                       </tbody>
-                                               </table>
+            <table class="table table-striped table-bordered table-condensed table-hover">
+              <thead>
+                <th>Calling Number</th>
+                <th>Calling Name</th>
+                <th>Session</th>
+                <th>Incoming</th>
+                <th>StateID</th>
+                <th>Actions</th>
+              </thead>
+              <tbody id="calls">
+                <td colspan="6">No Active Calls</td>
+              </tbody>
+            </table>
 
-                                       </div> <!-- /widget-content -->
+          </div> <!-- /widget-content -->
 
-                                       <div class="alert alert-info" id="iMessage">
-                                       </div>
-                               </div>
-                       </div>
-               </div>
+          <div class="alert alert-info" id="iMessage">
+          </div>
+        </div>
+      </div>
+    </div>
 
-       </div> <!-- /widget -->
+  </div> <!-- /widget -->
 </body>
-</html>
+
+</html>
\ No newline at end of file