Functions `select` and `unselect` on Items working

NOTICE

@@ -1,5 +1,5 @@
 Vis.js
-Copyright 2010-2013 Almende B.V.
+Copyright 2010-2014 Almende B.V.
 
    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.

README.md

@@ -154,7 +154,7 @@ Then run the tests:
 
 ## License
 
-Copyright (C) 2010-2013 Almende B.V.
+Copyright (C) 2010-2014 Almende B.V.
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.

docs/index.html

@@ -179,7 +179,7 @@ var timeline = new vis.Timeline(container, data, options);
   <h2 id="license">License</h2>
 
   <p>
-    Copyright (C) 2010-2013 Almende B.V.
+    Copyright (C) 2010-2014 Almende B.V.
   </p>
 
   <p>

src/timeline/component/css/item.css

@@ -13,6 +13,14 @@
   z-index: 999;
 }
 
+.vis.timeline .item.point.selected {
+  background-color: #FFF785;
+  z-index: 999;
+}
+.vis.timeline .item.point.selected .dot {
+  border-color: #FFC200;
+}
+
 .vis.timeline .item.cluster {
   /* TODO: use another color or pattern? */
   background: #97B0F8 url('img/cluster_bg.png');

src/timeline/component/item/Item.js

@@ -27,6 +27,7 @@ function Item (parent, data, options, defaultOptions) {
  */
 Item.prototype.select = function select() {
   this.selected = true;
+  if (this.visible) this.repaint();
 };
 
 /**
@@ -34,6 +35,7 @@ Item.prototype.select = function select() {
  */
 Item.prototype.unselect = function unselect() {
   this.selected = false;
+  if (this.visible) this.repaint();
 };
 
 /**

src/timeline/component/item/ItemBox.js

@@ -29,24 +29,6 @@ function ItemBox (parent, data, options, defaultOptions) {
 
 ItemBox.prototype = new Item (null, null);
 
-/**
- * Select the item
- * @override
- */
-ItemBox.prototype.select = function select() {
-  this.selected = true;
-  // TODO: select and unselect
-};
-
-/**
- * Unselect the item
- * @override
- */
-ItemBox.prototype.unselect = function unselect() {
-  this.selected = false;
-  // TODO: select and unselect
-};
-
 /**
  * Repaint the item
  * @return {Boolean} changed

src/timeline/component/item/ItemPoint.js

@@ -26,24 +26,6 @@ function ItemPoint (parent, data, options, defaultOptions) {
 
 ItemPoint.prototype = new Item (null, null);
 
-/**
- * Select the item
- * @override
- */
-ItemPoint.prototype.select = function select() {
-  this.selected = true;
-  // TODO: select and unselect
-};
-
-/**
- * Unselect the item
- * @override
- */
-ItemPoint.prototype.unselect = function unselect() {
-  this.selected = false;
-  // TODO: select and unselect
-};
-
 /**
  * Repaint the item
  * @return {Boolean} changed

src/timeline/component/item/ItemRange.js

@@ -21,24 +21,6 @@ function ItemRange (parent, data, options, defaultOptions) {
 
 ItemRange.prototype = new Item (null, null);
 
-/**
- * Select the item
- * @override
- */
-ItemRange.prototype.select = function select() {
-  this.selected = true;
-  // TODO: select and unselect
-};
-
-/**
- * Unselect the item
- * @override
- */
-ItemRange.prototype.unselect = function unselect() {
-  this.selected = false;
-  // TODO: select and unselect
-};
-
 /**
  * Repaint the item
  * @return {Boolean} changed
@@ -86,7 +68,8 @@ ItemRange.prototype.repaint = function repaint() {
     }
 
     // update class
-    var className = this.data.className ? (' ' + this.data.className) : '';
+    var className = (this.data.className? ' ' + this.data.className : '') +
+        (this.selected ? ' selected' : '');
     if (this.className != className) {
       this.className = className;
       dom.box.className = 'item range' + className;