Display message id in advanced mode

src/main/resources/static/js/uianimation.js

@@ -1,15 +1,21 @@
 var advancedVisibility = false;
 var selectMenu = $("#selectMenuContent");
 var advancedTab = $("#advanced");
+var basicID = $("#basicItemData")
+var advancedID = $("#advancedItemData");
 function changeAdvancedVisibility(){
     if(advancedVisibility){
         selectMenu.css('display', 'none');
         advancedTab.css('display', 'none');
+        advancedID.css('display', 'none');
+        basicID.css('display', 'block')
         advancedVisibility = false;
     }
     else {
         selectMenu.css('display', 'block');
         advancedTab.css('display', 'block');
+        advancedID.css('display', 'block');
+        basicID.css('display', 'none');
         advancedVisibility = true;
     }
 }

src/main/resources/templates/mock.html

@@ -25,7 +25,8 @@
         <div id="itemData">
             <form action="#" th:action="@{/mock/__${mockedMessageDto.clientUUID}__}"
                   th:object="${mockedMessageDto}" method="post">
-                <div id="itemDataHead" class="articleHead">Your message</div>
+                <div id="basicItemData" class="articleHead">Your message</div>
+                <div id="advancedItemData" class="articleHead" style="display: none;">Message id: [[*{mockedResponseId}]]</div>
                 <div id="link">
                     <p class="label">Your link</p>
                     <div id="messageLink" class="borderStyle">http://<span id="pubhost">localhost</span>:8097/klaus/v1/get/[[${mockedMessageDto.clientUUID}]]/[[${mockedMessageDto.mockedResponseId}]]</div>