right-rails 0.3.0

data/javascripts/right-slider-src.js

@@ -0,0 +1,291 @@
+/**
+ * RightJS UI Slider unit (http://rightjs.org/ui/slider)
+ *
+ * Copyright (C) 2009 Nikolay V. Nemshilov aka St.
+ */
+if (!self.RightJS || !self.Draggable) throw "Gimme RightJS w/ DnD";
+
+/**
+ * RightJS UI Slider unit
+ *
+ * Copyright (C) 2009 Nikolay V. Nemshilov aka St.
+ */
+var Slider = new Class(Observer, {
+  extend: {
+    EVENTS: $w('change'),
+    
+    Options: {
+      min:       0,     // the min value
+      max:       100,   // the max value
+      snap:      0,     // the values threshold
+      value:     null,  // start value, if null then the min value will be used
+      direction: 'x',   // slider direction 'x', 'y'
+      update:    null,  // reference to an element to update
+      round:     0      // the number of symbols after the decimal pointer
+    },
+    
+    rescan: function() {
+      $$('div.right-slider').each(function(element) {
+        if (!element._slider) {
+          new Slider(element);
+        }
+      });
+    }
+  },
+  
+  /**
+   * basic constructor
+   * USAGE:
+   *   new Slider('element-id'[, {options}]);
+   *   new Slider({options});
+   *
+   * @param mixed slider element reference or options
+   * @param Object options
+   */
+  initialize: function() {
+    var args = $A(arguments);
+    this.element = (args[0] && !isHash(args[0])) ? $(args.shift()) : this.build();
+    
+    this.$super(isHash(args[0]) ? args[0] : eval('('+this.element.get('data-slider-options')+')'));
+    
+    if (this.options.update) this.assignTo(this.options.update);
+    
+    this.element._slider = this.init();
+  },
+  
+  // basic desctructor
+  destroy: function() {
+    this.handle.undoDraggable();
+    delete(this.element._slider);
+    return this;
+  },
+  
+  /**
+   * The value setter
+   *
+   * NOTE: will get snapped according to the options
+   *
+   * @param mixed string or number value
+   * @return Slider this
+   */
+  setValue: function(value) {
+    var value = isString(value) ? value.toFloat() : value;
+    
+    // rounding the value according to the options
+    var base = Math.pow(10, this.options.round);
+    value = (value * base).round() / base;
+    
+    // checking the value constraings
+    if (this.options.snap) {
+      var snap = this.options.snap;
+      var diff = value % snap;
+      value = diff < snap/2 ? value - diff : value - diff + snap;
+    }
+    if (value < this.options.min) value = this.options.min;
+    if (value > this.options.max) value = this.options.max;
+    
+    this.moveTo(value);
+    
+    if (value !== this.value) {
+      this.fire('change', this.value = value);
+    }
+    
+    return this;
+  },
+  
+  /**
+   * Returns the value
+   *
+   * @return Float number
+   */
+  getValue: function() {
+    return this.value;
+  },
+  
+  /**
+   * Sets the minimal value and rebuilds the dimensions cache
+   *
+   * @param Number optional value to reset
+   * @return Slider this
+   */
+  reset: function(value) {
+    return this.precalc().setValue([value, this.options.value, this.options.min].compact()[0]);
+  },
+  
+  /**
+   * Inserts the widget into the element
+   *
+   * @param mixed element reference
+   * @param String optional position
+   * @return Slider this
+   */
+  insertTo: function(element, position) {
+    this.element.insertTo(element, position);
+    return this.reset(this.value);
+  },
+  
+  /**
+   * Assigns the slider to feed an input element on change
+   *
+   * @param mixed an input element reference
+   * @return Slider this
+   */
+  assignTo: function(element) {
+    var assign  = function(element, value) {
+      if (element = $(element)) {
+        if (value === undefined || value === null) value = '';
+        element[element.setValue ? 'setValue' : 'update'](''+value);
+      }
+    }.curry(element);
+    
+    var connect = function(element, object) {
+      var element = $(element);
+      if (element && element.onChange) {
+        element.onChange(function() {
+          this.setValue(element.value);
+        }.bind(object));
+      }
+    }.curry(element);
+    
+    if ($(element)) {
+      assign(this.value);
+      connect(this);
+    } else {
+      document.onReady(function() {
+        assign(this.value);
+        connect(this);
+      }.bind(this));
+    }
+    
+    return this.onChange(assign);
+  },
+  
+// protected
+  
+  // inits the slider handle and resets the whole thing
+  init: function() {
+    this.handle = this.element.first('div.right-slider-handle')
+      .makeDraggable({
+        onBefore: this.prepare.bind(this),
+        onDrag: this.dragged.bind(this)
+      });
+    
+    // make it jump to the position
+    this.element.onClick(this.clicked.bind(this));
+      
+    if (this.options.direction == 'y') {
+      this.element.addClass('right-slider-vertical');
+    } else {
+      this.options.direction = this.element.hasClass('right-slider-vertical') ? 'y' : 'x';
+    }
+    
+    // fixing the manual position calculations for Konqueror
+    if (this.konqFix = (RightJS.version < '1.5.0' && !this.handle.getBoundingClientRect)) {
+      var parent = this.element;
+      var old_dims = this.handle.dimensions;
+      this.handle.dimensions = function() {
+        var dims = old_dims.call(this);
+        var subset = parent.dimensions();
+        
+        dims.top  += subset.top;
+        dims.left += subset.left;
+        
+        return dims;
+      };
+    }
+    
+      
+    return this.reset();
+  },
+  
+  // builds the slider prorgrammatically
+  build: function() {
+    return $E('div', {'class': 'right-slider'}).insert($E('div', {'class': 'right-slider-handle'}));
+  },
+  
+  // callback for the eleemnt on-click event to make the slider to jump there
+  clicked: function(event) {
+    event.stop();
+    this.precalc().moveTo(this.value);
+    
+    var position = event.position();
+    var element  = this.dimensions;
+    
+    var position = (this.horizontal ? position.x - element.left : position.y - element.top) - this.offset;
+    
+    if (position > this.space) position = this.space;
+    else if (position < 0)     position = 0;
+    
+    this.setPosition(position);
+  },
+  
+  // callback for the element dragg
+  dragged: function(draggable, event) {
+    this.setPosition(draggable.element.style[this.horizontal ? 'left' : 'top'].toFloat());
+  },
+  
+  // callback for the draggable before event
+  prepare: function(draggable) {
+    // moving the slider to the beginning position
+    this.precalc().moveTo(this.value);
+    
+    var offset    = this.offset;
+    var element   = this.dimensions;
+    var options   = draggable.options;
+    options.range = {};
+    
+    // calculating the ranges
+    if ((options.axis = this.options.direction) == 'x') {
+      options.range.x = [element.left + offset, element.left + element.width - offset];
+      if (this.konqFix) options.range.x[0] -= element.left;
+    } else {
+      options.range.y = [element.top + offset, element.top  + element.height - offset];
+      if (this.konqFix) options.range.y[0] -= element.top;
+    }
+    
+    // calculating the snapping range
+    if (this.options.snap) {
+      options.snap = this.space / (this.options.max - this.options.min) * this.options.snap;
+    }
+  },
+  
+  // sets the slider value by the handle position
+  setPosition: function(position) {
+    if (!this.horizontal)  position = this.space - position;
+    var value    = position / this.space * (this.options.max - this.options.min) + this.options.min;
+    
+    this.setValue(value);
+  },
+  
+  // moves the slider to the given position
+  moveTo: function(value) {
+    var position = this.space / (this.options.max - this.options.min) * (value - this.options.min);
+    
+    if (!this.horizontal) position = this.space - position;
+    
+    this.handle.style[this.horizontal ? 'left' : 'top'] = position + 'px';
+    
+    return this;
+  },
+  
+  // precalculates dimensions, direction and offset for further use
+  precalc: function() {
+    var handle      = this.handle.setStyle({left:'0', top:'0'}).dimensions();
+    
+    this.dimensions = this.element.dimensions();
+    this.horizontal = this.options.direction == 'x';
+    this.offset     = this.horizontal ? handle.left - this.dimensions.left : handle.top - this.dimensions.top;
+    this.space      = (this.horizontal ? this.dimensions.width - handle.width : this.dimensions.height - handle.height) - this.offset * 2;
+    
+    return this;
+  }
+});
+
+/**
+ * Document onReady hook for sliders
+ *
+ * Copyright (C) Nikolay V. Nemshilov aka St.
+ */
+document.onReady(Slider.rescan);
+
+document.write("<style type=\"text/css\">div.right-slider,div.right-slider-handle{margin:0;padding:0;border:none;background:none}div.right-slider{height:0.4em;width:20em;border:1px solid #CCC;background:#EEE;-moz-border-radius:.2em;-webkit-border-radius:.2em;position:relative;margin:.6em 0;display:inline-block;*display:inline;*zoom:1;vertical-align:middle}div.right-slider-handle{position:absolute;left:0;top:0;cursor:pointer;width:4pt;height:1em;margin-top:-0.4em;margin-left:0.1em;background:#CCC;border:1px solid #AAA;-moz-border-radius:.2em;-webkit-border-radius:.2em}div.right-slider-vertical{height:10em;width:0.4em;margin:0 .3em}div.right-slider-vertical div.right-slider-handle{margin:0;margin-left:-0.4em;margin-top:0.1em;height:4pt;width:1em}</style>");

