[usb-lock-off] edit-rule button for switching from dropdown to input text is now working in both directions.

1 files changed, 59 insertions, 7 deletions

diff --git a/modules-available/usblockoff/templates/usb-edit-rule.html b/modules-available/usblockoff/templates/usb-edit-rule.html
index 8f31fdd9..e2854f50 100644
--- a/modules-available/usblockoff/templates/usb-edit-rule.html
+++ b/modules-available/usblockoff/templates/usb-edit-rule.html
@@ -35,10 +35,42 @@
 		$('a.btn[title]').tooltip({placement: "auto", html: true});
 
 		$('.switch-input').click(function() {
-			var $op = $(this).parent().find('select');
+			//var $op = $(this).parent().find('select');
+			var $op = $(this).parent().find(':input').not('button');
 			var val = $op.val();
-			$op.replaceWith($('<input class="form-control" type="text">').attr('name', $op.attr('name')).val(val));
+			console.log(val);
+			if ($op[0].localName == 'select') {
+				$op.replaceWith($('<input class="form-control" type="text">').attr('name', $op.attr('name')).attr('id', $op.attr('id')).val(val));
+
+				if ($op.attr('id') === 'prop-vid') {
+					remakeChangeEvent(val);
+				}
+
+				$(this).parent().find('button span').removeClass('glyphicon-pencil').addClass('glyphicon glyphicon-list-alt');
+
+			} else if ($op[0].localName == 'input') {
+				$op.replaceWith($('<select class="form-control">').attr('name', $op.attr('name')).attr('id', $op.attr('id')).val(val));
+
+				if ($op.attr('id') === 'prop-vid') {
+					var vendorid = $('#prop-vid');
+					$.each(idArray, function (key, value) {
+						vendorid.append($('<option></option>').val(key).html(value['name']));
+					});
+
+					vendorid.val(val);
+					remakeChangeEvent(val);
+				} else if ($op.attr('id') === 'prop-pid') {
+					var productid = $('#prop-pid');
+					$.each(idArray[$('#prop-vid').val()]['products'], function(key, value) {
+						productid.append($('<option></option>').val(key).html(value));
+					});
+					productid.val(val);
+				}
+				$(this).parent().find('button span').removeClass('glyphicon-list-alt').addClass('glyphicon-pencil');
+			}
+			remakeUpdateEvent();
 		});
+		remakeUpdateEvent();
 
 		var vendorid = $('#prop-vid');
 		var productid = $('#prop-pid');
@@ -46,11 +78,6 @@
 		var vid = vendorid.val();
 		vendorid.empty();
 
-
-		$('[id^="prop-"]').change(function () {
-			updateAttributes();
-		});
-
 		vendorid.change(function () {
 			var $this = $(this);
 			var vid = $this.val();
@@ -83,5 +110,30 @@
 		$('#attributes').val(JSON.stringify(attributes));
 	}
 
+	function remakeUpdateEvent() {
+		$('[id^="prop-"]').change(function () {
+			updateAttributes();
+		});
+	}
+
+	function remakeChangeEvent(val) {
+		var vendorid = $('#prop-vid');
+
+		vendorid.change(function () {
+			var productid = $('#prop-pid');
+
+			var $this = $(this);
+			var vid = $this.val();
+			var pid = productid.val();
+			productid.empty();
+			$.each(idArray[vid]['products'], function(key, value) {
+				productid.append($('<option></option>').val(key).html(value));
+			});
+			productid.val(pid);
+		});
+
+		vendorid.val(val);
+		vendorid.change();
+	}
 
 </script>