right-rails 1.2.1 → 1.2.2

data/vendor/assets/javascripts/right/tabs.js

@@ -0,0 +1,7 @@
+/**
+ * RightJS-UI Tabs v2.2.3
+ * http://rightjs.org/ui/tabs
+ *
+ * Copyright (C) 2009-2011 Nikolay Nemshilov
+ */
+var Tabs=RightJS.Tabs=function(a,b,c){function w(a,b,d){if(c.Cookie){var e=v();e=e.without.apply(e,b.map("id")),e.push(d.target.id),r.set("right-tabs-indexes",e.uniq().join(","),a)}}function v(){return f(c.Cookie?(r.get("right-tabs-indexes")||"").split(","):[])}function d(a,b){b||(b=a,a="DIV");var d=new c.Class(c.Element.Wrappers[a]||c.Element,{initialize:function(b,d){this.key=b;var e=[{"class":"rui-"+b}];this instanceof c.Input||this instanceof c.Form||e.unshift(a),this.$super.apply(this,e),c.isString(d)&&(d=c.$(d)),d instanceof c.Element&&(this._=d._,"$listeners"in d&&(d.$listeners=d.$listeners),d={}),this.setOptions(d,this);return c.Wrapper.Cache[c.$uid(this._)]=this},setOptions:function(a,b){b&&(a=c.Object.merge(a,(new Function("return "+(b.get("data-"+this.key)||"{}")))())),a&&c.Options.setOptions.call(this,c.Object.merge(this.options,a));return this}}),e=new c.Class(d,b);c.Observer.createShortcuts(e.prototype,e.EVENTS||c([]));return e}var e=new c.Class(c.Element,{initialize:function(a){this.$super("div",{"class":"rui-spinner"}),this.dots=[];for(var b=0;b<(a||4);b++)this.dots.push(new c.Element("div"));this.dots[0].addClass("glowing"),this.insert(this.dots),c(this.shift).bind(this).periodical(300)},shift:function(){if(this.visible()){var a=this.dots.pop();this.dots.unshift(a),this.insert(a,"top")}}}),f=c,g=c.$,h=c.$$,i=c.$w,j=c.$E,k=c.Fx,l=c.Object,m=c.Browser,n=c.isArray,o=c.isNumber,p=c.Class,q=c.Element,r=c.Cookie,s=new d("UL",{extend:{version:"2.2.3",EVENTS:i("select hide load disable enable add remove move"),Options:{idPrefix:"",tabsElement:null,resizeFx:"both",resizeDuration:400,scrollTabs:!1,scrollDuration:400,selected:null,disabled:null,closable:!1,loop:!1,loopPause:!0,url:!1,cache:!1,Xhr:null,Cookie:null},rescan:function(b){g(b||a).find(".rui-tabs,*[data-tabs]").each(function(a){a=a instanceof s?a:new s(a)})}},initialize:function(a,b){this.$super("tabs",a).setOptions(b).addClass("rui-tabs"),this.isHarmonica=this._.tagName==="DL",this.isCarousel=this.hasClass("rui-tabs-carousel"),this.isSimple=!this.isHarmonica&&!this.isCarousel,this.findTabs().initScrolls().findCurrent().setStyle("visibility:visible"),this.options.disabled&&this.disable(this.options.disabled),this.options.loop&&this.startLoop()},select:function(a){return this.callTab(a,"select")},disable:function(a){return this.callTab(a,"disable")},enable:function(a){return this.callTab(a,"enable")},current:function(){return this.tabs.first("current")},enabled:function(){return this.tabs.filter("enabled")},callTab:function(a,b){f(n(a)?a:[a]).each(function(a){o(a)&&(a=this.tabs[a]),a&&a instanceof t&&a[b]()},this);return this},findTabs:function(){this.tabsList=this.isHarmonica?this:g(this.options.tabsElement)||this.first(".rui-tabs-list")||(this.first("UL")||j("UL").insertTo(this)).addClass("rui-tabs-list"),this.tabs=f([]),this.tabsList.children(this.isHarmonica?"dt":null).map(function(a){this.tabs.push(new t(a,this))},this);for(var a=0,b=this.tabsList.get("childNodes");a<b.length;a++)b[a].nodeType==3&&this.tabsList._.removeChild(b[a]);return this}}),t=s.Tab=new p(q,{extend:{autoId:0},initialize:function(a,b){this.$super(a._),this.addClass("rui-tabs-tab"),this.main=b,this.link=this.first("a"),this.id=this.link.get("href").split("#")[1]||t.autoId++,this.panel=new u(this.findPanel(),this),this.current()&&this.select(),b.options.closable&&this.link.insert(j("div",{"class":"rui-tabs-tab-close-icon",html:"&times;"}).onClick(f(this.remove).bind(this))),this.onClick(this._clicked)},select:function(){if(this.enabled()){var a=this.main.current();a&&a.removeClass("rui-tabs-current").fire("hide"),this.addClass("rui-tabs-current"),this.main.scrollToTab(this),this.panel.show()}return this.fire("select")},disable:function(){return this.addClass("rui-tabs-disabled").fire("disable")},enable:function(){return this.removeClass("rui-tabs-disabled").fire("enable")},disabled:function(){return!this.enabled()},enabled:function(){return!this.hasClass("rui-tabs-disabled")},current:function(){return this.hasClass("rui-tabs-current")},remove:function(a){a&&a.stop();if(this.current()){var b=this.main.enabled(),c=b[b.indexOf(this)+1]||b[b.indexOf(this)-1];c&&c.select()}this.main.tabs.splice(this.main.tabs.indexOf(this),1),this.panel.remove();var d=this.parent();this.fire("beforeremove"),this.$super(),d.fire("remove",{target:this});return this},_clicked:function(a){a.stop();return this.select()},findPanel:function(){var a=this.main,b=a.options.idPrefix+this.id,c;if(a.isHarmonica){var d=this.next();c=d&&d._.tagName==="DD"?d:j("DD").insertTo(this,"after")}else c=g(b)||j(a._.tagName==="UL"?"LI":"DIV").insertTo(a);return c.set("id",b)},width:function(){var a=this.next();return a?a.position().x-this.position().x:this.size().x+1}}),u=s.Panel=new p(q,{initialize:function(a,b){this.$super(a._),this.addClass("rui-tabs-panel"),this.tab=b,this.id=this.get("id")},show:function(){return this.resizing(function(){this.tab.main.tabs.each(function(a){a.panel[a.panel===this?"addClass":"removeClass"]("rui-tabs-current")},this)})},update:function(a){this.tab.current()?this.resizing(function(){q.prototype.update.call(this,a||"")}):this.$super(a||"");return this},lock:function(){this.insert(this.locker(),"top")},resizing:function(a){var b=this.tab.main;if(b.__working)return this.resizing.bind(this,a).delay(100);var d=b.options,e=b.tabs.map("panel").first("hasClass","rui-tabs-current"),f=this,g=e!==f,h=this.first("div.rui-tabs-panel-locker");f.parent().hasClass("rui-tabs-resizer")&&f.insertTo(e.parent());if(d.resizeFx&&c.Fx&&e&&(g||h)){b.__working=!0;var i=function(){b.__working=!1},l=d.resizeFx==="both"&&h?"slide":d.resizeFx,m=d.resizeDuration;m=k.Durations[m]||m;var n=l==="fade"?0:l==="slide"?m:m/2,o=m-n;l!=="slide"&&f.setStyle({opacity:0});var p=b.isHarmonica&&g?0:e.size().y;a.call(this);var q=f.size().y,r=null,s=null,t=null;l!=="fade"&&p!==q?(b._.style.height=b.size().y+"px",r=j("div",{"class":"rui-tabs-resizer",style:"height: "+p+"px"}),b.isHarmonica&&g&&(e.addClass("rui-tabs-current"),s=j("div",{"class":"rui-tabs-resizer"}),s._.style.height=e.size().y+"px",t=function(){s.replace(e.removeClass("rui-tabs-current"))},e.wrap(s),r._.style.height="0px"),f.wrap(r),b._.style.height="auto"):(rezise_duration=0,m=o);var u=0,v=function(){if(r){if(l=="both"&&!u)return u++;r.replace(f)}i()};s&&s.morph({height:"0px"},{duration:n,onFinish:t}),r&&r.morph({height:q+"px"},{duration:n,onFinish:v}),l!=="slide"&&f.morph.bind(f,{opacity:1},{duration:o,onFinish:v}).delay(n),!r&&l==="slide"&&v()}else a.call(this);return this},locker:function(){return this._locker||(this._locker=j("div",{"class":"rui-tabs-panel-locker"}).insert(new e(5)))}});s.include({next:function(){return this.pickTab(+1)},prev:function(){return this.pickTab(-1)},scrollLeft:function(){this.prevButton.hasClass("rui-tabs-scroller-disabled")||this[this.isCarousel?"prev":"justScroll"](+.6);return this},scrollRight:function(){this.nextButton.hasClass("rui-tabs-scroller-disabled")||this[this.isCarousel?"next":"justScroll"](-.6);return this},initScrolls:function(){(this.scrollable=this.options.scrollTabs||this.isCarousel)&&this.buildScroller();return this},buildScroller:function(){if(!(this.prevButton=this.first(".rui-tabs-scroller-prev"))||!(this.nextButton=this.first(".rui-tabs-scroller-next")))this.prevButton=j("div",{"class":"rui-tabs-scroller-prev",html:"&laquo;"}),this.nextButton=j("div",{"class":"rui-tabs-scroller-next",html:"&raquo;"}),j("div").insertTo(this.tabsList,"before").replace(j("div",{"class":"rui-tabs-scroller"}).insert([this.prevButton,this.nextButton,this.scroller=j("div",{"class":"rui-tabs-scroller-body"}).insert(this.tabsList)])).remove();this.prevButton.onClick(f(this.scrollLeft).bind(this)),this.nextButton.onClick(f(this.scrollRight).bind(this))},pickTab:function(a){var b=this.current();if(b&&b.enabled()){var c=this.enabled(),d=c[c.indexOf(b)+a];d&&d.select()}},scrollToTab:function(a){if(this.scroller){var c=0;for(var d=0;d<this.tabs.length;d++){c+=this.tabs[d].width();if(this.tabs[d]===a)break}var e=this.scroller.size().x,f=(this.isCarousel?e/2+a.width()/2:e)-c;if(!this.isCarousel){var g=b(this.tabsList.getStyle("left")||0,10);f>=g&&f<g+e-a.width()?f=g:g>-c&&g<=a.width()-c&&(f=a.width()-c)}this.scrollTo(f)}},justScroll:function(a){if(!this.scroller)return this;var c=b(this.tabsList.getStyle("left")||0,10),d=this.scroller.size().x;this.scrollTo(c+d*a)},scrollTo:function(a){var b=this.scroller.size().x,c=this.tabs.map("width").sum();a<b-c&&(a=b-c),a>0&&(a=0),this.tabsList.morph({left:a+"px"},{duration:this.options.scrollDuration}),this.checkScrollButtons(c,b,a)},checkScrollButtons:function(a,b,c){var d=!1,e=!1;if(this.isCarousel){var f=this.enabled(),g=f.first("current");if(g){var h=f.indexOf(g);d=h>0,e=h<f.length-1}}else d=c!==0,e=c>b-a;this.prevButton[d?"removeClass":"addClass"]("rui-tabs-scroller-disabled"),this.nextButton[e?"removeClass":"addClass"]("rui-tabs-scroller-disabled")}}),s.include({findCurrent:function(){var a=this.enabled(),b=this.tabs[this.options.selected]||this.tabs[this.urlIndex()]||this.tabs[this.cookieIndex()]||a.first("current")||a[0];b&&b.select(),this.options.Cookie&&this.onSelect(f(w).curry(this.options.Cookie,this.tabs));return this},urlIndex:function(){var b=-1,c=a.location.href.split("#")[1];if(c)for(var d=0;d<this.tabs.length;d++)if(this.tabs[d].id==c){b=d;break}return b},cookieIndex:function(){var a=-1;if(this.options.Cookie){var b=v();for(var c=0;c<this.tabs.length;c++)if(b.include(this.tabs[c].id)){a=c;break}}return a}}),s.include({add:function(a,b,c){c=c||{};var d=j(this.isHarmonica?"dt":"li").insert(j("a",{html:a,href:c.url||"#"+(c.id||"")})).insertTo(this.tabsList),e=new t(d,this);e.panel.update(b||""),this.tabs.push(e),e.fire("add"),"position"in c&&this.move(e,c.position);return this},move:function(a,b){a=this.tabs[a]||a,this.tabs[b]&&this.tabs[b]!==a&&(this.tabs[b].insert(a,b===this.tabs.length-1?"after":"before"),this.isHarmonica&&a.insert(a.panel,"after"),this.tabs.splice(this.tabs.indexOf(a),1),this.tabs.splice(b,0,a),a.fire("move",{index:b}));return this},remove:function(a){return arguments.length===0?this.$super():this.callTab(a,"remove")}});var x=t.prototype.select;t.include({select:function(){if(this.dogPiling(arguments))return this;var a=x.apply(this,arguments),b=f(this.link.get("href")),d=this.main.options;b.includes("#")&&(b=d.url?d.url.replace("%{id}",b.split("#")[1]):null);if(b&&!this.request&&(!d.cache&&!this.cache)){this.panel.lock();try{this.request=(new c.Xhr(b,l.merge({method:"get"},d.Xhr))).onComplete(f(function(a){if(this.main.__working)return arguments.callee.bind(this,a).delay(100);this.panel.update(a.text),this.request=null,d.cache&&(this.cache=!0),this.fire("load")}).bind(this)).send()}catch(e){if(!m.OLD)throw e}}return a},dogPiling:function(a){if(this.main.__working){this.main.__timeout&&this.main.__timeout.cancel(),this.main.__timeout=f(function(a){this.select.apply(this,a)}).bind(this,a).delay(100);return!0}return this.main.__timeout=null}}),s.include({startLoop:function(a){if(!a&&!this.options.loop)return this;this.options.loopPause&&(this._stopLoop=this._stopLoop||f(this.stopLoop).bind(this,!0),this._startLoop=this._startLoop||f(this.startLoop).bind(this,a),this.forgetHovers().on({mouseover:this._stopLoop,mouseout:this._startLoop})),this.timer&&this.timer.stop(),this.timer=f(function(){var a=this.enabled(),b=this.current(),c=a[a.indexOf(b)+1];this.select(c||a.first())}).bind(this).periodical(this.options.loop||a);return this},stopLoop:function(a,b){this.timer&&(this.timer.stop(),this.timer=null),!b&&this._startLoop&&this.forgetHovers()},forgetHovers:function(){return this.stopObserving("mouseover",this._stopLoop).stopObserving("mouseout",this._startLoop)}}),g(a).onReady(function(){s.rescan()});var y=a.createElement("style"),z=a.createTextNode("div.rui-spinner,div.rui-spinner div{margin:0;padding:0;border:none;background:none;list-style:none;font-weight:normal;float:none;display:inline-block; *display:inline; *zoom:1;border-radius:.12em;-moz-border-radius:.12em;-webkit-border-radius:.12em}div.rui-spinner{text-align:center;white-space:nowrap;background:#EEE;border:1px solid #DDD;height:1.2em;padding:0 .2em}div.rui-spinner div{width:.4em;height:70%;background:#BBB;margin-left:1px}div.rui-spinner div:first-child{margin-left:0}div.rui-spinner div.glowing{background:#777}.rui-tabs,.rui-tabs-list,.rui-tabs-tab,.rui-tabs-panel,.rui-tabs-scroll-left,.rui-tabs-scroll-right,.rui-tabs-scroll-body,.rui-tabs-panel-locker,.rui-tabs-resizer{margin:0;padding:0;background:none;border:none;list-style:none;display:block;width:auto;height:auto}.rui-tabs{display:block;visibility:hidden;border-bottom:1px solid #CCC}.rui-tabs-resizer{overflow:hidden}.rui-tabs-list{display:block;position:relative;padding:0 .5em;border-bottom:1px solid #CCC;white-space:nowrap}.rui-tabs-list .rui-tabs-tab,.rui-tabs-tab *,.rui-tabs-tab *:hover{display:inline-block; *display:inline; *zoom:1;cursor:pointer;text-decoration:none;vertical-align:center}.rui-tabs-list .rui-tabs-tab{vertical-align:bottom;margin-right:.1em}.rui-tabs-tab a{outline:none;position:relative;border:1px solid #CCC;background:#DDD;color:#444;padding:.3em 1em;border-radius:.3em;-moz-border-radius:.3em;-webkit-border-radius:.3em;border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0;-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-bottom-left-radius:0;-webkit-border-bottom-right-radius:0}.rui-tabs-tab a:hover{border-color:#CCC;background:#EEE}.rui-tabs-list .rui-tabs-current a,.rui-tabs-list .rui-tabs-current a:hover{font-weight:bold;color:#000;background:#FFF;border-bottom:1px solid #FFF;border-top-width:2px;padding-top:.34em;padding-bottom:.34em;top:1px}.rui-tabs-tab a img{border:none;opacity:.6;filter:alpha(opacity=60)}.rui-tabs-tab a:hover img,.rui-tabs-list .rui-tabs-current a img{opacity:1;filter:alpha(opacity=100)}.rui-tabs-disabled a,.rui-tabs-disabled a:hover{background:#EEE;border-color:#DDD;color:#AAA;cursor:default}.rui-tabs-disabled a img,.rui-tabs-disabled a:hover img{opacity:.5;filter:alpha(opacity=50)}.rui-tabs-tab-close-icon{display:inline-block; *display:inline; *zoom:1;margin-right:-0.5em;margin-left:0.5em;cursor:pointer;opacity:0.5;filter:alpha(opacity=50)}.rui-tabs-tab-close-icon:hover{opacity:1;filter:alpha(opacity=100);color:#B00;text-shadow:#888 .15em .15em .2em}.rui-tabs-panel{display:none;position:relative;min-height:4em;padding:.5em 0}.rui-tabs-current{display:block}.rui-tabs-scroller{position:relative;padding:0 1.4em}.rui-tabs-scroller-prev,.rui-tabs-scroller-next{width:1.1em;text-align:center;background:#EEE;color:#666;cursor:pointer;border:1px solid #CCC;border-radius:.2em;-moz-border-radius:.2em;-webkit-border-radius:.2em;position:absolute;bottom:0px;left:0px;padding:0.3em 0;user-select:none;-moz-user-select:none;-webkit-user-select:none}.rui-tabs-scroller-prev:hover,.rui-tabs-scroller-next:hover{color:#000;background:#DDD;border-color:#AAA}.rui-tabs-scroller-prev:active,.rui-tabs-scroller-next:active{background:#eee;border-color:#ccc}.rui-tabs-scroller-next{left:auto;right:0px}.rui-tabs-scroller-disabled,.rui-tabs-scroller-disabled:hover{cursor:default;background:#DDD;border-color:#DDD;color:#AAA}.rui-tabs-scroller-body{overflow:hidden;width:100%;position:relative}.rui-tabs-scroller .rui-tabs-list{padding-left:0;padding-right:0;width:9999em;z-index:10}.rui-tabs-panel-locker{position:absolute;top:0px;left:0px;opacity:0.5;filter:alpha(opacity=50);background:#CCC;width:100%;height:100%;text-align:center}.rui-tabs-panel-locker .rui-spinner{position:absolute;left:44%;top:44%;background:none;border:none;height:2em}.rui-tabs-panel-locker .rui-spinner div{background:#666;width:.65em;margin-left:.15em}.rui-tabs-panel-locker .rui-spinner div.glowing{background:#000}.rui-tabs-carousel .rui-tabs-list{border:none}.rui-tabs-carousel .rui-tabs-tab a,.rui-tabs-carousel .rui-tabs-scroller .rui-tabs-scroller-prev,.rui-tabs-carousel .rui-tabs-scroller .rui-tabs-scroller-next{height:6em;line-height:6em;padding:0;border-bottom:1px solid #ccc;border-radius:.25em;-moz-border-radius:.25em;-webkit-border-radius:.25em}.rui-tabs-carousel .rui-tabs-tab{margin-right:3px}.rui-tabs-carousel .rui-tabs-tab a img{border:1px solid #CCC;vertical-align:middle;margin:.4em;padding:0;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0}.rui-tabs-carousel .rui-tabs-list .rui-tabs-current a{border-width:1px;border-color:#AAA;padding:0;top:auto}.rui-tabs-carousel .rui-tabs-list .rui-tabs-current a img{border-color:#bbb}.rui-tabs-carousel .rui-tabs-panel{text-align:center}dl.rui-tabs{border:none}dt.rui-tabs-tab,dt.rui-tabs-tab a,dt.rui-tabs-tab a:hover{display:block;float:none}dt.rui-tabs-tab a,dt.rui-tabs-tab a:hover{padding:.2em 1em;border:1px solid #ccc;border-radius:.25em;-moz-border-radius:.3em;-webkit-border-radius:.3em}dl.rui-tabs dt.rui-tabs-current a{background:#EEE;border-bottom-left-radius:0;border-bottom-right-radius:0;-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-bottom-left-radius:0;-webkit-border-bottom-right-radius:0}dl.rui-tabs dd.rui-tabs-current+dt.rui-tabs-tab a{border-top-left-radius:0;border-top-right-radius:0;-moz-border-radius-topleft:0;-moz-border-radius-topright:0;-webkit-border-top-left-radius:0;-webkit-border-top-right-radius:0}");y.type="text/css",a.getElementsByTagName("head")[0].appendChild(y),y.styleSheet?y.styleSheet.cssText=z.nodeValue:y.appendChild(z);return s}(document,parseInt,RightJS)

