Pop-Up manages 'background.click' to send FALSE to the 'handler' + hide (equivalent to CANCEL action)
This commit is contained in:
parent
a2d575e94f
commit
6b9bd03d9e
|
@ -1 +1 @@
|
||||||
function Popup(){this.element={frame:document.querySelector("#POPUP"),header:document.querySelector("#POPUP .header"),body:document.querySelector("#POPUP .body"),footer:document.querySelector("#POPUP .footer")}}Popup.prototype={element:{frame:null,header:null,body:null,footer:null},show:function(){return this.element.frame.addClass("active"),this},hide:function(){return this.element.frame.remClass("active"),this},ask:function(e,t){function n(e){this.hide(),t("grey"!=e.target.className)}if(!(e instanceof Object))return null;if(null==e.title)return null;if(null==e.content)return null;if(null==e.type)return null;if(null==e.action)return null;if(!(t instanceof Function))return null;this.element.header.innerHTML=e.title,this.element.body.innerHTML=e.content;var r=document.createElement("button");r.className=e.type,r.innerHTML=e.action;var l=document.createElement("button");return l.className="grey",l.innerHTML="Annuler",r.addEventListener("click",n.bind(this),!1),l.addEventListener("click",n.bind(this),!1),this.element.footer.innerHTML="",this.element.footer.appendChild(r),this.element.footer.appendChild(l),this.show()}};
|
function Popup(){this.element={background:document.querySelector("#POPUP-BG"),frame:document.querySelector("#POPUP"),header:document.querySelector("#POPUP .header"),body:document.querySelector("#POPUP .body"),footer:document.querySelector("#POPUP .footer")},this.element.background.addEventListener("click",function(e){this.hide().handler(!1)}.bind(this),!1)}Popup.prototype={handler:null,element:{frame:null,header:null,body:null,footer:null},show:function(){return this.element.frame.addClass("active"),this},hide:function(){return this.element.frame.remClass("active"),this},ask:function(e,n){function t(e){this.hide(),this.handler("grey"!=e.target.className)}if(!(e instanceof Object))return null;if(null==e.title)return null;if(null==e.content)return null;if(null==e.type)return null;if(null==e.action)return null;if(!(n instanceof Function))return null;this.element.header.innerHTML=e.title,this.element.body.innerHTML=e.content,this.handler=n;var r=document.createElement("button");r.className=e.type,r.innerHTML=e.action;var l=document.createElement("button");return l.className="grey",l.innerHTML="Annuler",r.addEventListener("click",t.bind(this),!1),l.addEventListener("click",t.bind(this),!1),this.element.footer.innerHTML="",this.element.footer.appendChild(r),this.element.footer.appendChild(l),this.show()}};
|
|
@ -1,16 +1,24 @@
|
||||||
function Popup(){
|
function Popup(){
|
||||||
|
|
||||||
|
/* (1) Fetch DOM elements */
|
||||||
this.element = {
|
this.element = {
|
||||||
|
background: document.querySelector('#POPUP-BG'),
|
||||||
frame: document.querySelector('#POPUP'),
|
frame: document.querySelector('#POPUP'),
|
||||||
header: document.querySelector('#POPUP .header'),
|
header: document.querySelector('#POPUP .header'),
|
||||||
body: document.querySelector('#POPUP .body'),
|
body: document.querySelector('#POPUP .body'),
|
||||||
footer: document.querySelector('#POPUP .footer')
|
footer: document.querySelector('#POPUP .footer')
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/* (2) Set background click === to CANCEL action */
|
||||||
|
this.element.background.addEventListener('click', function(e){
|
||||||
|
this.hide().handler(false);
|
||||||
|
}.bind(this), false);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Popup.prototype = {
|
Popup.prototype = {
|
||||||
|
|
||||||
|
handler: null,
|
||||||
element: { frame: null, header: null, body: null, footer: null },
|
element: { frame: null, header: null, body: null, footer: null },
|
||||||
|
|
||||||
show: function(){
|
show: function(){
|
||||||
|
@ -59,6 +67,10 @@ Popup.prototype = {
|
||||||
/* (2) Content */
|
/* (2) Content */
|
||||||
this.element.body.innerHTML = pObject.content;
|
this.element.body.innerHTML = pObject.content;
|
||||||
|
|
||||||
|
/* (3) Store the handler */
|
||||||
|
this.handler = pHandler;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* (3) Set the buttons (action)
|
/* (3) Set the buttons (action)
|
||||||
---------------------------------------------------------*/
|
---------------------------------------------------------*/
|
||||||
|
@ -73,7 +85,7 @@ Popup.prototype = {
|
||||||
cancel_btn.innerHTML = 'Annuler';
|
cancel_btn.innerHTML = 'Annuler';
|
||||||
|
|
||||||
/* (3) Bind events */
|
/* (3) Bind events */
|
||||||
function handler(e){ this.hide(); pHandler( e.target.className != 'grey' ); }
|
function handler(e){ this.hide(); this.handler( e.target.className != 'grey' ); }
|
||||||
|
|
||||||
action_btn.addEventListener('click', handler.bind(this), false);
|
action_btn.addEventListener('click', handler.bind(this), false);
|
||||||
cancel_btn.addEventListener('click', handler.bind(this), false);
|
cancel_btn.addEventListener('click', handler.bind(this), false);
|
||||||
|
|
Loading…
Reference in New Issue