nightmare/jquery-notify
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated

Browse Source
This commit is contained in:
Jaime Pillora committed 2013-06-03 09:15:58 +10:00
1 parent 930f9903c5
commit fabc93802f
4 files changed
+64 -47
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

dist/notify.js
Vendored
+29 -18
View File
@@ -1,11 +1,11 @@
/** Notify.js - v0.0.1 - 2013/05/31 /** Notify.js - v0.0.1 - 2013/06/03
* http://notifyjs.com/ * http://notifyjs.com/
* Copyright (c) 2013 Jaime Pillora - MIT * Copyright (c) 2013 Jaime Pillora - MIT
*/ */
(function(window,document,undefined) { (function(window,document,undefined) {
'use strict'; 'use strict';
var Notification, className, cornerElem, createElem, getAnchorElement, hPositions, incr, inherit, insertCSS, mainPositions, opposites, parsePosition, pluginName, pluginOptions, positions, realign, styles, vPositions, var Notification, className, cornerElem, createElem, getAnchorElement, hAligns, incr, inherit, insertCSS, mainPositions, opposites, parsePosition, pluginName, pluginOptions, positions, realign, styles, vAligns,
__indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; }; __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; };
pluginName = 'notify'; pluginName = 'notify';
@@ -21,9 +21,9 @@ positions = {
r: 'right' r: 'right'
}; };
hPositions = ['l', 'c', 'r']; hAligns = ['l', 'c', 'r'];
vPositions = ['t', 'm', 'b']; vAligns = ['t', 'm', 'b'];
mainPositions = ['t', 'b', 'l', 'r']; mainPositions = ['t', 'b', 'l', 'r'];
@@ -51,8 +51,8 @@ parsePosition = function(str) {
styles = { styles = {
core: { core: {
html: "<div class=\"" + className + "Wrapper\">\n <div class=\"" + className + "Debug\"></div>\n <div class=\"" + className + "Arrow\"></div>\n <div class=\"" + className + "Container\"></div>\n</div>", html: "<div class=\"" + className + "Wrapper\">\n <div class=\"" + className + "Arrow\"></div>\n <div class=\"" + className + "Container\"></div>\n</div>",
css: "." + className + "Corner {\n position: fixed;\n top: 0;\n right: 0;\n margin: 5px;\n z-index: 1050;\n}\n\n." + className + "Corner ." + className + "Wrapper,\n." + className + "Corner ." + className + "Container {\n position: relative;\n display: block;\n height: inherit;\n width: inherit;\n}\n\n." + className + "Wrapper {\n z-index: 1;\n position: absolute;\n display: inline-block;\n height: 0;\n width: 0;\n}\n\n." + className + "Debug {\n position: absolute;\n border: 3px solid red;\n height: 0;\n width: 0;\n}\n\n." + className + "Container {\n display: none;\n z-index: 1;\n position: absolute;\n cursor: pointer;\n}\n\n." + className + "Text {\n position: relative;\n}\n\n." + className + "Arrow {\n position: absolute;\n z-index: 2;\n width: 0;\n height: 0;\n}\n" css: "." + className + "Corner {\n position: fixed;\n top: 0;\n right: 0;\n margin: 5px;\n z-index: 1050;\n}\n\n." + className + "Corner ." + className + "Wrapper,\n." + className + "Corner ." + className + "Container {\n position: relative;\n display: block;\n height: inherit;\n width: inherit;\n}\n\n." + className + "Wrapper {\n z-index: 1;\n position: absolute;\n display: inline-block;\n height: 0;\n width: 0;\n}\n\n." + className + "Container {\n display: none;\n z-index: 1;\n position: absolute;\n cursor: pointer;\n}\n\n." + className + "Text {\n position: relative;\n}\n\n." + className + "Arrow {\n position: absolute;\n z-index: 2;\n width: 0;\n height: 0;\n}\n"
}, },
user: { user: {
"default": { "default": {
@@ -76,7 +76,7 @@ pluginOptions = {
arrowSize: 5, arrowSize: 5,
position: 'bottom', position: 'bottom',
style: 'default', style: 'default',
color: 'red', color: 'black',
colors: { colors: {
red: '#b94a48', red: '#b94a48',
green: '#33be40', green: '#33be40',
@@ -245,18 +245,19 @@ Notification = (function() {
}; };
Notification.prototype.updatePosition = function() { Notification.prototype.updatePosition = function() {
var arrowCss, color, contH, contW, css, elemH, elemPos, elemW, mainFull, margin, opp, oppFull, pAlign, pArrow, pMain, padding, pos, posFull, position, size, wrapPos, _i, _len; var arrowCss, arrowSize, color, contH, contW, css, elemH, elemIH, elemIW, elemPos, elemW, mainFull, margin, opp, oppFull, pAlign, pArrow, pMain, padding, pos, posFull, position, wrapPos, _i, _len;
if (!this.elem) { if (!this.elem) {
return; return;
} }
elemPos = this.elem.position(); elemPos = this.elem.position();
elemH = this.elem.outerHeight(); elemH = this.elem.outerHeight();
elemW = this.elem.outerWidth(); elemW = this.elem.outerWidth();
elemIH = this.elem.innerHeight();
elemIW = this.elem.innerWidth();
wrapPos = this.wrapper.position(); wrapPos = this.wrapper.position();
contH = this.container.height(); contH = this.container.height();
contW = this.container.width(); contW = this.container.width();
position = this.getPosition(); position = this.getPosition();
console.log(position);
pMain = position[0]; pMain = position[0];
pAlign = position[1]; pAlign = position[1];
pArrow = position[2] || pAlign; pArrow = position[2] || pAlign;
@@ -281,7 +282,7 @@ Notification = (function() {
if (!this.options.arrowShow) { if (!this.options.arrowShow) {
this.arrow.hide(); this.arrow.hide();
} else { } else {
size = this.options.arrowSize; arrowSize = this.options.arrowSize;
arrowCss = $.extend({}, css); arrowCss = $.extend({}, css);
for (_i = 0, _len = mainPositions.length; _i < _len; _i++) { for (_i = 0, _len = mainPositions.length; _i < _len; _i++) {
pos = mainPositions[_i]; pos = mainPositions[_i];
@@ -290,21 +291,31 @@ Notification = (function() {
continue; continue;
} }
color = posFull === mainFull ? this.getColor() : 'transparent'; color = posFull === mainFull ? this.getColor() : 'transparent';
arrowCss["border-" + posFull] = "" + size + "px solid " + color; arrowCss["border-" + posFull] = "" + arrowSize + "px solid " + color;
} }
incr(css, positions[opp], size); incr(css, positions[opp], arrowSize);
this.arrow.css(arrowCss).show(); if (__indexOf.call(mainPositions, pAlign) >= 0) {
incr(arrowCss, positions[pAlign], arrowSize * 2);
} }
if (__indexOf.call(vPositions, pMain) >= 0) { }
if (__indexOf.call(vAligns, pMain) >= 0) {
incr(css, 'left', realign(pAlign, contW, elemW)); incr(css, 'left', realign(pAlign, contW, elemW));
if (arrowCss) {
incr(arrowCss, 'left', realign(pAlign, arrowSize, elemIW));
} }
if (__indexOf.call(hPositions, pMain) >= 0) { } else if (__indexOf.call(hAligns, pMain) >= 0) {
incr(css, 'top', realign(pAlign, contH, elemH)); incr(css, 'top', realign(pAlign, contH, elemH));
if (arrowCss) {
incr(arrowCss, 'top', realign(pAlign, arrowSize, elemIH));
}
} }
if (this.container.is(":visible")) { if (this.container.is(":visible")) {
css.display = 'block'; css.display = 'block';
} }
return this.container.removeAttr('style').css(css); this.container.removeAttr('style').css(css);
if (arrowCss) {
return this.arrow.removeAttr('style').css(arrowCss);
}
}; };
Notification.prototype.getPosition = function() { Notification.prototype.getPosition = function() {
@@ -317,8 +328,8 @@ Notification = (function() {
if (_ref = pos[0], __indexOf.call(mainPositions, _ref) < 0) { if (_ref = pos[0], __indexOf.call(mainPositions, _ref) < 0) {
throw "Must be one of [" + mainPositions + "]"; throw "Must be one of [" + mainPositions + "]";
} }
if (pos.length === 1 || ((_ref1 = pos[0], __indexOf.call(vPositions, _ref1) >= 0) && (_ref2 = pos[1], __indexOf.call(hPositions, _ref2) < 0)) || ((_ref3 = pos[0], __indexOf.call(hPositions, _ref3) >= 0) && (_ref4 = pos[1], __indexOf.call(vPositions, _ref4) < 0))) { if (pos.length === 1 || ((_ref1 = pos[0], __indexOf.call(vAligns, _ref1) >= 0) && (_ref2 = pos[1], __indexOf.call(hAligns, _ref2) < 0)) || ((_ref3 = pos[0], __indexOf.call(hAligns, _ref3) >= 0) && (_ref4 = pos[1], __indexOf.call(vAligns, _ref4) < 0))) {
pos[1] = (_ref5 = pos[0], __indexOf.call(hPositions, _ref5) >= 0) ? 'm' : 'l'; pos[1] = (_ref5 = pos[0], __indexOf.call(hAligns, _ref5) >= 0) ? 'm' : 'l';
} }
if (!this.options.autoReposition) { if (!this.options.autoReposition) {
return pos; return pos;
dist/notify.min.js
Vendored
+2 -2
View File
@@ -1,4 +1,4 @@
/** Notify.js - v0.0.1 - 2013/05/31 /** Notify.js - v0.0.1 - 2013/06/03
* http://notifyjs.com/ * http://notifyjs.com/
* Copyright (c) 2013 Jaime Pillora - MIT * Copyright (c) 2013 Jaime Pillora - MIT
*/(function(t,n,i){"use strict";var e,o,r,s,a,l,h,p,d,u,c,f,w,y,m,g,A,b,x=[].indexOf||function(t){for(var n=0,i=this.length;i>n;n++)if(n in this&&this[n]===t)return n;return-1};w="notify",o="__"+w,m={t:"top",m:"middle",b:"bottom",l:"left",c:"center",r:"right"},l=["l","c","r"],b=["t","m","b"],u=["t","b","l","r"],c={t:"b",m:null,b:"t",l:"r",c:null,r:"l"},f=function(t){var n;return n=[],$.each(t.split(/\W+/),function(t,e){var o;return o=e.toLowerCase().charAt(0),m[o]?n.push(o):i}),n},A={core:{html:'<div class="'+o+'Wrapper">\n <div class="'+o+'Debug"></div>\n <div class="'+o+'Arrow"></div>\n <div class="'+o+'Container"></div>\n</div>',css:"."+o+"Corner {\n position: fixed;\n top: 0;\n right: 0;\n margin: 5px;\n z-index: 1050;\n}\n\n."+o+"Corner ."+o+"Wrapper,\n."+o+"Corner ."+o+"Container {\n position: relative;\n display: block;\n height: inherit;\n width: inherit;\n}\n\n."+o+"Wrapper {\n z-index: 1;\n position: absolute;\n display: inline-block;\n height: 0;\n width: 0;\n}\n\n."+o+"Debug {\n position: absolute;\n border: 3px solid red;\n height: 0;\n width: 0;\n}\n\n."+o+"Container {\n display: none;\n z-index: 1;\n position: absolute;\n cursor: pointer;\n}\n\n."+o+"Text {\n position: relative;\n}\n\n."+o+"Arrow {\n position: absolute;\n z-index: 2;\n width: 0;\n height: 0;\n}\n"},user:{"default":{html:'<div class="'+o+'Default" \n data-notify-style="\n color: {{color}}; \n border-color: {{color}};\n ">\n <span data-notify-text></span>\n </div>',css:"."+o+"Default {\n background: #fff;\n font-size: 11px;\n box-shadow: 0 0 6px #000;\n -moz-box-shadow: 0 0 6px #000;\n -webkit-box-shadow: 0 0 6px #000;\n padding: 4px 10px 4px 8px;\n border-radius: 6px;\n border-style: solid;\n border-width: 2px;\n -moz-border-radius: 6px;\n -webkit-border-radius: 6px;\n white-space: nowrap;\n}"},bootstrap:{html:'<div class="alert alert-error '+o+'Bootstrap">\n <strong data-notify-text></strong>\n</div>',css:"."+o+"Bootstrap {\n white-space: nowrap;\n margin: 5px !important;\n padding-left: 25px !important;\n background-repeat: no-repeat;\n background-position: 3px 7px;\n background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAtRJREFUeNqkVc1u00AQHq+dOD+0poIQfkIjalW0SEGqRMuRnHos3DjwAH0ArlyQeANOOSMeAA5VjyBxKBQhgSpVUKKQNGloFdw4cWw2jtfMOna6JOUArDTazXi/b3dm55socPqQhFka++aHBsI8GsopRJERNFlY88FCEk9Yiwf8RhgRyaHFQpPHCDmZG5oX2ui2yilkcTT1AcDsbYC1NMAyOi7zTX2Agx7A9luAl88BauiiQ/cJaZQfIpAlngDcvZZMrl8vFPK5+XktrWlx3/ehZ5r9+t6e+WVnp1pxnNIjgBe4/6dAysQc8dsmHwPcW9C0h3fW1hans1ltwJhy0GxK7XZbUlMp5Ww2eyan6+ft/f2FAqXGK4CvQk5HueFz7D6GOZtIrK+srupdx1GRBBqNBtzc2AiMr7nPplRdKhb1q6q6zjFhrklEFOUutoQ50xcX86ZlqaZpQrfbBdu2R6/G19zX6XSgh6RX5ubyHCM8nqSID6ICrGiZjGYYxojEsiw4PDwMSL5VKsC8Yf4VRYFzMzMaxwjlJSlCyAQ9l0CW44PBADzXhe7xMdi9HtTrdYjFYkDQL0cn4Xdq2/EAE+InCnvADTf2eah4Sx9vExQjkqXT6aAERICMewd/UAp/IeYANM2joxt+q5VI+ieq2i0Wg3l6DNzHwTERPgo1ko7XBXj3vdlsT2F+UuhIhYkp7u7CarkcrFOCtR3H5JiwbAIeImjT/YQKKBtGjRFCU5IUgFRe7fF4cCNVIPMYo3VKqxwjyNAXNepuopyqnld602qVsfRpEkkz+GFL1wPj6ySXBpJtWVa5xlhpcyhBNwpZHmtX8AGgfIExo0ZpzkWVTBGiXCSEaHh62/PoR0p/vHaczxXGnj4bSo+G78lELU80h1uogBwWLf5YlsPmgDEd4M236xjm+8nm4IuE/9u+/PH2JXZfbwz4zw1WbO+SQPpXfwG/BBgAhCNZiSb/pOQAAAAASUVORK5CYII=);\n}",colors:{red:"#eed3d7"}}}},y={autoHide:!1,autoHideDelay:2e3,arrowShow:!0,arrowSize:5,position:"bottom",style:"default",color:"red",colors:{red:"#b94a48",green:"#33be40",black:"#393939",blue:"#00f"},showAnimation:"slideDown",showDuration:400,hideAnimation:"slideUp",hideDuration:200,offsetY:0,offsetX:0},s=function(t){return $("<"+t+"></"+t+">")},p=function(t,n){var i;return i=function(){},i.prototype=t,$.extend(!0,new i,n)},r=s("div").addClass(""+o+"Corner"),a=function(t){var n;return t.is("[type=radio]")&&(n=t.parents("form:first").find("[type=radio]").filter(function(n,i){return $(i).attr("name")===t.attr("name")}),t=n.first()),t},h=function(t,n,e){var o,r;if("string"==typeof e)e=parseInt(e,10);else if("number"!=typeof e)return;if(!isNaN(e))return o=m[c[n.charAt(0)]],r=n,t[o]!==i&&(n=m[o.charAt(0)],e*=-1),t[n]===i?t[n]=e:t[n]+=e,null},g=function(t,n,i){if("l"===t||"t"===t)return 0;if("c"===t||"m"===t)return i/2-n/2;if("r"===t||"b"===t)return i-n;throw"Invalid alignment"},d=function(t){var n;if(t&&t.css&&(n=t.cssElem,!n)){n=s("style"),$("head").append(n),t.cssElem=n;try{return n.html(t.css)}catch(i){return n[0].styleSheet.cssText=t.css}}},e=function(){function t(t,n,i){"string"==typeof i&&(i={color:i}),this.options=p(y,$.isPlainObject(i)?i:{}),this.loadCSS(),this.loadHTML(),this.wrapper=$(A.core.html),this.wrapper.data(o,this),this.arrow=this.wrapper.find("."+o+"Arrow"),this.container=this.wrapper.find("."+o+"Container"),this.container.append(this.userContainer),t&&t.length?(this.elementType=t.attr("type"),this.originalElement=t,this.elem=a(t),this.elem.data(o,this),this.elem.before(this.wrapper)):(this.options.arrowShow=!1,r.prepend(this.wrapper)),this.container.hide(),thLine truncated */(function(t,n,e){"use strict";var i,o,r,s,a,l,h,p,u,d,c,f,w,y,m,A,g,b,x=[].indexOf||function(t){for(var n=0,e=this.length;e>n;n++)if(n in this&&this[n]===t)return n;return-1};w="notify",o="__"+w,m={t:"top",m:"middle",b:"bottom",l:"left",c:"center",r:"right"},l=["l","c","r"],b=["t","m","b"],d=["t","b","l","r"],c={t:"b",m:null,b:"t",l:"r",c:null,r:"l"},f=function(t){var n;return n=[],$.each(t.split(/\W+/),function(t,i){var o;return o=i.toLowerCase().charAt(0),m[o]?n.push(o):e}),n},g={core:{html:'<div class="'+o+'Wrapper">\n <div class="'+o+'Arrow"></div>\n <div class="'+o+'Container"></div>\n</div>',css:"."+o+"Corner {\n position: fixed;\n top: 0;\n right: 0;\n margin: 5px;\n z-index: 1050;\n}\n\n."+o+"Corner ."+o+"Wrapper,\n."+o+"Corner ."+o+"Container {\n position: relative;\n display: block;\n height: inherit;\n width: inherit;\n}\n\n."+o+"Wrapper {\n z-index: 1;\n position: absolute;\n display: inline-block;\n height: 0;\n width: 0;\n}\n\n."+o+"Container {\n display: none;\n z-index: 1;\n position: absolute;\n cursor: pointer;\n}\n\n."+o+"Text {\n position: relative;\n}\n\n."+o+"Arrow {\n position: absolute;\n z-index: 2;\n width: 0;\n height: 0;\n}\n"},user:{"default":{html:'<div class="'+o+'Default" \n data-notify-style="\n color: {{color}}; \n border-color: {{color}};\n ">\n <span data-notify-text></span>\n </div>',css:"."+o+"Default {\n background: #fff;\n font-size: 11px;\n box-shadow: 0 0 6px #000;\n -moz-box-shadow: 0 0 6px #000;\n -webkit-box-shadow: 0 0 6px #000;\n padding: 4px 10px 4px 8px;\n border-radius: 6px;\n border-style: solid;\n border-width: 2px;\n -moz-border-radius: 6px;\n -webkit-border-radius: 6px;\n white-space: nowrap;\n}"},bootstrap:{html:'<div class="alert alert-error '+o+'Bootstrap">\n <strong data-notify-text></strong>\n</div>',css:"."+o+"Bootstrap {\n white-space: nowrap;\n margin: 5px !important;\n padding-left: 25px !important;\n background-repeat: no-repeat;\n background-position: 3px 7px;\n background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAtRJREFUeNqkVc1u00AQHq+dOD+0poIQfkIjalW0SEGqRMuRnHos3DjwAH0ArlyQeANOOSMeAA5VjyBxKBQhgSpVUKKQNGloFdw4cWw2jtfMOna6JOUArDTazXi/b3dm55socPqQhFka++aHBsI8GsopRJERNFlY88FCEk9Yiwf8RhgRyaHFQpPHCDmZG5oX2ui2yilkcTT1AcDsbYC1NMAyOi7zTX2Agx7A9luAl88BauiiQ/cJaZQfIpAlngDcvZZMrl8vFPK5+XktrWlx3/ehZ5r9+t6e+WVnp1pxnNIjgBe4/6dAysQc8dsmHwPcW9C0h3fW1hans1ltwJhy0GxK7XZbUlMp5Ww2eyan6+ft/f2FAqXGK4CvQk5HueFz7D6GOZtIrK+srupdx1GRBBqNBtzc2AiMr7nPplRdKhb1q6q6zjFhrklEFOUutoQ50xcX86ZlqaZpQrfbBdu2R6/G19zX6XSgh6RX5ubyHCM8nqSID6ICrGiZjGYYxojEsiw4PDwMSL5VKsC8Yf4VRYFzMzMaxwjlJSlCyAQ9l0CW44PBADzXhe7xMdi9HtTrdYjFYkDQL0cn4Xdq2/EAE+InCnvADTf2eah4Sx9vExQjkqXT6aAERICMewd/UAp/IeYANM2joxt+q5VI+ieq2i0Wg3l6DNzHwTERPgo1ko7XBXj3vdlsT2F+UuhIhYkp7u7CarkcrFOCtR3H5JiwbAIeImjT/YQKKBtGjRFCU5IUgFRe7fF4cCNVIPMYo3VKqxwjyNAXNepuopyqnld602qVsfRpEkkz+GFL1wPj6ySXBpJtWVa5xlhpcyhBNwpZHmtX8AGgfIExo0ZpzkWVTBGiXCSEaHh62/PoR0p/vHaczxXGnj4bSo+G78lELU80h1uogBwWLf5YlsPmgDEd4M236xjm+8nm4IuE/9u+/PH2JXZfbwz4zw1WbO+SQPpXfwG/BBgAhCNZiSb/pOQAAAAASUVORK5CYII=);\n}",colors:{red:"#eed3d7"}}}},y={autoHide:!1,autoHideDelay:2e3,arrowShow:!0,arrowSize:5,position:"bottom",style:"default",color:"black",colors:{red:"#b94a48",green:"#33be40",black:"#393939",blue:"#00f"},showAnimation:"slideDown",showDuration:400,hideAnimation:"slideUp",hideDuration:200,offsetY:0,offsetX:0},s=function(t){return $("<"+t+"></"+t+">")},p=function(t,n){var e;return e=function(){},e.prototype=t,$.extend(!0,new e,n)},r=s("div").addClass(""+o+"Corner"),a=function(t){var n;return t.is("[type=radio]")&&(n=t.parents("form:first").find("[type=radio]").filter(function(n,e){return $(e).attr("name")===t.attr("name")}),t=n.first()),t},h=function(t,n,i){var o,r;if("string"==typeof i)i=parseInt(i,10);else if("number"!=typeof i)return;if(!isNaN(i))return o=m[c[n.charAt(0)]],r=n,t[o]!==e&&(n=m[o.charAt(0)],i*=-1),t[n]===e?t[n]=i:t[n]+=i,null},A=function(t,n,e){if("l"===t||"t"===t)return 0;if("c"===t||"m"===t)return e/2-n/2;if("r"===t||"b"===t)return e-n;throw"Invalid alignment"},u=function(t){var n;if(t&&t.css&&(n=t.cssElem,!n)){n=s("style"),$("head").append(n),t.cssElem=n;try{return n.html(t.css)}catch(e){return n[0].styleSheet.cssText=t.css}}},i=function(){function t(t,n,e){"string"==typeof e&&(e={color:e}),this.options=p(y,$.isPlainObject(e)?e:{}),this.loadCSS(),this.loadHTML(),this.wrapper=$(g.core.html),this.wrapper.data(o,this),this.arrow=this.wrapper.find("."+o+"Arrow"),this.container=this.wrapper.find("."+o+"Container"),this.container.append(this.userContainer),t&&t.length?(this.elementType=t.attr("type"),this.originalElement=t,this.elem=a(t),this.elem.data(o,this),this.elem.before(this.wrapper)):(this.options.arrowShow=!1,r.prepend(this.wrapper)),this.container.hide(),this.run(n)}return t.prototype.loadCSS=function(t){var n;return t||(n=this.options.style,t=this.getStyle(n)),u(t)},t.prototype.loaLine truncated
examples/position.html
+1 -1
View File
@@ -33,7 +33,7 @@
boxes.append($("<div class=\"wrapper\"/>").append(box)); boxes.append($("<div class=\"wrapper\"/>").append(box));
setTimeout(function() { setTimeout(function() {
box.notify(p, {position: p+" middle"}); box.notify(p, {position: p+" center"});
}, 500) }, 500)
}); });
</script> </script>
src/notify.coffee
+32 -26
View File
@@ -13,8 +13,8 @@ positions =
l: 'left' l: 'left'
c: 'center' c: 'center'
r: 'right' r: 'right'
hPositions = ['l','c','r'] hAligns = ['l','c','r']
vPositions = ['t','m','b'] vAligns = ['t','m','b']
mainPositions = ['t','b','l','r'] mainPositions = ['t','b','l','r']
#positions mapped to opposites #positions mapped to opposites
opposites = opposites =
@@ -37,11 +37,20 @@ styles =
core: core:
html: """ html: """
<div class="#{className}Wrapper"> <div class="#{className}Wrapper">
<div class="#{className}Debug"></div>
<div class="#{className}Arrow"></div> <div class="#{className}Arrow"></div>
<div class="#{className}Container"></div> <div class="#{className}Container"></div>
</div> </div>
""" """
# <div class="#{className}Debug"></div>
# .#{className}Debug {
# position: absolute;
# border: 3px solid red;
# height: 0;
# width: 0;
# }
css: """ css: """
.#{className}Corner { .#{className}Corner {
position: fixed; position: fixed;
@@ -67,13 +76,6 @@ styles =
width: 0; width: 0;
} }
.#{className}Debug {
position: absolute;
border: 3px solid red;
height: 0;
width: 0;
}
.#{className}Container { .#{className}Container {
display: none; display: none;
z-index: 1; z-index: 1;
@@ -150,7 +152,7 @@ pluginOptions =
# Default style # Default style
style: 'default' style: 'default'
# Default color # Default color
color: 'red' color: 'black'
# Color mappings # Color mappings
colors: colors:
red: '#b94a48' red: '#b94a48'
@@ -313,13 +315,15 @@ class Notification
elemPos = @elem.position() elemPos = @elem.position()
elemH = @elem.outerHeight() elemH = @elem.outerHeight()
elemW = @elem.outerWidth() elemW = @elem.outerWidth()
elemIH = @elem.innerHeight()
elemIW = @elem.innerWidth()
wrapPos = @wrapper.position() wrapPos = @wrapper.position()
contH = @container.height() contH = @container.height()
contW = @container.width() contW = @container.width()
#get user defined position #get user defined position
position = @getPosition() position = @getPosition()
console.log position
pMain = position[0] pMain = position[0]
pAlign = position[1] pAlign = position[1]
pArrow = position[2] or pAlign pArrow = position[2] or pAlign
@@ -353,43 +357,46 @@ class Notification
if not @options.arrowShow if not @options.arrowShow
@arrow.hide() @arrow.hide()
else else
size = @options.arrowSize arrowSize = @options.arrowSize
arrowCss = $.extend {}, css arrowCss = $.extend {}, css
#build arrow #build arrow
for pos in mainPositions for pos in mainPositions
posFull = positions[pos] posFull = positions[pos]
continue if pos is opp continue if pos is opp
color = if posFull is mainFull then @getColor() else 'transparent' color = if posFull is mainFull then @getColor() else 'transparent'
arrowCss["border-#{posFull}"] = "#{size}px solid #{color}" arrowCss["border-#{posFull}"] = "#{arrowSize}px solid #{color}"
#add some room for the arrow #add some room for the arrow
incr css, positions[opp], size incr css, positions[opp], arrowSize
#add styles
@arrow.css(arrowCss).show()
#calculate alignment incr arrowCss, positions[pAlign], arrowSize*2 if pAlign in mainPositions
if pMain in vPositions
#calculate container alignment
if pMain in vAligns
incr css, 'left', realign(pAlign, contW, elemW) incr css, 'left', realign(pAlign, contW, elemW)
if pMain in hPositions incr arrowCss, 'left', realign(pAlign, arrowSize, elemIW) if arrowCss
else if pMain in hAligns
incr css, 'top', realign(pAlign, contH, elemH) incr css, 'top', realign(pAlign, contH, elemH)
incr arrowCss, 'top', realign(pAlign, arrowSize, elemIH) if arrowCss
#apply css #apply css
css.display = 'block' if @container.is(":visible") css.display = 'block' if @container.is(":visible")
@container.removeAttr('style').css css @container.removeAttr('style').css css
@arrow.removeAttr('style').css(arrowCss) if arrowCss
getPosition: -> getPosition: ->
text = @options.position text = @options.position
pos = parsePosition text pos = parsePosition text
#if unspecified - choose bottom left #validate position
pos[0] = 'b' if pos.length is 0 pos[0] = 'b' if pos.length is 0
if pos[0] not in mainPositions if pos[0] not in mainPositions
throw "Must be one of [#{mainPositions}]" throw "Must be one of [#{mainPositions}]"
#validate alignment
if pos.length is 1 or if pos.length is 1 or
(pos[0] in vPositions and pos[1] not in hPositions) or (pos[0] in vAligns and pos[1] not in hAligns) or
(pos[0] in hPositions and pos[1] not in vPositions) (pos[0] in hAligns and pos[1] not in vAligns)
pos[1] = if pos[0] in hPositions then 'm' else 'l' pos[1] = if pos[0] in hAligns then 'm' else 'l'
unless @options.autoReposition unless @options.autoReposition
return pos return pos
@@ -397,7 +404,6 @@ class Notification
# if @elem.position().left + @elem.width() + @wrapper.width() < $(window).width() # if @elem.position().left + @elem.width() + @wrapper.width() < $(window).width()
# return 'right' # return 'right'
# return 'bottom' # return 'bottom'
throw "Not implemented" throw "Not implemented"
getColor: -> getColor: ->