puffer 0.0.5 → 0.0.6

data/lib/generators/puffer/install/templates/puffer/javascripts/rails.js

@@ -1,175 +1,14 @@
-(function() {
-  // Technique from Juriy Zaytsev
-  // http://thinkweb2.com/projects/prototype/detecting-event-support-without-browser-sniffing/
-  function isEventSupported(eventName) {
-    var el = document.createElement('div');
-    eventName = 'on' + eventName;
-    var isSupported = (eventName in el);
-    if (!isSupported) {
-      el.setAttribute(eventName, 'return;');
-      isSupported = typeof el[eventName] == 'function';
-    }
-    el = null;
-    return isSupported;
-  }
-
-  function isForm(element) {
-    return Object.isElement(element) && element.nodeName.toUpperCase() == 'FORM'
-  }
-
-  function isInput(element) {
-    if (Object.isElement(element)) {
-      var name = element.nodeName.toUpperCase()
-      return name == 'INPUT' || name == 'SELECT' || name == 'TEXTAREA'
-    }
-    else return false
-  }
-
-  var submitBubbles = isEventSupported('submit'),
-      changeBubbles = isEventSupported('change')
-
-  if (!submitBubbles || !changeBubbles) {
-    // augment the Event.Handler class to observe custom events when needed
-    Event.Handler.prototype.initialize = Event.Handler.prototype.initialize.wrap(
-      function(init, element, eventName, selector, callback) {
-        init(element, eventName, selector, callback)
-        // is the handler being attached to an element that doesn't support this event?
-        if ( (!submitBubbles && this.eventName == 'submit' && !isForm(this.element)) ||
-             (!changeBubbles && this.eventName == 'change' && !isInput(this.element)) ) {
-          // "submit" => "emulated:submit"
-          this.eventName = 'emulated:' + this.eventName
-        }
-      }
-    )
-  }
-
-  if (!submitBubbles) {
-    // discover forms on the page by observing focus events which always bubble
-    document.on('focusin', 'form', function(focusEvent, form) {
-      // special handler for the real "submit" event (one-time operation)
-      if (!form.retrieve('emulated:submit')) {
-        form.on('submit', function(submitEvent) {
-          var emulated = form.fire('emulated:submit', submitEvent, true)
-          // if custom event received preventDefault, cancel the real one too
-          if (emulated.returnValue === false) submitEvent.preventDefault()
-        })
-        form.store('emulated:submit', true)
-      }
-    })
-  }
-
-  if (!changeBubbles) {
-    // discover form inputs on the page
-    document.on('focusin', 'input, select, texarea', function(focusEvent, input) {
-      // special handler for real "change" events
-      if (!input.retrieve('emulated:change')) {
-        input.on('change', function(changeEvent) {
-          input.fire('emulated:change', changeEvent, true)
-        })
-        input.store('emulated:change', true)
-      }
-    })
-  }
-
-  function handleRemote(element) {
-    var method, url, params;
-
-    var event = element.fire("ajax:before");
-    if (event.stopped) return false;
-
-    if (element.tagName.toLowerCase() === 'form') {
-      method = element.readAttribute('method') || 'post';
-      url    = element.readAttribute('action');
-      params = element.serialize();
-    } else {
-      method = element.readAttribute('data-method') || 'get';
-      url    = element.readAttribute('href');
-      params = {};
-    }
-
-    new Ajax.Request(url, {
-      method: method,
-      parameters: params,
-      evalScripts: true,
-
-      onComplete:    function(request) { element.fire("ajax:complete", request); },
-      onSuccess:     function(request) { element.fire("ajax:success",  request); },
-      onFailure:     function(request) { element.fire("ajax:failure",  request); }
-    });
-
-    element.fire("ajax:after");
-  }
-
-  function handleMethod(element) {
-    var method = element.readAttribute('data-method'),
-        url = element.readAttribute('href'),
-        csrf_param = $$('meta[name=csrf-param]')[0],
-        csrf_token = $$('meta[name=csrf-token]')[0];
-
-    var form = new Element('form', { method: "POST", action: url, style: "display: none;" });
-    element.parentNode.insert(form);
-
-    if (method !== 'post') {
-      var field = new Element('input', { type: 'hidden', name: '_method', value: method });
-      form.insert(field);
-    }
-
-    if (csrf_param) {
-      var param = csrf_param.readAttribute('content'),
-          token = csrf_token.readAttribute('content'),
-          field = new Element('input', { type: 'hidden', name: param, value: token });
-      form.insert(field);
-    }
-
-    form.submit();
-  }
-
-
-  document.on("click", "*[data-confirm]", function(event, element) {
-    var message = element.readAttribute('data-confirm');
-    if (!confirm(message)) event.stop();
-  });
-
-  document.on("click", "a[data-remote]", function(event, element) {
-    if (event.stopped) return;
-    handleRemote(element);
-    event.stop();
-  });
-
-  document.on("click", "a[data-method]", function(event, element) {
-    if (event.stopped) return;
-    handleMethod(element);
-    event.stop();
-  });
-
-  document.on("submit", function(event) {
-    var element = event.findElement(),
-        message = element.readAttribute('data-confirm');
-    if (message && !confirm(message)) {
-      event.stop();
-      return false;
-    }
-
-    var inputs = element.select("input[type=submit][data-disable-with]");
-    inputs.each(function(input) {
-      input.disabled = true;
-      input.writeAttribute('data-original-value', input.value);
-      input.value = input.readAttribute('data-disable-with');
-    });
-
-    var element = event.findElement("form[data-remote]");
-    if (element) {
-      handleRemote(element);
-      event.stop();
-    }
-  });
-
-  document.on("ajax:after", "form", function(event, element) {
-    var inputs = element.select("input[type=submit][disabled=true][data-disable-with]");
-    inputs.each(function(input) {
-      input.value = input.readAttribute('data-original-value');
-      input.removeAttribute('data-original-value');
-      input.disabled = false;
-    });
-  });
-})();
+/**
+ * The Ruby On Rails plugin for RightJS
+ * http://github.com/MadRabbit/right-rails
+ *
+ * Copyright (C) 2009-2010 Nikolay Nemshilov
+ */
+(function(i,j,e){var f=e.$,l=e.$$,o=e.$E,m=e.Xhr,p=e.Object;e([e.String.prototype,e.Array.prototype,e.Function.prototype,e.Object,e.Options,e.Observer,e.Observer.prototype,i,j]).each(function(a){for(var b in a)try{if(/[A-Z]/.test(b)&&typeof a[b]==="function"){var c=e(b).underscored();if(a[c]===null||a[c]===undefined)a[c]=a[b]}}catch(d){}});e([e.Element,e.Event,e.Form,e.Input]).each(function(a){if(a){var b=a.prototype;for(var c in b)if(/[A-Z]/.test(c)&&typeof b[c]==="function")a.prototype[e(c).underscored()]=
+b[c]}});e.$alias(e.String.prototype,{index_of:"indexOf",last_index_of:"lastIndexOf",to_f:"toFloat",to_i:"toInt",gsub:"replace",downcase:"toLowerCase",upcase:"toUpperCase",index:"indexOf",rindex:"lastIndexOf",strip:"trim"});e.$alias(e.Array.prototype,{collect:"map",detect:"filter",index_of:"indexOf",last_index_of:"lastIndexOf",index:"indexOf",rindex:"lastIndexOf"});(function(){var a=function(c,d){var g=d.get("data-confirm");if(g&&!confirm(g)){c.stop();return true}},b=function(c,d){return p.merge({onCreate:function(){c.fire("ajax:loading",
+this)},onComplete:function(){c.fire("ajax:complete",this)},onSuccess:function(){c.fire("ajax:success",this)},onFailure:function(){c.fire("ajax:failure",this)}},d)};f(j).on({click:function(c){var d=c.target._.tagName;if(d==="A"||d==="BUTTON"){var g=c.target;d=g.get("data-method");var n=g.get("data-remote"),h=g.get("href");if(!a(c,g)){if(d||n)c.stop();if(n)m.load(h,b(g,{method:d||"get",spinner:g.get("data-spinner")}));else if(d){c=l("meta[name=csrf-param]")[0];g=l("meta[name=csrf-token]")[0];h=o("form",
+{action:h,method:"post"});c&&g&&h.insert('<input type="hidden" name="'+c.get("content")+'" value="'+g.get("content")+'" />');h.insert('<input type="hidden" name="_method" value="'+d+'"/>').insertTo(j.body).submit()}}}},submit:function(c){var d=c.target;if(d.has("data-remote")&&!a(c,d)){c.stop();d.send(b(d,{spinner:d.get("data-spinner")||d.first(".spinner")}))}}})})();var k={Options:{format:"js",flashId:"flashes",flashHideFx:"slide",flashHideDelay:3200,highlightUpdates:true,removeFx:"fade",insertFx:"fade",
+insertPosition:"bottom",linkToAjaxEdit:".ajax_edit",linkToAjaxDelete:".ajax_delete",rescanWithScopes:true},update_flash:function(a){var b=f(this.Options.flashId);b&&this.replace(b,a).hide_flash();return this},hide_flash:function(){if(this.Options.flashHideDelay>-1){var a=f(this.Options.flashId);a&&a.visible()&&a.hide.bind(a,this.Options.flashHideFx).delay(this.Options.flashHideDelay)}return this},highlight:function(a){f(a)&&this.Options.highlightUpdates&&f(a).highlight();return this},insert:function(a,
+b,c){c=c||this.Options.insertPosition;var d;b=f(a).insert(b,c);switch(c){case "bottom":d=b.children().last();break;case "top":d=b.first();break;case "before":d=b.prev();break;case "after":d=b.next();break}d&&this.Options.insertFx?d.hide().show(this.Options.insertFx,{onFinish:this.highlight.bind(this,d)}):this.highlight(d);return this.rescan(a)},replace:function(a,b){f(a).replace(b);return this.highlight(a).rescan(a)},remove:function(a){f(a)&&f(a).remove(this.Options.removeFx)},remotize_form:function(a){if(a=
+f(a))a.remotize().enable()._.action+="."+this.Options.format;return this},replace_form:function(a,b){var c=f(a);if(c){c.replace(b);this.remotize_form(a)}return this.rescan(a)},show_form_for:function(a,b){f(a).select("form").each("remove");f(a).insert(b);return this.remotize_form(f(a).first("form")).rescan(a)},process_click:function(a){var b;if(b=a.find("a"+this.Options.linkToAjaxEdit)){a.stop();m.load(b.get("href")+"."+this.Options.format)}else if((b=a.find("a"+this.Options.linkToAjaxDelete))&&b.has("onclick")){a.stop();
+eval("({f:"+b.onclick.toString().replace(".submit",".send")+"})").f.call(b)}},rescan:function(a){$w("Draggable Droppable Tabs Slider Selectable").each(function(b){if(b in i)i[b].rescan(this.Options.rescanWithScopes?a:null)},this);return this}};f(j).on({ready:function(){k.hide_flash()},click:function(a){k.process_click(a)}});i.RR=k})(window,document,RightJS);

