mirror of https://github.com/requarks/wiki
NGPixel
8 years ago
parent
aa740dea7a
commit
52c9821189
File diff suppressed because one or more lines are too long
@ -1 +1 @@
|
||||
"use strict";jQuery(document).ready(function(e){e("a").smoothScroll({speed:400,offset:-20});new Sticky(".stickyscroll")});
|
||||
"use strict";function _classCallCheck(e,s){if(!(e instanceof s))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function e(e,s){for(var t=0;t<s.length;t++){var n=s[t];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(s,t,n){return t&&e(s.prototype,t),n&&e(s,n),s}}(),Alerts=function(){function e(){_classCallCheck(this,e);var s=this;s.mdl=new Vue({el:"#alerts",data:{children:[]},methods:{acknowledge:function(e){s.close(e)}}}),s.uidNext=1}return _createClass(e,[{key:"push",value:function(e){var s=this,t=_.defaults(e,{_uid:s.uidNext,class:"is-info",message:"---",sticky:!1,title:"---"});s.mdl.children.push(t),t.sticky||_.delay(function(){s.close(t._uid)},5e3),s.uidNext++}},{key:"pushError",value:function(e,s){this.push({class:"is-danger",message:s,sticky:!1,title:e})}},{key:"pushSuccess",value:function(e,s){this.push({class:"is-success",message:s,sticky:!1,title:e})}},{key:"close",value:function(e){var s=this,t=_.findIndex(s.mdl.children,["_uid",e]),n=_.nth(s.mdl.children,t);t>=0&&n&&(n.class+=" exit",s.mdl.children.$set(t,n),_.delay(function(){s.mdl.children.$remove(n)},500))}}]),e}();jQuery(document).ready(function(e){e("a").smoothScroll({speed:400,offset:-20});var s=(new Sticky(".stickyscroll"),new Alerts);alertsData&&_.forEach(alertsData,function(e){s.push(e)})});
|
||||
@ -0,0 +1,115 @@
|
||||
"use strict";
|
||||
|
||||
/**
|
||||
* Alerts
|
||||
*/
|
||||
class Alerts {
|
||||
|
||||
/**
|
||||
* Constructor
|
||||
*
|
||||
* @class
|
||||
*/
|
||||
constructor() {
|
||||
|
||||
let self = this;
|
||||
|
||||
self.mdl = new Vue({
|
||||
el: '#alerts',
|
||||
data: {
|
||||
children: []
|
||||
},
|
||||
methods: {
|
||||
acknowledge: (uid) => {
|
||||
self.close(uid);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
self.uidNext = 1;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Show a new Alert
|
||||
*
|
||||
* @param {Object} options Alert properties
|
||||
* @return {null} Void
|
||||
*/
|
||||
push(options) {
|
||||
|
||||
let self = this;
|
||||
|
||||
let nAlert = _.defaults(options, {
|
||||
_uid: self.uidNext,
|
||||
class: 'is-info',
|
||||
message: '---',
|
||||
sticky: false,
|
||||
title: '---'
|
||||
});
|
||||
|
||||
self.mdl.children.push(nAlert);
|
||||
|
||||
if(!nAlert.sticky) {
|
||||
_.delay(() => {
|
||||
self.close(nAlert._uid);
|
||||
}, 5000);
|
||||
}
|
||||
|
||||
self.uidNext++;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Shorthand method for pushing errors
|
||||
*
|
||||
* @param {String} title The title
|
||||
* @param {String} message The message
|
||||
*/
|
||||
pushError(title, message) {
|
||||
this.push({
|
||||
class: 'is-danger',
|
||||
message,
|
||||
sticky: false,
|
||||
title
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Shorthand method for pushing success messages
|
||||
*
|
||||
* @param {String} title The title
|
||||
* @param {String} message The message
|
||||
*/
|
||||
pushSuccess(title, message) {
|
||||
this.push({
|
||||
class: 'is-success',
|
||||
message,
|
||||
sticky: false,
|
||||
title
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Close an alert
|
||||
*
|
||||
* @param {Integer} uid The unique ID of the alert
|
||||
*/
|
||||
close(uid) {
|
||||
|
||||
let self = this;
|
||||
|
||||
let nAlertIdx = _.findIndex(self.mdl.children, ['_uid', uid]);
|
||||
let nAlert = _.nth(self.mdl.children, nAlertIdx);
|
||||
|
||||
if(nAlertIdx >= 0 && nAlert) {
|
||||
nAlert.class += ' exit';
|
||||
self.mdl.children.$set(nAlertIdx, nAlert);
|
||||
_.delay(() => {
|
||||
self.mdl.children.$remove(nAlert);
|
||||
}, 500);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -0,0 +1,24 @@
|
||||
#alerts {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
right: 10px;
|
||||
width: 350px;
|
||||
z-index: 2;
|
||||
text-shadow: 1px 1px 0 rgba(0,0,0,0.1);
|
||||
|
||||
.notification {
|
||||
animation: 0.5s ease slideInRight;
|
||||
margin-top: 5px;
|
||||
|
||||
&.exit {
|
||||
animation: 0.5s ease fadeOutRight;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 16px;
|
||||
font-size: 500;
|
||||
}
|
||||
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,16 @@
|
||||
#alerts
|
||||
ul
|
||||
template(v-for="aItem in children", track-by='_uid')
|
||||
.notification(v-bind:class='aItem.class')
|
||||
button.delete(v-on:click='acknowledge(aItem._uid)')
|
||||
h3 {{ aItem.title }}
|
||||
span {{ aItem.message }}
|
||||
|
||||
if appflash.length > 0
|
||||
script(type='text/javascript')
|
||||
| var alertsData =
|
||||
!= JSON.stringify(appflash)
|
||||
| ;
|
||||
else
|
||||
script(type='text/javascript')
|
||||
| var alertsData = [];
|
||||
Loading…
Reference in new issue