T201 updated gitignore
This commit is contained in:
339
target/classes/static/js/datatransfer.js
Normal file
339
target/classes/static/js/datatransfer.js
Normal file
@@ -0,0 +1,339 @@
|
||||
//TODO: Add delete buttons for messages
|
||||
//TODO: Save button deactivation after swap, post or delete
|
||||
//TODO: It sends request, gets responds but doesnt run a function!!
|
||||
//TODO: Warning is displayed twice
|
||||
var clientUUID = '';
|
||||
var json = {};
|
||||
var jsonIndex = 0;
|
||||
var htable_row = 0;
|
||||
var host = getDomain();
|
||||
var dataModified = false;
|
||||
const C_UUID = 'mock-uuid';
|
||||
const setModified = function(){
|
||||
setDataModified();
|
||||
}
|
||||
const setOrigin = function(){
|
||||
setDataOrigin();
|
||||
}
|
||||
|
||||
const getUpdate = function(){
|
||||
updateData();
|
||||
}
|
||||
$('#iconPlus').click(function(){addMessage()});
|
||||
$('#btn-addRow').click(function(){addRow()});
|
||||
//TODO remove later save onclick init
|
||||
$('#btn-save').click(getUpdate);
|
||||
|
||||
function getData(){
|
||||
loadCookies();
|
||||
$.getJSON(host + '/mock/json/'+clientUUID, function(data) {
|
||||
json = data;
|
||||
clientUUID = json[jsonIndex].clientUUID;
|
||||
setCookies();
|
||||
console.log(JSON.stringify(json));
|
||||
console.log("Json received");
|
||||
refreshData();
|
||||
});
|
||||
}
|
||||
|
||||
function getDomain(){
|
||||
var url = window.location.href;
|
||||
var arr = url.split("/");
|
||||
var result = arr[0] + "//" + arr[2];
|
||||
return result;
|
||||
}
|
||||
|
||||
function setDataModified(){
|
||||
if(dataModified) return;
|
||||
dataModified = true;
|
||||
$('#btn-save').removeClass('btn-inactive');
|
||||
$('#btn-save').addClass('btn-action');
|
||||
$('#btn-save').click(getUpdate);
|
||||
}
|
||||
|
||||
//Adding change listener to fields
|
||||
$('.field').change(setModified);
|
||||
|
||||
function setDataOrigin(){
|
||||
dataModified = false;
|
||||
$('#btn-save').addClass('btn-inactive');
|
||||
$('#btn-save').removeClass('btn-action');
|
||||
$('#btn-save').off();
|
||||
}
|
||||
|
||||
function displayDataLossWarn(){
|
||||
if(dataModified) alert('Data modification lost');
|
||||
}
|
||||
|
||||
function refreshData(){
|
||||
fillMessageList();
|
||||
console.log("List initiated");
|
||||
loadMessage(json[jsonIndex].mockedResponseId);
|
||||
console.log("Message loaded");
|
||||
}
|
||||
|
||||
function setCookies(){
|
||||
document.cookie = C_UUID + '=' +clientUUID+';';
|
||||
}
|
||||
|
||||
function loadCookies(){
|
||||
clientUUID = getCookie(C_UUID);
|
||||
}
|
||||
|
||||
function getCookie(cname) {
|
||||
var name = cname + '=';
|
||||
var decodedCookie = decodeURIComponent(document.cookie);
|
||||
var ca = decodedCookie.split(';');
|
||||
for(var i = 0; i <ca.length; i++) {
|
||||
var c = ca[i];
|
||||
while (c.charAt(0) == ' ') {
|
||||
c = c.substring(1);
|
||||
}
|
||||
if (c.indexOf(name) == 0) {
|
||||
return c.substring(name.length, c.length);
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
function displaySaveConfirmation(){
|
||||
alert('message has been saved');
|
||||
}
|
||||
|
||||
function updateData(){
|
||||
var updatedJson = generateJson();
|
||||
const dataSaved = function () {
|
||||
displaySaveConfirmation();
|
||||
setDataOrigin();
|
||||
getData();
|
||||
}
|
||||
var request = $.ajax({
|
||||
url: host + '/mock/json',
|
||||
type: 'PUT',
|
||||
data: JSON.stringify(updatedJson, null, 2),
|
||||
contentType: "application/json",
|
||||
});
|
||||
request.done(dataSaved);
|
||||
}
|
||||
|
||||
function addMessage(){
|
||||
displayDataLossWarn();
|
||||
var request = $.ajax({
|
||||
url: host + '/mock/json/'+clientUUID,
|
||||
type: 'POST',
|
||||
});
|
||||
request.done(function () {
|
||||
getData();
|
||||
});
|
||||
}
|
||||
|
||||
function removeTile(id){
|
||||
displayDataLossWarn();
|
||||
var jsonObject = findJsonById(id);
|
||||
var request = $.ajax({
|
||||
url: host + '/mock/json/'+clientUUID + '/' + id,
|
||||
type: 'DELETE',
|
||||
});
|
||||
request.done(function () {
|
||||
getData();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function clearMock(){
|
||||
fillStaticFields('','','','');
|
||||
htable_row = 0;
|
||||
$('#httpStatusValues').html('');
|
||||
}
|
||||
|
||||
function initializeMock(index){
|
||||
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){
|
||||
let link = createLink(uuid,id);
|
||||
$('#messageLink').html('<a href="' + link + '" target="_blank">' + link + '</a>');
|
||||
$('#httpStatus').val(httpStatus);
|
||||
$('#typeSelector').val(mediaType);
|
||||
$('#bodyEditor').val(body);
|
||||
$('#mockedMessageId').html(id);
|
||||
|
||||
}
|
||||
|
||||
function createLink(uuid, id){
|
||||
var link = host + '/klaus/v1/get/'+uuid+'/'+id;
|
||||
return link;
|
||||
}
|
||||
|
||||
function fillHeaderTable(headers){
|
||||
var innerHTML = $('#httpStatusValues').html();
|
||||
innerHTML += generateHeaderTable(headers);
|
||||
$('#httpStatusValues').html(innerHTML);
|
||||
$('.tableField').change(function(){setDataModified()});
|
||||
}
|
||||
//TODO: Add addRow() to generate new rows and populate them with data
|
||||
function generateHeaderTable(headers){
|
||||
let count = 0;
|
||||
let innerHTML = '';
|
||||
for(var item in headers){
|
||||
if( headers.hasOwnProperty(item) ) count++;
|
||||
}
|
||||
var keys = new Array(count);
|
||||
var values = new Array(count);
|
||||
let index = 0;
|
||||
for(var key in Object.keys(headers)){
|
||||
keys[index++]=Object.keys(headers)[key];
|
||||
}
|
||||
index = 0;
|
||||
for(var val in headers){
|
||||
values[index++]=headers[val];
|
||||
}
|
||||
|
||||
for(let i=0; i<count; i++){
|
||||
innerHTML+=
|
||||
'<tr id="hrow' + htable_row + '" class="httpStatusValue">' +
|
||||
'<td>' +
|
||||
'<input type="text" name="headerKey" placeholder="key" class="tableField textField-key" value="' + keys[i] + '"/></td>' +
|
||||
'<td>' +
|
||||
'<input type="text" name="headerValue" placeholder="value" class="tableField" value="' + values[i] + '"/></td>' +
|
||||
'<td class="btn-function-table btn-table-remove" onclick="removeRow(' + htable_row + ')">X</td>' +
|
||||
'</tr>';
|
||||
htable_row++;
|
||||
}
|
||||
return innerHTML;
|
||||
}
|
||||
|
||||
function removeRow(row){
|
||||
$('#hrow' + row).remove();
|
||||
setDataModified();
|
||||
}
|
||||
|
||||
function addRow(){
|
||||
var table = $('#httpStatusValues');
|
||||
var hkey = $('#headerKeyInput');
|
||||
var hval = $('#headerValueInput');
|
||||
if(hkey.val() == 'key' || hkey.val() == '' || hval.val() == 'value' || hval.val() == '') return;
|
||||
var innerHtml =
|
||||
'<tr id="hrow' + htable_row + '" class="httpStatusValue">' +
|
||||
'<td>' +
|
||||
'<input " type="text" name="headerKey" placeholder="key" class="tableField textField-key" value="' + hkey.val() +
|
||||
'"/></td>' +
|
||||
'<td>' +
|
||||
'<input " type="text" name="headerKey" placeholder="key" class="tableField" value="' + hval.val() + '"/></td>' +
|
||||
'<td class="btn-function-table btn-table-remove" onclick="removeRow(' + htable_row + ')">X</td>' +
|
||||
'</tr>';
|
||||
htable_row++;
|
||||
table.append(innerHtml);
|
||||
hkey.val('');
|
||||
hval.val('');
|
||||
setDataModified();
|
||||
}
|
||||
|
||||
function fillMessageList(){
|
||||
$("#listItems").html('');
|
||||
var innerHTML = '';
|
||||
for(let i=0; i<json.length; i++){
|
||||
innerHTML += generateMessageTileHtml(json[i].mockedResponseId, json[i].httpStatus, json[i].mediaType);
|
||||
}
|
||||
$("#listItems").append(innerHTML);
|
||||
}
|
||||
|
||||
|
||||
//TODO: Implement methods where its possible
|
||||
function findJsonById(id){
|
||||
return json[findJsonIndexById(id)];
|
||||
}
|
||||
|
||||
function findJsonIndexById(id){
|
||||
for(let i=0; i<json.length; i++)
|
||||
if(id == json[i].mockedResponseId) return i;
|
||||
}
|
||||
|
||||
function loadMessage(id){
|
||||
displayDataLossWarn();
|
||||
setDataOrigin();
|
||||
for(let i=0; i<json.length; i++){
|
||||
if(id == json[i].mockedResponseId){
|
||||
jsonIndex = i;
|
||||
console.log("Message found");
|
||||
initializeMock(jsonIndex);
|
||||
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 + '" onclick="loadMessage('+ id +')">' +
|
||||
'<table><tr><td>Id: '+ id +'</td></tr>' +
|
||||
'<tr><td>Http-status: '+ httpStatus +'</td></tr>' +
|
||||
'</table></div><div class="btn-del-MenuItem" onclick="removeTile(' + id + ')">X</div>' +
|
||||
'<div style="clear: both;"></div>';
|
||||
return innerHTML;
|
||||
}
|
||||
|
||||
|
||||
|
||||
function onbuild(){
|
||||
getData();
|
||||
sleep(1000);
|
||||
}
|
||||
|
||||
$(document).ready(onbuild());
|
||||
|
||||
function sleep(ms) {
|
||||
return new Promise(resolve => setTimeout(resolve, ms));
|
||||
}
|
||||
|
||||
|
||||
|
||||
function generateJson(){
|
||||
var newJson =
|
||||
{
|
||||
clientUUID: json[jsonIndex].clientUUID,
|
||||
mockedResponseId: json[jsonIndex].mockedResponseId,
|
||||
mediaType: $('#typeSelector').val(),
|
||||
messageBody: $('#bodyEditor').val(),
|
||||
httpStatus: $('#httpStatus').val(),
|
||||
httpHeaders: {},
|
||||
};
|
||||
newJson['httpHeaders'] = convertTableToJson();
|
||||
console.log(JSON.stringify(newJson, null, 2));
|
||||
json[jsonIndex] = newJson;
|
||||
return newJson;
|
||||
}
|
||||
|
||||
|
||||
function convertTableToJson(){
|
||||
var rows = $('.httpStatusValue');
|
||||
console.log("Rows: "+rows.length);
|
||||
var obj = {};
|
||||
var key;
|
||||
for(let i=0; i<rows.length; i++){
|
||||
key = rows.eq(i).children().eq(0).children().eq(0).val();
|
||||
obj[key] = rows.eq(i).children().eq(1).children().eq(0).val();
|
||||
}
|
||||
return obj;
|
||||
}
|
||||
Reference in New Issue
Block a user