data/lib/generators/puffer/install/templates/puffer/javascripts/right-calendar-src.js

@@ -0,0 +1,1461 @@
+/**
+ * The calendar widget implemented with RightJS
+ *
+ * Home page: http://rightjs.org/ui/calendar
+ *
+ * @copyright (C) 2009-2010 Nikolay Nemshilov
+ */
+var Calendar = RightJS.Calendar = (function(document, parseInt, RightJS) {
+/**
+ * This module defines the basic widgets constructor
+ * it creates an abstract proxy with the common functionality
+ * which then we reuse and override in the actual widgets
+ *
+ * Copyright (C) 2010-2011 Nikolay Nemshilov
+ */
+
+/**
+ * The filenames to include
+ *
+ * Copyright (C) 2010-2011 Nikolay Nemshilov
+ */
+
+var R          = RightJS,
+    $          = RightJS.$,
+    $$         = RightJS.$$,
+    $w         = RightJS.$w,
+    $ext       = RightJS.$ext,
+    $uid       = RightJS.$uid,
+    isString   = RightJS.isString,
+    isArray    = RightJS.isArray,
+    isFunction = RightJS.isFunction,
+    Class      = RightJS.Class,
+    Element    = RightJS.Element,
+    Input      = RightJS.Input,
+    RegExp     = RightJS.RegExp,
+    Browser    = RightJS.Browser;
+
+
+
+
+
+
+
+
+
+/**
+ * The widget units constructor
+ *
+ * @param String tag-name or Object methods
+ * @param Object methods
+ * @return Widget wrapper
+ */
+function Widget(tag_name, methods) {
+  if (!methods) {
+    methods = tag_name;
+    tag_name = 'DIV';
+  }
+
+  /**
+   * An Abstract Widget Unit
+   *
+   * Copyright (C) 2010 Nikolay Nemshilov
+   */
+  var AbstractWidget = new RightJS.Class(RightJS.Element.Wrappers[tag_name] || RightJS.Element, {
+    /**
+     * The common constructor
+     *
+     * @param Object options
+     * @param String optional tag name
+     * @return void
+     */
+    initialize: function(key, options) {
+      this.key = key;
+      var args = [{'class': 'rui-' + key}];
+
+      // those two have different constructors
+      if (!(this instanceof RightJS.Input || this instanceof RightJS.Form)) {
+        args.unshift(tag_name);
+      }
+      this.$super.apply(this, args);
+
+      if (RightJS.isString(options)) {
+        options = RightJS.$(options);
+      }
+
+      // if the options is another element then
+      // try to dynamically rewrap it with our widget
+      if (options instanceof RightJS.Element) {
+        this._ = options._;
+        if ('$listeners' in options) {
+          options.$listeners = options.$listeners;
+        }
+        options = {};
+      }
+      this.setOptions(options, this);
+
+      return (RightJS.Wrapper.Cache[RightJS.$uid(this._)] = this);
+    },
+
+  // protected
+
+    /**
+     * Catches the options
+     *
+     * @param Object user-options
+     * @param Element element with contextual options
+     * @return void
+     */
+    setOptions: function(options, element) {
+      element = element || this;
+      RightJS.Options.setOptions.call(this,
+        RightJS.Object.merge(options, eval("("+(
+          element.get('data-'+ this.key) || '{}'
+        )+")"))
+      );
+      return this;
+    }
+  });
+
+  /**
+   * Creating the actual widget class
+   *
+   */
+  var Klass = new RightJS.Class(AbstractWidget, methods);
+
+  // creating the widget related shortcuts
+  RightJS.Observer.createShortcuts(Klass.prototype, Klass.EVENTS || []);
+
+  return Klass;
+}
+
+
+/**
+ * A shared button unit.
+ * NOTE: we use the DIV units instead of INPUTS
+ *       so those buttons didn't interfere with
+ *       the user's tab-index on his page
+ *
+ * Copyright (C) 2010-2011 Nikolay Nemshilov
+ */
+var Button = new RightJS.Class(RightJS.Element, {
+  /**
+   * Constructor
+   *
+   * @param String caption
+   * @param Object options
+   * @return void
+   */
+  initialize: function(caption, options) {
+    this.$super('div', options);
+    this._.innerHTML = caption;
+    this.addClass('rui-button');
+    this.on('selectstart', 'stopEvent');
+  },
+
+  /**
+   * Disasbles the button
+   *
+   * @return Button this
+   */
+  disable: function() {
+    return this.addClass('rui-button-disabled');
+  },
+
+  /**
+   * Enables the button
+   *
+   * @return Button this
+   */
+  enable: function() {
+    return this.removeClass('rui-button-disabled');
+  },
+
+  /**
+   * Checks if the button is disabled
+   *
+   * @return Button this
+   */
+  disabled: function() {
+    return this.hasClass('rui-button-disabled');
+  },
+
+  /**
+   * Checks if the button is enabled
+   *
+   * @return Button this
+   */
+  enabled: function() {
+    return !this.disabled();
+  },
+
+  /**
+   * Overloading the method, so it fired the events
+   * only when the button is active
+   *
+   * @return Button this
+   */
+  fire: function() {
+    if (this.enabled()) {
+      this.$super.apply(this, arguments);
+    }
+    return this;
+  }
+});
+
+
+/**
+ * A shared module that toggles a widget visibility status
+ * in a uniformed way according to the options settings
+ *
+ * Copyright (C) 2010-2011 Nikolay Nemshilov
+ */
+var Toggler = {
+  /**
+   * Shows the element
+   *
+   * @param String fx-name
+   * @param Object fx-options
+   * @return Element this
+   */
+  show: function(fx_name, fx_options) {
+    this.constructor.current = this;
+    return Toggler_toggle(this, 'show', fx_name, fx_options);
+  },
+
+  /**
+   * Hides the element
+   *
+   * @param String fx-name
+   * @param Object fx-options
+   * @return Element this
+   */
+  hide: function(fx_name, fx_options) {
+    this.constructor.current = null;
+    return Toggler_toggle(this, 'show', fx_name, fx_options);
+  },
+
+  /**
+   * Toggles the widget at the given element
+   *
+   * @param Element the related element
+   * @param String position right/bottom (bottom is the default)
+   * @param Boolean marker if the element should be resized to the element size
+   * @return Widget this
+   */
+  showAt: function(element, where, resize) {
+    this.hide(null).shownAt = element = RightJS.$(element);
+
+    // moves this element at the given one
+    Toggler_re_position.call(this, element, where, resize);
+
+    return this.show();
+  },
+
+  /**
+   * Toggles the widget at the given element
+   *
+   * @param Element the related element
+   * @param String position top/left/right/bottom (bottom is the default)
+   * @param Boolean marker if the element should be resized to the element size
+   * @return Widget this
+   */
+  toggleAt: function(element, where, resize) {
+    return this.hidden() ? this.showAt(element, where, resize) : this.hide();
+  }
+};
+
+
+/**
+ * toggles the element's state according to the current settings
+ *
+ * @param event String 'show' or 'hide' the event name
+ * @param String an optional fx-name
+ * @param Object an optional fx-options hash
+ * @return void
+ */
+function Toggler_toggle(element, event, fx_name, fx_options) {
+  if (RightJS.Fx) {
+    if (fx_name === undefined) {
+      fx_name = element.options.fxName;
+
+      if (fx_options === undefined) {
+        fx_options = {
+          duration: element.options.fxDuration,
+          onFinish: RightJS(element.fire).bind(element, event)
+        };
+
+        // hide on double time
+        if (event === 'hide') {
+          fx_options.duration = (RightJS.Fx.Durations[fx_options.duration] ||
+            fx_options.duration) / 2;
+        }
+      }
+    }
+  }
+
+  // manually trigger the event if no fx were specified
+  if (!RightJS.Fx || !fx_name) { element.fire(event); }
+
+  return element.$super(fx_name, fx_options);
+}
+
+/**
+ * Relatively positions the current element
+ * against the specified one
+ *
+ * NOTE: this function is called in a context
+ *       of another element
+ *
+ * @param Element the target element
+ * @param String position 'right' or 'bottom'
+ * @param Boolean if `true` then the element size will be adjusted
+ * @return void
+ */
+function Toggler_re_position(element, where, resize) {
+  var anchor = this.reAnchor || (this.reAnchor =
+        new RightJS.Element('div', {'class': 'rui-re-anchor'}))
+        .insert(this),
+
+      pos  = anchor.insertTo(element, 'after').position(),
+      dims = element.dimensions(), target = this,
+
+      border_top    = parseInt(element.getStyle('borderTopWidth')),
+      border_left   = parseInt(element.getStyle('borderLeftWidth')),
+      border_right  = parseInt(element.getStyle('borderRightWidth')),
+      border_bottom = parseInt(element.getStyle('borderBottomWidth')),
+
+      top    = dims.top    - pos.y       + border_top,
+      left   = dims.left   - pos.x       + border_left,
+      width  = dims.width  - border_left - border_right,
+      height = dims.height - border_top  - border_bottom;
+
+  // making the element to appear so we could read it's sizes
+  target.setStyle('visibility:hidden').show(null);
+
+  if (where === 'right') {
+    left += width - target.size().x;
+  } else {  // bottom
+    top  += height;
+  }
+
+  target.moveTo(left, top);
+
+  if (resize) {
+    if (where === 'left' || where === 'right') {
+      target.setHeight(height);
+    } else {
+      target.setWidth(width);
+    }
+  }
+
+  // rolling the invisibility back
+  target.setStyle('visibility:visible').hide(null);
+}
+
+/**
+ * A shared module that provides for the widgets an ability
+ * to be assigned to an input element and work in pair with it
+ *
+ * NOTE: this module works in pair with the 'RePosition' module!
+ *
+ * Copyright (C) 2010 Nikolay Nemshilov
+ */
+var Assignable = {
+  /**
+   * Assigns the widget to serve the given input element
+   *
+   * Basically it puts the references of the current widget
+   * to the input and trigger objects so they could be recognized
+   * later, and it also synchronizes the changes between the input
+   * element and the widget
+   *
+   * @param {Element} input field
+   * @param {Element} optional trigger
+   * @return Widget this
+   */
+  assignTo: function(input, trigger) {
+    input   = RightJS.$(input);
+    trigger = RightJS.$(trigger);
+
+    if (trigger) {
+      trigger[this.key] = this;
+      trigger.assignedInput = input;
+    } else {
+      input[this.key] = this;
+    }
+
+    var on_change = RightJS(function() {
+      if (this.visible() && (!this.showAt || this.shownAt === input)) {
+        this.setValue(input.value());
+      }
+    }).bind(this);
+
+    input.on({
+      keyup:  on_change,
+      change: on_change
+    });
+
+    this.onChange(function() {
+      if (!this.showAt || this.shownAt === input) {
+        input.setValue(this.getValue());
+      }
+    });
+
+    return this;
+  }
+};
+
+
+/**
+ * Converts a number into a string with leading zeros
+ *
+ * @param Number number
+ * @return String with zeros
+ */
+function zerofy(number) {
+  return (number < 10 ? '0' : '') + number;
+}
+
+
+/**
+ * The calendar widget for RightJS
+ *
+ * Copyright (C) 2009-2011 Nikolay Nemshilov
+ */
+var Calendar = new Widget({
+  include: [Toggler, Assignable],
+
+  extend: {
+    version: '2.2.0',
+
+    EVENTS: $w('show hide change done'),
+
+    Options: {
+      format:         'ISO',  // a key out of the predefined formats or a format string
+
+      showTime:       null,   // null for automatic, or true|false to enforce
+      showButtons:    false,  // show the bottom buttons
+
+      minDate:        false,  // the minimal date available
+      maxDate:        false,  // the maximal date available
+
+      fxName:         'fade',  // set to null if you don't wanna any fx
+      fxDuration:     'short', // the fx-duration
+
+      firstDay:       1,      // 1 for Monday, 0 for Sunday
+      numberOfMonths: 1,      // a number or [x, y] greed definition
+      timePeriod:     1,      // the timepicker minimal periods (in minutes, might be bigger than 60)
+
+      twentyFourHour: null,   // null for automatic, or true|false to enforce
+      listYears:      false,  // show/hide the years listing buttons
+
+      hideOnPick:     false,  // hides the popup when the user changes a day
+
+      update:         null,   // a reference to an input element to assign to
+      trigger:        null,   // a reference to a trigger element that would be paired too
+
+      cssRule:        '*[data-calendar]' // css rule for calendar related elements
+    },
+
+    Formats: {
+      ISO:            '%Y-%m-%d',
+      POSIX:          '%Y/%m/%d',
+      EUR:            '%d-%m-%Y',
+      US:             '%m/%d/%Y'
+    },
+
+    i18n: {
+      Done:           'Done',
+      Now:            'Now',
+      NextMonth:      'Next Month',
+      PrevMonth:      'Previous Month',
+      NextYear:       'Next Year',
+      PrevYear:       'Previous Year',
+
+      dayNames:        $w('Sunday Monday Tuesday Wednesday Thursday Friday Saturday'),
+      dayNamesShort:   $w('Sun Mon Tue Wed Thu Fri Sat'),
+      dayNamesMin:     $w('Su Mo Tu We Th Fr Sa'),
+      monthNames:      $w('January February March April May June July August September October November December'),
+      monthNamesShort: $w('Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec')
+    },
+
+    current:   null,
+
+    // hides all the popup calendars
+    hideAll: function(that_one) {
+      $$('div.rui-calendar').each(function(element) {
+        if (element instanceof Calendar && element !== that_one && element.visible() && !element.inlined()) {
+          element.hide();
+        }
+      });
+    }
+  },
+
+  /**
+   * Basic constructor
+   *
+   * @param Object options
+   */
+  initialize: function(options) {
+    this.$super('calendar', options);
+    this.addClass('rui-panel');
+
+    options = this.options;
+
+    this.insert([
+      this.swaps = new Swaps(options),
+      this.greed = new Greed(options)
+    ]);
+
+    if (options.showTime) {
+      this.insert(this.timepicker = new Timepicker(options));
+    }
+
+    if (options.showButtons) {
+      this.insert(this.buttons = new Buttons(options));
+    }
+
+    this.setDate(new Date()).initEvents();
+  },
+
+  /**
+   * Sets the date on the calendar
+   *
+   * NOTE: if it's `true` then it will change the date but
+   *       won't shift the months greed (used in the days picking)
+   *
+   * @param Date date or String date
+   * @param Boolean no-shifting mode
+   * @return Calendar this
+   */
+  setDate: function(date, no_shift) {
+    if ((date = this.parse(date))) {
+      var options = this.options;
+
+      // checking the date range constrains
+      if (options.minDate && options.minDate > date) {
+        date = new Date(options.minDate);
+      }
+      if (options.maxDate && options.maxDate < date) {
+        date = new Date(options.maxDate);
+        date.setDate(date.getDate() - 1);
+      }
+
+      // setting the dates greed
+      this._date = no_shift ? new Date(this._date || this.date) : null;
+      this.greed.setDate(this._date || date, date);
+
+      // updating the shifters state
+      if (options.minDate || options.maxDate) {
+        this.swaps.setDate(date);
+      }
+
+      // updating the time-picker
+      if (this.timepicker && !no_shift) {
+        this.timepicker.setDate(date);
+      }
+
+      if (date != this.date) {
+        this.fire('change', {date: this.date = date});
+      }
+    }
+
+    return this;
+  },
+
+  /**
+   * Returns the current date on the calendar
+   *
+   * @return Date currently selected date on the calendar
+   */
+  getDate: function() {
+    return this.date;
+  },
+
+  /**
+   * Sets the value as a string
+   *
+   * @param String value
+   * @return Calendar this
+   */
+  setValue: function(value) {
+    return this.setDate(value);
+  },
+
+  /**
+   * Returns the value as a string
+   *
+   * @param String optional format
+   * @return String formatted date
+   */
+  getValue: function(format) {
+    return this.format(format);
+  },
+
+  /**
+   * Inserts the calendar into the element making it inlined
+   *
+   * @param Element element or String element id
+   * @param String optional position top/bottom/before/after/instead, 'bottom' is default
+   * @return Calendar this
+   */
+  insertTo: function(element, position) {
+    this.addClass('rui-calendar-inline');
+    return this.$super(element, position);
+  },
+
+  /**
+   * Marks it done
+   *
+   * @return Calendar this
+   */
+  done: function() {
+    if (!this.inlined()) {
+      this.hide();
+    }
+
+    this.fire('done', {date: this.date});
+  },
+
+  /**
+   * Checks if the calendar is inlined
+   *
+   * @return boolean check
+   */
+  inlined: function() {
+    return this.hasClass('rui-calendar-inline');
+  },
+
+// protected
+
+  /**
+   * additional options processing
+   *
+   * @param Object options
+   * @return Calendar this
+   */
+  setOptions: function(user_options) {
+    user_options = user_options || {};
+    this.$super(user_options, $(user_options.trigger || user_options.update));
+
+    var klass   = this.constructor, options = this.options;
+
+    // merging the i18n tables
+    options.i18n = {};
+
+    for (var key in klass.i18n) {
+      options.i18n[key] = isArray(klass.i18n[key]) ? klass.i18n[key].clone() : klass.i18n[key];
+    }
+    $ext(options.i18n, user_options.i18n);
+
+    // defining the current days sequence
+    options.dayNames = options.i18n.dayNamesMin;
+    if (options.firstDay) {
+      options.dayNames.push(options.dayNames.shift());
+    }
+
+    // the monthes table cleaning up
+    if (!isArray(options.numberOfMonths)) {
+      options.numberOfMonths = [options.numberOfMonths, 1];
+    }
+
+    // min/max dates preprocessing
+    if (options.minDate) {
+      options.minDate = this.parse(options.minDate);
+    }
+    if (options.maxDate) {
+      options.maxDate = this.parse(options.maxDate);
+      options.maxDate.setDate(options.maxDate.getDate() + 1);
+    }
+
+    // format catching up
+    options.format = R(klass.Formats[options.format] || options.format).trim();
+
+    // setting up the showTime option
+    if (options.showTime === null) {
+      options.showTime = options.format.search(/%[HkIl]/) > -1;
+    }
+
+    // setting up the 24-hours format
+    if (options.twentyFourHour === null) {
+      options.twentyFourHour = options.format.search(/%[Il]/) < 0;
+    }
+
+    // enforcing the 24 hours format if the time threshold is some weird number
+    if (options.timePeriod > 60 && 12 % Math.ceil(options.timePeriod/60)) {
+      options.twentyFourHour = true;
+    }
+
+    if (options.update) {
+      this.assignTo(options.update, options.trigger);
+    }
+
+    return this;
+  },
+
+  /**
+   * hides all the other calendars on the page
+   *
+   * @return Calendar this
+   */
+  hideOthers: function() {
+    Calendar.hideAll(this);
+    return this;
+  }
+});
+
+
+/**
+ * The calendar month/year swapping buttons block
+ *
+ * Copyright (C) 2010-2011 Nikolay Nemshilov
+ */
+var Swaps = new Class(Element, {
+  /**
+   * Constructor
+   *
+   * @param Object options
+   * @return void
+   */
+  initialize: function(options) {
+    this.$super('div', {'class': 'swaps'});
+    this.options = options;
+
+    var i18n = options.i18n;
+
+    this.insert([
+      this.prevMonth = new Button('&lsaquo;', {title: i18n.PrevMonth, 'class': 'prev-month'}),
+      this.nextMonth = new Button('&rsaquo;', {title: i18n.NextMonth, 'class': 'next-month'})
+    ]);
+
+    if (options.listYears) {
+      this.insert([
+        this.prevYear = new Button('&laquo;', {title: i18n.PrevYear, 'class': 'prev-year'}),
+        this.nextYear = new Button('&raquo;', {title: i18n.NextYear, 'class': 'next-year'})
+      ]);
+    }
+
+    this.buttons = R([this.prevMonth, this.nextMonth, this.prevYear, this.nextYear]).compact();
+
+    this.onClick(this.clicked);
+  },
+
+  /**
+   * Changes the swapping buttons state depending on the options and the current date
+   *
+   * @param Date date
+   * @return void
+   */
+  setDate: function(date) {
+    var options = this.options, months_num = options.numberOfMonths[0] * options.numberOfMonths[1],
+        has_prev_year = true, has_next_year = true, has_prev_month = true, has_next_month = true;
+
+    if (options.minDate) {
+      var beginning = new Date(date.getFullYear(),0,1,0,0,0);
+      var min_date = new Date(options.minDate.getFullYear(),0,1,0,0,0);
+
+      has_prev_year = beginning > min_date;
+
+      beginning.setMonth(date.getMonth() - Math.ceil(months_num - months_num/2));
+      min_date.setMonth(options.minDate.getMonth());
+
+      has_prev_month = beginning >= min_date;
+    }
+
+    if (options.maxDate) {
+      var end = new Date(date);
+      var max_date = new Date(options.maxDate);
+      var dates = R([end, max_date]);
+      dates.each(function(date) {
+        date.setDate(32);
+        date.setMonth(date.getMonth() - 1);
+        date.setDate(32 - date.getDate());
+        date.setHours(0);
+        date.setMinutes(0);
+        date.setSeconds(0);
+        date.setMilliseconds(0);
+      });
+
+      has_next_month = end < max_date;
+
+      // checking the next year
+      dates.each('setMonth', 0);
+      has_next_year = end < max_date;
+    }
+
+    this.nextMonth[has_next_month ? 'enable':'disable']();
+    this.prevMonth[has_prev_month ? 'enable':'disable']();
+
+    if (this.nextYear) {
+      this.nextYear[has_next_year ? 'enable':'disable']();
+      this.prevYear[has_prev_year ? 'enable':'disable']();
+    }
+  },
+
+// protected
+
+  // handles the clicks on the
+  clicked: function(event) {
+    var target = event.target;
+    if (target && this.buttons.include(target)) {
+      if (target.enabled()) {
+        this.fire(target.get('className').split(/\s+/)[0]);
+      }
+    }
+  }
+});
+
+
+/**
+ * Represents a single month block
+ *
+ * Copyright (C) 2010-2011 Nikolay Nemshilov
+ */
+var Month = new Class(Element, {
+  /**
+   * Constructor
+   *
+   * @param Object options
+   * @return void
+   */
+  initialize: function(options) {
+    this.$super('table', {'class': 'month'});
+    this.options = options;
+
+    // the caption (for the month name)
+    this.insert(this.caption = new Element('caption'));
+
+    // the headline for the day-names
+    this.insert('<thead><tr>'+
+      options.dayNames.map(function(name) {return '<th>'+ name +'</th>';}).join('') +
+    '</tr></thead>');
+
+    // the body with the day-cells
+    this.days = [];
+
+    var tbody = new Element('tbody').insertTo(this), x, y, row;
+
+    for (y=0; y < 6; y++) {
+      row = new Element('tr').insertTo(tbody);
+      for (x=0; x < 7; x++) {
+        this.days.push(new Element('td').insertTo(row));
+      }
+    }
+
+    this.onClick(this.clicked);
+  },
+
+  /**
+   * Initializes the month values by the date
+   *
+   * @param Date date
+   * @return void
+   */
+  setDate: function(date, current_date) {
+    // getting the number of days in the month
+    date.setDate(32);
+    var days_number = 32 - date.getDate();
+    date.setMonth(date.getMonth()-1);
+
+    var cur_day = Math.ceil(current_date.getTime() / 86400000),
+        options = this.options, i18n = options.i18n, days = this.days;
+
+    // resetting the first and last two weeks cells
+    // because there will be some empty cells over there
+    for (var i=0, len = days.length-1, one, two, tre; i < 7; i++) {
+      one = days[i]._;
+      two = days[len - i]._;
+      tre = days[len - i - 7]._;
+
+      one.innerHTML = two.innerHTML = tre.innerHTML = '';
+      one.className = two.className = tre.className = 'blank';
+    }
+
+    // putting the actual day numbers in place
+    for (var i=1, row=0, week, cell; i <= days_number; i++) {
+      date.setDate(i);
+      var day_num = date.getDay();
+
+      if (options.firstDay === 1) { day_num = day_num > 0 ? day_num-1 : 6; }
+      if (i === 1 || day_num === 0) {
+        week = days.slice(row*7, row*7 + 7); row ++;
+      }
+
+      cell = week[day_num]._;
+
+      if (Browser.OLD) { // IE6 has a nasty glitch with that
+        cell.innerHTML = '';
+        cell.appendChild(document.createTextNode(i));
+      } else {
+        cell.innerHTML = ''+i;
+      }
+
+      cell.className = cur_day === Math.ceil(date.getTime() / 86400000) ? 'selected' : '';
+
+      if ((options.minDate && options.minDate > date) || (options.maxDate && options.maxDate < date)) {
+        cell.className = 'disabled';
+      }
+
+      week[day_num].date = new Date(date);
+    }
+
+    // setting up the caption with the month name
+    var caption = (options.listYears ?
+          i18n.monthNamesShort[date.getMonth()] + ',' :
+          i18n.monthNames[date.getMonth()])+
+        ' '+date.getFullYear(),
+        element = this.caption._;
+
+    if (Browser.OLD) {
+      element.innerHTML = '';
+      element.appendChild(document.createTextNode(caption));
+    } else {
+      element.innerHTML = caption;
+    }
+  },
+
+// protected
+
+  /**
+   * Handles clicks on the day-cells
+   *
+   * @param Event click event
+   * @return void
+   */
+  clicked: function(event) {
+    var target = event.target, date = target.date;
+
+    if (target && date && !target.hasClass('disabled') && !target.hasClass('blank')) {
+      target.addClass('selected');
+
+      this.fire('date-set', {
+        date:  date.getDate(),
+        month: date.getMonth(),
+        year:  date.getFullYear()
+      });
+    }
+  }
+});
+
+
+/**
+ * The calendar months greed unit
+ *
+ * Copyright (C) 2010-2011 Nikolay Nemshilov
+ */
+var Greed = new Class(Element, {
+  /**
+   * Constructor
+   *
+   * @param Object options
+   * @return void
+   */
+  initialize: function(options) {
+    this.$super('table', {'class': 'greed'});
+
+    this.months = [];
+
+    var tbody = new Element('tbody').insertTo(this), month;
+
+    for (var y=0; y < options.numberOfMonths[1]; y++) {
+      var row   = new Element('tr').insertTo(tbody);
+      for (var x=0; x < options.numberOfMonths[0]; x++) {
+        this.months.push(month = new Month(options));
+        new Element('td').insertTo(row).insert(month);
+      }
+    }
+  },
+
+  /**
+   * Sets the months to the date
+   *
+   * @param Date date in the middle of the greed
+   * @param the current date (might be different)
+   * @return void
+   */
+  setDate: function(date, current_date) {
+    var months = this.months, months_num = months.length;
+
+    current_date = current_date || date;
+
+    for (var i=-Math.ceil(months_num - months_num/2)+1,j=0; i < Math.floor(months_num - months_num/2)+1; i++,j++) {
+      var month_date    = new Date(date);
+      month_date.setMonth(date.getMonth() + i);
+      months[j].setDate(month_date, current_date);
+    }
+  }
+});
+
+
+/**
+ * The time-picker block unit
+ *
+ * Copyright (C) 2010-2011 Nikolay Nemshilov
+ */
+var Timepicker = new Class(Element, {
+  /**
+   * Constructor
+   *
+   * @param Object options
+   * @return void
+   */
+  initialize: function(options) {
+    this.$super('div', {'class': 'timepicker'});
+    this.options = options;
+
+    var on_change = R(this.timeChanged).bind(this);
+
+    this.insert([
+      this.hours   = new Element('select').onChange(on_change),
+      this.minutes = new Element('select').onChange(on_change)
+    ]);
+
+    var minutes_threshold = options.timePeriod < 60 ? options.timePeriod : 60;
+    var hours_threshold   = options.timePeriod < 60 ? 1 : Math.ceil(options.timePeriod / 60);
+
+    for (var i=0; i < 60; i++) {
+      var caption = zerofy(i);
+
+      if (i < 24 && i % hours_threshold == 0) {
+        if (options.twentyFourHour) {
+          this.hours.insert(new Element('option', {value: i, html: caption}));
+        } else if (i < 12) {
+          this.hours.insert(new Element('option', {value: i, html: i == 0 ? 12 : i}));
+        }
+      }
+
+      if (i % minutes_threshold == 0) {
+        this.minutes.insert(new Element('option', {value: i, html: caption}));
+      }
+    }
+
+
+    // adding the meridian picker if it's a 12 am|pm picker
+    if (!options.twentyFourHour) {
+      this.meridian = new Element('select').onChange(on_change).insertTo(this);
+
+      R(R(options.format).includes(/%P/) ? ['am', 'pm'] : ['AM', 'PM']).each(function(value) {
+        this.meridian.insert(new Element('option', {value: value.toLowerCase(), html: value}));
+      }, this);
+    }
+  },
+
+  /**
+   * Sets the time-picker values by the data
+   *
+   * @param Date date
+   * @return void
+   */
+  setDate: function(date) {
+    var options = this.options;
+    var hour = options.timePeriod < 60 ? date.getHours() :
+      Math.round(date.getHours()/(options.timePeriod/60)) * (options.timePeriod/60);
+    var minute = Math.round(date.getMinutes() / (options.timePeriod % 60)) * options.timePeriod;
+
+    if (this.meridian) {
+      this.meridian.setValue(hour < 12 ? 'am' : 'pm');
+      hour = (hour == 0 || hour == 12) ? 12 : hour > 12 ? (hour - 12) : hour;
+    }
+
+    this.hours.setValue(hour);
+    this.minutes.setValue(minute);
+  },
+
+// protected
+
+  /**
+   * Handles the time-picking events
+   *
+   * @return void
+   */
+  timeChanged: function(event) {
+    event.stopPropagation();
+
+    var hours   = parseInt(this.hours.value());
+    var minutes = parseInt(this.minutes.value());
+
+    if (this.meridian) {
+      if (hours == 12) {
+        hours = 0;
+      }
+      if (this.meridian.value() == 'pm') {
+        hours += 12;
+      }
+    }
+
+    this.fire('time-set', {hours: hours, minutes: minutes});
+  }
+});
+
+
+/**
+ * The bottom-buttons block unit
+ *
+ * Copyright (C) 2010 Nikolay Nemshilov
+ */
+var Buttons = new Class(Element, {
+  /**
+   * Constructor
+   *
+   * @param Object options
+   * @return void
+   */
+  initialize: function(options) {
+    this.$super('div', {'class': 'buttons'});
+
+    this.insert([
+      new Button(options.i18n.Now,  {'class': 'now'}).onClick('fire', 'now-clicked'),
+      new Button(options.i18n.Done, {'class': 'done'}).onClick('fire', 'done-clicked')
+    ]);
+  }
+});
+
+
+/**
+ * This module handles the dates parsing/formatting processes
+ *
+ * To format dates and times this scripts use the GNU (C/Python/Ruby) strftime
+ * function formatting principles
+ *
+ *   %a - The abbreviated weekday name (``Sun'')
+ *   %A - The  full  weekday  name (``Sunday'')
+ *   %b - The abbreviated month name (``Jan'')
+ *   %B - The  full  month  name (``January'')
+ *   %d - Day of the month (01..31)
+ *   %e - Day of the month without leading zero (1..31)
+ *   %m - Month of the year (01..12)
+ *   %y - Year without a century (00..99)
+ *   %Y - Year with century
+ *   %H - Hour of the day, 24-hour clock (00..23)
+ *   %k - Hour of the day, 24-hour clock without leading zero (0..23)
+ *   %I - Hour of the day, 12-hour clock (01..12)
+ *   %l - Hour of the day, 12-hour clock without leading zer (0..12)
+ *   %p - Meridian indicator (``AM''  or  ``PM'')
+ *   %P - Meridian indicator (``pm''  or  ``pm'')
+ *   %M - Minute of the hour (00..59)
+ *   %S - Second of the minute (00..60)
+ *   %% - Literal ``%'' character
+ *
+ * Copyright (C) 2009-2010 Nikolay V. Nemshilov
+ */
+Calendar.include({
+
+  /**
+   * Parses out the given string based on the current date formatting
+   *
+   * @param String string date
+   * @return Date parsed date or null if it wasn't parsed
+   */
+  parse: function(string) {
+    var date;
+
+    if (isString(string) && string) {
+      var tpl = RegExp.escape(this.options.format);
+      var holders = R(tpl.match(/%[a-z]/ig)).map('match', /[a-z]$/i).map('first').without('%');
+      var re  = new RegExp('^'+tpl.replace(/%p/i, '(pm|PM|am|AM)').replace(/(%[a-z])/ig, '(.+?)')+'$');
+
+      var match = R(string).trim().match(re);
+
+      if (match) {
+        match.shift();
+
+        var year = null, month = null, hour = null, minute = null, second = null, meridian;
+
+        while (match.length) {
+          var value = match.shift();
+          var key   = holders.shift();
+
+          if (key.toLowerCase() == 'b') {
+            month = this.options.i18n[key=='b' ? 'monthNamesShort' : 'monthNames'].indexOf(value);
+          } else if (key.toLowerCase() == 'p') {
+            meridian = value.toLowerCase();
+          } else {
+            value = parseInt(value, 10);
+            switch(key) {
+              case 'd':
+              case 'e': date   = value; break;
+              case 'm': month  = value-1; break;
+              case 'y':
+              case 'Y': year   = value; break;
+              case 'H':
+              case 'k':
+              case 'I':
+              case 'l': hour   = value; break;
+              case 'M': minute = value; break;
+              case 'S': second = value; break;
+            }
+          }
+        }
+
+        // converting 1..12am|pm into 0..23 hours marker
+        if (meridian) {
+          hour = hour == 12 ? 0 : hour;
+          hour = (meridian == 'pm' ? hour + 12 : hour);
+        }
+
+        date = new Date(year, month, date, hour, minute, second);
+      }
+    } else if (string instanceof Date || Date.parse(string)) {
+      date = new Date(string);
+    }
+
+    return (!date || isNaN(date.getTime())) ? null : date;
+  },
+
+  /**
+   * Formats the current date into a string depend on the current or given format
+   *
+   * @param String optional format
+   * @return String formatted data
+   */
+  format: function(format) {
+    var i18n   = this.options.i18n;
+    var day    = this.date.getDay();
+    var month  = this.date.getMonth();
+    var date   = this.date.getDate();
+    var year   = this.date.getFullYear();
+    var hour   = this.date.getHours();
+    var minute = this.date.getMinutes();
+    var second = this.date.getSeconds();
+
+    var hour_ampm = (hour == 0 ? 12 : hour < 13 ? hour : hour - 12);
+
+    var values    = {
+      a: i18n.dayNamesShort[day],
+      A: i18n.dayNames[day],
+      b: i18n.monthNamesShort[month],
+      B: i18n.monthNames[month],
+      d: zerofy(date),
+      e: ''+date,
+      m: (month < 9 ? '0' : '') + (month+1),
+      y: (''+year).substring(2,4),
+      Y: ''+year,
+      H: zerofy(hour),
+      k: '' + hour,
+      I: (hour > 0 && (hour < 10 || (hour > 12 && hour < 22)) ? '0' : '') + hour_ampm,
+      l: '' + hour_ampm,
+      p: hour < 12 ? 'AM' : 'PM',
+      P: hour < 12 ? 'am' : 'pm',
+      M: zerofy(minute),
+      S: zerofy(second),
+      '%': '%'
+    };
+
+    var result = format || this.options.format;
+    for (var key in values) {
+      result = result.replace('%'+key, values[key]);
+    }
+
+    return result;
+  }
+});
+
+
+/**
+ * This module handles the events connection
+ *
+ * Copyright (C) 2009-2010 Nikolay Nemshilov
+ */
+Calendar.include({
+
+// protected
+
+  // connects the events with handlers
+  initEvents: function() {
+    var shift = '_shiftDate', terminate = this._terminate;
+
+    this.on({
+      // the dates/months/etc listing events
+      'prev-day':     [shift, {Date:     -1}],
+      'next-day':     [shift, {Date:      1}],
+      'prev-week':    [shift, {Date:     -7}],
+      'next-week':    [shift, {Date:      7}],
+      'prev-month':   [shift, {Month:    -1}],
+      'next-month':   [shift, {Month:     1}],
+      'prev-year':    [shift, {FullYear: -1}],
+      'next-year':    [shift, {FullYear:  1}],
+
+      // the date/time picking events
+      'date-set':     this._changeDate,
+      'time-set':     this._changeTime,
+
+      // the bottom buttons events
+      'now-clicked':  this._setNow,
+      'done-clicked': this.done,
+
+      // handling the clicks
+      'click':        terminate,
+      'mousedown':    terminate,
+      'focus':        terminate,
+      'blur':         terminate
+    });
+  },
+
+  // shifts the date according to the params
+  _shiftDate: function(params) {
+    var date = new Date(this.date), options = this.options;
+
+    // shifting the date according to the params
+    for (var key in params) {
+      date['set'+key](date['get'+key]() + params[key]);
+    }
+
+    this.setDate(date);
+  },
+
+  // changes the current date (not the time)
+  _changeDate: function(event) {
+    var date = new Date(this.date);
+
+    date.setDate(event.date);
+    date.setMonth(event.month);
+    date.setFullYear(event.year);
+
+    this.setDate(date, true); // <- `true` means just change the date without shifting the list
+
+    if (this.options.hideOnPick) {
+      this.done();
+    }
+  },
+
+  // changes the current time (not the date)
+  _changeTime: function(event) {
+    var date = new Date(this.date);
+
+    date.setHours(event.hours);
+    date.setMinutes(event.minutes);
+
+    this.setDate(date);
+  },
+
+  // resets the calendar to the current time
+  _setNow: function() {
+    this.setDate(new Date());
+  },
+
+  /** simply stops the event so we didn't bother the things outside of the object
+   *
+   * @param {Event} event
+   * @return void
+   * @private
+   */
+  _terminate: function(event) {
+    event.stopPropagation(); // don't let the clicks go anywere out of the clanedar
+
+    if (this._hide_delay) {
+      this._hide_delay.cancel();
+      this._hide_delay = null;
+    }
+  }
+});
+
+
+/**
+ * Document level event listeners for navigation and lazy initialization
+ *
+ * Copyright (C) 2009-2010 Nikolay Nemshilov
+ */
+$(document).on({
+  /**
+   * Watches the focus events and dispalys the calendar
+   * popups when there is a related input element
+   *
+   * @param Event focus-event
+   * @return void
+   */
+  focus: function(event) {
+    var target = event.target instanceof Input && event.target.get('type') == 'text' ? event.target : null;
+
+    Calendar.hideAll();
+
+    if (target && (target.calendar || target.match(Calendar.Options.cssRule))) {
+      (target.calendar || new Calendar({update: target}))
+        .setValue(target.value()).showAt(target);
+    }
+  },
+
+  /**
+   * Watches the input elements blur events
+   * and hides shown popups
+   *
+   * @param Event blur-event
+   * @return void
+   */
+  blur: function(event) {
+    var target = event.target, calendar = target.calendar;
+
+    if (calendar) {
+      // we use the delay so it didn't get hidden when the user clicks the calendar itself
+      calendar._hide_delay = R(function() {
+        calendar.hide();
+      }).delay(200);
+    }
+  },
+
+  /**
+   * Catches clicks on trigger elements
+   *
+   * @param Event click
+   * @return void
+   */
+  click: function(event) {
+    var target = (event.target instanceof Element) ? event.target : null;
+
+    if (target && (target.calendar || target.match(Calendar.Options.cssRule))) {
+      if (!(target instanceof Input) || target.get('type') != 'text') {
+        event.stop();
+        (target.calendar || new Calendar({trigger: target}))
+          .hide(null).toggleAt(target.assignedInput);
+      }
+    } else if (!event.find('div.rui-calendar')){
+      Calendar.hideAll();
+    }
+  },
+
+  /**
+   * Catching the key-downs to navigate in the currently
+   * opened Calendar hover
+   *
+   * @param Event event
+   * @return void
+   */
+  keydown: function(event) {
+    var calendar = Calendar.current, name = ({
+      27: 'hide',        // Escape
+      37: 'prev-day',    // Left  Arrow
+      39: 'next-day',    // Right Arrow
+      38: 'prev-week',   // Up Arrow
+      40: 'next-week',   // Down Arrow
+      33: 'prev-month',  // Page Up
+      34: 'next-month',  // Page Down
+      13: 'done'         // Enter
+    })[event.keyCode];
+
+    if (name && calendar && calendar.visible()) {
+      event.stop();
+      if (isFunction(calendar[name])) {
+        calendar[name]();
+      } else {
+        calendar.fire(name);
+      }
+    }
+  }
+});
+(function() {
+        var style = document.createElement('style'),
+            rules = document.createTextNode(".rui-panel{margin:0;padding:.5em;position:relative;background-color:#EEE;border:1px solid #BBB;border-radius:.3em;-moz-border-radius:.3em;-webkit-border-radius:.3em;box-shadow:.15em .3em .5em #BBB;-moz-box-shadow:.15em .3em .5em #BBB;-webkit-box-shadow:.15em .3em .5em #BBB;cursor:default} *.rui-button{display:inline-block; *display:inline; *zoom:1;height:1em;line-height:1em;margin:0;padding:.2em .5em;text-align:center;border:1px solid #CCC;border-radius:.2em;-moz-border-radius:.2em;-webkit-border-radius:.2em;cursor:pointer;color:#333;background-color:#FFF;user-select:none;-moz-user-select:none;-webkit-user-select:none} *.rui-button:hover{color:#111;border-color:#999;background-color:#DDD;box-shadow:#888 0 0 .1em;-moz-box-shadow:#888 0 0 .1em;-webkit-box-shadow:#888 0 0 .1em} *.rui-button:active{color:#000;border-color:#777;text-indent:1px;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none} *.rui-button-disabled, *.rui-button-disabled:hover, *.rui-button-disabled:active{color:#888;background:#DDD;border-color:#CCC;cursor:default;text-indent:0;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}div.rui-re-anchor{margin:0;padding:0;background:none;border:none;float:none;display:inline;position:absolute;z-index:9999}div.rui-calendar .swaps,div.rui-calendar .greed,div.rui-calendar .timepicker,div.rui-calendar .buttons,div.rui-calendar table,div.rui-calendar table tr,div.rui-calendar table th,div.rui-calendar table td,div.rui-calendar table tbody,div.rui-calendar table thead,div.rui-calendar table caption{background:none;border:none;width:auto;height:auto;margin:0;padding:0}div.rui-calendar-inline{position:relative;display:inline-block; *display:inline; *zoom:1;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}div.rui-calendar .swaps{position:relative}div.rui-calendar .swaps .rui-button{position:absolute;float:left;width:1em;padding:.15em .4em}div.rui-calendar .swaps .next-month{right:0em;_right:.5em}div.rui-calendar .swaps .prev-year{left:2.05em}div.rui-calendar .swaps .next-year{right:2.05em;_right:2.52em}div.rui-calendar .greed{border-spacing:0px;border-collapse:collapse;border-size:0}div.rui-calendar .greed td{vertical-align:top;padding-left:.4em}div.rui-calendar .greed>tbody>tr>td:first-child{padding:0}div.rui-calendar .month{margin-top:.2em;border-spacing:1px;border-collapse:separate}div.rui-calendar .month caption{text-align:center}div.rui-calendar .month th{color:#666;text-align:center}div.rui-calendar .month td{text-align:right;padding:.1em .3em;background-color:#FFF;border:1px solid #CCC;cursor:pointer;color:#555;border-radius:.2em;-moz-border-radius:.2em;-webkit-border-radius:.2em}div.rui-calendar .month td:hover{background-color:#CCC;border-color:#AAA;color:#000}div.rui-calendar .month td.blank{background:transparent;cursor:default;border:none}div.rui-calendar .month td.selected{background-color:#BBB;border-color:#AAA;color:#222;font-weight:bold;padding:.1em .2em}div.rui-calendar .month td.disabled{color:#888;background:#EEE;border-color:#CCC;cursor:default}div.rui-calendar .timepicker{border-top:1px solid #ccc;margin-top:.3em;padding-top:.5em;text-align:center}div.rui-calendar .timepicker select{margin:0 .4em}div.rui-calendar .buttons{position:relative;margin-top:.5em}div.rui-calendar .buttons div.rui-button{width:4em;padding:.25em .5em}div.rui-calendar .buttons .done{position:absolute;right:0em;top:0}");
+
+        style.type = 'text/css';
+
+        if(style.styleSheet) {
+          style.styleSheet.cssText = rules.nodeValue;
+        } else {
+          style.appendChild(rules);
+        }
+
+        document.getElementsByTagName('head')[0].appendChild(style);
+      })();
+
+return Calendar;
+})(document, parseInt, RightJS);