vis-rails 0.0.1

data/vendor/assets/vis/timeline/component/css/panel.css

@@ -0,0 +1,14 @@
+
+.vis.timeline.rootpanel {
+  position: relative;
+  overflow: hidden;
+
+  border: 1px solid #bfbfbf;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.vis.timeline .panel {
+  position: absolute;
+  overflow: hidden;
+}

data/vendor/assets/vis/timeline/component/css/timeaxis.css

@@ -0,0 +1,41 @@
+.vis.timeline .axis {
+  position: relative;
+}
+
+.vis.timeline .axis .text {
+  position: absolute;
+  color: #4d4d4d;
+  padding: 3px;
+  white-space: nowrap;
+}
+
+.vis.timeline .axis .text.measure {
+  position: absolute;
+  padding-left: 0;
+  padding-right: 0;
+  margin-left: 0;
+  margin-right: 0;
+  visibility: hidden;
+}
+
+.vis.timeline .axis .grid.vertical {
+  position: absolute;
+  width: 0;
+  border-right: 1px solid;
+}
+
+.vis.timeline .axis .grid.horizontal {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  height: 0;
+  border-bottom: 1px solid;
+}
+
+.vis.timeline .axis .grid.minor {
+  border-color: #e5e5e5;
+}
+
+.vis.timeline .axis .grid.major {
+  border-color: #bfbfbf;
+}

data/vendor/assets/vis/timeline/component/css/timeline.css

@@ -0,0 +1,2 @@
+.vis.timeline {
+}

data/vendor/assets/vis/timeline/component/item/Item.js

@@ -0,0 +1,81 @@
+/**
+ * @constructor Item
+ * @param {ItemSet} parent
+ * @param {Object} data             Object containing (optional) parameters type,
+ *                                  start, end, content, group, className.
+ * @param {Object} [options]        Options to set initial property values
+ * @param {Object} [defaultOptions] default options
+ *                                  // TODO: describe available options
+ */
+function Item (parent, data, options, defaultOptions) {
+  this.parent = parent;
+  this.data = data;
+  this.dom = null;
+  this.options = options || {};
+  this.defaultOptions = defaultOptions || {};
+
+  this.selected = false;
+  this.visible = false;
+  this.top = 0;
+  this.left = 0;
+  this.width = 0;
+  this.height = 0;
+}
+
+/**
+ * Select current item
+ */
+Item.prototype.select = function select() {
+  this.selected = true;
+  if (this.visible) this.repaint();
+};
+
+/**
+ * Unselect current item
+ */
+Item.prototype.unselect = function unselect() {
+  this.selected = false;
+  if (this.visible) this.repaint();
+};
+
+/**
+ * Show the Item in the DOM (when not already visible)
+ * @return {Boolean} changed
+ */
+Item.prototype.show = function show() {
+  return false;
+};
+
+/**
+ * Hide the Item from the DOM (when visible)
+ * @return {Boolean} changed
+ */
+Item.prototype.hide = function hide() {
+  return false;
+};
+
+/**
+ * Repaint the item
+ * @return {Boolean} changed
+ */
+Item.prototype.repaint = function repaint() {
+  // should be implemented by the item
+  return false;
+};
+
+/**
+ * Reflow the item
+ * @return {Boolean} resized
+ */
+Item.prototype.reflow = function reflow() {
+  // should be implemented by the item
+  return false;
+};
+
+/**
+ * Return the items width
+ * @return {Integer} width
+ */
+Item.prototype.getWidth = function getWidth() {
+  return this.width;
+}

data/vendor/assets/vis/timeline/component/item/ItemBox.js

