Added view button for each subscription in table (#27)

Author: ValentinTyhonov

src/main/resources/static/js/subscription.js

@@ -363,16 +363,17 @@ jQuery(document).ready(function() {
                 "orderable": false,
                 "title": "Action",
                 "data": null,
-                "width":"150px",
                 "render": function ( data, type, row, meta ) {
                     if(isSecured == true && row.userName == currentUser && row.userName != null) {
-	                    return '<button data-toggle="tooltip" title="Edit subscription" class="btn btn-sm btn-primary edit_record">Edit</button>     '
-	                    + '<button data-toggle="tooltip" title="Delete subscription from EI" class="btn btn-sm btn-danger delete_record">Delete</button>';
+                        return '<button data-toggle="tooltip" title="View subscription" class="btn btn-sm btn-success view_record">View</button> '
+	                      + '<button data-toggle="tooltip" title="Edit subscription" class="btn btn-sm btn-primary edit_record">Edit</button> '
+		                    + '<button data-toggle="tooltip" title="Delete subscription from EI" class="btn btn-sm btn-danger delete_record">Delete</button>';
                     } else if(isSecured == false) {
-                        return '<button data-toggle="tooltip" title="Edit subscription" class="btn btn-sm btn-primary edit_record">Edit</button>     '
+                        return '<button data-toggle="tooltip" title="View subscription" class="btn btn-sm btn-success view_record">View</button> '
+                        + '<button data-toggle="tooltip" title="Edit subscription" class="btn btn-sm btn-primary edit_record">Edit</button> '
                         + '<button data-toggle="tooltip" title="Delete subscription from EI" class="btn btn-sm btn-danger delete_record">Delete</button>';
                     } else {
-                        return '';
+                        return '<button data-toggle="tooltip" title="View subscription" class="btn btn-sm btn-success view_record">View</button>';
                     }
                 }
             }
@@ -586,46 +587,50 @@ jQuery(document).ready(function() {
 
 
     // /Start ## Reload Datatables ###########################################
-    function reload_table()
-    {
+    function reload_table() {
         table.ajax.reload(null,false); //reload datatable ajax
     }
     // /Stop ## Reload Datatables ############################################
 
-
-    // /Start ## Edit Subscription ###########################################
-    $('#table').on( 'click', 'tbody tr td button.edit_record', function (event) {
-        event.stopPropagation();
+		function get_subscription_data(object, mode) {
+				event.stopPropagation();
         event.preventDefault();
         // Fetch datatable row -> subscriptionName
-        var datatable_row_data = table.row( $(this).parents('tr') ).data();
+        var datatable_row_data = table.row( $(object).parents('tr') ).data();
         var id = datatable_row_data.subscriptionName;
         // AJAX Callback handling
         var callback = {
-            beforeSend : function () {
-            },
+            beforeSend : function () {},
             success : function (data, textStatus) {
-                populate_json(data, "edit");
+                populate_json(data, mode);
             },
             error : function (XMLHttpRequest, textStatus, errorThrown) {
                 $.jGrowl("Error: " + XMLHttpRequest.responseText, {
                     sticky : true,
                     theme : 'Error'
                 });
             },
-            complete : function () {
-            }
+            complete : function () {}
         };
         // Perform AJAX
         var ajaxHttpSender = new AjaxHttpSender();
         ajaxHttpSender.sendAjax(frontendServiceUrl + "/subscriptions/"+id, "GET", null, callback);
+    }
+
+    // /Start ## Edit Subscription ###########################################
+    $('#table').on( 'click', 'tbody tr td button.edit_record', function (event) {
+        get_subscription_data(this, "edit");
     });
     // /Stop ## Edit Subscription ###########################################
 
+		// /Start ## View Subscription ###########################################
+    $('#table').on( 'click', 'tbody tr td button.view_record', function (event) {
+        get_subscription_data(this, "view");
+    });
+    // /Stop ## View Subscription ###########################################
 
    // /Start ## populate JSON  ###########################################
-    function populate_json(data, save_method_in)
-    {
+    function populate_json(data, save_method_in) {
         var returnData = [data];
         if (returnData.length > 0) {
             vm.subscription([]);
@@ -650,18 +655,31 @@ jQuery(document).ready(function() {
             // Force update
             vm.subscription()[0].restPostBodyMediaType.valueHasMutated();
             $('#modal_form').modal('show');
-			if(save_method_in === "edit")
-			{
-				title_ = 'Edit Subscription';
-				
-			}else
-			{
-				title_ = 'Add Subscription';
-			}
-			$('.modal-title').text(title_);
+              if(save_method_in === "edit") {
+              title_ = 'Edit Subscription';
+              addEditMode();
+            } else if(save_method_in === "add") {
+              title_ = 'Add Subscription';
+              addEditMode();
+            } else {
+              title_ = 'View Subscription';
+              viewMode();
+            }
+            $('.modal-title').text(title_);
             save_method = save_method_in;
         }
     }
+
+    function addEditMode() {
+      $('#modal_form :button').show();
+      $('#modal_form :input').prop("disabled", false);
+    }
+    function viewMode() {
+      $('#modal_form :button').hide();
+      $('#modal_form :input').prop("disabled", true);
+      $('#modal_form .close').show();
+      $('#modal_form .close').prop("disabled", false);
+    }
    // /Stop ## pupulate JSON  ###########################################
 
 
@@ -670,8 +688,7 @@ jQuery(document).ready(function() {
         event.stopPropagation();
         event.preventDefault();
         var notificationMessageKeyValuesArray = vm.subscription()[0].notificationMessageKeyValues();
-        if(!vm.formpostkeyvaluepairs())
-        {
+        if(!vm.formpostkeyvaluepairs()) {
             notificationMessageKeyValuesArray[0].formkey=""; // OBS must be empty when NOT using REST POST Form key/value pairs
         }
 
@@ -790,7 +807,7 @@ jQuery(document).ready(function() {
             url = frontendServiceUrl + "/subscriptions";
             type = "POST";
 
-        } else {  // Update existing
+        } else if(save_method === 'edit') {  // Update existing
             url = frontendServiceUrl + "/subscriptions";
             type = "PUT";
         }