alertify-rails 0.0.1

data/.gitignore

@@ -0,0 +1,17 @@
+*.gem
+*.rbc
+.bundle
+.config
+.yardoc
+Gemfile.lock
+InstalledFiles
+_yardoc
+coverage
+doc/
+lib/bundler/man
+pkg
+rdoc
+spec/reports
+test/tmp
+test/version_tmp
+tmp

data/Gemfile

@@ -0,0 +1,4 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in alertify-rails.gemspec
+gemspec

data/LICENSE.txt

@@ -0,0 +1,22 @@
+Copyright (c) 2012 Rudolf Schmidt
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,29 @@
+# Alertify::Rails
+
+TODO: Write a gem description
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+    gem 'alertify-rails'
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install alertify-rails
+
+## Usage
+
+TODO: Write usage instructions here
+
+## Contributing
+
+1. Fork it
+2. Create your feature branch (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Add some feature'`)
+4. Push to the branch (`git push origin my-new-feature`)
+5. Create new Pull Request

data/Rakefile

@@ -0,0 +1 @@
+require "bundler/gem_tasks"

data/alertify-rails.gemspec

@@ -0,0 +1,19 @@
+# -*- encoding: utf-8 -*-
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'alertify/version'
+
+Gem::Specification.new do |gem|
+  gem.name          = "alertify-rails"
+  gem.version       = Alertify::Rails::VERSION
+  gem.authors       = ["Rudolf Schmidt"]
+
+  gem.description   = %q{Use Alertify.js with Rails 3}
+  gem.summary       = %q{This gem provides the Alertify.js deiver for Rails 3 applications}
+  gem.homepage      = ""
+
+  gem.files         = `git ls-files`.split($/)
+  gem.executables   = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
+  gem.test_files    = gem.files.grep(%r{^(test|spec|features)/})
+  gem.require_paths = ["lib"]
+end

data/lib/alertify-rails.rb

@@ -0,0 +1,7 @@
+require 'alertify/engine' if ::Rails.version >= '3.1'
+require 'alertify/railtie'
+require 'alertify/version'
+
+module Alertify #:nodoc:
+end
+

data/lib/alertify/engine.rb

@@ -0,0 +1,5 @@
+module Alertify
+  class Engine < ::Rails::Engine
+  end
+end
+

data/lib/alertify/railtie.rb

@@ -0,0 +1,12 @@
+module Alertify
+
+  class Railtie < ::Rails::Railtie
+    config.before_configuration do
+      if config.action_view.javascript_expansions
+        config.action_view.javascript_expansions[:defaults] << 'alertify'
+      end
+    end
+  end
+
+end
+

data/lib/alertify/version.rb

@@ -0,0 +1,7 @@
+module Alertify
+  module Rails
+    VERSION = "0.0.1"
+
+  end
+end
+

data/vendor/assets/javascripts/alertify.js

@@ -0,0 +1,393 @@
+/**
+ * Alertify
+ * An unobtrusive customizable JavaScript notification system
+ *
+ * @author Fabien Doiron <fabien.doiron@gmail.com>
+ * @copyright Fabien Doiron 2012
+ * @license The MIT License (MIT) <http://opensource.org/licenses/mit-license.php>
+ * @link http://www.github.com/fabien-d
+ * @module Alertify
+ * @version 0.1a1
+ */
+
+;(function( window, undefined ) {
+
+var
+  // Use the correct document accordingly with window argument (sandbox)
+  document = window.document,
+
+  // The ready event handler and self cleanup method
+  DOMContentLoaded = function() {
+    if ( document.addEventListener ) {
+      document.removeEventListener( "DOMContentLoaded", DOMContentLoaded, false );
+
+      window.alertify = new Alertify();
+    } else if ( document.readyState === "complete" ) {
+      // we're here because readyState === "complete" in oldIE
+      // which is good enough for us to call the dom ready!
+      document.detachEvent( "onreadystatechange", DOMContentLoaded );
+
+      window.alertify = new Alertify();
+    }
+  },
+
+  // sandboxed Alertify
+  Alertify = function () {
+
+    var init, addListeners, bind, unbind, build, close, extend, hide, notify, setup, alert, confirm, log, prompt,
+        $, cover, element, logElement,
+        dialogs = {},
+        delay   = 5000,
+        keys    = {},
+        labels  = {},
+        queue   = [],
+        isopen  = false;
+
+    keys = {
+      ENTER : 13,
+      ESC   : 27
+    };
+
+    labels = {
+      ok     : "OK",
+      cancel : "Cancel"
+    };
+
+    dialogs = {
+      buttons : {
+        holder : "<nav class=\"alertify-buttons\">{{buttons}}</nav>",
+        ok     : "<a href=\"#\" class=\"alertify-button alertify-button-ok\" id=\"aOK\">{{ok}}</a>",
+        cancel : "<a href=\"#\" class=\"alertify-button alertify-button-cancel\" id=\"aCancel\">{{cancel}}</a>"
+      },
+      input   : "<input type=\"text\" class=\"alertify-text\" id=\"aText\">",
+      message : "<p class=\"alertify-message\">{{message}}</p>",
+      log     : "<article class=\"alertify-log{{class}}\">{{message}}</article>"
+    };
+
+    /**
+     * Shorthand for document.getElementById()
+     *
+     * @param  {String} id    A specific element ID
+
+     * @return {Object}       HTML element
+     */
+    $ = function (id) {
+      return document.getElementById(id);
+    };
+
+    /**
+     * Initialize Alertify
+     * Create the 2 main elements
+     *
+     * @return {undefined}
+     */
+    init = function () {
+      // ensure legacy browsers support html5 tags
+      document.createElement("nav");
+      document.createElement("article");
+      document.createElement("section");
+      // cover
+      cover = document.createElement("div");
+      cover.setAttribute("id", "alertifycover");
+      cover.className = "alertify-cover alertify-hidden";
+      document.body.appendChild(cover);
+      // main element
+      element = document.createElement("section");
+      element.setAttribute("id", "alertify");
+      element.className = "alertify alertify-hidden";
+      document.body.appendChild(element);
+      // main element
+      logElement = document.createElement("section");
+      logElement.setAttribute("id", "alertifylogs");
+      logElement.className = "alertify-logs";
+      document.body.appendChild(logElement);
+    };
+
+    /**
+     * Set the proper button click events
+     *
+     * @param {Function} fn    [Optional] Callback function
+     *
+     * @return {undefined}
+     */
+    addListeners = function (fn) {
+      var btnOK     = $("aOK")     || undefined,
+          btnCancel = $("aCancel") || undefined,
+          input     = $("aText")   || undefined,
+          val       = "",
+          ok, cancel, common, key;
+
+      // ok event handler
+      ok = function (event) {
+        common(event);
+        if (typeof input !== "undefined") val = input.value;
+        if (typeof fn === "function") fn(true, val);
+        if (typeof event.preventDefault !== "undefined") event.preventDefault();
+      };
+
+      // cancel event handler
+      cancel = function (event) {
+        common(event);
+        if (typeof fn === "function") fn(false);
+        if (typeof event.preventDefault !== "undefined") event.preventDefault();
+      };
+
+      // common event handler (keyup, ok and cancel)
+      common = function (event) {
+        hide();
+        unbind(document.body, "keyup", key);        
+      };
+
+      // keyup handler
+      key = function (event) {
+        var keyCode = event.keyCode;
+        if (keyCode === keys.ENTER && typeof btnOK !== "undefined") ok(event);
+        else if (keyCode === keys.ESC && typeof btnCancel !== "undefined") cancel(event);
+      };
+
+      // handle OK click
+      if (typeof btnOK !== "undefined") bind(btnOK, "click", ok);
+      // handle Cancel click
+      if (typeof btnCancel !== "undefined") bind(btnCancel, "click", cancel);
+
+      // clear focus off activeElement element to ensure
+      // the ENTER key triggers the correct behaviour
+      // Firefox has an issue if this isn't done and the current
+      // focus is an anchor
+      document.activeElement.blur();
+      // listen for keys, OK => ENTER, Cancel => ESC
+      bind(document.body, "keyup", key);
+    };
+
+    /**
+     * Bind events to elements
+     * 
+     * @param  {Object}   el       HTML Object
+     * @param  {Event}    event    Event to attach to element
+     * @param  {Function} fn       Callback function
+     * 
+     * @return {undefined}
+     */
+    bind = function (el, event, fn) {
+      if (typeof el.addEventListener === "function") {
+        el.addEventListener(event, fn, false);
+      } else if (el.attachEvent) {
+        el.attachEvent("on" + event, fn);
+      }
+    };
+
+    /**
+     * Unbind events to elements
+     * 
+     * @param  {Object}   el       HTML Object
+     * @param  {Event}    event    Event to detach to element
+     * @param  {Function} fn       Callback function
+     * 
+     * @return {undefined}
+     */
+    unbind = function (el, event, fn) {
+      if (typeof el.removeEventListener === "function") {
+        el.removeEventListener(event, fn, false);
+      } else if (el.detachEvent) {
+        el.detachEvent("on" + event, fn);
+      }
+    };
+
+    /**
+     * Build the proper message box
+     * 
+     * @param  {Object} item    Current object in the queue
+     * @return {String}         An HTML string of the message box
+     */
+    build = function (item) {
+      var html    = "",
+          type    = item.type,
+          message = item.message;
+
+      html += "<div class=\"alertify-dialog\">";
+      html += "<article class=\"alertify-inner\">";
+      html += dialogs.message.replace("{{message}}", message);
+
+      if (type === "prompt") { html += dialogs.input; }
+
+      html += dialogs.buttons.holder;
+      html += "</article>";
+      html += "</div>";
+
+      switch (type) {
+      case "confirm":
+      case "prompt":
+        html = html.replace("{{buttons}}", dialogs.buttons.cancel + dialogs.buttons.ok);
+        html = html.replace("{{ok}}", labels.ok).replace("{{cancel}}", labels.cancel);
+        break;
+      case "alert":
+        html = html.replace("{{buttons}}", dialogs.buttons.ok);
+        html = html.replace("{{ok}}", labels.ok);
+        break;
+      default:
+        break;
+      }
+
+      element.className = "alertify alertify-show alertify-" + type;
+      cover.className   = "alertify-cover";
+      return html;
+    };
+
+    /**
+     * Close the log messages
+     * 
+     * @return {undefined}
+     */
+    close = function () {
+      setTimeout(function () {
+        var child = logElement.childNodes[logElement.childNodes.length - 1];
+        if (typeof child !== "undefined") logElement.removeChild(child);
+      }, delay);
+    };
+
+    /**
+     * Extend the log method to create custom methods
+     * 
+     * @param  {String} type    Custom method name
+     * @return {Function}
+     */
+    extend = function (type) {
+      return function (message) { log(message, type); };
+    };
+
+    /**
+     * Add new log message
+     * If a type is passed, a class name "alertify-log-{type}" will get added.
+     * This allows for custom look and feel for various types of notifications.
+     * 
+     * @param  {String} message    The message passed from the callee
+     * @param  {String} type       [Optional] Type of log message
+     * 
+     * @return {undefined}
+     */
+    notify = function (message, type) {
+      var log = document.createElement("article");
+      log.className = "alertify-log" + ((typeof type === "string" && type !== "") ? " alertify-log-" + type : "");
+      log.innerHTML = message;
+      // prepend child
+      logElement.insertBefore(log, logElement.firstChild);
+      // triggers the CSS animation
+      setTimeout(function() { log.className = log.className + " alertify-log-show"; }, 50);
+      close();
+    };
+
+    /**
+     * Hide the dialog and rest to defaults
+     *
+     * @return {undefined}
+     */
+    hide = function () {
+      // remove reference from queue
+      queue.splice(0,1);
+      // if items remaining in the queue
+      if (queue.length > 0) setup();
+      else {
+        isopen = false;
+        element.className = "alertify alertify-hide alertify-hidden";
+        cover.className   = "alertify-cover alertify-hidden";
+      }
+    };
+
+    /**
+     * Initiate all the required pieces for the dialog box
+     *
+     * @return {undefined}
+     */
+    setup = function () {
+      var item = queue[0];
+
+      isopen = true;
+      element.innerHTML = build(item);
+      addListeners(item.callback);
+    };
+
+    /**
+     * Create an alert dialog box
+     * 
+     * @param  {String}   message    The message passed from the callee
+     * @param  {Function} fn         [Optional] Callback function
+     * 
+     * @return {Object}
+     */
+    alert = function (message, fn) {
+      queue.push({ type: "alert", message: message, callback: fn });
+      if (!isopen) setup();
+
+      return this;
+    };
+
+    /**
+     * Create a confirm dialog box
+     * 
+     * @param  {String}   message    The message passed from the callee
+     * @param  {Function} fn         [Optional] Callback function
+     * 
+     * @return {Object}
+     */
+    confirm = function (message, fn) {
+      queue.push({ type: "confirm", message: message, callback: fn });
+      if (!isopen) setup();
+      
+      return this;
+    };
+
+    /**
+     * Show a new log message box
+     * 
+     * @param  {String} message    The message passed from the callee
+     * @param  {String} type       [Optional] Optional type of log message
+     * 
+     * @return {Object}
+     */
+    log = function (message, type) {
+      notify(message, type);
+      return this;
+    };
+
+    /**
+     * Create a prompt dialog box
+     * 
+     * @param  {String}   message    The message passed from the function
+     * @param  {Function} fn         [Optional] Callback function
+     * 
+     * @return {Object}
+     */
+    prompt = function (message, fn) {
+      queue.push({ type: "prompt", message: message, callback: fn });
+      if (!isopen) setup();
+
+      return this;
+    };
+
+    // Bootstrap
+    init();
+
+    return {
+      alert   : alert,
+      confirm : confirm,
+      log     : log,
+      prompt  : prompt,
+      success : function (message) { log(message, "success"); },
+      error   : function (message) { log(message, "error"); },
+      extend  : extend,
+
+      labels  : labels,
+      delay   : delay
+    };
+  };
+
+/*
+ * Trigger DOMContentLoaded function when DOM is ready
+ */
+if (window.addEventListener) { // W3C standard
+  window.addEventListener('load', DOMContentLoaded, false);
+} else if (window.attachEvent) { // Microsoft
+  window.attachEvent('onload', DOMContentLoaded);
+};
+
+})( window );

data/vendor/assets/stylesheets/alertify.css

@@ -0,0 +1,155 @@
+.alertify-show,
+.alertify-log {
+	-webkit-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1); /* older webkit */
+	-webkit-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
+	   -moz-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
+	    -ms-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
+	     -o-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
+	        transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); /* easeOutBack */
+}
+.alertify-hide {
+	-webkit-transition: all 250ms cubic-bezier(0.600, 0, 0.735, 0.045); /* older webkit */
+	-webkit-transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045); 
+	   -moz-transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045); 
+	    -ms-transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045); 
+	     -o-transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045); 
+	        transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045); /* easeInBack */
+}
+.alertify-cover {
+	position: fixed; z-index: 99999;
+	top: 0; right: 0; bottom: 0; left: 0;
+}
+.alertify {
+	position: fixed; z-index: 99999;
+	top: 50px; left: 50%;
+	width: 550px;
+	margin-left: -275px;
+}
+	.alertify-hidden { 
+		top: -50px;
+		visibility: hidden;
+	}
+.alertify-logs {
+	position: fixed;
+	z-index: 5000;
+	bottom: 10px;
+	right: 10px;
+	width: 300px;
+}
+	.alertify-log {
+		display: block;
+		margin-top: 10px;
+		position: relative;
+		right: -300px;
+	}
+	.alertify-log-show {
+		right: 0;
+	}
+	.alertify-dialog {
+		padding: 25px;
+	}
+		.alertify-inner {
+			text-align: center;
+		}
+		.alertify-text {
+			margin-bottom: 15px;
+			width: 100%;
+			-webkit-box-sizing: border-box;
+			   -moz-box-sizing: border-box;
+			        box-sizing: border-box;
+			font-size: 100%;
+		}
+		.alertify-buttons {
+		}
+			.alertify-button {
+				display: inline-block;
+				cursor: pointer;
+				margin-left: 5px;
+			}
+
+@media only screen and (max-width: 680px) {
+	.alertify,
+	.alertify-logs {
+		width: 90%;
+		-webkit-box-sizing: border-box;
+		   -moz-box-sizing: border-box;
+		        box-sizing: border-box;
+	}
+	.alertify {
+		left: 5%;
+		margin: 0;
+	}
+}
+
+/**
+ * Default Look and Feel
+ */
+.alertify,
+.alertify-log {
+	font-family: sans-serif;
+}
+.alertify {
+	background: #FFF;
+	border: 10px solid #333; /* browsers that don't support rgba */
+	border: 10px solid rgba(0,0,0,.7);
+	border-radius: 8px;
+	box-shadow: 0 3px 3px rgba(0,0,0,.3);
+	-webkit-background-clip: padding;     /* Safari 4? Chrome 6? */
+	   -moz-background-clip: padding;     /* Firefox 3.6 */
+	        background-clip: padding-box; /* Firefox 4, Safari 5, Opera 10, IE 9 */
+}
+.alertify-text {
+	border: 1px solid #CCC;
+	padding: 10px;
+	border-radius: 4px;
+}
+.alertify-button {
+	border-radius: 4px;
+	color: #FFF;
+	font-weight: bold;
+	padding: 6px 15px;
+	text-decoration: none;
+	text-shadow: 1px 1px 0 rgba(0,0,0,.5);
+	box-shadow: inset 0 1px 0 0 rgba(255,255,255,.5);
+	background-image: -webkit-linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
+	background-image:    -moz-linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
+	background-image:     -ms-linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
+	background-image:      -o-linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
+	background-image:         linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
+}
+.alertify-button:hover,
+.alertify-button:focus {
+	background-image: -webkit-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
+	background-image:    -moz-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
+	background-image:     -ms-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
+	background-image:      -o-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
+	background-image:         linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
+}
+.alertify-button:active {
+	position: relative;
+	top: 1px;
+}
+	.alertify-button-cancel {
+		background-color: #FE1A00;
+		border: 1px solid #D83526;
+	}
+	.alertify-button-ok {
+		background-color: #5CB811;
+		border: 1px solid #3b7808;
+	}
+.alertify-log {
+	background: #1F1F1F;
+	background: rgba(0,0,0,.9);
+	padding: 15px;
+	border-radius: 4px;
+	color: #FFF;
+	text-shadow: -1px -1px 0 rgba(0,0,0,.5);
+}
+	.alertify-log-error {
+		background: #FE1A00;
+		background: rgba(254,26,0,.9);
+	}
+	.alertify-log-success {
+		background: #5CB811;
+		background: rgba(92,184,17,.9);
+	}

metadata

@@ -0,0 +1,56 @@
+--- !ruby/object:Gem::Specification
+name: alertify-rails
+version: !ruby/object:Gem::Version
+  version: 0.0.1
+  prerelease: 
+platform: ruby
+authors:
+- Rudolf Schmidt
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2012-11-29 00:00:00.000000000 Z
+dependencies: []
+description: Use Alertify.js with Rails 3
+email: 
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- .gitignore
+- Gemfile
+- LICENSE.txt
+- README.md
+- Rakefile
+- alertify-rails.gemspec
+- lib/alertify-rails.rb
+- lib/alertify/engine.rb
+- lib/alertify/railtie.rb
+- lib/alertify/version.rb
+- vendor/assets/javascripts/alertify.js
+- vendor/assets/stylesheets/alertify.css
+homepage: ''
+licenses: []
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 1.8.24
+signing_key: 
+specification_version: 3
+summary: This gem provides the Alertify.js deiver for Rails 3 applications
+test_files: []