mirror of
https://github.com/matrix-construct/construct
synced 2024-09-04 15:55:17 +02:00
246 lines
5.8 KiB
JavaScript
246 lines
5.8 KiB
JavaScript
/*
|
|
* IRCd Charybdis 5/Matrix
|
|
*
|
|
* Copyright (C) 2017 Charybdis Development Team
|
|
* Copyright (C) 2017 Jason Volk (jason@zemos.net)
|
|
*
|
|
* Permission to use, copy, modify, and/or distribute this software for any
|
|
* purpose with or without fee is hereby granted, provided that the above
|
|
* copyright notice and this permission notice is present in all copies.
|
|
*
|
|
* THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'' AND ANY EXPRESS OR
|
|
* IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
|
|
* WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
|
|
* DISCLAIMED. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY DIRECT,
|
|
* INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
|
|
* (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
|
|
* SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION)
|
|
* HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT,
|
|
* STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING
|
|
* IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
|
|
* POSSIBILITY OF SUCH DAMAGE.
|
|
*
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
/**
|
|
* UI tools
|
|
*/
|
|
|
|
/**
|
|
* Refresh a stylesheet over the DOM
|
|
*/
|
|
function reload_stylesheet(name = "charybdis.css")
|
|
{
|
|
let do_reload = (elem, name) =>
|
|
{
|
|
let date = new Date().getMilliseconds();
|
|
let repl = name + "?id=" + date;
|
|
$(elem).attr("href", repl);
|
|
};
|
|
|
|
$("link[rel=stylesheet]").each((i, elem) =>
|
|
{
|
|
let nombre = $(elem).attr("href").split('?')[0];
|
|
if(nombre != name)
|
|
return;
|
|
|
|
do_reload(elem, name);
|
|
console.log("reloaded style from " + name);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Ctrl menu
|
|
*
|
|
* To add our own control key codes to the client (prudentially) we use
|
|
* this object, which could appear as a menu if a DOM element wants to
|
|
* $watch it.
|
|
*/
|
|
client.ctrl =
|
|
{
|
|
menu:
|
|
{
|
|
"r":
|
|
{
|
|
name: "REFRESH",
|
|
icon: "fa-reload",
|
|
action: (event) =>
|
|
{
|
|
reload_stylesheet();
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
}
|
|
},
|
|
},
|
|
|
|
apply: function(visible, event = undefined, prevent_default = true)
|
|
{
|
|
this.visible = visible;
|
|
//client.apply();
|
|
if(event !== undefined && prevent_default === true)
|
|
event.preventDefault();
|
|
},
|
|
|
|
keydown: function(event)
|
|
{
|
|
if(event.which == 17)
|
|
return this.apply(true, event);
|
|
|
|
if(!this.visible)
|
|
return;
|
|
|
|
let letter = String.fromCharCode(event.which).toLowerCase();
|
|
let item = this.menu[letter];
|
|
if(item !== undefined)
|
|
item.action(event);
|
|
},
|
|
|
|
keyup: function(event)
|
|
{
|
|
if(event.which == 17)
|
|
return this.apply(false, event);
|
|
},
|
|
|
|
others: function(event)
|
|
{
|
|
return this.visible? this.apply(false) : undefined;
|
|
},
|
|
};
|
|
|
|
// Enable the root control-key menu on init
|
|
$(window).on("keyup", client.ctrl.keyup.bind(client.ctrl));
|
|
$(window).on("keydown", client.ctrl.keydown.bind(client.ctrl));
|
|
$(window).on("blur", client.ctrl.others.bind(client.ctrl));
|
|
|
|
/**
|
|
* Explorer
|
|
* (to be replaced with Angular)
|
|
* Recursive DOM object tree to represent JSON structure for recursive exploration.
|
|
*/
|
|
let explorer = function(state, elem, depth = 0)
|
|
{
|
|
let key = (member) => $(member).children(".key");
|
|
let name_elem = (member) => key(member).children(".name");
|
|
let name = (member) => name_elem(member).text().trim();
|
|
let icon = (member) => key(member).children(".icon");
|
|
let value = (member) => $(member).children(".value");
|
|
let value_visible = (member) => value(member).is(":visible");
|
|
let value_empty = (member) => value(member).html().trim().length == 0;
|
|
let value_object = (member) => value(member).children(".object").length != 0;
|
|
|
|
let icon_toggle = (member, active) =>
|
|
{
|
|
icon(member).toggleClass("fa-minus-square", active);
|
|
icon(member).toggleClass("fa-plus-square", !active);
|
|
};
|
|
|
|
let value_toggle = (member) =>
|
|
{
|
|
let activate = !value_visible(member);
|
|
icon_toggle(member, activate);
|
|
value(member).toggle();
|
|
};
|
|
|
|
let value_clicked = (member) =>
|
|
{
|
|
if($(value(member)).text().length != 0)
|
|
$(value(member)).html("<input class='input' type='text' value='" + $(value(member)).text() + "' />");
|
|
};
|
|
|
|
let member_clicked = (member) =>
|
|
{
|
|
value_toggle(member);
|
|
if(value_empty(member))
|
|
{
|
|
let key = name(member);
|
|
member.child = new explorer(state[key], value(member), depth + 1); // recurse
|
|
}
|
|
else delete member.child;
|
|
};
|
|
|
|
let member_click = (member) =>
|
|
{
|
|
key(member).click((event) => member_clicked(member));
|
|
};
|
|
|
|
let value_click = (member) =>
|
|
{
|
|
//value(member).click((event) => value_clicked(member));
|
|
};
|
|
|
|
let member_add = (root, key) =>
|
|
{
|
|
$(root).prepend($("#json_member").html()); // DOM template
|
|
let member = $(root).children(".member").first();
|
|
name_elem(member).append(key);
|
|
icon(member).addClass("fa-plus-square");
|
|
value(member).hide();
|
|
member_click(member);
|
|
value_click(member);
|
|
return member;
|
|
};
|
|
|
|
let member_add_object = (root, key) =>
|
|
{
|
|
let member = member_add(root, key);
|
|
if(!state[key] || Object.keys(state[key]).length == 0)
|
|
{
|
|
icon_toggle(member, true);
|
|
icon(member).css("color", "#C8C8C8");
|
|
}
|
|
};
|
|
|
|
let member_add_value = (root, key) =>
|
|
{
|
|
let member = member_add(root, key);
|
|
value(member).text(state[key]);
|
|
value_toggle(member);
|
|
};
|
|
|
|
let add = (root, key) =>
|
|
{
|
|
switch(typeof(state[key]))
|
|
{
|
|
case "object":
|
|
member_add_object(root, key);
|
|
break;
|
|
|
|
case "boolean":
|
|
case "number":
|
|
case "string":
|
|
member_add_value(root, key);
|
|
break;
|
|
}
|
|
};
|
|
|
|
// Add the outer object div to the content element as the root object/div
|
|
$(elem).prepend($("#json_object").html()); // DOM template
|
|
let root = $(elem).children(".object").first();
|
|
|
|
// Add member divs for each member of the object
|
|
for(let key in state)
|
|
add(root, key);
|
|
};
|
|
|
|
/** Explorer replacement here
|
|
*/
|
|
mc.ng.app.controller('explore', class extends mc.ng.controller
|
|
{
|
|
constructor($scope)
|
|
{
|
|
super("explore", $scope);
|
|
}
|
|
});
|
|
|
|
|
|
/**************************************
|
|
* Misc util
|
|
*
|
|
*/
|
|
|
|
mc.uri = function(string)
|
|
{
|
|
return encodeURIComponent(string);
|
|
};
|