freeswitch/html5/verto/demo/verto.js

435 lines
11 KiB
JavaScript

'use strict';
var cur_call = null;
var la = null;
var $display = $("#display");
var verto;
var ringing = false;
function display(msg) {
$("#calltitle").html(msg);
}
function clearLa() {
if (la) {
la.destroy();
la = null;
}
$("#conf").hide();
}
function goto_dialog(where) {
$.mobile.changePage("#dialog-" + where, {
role: "dialog"
});
}
function goto_page(where) {
$.mobile.changePage("#page-" + where);
}
var first_login = false;
var online_visible = false;
function online(on) {
if (on) {
$("#online").show();
$("#offline").hide();
first_login = true;
} else {
if (first_login && online_visible) {
goto_dialog("logout");
}
$("#online").hide();
$("#offline").show();
}
online_visible = on;
}
function check_vid() {
var use_vid = $("#use_vid").is(':checked');
return use_vid;
}
var callbacks = {
onMessage: function(verto, dialog, msg, data) {
switch (msg) {
case $.verto.enum.message.pvtEvent:
console.error("pvtEvent", data.pvtData.action);
if (data.pvtData) {
switch (data.pvtData.action) {
case "conference-liveArray-part":
clearLa();
break;
case "conference-liveArray-join":
$(".jsDataTable").width(check_vid() ? "650px" : "550px");
la = new $.verto.liveTable(verto, data.pvtData.laChannel, data.pvtData.laName, $('#example'), {
subParams: {
callID: dialog.callID
},
"onChange": function(obj, args) {
//var len = obj.asArray().length;
$("#mcount").text("Conference Members: " + " (" + obj.arrayLen() + " Total)");
},
"aaData": [],
"aoColumns": [{
"sTitle": "ID"
},
{
"sTitle": "Number"
},
{
"sTitle": "Name"
},
{
"sTitle": "Codec"
},
{
"sTitle": "Status",
"sWidth": check_vid() ? "300px" : "150px"
}],
"bAutoWidth": true,
"bDestroy": true,
"bSort": false,
"bInfo": false,
"bFilter": false,
"bLengthChange": false,
"bPaginate": false,
"iDisplayLength": 1000,
"oLanguage": {
"sEmptyTable": "The Conference is Empty....."
}
});
$("#conf").show();
break;
}
}
break;
case $.verto.enum.message.info:
$("#text").html("Message from: <b>" + data.from + "</b>:<br>" + "<pre>" + data.body + "</pre>");
break;
case $.verto.enum.message.display:
var party = dialog.params.remote_caller_id_name + "<" + dialog.params.remote_caller_id_number + ">";
display("Talking to: " + dialog.cidString());
break;
default:
break;
}
},
onDialogState: function(d) {
cur_call = d;
switch (d.state) {
case $.verto.enum.state.ringing:
display("Call From: " + d.cidString());
$("#ansbtn").click(function() {
ringing = false;
cur_call.answer({
useStereo: $("#use_stereo").is(':checked')
});
$('#dialog-incoming-call').dialog('close');
});
$("#declinebtn").click(function() {
ringing = false;
cur_call.hangup();
$('#dialog-incoming-call').dialog('close');
});
ringing = true;
goto_dialog("incoming-call");
$("#dialog-incoming-call-txt").text("Incoming call from: " + d.cidString());
if (d.params.wantVideo) {
$("#vansbtn").click(function() {
ringing = false;
$("#use_vid").prop("checked", true);
cur_call.answer({
useVideo: true,
useStereo: $("#use_stereo").is(':checked')
});
});
// the buttons in this jquery mobile wont hide .. gotta wrap them in a div as a workaround
$("#vansdiv").show();
} else {
$("#vansdiv").hide();
}
break;
case $.verto.enum.state.active:
display("Talking to: " + d.cidString());
goto_page("incall");
break;
case $.verto.enum.state.hangup:
case $.verto.enum.state.destroy:
clearLa();
goto_page("main");
cur_call = null;
break;
case $.verto.enum.state.held:
break;
default:
display("");
break;
}
},
onWSLogin: function(v, success) {
display("");
if (success) {
online(true);
verto.subscribe("presence", {
handler: function(v, e) {
console.error("PRESENCE:", e);
}
});
if (!window.location.hash) {
goto_page("main");
}
} else {
goto_page("login");
goto_dialog("login-error");
}
},
onWSClose: function(v, success) {
if ($('#online').is(':visible')) {
display("");
online(false);
}
var today = new Date();
$("#errordisplay").html("Connection Error.<br>Last Attempt: " + today);
goto_page("main");
},
onEvent: function(v, e) {
console.debug("w00t", e);
},
};
$("#hold").click(function(e) {
cur_call.toggleHold();
goto_dialog("hold");
});
$("#cancelxferbtn").click(function(e) {
$("#xferto").val("");
$("#xferdiv").hide();
});
$(".startxferbtn").click(function(e) {
if ($('#xferdiv').is(':visible')) {
var xfer = $("#xferto").val();
if (xfer) {
cur_call.transfer(xfer);
}
$("#xferto").val("");
$("#xferdiv").hide();
} else {
$("#xferdiv").show();
}
});
$("#clearbtn").click(function(e) {
$("#ext").val("");
});
$(".dialbtn").click(function(e) {
$("#ext").val($("#ext").val() + e.currentTarget.textContent);
});
$(".dtmf").click(function(e) {
if ($('#xferdiv').is(':visible')) {
$("#xferto").val($("#xferto").val() + e.currentTarget.textContent);
} else {
cur_call.dtmf(e.currentTarget.textContent);
}
});
$("#hupbtn").click(function() {
verto.hangup();
cur_call = null;
});
$("#webcam").click(function() {
check_vid();
});
$("#callbtn").click(function() {
$('#ext').trigger('change');
if (cur_call) {
return;
}
cur_call = verto.newCall({
destination_number: $("#ext").val(),
caller_id_name: $("#name").val(),
caller_id_number: $("#cid").val(),
useVideo: check_vid(),
useStereo: $("#use_stereo").is(':checked')
});
});
function pop(id, cname, dft) {
var tmp = $.cookie(cname) || dft;
$.cookie(cname, tmp, {
expires: 365
});
$(id).val(tmp).change(function() {
$.cookie(cname, $(id).val(), {
expires: 365
});
});
}
function init() {
pop("#ext", "verto_demo_ext", "3500");
pop("#name", "verto_demo_name", "FreeSWITCH User");
pop("#cid", "verto_demo_cid", "1008");
pop("#textto", "verto_demo_textto", "1000");
pop("#login", "verto_demo_login", "1008");
pop("#passwd", "verto_demo_passwd", "1234");
pop("#hostName", "verto_demo_hostname", window.location.hostname);
pop("#wsURL", "verto_demo_wsurl", "wss://" + window.location.hostname + ":8082");
var tmp = $.cookie("verto_demo_vid_checked") || "false";
$.cookie("verto_demo_vid_checked", tmp, {
expires: 365
});
$("#use_vid").prop("checked", tmp === "true").change(function(e) {
tmp = $("#use_vid").is(':checked');
$.cookie("verto_demo_vid_checked", tmp ? "true" : "false", {
expires: 365
});
});
tmp = $.cookie("verto_demo_stereo_checked") || "false";
$.cookie("verto_demo_stereo_checked", tmp, {
expires: 365
});
$("#use_stereo").prop("checked", tmp === "true").change(function(e) {
tmp = $("#use_stereo").is(':checked');
$.cookie("verto_demo_stereo_checked", tmp ? "true" : "false", {
expires: 365
});
});
verto = new $.verto({
login: $("#login").val() + "@" + $("#hostName").val(),
passwd: $("#passwd").val(),
socketUrl: $("#wsURL").val(),
tag: "webcam",
ringFile: "sounds/bell_ring2.wav",
videoParams: {
"minWidth": "1280",
"minHeight": "720"
}
},
callbacks);
$("#login").change(function(e) {
$("#cid").val(e.currentTarget.value);
$.cookie("verto_demo_cid", e.currentTarget.value, {
expires: 365
});
});
$("#vtxtbtn").click(function() {
verto.message({
to: $("#textto").val(),
body: $("#textmsg").val()
});
$("#textmsg").val("");
});
$("#logoutbtn").click(function() {
verto.logout();
goto_page("login");
online(false);
});
$("#loginbtn").click(function() {
online(false);
verto.loginData({
login: $("#login").val() + "@" + $("#hostName").val(),
passwd: $("#passwd").val()
});
verto.login();
goto_page("main");
});
$("#xferdiv").hide();
$("#webcam").hide();
online(false);
}
$(document).ready(function() {
init();
$("#page-incall").on("pagebeforechange", function(event) {});
});
$(document).bind("pagebeforechange", function(e, data) {
if (typeof(data.toPage) !== "string") {
return;
}
switch (window.location.hash) {
case "#page-incall":
console.error(e, data);
setTimeout(function() {
if (!cur_call) {
goto_page("main");
}
},
10000);
break;
case "#page-main":
console.error(e, data);
setTimeout(function() {
if (cur_call && !ringing) {
goto_page("incall");
}
},
2000);
break;
case "#page-login":
setTimeout(function() {
if (online_visible) {
goto_page("main");
}
},
1000);
break;
}
});