data/javascripts/right-slider.js

@@ -0,0 +1,7 @@
+/**
+ * RightJS UI Slider unit (http://rightjs.org/ui/slider)
+ *
+ * Copyright (C) 2009 Nikolay V. Nemshilov aka St.
+ */
+if (!self.RightJS || !self.Draggable) throw "Gimme RightJS w/ DnD";
+eval((function(s,d){for(var i=d.length-1;i>-1;i--)if(d[i])s=s.replace(new RegExp(i,'g'),d[i]);return s})("14 50=78 83(Observer,{extend:{EVENTS:$w('69'),Options:{32:0,48:100,37:0,21:65,25:'x',40:65,53:0},67:9(){$$('30.17-12').each(9(e){if(!e._12)78 50(e)})}},75ialize:9(){14 a=$A(arguments);7.13=(a[0]&&!70(a[0]))?$(a.shift()):7.74();7.$super(70(a[0])?a[0]:eval('('+7.13.get('data-12-8')+')'));if(7.8.40)7.54(7.8.40);7.13._12=7.75()},destroy:9(){7.16.undo82();delete(7.13._12);18 7},24:9(v){14 v=isString(v)?v.59():v;14 b=Math.pow(10,7.8.53);v=(v*b).53()/b;if(7.8.37){14 s=7.8.37;14 d=v % s;v=d<s/2?v-d:v-d+s}if(v<7.8.32)v=7.8.32;if(v>7.8.48)v=7.8.48;7.39(v);if(v!==7.21)7.fire('69',7.21=v);18 7},getValue:9(){18 7.21},55:9(v){18 7.35().24([v,7.8.21,7.8.32].compact()[0])},52:9(e,p){7.13.52(e,p);18 7.55(7.21)},54:9(b){14 a=9(e,v){if(e=$(e)){if(v===undefined||v===65)v='';e[e.24?'24':'40'](''+v)}}.72(b);14 c=9(e,o){14 e=$(e);if(e&&e.44)e.44(9(){7.24(e.21)}.45(o))}.72(b);if($(b)){a(7.21);c(7)}51 42.64(9(){a(7.21);c(7)}.45(7));18 7.44(a)},75:9(){7.16=7.13.first('30.17-12-16').make82({onBefore:7.56.45(7),onDrag:7.63.45(7)});7.13.onClick(7.61.45(7));if(7.8.25=='y')7.13.add83('17-12-29');51 7.8.25=7.13.has83('17-12-29')?'y':'x';if(7.46=(RightJS.version<'1.5.0'&&!7.16.getBoundingClientRect)){14 p=7.13;14 o=7.16.11;7.16.11=9(){14 d=o.call(7);14 s=p.11();d.22+=s.22;d.19+=s.19;18 d}}18 7.55()},74:9(){18 $E('30',{'71':'17-12'}).insert($E('30',{'71':'17-12-16'}))},61:9(a){a.s22();7.35().39(7.21);14 p=a.43();14 e=7.11;14 p=(7.15?p.x-e.19:p.y-e.22)-7.41;if(p>7.28)p=7.28;51 if(p<0)p=0;7.33(p)},63:9(d,e){7.33(d.13.49[7.15?'19':'22'].59())},56:9(d){7.35().39(7.21);14 o=7.41;14 e=7.11;14 a=d.8;a.36={};if((a.axis=7.8.25)=='x'){a.36.x=[e.19+o,e.19+e.31-o];if(7.46)a.36.x[0]-=e.19}51{a.36.y=[e.22+o,e.22+e.27-o];if(7.46)a.36.y[0]-=e.22}if(7.8.37)a.37=7.28/(7.8.48-7.8.32)*7.8.37},33:9(p){if(!7.15)p=7.28-p;14 v=p/7.28*(7.8.48-7.8.32)+7.8.32;7.24(v)},39:9(v){14 p=7.28/(7.8.48-7.8.32)*(v-7.8.32);if(!7.15)p=7.28-p;7.16.49[7.15?'19':'22']=p+'px';18 7},35:9(){14 h=7.16.setStyle({19:'0',22:'0'}).11();7.11=7.13.11();7.15=7.8.25=='x';7.41=7.15?h.19-7.11.19:h.22-7.11.22;7.28=(7.15?7.11.31-h.31:7.11.27-h.27)-7.41*2;18 7}});42.64(50.67);42.write(\"<49 type=\\\"text/css\\\">30.17-12,30.17-12-16{23:0;padding:0;26:76;34:76}30.17-12{27:0.62;31:20em;26:81 73 #77;34:#EEE;-79-26-38:.58;-66-26-38:.58;43:relative;23:.6em 0;60:68-block;*60:68;*zoom:1;29-align:middle}30.17-12-16{43:absolute;19:0;22:0;cursor:pointer;31:80;27:57;23-22:-0.62;23-19:0.57;34:#77;26:81 73 #AAA;-79-26-38:.58;-66-26-38:.58}30.17-12-29{27:10em;31:0.62;23:0 .3em}30.17-12-29 30.17-12-16{23:0;23-19:-0.62;23-22:0.57;27:80;31:57}</49>\");",",,,,,,,this,options,function,,dimensions,slider,element,var,horizontal,handle,right,return,left,,value,top,margin,setValue,direction,border,height,space,vertical,div,width,min,setPosition,background,precalc,range,snap,radius,moveTo,update,offset,document,position,onChange,bind,konqFix,_slider,max,style,Slider,else,insertTo,round,assignTo,reset,prepare,1em,2em,toFloat,display,clicked,4em,dragged,onReady,null,webkit,rescan,inline,change,isHash,class,curry,solid,build,init,none,CCC,new,moz,4pt,1px,Draggable,Class".split(",")));

