Browse Source

Modal can now be opened with emit args of 'id' to open by element id or 'cls' to open by element class.

dev
Bryan Miller 5 years ago
parent
commit
c09222ca01
1 changed files with 22 additions and 11 deletions
  1. +22
    -11
      app/js/ui/Modal.js

+ 22
- 11
app/js/ui/Modal.js View File

import GlobalEvents from "/app/js/common/EventCaller.js"; import GlobalEvents from "/app/js/common/EventCaller.js";
import Utils from "/app/js/common/Utils.js";
import Input from "/app/js/ui/Input.js"; import Input from "/app/js/ui/Input.js";


class Modal{ class Modal{
}).bind(this)); }).bind(this));


GlobalEvents.listen("modal-open", (function(target, event){ GlobalEvents.listen("modal-open", (function(target, event){
if (event.hasOwnProperty("id") && typeof(event.id) === 'string'){
var force = (event.hasOwnProperty("force")) ? event.force === true : false;
var force = (event.hasOwnProperty("force")) ? event.force === true : false;
if (event.hasOwnProperty("id") && typeof(event.id) === 'string'){
this.open_modal_id(event.id, force); this.open_modal_id(event.id, force);
} else if (event.hasOwnProperty("cls") && typeof(event.cls) === 'string'){
this.open_modal_class(event.cls, force);
} }
}).bind(this)); }).bind(this));


this.close_modal(); this.close_modal();
}).bind(this)); }).bind(this));


// TODO: Deprecate this mechanic. Let other controllers directly handle input.
GlobalEvents.listen("modal-submit", (function(target, event){ GlobalEvents.listen("modal-submit", (function(target, event){
if (!event.hasOwnProperty("subevent")) if (!event.hasOwnProperty("subevent"))
return; return;


open_modal_id(idname, force=false){ open_modal_id(idname, force=false){
var el = document.getElementById(idname); var el = document.getElementById(idname);
if (el.classList.contains("modal") && this.__currentModalEl !== el){
/*if (el.classList.contains("modal") && this.__currentModalEl !== el){
if (this.__currentModalEl !== null && force) if (this.__currentModalEl !== null && force)
this.close_modal(); this.close_modal();
if (this.__currentModalEl === null){ if (this.__currentModalEl === null){
return this.open_modal_element(el); return this.open_modal_element(el);
} }
} }
}
return this;
}*/
return (el) ? this.open_modal_element(el, force) : this;
}

open_modal_class(clsname, force=false){
var el = document.querySelector((clsname.indexOf(".") < 0) ? "." + clsname : clsname);
return (el) ? this.open_modal_element(el, force) : this;
} }


open_modal_element(el, force=false){ open_modal_element(el, force=false){
if (el.classList.contains("modal")){
if (this.__currentModalEl !== null && force)
this.close_modal();
if (this.__currentModalEl === null){
el.classList.add("modal-visible");
this.__currentModalEl = el;
if (Utils.isElement(el)){
if (el.classList.contains("modal") && this.__currentModalEl !== el){
if (this.__currentModalEl !== null && force)
this.close_modal();
if (this.__currentModalEl === null){
el.classList.add("modal-visible");
this.__currentModalEl = el;
}
} }
} }
return this; return this;

Loading…
Cancel
Save