Header table now triggers modified status
This commit is contained in:
		| @@ -187,6 +187,10 @@ body { | |||||||
|     pointer-events: none; |     pointer-events: none; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | .tile.active .btn-tile { | ||||||
|  |     opacity: 0; | ||||||
|  | } | ||||||
|  |  | ||||||
| .tile .content { | .tile .content { | ||||||
|     position: absolute; |     position: absolute; | ||||||
|     left: 0; |     left: 0; | ||||||
|   | |||||||
| @@ -3,12 +3,8 @@ | |||||||
| <head> | <head> | ||||||
|     <title>R11 MockedServices</title> |     <title>R11 MockedServices</title> | ||||||
|     <meta charset="utf-8"> |     <meta charset="utf-8"> | ||||||
|     <!-- TODO: Remove dependency --> |  | ||||||
|     <!-- <link rel="stylesheet" href="/Dependency/fontello-plus/css/fontello.css" type="text/css"/> --> |  | ||||||
|     <link rel="stylesheet" href="/css/modal.css" type="text/css"> |     <link rel="stylesheet" href="/css/modal.css" type="text/css"> | ||||||
|     <link rel="stylesheet" href="/css/commons/r11form.css" type="text/css"> |     <link rel="stylesheet" href="/css/commons/r11form.css" type="text/css"> | ||||||
|     <!-- <link rel="preconnect" href="https://fonts.gstatic.com"> --> |  | ||||||
|     <!-- <link href="https://fonts.googleapis.com/css2?family=Acme&family=Josefin+Slab:wght@500&display=swap" rel="stylesheet"> --> |  | ||||||
|     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> |     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> | ||||||
| </head> | </head> | ||||||
| <body> | <body> | ||||||
|   | |||||||
| @@ -1,6 +1,3 @@ | |||||||
| //TODO: Add delete buttons for messages |  | ||||||
| // TODO: Add function to add row |  | ||||||
| // TODO: Add remove closest tr function to header rows |  | ||||||
| var clientUUID = ''; | var clientUUID = ''; | ||||||
| var advancedDisplayed = false; | var advancedDisplayed = false; | ||||||
| var json = {}; | var json = {}; | ||||||
| @@ -226,10 +223,15 @@ function createLink(uuid, id){ | |||||||
|  |  | ||||||
| function fillHeaderTable(headers){ | function fillHeaderTable(headers){ | ||||||
|     var innerHTML = buildHeaderMapHtml(headers); |     var innerHTML = buildHeaderMapHtml(headers); | ||||||
|     $('#headerMapTable').html(innerHTML); |     refreshHeaderTable(innerHTML); | ||||||
|     $('.tableField').change(function(){setDataModified()}); | } | ||||||
|  |  | ||||||
|  | function refreshHeaderTable(html){ | ||||||
|  |     $('#headerMapTable').html(html); | ||||||
|  |     $('.table-map').change(function(){setDataModified()}); | ||||||
|     $('.btn-hashmap').click(function(){ |     $('.btn-hashmap').click(function(){ | ||||||
|         $(this).closest('tr').remove(); |         $(this).closest('tr').remove(); | ||||||
|  |         setDataModified(); | ||||||
|     }) |     }) | ||||||
| } | } | ||||||
|  |  | ||||||
| @@ -241,14 +243,11 @@ function buildHeaderMapHtml(headers){ | |||||||
|     return innerHTML; |     return innerHTML; | ||||||
| } | } | ||||||
|  |  | ||||||
| // TODO: Add this click remove closest tr |  | ||||||
|  |  | ||||||
|  |  | ||||||
| function addRow(key, value){ | function addRow(key, value){ | ||||||
|     var headerMap = $('#headerMapTable'); |     var headerMap = $('#headerMapTable'); | ||||||
|     var headersMapHtml = headerMap.html(); |     var headersMapHtml = headerMap.html(); | ||||||
|     headersMapHtml += buildRowHtml(key, value); |     headersMapHtml += buildRowHtml(key, value); | ||||||
|     headerMap.html(headersMapHtml); |     refreshHeaderTable(headersMapHtml); | ||||||
| } | } | ||||||
|  |  | ||||||
| const newRowInput = function(){ | const newRowInput = function(){ | ||||||
| @@ -258,6 +257,7 @@ const newRowInput = function(){ | |||||||
|         addRow(hName.val(), hValue.val()); |         addRow(hName.val(), hValue.val()); | ||||||
|         hName.val(null); |         hName.val(null); | ||||||
|         hValue.val(null); |         hValue.val(null); | ||||||
|  |         setDataModified(); | ||||||
|     } |     } | ||||||
| } | } | ||||||
|  |  | ||||||
| @@ -270,8 +270,8 @@ function checkIfInputValid(input){ | |||||||
| function buildRowHtml(key, value){ | function buildRowHtml(key, value){ | ||||||
|     return '' +  |     return '' +  | ||||||
|     '<tr>' + |     '<tr>' + | ||||||
|         '<td><input class="key" value="' + key + '"></td>' + |         '<td><input class="key data-field" value="' + key + '"></td>' + | ||||||
|         '<td><input value="' + value + '"></td>' + |         '<td><input class="data-field" value="' + value + '"></td>' + | ||||||
|         '<td><button class="modification-button btn-hashmap"><i class="icon-cancel"></i></button></td>' + |         '<td><button class="modification-button btn-hashmap"><i class="icon-cancel"></i></button></td>' + | ||||||
|     '</tr>'; |     '</tr>'; | ||||||
| } | } | ||||||
| @@ -299,8 +299,6 @@ function fillMessageList(){ | |||||||
|     }) |     }) | ||||||
| } | } | ||||||
|  |  | ||||||
|  |  | ||||||
| //TODO: Implement methods where its possible |  | ||||||
| function findJsonById(id){ | function findJsonById(id){ | ||||||
|     return json[findJsonIndexById(id)]; |     return json[findJsonIndexById(id)]; | ||||||
| } | } | ||||||
|   | |||||||
| @@ -11,7 +11,6 @@ const dataLossModalYes = dataLossModal.children().eq(2).children().eq(0); | |||||||
| const dataLossModalNo = dataLossModal.children().eq(2).children().eq(1); | const dataLossModalNo = dataLossModal.children().eq(2).children().eq(1); | ||||||
| const allModals = $('.modal'); | const allModals = $('.modal'); | ||||||
| const btnModalClose = $('.modal button'); | const btnModalClose = $('.modal button'); | ||||||
| //TODO: Implement in datatransfer |  | ||||||
| const closeModals = function() { | const closeModals = function() { | ||||||
|     hideModal(allModals); |     hideModal(allModals); | ||||||
| } | } | ||||||
|   | |||||||
| @@ -187,6 +187,10 @@ body { | |||||||
|     pointer-events: none; |     pointer-events: none; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | .tile.active .btn-tile { | ||||||
|  |     opacity: 0; | ||||||
|  | } | ||||||
|  |  | ||||||
| .tile .content { | .tile .content { | ||||||
|     position: absolute; |     position: absolute; | ||||||
|     left: 0; |     left: 0; | ||||||
|   | |||||||
| @@ -3,12 +3,8 @@ | |||||||
| <head> | <head> | ||||||
|     <title>R11 MockedServices</title> |     <title>R11 MockedServices</title> | ||||||
|     <meta charset="utf-8"> |     <meta charset="utf-8"> | ||||||
|     <!-- TODO: Remove dependency --> |  | ||||||
|     <!-- <link rel="stylesheet" href="/Dependency/fontello-plus/css/fontello.css" type="text/css"/> --> |  | ||||||
|     <link rel="stylesheet" href="/css/modal.css" type="text/css"> |     <link rel="stylesheet" href="/css/modal.css" type="text/css"> | ||||||
|     <link rel="stylesheet" href="/css/commons/r11form.css" type="text/css"> |     <link rel="stylesheet" href="/css/commons/r11form.css" type="text/css"> | ||||||
|     <!-- <link rel="preconnect" href="https://fonts.gstatic.com"> --> |  | ||||||
|     <!-- <link href="https://fonts.googleapis.com/css2?family=Acme&family=Josefin+Slab:wght@500&display=swap" rel="stylesheet"> --> |  | ||||||
|     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> |     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> | ||||||
| </head> | </head> | ||||||
| <body> | <body> | ||||||
|   | |||||||
| @@ -1,6 +1,3 @@ | |||||||
| //TODO: Add delete buttons for messages |  | ||||||
| // TODO: Add function to add row |  | ||||||
| // TODO: Add remove closest tr function to header rows |  | ||||||
| var clientUUID = ''; | var clientUUID = ''; | ||||||
| var advancedDisplayed = false; | var advancedDisplayed = false; | ||||||
| var json = {}; | var json = {}; | ||||||
| @@ -226,10 +223,15 @@ function createLink(uuid, id){ | |||||||
|  |  | ||||||
| function fillHeaderTable(headers){ | function fillHeaderTable(headers){ | ||||||
|     var innerHTML = buildHeaderMapHtml(headers); |     var innerHTML = buildHeaderMapHtml(headers); | ||||||
|     $('#headerMapTable').html(innerHTML); |     refreshHeaderTable(innerHTML); | ||||||
|     $('.tableField').change(function(){setDataModified()}); | } | ||||||
|  |  | ||||||
|  | function refreshHeaderTable(html){ | ||||||
|  |     $('#headerMapTable').html(html); | ||||||
|  |     $('.table-map').change(function(){setDataModified()}); | ||||||
|     $('.btn-hashmap').click(function(){ |     $('.btn-hashmap').click(function(){ | ||||||
|         $(this).closest('tr').remove(); |         $(this).closest('tr').remove(); | ||||||
|  |         setDataModified(); | ||||||
|     }) |     }) | ||||||
| } | } | ||||||
|  |  | ||||||
| @@ -241,14 +243,11 @@ function buildHeaderMapHtml(headers){ | |||||||
|     return innerHTML; |     return innerHTML; | ||||||
| } | } | ||||||
|  |  | ||||||
| // TODO: Add this click remove closest tr |  | ||||||
|  |  | ||||||
|  |  | ||||||
| function addRow(key, value){ | function addRow(key, value){ | ||||||
|     var headerMap = $('#headerMapTable'); |     var headerMap = $('#headerMapTable'); | ||||||
|     var headersMapHtml = headerMap.html(); |     var headersMapHtml = headerMap.html(); | ||||||
|     headersMapHtml += buildRowHtml(key, value); |     headersMapHtml += buildRowHtml(key, value); | ||||||
|     headerMap.html(headersMapHtml); |     refreshHeaderTable(headersMapHtml); | ||||||
| } | } | ||||||
|  |  | ||||||
| const newRowInput = function(){ | const newRowInput = function(){ | ||||||
| @@ -258,6 +257,7 @@ const newRowInput = function(){ | |||||||
|         addRow(hName.val(), hValue.val()); |         addRow(hName.val(), hValue.val()); | ||||||
|         hName.val(null); |         hName.val(null); | ||||||
|         hValue.val(null); |         hValue.val(null); | ||||||
|  |         setDataModified(); | ||||||
|     } |     } | ||||||
| } | } | ||||||
|  |  | ||||||
| @@ -270,8 +270,8 @@ function checkIfInputValid(input){ | |||||||
| function buildRowHtml(key, value){ | function buildRowHtml(key, value){ | ||||||
|     return '' +  |     return '' +  | ||||||
|     '<tr>' + |     '<tr>' + | ||||||
|         '<td><input class="key" value="' + key + '"></td>' + |         '<td><input class="key data-field" value="' + key + '"></td>' + | ||||||
|         '<td><input value="' + value + '"></td>' + |         '<td><input class="data-field" value="' + value + '"></td>' + | ||||||
|         '<td><button class="modification-button btn-hashmap"><i class="icon-cancel"></i></button></td>' + |         '<td><button class="modification-button btn-hashmap"><i class="icon-cancel"></i></button></td>' + | ||||||
|     '</tr>'; |     '</tr>'; | ||||||
| } | } | ||||||
| @@ -299,8 +299,6 @@ function fillMessageList(){ | |||||||
|     }) |     }) | ||||||
| } | } | ||||||
|  |  | ||||||
|  |  | ||||||
| //TODO: Implement methods where its possible |  | ||||||
| function findJsonById(id){ | function findJsonById(id){ | ||||||
|     return json[findJsonIndexById(id)]; |     return json[findJsonIndexById(id)]; | ||||||
| } | } | ||||||
|   | |||||||
| @@ -11,7 +11,6 @@ const dataLossModalYes = dataLossModal.children().eq(2).children().eq(0); | |||||||
| const dataLossModalNo = dataLossModal.children().eq(2).children().eq(1); | const dataLossModalNo = dataLossModal.children().eq(2).children().eq(1); | ||||||
| const allModals = $('.modal'); | const allModals = $('.modal'); | ||||||
| const btnModalClose = $('.modal button'); | const btnModalClose = $('.modal button'); | ||||||
| //TODO: Implement in datatransfer |  | ||||||
| const closeModals = function() { | const closeModals = function() { | ||||||
|     hideModal(allModals); |     hideModal(allModals); | ||||||
| } | } | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user