droom 0.0.1 → 0.2.1

data/app/assets/javascripts/droom/ajax.js.coffee

@@ -0,0 +1,84 @@
+## Ajax transport
+#
+# We extend the standard rails jquery-ujs method with a standard response and failure handler. All our
+# remote operations are channelled through this class and use callbacks to affect the page during and 
+# after the request.
+#
+# This isn't very clever or complicated but it gives us a standard channel that handles requests in a 
+# consistent way. It applies a PJAX header and defines a simple callback interface that makes the rest 
+# of our code more readable. In most cases it also allows us to omit the [data-remote] and [data-type] 
+# attributes from links.
+#
+# ### Callbacks
+#
+# * *on_prepare* is called when the remote control is first created. No arguments.
+# * *on_request* is called before the remote call. Arguments: [xhr]
+# * *on_error* is called if the server returns an error. Arguments: [xhr]
+# * *on_success* is called if the request is successful. Arguments: [response]
+# * *on_complete* is called after the request, whether successful or not. Arguments: [status]
+#
+jQuery ($) ->
+
+  $.fn.remote = (opts) ->
+    @each ->
+      new Remote @, opts
+  
+  $.fn.silent = (opts) ->
+    @each ->
+      
+      new Remote
+
+  class Remote
+    constructor: (element, opts) ->
+      @_control = $(element)
+      @_options = $.extend {}, opts
+      @_control.attr('data-remote', true)
+      @_control.attr('data-type', 'html')
+      @_control.on 'ajax:beforeSend', @pend
+      @_control.on 'ajax:error', @fail
+      @_control.on 'ajax:success', @receive
+      @activate()
+        
+    activate: () => 
+      @_control.find('a.cancel').click @cancel
+      @_options.on_prepare?()
+
+    pend: (event, xhr, settings) =>
+      event.stopPropagation()
+      event.preventDefault()
+      xhr.setRequestHeader('X-PJAX', 'true')
+      @_control.addClass('waiting')
+      @_options.on_request?(xhr)
+
+    fail: (event, xhr, status) =>
+      event.stopPropagation()
+      @_control.removeClass('waiting').addClass('erratic')
+      @_options.on_error?(xhr)
+      @_options.on_complete?(status)
+  
+    # Note that there is no special provision here for a server side failure that results in a success response:
+    # eg if validation fails and we get the form back again, this Remote will be considered successful and disappear.
+    # In that case the function which triggered the remote operation is expected to do the right thing with the 
+    # returned html. Usually in that kind of situation you'd be using a popup, which checks for a returned form and
+    # treats it as another iteration within the same window.
+    #
+    receive: (event, response, status) =>
+      event.stopPropagation()
+      @_control.removeClass('waiting')
+      @_options.on_success?(response)
+      @_options.on_complete?(status)
+        
+    cancel: (e) =>
+      e.preventDefault() if e
+      @_options.on_cancel?()
+      @_form?.remove()
+
+
+  
+
+
+
+
+
+
+

data/app/assets/javascripts/droom/{lib/extensions.js.coffee → extensions.js.coffee}

@@ -1,43 +1,49 @@
 # Return the last item in an array.
 
-unless Array.prototype.last?
-  Array.prototype.last = () ->
+unless Array::last?
+  Array::last = () ->
     @[@.length - 1]
 
 # Return the first item in an array.
 
-unless Array.prototype.first?
-  Array.prototype.first = () ->
+unless Array::first?
+  Array::first = () ->
     @[0]
 
 # Return the (mathematically) greatest item in an array.
 
-unless Array.prototype.max?
-  Array.prototype.max = () ->
+unless Array::max?
+  Array::max = () ->
     Math.max.apply Math, this      
 
 # Return the (mathematically) least item in an array.
 
-unless Array.prototype.min?
-  Array.prototype.min = () ->
+unless Array::min?
+  Array::min = () ->
     Math.min.apply Math, this
 
 # Return true if this array contains any items
 
-unless Array.prototype.any?
-  Array.prototype.any = ()->
+unless Array::any?
+  Array::any = ()->
     @length > 0
 
 # Return true unless this array contains any items
 