data/vendor/assets/javascripts/right/tags-src.js

@@ -0,0 +1,745 @@
+/**
+ * RightJS-UI Tags v2.2.1
+ * http://rightjs.org/ui/tags
+ *
+ * Copyright (C) 2011 Nikolay Nemshilov
+ */
+var Tags = RightJS.Tags = (function(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 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) {
+      if (element) {
+        options = RightJS.Object.merge(options, new Function("return "+(
+          element.get('data-'+ this.key) || '{}'
+        ))());
+      }
+
+      if (options) {
+        RightJS.Options.setOptions.call(this, RightJS.Object.merge(this.options, options));
+      }
+
+      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 || RightJS([]));
+
+  return Klass;
+}
+
+
+/**
+ * The tags widget initialization script
+ *
+ * Copyright (C) 2011 Nikolay Nemshilov
+ */
+var R       = RightJS,
+    $       = RightJS.$,
+    $w      = RightJS.$w,
+    Class   = RightJS.Class,
+    Input   = RightJS.Input,
+    Element = RightJS.Element;
+
+
+
+
+
+/**
+ * The main unit for the Tags widget
+ *
+ * Copyright (C) 2011 Nikolay Nemshilov
+ */
+var Tags = new Widget('INPUT', {
+  extend: {
+    version: '2.2.1',
+
+    EVENTS: $w('add remove'),
+
+    Options: {
+      tags:         [],    // the tags list
+      vertical:     false, // use a vertical tags list
+
+      allowNew:     true,  // allow new tags to be created
+      nocase:       true,  // caseinsensitive
+      autocomplete: true,  // autocomplete the user's input
+
+      separator:    ',',   // the tokens separator
+
+      cssRule: 'input[data-tags]' // the autoinitialization css-rule
+    },
+
+    /**
+     * Rescans and initializes the input elements in the area
+     *
+     * @param {Wrapper} optional scope
+     * @return void
+     */
+    rescan: function(scope) {
+      $(scope || document).find(Tags.Options.cssRule).each(function(input) {
+        if (!(input instanceof Tags)) {
+          input = new Tags(input);
+        }
+      });
+    }
+  },
+
+  /**
+   * Basic constructor
+   *
+   * @param {Input} element
+   * @param {Object} options
+   * @return void
+   */
+  initialize: function(element, options) {
+    // trying to extract a plain list of tags
+    var tags = R(R(''+ $(element).get('data-tags')).trim());
+
+    if (tags.startsWith('[') && tags.endsWith(']')) {
+      if (!options) { options = {}; }
+      options.tags = new Function('return '+tags)();
+    }
+
+    this
+      .$super('tags', element)
+      .setOptions(options);
+
+    if (RightJS.Browser.OLD) {
+      this.setStyle({color: this.getStyle('backgroundColor')});
+    }
+
+    this.container = new Element('div', {'class': 'rui-tags'}).insertTo(this, 'after');
+
+    this.list      = new Tags.List(this);
+    this.input     = new Tags.Input(this);
+    this.completer = new Tags.Completer(this);
+
+    this.onFocus(function() { this.input.focus(); });
+
+    // reinitializing with default values
+    this.setValue(this._.value);
+  },
+
+  /**
+   * Overloading the method so that it updated the visible list as well
+   *
+   * @param {String|Array} string tokens
+   * @return {Tags} this
+   */
+  setValue: function(tags) {
+    if (isString(tags)) {
+      tags = R(tags.split(this.options.separator))
+        .map('trim').reject('blank');
+    }
+
+    // merging the tags into the known list
+    this.options.tags = R(this.options.tags).merge(tags);
+
+    // repopulating the list
+    this.list.setTags(tags);
+
+    // setting the internal value
+    return this.$super(tags.join(this.options.separator + ' '));
+  }
+});
+
+
+/**
+ * The tags list element custom wrapper
+ *
+ * Copyright (C) 2011 Nikolay Nemshilov
+ */
+Tags.List = new Class(Element, {
+
+  /**
+   * Constructor, creates the list and places where it supposed to be
+   *
+   * @param {Tags} tags instance
+   * @return void
+   */
+  initialize: function(main) {
+    this.main  = main;
+
+    this.$super('ul', {'class': 'list'});
+    this.insertTo(main.container);
+
+    if (this.main.options.vertical) {
+      this.addClass('vertical');
+    }
+
+    function double_styles(name) {
+      return main.getStyle(name).replace(
+        /[\d\.]+/, function(m) { return parseFloat(m) * 2; }
+      );
+    }
+
+    this.setStyle({
+      fontSize:      main.getStyle('fontSize'),
+      fontFamily:    main.getStyle('fontFamily'),
+      fontWeight:    main.getStyle('fontWeight'),
+      letterSpacing: main.getStyle('letterSpacing'),
+      paddingTop:    double_styles('borderTopWidth'),
+      paddingLeft:   double_styles('borderLeftWidth'),
+      paddingRight:  double_styles('borderRightWidth'),
+      paddingBottom: main.getStyle('borderBottomWidth')
+    });
+
+    // frakking Opera '0em' sizes bug fallback
+    if (main.getStyle('fontSize') === '0em') {
+      this.setStyle({fontSize: '1em'});
+    }
+
+    this.setWidth(main.size().x);
+    this.reposition(true);
+
+    this.onClick(this._click);
+  },
+
+  /**
+   * Sets a list of tags
+   *
+   * @param {Array} tags
+   * @return {Tags.List} this
+   */
+  setTags: function(tags) {
+    tags.uniq().each(this.clean().addTag, this);
+
+    return this;
+  },
+
+  /**
+   * Returns a list of tags on the list
+   *
+   * @return {Array} of tokens
+   */
+  getTags: function() {
+    return this.find('div.text').map('text');
+  },
+
+  /**
+   * adds the tag to the list
+   *
+   * @param {String} tag
+   * @return {Tags.List} this
+   */
+  addTag: function(tag) {
+    if (this._allowed(tag)) {
+      this
+        .append(
+          '<li>'+
+            '<div class="text">'+ R(tag).trim() +'</div>'+
+            '<div class="close">&times;</div>' +
+          '</li>'
+        ).reposition();
+
+      this.main.fire('add', {tag: tag});
+    }
+
+    this.main._.value = this.getTags().join(
+      this.main.options.separator + ' '
+    );
+
+    return this;
+  },
+
+  /**
+   * Removes the last item from the list
+   *
+   * @return {Tags.List} this
+   */
+  removeLast: function() {
+    var item = this.find('li').last();
+
+    if (item) {
+      this._remove(item);
+    }
+
+    return this;
+  },
+
+  /**
+   * Adjusts the original input field size and
+   * places the list right above it,
+   * in case if the list will start folding
+   *
+   * @return {Tags.List} this
+   */
+  reposition: function(force) {
+    var size = this.size().y, main = this.main.size().y, style;
+
+    if (size !== main || force === true) {
+      this.main.setHeight(size);
+
+      style = this._.style;
+
+      style.top  = '0px';
+      style.left = '0px';
+
+      size = this.position();
+      main = this.main.position();
+
+      style.top  = main.y - size.y + 'px';
+      style.left = main.x - size.x + 'px';
+    }
+
+    return this;
+  },
+
+// private
+
+  // catches the clicks on the list
+  _click: function(event) {
+    if (event.target.hasClass('close')) {
+      this._remove(event.target.parent());
+    } else {
+      this.main.input.focus();
+    }
+  },
+
+  // checks if the tag is allowed to be added to the list
+  _allowed: function(tag) {
+    var tags    = this.getTags(),
+        options = this.main.options,
+        casesensitive = !options.nocase;
+
+    return !(casesensitive ? tags.include(tag) :
+      tags.map('toLowerCase').include(tag.toLowerCase())
+    ) && (
+      options.allowNew || (
+        casesensitive ? tags.include(tag) :
+          options.tags.map('toLowerCase').include(tag.toLowerCase())
+      )
+    );
+  },
+
+  // removes an item out of the list
+  _remove: function(item) {
+    var tag = item.first('div.text').text();
+
+    this.main.setValue(
+      this.getTags().without(tag)
+    );
+
+    this.main.fire('remove', {tag: tag});
+  }
+
+});
+
+/**
+ * The 'fake' input field element
+ *
+ * Copyright (C) 2011 Nikolay Nemshilov
+ */
+Tags.Input = new Class(Input, {
+
+  /**
+   * Constructor
+   *
+   * @param {Tabs} the main object
+   * @return void
+   */
+  initialize: function(main) {
+    this.main = main;
+    this.list = main.list;
+
+    this.$super({type: 'text', size: 1});
+    this.onKeydown(this._keydown);
+    this.onKeyup(this._keyup);
+    this.onBlur(this._blur);
+    this.insertTo(main.list);
+
+    // used to dynamically measure the size of the field
+    this.meter = new Element('div', {
+      'class': 'meter',
+      'style': {
+        whiteSpace: 'nowrap',
+        position:   'absolute',
+        left:       '-99999em'
+      }
+    }).insertTo(this, 'after');
+  },
+
+  /**
+   * Inserting itself into the tags list on the 'focus' call
+   *
+   * @return {Tags.Input} this
+   */
+  focus: function() {
+    this.main.list.append(this, this.meter).reposition();
+    return this.$super();
+  },
+
+  /**
+   * Resets the input field state
+   *
+   * @return {Tags.Input} this
+   */
+  reset: function() {
+    this.remove();
+    this.meter.remove();
+    this.list.reposition();
+    this._.value = '';
+
+    return this;
+  },
+
+// private
+
+  _keydown: function(event) {
+    if (event.keyCode === 8 && this._.value === '') {
+      this.list.removeLast(); // deleting the last tag with backspace
+      this.focus();
+    } else if (event.keyCode === 13) {
+      event.preventDefault(); // preventing the for to go off on Enter
+    }
+  },
+
+  _keyup: function(event) {
+    if (!R([9, 27, 37, 38, 39, 40, 13]).include(event.keyCode)) {
+      if (this._.value.indexOf(this.main.options.separator) !== -1) {
+        this._add();
+        this.focus();
+      } else {
+        this._resize();
+        this.main.completer.suggest(this._.value);
+      }
+    }
+  },
+
+  _blur: function(event) {
+    if (this.main.completer.hidden() && this._.value !== '') {
+      this._add();
+      this.reset();
+    }
+  },
+
+  // resizes the field to fit the text
+  _resize: function() {
+    this.meter.html(this._.value + 'xx');
+    this._.style.width = this.meter.size().x + 'px';
+    this.list.reposition();
+  },
+
+  // makes a tag out of the current value
+  _add: function() {
+    var value = this._.value.replace(this.main.options.separator, '');
+    this._.value = '';
+
+    if (!(/^\s*$/).test(value)) {
+      this.list.addTag(value);
+    }
+
+    if (this.main.completer.visible()) {
+      this.main.completer.hide();
+    }
+  }
+
+});
+
+/**
+ * The tags completer popup menu
+ *
+ * Copyright (C) 2011 Nikolay Nemshilov
+ */
+Tags.Completer = new Class(Element, {
+
+  extend: {
+    current: null // currently visible list reference
+  },
+
+  /**
+   * Constructor
+   *
+   * @param {Tags} main object
+   * @return void
+   */
+  initialize: function(main) {
+    this.main  = main;
+    this.list  = main.list;
+    this.input = main.input;
+
+    this.$super('ul', {'class': 'completer'});
+    this.addClass('rui-dd-menu');
+    this.insertTo(main.container);
+
+    this.onClick(this._click);
+  },
+
+  /**
+   * Starts the suggesting process
+   *
+   */
+  suggest: function(value) {
+    if (!(/^\s*$/).test(value) && this.main.options.autocomplete) {
+      var tags = this._filter(this.main.options.tags, value);
+
+      if (tags.length !== 0) {
+        this.html(tags.map(function(tag) {
+          return '<li>'+ tag.replace(value, '<b>'+ value + '</b>') +'</li>';
+        }).join(''));
+
+        this.picked = false;
+
+        return this.show();
+      }
+    }
+
+    return this.hide();
+  },
+
+  /**
+   * Overloading the method so it appeared right below the input field
+   *
+   * @return {Tags.Completer} this
+   */
+  show: function() {
+    var input  = this.input.dimensions(),
+        style  = this._.style,
+        pos;
+
+    style.display = 'block';
+
+    style.top  = '0px';
+    style.left = '0px';
+
+    pos = this.position();
+
+    style.left = input.left - pos.x + 'px';
+    style.top  = input.top  - pos.y + input.height + 'px';
+
+    return (Tags.Completer.current = this);
+  },
+
+  /**
+   * Hides the list of suggestions
+   *
+   * @return {Tags.Completer} this
+   */
+  hide: function() {
+    this._.innerHTML       = '';
+    this._.style.display   = 'none';
+
+    Tags.Completer.current = null;
+
+    return this;
+  },
+
+
+  /**
+   * Highlights the next item on the list
+   *
+   * @return {Tags.Completer} this
+   */
+  next: function() {
+    var item = this.first('.current');
+
+    if (item)  { item = item.next(); }
+    if (!item) { item = this.first(); }
+    if (item)  { item.radioClass('current'); }
+
+    return this;
+  },
+
+  /**
+   * Highlights the previous item on the list
+   *
+   * @return {Tags.Completer} this
+   */
+  prev: function() {
+    var item = this.first('.current');
+
+    if (item)  { item = item.prev(); }
+    if (!item) { item = this.children().last(); }
+    if (item)  { item.radioClass('current'); }
+
+    return this;
+  },
+
+  /**
+   * Copies the picked item data into the input field
+   * and hides the list
+   *
+   * @return {Tags.Completer} this
+   */
+  done: function() {
+    var item = this.first('.current');
+
+    if (item) {
+      this.list.addTag(item.text());
+      this.input.reset().focus();
+    }
+
+    return this.hide();
+  },
+
+// private
+
+  // handles mouse clicks on the list
+  _click: function(event) {
+    var item = event.find('li');
+
+    if (item) {
+      item.radioClass('current');
+    }
+
+    this.done();
+  },
+
+  // finds an appropriate list of tags for the suggestion
+  _filter: function(tags, value) {
+    var used   = this.list.getTags(),
+        nocase = this.main.options.nocase;
+
+    if (nocase) {
+      used  = used.map('toLowerCase');
+      value = value.toLowerCase();
+    }
+
+    return tags.filter(function(tag) {
+      var low_tag = nocase ? tag.toLowerCase() : tag;
+
+      return low_tag.indexOf(value) !== -1 && !used.include(low_tag);
+    });
+  }
+});
+
+/**
+ * Document - on-load hook
+ *
+ * Copyright (C) 2011 Nikolay Nemshilov
+ */
+$(document).on({
+  /**
+   * Triggers autoinitialization when the document is loaded
+   *
+   * @return void
+   */
+  ready: function() {
+    Tags.rescan();
+  },
+
+  /**
+   * Handles the suggestions list navigation
+   *
+   * @param {Event} event
+   * @return void
+   */
+  keydown: function(event) {
+    var list = Tags.Completer.current,
+        keys = {
+          13: 'done', // Enter
+          27: 'hide', // Escape
+          38: 'prev', // Up
+          40: 'next'  // Down
+        };
+
+    if (list !== null && event.keyCode in keys) {
+      event.stop();
+      list[keys[event.keyCode]]();
+    }
+  },
+
+  /**
+   * Hides the completer menu by an outer click
+   *
+   * @param {Event} click
+   * @return void
+   */
+  click: function(event) {
+    if (Tags.Completer.current) {
+      Tags.Completer.current.hide();
+    }
+  }
+
+});
+
+var embed_style = document.createElement('style'),                 
+    embed_rules = document.createTextNode("*.rui-dd-menu, *.rui-dd-menu li{margin:0;padding:0;border:none;background:none;list-style:none;font-weight:normal;float:none} *.rui-dd-menu{display:none;position:absolute;z-index:9999;background:white;border:1px solid #BBB;border-radius:.2em;-moz-border-radius:.2em;-webkit-border-radius:.2em;box-shadow:#DDD .2em .2em .4em;-moz-box-shadow:#DDD .2em .2em .4em;-webkit-box-shadow:#DDD .2em .2em .4em} *.rui-dd-menu li{padding:.2em .4em;border-top:none;border-bottom:none;cursor:pointer} *.rui-dd-menu li.current{background:#DDD} *.rui-dd-menu li:hover{background:#EEE}dl.rui-dd-menu dt{padding:.3em .5em;cursor:default;font-weight:bold;font-style:italic;color:#444;background:#EEE}dl.rui-dd-menu dd li{padding-left:1.5em}div.rui-tags,div.rui-tags ul.list,div.rui-tags ul.list *{position:static;top:auto;left:auto;right:auto;bottom:auto;float:none;margin:0;padding:0;border:none;background:none;display:block}input[data-tags],input.rui-tags{color:transparent;color:rgba(0,0,0,0)}div.rui-tags{position:absolute;display:inline}div.rui-tags ul.list{position:absolute;overflow:hidden;min-height:1.3em}div.rui-tags ul.list li{display:inline-block; *display:inline; *zoom:1;position:relative;cursor:default;margin-right:.1em;margin-bottom:.1em;padding:0 .5em;padding-right:1.1em;background:#ddd;border-radius:.2em;-moz-border-radius:.2em;-webkit-border-radius:.2em;vertical-align:top}div.rui-tags ul.list li div.text{position:inline}div.rui-tags ul.list li div.close{margin-left:.25em;cursor:pointer;font-family:Arial;font-weight:normal;opacity:0.5;position:absolute;right:.25em;top:0.04em}div.rui-tags ul.list li div.close:hover{opacity:1}div.rui-tags ul.vertical li{display:block}div.rui-tags ul.list input{width:auto;height:auto;display:inline-block; *display:inline; *zoom:1;width:1em;outline:none;vertical-align:top;font-family:inherit;font-size:inherit;font-weight:inherit;letter-spacing:inherit}");      
+                                                                   
+embed_style.type = 'text/css';                                     
+document.getElementsByTagName('head')[0].appendChild(embed_style); 
+                                                                   
+if(embed_style.styleSheet) {                                       
+  embed_style.styleSheet.cssText = embed_rules.nodeValue;          
+} else {                                                           
+  embed_style.appendChild(embed_rules);                            
+}                                                                  
+
+
+return Tags;
+})(RightJS);