data/javascripts/right-sortable-src.js

@@ -0,0 +1,221 @@
+/**
+ * Sortable feature for RightJS (requires the Drag'n'Drop feature)
+ *
+ * See http://rightjs.org/ui/sortable
+ *
+ * Copyright (C) Nikolay V. Nemshilov aka St.
+ */
+if (!Draggable) throw "Gimme Draggable";
+
+/**
+ * The Sortable unit
+ *
+ * Copyright (C) Nikolay V. Nemshilov aka St.
+ */
+var Sortable = new Class(Observer, {
+  extend: {
+    EVENTS: $w('update'),
+    
+    Options: {
+      direction:  'auto',     // 'auto', 'vertical', 'horizontal', 'x', 'y'
+                  
+      tags:       'li',       // the list items tag name
+                  
+      url:        null,       // the Xhr requests url address, might contain the '%{id}' placeholder
+      method:     'put',      // the Xhr requests method
+                  
+      Xhr:        {},         // additional Xhr options
+                  
+      idParam:    'id',       // the id value name
+      posParam:   'position', // the position value name
+      parseId:    true,       // if the id attribute should be converted into an integer before sending
+                  
+      relName:    'sortable'  // the auto-discovery feature key
+    },
+    
+    // scans through the page for auto-discoverable sortables
+    rescan: function() {
+      var key = Sortable.Options.relName;
+      var reg = new RegExp('^'+key+'\\[(.+?)\\]');
+      
+      $$('ul[rel^="'+key+'"], ol[rel^="'+key+'"]').each(function(element) {
+        if (!element._sortable) {
+          var data    = element.get('data-'+key+'-options');
+          var options = eval('('+data+')') || {};
+          
+          var url  = element.get('rel').match(reg);
+          if (url) {
+            options.url = url[1];
+          }
+          
+          new Sortable(element, options);
+        }
+      });
+    }
+  },
+  
+  /**
+   * basic constructor
+   *
+   * @param mixed element reference
+   * @param Object options
+   */
+  initialize: function(element, options) {
+    this.element = $(element);
+    this.$super(options);
+    
+    this.element._sortable = this.init().onUpdate('tryXhr');
+  },
+  
+  // detaches all the events out of the elemnts
+  destroy: function() {
+    this.getItems.each(function(item) {
+      item.undoDraggable().undoDroppable();
+    });
+    delete(this.element._sortable);
+    
+    return this;
+  },
+  
+  // callback for the moved elements
+  moved: function(element) {
+    var items    = this.getItems();
+    var position = items.indexOf(element);
+    
+    if (position > -1 && position != element.current_position) {
+      this.fire('update', element, position);
+      
+      items.each(function(item, index) {
+        item.current_position = index;
+      });
+    }
+  },
+  
+  // tries to send an Xhr request about the element relocation
+  tryXhr: function(element, position) {
+    if (this.options.url) {
+      var url = this.options.url, params = {};
+      
+      // building the Xhr request options
+      var options = Object.merge({
+        method: this.options.method,
+        params: {}
+      }, this.options.Xhr);
+      
+      // grabbing the id
+      var id = element.id || '';
+      if (this.options.parseId && id) {
+        id = id.match(/\d+/) || '';
+      }
+      
+      // assigning the parameters
+      if (url.include('%{id}')) {
+        url = url.replace('%{id}', id);
+      } else {
+        params[this.options.idParam] = id;
+      }
+      params[this.options.posParam] = position;
+      
+      // merging the params with possible Xhr params
+      if (isString(options.params)) options.params += '&'+Object.toQueryString(params);
+      else options.params = Object.merge(options.params, params);
+      
+      // calling the server
+      Xhr.load(url, options);
+    }
+  },
+  
+// protected
+  
+  // inits the sortable unit
+  init: function() {
+    var items = this.getItems();
+    
+    if (items.length) {
+      var callback  = this.moved.bind(this);
+      
+      // guessing the direction
+      var direction = this.options.direction != 'auto' ? this.options.direction :
+        ['left', 'right'].include(items[0].getStyle('float')) ? 'x' : 'y';
+      
+      // the draggable options
+      var drag_options = {
+        range:  this.element,
+        axis:   direction,
+        revert: true,
+        revertDuration: 0,
+        onStop: function() {
+          callback(this.element);
+        }
+      };
+      
+      // the droppable options
+      var drop_options = {
+        overlap:      direction,
+        containtment: items,
+        onHover: function(draggable) {
+          // calculating the swapping direction
+          var drag_dims = draggable.element.dimensions();
+          var this_dims = this.element.dimensions();
+          
+          var before = draggable.axisY ? (
+              drag_dims.top > this_dims.top
+            ) : (
+              drag_dims.left > this_dims.left
+            );
+          
+          this.element.insert(draggable.clone, before ? 'before' : 'after');
+        }
+      };
+      
+      // processing the items
+      items.each(function(item, index) {
+        item.makeDraggable(drag_options).makeDroppable(drop_options).current_position = index;
+      });
+    }
+    
+    return this;
+  },
+  
+  // returns the list of the items
+  getItems: function() {
+    return this.element.subNodes(this.options.tags);
+  }
+  
+  
+});
+
+/**
+ * Document level hooks for sortables
+ *
+ * Copyright (C) Nikolay V. Nemshilov aka St.
+ */
+document.onReady(Sortable.rescan);
+
+/**
+ * Element level features for the Sortable unit
+ *
+ * Copyright (C) Nikolay V. Nemshilov aka St.
+ */
+Element.addMethods({
+  /**
+   * Tries to make a sortable unit out of the element
+   *
+   * @param Object options
+   * @return Element this
+   */
+  makeSortable: function(options) {
+    new Sortable(this, options);
+    return this;
+  },
+  
+  /**
+   * Destroy the sortable functionality on the element
+   *
+   * @return Element this
+   */
+  undoSortable: function() {
+    if (this._sortable) this._sortable.destroy();
+    return this;
+  }
+});

