lsd_rails 0.1

data/Packages/lsd/Source/Relation.js

@@ -0,0 +1,397 @@
+/*
+---
+ 
+script: Relation.js
+ 
+description: An unsettable relation that dispatches options to specific widgets
+ 
+license: Public domain (http://unlicense.org).
+
+authors: Yaroslaff Fedin
+ 
+requires:
+  - LSD
+  - LSD.Module.Events
+
+provides: 
+  - LSD.Relation
+ 
+...
+*/
+
+!function() {
+  
+LSD.Relation = function(name, origin, options) {
+  this.name = name;
+  this.origin = origin;
+  if (this.$events) this.$events = Object.clone(this.$events);
+  this.onChange = this.onChange.bind(this);
+  this.options = {};
+  this.$options = [];
+  this.memo = {};
+  this.widgets = [];
+  this.target = origin;
+  origin.relations[name] = this;
+  if (options) this.setOptions(options);
+}
+
+LSD.Relation.prototype = Object.append({
+  
+  setOptions: function(options, unset) {
+    this.$options[unset ? 'erase' : 'include'](options);
+    var opts = Object.merge.apply(Object, [{}].concat(this.$options));
+    this.lastOptions = this.options;
+    this.options = opts;
+    if (options.target) this.memo.target = Options.target.call(this, options.target, true);
+    for (name in options) {
+      var setter = Options[name], value = options[name];
+      if (!setter || !setter.call) 
+        for (var i = 0, widget; widget = this.widgets[i++];) 
+          this.applyOption(widget, name, value, unset, setter);
+      else this.memo[name] = setter.call(this, value, !unset, this.memo[name]);
+    }
+    return this;
+  },
+  
+  applyOption: function(widget, name, value, unset, setter) {
+    if (setter) {
+      if (!setter.call && setter !== true) {
+        if (setter.process) {
+          if (setter.process.call) value = setter.process.call(this, value);
+          else value = widget[setter.process](value);
+        }
+        var method = setter[unset ? 'remove' : 'add'];
+        if (setter.iterate) {
+          var length = value.length;
+          if (length != null) for (var i = 0, j = value.length; i < j; i++) method.call(this, widget, value[i]);
+          else for (var i in value) method.call(this, widget, i, value[i])
+        } else method.call(this, widget, value);
+      }
+    } else {
+      widget.setOption(name, value, unset);
+    }
+  },
+  
+  applyOptions: function(widget, unset) {
+    for (var name in this.options)
+      this.applyOption(widget, name, this.options[name], unset, Options[name]);
+  },
+  
+  onChange: function(widget, state) {
+    return this[state ? 'onFind' : 'onLose'](widget);
+  },
+  
+  onFind: function(widget) {
+    if (widget == this) return;
+    this.add(widget);
+    this.applyOptions(widget);
+    this.fireEvent('add', widget);
+    this.origin.fireEvent('relate', [widget, this.name]);
+  },
+  
+  onLose: function(widget) {
+    if (widget == this) return;
+    this.origin.fireEvent('unrelate', [widget, this.name]);
+    if (this.remove(widget) === false) return;
+    this.fireEvent('remove', widget);
+    this.applyOptions(widget, true);
+  },
+  
+  add: function(widget) {
+    if (this.options.multiple) {
+      if (this.widgets.include(widget) > 1) return; 
+    } else {
+      this.widget = widget;
+      this.widgets = [widget];
+      this.origin[this.name] = widget;
+    }
+    delete this.empty;
+    this.fireEvent('fill');
+  },
+  
+  remove: function(widget) {
+    if (this.options.multiple) {
+      var index = this.widgets.indexOf(widget);
+      if (index == -1) return false;
+      this.widgets.splice(index, 1);
+      if (this.widgets.length) return;
+    } else {
+      if (this.widget != widget) return false;
+      delete this.widget;
+      delete this.origin[this.name];
+      this.widgets.splice(0, 1);
+    }
+    this.empty = true;
+    this.fireEvent('empty');
+  },
+  
+  proxy: function(widget) {
+    if (this.widget) return this.widget.appendChild(widget);
+    if (!this.proxied) {
+      this.proxied = [];
+      this.addEvent('fill:once', function() {
+        for (var proxied; proxied = this.proxied.shift();) this.widget.appendChild(proxied);
+      });
+    }
+    (this.proxied || (this.proxied = [])).push(widget);
+  },
+  
+  getSource: function() {
+    return this.options.source;
+  }
+}, Events.prototype);
+
+var Options = LSD.Relation.Options = {
+  selector: function(selector, state, memo) {
+    if (memo) memo[0].unwatch(memo[1], this.onChange);
+    if (state && this.target) {
+      if (selector.call) selector = selector.call(this.origin);
+      this.target.watch(selector, this.onChange);
+      return [this.target, selector];
+    }
+  },
+  
+  expectation: function(expectation, state, memo) {
+    if (memo) memo[0].unexpect(memo[1], this.onChange);
+    if (expectation.target && (state ? !this.target : this.targeted == expectation.target))
+      Options.target.call(this, expectation.target, state, this.memo.target);
+    if (state && this.target) {
+      if (expectation.call && !(expectation = expectation.call(this.origin))) return;
+      this.target.expect(expectation, this.onChange);
+      return [this.target, expectation];
+    }
+  },
+  
+  target: function(target, state, memo) {
+    if (target.call) target = target.call(this.origin);
+    if (this.targeted == target) return;
+    this.targeted = target;
+    if (memo) this.origin.removeEvents(memo);
+    var setting = Targets[target];
+    if (setting) {
+      var relation = this, events = Object.map(setting.events, function(value, event) {
+        return function(object) {
+          if (value) {
+            relation.target = object.nodeType == 9 ? object.body : object;
+            var selector = relation.options.selector, expectation = relation.options.expectation;
+            if (selector) Options.selector.call(relation, selector, true, relation.memo.selector);
+            if (expectation) Options.expectation.call(relation, expectation, true, relation.memo.expectation);
+          }
+        }
+      })
+      this.origin.addEvents(events);
+      if (setting.getter && !this.target) {
+        this.target = this.origin[setting.getter];
+        events[Object.keyOf(setting, true)](this.target)
+      }
+      return events;
+    } else {
+      if (this.origin[target]) this.target = this.origin[target];
+    }
+  },
+  
+  mutation: function(mutation, state, memo) {
+    if (memo) this.origin.removeMutation(mutation, memo);
+    if (state) {
+      this.origin.addMutation(mutation, this.getSource());
+      return this.options.source;
+    }
+  },
+  
+  proxy: function(condition, state, memo) {
+    if (state) {
+      var proxy = memo || {container: this.proxy.bind(this)};
+      proxy.condition = condition;
+      if (!memo) this.origin.addProxy(this.name, proxy);
+      return proxy;
+    } else {
+      this.origin.removeProxy(this.name, memo);
+    }
+  },
+
+  relay: function(events, state, memo) {
+    if (state) {
+      var origin = this.origin, relation = this, relay = Object.map(events, function(callback, event) {
+        return function(event) {
+          for (var widget = Element.get(event.target, 'widget'); widget; widget = widget.parentNode) {
+            if (relation.widgets.indexOf(widget) > -1) {
+              callback.apply(widget, arguments);
+              break;
+            }
+          }
+        };
+      });
+      var fillers = {
+        fill: function() { 
+          origin.addEvent('element', relay)
+        },
+        empty: function() {
+          origin.removeEvent('element', relay)
+        }
+      };
+      this.addEvents(fillers);
+      if (!this.empty) fillers.fill();
+      return fillers;
+    } else {
+      this.removeEvents(memo);
+      if (!this.empty) memo.empty();
+    }
+  },
+  
+  multiple: function(multiple, state, memo) {
+    if (multiple) {
+      this.origin[this.name] = this.widgets
+    } else {
+      delete this.origin[this.name];
+    }
+  },
+  
+  callbacks: function(events, state) {
+    for (var name in events) {
+      var event = events[name];
+      event = event.indexOf ? this.origin.bindEvent(event) : event.bind(this.origin);
+      this[state ? 'addEvent' : 'removeEvent'](name, event);
+    }
+  },
+  
+  through: function(name, state, memo) {
+    return LSD.Relation.Options.selector.call(this, '::' + name + '::' + (this.options.as || this.name), state, memo)
+  },
+  
+  traits: function(traits, state, memo) {
+    Object.each(traits, function(value, key) {
+      var name = key || value;  
+      var trait = LSD.Relation.Traits[name];
+      if (!trait) LSD.warn('Can not find LSD.Relation.Traits.' + name)
+      else this.setOptions(trait, !state);
+    }, this);
+  },
+  
+  origin: function(options) {
+    this.origin.setOptions(options, !state)
+  },
+  
+  scope: function(name, state, memo) {
+    if (memo) {
+      for (var i = 0, widget; widget = this.widgets[i++];) memo.callbacks.remove.call(this, widget);
+      this.origin.removeRelation(name, memo);
+    }
+    if (state) {
+      var self = this, relation = this.origin.relations[name], filter;
+      memo = {
+        callbacks: {
+          add: function(widget) {
+            widget.expect((filter = self.options.filter), self.onChange, true)
+          },
+          remove: function(widget) {
+            widget.unexpect(filter, self.onChange, true, true);
+          }
+        }
+      };
+      if (relation) for (var i = 0, widget; widget = relation.widgets[i++];) memo.callbacks.add.call(this, widget);
+      this.origin.addRelation(name, memo);
+      return memo;
+    }
+  },
+  
+  scopes: function(scopes, state, memo) {
+    for (var scope in scopes) {
+      var name = LSD.Relation.getScopeName(this.name, scope), relation = scopes[scope];
+      this.origin[state ? 'addRelation' : 'removeRelation'](name, relation);
+      var options = {};
+      if (!relation.scope) options.scope = this.name;
+      if (this.options.multiple) options.multiple = true;
+      this.origin[state ? 'addRelation' : 'removeRelation'](name, options);
+    }
+  },
+  
+  states: {
+    add: function(widget, states) {
+      var get = states.get, set = states.set, add = states.add, lnk = states.link, use = states.use;
+      if (get) for (var from in get) widget.linkState(this.origin, from, (get[from] === true) ? from : get[from]);
+      if (set) for (var to in set) this.origin.linkState(widget, to, (set[to] === true) ? to : set[to]);
+      if (use) for (var to in use) this.origin.addState(widget, to, (use[to] === true) ? to : use[to]);
+      if (add) for (var index in add) widget.addState(index, add[index]);
+      if (lnk) for (var to in lnk) widget.linkState(widget, to, (lnk[to] === true) ? to : lnk[to]);
+    },
+    remove: function(widget, states) {
+      var get = states.get, set = states.set, add = states.add, lnk = states.link, use = states.use;
+      if (get) for (var from in get) widget.unlinkState(this.origin, from, (get[from] === true) ? from : get[from]);
+      if (set) for (var to in set) this.origin.unlinkState(widget, to, (set[to] === true) ? to : set[to]);
+      if (use) for (var to in use) this.origin.removeState(widget, to, (use[to] === true) ? to : use[to]);
+      if (add) for (var index in add) widget.removeState(index, add[index]);
+      if (lnk) for (var to in lnk) widget.unlinkState(widget, to, (lnk[to] === true) ? to : lnk[to]);
+    }
+  },
+  
+  as: {
+    add: function(widget, name) {
+      if (!widget[name]) widget[name] = this.origin;
+    },
+    remove: function(widget, name) {
+      if (widget[name] == this.origin) delete widget[name];
+    }
+  },
+  
+  collection: {
+    add: function(widget, name) {
+      (widget[name] || (widget[name] = [])).push(this.origin);
+    },
+    remove: function(widget, name) {
+      widget[name].erase(this.origin);
+    }
+  },
+  
+  events: {
+    add: function(widget, events) {
+      widget.addEvents(events);
+    },
+    remove: function(widget, events) {
+      widget.removeEvents(events);
+    },
+    process: function(events) {
+      return this.origin.bindEvents(events);
+    }
+  },
+  
+  relations: {
+    add: function(widget, name, relation) {
+      widget.addRelation(name, relation);
+    },
+    remove: function(widget, name, relation) {
+      widget.removeRelation(name, relation);
+    },
+    iterate: true
+  },
+  
+  options: {
+    add: function(widget, options) {
+      widget.setOptions(options.call ? options.call(this.origin) : options);
+    },
+    remove: function(widget, options) {
+      widget.setOptions(options.call ? options.call(this.origin) : options, true);
+    }
+  },
+  
+  filter: true
+};
+
+LSD.Relation.getScopeName = function(scoped) {
+  return function(relation, scope, multiple) {
+    var key = Array.prototype.join.call(arguments);
+    return (scoped[key] || (scoped[key] = (scope + LSD.capitalize(relation))))
+  }
+}({});
+
+Options.has = Object.append({
+  process: function(has) {
+    var one = has.one, many = has.many, relations = {};
+    if (one) for (var name in one) relations[name] = one[name];
+    if (many) for (var name in many) relations[name] = Object.append(many[name], {multiple: true});
+    return relations;
+  }
+}, Options.relations);
+
+var Traits = LSD.Relation.Traits = {};
+var Targets = LSD.Module.Events.Targets;
+}();