@@ -0,0 +1,302 @@
+/**
+ * @constructor ItemBox
+ * @extends Item
+ * @param {ItemSet} parent
+ * @param {Object} data             Object containing parameters start
+ *                                  content, className.
+ * @param {Object} [options]        Options to set initial property values
+ * @param {Object} [defaultOptions] default options
+ *                                  // TODO: describe available options
+ */
+function ItemBox (parent, data, options, defaultOptions) {
+  this.props = {
+    dot: {
+      left: 0,
+      top: 0,
+      width: 0,
+      height: 0
+    },
+    line: {
+      top: 0,
+      left: 0,
+      width: 0,
+      height: 0
+    }
+  };
+
+  Item.call(this, parent, data, options, defaultOptions);
+}
+
+ItemBox.prototype = new Item (null, null);
+
+/**
+ * Repaint the item
+ * @return {Boolean} changed
+ */
+ItemBox.prototype.repaint = function repaint() {
+  // TODO: make an efficient repaint
+  var changed = false;
+  var dom = this.dom;
+
+  if (!dom) {
+    this._create();
+    dom = this.dom;
+    changed = true;
+  }
+
+  if (dom) {
+    if (!this.parent) {
+      throw new Error('Cannot repaint item: no parent attached');
+    }
+
+    if (!dom.box.parentNode) {
+      var foreground = this.parent.getForeground();
+      if (!foreground) {
+        throw new Error('Cannot repaint time axis: ' +
+            'parent has no foreground container element');
+      }
+      foreground.appendChild(dom.box);
+      changed = true;
+    }
+
+    if (!dom.line.parentNode) {
+      var background = this.parent.getBackground();
+      if (!background) {
+        throw new Error('Cannot repaint time axis: ' +
+            'parent has no background container element');
+      }
+      background.appendChild(dom.line);
+      changed = true;
+    }
+
+    if (!dom.dot.parentNode) {
+      var axis = this.parent.getAxis();
+      if (!background) {
+        throw new Error('Cannot repaint time axis: ' +
+            'parent has no axis container element');
+      }
+      axis.appendChild(dom.dot);
+      changed = true;
+    }
+
+    // update contents
+    if (this.data.content != this.content) {
+      this.content = this.data.content;
+      if (this.content instanceof Element) {
+        dom.content.innerHTML = '';
+        dom.content.appendChild(this.content);
+      }
+      else if (this.data.content != undefined) {
+        dom.content.innerHTML = this.content;
+      }
+      else {
+        throw new Error('Property "content" missing in item ' + this.data.id);
+      }
+      changed = true;
+    }
+
+    // update class
+    var className = (this.data.className? ' ' + this.data.className : '') +
+        (this.selected ? ' selected' : '');
+    if (this.className != className) {
+      this.className = className;
+      dom.box.className = 'item box' + className;
+      dom.line.className = 'item line' + className;
+      dom.dot.className  = 'item dot' + className;
+      changed = true;
+    }
+  }
+
+  return changed;
+};
+
+/**
+ * Show the item in the DOM (when not already visible). The items DOM will
+ * be created when needed.
+ * @return {Boolean} changed
+ */
+ItemBox.prototype.show = function show() {
+  if (!this.dom || !this.dom.box.parentNode) {
+    return this.repaint();
+  }
+  else {
+    return false;
+  }
+};
+
+/**
+ * Hide the item from the DOM (when visible)
+ * @return {Boolean} changed
+ */
+ItemBox.prototype.hide = function hide() {
+  var changed = false,
+      dom = this.dom;
+  if (dom) {
+    if (dom.box.parentNode) {
+      dom.box.parentNode.removeChild(dom.box);
+      changed = true;
+    }
+    if (dom.line.parentNode) {
+      dom.line.parentNode.removeChild(dom.line);
+    }
+    if (dom.dot.parentNode) {
+      dom.dot.parentNode.removeChild(dom.dot);
+    }
+  }
+  return changed;
+};
+
+/**
+ * Reflow the item: calculate its actual size and position from the DOM
+ * @return {boolean} resized    returns true if the axis is resized
+ * @override
+ */
+ItemBox.prototype.reflow = function reflow() {
+  var changed = 0,
+      update,
+      dom,
+      props,
+      options,
+      margin,
+      start,
+      align,
+      orientation,
+      top,
+      left,
+      data,
+      range;
+
+  if (this.data.start == undefined) {
+    throw new Error('Property "start" missing in item ' + this.data.id);
+  }
+
+  data = this.data;
+  range = this.parent && this.parent.range;
+  if (data && range) {
+    // TODO: account for the width of the item
+    var interval = (range.end - range.start);
+    this.visible = (data.start > range.start - interval) && (data.start < range.end + interval);
+  }
+  else {
+    this.visible = false;
+  }
+
+  if (this.visible) {
+    dom = this.dom;
+    if (dom) {
+      update = util.updateProperty;
+      props = this.props;
+      options = this.options;
+      start = this.parent.toScreen(this.data.start);
+      align = options.align || this.defaultOptions.align;
+      margin = options.margin && options.margin.axis || this.defaultOptions.margin.axis;
+      orientation = options.orientation || this.defaultOptions.orientation;
+
+      changed += update(props.dot, 'height', dom.dot.offsetHeight);
+      changed += update(props.dot, 'width', dom.dot.offsetWidth);
+      changed += update(props.line, 'width', dom.line.offsetWidth);
+      changed += update(props.line, 'height', dom.line.offsetHeight);
+      changed += update(props.line, 'top', dom.line.offsetTop);
+      changed += update(this, 'width', dom.box.offsetWidth);
+      changed += update(this, 'height', dom.box.offsetHeight);
+      if (align == 'right') {
+        left = start - this.width;
+      }
+      else if (align == 'left') {
+        left = start;
+      }
+      else {
+        // default or 'center'
+        left = start - this.width / 2;
+      }
+      changed += update(this, 'left', left);
+
+      changed += update(props.line, 'left', start - props.line.width / 2);
+      changed += update(props.dot, 'left', start - props.dot.width / 2);
+      changed += update(props.dot, 'top', -props.dot.height / 2);
+      if (orientation == 'top') {
+        top = margin;
+
+        changed += update(this, 'top', top);
+      }
+      else {
+        // default or 'bottom'
+        var parentHeight = this.parent.height;
+        top = parentHeight - this.height - margin;
+
+        changed += update(this, 'top', top);
+      }
+    }
+    else {
+      changed += 1;
+    }
+  }
+
+  return (changed > 0);
+};
+
+/**
+ * Create an items DOM
+ * @private
+ */
+ItemBox.prototype._create = function _create() {
+  var dom = this.dom;
+  if (!dom) {
+    this.dom = dom = {};
+
+    // create the box
+    dom.box = document.createElement('DIV');
+    // className is updated in repaint()
+
+    // contents box (inside the background box). used for making margins
+    dom.content = document.createElement('DIV');
+    dom.content.className = 'content';
+    dom.box.appendChild(dom.content);
+
+    // line to axis
+    dom.line = document.createElement('DIV');
+    dom.line.className = 'line';
+
+    // dot on axis
+    dom.dot = document.createElement('DIV');
+    dom.dot.className = 'dot';
+
+    // attach this item as attribute
+    dom.box['timeline-item'] = this;
+  }
+};
+
+/**
+ * Reposition the item, recalculate its left, top, and width, using the current
+ * range and size of the items itemset
+ * @override
+ */
+ItemBox.prototype.reposition = function reposition() {
+  var dom = this.dom,
+      props = this.props,
+      orientation = this.options.orientation || this.defaultOptions.orientation;
+
+  if (dom) {
+    var box = dom.box,
+        line = dom.line,
+        dot = dom.dot;
+
+    box.style.left = this.left + 'px';
+    box.style.top = this.top + 'px';
+
+    line.style.left = props.line.left + 'px';
+    if (orientation == 'top') {
+      line.style.top = 0 + 'px';
+      line.style.height = this.top + 'px';
+    }
+    else {
+      // orientation 'bottom'
+      line.style.top = (this.top + this.height) + 'px';
+      line.style.height = Math.max(this.parent.height - this.top - this.height +
+          this.props.dot.height / 2, 0) + 'px';
+    }
+
+    dot.style.left = props.dot.left + 'px';
+    dot.style.top = props.dot.top + 'px';
+  }
+};