data/javascripts/right-sortable.js

@@ -0,0 +1,9 @@
+/**
+ * Sortable feature for RightJS (requires the Drag'n'Drop feature)
+ *
+ * See http://rightjs.org/ui/sortable
+ *
+ * Copyright (C) Nikolay V. Nemshilov aka St.
+ */
+if (!Draggable) throw "Gimme Draggable";
+eval((function(s,d){for(var i=d.length-1;i>-1;i--)if(d[i])s=s.replace(new RegExp(i,'g'),d[i]);return s})("5 9=26 Class(Observer,{extend:{EVENTS:$w('28'),23:{13:'39',37:'li',19:null,15:'put',32:{},21:'id',18:'position',22:40,20:'sortable'},29:3(){5 k=9.23.20;5 r=26 RegExp('^'+k+'\\\\[(.+?)\\\\]');$$('ul[35^=\"'+k+'\"], ol[35^=\"'+k+'\"]').17(3(e){if(!e.8){5 d=e.42('data-'+k+'-4');5 o=eval('('+d+')')||{};5 u=e.42('35').31(r);if(u)o.19=u[1];26 9(e,o)}})}},38ialize:3(e,o){2.6=$(e);2.$super(o);2.6.8=2.38().onUpdate('30')},24:3(){2.10.17(3(i){i.undo43().undo44()});delete(2.6.8);12 2},33:3(e){5 b=2.10();5 p=b.indexOf(e);if(p>-1&&p!=e.7){2.fire('28',e,p);b.17(3(a,i){a.7=i})}},30:3(e,a){if(2.4.19){5 u=2.4.19,p={};5 o=16.34({15:2.4.15,11:{}},2.4.32);5 i=e.id||'';if(2.4.22&&i)i=i.31(/\\d+/)||'';if(u.25('%{id}'))u=u.replace('%{id}',i);36 p[2.4.21]=i;p[2.4.18]=a;if(is45(o.11))o.11+='&'+16.toQuery45(p);36 o.11=16.34(o.11,p);32.load(u,o)}},38:3(){5 h=2.10();if(h.length){5 c=2.33.bind(2);5 e=2.4.13!='39'?2.4.13:['27','right'].25(h[0].42Style('float'))?'x':'y';5 f={range:2.6,axis:e,revert:40,revertDuration:0,onS41:3(){c(2.6)}};5 g={overlap:e,containtment:h,onHover:3(a){5 d=a.6.14();5 t=2.6.14();5 b=a.axisY?(d.41>t.41):(d.27>t.27);2.6.insert(a.clone,b?'before':'after')}};h.17(3(a,i){a.make43(f).make44(g).7=i})}12 2},10:3(){12 2.6.subNodes(2.4.37)}});document.onReady(9.29);Element.addMethods({make9:3(o){26 9(2,o);12 2},undo9:3(){if(2.8)2.8.24();12 2}});",",,this,function,options,var,element,current_position,_sortable,Sortable,getItems,params,return,direction,dimensions,method,Object,each,posParam,url,relName,idParam,parseId,Options,destroy,include,new,left,update,rescan,tryXhr,match,Xhr,moved,merge,rel,else,tags,init,auto,true,top,get,Draggable,Droppable,String".split(",")));