T157 message selection added

.idea/workspace.xml

@@ -21,9 +21,7 @@
   <component name="ChangeListManager">
     <list default="true" id="458cde88-df3d-44bc-9d57-a33823e2f1a6" name="Default Changelist" comment="">
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/main/resources/static/css/main.css" beforeDir="false" afterPath="$PROJECT_DIR$/src/main/resources/static/css/main.css" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/src/main/resources/static/js/datatransfer.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/main/resources/static/js/datatransfer.js" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/main/resources/templates/mock.html" beforeDir="false" afterPath="$PROJECT_DIR$/src/main/resources/templates/mock.html" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -307,7 +305,7 @@
       <workItem from="1611659140629" duration="2109000" />
       <workItem from="1611757446709" duration="6743000" />
       <workItem from="1611826821050" duration="10679000" />
-      <workItem from="1611915874625" duration="12997000" />
+      <workItem from="1611915874625" duration="15194000" />
     </task>
     <task id="LOCAL-00077" summary="testing jenkins docker">
       <created>1601453886631</created>

src/main/resources/static/js/datatransfer.js

@@ -2,18 +2,28 @@ var json;
 function getData(uuid){
     $.getJSON('http://localhost:8097/mock/json', function(data) {
         json = data;
+        console.log("Json received");
         fillMessageList();
-        initializeMock(json, 0)
+        console.log("List initiated");
+        loadMessage(json[0].mockedResponseId);
+        console.log("Message loaded");
+        // initializeMock(json, 0)
     });
 }
 
-function initializeMock(json, id){
+function clearMock(){
-    fillStaticFields(json[id].clientUUID
+    fillStaticFields('','','','');
-        , json[id].mockedResponseId
+    $('#headerTable').html('');
-        , json[id].mediaType
+}
-        , json[id].messageBody
+
-        , json[id].httpStatus);
+function initializeMock(index){
-    fillHeaderTable(json[id].httpHeaders);
+    clearMock();
+    fillStaticFields(json[index].clientUUID
+        , json[index].mockedResponseId
+        , json[index].mediaType
+        , json[index].messageBody
+        , json[index].httpStatus);
+    fillHeaderTable(json[index].httpHeaders);
 }
 
 function fillStaticFields(uuid, id, mediaType, body, httpStatus){
@@ -70,10 +80,36 @@ function fillMessageList(){
     $("#listItems").append(innerHTML);
 }
 
+function loadMessage(id){
+    for(let i=0; i<json.length; i++){
+        if(id == json[i].mockedResponseId){
+            console.log("Message found");
+            initializeMock(i);
+            console.log("Fields initialized");
+            selectMessage(id);
+            console.log("Selection complete");
+            return;
+        }
+    }
+    console.log("Message not found");
+}
+
+function selectMessage(id){
+    console.log("Selecting message...");
+    $(".menuItemSelected").on("click");
+    $(".menuItemSelected").addClass("menuItem");
+    $(".menuItemSelected").removeClass("menuItemSelected");
+    console.log("Selected message deselected");
+    let itemId = '#item_'+id;
+    $(itemId).off("click");
+    $(itemId).addClass("menuItemSelected");
+    $(itemId).removeClass("menuItem");
+    console.log("Selected message selected");
+}
+
 function generateMessageTileHtml(id, httpStatus, mediaType){
-    var innerHTML = '<div class="menuItem" id="item' + id + '">' +
+    var innerHTML = '<div class="menuItem" id="item_' + id + '" onclick="loadMessage('+ id +')">' +
         '<table><tr><td>Id: '+ id +'</td></tr>' +
-        // '<tr><td>Content-type: '+mediaType+'</td></tr>' +
         '<tr><td>Http-status: '+ httpStatus +'</td></tr>' +
         '</table></div>';
     return innerHTML;