-unless Array.prototype.empty?
-  Array.prototype.empty = ()->
+unless Array::empty?
+  Array::empty = ()->
     @length == 0
 
+# Removes one instance of the supplied thing from an array
+
+unless Array::remove?
+  Array::remove = (thing)->
+    @splice(@indexOf(thing), 1)
+
 # Return this array as a sentence in the form "x, y and z".
 
-unless Array.prototype.toSentence?
-  Array.prototype.toSentence = ()->
+unless Array::toSentence?
+  Array::toSentence = ()->
     @join(", ").replace(/,\s([^,]+)$/, ' and $1')
 
 # Truncate a string to the specified number of characters. Add an ellipsis if shortening actually happens.
@@ -57,4 +63,5 @@ unless String::truncate?
 
 unless String::trim?
   String::trim = (length, separator, ellipsis)->
-    String(@).replace(/^\s+|\s+$/g, '')
+    String(@).replace(/^\s+|\s+$/g, '')
+    

data/app/assets/javascripts/droom/lib/ZeroClipboard.js

@@ -0,0 +1,334 @@
+// Simple Set Clipboard System
+// Author: Joseph Huckaby
+
+window.ZeroClipboard = {
+
+  version: "1.0.8",
+  clients: {}, // registered upload clients on page, indexed by id
+  moviePath: 'ZeroClipboard.swf', // URL to movie
+  nextId: 1, // ID of next movie
+
+  $: function(thingy) {
+    // simple DOM lookup utility function
+    if (typeof(thingy) == 'string') thingy = document.getElementById(thingy);
+    if (!thingy.addClass) {
+      // extend element with a few useful methods
+      thingy.hide = function() { this.style.display = 'none'; };
+      thingy.show = function() { this.style.display = ''; };
+      thingy.addClass = function(name) { this.removeClass(name); this.className += ' ' + name; };
+      thingy.removeClass = function(name) {
+        var classes = this.className.split(/\s+/);
+        var idx = -1;
+        for (var k = 0; k < classes.length; k++) {
+          if (classes[k] == name) { idx = k; k = classes.length; }
+        }
+        if (idx > -1) {
+          classes.splice( idx, 1 );
+          this.className = classes.join(' ');
+        }
+        return this;
+      };
+      thingy.hasClass = function(name) {
+        return !!this.className.match( new RegExp("\\s*" + name + "\\s*") );
+      };
+    }
+    return thingy;
+  },
+
+  setMoviePath: function(path) {
+    // set path to ZeroClipboard.swf
+    this.moviePath = path;
+  },
+
+  // use this method in JSNI calls to obtain a new Client instance
+  newClient: function() {
+    return new ZeroClipboard.Client();
+  },
+
+  dispatch: function(id, eventName, args) {
+    // receive event from flash movie, send to client
+    var client = this.clients[id];
+    if (client) {
+      client.receiveEvent(eventName, args);
+    }
+  },
+
+  register: function(id, client) {
+    // register new client to receive events
+    this.clients[id] = client;
+  },
+
+  getDOMObjectPosition: function(obj, stopObj) {
+    // get absolute coordinates for dom element
+    var info = {
+      left: 0,
+      top: 0,
+      width: obj.width ? obj.width : obj.offsetWidth,
+      height: obj.height ? obj.height : obj.offsetHeight
+    };
+
+    while (obj && (obj != stopObj)) {
+      info.left += obj.offsetLeft;
+      info.left += obj.style.borderLeftWidth ? parseInt(obj.style.borderLeftWidth) : 0;
+      info.top += obj.offsetTop;
+      info.top += obj.style.borderTopWidth ? parseInt(obj.style.borderTopWidth) : 0;
+      obj = obj.offsetParent;
+    }
+
+    return info;
+  },
+
+  Client: function(elem) {
+    // constructor for new simple upload client
+    this.handlers = {};
+
+    // unique ID
+    this.id = ZeroClipboard.nextId++;
+    this.movieId = 'ZeroClipboardMovie_' + this.id;
+
+    // register client with singleton to receive flash events
+    ZeroClipboard.register(this.id, this);
+
+    // create movie
+    if (elem) this.glue(elem);
+  }
+};
+
+ZeroClipboard.Client.prototype = {
+
+  id: 0, // unique ID for us
+  title: "",  // tooltip for the flash element
+  ready: false, // whether movie is ready to receive events or not
+  movie: null, // reference to movie object
+  clipText: '', // text to copy to clipboard
+  handCursorEnabled: true, // whether to show hand cursor, or default pointer cursor
+  cssEffects: true, // enable CSS mouse effects on dom container
+  handlers: null, // user event handlers
+  zIndex: 99, // default zIndex of the movie object
+
+  glue: function(elem, appendElem, stylesToAdd) {
+    // glue to DOM element
+    // elem can be ID or actual DOM element object
+    this.domElement = ZeroClipboard.$(elem);
+
+    // float just above object, or default zIndex if dom element isn't set
+    if (this.domElement.style.zIndex) {
+      this.zIndex = parseInt(this.domElement.style.zIndex, 10) + 1;
+    }
+
+    // check if the element has a title
+    if (this.domElement.getAttribute("title") != null) {
+      this.title = this.domElement.getAttribute("title");
+    }
+
+    if (typeof(appendElem) == 'string') {
+      appendElem = ZeroClipboard.$(appendElem);
+    }
+    else if (typeof(appendElem) == 'undefined') {
+      appendElem = document.getElementsByTagName('body')[0];
+    }
+
+    // find X/Y position of domElement
+    var box = ZeroClipboard.getDOMObjectPosition(this.domElement, appendElem);
+
+    // create floating DIV above element
+    this.div = document.createElement('div');
+    var style = this.div.style;
+    style.position = 'absolute';
+    style.left = '' + box.left + 'px';
+    style.top = '' + box.top + 'px';
+    style.width = '' + box.width + 'px';
+    style.height = '' + box.height + 'px';
+    style.zIndex = this.zIndex;
+
+    if (typeof(stylesToAdd) == 'object') {
+      for (var addedStyle in stylesToAdd) {
+        style[addedStyle] = stylesToAdd[addedStyle];
+      }
+    }
+
+    // style.backgroundColor = '#f00'; // debug
+
+    appendElem.appendChild(this.div);
+
+    this.div.innerHTML = this.getHTML( box.width, box.height );
+  },
+
+  getHTML: function(width, height) {
+    // return HTML for movie
+    var html = '';
+    var flashvars = 'id=' + this.id +
+      '&width=' + width +
+      '&height=' + height,
+            title = this.title ? ' title="' + this.title + '"' : '';
+
+    if (navigator.userAgent.match(/MSIE/)) {
+      // IE gets an OBJECT tag
+      var protocol = location.href.match(/^https/i) ? 'https://' : 'http://';
+      html += '<object' + title + ' classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="'+protocol+'download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="'+width+'" height="'+height+'" id="'+this.movieId+'"><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="false" /><param name="movie" value="'+ZeroClipboard.moviePath+'" /><param name="loop" value="false" /><param name="menu" value="false" /><param name="quality" value="best" /><param name="bgcolor" value="#ffffff" /><param name="flashvars" value="'+flashvars+'"/><param name="wmode" value="transparent"/></object>';
+    }
+    else {
+      // all other browsers get an EMBED tag
+      html += '<embed' + title + ' id="'+this.movieId+'" src="'+ZeroClipboard.moviePath+'" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="'+width+'" height="'+height+'" name="'+this.movieId+'" allowScriptAccess="always" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="'+flashvars+'" wmode="transparent" />';
+    }
+    return html;
+  },
+
+  hide: function() {
+    // temporarily hide floater offscreen
+    if (this.div) {
+      this.div.style.left = '-2000px';
+    }
+  },
+
+  show: function() {
+    // show ourselves after a call to hide()
+    this.reposition();
+  },
+
+  destroy: function() {
+    // destroy control and floater
+    if (this.domElement && this.div) {
+      this.hide();
+      this.div.innerHTML = '';
+
+      var body = document.getElementsByTagName('body')[0];
+      try { body.removeChild( this.div ); } catch(e) {}
+
+      this.domElement = null;
+      this.div = null;
+    }
+  },
+
+  reposition: function(elem) {
+    // reposition our floating div, optionally to new container
+    // warning: container CANNOT change size, only position
+    if (elem) {
+      this.domElement = ZeroClipboard.$(elem);
+      if (!this.domElement) this.hide();
+    }
+
+    if (this.domElement && this.div) {
+      var box = ZeroClipboard.getDOMObjectPosition(this.domElement);
+      var style = this.div.style;
+      style.left = '' + box.left + 'px';
+      style.top = '' + box.top + 'px';
+    }
+  },
+
+  setText: function(newText) {
+    // set text to be copied to clipboard
+    this.clipText = newText;
+    if (this.ready) this.movie.setText(newText);
+  },
+
+  setTitle: function(newTitle) {
+    // set title of flash element
+    this.title = newTitle;
+  },
+
+  addEventListener: function(eventName, func) {
+    // add user event listener for event
+    // event types: load, queueStart, fileStart, fileComplete, queueComplete, progress, error, cancel
+    eventName = eventName.toString().toLowerCase().replace(/^on/, '');
+    if (!this.handlers[eventName]) this.handlers[eventName] = [];
+    this.handlers[eventName].push(func);
+  },
+
+  setHandCursor: function(enabled) {
+    // enable hand cursor (true), or default arrow cursor (false)
+    this.handCursorEnabled = enabled;
+    if (this.ready) this.movie.setHandCursor(enabled);
+  },
+
+  setCSSEffects: function(enabled) {
+    // enable or disable CSS effects on DOM container
+    this.cssEffects = !!enabled;
+  },
+
+  receiveEvent: function(eventName, args) {
+    // receive event from flash
+    eventName = eventName.toString().toLowerCase().replace(/^on/, '');
+
+    // special behavior for certain events
+    switch (eventName) {
+      case 'load':
+        // movie claims it is ready, but in IE this isn't always the case...
+        // bug fix: Cannot extend EMBED DOM elements in Firefox, must use traditional function
+        this.movie = document.getElementById(this.movieId);
+        if (!this.movie) {
+          var self = this;
+          setTimeout( function() { self.receiveEvent('load', null); }, 1 );
+          return;
+        }
+
+        // firefox on pc needs a "kick" in order to set these in certain cases
+        if (!this.ready && navigator.userAgent.match(/Firefox/) && navigator.userAgent.match(/Windows/)) {
+          var self = this;
+          setTimeout( function() { self.receiveEvent('load', null); }, 100 );
+          this.ready = true;
+          return;
+        }
+
+        this.ready = true;
+        this.movie.setText( this.clipText );
+        this.movie.setHandCursor( this.handCursorEnabled );
+        break;
+
+      case 'mouseover':
+        if (this.domElement && this.cssEffects) {
+          this.domElement.addClass('hover');
+          if (this.recoverActive) this.domElement.addClass('active');
+        }
+        break;
+
+      case 'mouseout':
+        if (this.domElement && this.cssEffects) {
+          this.recoverActive = false;
+          if (this.domElement.hasClass('active')) {
+            this.domElement.removeClass('active');
+            this.recoverActive = true;
+          }
+          this.domElement.removeClass('hover');
+        }
+        break;
+
+      case 'mousedown':
+        if (this.domElement && this.cssEffects) {
+          this.domElement.addClass('active');
+        }
+        break;
+
+      case 'mouseup':
+        if (this.domElement && this.cssEffects) {
+          this.domElement.removeClass('active');
+          this.recoverActive = false;
+        }
+        break;
+    } // switch eventName
+
+    if (this.handlers[eventName]) {
+      for (var idx = 0, len = this.handlers[eventName].length; idx < len; idx++) {
+        var func = this.handlers[eventName][idx];
+
+        if (typeof(func) == 'function') {
+          // actual function reference
+          func(this, args);
+        }
+        else if ((typeof(func) == 'object') && (func.length == 2)) {
+          // PHP style object + method, i.e. [myObject, 'myMethod']
+          func[0][ func[1] ](this, args);
+        }
+        else if (typeof(func) == 'string') {
+          // name of function
+          window[func](this, args);
+        }
+      } // foreach event handler defined
+    } // user defined handler for event
+  }
+
+};
+
+if (typeof module !== "undefined") {
+  module.exports = ZeroClipboard;
+}