data/vendor/assets/vis/timeline/component/item/ItemPoint.js

@@ -0,0 +1,237 @@
+/**
+ * @constructor ItemPoint
+ * @extends Item
+ * @param {ItemSet} parent
+ * @param {Object} data             Object containing parameters start
+ *                                  content, className.
+ * @param {Object} [options]        Options to set initial property values
+ * @param {Object} [defaultOptions] default options
+ *                                  // TODO: describe available options
+ */
+function ItemPoint (parent, data, options, defaultOptions) {
+  this.props = {
+    dot: {
+      top: 0,
+      width: 0,
+      height: 0
+    },
+    content: {
+      height: 0,
+      marginLeft: 0
+    }
+  };
+
+  Item.call(this, parent, data, options, defaultOptions);
+}
+
+ItemPoint.prototype = new Item (null, null);
+
+/**
+ * Repaint the item
+ * @return {Boolean} changed
+ */
+ItemPoint.prototype.repaint = function repaint() {
+  // TODO: make an efficient repaint
+  var changed = false;
+  var dom = this.dom;
+
+  if (!dom) {
+    this._create();
+    dom = this.dom;
+    changed = true;
+  }
+
+  if (dom) {
+    if (!this.parent) {
+      throw new Error('Cannot repaint item: no parent attached');
+    }
+    var foreground = this.parent.getForeground();
+    if (!foreground) {
+      throw new Error('Cannot repaint time axis: ' +
+          'parent has no foreground container element');
+    }
+
+    if (!dom.point.parentNode) {
+      foreground.appendChild(dom.point);
+      foreground.appendChild(dom.point);
+      changed = true;
+    }
+
+    // update contents
+    if (this.data.content != this.content) {
+      this.content = this.data.content;
+      if (this.content instanceof Element) {
+        dom.content.innerHTML = '';
+        dom.content.appendChild(this.content);
+      }
+      else if (this.data.content != undefined) {
+        dom.content.innerHTML = this.content;
+      }
+      else {
+        throw new Error('Property "content" missing in item ' + this.data.id);
+      }
+      changed = true;
+    }
+
+    // update class
+    var className = (this.data.className? ' ' + this.data.className : '') +
+        (this.selected ? ' selected' : '');
+    if (this.className != className) {
+      this.className = className;
+      dom.point.className  = 'item point' + className;
+      changed = true;
+    }
+  }
+
+  return changed;
+};
+
+/**
+ * Show the item in the DOM (when not already visible). The items DOM will
+ * be created when needed.
+ * @return {Boolean} changed
+ */
+ItemPoint.prototype.show = function show() {
+  if (!this.dom || !this.dom.point.parentNode) {
+    return this.repaint();
+  }
+  else {
+    return false;
+  }
+};
+
+/**
+ * Hide the item from the DOM (when visible)
+ * @return {Boolean} changed
+ */
+ItemPoint.prototype.hide = function hide() {
+  var changed = false,
+      dom = this.dom;
+  if (dom) {
+    if (dom.point.parentNode) {
+      dom.point.parentNode.removeChild(dom.point);
+      changed = true;
+    }
+  }
+  return changed;
+};
+
+/**
+ * Reflow the item: calculate its actual size from the DOM
+ * @return {boolean} resized    returns true if the axis is resized
+ * @override
+ */
+ItemPoint.prototype.reflow = function reflow() {
+  var changed = 0,
+      update,
+      dom,
+      props,
+      options,
+      margin,
+      orientation,
+      start,
+      top,
+      data,
+      range;
+
+  if (this.data.start == undefined) {
+    throw new Error('Property "start" missing in item ' + this.data.id);
+  }
+
+  data = this.data;
+  range = this.parent && this.parent.range;
+  if (data && range) {
+    // TODO: account for the width of the item
+    var interval = (range.end - range.start);
+    this.visible = (data.start > range.start - interval) && (data.start < range.end);
+  }
+  else {
+    this.visible = false;
+  }
+
+  if (this.visible) {
+    dom = this.dom;
+    if (dom) {
+      update = util.updateProperty;
+      props = this.props;
+      options = this.options;
+      orientation = options.orientation || this.defaultOptions.orientation;
+      margin = options.margin && options.margin.axis || this.defaultOptions.margin.axis;
+      start = this.parent.toScreen(this.data.start);
+
+      changed += update(this, 'width', dom.point.offsetWidth);
+      changed += update(this, 'height', dom.point.offsetHeight);
+      changed += update(props.dot, 'width', dom.dot.offsetWidth);
+      changed += update(props.dot, 'height', dom.dot.offsetHeight);
+      changed += update(props.content, 'height', dom.content.offsetHeight);
+
+      if (orientation == 'top') {
+        top = margin;
+      }
+      else {
+        // default or 'bottom'
+        var parentHeight = this.parent.height;
+        top = Math.max(parentHeight - this.height - margin, 0);
+      }
+      changed += update(this, 'top', top);
+      changed += update(this, 'left', start - props.dot.width / 2);
+      changed += update(props.content, 'marginLeft', 1.5 * props.dot.width);
+      //changed += update(props.content, 'marginRight', 0.5 * props.dot.width); // TODO
+
+      changed += update(props.dot, 'top', (this.height - props.dot.height) / 2);
+    }
+    else {
+      changed += 1;
+    }
+  }
+
+  return (changed > 0);
+};
+
+/**
+ * Create an items DOM
+ * @private
+ */
+ItemPoint.prototype._create = function _create() {
+  var dom = this.dom;
+  if (!dom) {
+    this.dom = dom = {};
+
+    // background box
+    dom.point = document.createElement('div');
+    // className is updated in repaint()
+
+    // contents box, right from the dot
+    dom.content = document.createElement('div');
+    dom.content.className = 'content';
+    dom.point.appendChild(dom.content);
+
+    // dot at start
+    dom.dot = document.createElement('div');
+    dom.dot.className  = 'dot';
+    dom.point.appendChild(dom.dot);
+
+    // attach this item as attribute
+    dom.point['timeline-item'] = this;
+  }
+};
+
+/**
+ * Reposition the item, recalculate its left, top, and width, using the current
+ * range and size of the items itemset
+ * @override
+ */
+ItemPoint.prototype.reposition = function reposition() {
+  var dom = this.dom,
+      props = this.props;
+
+  if (dom) {
+    dom.point.style.top = this.top + 'px';
+    dom.point.style.left = this.left + 'px';
+
+    dom.content.style.marginLeft = props.content.marginLeft + 'px';
+    //dom.content.style.marginRight = props.content.marginRight + 'px'; // TODO
+
+    dom.dot.style.top = props.dot.top + 'px';
+  }
+};