summaryrefslogtreecommitdiff
path: root/webcards/scripts/gui/input.js
diff options
context:
space:
mode:
authorKyle Gunger <corechg@gmail.com>2020-04-03 16:44:23 -0400
committerKyle Gunger <corechg@gmail.com>2020-04-03 16:44:23 -0400
commit1697da112a9b9f529fad2f54c62aecd7bbb614e6 (patch)
tree68c7cd383107e824953b6aa213d05d9a6842b73f /webcards/scripts/gui/input.js
parent3040a822085adeb9025ddc1a4573cf37cb37d377 (diff)
[WEBCARDS] Update some webcards stuff
Diffstat (limited to 'webcards/scripts/gui/input.js')
-rw-r--r--webcards/scripts/gui/input.js159
1 files changed, 159 insertions, 0 deletions
diff --git a/webcards/scripts/gui/input.js b/webcards/scripts/gui/input.js
new file mode 100644
index 0000000..c349a07
--- /dev/null
+++ b/webcards/scripts/gui/input.js
@@ -0,0 +1,159 @@
+var inputFuncs = {
+ createInput: function(type = "text", wrapped = false, id) {
+ var el = document.createElement("input");
+ el.setAttribute("type", type);
+
+ if(typeof id == "string")
+ el.setAttribute("id", id);
+
+ if(wrapped) {
+ var wrapper = document.createElement("div");
+ wrapper.className = "input-container";
+ wrapper.setAttribute("type", type);
+ wrapper.setAttribute("onclick", "this.firstElementChild.click()");
+ wrapper.appendChild(el);
+ wrapper.input = el;
+ return wrapper;
+ }
+
+ el.getValue = function () {
+ return this.value;
+ }
+ return el;
+ },
+
+ inputLabel(text, id) {
+ var el = document.createElement("label");
+ el.innerText = text;
+ if(typeof id == "string")
+ el.setAttribute("for", id);
+ return el;
+ },
+
+ colorInput: function(value, id) {
+ var el = this.createInput("color", true, id);
+ el.value = value;
+ return el;
+ },
+
+ textInput: function(value, placeholder, id) {
+ var el = this.createInput("text", false, id);
+ el.setAttribute("placeholder", placeholder);
+ el.value = value;
+ return el;
+ },
+
+ numberInput: function(value, id) {
+ var el = this.createInput("number", false, id);
+ el.value = value;
+ return el;
+ },
+
+ fileInput: function(value, id) {
+ var el = this.createInput("file", true, id);
+
+ el.value = value;
+
+ el.setAttribute("data-files", "Choose a file");
+
+ el.firstElementChild.onchange = function () {
+ let text = "";
+ switch (this.files.length) {
+ case 0:
+ text = "Choose a file";
+ break;
+ case 1:
+ text = "File: " + this.files[0].name;
+ break;
+ default:
+ text = "Files: " + this.files[0].name + "...";
+ break;
+ }
+ el.setAttribute("data-files", text);
+ }
+
+ return el;
+ },
+
+ checkboxInput: function(checked = false, id) {
+ var el = this.createInput("checkbox", false, id);
+ if(checked)
+ el.setAttribute("checked");
+ return el;
+ },
+
+ radioInput: function(group, value, checked = false, id) {
+ var el = this.createInput("radio", false, id);
+ el.setAttribute("name", group);
+ el.setAttribute("value", value);
+ if(checked)
+ el.checked = true;
+ return el;
+ },
+
+ radioInputs: function(group, names, values, checked = 0) {
+ var wrapper = document.createElement("div");
+ wrapper.className = "input-container";
+ wrapper.setAttribute("type", "radio");
+
+ wrapper.getValue = function() {
+ for(let i = 0; i < this.children.length; i++){
+ if(this.children[i].checked)
+ return this.children[i].value;
+ }
+ };
+
+ for(let i = 0; i < values.length; i++) {
+ wrapper.appendChild(this.inputLabel(names[i], group+"-"+i));
+ if(i == checked)
+ wrapper.appendChild(this.radioInput(group, values[i], true, group+"-"+i));
+ else
+ wrapper.appendChild(this.radioInput(group, values[i], false, group+"-"+i));
+ wrapper.appendChild(document.createElement("br"));
+ }
+
+ return wrapper;
+ },
+
+ wrapInput: function(el) {
+
+ }
+};
+
+function Settings () {
+ this.settings = {
+ username: {
+ type: "text",
+ args: [Math.floor(Math.random() * 100000), "Username", "userName"]
+ }
+ };
+
+ this.genSettings();
+}
+
+Settings.prototype = {
+ getSettings: function() {
+ var out = {};
+ for(let key in this.settings) {
+
+ }
+ },
+
+ putSettings: function (el) {
+ for(let key in this.settings) {
+ el.appendChild(this.settings[key]);
+ }
+ },
+
+ genSettings: function() {
+ for(let key in this.settings) {
+ switch(this.settings[key].type) {
+ case "radio":
+ this.settings[key] = inputFuncs.radioInputs(...this.settings[key].args);
+ default:
+ if(typeof inputFuncs[this.settings[key].type+"Input"] != null)
+ this.settings[key] = inputFuncs[this.settings[key].type+"Input"](...this.settings[key].args);
+ }
+ }
+ }
+}; \ No newline at end of file