data/Packages/lsd/Source/Sheet.js

@@ -0,0 +1,324 @@
+/*
+---
+ 
+script: Sheet.js
+ 
+description: Code to extract style rule definitions from the stylesheet
+ 
+license: Public domain (http://unlicense.org).
+
+authors: Yaroslaff Fedin
+ 
+requires:
+  - Core/Element
+  - Core/Request
+  - Sheet/Sheet
+  - Sheet/SheetParser.Value
+  - Sheet/SheetParser.Property
+  - Sheet/SheetParser.Styles
+  - LSD.Module.Element
+  - LSD.Module.Options
+  
+provides:
+  - LSD.Sheet
+ 
+...
+*/
+
+!function() {
+  
+LSD.Sheet = new Class({
+  Implements: [LSD.Module.Element, LSD.Module.Options],
+  
+  options: {
+    compile: false,
+    combine: true //combine rules
+  },
+  
+  initialize: function(element, callback) {
+    LSD.Module.Options.initialize.call(this, element);
+    this.rules = [];
+    this.callback = callback;
+    if (this.element) this.fetch();
+    else if (callback) callback(this);
+    if (!LSD.Sheet.stylesheets) LSD.Sheet.stylesheets = [];
+    LSD.Sheet.stylesheets.push(this);
+  },
+  
+  define: function(selectors, style) {
+    LSD.Sheet.Rule.fromSelectors(selectors, style).each(this.addRule.bind(this))
+  },
+  
+  addRule: function(rule) {
+    this.rules.push(rule)
+  },
+  
+  fetch: function(href) {
+    if (!href && this.element) href = this.element.get('href');
+    if (!href) return;
+    new Request({
+      url: href,
+      onSuccess: this.apply.bind(this)
+    }).get();
+  },
+  
+  apply: function(sheet) {
+    if (typeof sheet == 'string') sheet = this.parse(sheet);
+    if (this.options.compile) this.compile(sheet);
+    for (var selector in sheet) this.define(selector, sheet[selector]);
+    if (this.callback) this.callback(this)
+  },
+  
+  parse: function(text) {
+    var sheet = new Sheet(text);
+    var rules = sheet.cssRules;
+    var CSS = SheetParser.Styles, Paint = LSD.Styles;
+    var parsed = {};
+    for (var i = 0, rule; rule = rules[i++];) {      
+      var selector = LSD.Sheet.convertSelector(rule.selectorText)
+      if (!selector.length || LSD.Sheet.isElementSelector(selector)) continue;
+      if (!parsed[selector]) parsed[selector] = {};
+      var styles = parsed[selector];
+      for (var style = rule.style, j = 0, name; name = style[j++];) {
+        var property = name.replace('-lsd-', '').camelCase();
+        var value = SheetParser.Value.translate(style[name]);
+        var definition = Paint[property] || CSS[property];
+        if (!definition) continue;
+        if (definition.type != 'simple') {
+          var result = definition[value.push ? 'apply' : 'call'](this, value);
+          if (result === false) value = false;
+          else if (result !== true) {
+            for (prop in result) styles[prop] = Value.compile(result[prop]);
+            continue
+          }
+        }
+        styles[property] = Value.compile(value);
+      }
+    };
+    return parsed;
+  },
+  
+  attach: function(node) {
+    this.rules.each(function(rule) {
+      rule.attach(node)
+    });
+    LSD.start();
+  },
+  
+  detach: function(node) {
+    this.rules.each(function(rule) {
+      rule.detach(node)
+    });
+  },
+  
+  /* Compile LSD stylesheet to CSS when possible 
+     to speed up setting of regular properties
+     
+     Will create stylesheet node and apply the css
+     unless *lightly* parameter was given. 
+     
+     Unused now, because we decompile css instead */
+  compile: function(lightly) {
+    var bits = [];
+    this.rules.each(function(rule) {
+      if (!rule.implied) return;
+      bits.push(rule.getCSSSelector() + " {")
+      for (var property in rule.implied) {  
+        var value = rule.implied[property];
+        if (typeof value == 'number') {
+          if (property != 'zIndex') value += 'px';
+        } else if (value.map) {
+          value = value.map(function(bit) { return bit + 'px'}).join(' ');
+        }
+        bits.push(property.hyphenate() + ': ' + value + ';')
+      }
+      bits.push("}")
+    })
+    var text = bits.join("\n");
+    if (lightly) return text;
+    
+    if (window.createStyleSheet) {
+      var style = window.createStyleSheet("");
+      style.cssText = text;
+    } else {
+      var style = new Element('style', {type: 'text/css', media: 'screen'}).adopt(document.newTextNode(text)).inject(document.body);
+    }
+  }
+});
+
+Object.append(LSD.Sheet, {
+  isElementSelector: function(selector) {
+    return selector.match(/svg|v\\?:|:(?:before|after)|\.container/);
+  },
+  convertSelector: function(selector) {
+    return selector.replace(/\.id-/g , '#').replace(/\.is-/g, ':').replace(/\.lsd#/g, '#').
+                    replace(/\.lsd\./g, '').replace(/html\sbody\s/g, '');
+  },
+  isElementStyle: function(cc) {
+    return SheetParser.Styles[cc] && !LSD.Styles[cc] && (cc != 'height' && cc != 'width')
+  },
+  isRawValue: function(value) {
+    return (value.indexOf('hsb') > -1) || (value.indexOf('ART') > -1) || (value.indexOf('LSD') > -1) || 
+           (value.charAt(0) == '"') || (value == 'false') || (value == parseInt(value)) || (value == parseFloat(value))
+  }
+});
+
+LSD.Sheet.Rule = function(selector, style) {
+  this.selector = selector;
+  this.index = LSD.Sheet.Rule.index ++;
+  this.expressions = selector.expressions[0];
+  this.specificity = this.getSpecificity();
+  for (property in style) {
+    var cc = property.camelCase();
+    var type = (LSD.Sheet.Rule.separate && LSD.Sheet.isElementStyle(cc)) ? 'implied' : 'style';
+    if (!this[type]) this[type] = {}; 
+    this[type][cc] = style[property];
+  }
+}
+LSD.Sheet.Rule.index = 0;
+
+LSD.Sheet.Rule.separate = true;
+
+Object.append(LSD.Sheet.Rule.prototype, {  
+  attach: function(node) {
+    if (!this.watcher) this.watcher = this.watch.bind(this);
+    node.watch(this.selector, this.watcher)
+  },
+  
+  detach: function(node) {
+    node.unwatch(this.selector, this.watcher);
+  },
+  
+  watch: function(node, state) {
+    node[state ? 'addRule' : 'removeRule'](this)
+  },
+  
+  getCSSSelector: function() {
+    return this.expressions.map(function(parsed){
+      var classes = ['', 'lsd'];
+      if (parsed.tag) classes.push(parsed.tag);
+      if (parsed.id) classes.push('id-' + parsed.id);
+      if (parsed.pseudos) {
+        parsed.pseudos.each(function(pseudo) {
+          classes.push(pseudo.key);
+        });
+      };
+      return classes.join('.');
+    }).join(' ');
+  },
+  
+  getSpecificity: function(selector) {
+    specificity = 0;
+    this.expressions.each(function(chunk){
+      if (chunk.tag && chunk.tag != '*') specificity++;
+      if (chunk.id) specificity += 100;
+      for (var i in chunk.attributes) specificity++;
+      specificity += (chunk.pseudos || []).length;
+      specificity += (chunk.classes || []).length * 10;
+    });
+    return specificity;
+  }
+});
+
+var Value = LSD.Sheet.Value = {
+  px: function(value) {
+    return value;
+  },
+  deg: function(value) {
+    return value;
+  },
+  em: function(value) {
+    return function() {
+      return value * (this.baseline || 16)
+    }
+  },
+  "%": function(value) {
+    return function(property) {
+      var resolved = Value['%'].resolve(property);
+      if (resolved.call) resolved = resolved.call(this);
+      return resolved / 100 * value;
+    }
+  },
+  url: function(value) {
+    return value
+  },
+  src: function(value) {
+    return value
+  },
+  rgb: function() {
+    return window.rgb.apply(window, arguments)
+  },
+  rgba: function(value) {
+    return window.rgb.apply(window, arguments)
+  },
+  hsb: function() {
+    return window.hsb.apply(window, arguments)
+  },
+  hex: function(value) {
+    return new Color(value)
+  },
+  calc: function(value) {
+    var bits = value.map(function(bit, i) {
+      if (bit.call) {
+        return "value[" + i + "].call(this, property)"
+      } else {
+        return bit;
+      }
+    })
+    eval("var compiled = function(property) { return " + bits.join(" ") + "}");
+    return compiled
+  },
+  min: function() {
+    return Math.min.apply(Math, arguments)
+  },
+  max: function() {
+    return Math.max.apply(Math, arguments)
+  }
+};
+
+
+var resolved = {};
+var dimensions = {
+  height: /[hH]eight|[tT]op|[bB]ottom|[a-z]Y/,
+  width: /[wW]idth|[lL]eft|[rR]ight|[a-z]X/
+}
+Value['%'].resolve = function(property) {
+  var result = resolved[property];
+  if (result != null) return result;
+  for (var side in dimensions) if (property.match(dimensions[side])) {
+    result = function() { if (this.parentNode) return this.parentNode.getStyle(side); return 0;}
+    break;
+  }
+  return (resolved[property] = (result || 1));
+};
+
+Value.compiled = {};
+Value.compile = function(value, context) {
+  if (!value || value.call || typeof value == 'number') return value;
+  if (!context) context = Value;
+  if (value.push) {
+    for (var i = 0, j = value.length, result = [], bit; i < j; bit = value[i++]) result[i] = Value.compile(value[i], context);
+    return result;
+  }
+  if (value.unit)  return Object.append(context[value.unit](value.number), value);
+  if (value.charAt) {
+    if (context.hex && value.charAt(0) == "#" && value.match(/#[a-z0-9]{3,6}/)) return context.hex(value);
+  } else for (var name in value) {
+    if (context[name]) {
+      return context[name](Value.compile(value[name]), context);
+    } else {
+      value[name] = Value.compile(value[name]);
+    }
+    break;
+  }
+  return value;
+}
+
+LSD.Sheet.Rule.fromSelectors = function(selectors, style) { //temp solution, split by comma
+  return selectors.split(/\s*,\s*/).map(function(selector){
+    return new LSD.Sheet.Rule(Slick.parse(selector), style);
+  });
+};
+
+
+}();