From 4f5139aecf353e94e7530f42cfade99bee3555ea Mon Sep 17 00:00:00 2001
From: Nate Jones <git@reliberate.com>
Date: Thu, 4 Dec 2014 02:24:27 +0000
Subject: [PATCH] Operator Panel: Added ability to click the icons (first the
 'from', then the 'to') to originate or transfer a call.

---
 app/operator_panel/index.php     | 94 +++++++++++++++++++++++++++++---
 app/operator_panel/index_inc.php | 39 +++++++++----
 2 files changed, 116 insertions(+), 17 deletions(-)

diff --git a/app/operator_panel/index.php b/app/operator_panel/index.php
index da5dfa27d7..b94beeafbb 100644
--- a/app/operator_panel/index.php
+++ b/app/operator_panel/index.php
@@ -44,10 +44,15 @@ else {
 require_once "resources/header.php";
 ?>
 
+<!-- virtual_drag function holding elements -->
+<input type='hidden' class='formfld' id='vd_call_id' value=''>
+<input type='hidden' class='formfld' id='vd_ext_from' value=''>
+<input type='hidden' class='formfld' id='vd_ext_to' value=''>
+
 <script type="text/javascript">
 //ajax refresh
-	var refresh = 1000;
-	var source_url = 'index_inc.php?<?php if (isset($_GET['debug'])) { echo "&debug"; } ?>';
+	var refresh = 1200;
+	var source_url = 'index_inc.php?' <?php if (isset($_GET['debug'])) { echo " + '&debug'"; } ?>;
 	var interval_timer_id;
 
 	function loadXmlHttp(url, id) {
@@ -85,7 +90,16 @@ require_once "resources/header.php";
 	}
 
 	var requestTime = function() {
-		new loadXmlHttp(source_url + '&group=' + ((document.getElementById('group')) ? document.getElementById('group').options[document.getElementById('group').selectedIndex].value : '') <?php if (isset($_GET['debug'])) { echo "+ '&debug'"; } ?>, 'ajax_reponse');
+		var url = source_url;
+		url += '&vd_ext_from=' + document.getElementById('vd_ext_from').value;
+		url += '&vd_ext_to=' + document.getElementById('vd_ext_to').value;
+		url += '&group=' + ((document.getElementById('group')) ? document.getElementById('group').options[document.getElementById('group').selectedIndex].value : '');
+		<?php
+		if (isset($_GET['debug'])) {
+			echo "url += '&debug';";
+		}
+		?>
+		new loadXmlHttp(url, 'ajax_reponse');
 		refresh_start();
 	}
 
@@ -99,9 +113,10 @@ require_once "resources/header.php";
 
 //drag/drop functionality
 	function drag(ev, from_ext) {
+		refresh_stop();
 		ev.dataTransfer.setData("Call", ev.target.id);
 		ev.dataTransfer.setData("From", from_ext);
-		refresh_stop();
+		virtual_drag_reset();
 	}
 
 	function allowDrop(ev, target_id) {
@@ -140,7 +155,18 @@ require_once "resources/header.php";
 	}
 
 	function refresh_start() {
-		interval_timer_id = setInterval(function(){new loadXmlHttp(source_url + '&group=' + ((document.getElementById('group')) ? document.getElementById('group').options[document.getElementById('group').selectedIndex].value : '') <?php if (isset($_GET['debug'])) { echo "+ '&debug'"; } ?>, 'ajax_reponse');}, refresh);
+		interval_timer_id = setInterval( function() {
+			url = source_url;
+			url += '&vd_ext_from=' + document.getElementById('vd_ext_from').value;
+			url += '&vd_ext_to=' + document.getElementById('vd_ext_to').value;
+			url += '&group=' + ((document.getElementById('group')) ? document.getElementById('group').options[document.getElementById('group').selectedIndex].value : '');
+			<?php
+			if (isset($_GET['debug'])) {
+				echo "url += '&debug';";
+			}
+			?>
+			new loadXmlHttp(url, 'ajax_reponse');
+		}, refresh);
 	}
 
 //call destination
@@ -196,6 +222,61 @@ require_once "resources/header.php";
 	echo "}\n";
 ?>
 
+//virtual functions
+	function virtual_drag(call_id, ext) {
+		if (document.getElementById('vd_ext_from').value != '' && document.getElementById('vd_ext_to').value != '') {
+			virtual_drag_reset();
+		}
+
+		if (call_id != '') {
+			document.getElementById('vd_call_id').value = call_id;
+		}
+
+		if (ext != '') {
+			if (document.getElementById('vd_ext_from').value == '') {
+				document.getElementById('vd_ext_from').value = ext;
+				document.getElementById(ext).style.borderStyle = 'dotted';
+				if (document.getElementById('vd_ext_to').value != '') {
+					document.getElementById(document.getElementById('vd_ext_to').value).style.borderStyle = '';
+					document.getElementById('vd_ext_to').value = '';
+				}
+			}
+			else {
+				document.getElementById('vd_ext_to').value = ext;
+				if (document.getElementById('vd_ext_from').value != document.getElementById('vd_ext_to').value) {
+					if (document.getElementById('vd_call_id').value != '') {
+						cmd = get_transfer_cmd(document.getElementById('vd_call_id').value, document.getElementById('vd_ext_to').value); //transfer a call
+					}
+					else {
+						cmd = get_originate_cmd(document.getElementById('vd_ext_from').value + '@<?=$_SESSION["domain_name"]?>', document.getElementById('vd_ext_to').value); //originate a call
+					}
+					if (cmd != '') {
+						//alert(cmd);
+						send_cmd('exec.php?cmd='+escape(cmd));
+					}
+				}
+				virtual_drag_reset();
+			}
+		}
+	}
+
+	function virtual_drag_reset(vd_var) {
+		if (!(vd_var === undefined)) {
+			document.getElementById(vd_var).value = '';
+		}
+		else {
+			document.getElementById('vd_call_id').value = '';
+			if (document.getElementById('vd_ext_from').value != '') {
+				document.getElementById(document.getElementById('vd_ext_from').value).style.borderStyle = '';
+				document.getElementById('vd_ext_from').value = '';
+			}
+			if (document.getElementById('vd_ext_to').value != '') {
+				document.getElementById(document.getElementById('vd_ext_to').value).style.borderStyle = '';
+				document.getElementById('vd_ext_to').value = '';
+			}
+		}
+	}
+
 </script>
 
 <style type="text/css">
@@ -231,7 +312,7 @@ require_once "resources/header.php";
 
 	TABLE {
 		border-spacing: 0px;
-		border-collapse: collapse; //or 'separate'
+		border-collapse: collapse;
 		border: none;
 		}
 
@@ -249,7 +330,6 @@ require_once "resources/header.php";
 
 	TD.ext_icon {
 		vertical-align: middle;
-		/*background: rgba(255, 255, 255, 0.5); */
 		-moz-border-radius: 5px;
 		-webkit-border-radius: 5px;
 		border-radius: 5px;
diff --git a/app/operator_panel/index_inc.php b/app/operator_panel/index_inc.php
index b8557f2b02..c554190a7b 100644
--- a/app/operator_panel/index_inc.php
+++ b/app/operator_panel/index_inc.php
@@ -59,6 +59,7 @@ foreach ($activity as $extension => $fields) {
 $groups = array_unique($groups);
 sort($groups);
 
+
 echo "<table cellpadding='0' cellspacing='0' border='0' align='right'>";
 echo "	<tr>";
 echo "		<td>";
@@ -141,10 +142,28 @@ foreach ($activity as $extension => $ext) {
 	}
 
 	//determine extension draggable state
-	if (!in_array($extension, $_SESSION['user']['extensions']) && $ext_state != "ringing") {
-		$draggable = false;
+	if (!in_array($extension, $_SESSION['user']['extensions'])) {
+		if ($ext_state == "ringing") {
+			if ($_GET['vd_ext_from'] == '') {
+				$draggable = true; // selectable - is ringing so can transfer away the call (can set as vd_ext_from)
+			}
+			else {
+				$draggable = false; // unselectable - is ringing so can't send a call to the ext (can't set as vd_ext_to)
+			}
+		}
+		else if ($ext_state == 'active') {
+			$draggable = false; // unselectable - on a call already so can't transfer or send a call to the ext (can't set as vd_ext_from or vd_ext_to)
+		}
+		else { // idle
+			if ($_GET['vd_ext_from'] == '') {
+				$draggable = false; // unselectable - is idle, but can't initiate a call from the ext as is not assigned to user (can't set as vd_ext_from)
+			}
+			else {
+				$draggable = true; // selectable - is idle, so can transfer a call in to ext (can set as vd_ext_to).
+			}
+		}
 	}
-	else if ($ext['uuid'] != '' && $ext['call_uuid'] == $ext['uuid'] && $ext['variable_bridge_uuid'] == '') {
+	else if ($ext['uuid'] != '' && $ext['uuid'] == $ext['call_uuid'] && $ext['variable_bridge_uuid'] == '') {
 		$draggable = false;
 	}
 	else if ($ext_state == 'ringing' && $ext['variable_call_direction'] == 'local') {
@@ -157,12 +176,12 @@ foreach ($activity as $extension => $ext) {
 		$draggable = true;
 	}
 
-	$block .= "<div id='".$extension."' class='ext ".$style."' ".(($ext_state != 'active' && $ext_state != 'ringing') ? "ondrop='drop(event, this.id);' ondragover='allowDrop(event, this.id);' ondragleave='discardDrop(event, this.id);'" : null).">"; // TO
+	$block .= "<div id='".$extension."' class='ext ".$style."' ".(($_GET['vd_ext_from'] == $extension || $_GET['vd_ext_to'] == $extension) ? "style='border-style: dotted;'" : null)." ".(($ext_state != 'active' && $ext_state != 'ringing') ? "ondrop='drop(event, this.id);' ondragover='allowDrop(event, this.id);' ondragleave='discardDrop(event, this.id);'" : null).">"; // DRAG TO
 	$block .= "<table class='ext ".$style."'>";
 	$block .= "	<tr>";
 	$block .= "		<td class='ext_icon'>";
-	$block .= "			<span id='".$extension."'>"; // FROM
-	$block .= 				"<img id='".$call_identifier."' class='ext_icon' src='resources/images/person.png' ".(($draggable) ? "draggable='true' ondragstart='drag(event, this.parentNode.id);' " : "draggable='false' style='cursor: not-allowed;'").">";
+	$block .= "			<span name='".$extension."'>"; // DRAG FROM
+	$block .= 				"<img id='".$call_identifier."' class='ext_icon' src='resources/images/person.png' ".(($draggable) ? "draggable='true' ondragstart=\"drag(event, this.parentNode.getAttribute('name'));\" onclick=\"virtual_drag('".$call_identifier."', '".$extension."');\"" : "onfocus='this.blur();' draggable='false' style='cursor: not-allowed;'").">";
 	$block .= 			"</span>";
 	$block .= "		</td>";
 	$block .= "		<td class='ext_info ".$style."'>";
@@ -185,10 +204,10 @@ foreach ($activity as $extension => $ext) {
 	}
 	else {
 		if (in_array($extension, $_SESSION['user']['extensions'])) {
-			$block .= "		<img src='resources/images/keypad.png' style='width: 12px; height: 12px; border: none; margin-top: 26px; cursor: pointer;' align='right' onclick=\"toggle_destination('".$extension."');\">";
-			$block .= "		<form onsubmit=\"call_destination('".$extension."', document.getElementById('destination_".$extension."').value); return false;\">";
-			$block .= "			<input type='text' class='formfld' name='destination' id='destination_".$extension."' style='width: 110px; min-width: 110px; max-width: 110px; margin-top: 10px; text-align: center; display: none;' onblur=\"if (this.value == '') { refresh_start(); }\">";
-			$block .= "		</form>";
+// 			$block .= "		<img src='resources/images/keypad.png' style='width: 12px; height: 12px; border: none; margin-top: 26px; cursor: pointer;' align='right' onclick=\"toggle_destination('".$extension."');\">";
+// 			$block .= "		<form onsubmit=\"call_destination('".$extension."', document.getElementById('destination_".$extension."').value); return false;\">";
+// 			$block .= "			<input type='text' class='formfld' name='destination' id='destination_".$extension."' style='width: 110px; min-width: 110px; max-width: 110px; margin-top: 10px; text-align: center; display: none;' onblur=\"if (this.value == '') { refresh_start(); }\">";
+// 			$block .= "		</form>";
 		}
 	}
 	$block .= "		</td>";