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;
|
||||
}
|
||||
0
target/classes/static/js/historyloader.js
Normal file
0
target/classes/static/js/historyloader.js
Normal file
108
target/classes/static/js/uianimation.js
Normal file
108
target/classes/static/js/uianimation.js
Normal file
@@ -0,0 +1,108 @@
|
||||
var advancedVisibility = false;
|
||||
var selectMenu = $("#selectMenuContent");
|
||||
var advancedTab = $("#advanced");
|
||||
var basicID = $("#basicItemData")
|
||||
var advancedID = $("#advancedItemData");
|
||||
var focusedField = false;
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
function createMessageTab() {
|
||||
var items = document.getElementById("listItems");
|
||||
items.innerHTML += '<div class="menuItem">Item</div>';
|
||||
}
|
||||
|
||||
$("#optional").click(changeAdvancedVisibility);
|
||||
$(".menuFactory").click(createMessageTab);
|
||||
$('#historyTab').click(showHistory);
|
||||
|
||||
function showHistory(){
|
||||
$('#headers').css('display', 'none');
|
||||
$('.advancedMenuTabSelected').addClass('advancedMenuTab');
|
||||
$('.advancedMenuTabSelected').click(showHeaders);
|
||||
$('.advancedMenuTabSelected').removeClass('advancedMenuTabSelected');
|
||||
$('#history').css('display', 'block');
|
||||
$('#historyTab').addClass('advancedMenuTabSelected');
|
||||
$('#historyTab').removeClass('advancedMenuTab');
|
||||
$('#historyTab').off('click');
|
||||
}
|
||||
|
||||
function showHeaders(){
|
||||
$('#history').css('display', 'none');
|
||||
$('.advancedMenuTabSelected').addClass('advancedMenuTab');
|
||||
$('.advancedMenuTabSelected').click(showHistory);
|
||||
$('.advancedMenuTabSelected').removeClass('advancedMenuTabSelected');
|
||||
$('#headers').css('display', 'block');
|
||||
$('#headersTab').addClass('advancedMenuTabSelected');
|
||||
$('#headersTab').removeClass('advancedMenuTab');
|
||||
$('#headersTab').off('click');
|
||||
}
|
||||
|
||||
function focusInTip(element){
|
||||
showTip(element);
|
||||
focusedField = true;
|
||||
}
|
||||
|
||||
function focusOutTip(element){
|
||||
focusedField = false;
|
||||
hidTip(element);
|
||||
}
|
||||
|
||||
function hidTip(element){
|
||||
if(focusedField) return;
|
||||
$('#'+element).fadeOut(100);
|
||||
}
|
||||
|
||||
function showTip(element){
|
||||
if(focusedField) return;
|
||||
$('.collapsible').fadeOut(0);
|
||||
$('#'+element).fadeIn(100);
|
||||
}
|
||||
|
||||
$('#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')});
|
||||
Reference in New Issue
Block a user