Moved frontend of REST Mock to frontend container (solves #168)

Co-authored-by: Adam Bem <adam.bem@zoho.eu> Reviewed-on: #186 Reviewed-by: Mikolaj Widla <widlam@noreply.example.com>
2023-05-12 10:06:19 +02:00
parent 34038a2ce9
commit dc3df79fc1
26 changed files with 21 additions and 84 deletions
--- a/Frontend/assets/scripts/tools/mock/uianimation.js
+++ b/Frontend/assets/scripts/tools/mock/uianimation.js
@@ -0,0 +1,141 @@
+var advancedVisibility = false;
+var selectMenu = $("#selectMenuContent");
+var advancedTab = $("#advanced");
+var basicID = $("#basicItemData")
+var advancedID = $("#advancedItemData");
+var advancedUUIDOptions = $("#uuid-validation-strategy");
+var focusedField = false;
+function changeAdvancedVisibility(){
+    if(advancedVisibility){
+        selectMenu.removeClass('active');
+        advancedTab.removeClass('active');
+        advancedID.removeClass('active');
+        advancedUUIDOptions.removeClass('active');
+        basicID.addClass('active');
+        advancedVisibility = false;
+    }
+    else {
+        selectMenu.addClass('active');
+        advancedTab.addClass('active');
+        advancedID.addClass('active');
+        advancedUUIDOptions.addClass('active');
+        basicID.removeClass('active');
+        advancedVisibility = true;
+    }
+    setCookie();
+}
+
+const historyFilter = $('#history-filter');
+const historyFilterSwitch = function(){
+    historyFilter.toggleClass('active');
+}
+
+$("#optional").click(changeAdvancedVisibility);
+$('#historyTab').click(showHistory);
+$('#btn-history-filter').click(historyFilterSwitch);
+
+
+
+const tabitem = $('.tabitem');
+function showHistory(){
+    $('#headersTab').click(showHeaders);
+    tabitem.removeClass('active');
+    $('.tabcontent').removeClass('active');
+    $('#history').addClass('active');
+    $('#historyTab').addClass('active');
+    $('#historyTab').off('click');
+    initializeHistory();
+}
+
+function initializeHistory(){
+    historyFilter.removeClass('active');
+    getLast24hHistoryData();
+}
+
+
+
+function showHeaders(){
+    $('#historyTab').click(showHistory);
+    tabitem.removeClass('active');
+    $('.tabcontent').removeClass('active');
+    $('#headers').addClass('active');
+    $('#headersTab').addClass('active');
+    $('#headersTab').off('click');
+}
+
+function focusInTip(element){
+    showTip(element);
+    focusedField = true;
+}
+
+function focusOutTip(element){
+    focusedField = false;
+    hidTip(element);
+}
+
+function hidTip(element){
+    if(focusedField) return;
+    $('#'+element).removeClass('active');
+}
+
+function showTip(element){
+    if(focusedField) return;
+    $('.tip').removeClass('active');
+    $('#'+element).addClass('active');
+}
+
+$('#messageLink').mouseover(function(){showTip('messageLinkTip')});
+$('#messageLink').mouseleave(function(){hidTip('messageLinkTip')});
+
+$('#httpStatus').mouseover(function(){showTip('httpStatusTip')});
+$('#httpStatus').focusin(function(){focusInTip('httpStatusTip')});
+$('#httpStatus').mouseleave(function(){hidTip('httpStatusTip')});
+$('#httpStatus').focusout(function(){focusOutTip('httpStatusTip')});
+
+$('#typeSelector').mouseover(function(){showTip('typeSelectorTip')});
+$('#typeSelector').focusin(function(){focusInTip('typeSelectorTip')});
+$('#typeSelector').mouseleave(function(){hidTip('typeSelectorTip')});
+$('#typeSelector').focusout(function(){focusOutTip('typeSelectorTip')});
+
+$('#bodyEditor').mouseover(function(){showTip('bodyEditorTip')});
+$('#bodyEditor').focusin(function(){focusInTip('bodyEditorTip')});
+$('#bodyEditor').mouseleave(function(){hidTip('bodyEditorTip')});
+$('#bodyEditor').focusout(function(){focusOutTip('bodyEditorTip')});
+
+$('#headersTab').mouseover(function(){showTip('headersTabTip')});
+$('#headersTab').mouseleave(function(){hidTip('headersTabTip')});
+
+$('#historyTab').mouseover(function(){showTip('historyTabTip')});
+$('#historyTab').mouseleave(function(){hidTip('historyTabTip')});
+
+$('#headerKeyInput').mouseover(function(){showTip('newHeaderTip')});
+$('#headerKeyInput').focusin(function(){focusInTip('newHeaderTip')});
+$('#headerKeyInput').mouseleave(function(){hidTip('newHeaderTip')});
+$('#headerKeyInput').focusout(function(){focusOutTip('newHeaderTip')});
+
+$('#headerValueInput').mouseover(function(){showTip('newHeaderTip')});
+$('#headerValueInput').focusin(function(){focusInTip('newHeaderTip')});
+$('#headerValueInput').mouseleave(function(){hidTip('newHeaderTip')});
+$('#headerValueInput').focusout(function(){focusOutTip('newHeaderTip')});
+
+$('#btnSave').mouseover(function(){showTip('btnSaveTip');});
+$('#btnSave').focusin(function(){focusInTip('btnSaveTip')});
+$('#btnSave').mouseleave(function(){hidTip('btnSaveTip')});
+$('#btnSave').focusout(function(){focusOutTip('btnSaveTip')});
+
+$('#new-tile').mouseover(function(){showTip('btn-newTileTip');});
+$('#new-tile').mouseleave(function(){hidTip('btn-newTileTip')});
+$('#new-tile').focusout(function(){focusOutTip('btn-newTileTip')});
+
+$('#listItems').mouseover(function(){showTip('messagesTip');});
+$('#listItems').mouseleave(function(){hidTip('messagesTip')});
+
+
+$('#uuid-edit-field').mouseover(function(){ showTip('UUIDFieldTip') });
+$('#uuid-edit-field').mouseleave(function(){ hidTip('UUIDFieldTip') });
+
+$('#uuid-validation-strategy').mouseover(function(){ showTip('UUIDValidationStrategyTip') });
+$('#uuid-validation-strategy').mouseleave(function(){ hidTip('UUIDValidationStrategyTip') });
+
+$('#editableBlock').mouseover( function(){ showTip('UUIDEditionTip') } );
+$('#editableBlock').mouseleave(function(){ hidTip('UUIDEditionTip') });