| @@ -130,8 +130,16 @@ function CreatePaletteDOMEntry(pname, palette){ | |||
| return null; | |||
| } | |||
| class CTRLPalettesStore{ | |||
| constructor(){} | |||
| constructor(){ | |||
| GlobalEvents.listen("palstore-add", (function(e){ | |||
| if (e.hasOwnProperty("palname")){ | |||
| this.createPalette(e.palname); | |||
| this.activatePalette(e.palname); | |||
| } | |||
| }).bind(this)); | |||
| } | |||
| get json(){ | |||
| var d = { | |||
| @@ -1,5 +1,5 @@ | |||
| import GlobalEvents from "/app/js/common/EventCaller.js"; | |||
| import Input from "/app/js/ui/Input.js"; | |||
| class Modal{ | |||
| constructor(){ | |||
| @@ -21,6 +21,28 @@ class Modal{ | |||
| GlobalEvents.listen("modal-close", (function(target, event){ | |||
| this.close_modal(); | |||
| }).bind(this)); | |||
| GlobalEvents.listen("modal-submit", (function(target, event){ | |||
| if (target !== this.__currentModalEl) | |||
| return; | |||
| if (!event.hasOwnProperty("subevent")) | |||
| return; | |||
| var ename = event.subevent; | |||
| var vals = {}; | |||
| if (event.hasOwnProperty("ids")){ | |||
| var ids = event.ids.split(","); | |||
| var cel = this.__currentModalEl; | |||
| ids.forEach((item) => { | |||
| var id = item.trim(); | |||
| var el = cel.querySelector("[name='" + id + "']"); | |||
| if (el && el.hasOwnProperty("value")) | |||
| vals[id] = el.value; | |||
| }); | |||
| } | |||
| GlobalEvents.emit(ename, vals); | |||
| if (event.hasOwnProperty("closeoncomplete")) | |||
| this.close_modal(); | |||
| }).bind(this)); | |||
| } | |||
| get currentModalElement(){ | |||
| @@ -6,6 +6,18 @@ | |||
| </ul> | |||
| <% tabs.forEach(function(item){ %> | |||
| <div class="tab-content" fortabs="<%= tabsetname %>" tabid="<%= item.id %>"> | |||
| <div class="simple-padding"> | |||
| <% if (item.hasOwnProperty("addevent")){ %> | |||
| <button class="pure-button" emit="modal-open" emit-args='{"id":"<%= item.addevent %>"}'> | |||
| <i class="fa fa-plus-circle"></i> | |||
| </button> | |||
| <% } %> | |||
| <% if (item.hasOwnProperty("remevent")){ %> | |||
| <button class="pure-button" emit="<%= item.remevent %>"> | |||
| <i class="fa fa-trash-alt"></i> | |||
| </button> | |||
| <% } %> | |||
| </div> | |||
| <div class="list-container"> | |||
| <% if(item.hasOwnProperty("tmpl")){ %> | |||
| <%- include(item.tmpl) %> | |||
| @@ -22,7 +22,7 @@ | |||
| <%- include('docks.html', { | |||
| tabsetname:"assetlists", | |||
| tabs:[ | |||
| {name:"Palettes", id:"palettes", tmpl:"paletteListItem.html", selected:true}, | |||
| {name:"Palettes", id:"palettes", tmpl:"paletteListItem.html", addevent:"PaletteAdd", remevent:"palstore-remove", elected:true}, | |||
| {name:"Banks", id:"banks", selected:false}, | |||
| {name:"Attrib. Tables", id:"attrtbls", selected:false} | |||
| ] | |||
| @@ -1,5 +1,15 @@ | |||
| <div id="Welcome" class="modal"> | |||
| <div class="modal-content"> | |||
| Welcome to the modal! | |||
| </div> | |||
| </div> | |||
| <div id="Welcome" class="modal"> | |||
| <div class="modal-content"> | |||
| Welcome to the modal! | |||
| </div> | |||
| </div> | |||
| <div id="PaletteAdd" class="modal"> | |||
| <div class="modal-content"> | |||
| <label for="palname"> | |||
| New Palette Name: | |||
| </label> | |||
| <input type="text" name="palname" /> | |||
| <button class="pure-button" emit="modal-submit" emit-args='{"subevent":"palstore-add", "ids":"palname", "closeoncomplete":true}'>Submit</button> | |||
| </div> | |||
| </div> | |||