Added callback to save form state in query string

This commit is contained in:
eldadfux committed 2019-08-12 00:18:05 +03:00
1 parent 18f126c705
commit 358b81d4f0
7 files changed
+144 -60

No files matched your search

+14 -9
View File
@@ -15,17 +15,21 @@ $limit = 5;
<h2 style="display: none;">Users</h2>
<form class="box padding-small margin-bottom-large"
<form class="box padding-small margin-bottom"
data-service="users.listUsers"
data-event="submit"
data-param-search="{{router.params.search}}"
data-param-limit="<?php echo $limit; ?>"
data-param-offset="{{router.params.offset}}"
data-param-order-type="ASC"
data-scope="sdk"
data-name="project-users">
<input type="hidden" name="orderType" value="ASC">
<input type="hidden" name="offset" value="0">
<input type="hidden" name="limit" value="<?php echo $limit; ?>">
<div class="row responsive">
data-name="project-users"
data-success="state"
data-success-param-state-keys="search,offset">
<input type="hidden" name="project" data-ls-bind="{{router.params.project}}">
<div class="row responsive thin">
<div class="col span-10">
<input name="search" id="searchUsers" type="search" autocomplete="off" placeholder="Search" class="margin-bottom-no">
<input name="search" id="searchUsers" type="search" autocomplete="off" placeholder="Search" class="margin-bottom-no" data-ls-bind="{{router.params.search}}">
</div>
<div class="col span-2">
<button class="fill">Search</button>
@@ -50,12 +54,13 @@ $limit = 5;
</div>
<div data-ls-if="0 != {{project-users.sum}}" style="display: none;">
<div class="note margin-bottom-small margin-end-small text-align-end text-size-small"><span data-ls-bind="{{project-users.sum}}"></span> results found</div>
<div class="box margin-bottom">
<table class="vertical">
<thead>
<tr>
<th width="30"></th>
<th width="180">Name</th>
<th width="60"></th>
<th width="200">Name</th>
<th width="200">Email</th>
<th>Status</th>
<th width="100">Joined</th>
+17 -9
View File
@@ -2365,17 +2365,25 @@ window.getSelection().removeAllRanges();});element.parentNode.parentNode.appendC
document.body.classList.add(prefix+'-'+value);cookie.set('language-'+prefix,value,365);document.dispatchEvent(new CustomEvent('updated-language-'+prefix));};document.addEventListener('updated-language-'+prefix,function(){element.value=cookie.get('language-'+prefix);});let def=cookie.get('language-'+prefix)||element.options[0].value;select(def);element.value=def;}}).add({selector:'data-ls-ui-chart',repeat:false,controller:function(element,container,date,document){let child=document.createElement('canvas');child.width=500;child.height=175;let stats=container.get('usage');if(!stats||!stats['requests']||!stats['requests']['data']){return;}
let config={type:'line',data:{labels:[],datasets:[{label:'Requests',backgroundColor:'rgba(230, 248, 253, 0.3)',borderColor:'#29b5d9',borderWidth:2,data:[0,0,0,0,0,0,0],fill:true}]},options:{responsive:true,title:{display:false,text:'Stats'},legend:{display:false},tooltips:{mode:'index',intersect:false,caretPadding:0},hover:{mode:'nearest',intersect:true},scales:{xAxes:[{display:false}],yAxes:[{display:false,}]}}};for(let i=0;i<stats['requests']['data'].length;i++){config.data.datasets[0].data[i]=stats['requests']['data'][i].value;config.data.labels[i]=date.format('d F Y',stats['requests']['data'][i].date);}
let chart=container.get('chart');if(chart){}
element.innerHTML='';element.appendChild(child);container.set('chart',new Chart(child.getContext('2d'),config),true);element.dataset['canvas']=true;}});(function(window){"use strict";window.ls.container.get('view').add({selector:'data-service',repeat:false,controller:function(element,view,container,form,alerts,expression,window,router){let action=element.dataset['service'];let service=element.dataset['name']||action;let event=element.dataset['event'];let confirm=element.dataset['confirm']||'';let loading=element.dataset['loading']||'';let loaderId=null;let scope=element.dataset['scope']||'sdk';let debug=!!(element.dataset['debug']);let success=(element.dataset['success']||'');let failure=(element.dataset['failure']||'');success=(success&&success!='')?success.trim().split(','):[];failure=(failure&&failure!='')?failure.trim().split(','):[];if(debug)console.log('%c[service init]: '+action+' ('+service+')','color:red');let callbacks={'reset':function(){return function(){if('FORM'===element.tagName){return element.reset();}
throw new Error('This callback is only valid for forms');}},'alert':function(text,classname){return function(alerts){alerts.add({text:text,class:(classname||'success')},3000);}},'redirect':function(url){return function(router){router.change(url||'/');}},'reload':function(){return function(router){router.reload();}},'trigger':function(events){return function(document){events=events.trim().split(',');for(let i=0;i<events.length;i++){if(''===events[i]){continue;}
element.innerHTML='';element.appendChild(child);container.set('chart',new Chart(child.getContext('2d'),config),true);element.dataset['canvas']=true;}});(function(window){"use strict";window.ls.container.get('view').add({selector:'data-service',repeat:false,controller:function(element,view,container,form,alerts,expression,window,router){let action=element.dataset['service'];let service=element.dataset['name']||action;let event=element.dataset['event'];let confirm=element.dataset['confirm']||'';let loading=element.dataset['loading']||'';let loaderId=null;let scope=element.dataset['scope']||'sdk';let debug=!!(element.dataset['debug']);let success=(element.dataset['success']||'');let failure=(element.dataset['failure']||'');success=(success&&success!='')?success.split(',').map(element=>element.trim()):[];failure=(failure&&failure!='')?failure.split(',').map(element=>element.trim()):[];if(debug)console.log('%c[service init]: '+action+' ('+service+')','color:red');let callbacks={'reset':function(){return function(){if('FORM'===element.tagName){return element.reset();}
throw new Error('This callback is only valid for forms');}},'alert':function(text,classname){return function(alerts){alerts.add({text:text,class:(classname||'success')},3000);}},'redirect':function(url){return function(router){router.change(url||'/');}},'reload':function(){return function(router){router.reload();}},'state':function(keys){let updateQueryString=function(key,value,url){var re=new RegExp("([?&])"+key+"=.*?(&|#|$)(.*)","gi"),hash;if(re.test(url)){if(typeof value!=='undefined'&&value!==null){return url.replace(re,'$1'+key+"="+value+'$2$3');}
else{hash=url.split('#');url=hash[0].replace(re,'$1$3').replace(/(&|\?)$/,'');if(typeof hash[1]!=='undefined'&&hash[1]!==null){url+='#'+hash[1];}
return url;}}
else{if(typeof value!=='undefined'&&value!==null){var separator=url.indexOf('?')!==-1?'&':'?';hash=url.split('#');url=hash[0]+separator+key+'='+value;if(typeof hash[1]!=='undefined'&&hash[1]!==null){url+='#'+hash[1];}
return url;}
else{return url;}}}
keys=keys.split(',').map(element=>element.trim());return function(router,serviceData){let url=window.location.href;keys.map(key=>{let value=getValue(key,'param',serviceData);if(!value){}
url=updateQueryString(key,(value?value:null),url)});console.log(url);window.history.replaceState({},'',url);}},'trigger':function(events){return function(document){events=events.trim().split(',');for(let i=0;i<events.length;i++){if(''===events[i]){continue;}
if(debug)console.log('%c[event triggered]: '+events[i],'color:green');document.dispatchEvent(new CustomEvent(events[i]));}}}};let getParams=function getParams(func){const REGEX_COMMENTS=/((\/\/.*$)|(\/\*[\s\S]*?\*\/))/mg;const REGEX_FUNCTION_PARAMS=/(?:\s*(?:function\s*[^(]*)?\s*)((?:[^'"]|(?:(?:(['"])(?:(?:.*?[^\\]\2)|\2))))*?)\s*(?=(?:=>)|{)/m;const REGEX_PARAMETERS_VALUES=/\s*([\w\\$]+)\s*(?:=\s*((?:(?:(['"])(?:\3|(?:.*?[^\\]\3)))((\s*\+\s*)(?:(?:(['"])(?:\6|(?:.*?[^\\]\6)))|(?:[\w$]*)))*)|.*?))?\s*(?:,|$)/gm;let functionAsString=func.toString();let params=[];let match;functionAsString=functionAsString.replace(REGEX_COMMENTS,'');functionAsString=functionAsString.match(REGEX_FUNCTION_PARAMS)[1];if(functionAsString.charAt(0)==='('){functionAsString=functionAsString.slice(1,-1);}
while(match=REGEX_PARAMETERS_VALUES.exec(functionAsString)){params.push(match[1]);}
return params;}
let resolve=function(target,prefix='param',data={}){if(!target){return function(){};}
let args=getParams(target);if(debug)console.log('%c[form data]: ','color:green',data);return target.apply(target,args.map(function(value){let result=null;if(!value){return null;}
if(element.dataset[prefix+value.charAt(0).toUpperCase()+value.slice(1)]){result=expression.parse(element.dataset[prefix+value.charAt(0).toUpperCase()+value.slice(1)]);}
if(data[value]){result=data[value];}
let getValue=function(key,prefix,data){let result=null;if(!key){return null;}
if(element.dataset[prefix+key.charAt(0).toUpperCase()+key.slice(1)]){result=expression.parse(element.dataset[prefix+key.charAt(0).toUpperCase()+key.slice(1)]);}
if(data[key]){result=data[key];}
if(!result){result='';}
if(debug)console.log('%c[param resolved]: ('+service+') '+value+'='+result,'color:#808080');return result;}));};let exec=function(event){element.$lsSkip=true;if(debug)console.log('%c[executed]: '+scope+'.'+action,'color:yellow',event,element,document.body.contains(element));if(!document.body.contains(element)){element=undefined;return false;}
if(debug)console.log('%c[param resolved]: ('+service+') '+key+'='+result,'color:#808080');return result;}
let resolve=function(target,prefix='param',data={}){if(!target){return function(){};}
let args=getParams(target);if(debug)console.log('%c[form data]: ','color:green',data);return target.apply(target,args.map(function(value){return getValue(value,prefix,data);}));};let exec=function(event){element.$lsSkip=true;if(debug)console.log('%c[executed]: '+scope+'.'+action,'color:yellow',event,element,document.body.contains(element));if(!document.body.contains(element)){element=undefined;return false;}
if(event){event.preventDefault();}
if(confirm){if(window.confirm(confirm)!==true){return false;}}
if(loading){loaderId=alerts.add({text:loading,class:''},0);}
@@ -2383,8 +2391,8 @@ let method=container.path(scope+'.'+action);if(!method){throw new Error('Method
let result=resolve(method,'param',('FORM'===element.tagName)?form.toJson(element):{});if(!result){return;}
result.then(function(data){if(loaderId!==null){alerts.remove(loaderId);}
if(!element){return;}
container.set(service.replace('.','-'),data,true,true);if(debug)console.log('%cservice ready: "'+service.replace('.','-')+'"','color:green');if(debug)console.log('%cservice:','color:blue',container.get(service.replace('.','-')));for(let i=0;i<success.length;i++){container.resolve(resolve(callbacks[success[i]],'successParam'+success[i].charAt(0).toUpperCase()+success[i].slice(1),{}));}
element.$lsSkip=false;view.render(element);},function(exception){if(loaderId!==null){alerts.remove(loaderId);}
container.set(service.replace('.','-'),data,true,true);container.set('serviceData',data,true,true);if(debug)console.log('%cservice ready: "'+service.replace('.','-')+'"','color:green');if(debug)console.log('%cservice:','color:blue',container.get(service.replace('.','-')));for(let i=0;i<success.length;i++){container.resolve(resolve(callbacks[success[i]],'successParam'+success[i].charAt(0).toUpperCase()+success[i].slice(1),{}));}
container.set('serviceData',null,true,true);element.$lsSkip=false;view.render(element);},function(exception){if(loaderId!==null){alerts.remove(loaderId);}
if(!element){return;}
for(let i=0;i<failure.length;i++){container.resolve(resolve(callbacks[failure[i]],'failureParam'+failure[i].charAt(0).toUpperCase()+failure[i].slice(1),{}));}
element.$lsSkip=false;view.render(element);});};let events=event.trim().split(',');for(let y=0;y<events.length;y++){if(''===events[y]){continue;}
+17 -9
View File
@@ -272,17 +272,25 @@ window.getSelection().removeAllRanges();});element.parentNode.parentNode.appendC
document.body.classList.add(prefix+'-'+value);cookie.set('language-'+prefix,value,365);document.dispatchEvent(new CustomEvent('updated-language-'+prefix));};document.addEventListener('updated-language-'+prefix,function(){element.value=cookie.get('language-'+prefix);});let def=cookie.get('language-'+prefix)||element.options[0].value;select(def);element.value=def;}}).add({selector:'data-ls-ui-chart',repeat:false,controller:function(element,container,date,document){let child=document.createElement('canvas');child.width=500;child.height=175;let stats=container.get('usage');if(!stats||!stats['requests']||!stats['requests']['data']){return;}
let config={type:'line',data:{labels:[],datasets:[{label:'Requests',backgroundColor:'rgba(230, 248, 253, 0.3)',borderColor:'#29b5d9',borderWidth:2,data:[0,0,0,0,0,0,0],fill:true}]},options:{responsive:true,title:{display:false,text:'Stats'},legend:{display:false},tooltips:{mode:'index',intersect:false,caretPadding:0},hover:{mode:'nearest',intersect:true},scales:{xAxes:[{display:false}],yAxes:[{display:false,}]}}};for(let i=0;i<stats['requests']['data'].length;i++){config.data.datasets[0].data[i]=stats['requests']['data'][i].value;config.data.labels[i]=date.format('d F Y',stats['requests']['data'][i].date);}
let chart=container.get('chart');if(chart){}
element.innerHTML='';element.appendChild(child);container.set('chart',new Chart(child.getContext('2d'),config),true);element.dataset['canvas']=true;}});(function(window){"use strict";window.ls.container.get('view').add({selector:'data-service',repeat:false,controller:function(element,view,container,form,alerts,expression,window,router){let action=element.dataset['service'];let service=element.dataset['name']||action;let event=element.dataset['event'];let confirm=element.dataset['confirm']||'';let loading=element.dataset['loading']||'';let loaderId=null;let scope=element.dataset['scope']||'sdk';let debug=!!(element.dataset['debug']);let success=(element.dataset['success']||'');let failure=(element.dataset['failure']||'');success=(success&&success!='')?success.trim().split(','):[];failure=(failure&&failure!='')?failure.trim().split(','):[];if(debug)console.log('%c[service init]: '+action+' ('+service+')','color:red');let callbacks={'reset':function(){return function(){if('FORM'===element.tagName){return element.reset();}
throw new Error('This callback is only valid for forms');}},'alert':function(text,classname){return function(alerts){alerts.add({text:text,class:(classname||'success')},3000);}},'redirect':function(url){return function(router){router.change(url||'/');}},'reload':function(){return function(router){router.reload();}},'trigger':function(events){return function(document){events=events.trim().split(',');for(let i=0;i<events.length;i++){if(''===events[i]){continue;}
element.innerHTML='';element.appendChild(child);container.set('chart',new Chart(child.getContext('2d'),config),true);element.dataset['canvas']=true;}});(function(window){"use strict";window.ls.container.get('view').add({selector:'data-service',repeat:false,controller:function(element,view,container,form,alerts,expression,window,router){let action=element.dataset['service'];let service=element.dataset['name']||action;let event=element.dataset['event'];let confirm=element.dataset['confirm']||'';let loading=element.dataset['loading']||'';let loaderId=null;let scope=element.dataset['scope']||'sdk';let debug=!!(element.dataset['debug']);let success=(element.dataset['success']||'');let failure=(element.dataset['failure']||'');success=(success&&success!='')?success.split(',').map(element=>element.trim()):[];failure=(failure&&failure!='')?failure.split(',').map(element=>element.trim()):[];if(debug)console.log('%c[service init]: '+action+' ('+service+')','color:red');let callbacks={'reset':function(){return function(){if('FORM'===element.tagName){return element.reset();}
throw new Error('This callback is only valid for forms');}},'alert':function(text,classname){return function(alerts){alerts.add({text:text,class:(classname||'success')},3000);}},'redirect':function(url){return function(router){router.change(url||'/');}},'reload':function(){return function(router){router.reload();}},'state':function(keys){let updateQueryString=function(key,value,url){var re=new RegExp("([?&])"+key+"=.*?(&|#|$)(.*)","gi"),hash;if(re.test(url)){if(typeof value!=='undefined'&&value!==null){return url.replace(re,'$1'+key+"="+value+'$2$3');}
else{hash=url.split('#');url=hash[0].replace(re,'$1$3').replace(/(&|\?)$/,'');if(typeof hash[1]!=='undefined'&&hash[1]!==null){url+='#'+hash[1];}
return url;}}
else{if(typeof value!=='undefined'&&value!==null){var separator=url.indexOf('?')!==-1?'&':'?';hash=url.split('#');url=hash[0]+separator+key+'='+value;if(typeof hash[1]!=='undefined'&&hash[1]!==null){url+='#'+hash[1];}
return url;}
else{return url;}}}
keys=keys.split(',').map(element=>element.trim());return function(router,serviceData){let url=window.location.href;keys.map(key=>{let value=getValue(key,'param',serviceData);if(!value){}
url=updateQueryString(key,(value?value:null),url)});console.log(url);window.history.replaceState({},'',url);}},'trigger':function(events){return function(document){events=events.trim().split(',');for(let i=0;i<events.length;i++){if(''===events[i]){continue;}
if(debug)console.log('%c[event triggered]: '+events[i],'color:green');document.dispatchEvent(new CustomEvent(events[i]));}}}};let getParams=function getParams(func){const REGEX_COMMENTS=/((\/\/.*$)|(\/\*[\s\S]*?\*\/))/mg;const REGEX_FUNCTION_PARAMS=/(?:\s*(?:function\s*[^(]*)?\s*)((?:[^'"]|(?:(?:(['"])(?:(?:.*?[^\\]\2)|\2))))*?)\s*(?=(?:=>)|{)/m;const REGEX_PARAMETERS_VALUES=/\s*([\w\\$]+)\s*(?:=\s*((?:(?:(['"])(?:\3|(?:.*?[^\\]\3)))((\s*\+\s*)(?:(?:(['"])(?:\6|(?:.*?[^\\]\6)))|(?:[\w$]*)))*)|.*?))?\s*(?:,|$)/gm;let functionAsString=func.toString();let params=[];let match;functionAsString=functionAsString.replace(REGEX_COMMENTS,'');functionAsString=functionAsString.match(REGEX_FUNCTION_PARAMS)[1];if(functionAsString.charAt(0)==='('){functionAsString=functionAsString.slice(1,-1);}
while(match=REGEX_PARAMETERS_VALUES.exec(functionAsString)){params.push(match[1]);}
return params;}
let resolve=function(target,prefix='param',data={}){if(!target){return function(){};}
let args=getParams(target);if(debug)console.log('%c[form data]: ','color:green',data);return target.apply(target,args.map(function(value){let result=null;if(!value){return null;}
if(element.dataset[prefix+value.charAt(0).toUpperCase()+value.slice(1)]){result=expression.parse(element.dataset[prefix+value.charAt(0).toUpperCase()+value.slice(1)]);}
if(data[value]){result=data[value];}
let getValue=function(key,prefix,data){let result=null;if(!key){return null;}
if(element.dataset[prefix+key.charAt(0).toUpperCase()+key.slice(1)]){result=expression.parse(element.dataset[prefix+key.charAt(0).toUpperCase()+key.slice(1)]);}
if(data[key]){result=data[key];}
if(!result){result='';}
if(debug)console.log('%c[param resolved]: ('+service+') '+value+'='+result,'color:#808080');return result;}));};let exec=function(event){element.$lsSkip=true;if(debug)console.log('%c[executed]: '+scope+'.'+action,'color:yellow',event,element,document.body.contains(element));if(!document.body.contains(element)){element=undefined;return false;}
if(debug)console.log('%c[param resolved]: ('+service+') '+key+'='+result,'color:#808080');return result;}
let resolve=function(target,prefix='param',data={}){if(!target){return function(){};}
let args=getParams(target);if(debug)console.log('%c[form data]: ','color:green',data);return target.apply(target,args.map(function(value){return getValue(value,prefix,data);}));};let exec=function(event){element.$lsSkip=true;if(debug)console.log('%c[executed]: '+scope+'.'+action,'color:yellow',event,element,document.body.contains(element));if(!document.body.contains(element)){element=undefined;return false;}
if(event){event.preventDefault();}
if(confirm){if(window.confirm(confirm)!==true){return false;}}
if(loading){loaderId=alerts.add({text:loading,class:''},0);}
@@ -290,8 +298,8 @@ let method=container.path(scope+'.'+action);if(!method){throw new Error('Method
let result=resolve(method,'param',('FORM'===element.tagName)?form.toJson(element):{});if(!result){return;}
result.then(function(data){if(loaderId!==null){alerts.remove(loaderId);}
if(!element){return;}
container.set(service.replace('.','-'),data,true,true);if(debug)console.log('%cservice ready: "'+service.replace('.','-')+'"','color:green');if(debug)console.log('%cservice:','color:blue',container.get(service.replace('.','-')));for(let i=0;i<success.length;i++){container.resolve(resolve(callbacks[success[i]],'successParam'+success[i].charAt(0).toUpperCase()+success[i].slice(1),{}));}
element.$lsSkip=false;view.render(element);},function(exception){if(loaderId!==null){alerts.remove(loaderId);}
container.set(service.replace('.','-'),data,true,true);container.set('serviceData',data,true,true);if(debug)console.log('%cservice ready: "'+service.replace('.','-')+'"','color:green');if(debug)console.log('%cservice:','color:blue',container.get(service.replace('.','-')));for(let i=0;i<success.length;i++){container.resolve(resolve(callbacks[success[i]],'successParam'+success[i].charAt(0).toUpperCase()+success[i].slice(1),{}));}
container.set('serviceData',null,true,true);element.$lsSkip=false;view.render(element);},function(exception){if(loaderId!==null){alerts.remove(loaderId);}
if(!element){return;}
for(let i=0;i<failure.length;i++){container.resolve(resolve(callbacks[failure[i]],'failureParam'+failure[i].charAt(0).toUpperCase()+failure[i].slice(1),{}));}
element.$lsSkip=false;view.render(element);});};let events=event.trim().split(',');for(let y=0;y<events.length;y++){if(''===events[y]){continue;}
+1 -1
View File
@@ -1 +1 @@
.pull-start{float:left}.pull-end{float:right}img[src=""]{visibility:hidden;display:inline-block}.margin-end{margin-right:20px!important}.margin-start{margin-left:20px!important}.margin-end-small{margin-right:10px!important}.margin-start-small{margin-left:10px!important}.margin-end-large{margin-right:50px!important}.margin-start-large{margin-left:50px!important}.margin-end-no{margin-right:0!important}.margin-start-no{margin-left:0!important}.margin-top{margin-top:30px!important}.margin-bottom{margin-bottom:30px!important}.margin-top-no{margin-top:0!important}.margin-bottom-no{margin-bottom:0!important}.margin-top-xxl{margin-top:140px!important}.margin-top-xl{margin-top:80px!important}.margin-top-large{margin-top:50px!important}.margin-top-small{margin-top:15px!important}.margin-top-tiny{margin-top:5px!important}.margin-top-negative{margin-top:-30px!important}.margin-top-negative-tiny{margin-top:-5px!important}.margin-top-negative-small{margin-top:-15px!important}.margin-top-negative-large{margin-top:-50px!important}.margin-top-negative-xl{margin-top:-80px!important}.margin-top-negative-xxl{margin-top:-100px!important}.margin-bottom-xxl{margin-bottom:140px!important}.margin-bottom-xl{margin-bottom:80px!important}.margin-bottom-large{margin-bottom:50px!important}.margin-bottom-small{margin-bottom:15px!important}.margin-bottom-tiny{margin-bottom:5px!important}.margin-bottom-negative{margin-bottom:-30px!important}.margin-bottom-negative-tiny{margin-bottom:-5px!important}.margin-bottom-negative-small{margin-bottom:-15px!important}.margin-bottom-negative-large{margin-bottom:-50px!important}.margin-bottom-negative-xl{margin-bottom:-80px!important}.margin-bottom-negative-xl{margin-bottom:-100px!important}.ratio-wide{height:0;overflow:hidden;padding-top:56%;position:relative;width:100%}.ratio-wide>*{position:absolute;top:0;left:0;width:100%;height:100%}.ratio-square{height:0;overflow:hidden;padding-top:56%;position:relative;width:100%}.ratio-square>*{position:absolute;top:0;left:0;width:100%;height:100%}.clear:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}*{font-family:Poppins,sans-serif,Arial;-webkit-font-smoothing:antialiased;font-weight:300}h1,h2,h3,h4,h5,h6{margin:0}h4,h5,h6{font-weight:400}.link,a{color:#1e849e;text-decoration:none;border-left:2px solid transparent;border-right:2px solid transparent;border-bottom:solid 1px transparent}.link:hover,a:hover{border-bottom:dotted 1px #1e849e}.link.disabled,a.disabled{opacity:.5}.link.disabled:hover,a.disabled:hover{border-bottom:none}.link.tag:hover,a.tag:hover{border-bottom:none;opacity:.9}b,strong{font-weight:500}p{margin:0 0 20px 0;line-height:30px}p.note{color:#6f6f6f}.note,small{color:#797979}.text-size-small{font-size:13px}.text-size-normal{font-size:16px}.text-one-liner{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.text-center{text-align:center}.text-bold{font-weight:400!important}.text-danger{color:#f53d3d}.text-success{color:#1bbf61}.text-upper{text-transform:uppercase}.text-warning{color:#ffed4d}.text-focus{color:#f02e65}.text-fade{color:#9e9e9e}.text-disclaimer{font-size:11px;color:#9e9e9e}.text-fade-extra{color:#9e9e9e;opacity:.5}.text-line-high-large{line-height:30px}.text-line-high-xl{line-height:40px}.text-sign{margin:5px 0;font-size:25px;width:25px;height:25px;line-height:25px;display:inline-block}.text-align-start{text-align:left}.text-align-end{text-align:right}.text-align-left{text-align:left}.text-align-right{text-align:right}.text-dir-ltr{direction:ltr;display:inline-block}.text-dir-rtl{direction:rtl;display:inline-block}.icon-dot-3:before{-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}table{width:calc(100% + 60px);font-size:14px;border-collapse:collapse;margin:-30px;border-radius:10px;overflow:hidden;position:relative;table-layout:fixed}table thead{box-shadow:0 0 2px rgba(0,0,0,.25);border-bottom:solid 1px #e7e7e7}table thead th{position:sticky;top:0}table.small{font-size:12px}table.open-end tbody tr:last-child{border-bottom:none;font-weight:700;background:#f7fbf7}table.full tbody td,table.full tbody th{vertical-align:top;white-space:normal;overflow:auto;line-height:24px;padding-top:20px;padding-bottom:20px;height:auto}table .avatar{width:30px;height:30px}table tr{border-bottom:solid 1px #e7e7e7}table tr:last-child{border-bottom:none}table tr:nth-child(even){background:#fbfbfb}table th{text-align:left;font-weight:400}table th i{color:#9e9e9e;font-size:10px;display:inline-block;vertical-align:top;line-height:16px;padding:0 3px}table td,table th{height:65px;padding:0 15px;line-height:50px}table td:first-child,table th:first-child{padding-left:30px}table td:last-child,table th:last-child{padding-right:30px}@media only screen and (max-width:550px){table td:first-child,table th:first-child{width:auto}}table td,table th{overflow:hidden;white-space:nowrap}@media only screen and (max-width:550px),only screen and Line truncated
.pull-start{float:left}.pull-end{float:right}img[src=""]{visibility:hidden;display:inline-block}.margin-end{margin-right:20px!important}.margin-start{margin-left:20px!important}.margin-end-small{margin-right:10px!important}.margin-start-small{margin-left:10px!important}.margin-end-large{margin-right:50px!important}.margin-start-large{margin-left:50px!important}.margin-end-no{margin-right:0!important}.margin-start-no{margin-left:0!important}.margin-top{margin-top:30px!important}.margin-bottom{margin-bottom:30px!important}.margin-top-no{margin-top:0!important}.margin-bottom-no{margin-bottom:0!important}.margin-top-xxl{margin-top:140px!important}.margin-top-xl{margin-top:80px!important}.margin-top-large{margin-top:50px!important}.margin-top-small{margin-top:15px!important}.margin-top-tiny{margin-top:5px!important}.margin-top-negative{margin-top:-30px!important}.margin-top-negative-tiny{margin-top:-5px!important}.margin-top-negative-small{margin-top:-15px!important}.margin-top-negative-large{margin-top:-50px!important}.margin-top-negative-xl{margin-top:-80px!important}.margin-top-negative-xxl{margin-top:-100px!important}.margin-bottom-xxl{margin-bottom:140px!important}.margin-bottom-xl{margin-bottom:80px!important}.margin-bottom-large{margin-bottom:50px!important}.margin-bottom-small{margin-bottom:15px!important}.margin-bottom-tiny{margin-bottom:5px!important}.margin-bottom-negative{margin-bottom:-30px!important}.margin-bottom-negative-tiny{margin-bottom:-5px!important}.margin-bottom-negative-small{margin-bottom:-15px!important}.margin-bottom-negative-large{margin-bottom:-50px!important}.margin-bottom-negative-xl{margin-bottom:-80px!important}.margin-bottom-negative-xl{margin-bottom:-100px!important}.ratio-wide{height:0;overflow:hidden;padding-top:56%;position:relative;width:100%}.ratio-wide>*{position:absolute;top:0;left:0;width:100%;height:100%}.ratio-square{height:0;overflow:hidden;padding-top:56%;position:relative;width:100%}.ratio-square>*{position:absolute;top:0;left:0;width:100%;height:100%}.clear:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}*{font-family:Poppins,sans-serif,Arial;-webkit-font-smoothing:antialiased;font-weight:300}h1,h2,h3,h4,h5,h6{margin:0}h4,h5,h6{font-weight:400}.link,a{color:#1e849e;text-decoration:none;border-left:2px solid transparent;border-right:2px solid transparent;border-bottom:solid 1px transparent}.link:hover,a:hover{border-bottom:dotted 1px #1e849e}.link.disabled,a.disabled{opacity:.5}.link.disabled:hover,a.disabled:hover{border-bottom:none}.link.tag:hover,a.tag:hover{border-bottom:none;opacity:.9}b,strong{font-weight:500}p{margin:0 0 20px 0;line-height:30px}p.note{color:#6f6f6f}.note,small{color:#797979}.text-size-small{font-size:13px}.text-size-normal{font-size:16px}.text-one-liner{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.text-center{text-align:center}.text-bold{font-weight:400!important}.text-danger{color:#f53d3d}.text-success{color:#1bbf61}.text-upper{text-transform:uppercase}.text-warning{color:#ffed4d}.text-focus{color:#f02e65}.text-fade{color:#9e9e9e}.text-disclaimer{font-size:11px;color:#9e9e9e}.text-fade-extra{color:#9e9e9e;opacity:.5}.text-line-high-large{line-height:30px}.text-line-high-xl{line-height:40px}.text-sign{margin:5px 0;font-size:25px;width:25px;height:25px;line-height:25px;display:inline-block}.text-align-start{text-align:left}.text-align-end{text-align:right}.text-align-left{text-align:left}.text-align-right{text-align:right}.text-dir-ltr{direction:ltr;display:inline-block}.text-dir-rtl{direction:rtl;display:inline-block}.icon-dot-3:before{-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}table{width:calc(100% + 60px);font-size:14px;border-collapse:collapse;margin:-30px;border-radius:10px;overflow:hidden;position:relative;table-layout:fixed}table thead{box-shadow:0 0 2px rgba(0,0,0,.25);border-bottom:solid 1px #f1f3f5}table thead th{position:sticky;top:0}table.small{font-size:12px}table.open-end tbody tr:last-child{border-bottom:none;font-weight:700;background:#f7fbf7}table.full tbody td,table.full tbody th{vertical-align:top;white-space:normal;overflow:auto;line-height:24px;padding-top:20px;padding-bottom:20px;height:auto}table .avatar{width:30px;height:30px}table tr{border-bottom:solid 1px #f1f3f5}table tr:last-child{border-bottom:none}table tr:nth-child(even){background:#fbfbfb}table th{text-align:left;font-weight:400}table th i{color:#9e9e9e;font-size:10px;display:inline-block;vertical-align:top;line-height:16px;padding:0 3px}table td,table th{height:65px;padding:0 15px;line-height:50px}table td:first-child,table th:first-child{padding-left:30px}table td:last-child,table th:last-child{padding-right:30px}@media only screen and (max-width:550px){table td:first-child,table th:first-child{width:auto}}table td,table th{overflow:hidden;white-space:nowrap}@media only screen and (max-width:550px),only screen and Line truncated
+91 -28
View File
@@ -17,8 +17,8 @@
let success = (element.dataset['success'] || '');
let failure = (element.dataset['failure'] || '');
success = (success && success != '') ? success.trim().split(',') : [];
failure = (failure && failure != '') ? failure.trim().split(',') : [];
success = (success && success != '') ? success.split(',').map(element => element.trim()) : [];
failure = (failure && failure != '') ? failure.split(',').map(element => element.trim()) : [];
if (debug) console.log('%c[service init]: ' + action + ' (' + service + ')', 'color:red');
@@ -51,6 +51,61 @@
}
},
'state': function (keys) {
let updateQueryString = function(key, value, url) {
var re = new RegExp("([?&])" + key + "=.*?(&|#|$)(.*)", "gi"),
hash;
if (re.test(url)) {
if (typeof value !== 'undefined' && value !== null) {
return url.replace(re, '$1' + key + "=" + value + '$2$3');
}
else {
hash = url.split('#');
url = hash[0].replace(re, '$1$3').replace(/(&|\?)$/, '');
if (typeof hash[1] !== 'undefined' && hash[1] !== null) {
url += '#' + hash[1];
}
return url;
}
}
else {
if (typeof value !== 'undefined' && value !== null) {
var separator = url.indexOf('?') !== -1 ? '&' : '?';
hash = url.split('#');
url = hash[0] + separator + key + '=' + value;
if (typeof hash[1] !== 'undefined' && hash[1] !== null) {
url += '#' + hash[1];
}
return url;
}
else {
return url;
}
}
}
keys = keys.split(',').map(element => element.trim());
return function (router, serviceData) {
let url = window.location.href;
keys.map(key => {
let value = getValue(key, 'param', serviceData);
if(!value) {
// return;
}
url = updateQueryString(key, (value ? value : null), url)
});
console.log(url);
//router.change(url, true);
window.history.replaceState({}, '', url);
}
},
'trigger': function (events) {
return function (document) {
events = events.trim().split(',');
@@ -110,6 +165,35 @@
return params;
}
let getValue = function(key, prefix, data) {
let result = null;
if(!key) {
return null;
}
/**
* 1. Get from element data-param-* (expression supported)
* 2. Get from element data-param-state-*
* 3. Get from element form object-*
*/
if(element.dataset[prefix + key.charAt(0).toUpperCase() + key.slice(1)]) {
result = expression.parse(element.dataset[prefix + key.charAt(0).toUpperCase() + key.slice(1)]);
}
if(data[key]) {
result = data[key];
}
if(!result) {
result = '';
}
if (debug) console.log('%c[param resolved]: (' + service + ') ' + key + '=' + result, 'color:#808080');
return result;
}
let resolve = function(target, prefix = 'param', data = {}) {
if (!target) {
return function() {};
@@ -120,32 +204,7 @@
if (debug) console.log('%c[form data]: ', 'color:green', data);
return target.apply(target, args.map(function(value) {
let result = null;
if(!value) {
return null;
}
/**
* 1. Get from element data-param-* (expression supported)
* 2. Get from element data-param-state-*
* 3. Get from element form object-*
*/
if(element.dataset[prefix + value.charAt(0).toUpperCase() + value.slice(1)]) {
result = expression.parse(element.dataset[prefix + value.charAt(0).toUpperCase() + value.slice(1)]);
}
if(data[value]) {
result = data[value];
}
if(!result) {
result = '';
}
if (debug) console.log('%c[param resolved]: (' + service + ') ' + value + '=' + result, 'color:#808080');
return result;
return getValue(value, prefix, data);
}));
};
@@ -196,6 +255,7 @@
}
container.set(service.replace('.', '-'), data, true, true);
container.set('serviceData', data, true, true);
if (debug) console.log('%cservice ready: "' + service.replace('.', '-') + '"', 'color:green');
if (debug) console.log('%cservice:', 'color:blue', container.get(service.replace('.', '-')));
@@ -204,9 +264,12 @@
container.resolve(resolve(callbacks[success[i]], 'successParam' + success[i].charAt(0).toUpperCase() + success[i].slice(1), {}));
}
container.set('serviceData', null, true, true);
element.$lsSkip = false;
view.render(element);
}, function (exception) {
if(loaderId !== null) { // Remove loader if needed
alerts.remove(loaderId);
+1 -1
View File
@@ -14,7 +14,7 @@
@config-color-fade: #9e9e9e;
@config-color-border: #e6e6e6;
@config-color-fade-light: #e2e2e2;
@config-color-fade-super: #f9f9f9;
@config-color-fade-super: #f1f3f5;
@config-color-danger: #f53d3d;
@config-color-success: #1bbf61;
@config-color-warning: #ffed4d;
+3 -3
View File
@@ -10,7 +10,7 @@ table {
thead {
box-shadow: 0 0 2px rgba(0,0,0,.25);
border-bottom: solid 1px #e7e7e7;
border-bottom: solid 1px @config-color-fade-super;
th {
position: sticky;
@@ -48,7 +48,7 @@ table {
}
tr {
border-bottom: solid 1px #e7e7e7;
border-bottom: solid 1px @config-color-fade-super;
&:last-child {
border-bottom: none;
@@ -106,7 +106,7 @@ table {
@media @phones, @tablets {
display: block;
overflow: hidden;
border-top: solid 1px #e7e7e7;
border-top: solid 1px @config-color-fade-super;
padding-top: 12px;
thead, tbody, tr, td, th {