diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index f563a29..361f957 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -15,6 +15,7 @@ //= require foundation //= require fancybox //= require cookies_eu +//= require jquery.amaran //= require_tree . $(function(){ $(document).foundation(); }); diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index bed4efa..feb9637 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -12,4 +12,7 @@ *= require foundation_and_overrides *= require cookies_eu *= require fancybox + * https://github.com/hakanersu/AmaranJS + *= require amaran + **= require animate */ diff --git a/app/views/layouts/_messages.slim b/app/views/layouts/_messages.slim index e3b9869..7056075 100644 --- a/app/views/layouts/_messages.slim +++ b/app/views/layouts/_messages.slim @@ -1,15 +1,27 @@ // Display alert messages to the user -// Supported names are: .secondary, .primary, .success, .warning, or .alert + - if flash - .row - .small-6.small-centered.columns - - flash.each do |name, msg| - - case name - - when 'notice' - - colorclass='success' - - else - - colorclass='primary' - div class="#{colorclass} callout" data-closable=true - = msg - button class='close-button' aria-label='Dismiss' type='button' data-close=true - span aria-hidden=true × + - flash.each do |name,msg| + - case name + - when 'notice' + - flash_color = 'white' + - flash_bgcolor = 'green' + - when 'alert' + - flash_color = 'white' + - flash_bgcolor = 'red' + - else + - flash_color = 'black' + - flash_bgcolor = 'gray' + + javascript: + $.amaran({ + 'content': { + 'message' :'#{name}: #{msg}', + 'color' : '#{flash_color}', + 'bgcolor' : '#{flash_bgcolor}' + }, + 'position' :'top right', + 'theme' : 'colorful', + 'cssanimationIn' :'bounceInDown', + 'cssanimationOut' :'zoomOutUp' + }); diff --git a/vendor/assets/javascripts/jquery.amaran.js b/vendor/assets/javascripts/jquery.amaran.js new file mode 100644 index 0000000..800a171 --- /dev/null +++ b/vendor/assets/javascripts/jquery.amaran.js @@ -0,0 +1 @@ +(function(){!function(t,i){var n,e;return n=function(i){var n;n={position:"bottom right",content:" ",delay:3e3,sticky:!1,inEffect:"fadeIn",outEffect:"fadeOut",theme:"default",themeTemplate:null,closeOnClick:!0,closeButton:!1,clearAll:!1,cssanimationIn:!1,cssanimationOut:!1,beforeStart:function(){},afterEnd:function(){},onClick:function(){},wrapper:".amaran-wrapper"},this.config=t.extend({},n,i),this.config.beforeStart(),this.init(),this.close()},n.prototype={init:function(){var i,n,o,a,s,c,h,r;h=null,r=null,o=this.config.position.split(" "),t(this.config.wrapper).length&&t(this.config.wrapper).hasClass(this.config.position)?(h=t(this.config.wrapper+"."+o[0]+"."+o[1]),s=h.find(".amaran-wrapper-inner")):(h=t("
",{"class":this.config.wrapper.substr(1,this.config.wrapper.length)+" "+this.config.position}).appendTo("body"),s=t("
",{"class":"amaran-wrapper-inner"}).appendTo(h)),"object"==typeof this.config.content?c=null!=this.config.themeTemplate?this.config.themeTemplate(this.config.content):e[this.config.theme.split(" ")[0]+"Theme"](this.config.content):(this.config.content={},this.config.content.message=this.config.message,this.config.content.color="#27ae60",c=e.defaultTheme(this.config.content)),i={"class":this.config.themeTemplate?"amaran "+this.config.content.themeName:this.config.theme&&!this.config.themeTemplate?"amaran "+this.config.theme:"amaran",html:this.config.closeButton?''+c:c},this.config.clearAll&&t(".amaran").remove(),a=t("
",i).appendTo(s),"center"===o[0]&&this.centerCalculate(h,s),this.animation(this.config.inEffect,a,"show"),this.config.onClick&&(n=this,t(a).on("click",function(i){return t(i.target).is(".amaran-close")?void i.preventDefault():void n.config.onClick()})),this.config.sticky!==!0&&this.hideDiv(a)},centerCalculate:function(t,i){var n,e,o;e=i.find(".amaran").length,o=i.height(),n=(t.height()-o)/2,i.find(".amaran:first-child").animate({"margin-top":n},200)},animation:function(t,i,n){return"fadeIn"===t||"fadeOut"===t?this.fade(i,n):"show"===t?this.cssanimate(i,n):this.slide(t,i,n)},fade:function(t,i){var n;return n=this,"show"===i?this.config.cssanimationIn?t.addClass("animated "+this.config.cssanimationIn).show():t.fadeIn():this.config.cssanimationOut?(t.addClass("animated "+this.config.cssanimationOut),t.css({"min-height":0,height:t.outerHeight()}),void t.animate({opacity:0},function(){t.animate({height:0},function(){n.removeIt(t)})})):(t.css({"min-height":0,height:t.outerHeight()}),void t.animate({opacity:0},function(){t.animate({height:0},function(){n.removeIt(t)})}))},removeIt:function(i){var n,e;clearTimeout(this.timeout),i.remove(),e=t(this.config.wrapper+"."+this.config.position.split(" ")[0]+"."+this.config.position.split(" ")[1]),n=e.find(".amaran-wrapper-inner"),"center"===this.config.position.split(" ")[0]&&this.centerCalculate(e,n),this.config.afterEnd()},getWidth:function(t){var i,n;return i=t.clone().hide().appendTo("body"),n=i.outerWidth()+i.outerWidth()/2,i.remove(),n},getInfo:function(i){var n,e;return n=i.offset(),e=t(this.config.wrapper).offset(),{t:n.top,l:n.left,h:i.height(),w:i.outerWidth(),wT:e.top,wL:e.left,wH:t(this.config.wrapper).outerHeight(),wW:t(this.config.wrapper).outerWidth()}},getPosition:function(n,e){var o,a,s;return o=this.getInfo(n),a=this.config.position.split(" ")[1],s={slideTop:{start:{top:-(o.wT+o.wH+2*o.h)},move:{top:0},hide:{top:-(o.t+2*o.h)},height:o.h},slideBottom:{start:{top:t(i).height()-o.wH+2*o.h},move:{top:0},hide:{top:t(i).height()-o.wH+2*o.h},height:o.h},slideLeft:{start:{left:"left"===a?1.5*-o.w:-t(i).width()},move:{left:0},hide:{left:"left"===a?1.5*-o.w:-t(i).width()},height:o.h},slideRight:{start:{left:"right"===a?1.5*o.w:t(i).width()},move:{left:0},hide:{left:"right"===a?1.5*o.w:t(i).width()},height:o.h}},s[e]?s[e]:0},slide:function(t,i,n){var e,o;return o=this.getPosition(i,t),"show"!==n?(e=this,i.animate(o.hide,function(){i.css({"min-height":0,height:o.height},function(){i.html(" ")})}).animate({height:0},function(){return e.removeIt(i)})):void i.show().css(o.start).animate(o.move)},close:function(){var i;return i=this,t("[data-amaran-close]").on("click",function(){i.animation(i.config.outEffect,t(this).closest("div.amaran"),"hide")}),!this.config.closeOnClick&&this.config.closeButton?void i.animation(i.config.outEffect,t(this).parent("div.amaran"),"hide"):void(this.config.closeOnClick&&t(".amaran").on("click",function(){i.animation(i.config.outEffect,t(this),"hide")}))},hideDiv:function(t){var i;i=this,i.timeout=setTimeout(function(){i.animation(i.config.outEffect,t,"hide")},i.config.delay)}},e={defaultTheme:function(t){var i;return i="","undefined"!=typeof t.color&&(i=t.color),"
"+t.message+"
"},awesomeTheme:function(t){return'

'+t.title+"

"+t.message+''+t.info+"

"},userTheme:function(t){return'
'+t.user+""+t.message+"
"},colorfulTheme:function(t){var i,n;return"undefined"!=typeof t.color&&(n=t.color),"undefined"!=typeof t.bgcolor&&(i=t.bgcolor),"
"+t.message+"
"},tumblrTheme:function(t){return'
'+t.title+'
'+t.message+"
"}},t.amaran=function(t){var i;return i=new n(t)},t.amaran.close=function(){return t(".amaran-wrapper").remove(),!1}}(jQuery,window,document)}).call(this); \ No newline at end of file diff --git a/vendor/assets/stylesheets/amaran.css b/vendor/assets/stylesheets/amaran.css new file mode 100755 index 0000000..c5cc80a --- /dev/null +++ b/vendor/assets/stylesheets/amaran.css @@ -0,0 +1,6 @@ +.amaran.awesome{width:300px;min-height:65px;background:#f3f3f3;color:#222;margin:15px;padding:5px 5px 5px 70px;font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;box-shadow:1px 1px 1px #000}.amaran.awesome .icon{width:50px;height:50px;position:absolute;top:50%;left:10px;background:#000;margin-top:-25px;border-radius:50%;text-align:center;line-height:50px;font-size:22px}.amaran.awesome p{padding:0;margin:0}.amaran.awesome p span{font-weight:300}.amaran.awesome p span.light{font-size:13px;display:block;color:#777}.amaran.awesome.ok p.bold{color:#178B13}.amaran.awesome.ok .icon{background-color:#178B13;color:#fff}.amaran.awesome.error p.bold{color:#D82222}.amaran.awesome.error .icon{background-color:#D82222;color:#fff}.amaran.awesome.warning p.bold{color:#9F6000}.amaran.awesome.warning .icon{background-color:#9F6000;color:#fff}.amaran.awesome.yellow p.bold{color:#CFA846}.amaran.awesome.yellow .icon{background-color:#CFA846;color:#fff}.amaran.awesome.blue p.bold{color:#2980b9}.amaran.awesome.blue .icon{background-color:#2980b9;color:#fff}.amaran.awesome.green p.bold{color:#27ae60}.amaran.awesome.green .icon{background-color:#27ae60;color:#fff}.amaran.awesome.purple p.bold{color:#5B54AA}.amaran.awesome.purple .icon{background-color:#5B54AA;color:#fff} +.amaran.colorful{width:300px;min-height:45px;overflow:hidden;background-color:transparent;z-index:1}.amaran.colorful .colorful-inner{width:100%;min-height:45px;display:block;position:relative;background-color:#484860;padding:15px 25px 15px 15px;color:#fff;font-size:14px;border-bottom:1px solid rgba(0,0,0,.2);border-radius:4px}.amaran.colorful .amaran-close{color:#fff;z-index:2;top:8px;right:8px;text-align:center;line-height:18px}.amaran-wrapper.center .amaran.colorful{margin:0 auto} +.amaran.default{width:300px;min-height:45px;background:#1B1E24;background:-webkit-linear-gradient(left,#111213,#111213 15%,#1b1e24 15%,#1b1e24);background:linear-gradient(left,#111213,#111213 15%,#1b1e24 15%,#1b1e24);color:#fff;font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:13px;font-weight:300;margin:5px;overflow:hidden;border-bottom:1px solid #111213;border-radius:6px}.amaran.default .default-spinner{width:45px;min-height:45px;display:block;float:left;position:relative}.amaran.default .default-spinner span{width:18px;height:18px;background:#27ae60;display:block;border-radius:50%;position:absolute;top:50%;left:50%;margin-left:-11px;margin-top:-9px}.amaran.default .default-message{float:left}.amaran.default .default-message span{padding:3px;line-height:43px}.amaran.default .default-message:after{clear:both} +.amaran-wrapper *{box-sizing:border-box}.amaran-wrapper{position:fixed;z-index:9999}.amaran-wrapper.top{top:0;bottom:auto}.amaran-wrapper.bottom{bottom:0;top:auto}.amaran-wrapper.left{left:0}.amaran-wrapper.right{right:0;left:auto}.amaran-wrapper.center{width:50%;height:50%;margin:auto;position:fixed;top:0;left:0;bottom:0;right:0}.amaran{width:200px;background:rgba(0,0,0,.7);padding:3px;color:#fff;border-radius:4px;display:none;font-size:13px;cursor:pointer;position:relative;text-align:left;min-height:50px;margin:10px}.amaran-close{position:absolute;top:2px;right:2px;display:block;width:20px;height:20px}.amaran-close:before{content:"x";color:#fff;font-weight:700;font-family:Arial,sans-serif;font-size:18px} +.amaran.tumblr{width:300px;min-height:45px;overflow:hidden;background-color:#fff;color:#444;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.3);z-index:1}.amaran.tumblr .title{position:relative;font-size:15px;line-height:15px;height:28px;padding:5px 10px;border-bottom:1px solid rgba(0,0,0,.1);font-weight:700;z-index:1}.amaran.tumblr .content{padding:5px}.amaran.tumblr .image{float:left}.amaran.tumblr .amaran-close{z-index:2}.amaran.tumblr .amaran-close:before{color:#000} +.amaran.user{width:300px;min-height:100px;background:#f3f3f3;color:#222;margin:15px;font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:13px;font-weight:300;box-shadow:1px 1px 1px #000;border-radius:0;padding:0}.amaran.user .icon{width:100px;height:100px;position:relative;background:#000;float:left}.amaran.user img{max-width:100%}.amaran.user .info{padding-left:110px;padding-top:10px}.amaran.user b{display:block;font-size:16px}.amaran.user.blue{background:#2773ed;color:#fff}.amaran.user.yellow{background:#f4b300;color:#fff}.amaran.user.green{background:#78ba00;color:#fff} \ No newline at end of file