Merge pull request #1 from suitupalex/master

Prefixed CSS classes with `ampersand-`.
helpdotcom · Feb 4, 2015 · d8078d6 · d8078d6
2 parents 05156f5 + 62726d2
commit d8078d6
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 19 deletions.
diff --git a/ampersand-time-range.js b/ampersand-time-range.js
@@ -35,30 +35,31 @@
       AmpersandView.prototype.render.call(this);
 
       var range = this.svg = d3.select(this.el)
+        .attr('class', 'ampersand-time-range')
         .style('overflow', 'visible')
         .attr('width', '100%')
         .attr('height', '4em');
 
       var leftMidnight = range.append('text')
-        .attr('class', 'time-range-midnight time-range-midnight-left')
+        .attr('class', 'ampersand-time-range-midnight ampersand-time-range-midnight-left')
         .attr('x', '5%')
         .attr('y', '1.5em')
         .text('12 am');
 
       var rightMidnight = range.append('text')
-        .attr('class', 'time-range-midnight time-range-midnight-right')
+        .attr('class', 'ampersand-time-range-midnight ampersand-time-range-midnight-right')
         .attr('x', '95%')
         .attr('y', '1.5em')
         .text('12 am');
 
       var noon = range.append('text')
-        .attr('class', 'time-range-midnight time-range-noon')
+        .attr('class', 'ampersand-time-range-midnight ampersand-time-range-noon')
         .attr('x', '50%')
         .attr('y', '1.5em')
         .text('12 pm');
 
       var bar = range.append('rect')
-        .attr('class', 'time-range-bar')
+        .attr('class', 'ampersand-time-range-bar')
         .attr('x', '5%')
         .attr('y', '2em')
         .attr('width', '90%')
@@ -67,7 +68,7 @@
         .attr('ry', '0.25em');
 
       var durationBar = range.append('line')
-        .attr('class', 'time-range-duration')
+        .attr('class', 'ampersand-time-range-duration')
         .attr('x1', '5%')
         .attr('y1', '2.25em')
         .attr('x2', '95%')
@@ -78,7 +79,7 @@
           d.view.showToolTip(d.model.startX);
         })
         .on('drag', function(d, i) {
-          var bar = d.view.svg.select('rect.time-range-bar')[0][0];
+          var bar = d.view.svg.select('rect.ampersand-time-range-bar')[0][0];
           d.model.width = bar.getBBox().width;
           d.model.endX = d.model.endX > -1 ? d.model.endX : d.model.width + 20;
           d.x = Math.max(20, d3.mouse(bar)[0]);
@@ -96,7 +97,7 @@
 
       var handleStart = range.append('circle')
         .data([{ x: 0, model: this.model, view: this }])
-        .attr('class', 'time-range-handle time-range-handle-start')
+        .attr('class', 'ampersand-time-range-handle ampersand-time-range-handle-start')
         .attr('cy', '2.25em')
         .attr('cx', '5%')
         .attr('r', '0.5em')
@@ -107,7 +108,7 @@
           d.view.showToolTip(d.model.endX);
         })
         .on('drag', function(d, i) {
-          var bar = d.view.svg.select('rect.time-range-bar')[0][0];
+          var bar = d.view.svg.select('rect.ampersand-time-range-bar')[0][0];
           d.model.width = bar.getBBox().width;
           d.x = Math.min(d.model.width + 20, d3.mouse(bar)[0]);
           d.x = Math.max(d.x, d.model.startX);
@@ -124,53 +125,53 @@
 
       var handleEnd = range.append('circle')
         .data([{ x: 0, model: this.model, view: this }])
-        .attr('class', 'time-range-handle time-range-handle-end')
+        .attr('class', 'ampersand-time-range-handle ampersand-time-range-handle-end')
         .attr('cy', '2.25em')
         .attr('cx', '95%')
         .attr('r', '0.5em')
         .call(handleEndDrag);
 
       var toolTip = range.append('g')
-        .attr('class', 'time-range-tool-tip')
+        .attr('class', 'ampersand-time-range-tool-tip')
         .style('opacity', 0);
 
       var toolTipRect = toolTip.append('rect')
-        .attr('class', 'time-range-tool-tip-rect')
+        .attr('class', 'ampersand-time-range-tool-tip-rect')
         .attr('width', '4em')
         .attr('height', '1.5em');
 
       var toolTipTail = toolTip.append('polygon')
-        .attr('class', 'time-range-tool-tip-tail')
+        .attr('class', 'ampersand-time-range-tool-tip-tail')
         .attr('points', '0, 0 20, 0 10, 10')
         .attr('transform', 'translate(22, 23)');
 
       var toolTipText = toolTip.append('text')
-        .attr('class', 'time-range-tool-tip-text')
+        .attr('class', 'ampersand-time-range-tool-tip-text')
         .attr('x', '2.6em')
         .attr('y', '1.35em')
         .text('2:15 pm');
     },
     showToolTip: function(x) {
-      this.svg.select('g.time-range-tool-tip')
+      this.svg.select('g.ampersand-time-range-tool-tip')
         .attr('transform', 'translate(' + (x - 32) + ', -10)')
         .transition()
         .style('opacity', 1);
     },
     setToolTip: function(x, t) {
-      this.svg.select('g.time-range-tool-tip')
+      this.svg.select('g.ampersand-time-range-tool-tip')
         .attr('transform', 'translate(' + (x - 32) + ', -10)');
 
-      this.svg.select('text.time-range-tool-tip-text')
+      this.svg.select('text.ampersand-time-range-tool-tip-text')
         .text(this.model.intToTimeString(t));
     },
     hideToolTip: function() {
-      this.svg.select('g.time-range-tool-tip')
+      this.svg.select('g.ampersand-time-range-tool-tip')
         .transition()
         .duration(2000)
         .style('opacity', 0);
     },
     resizeDuration: function() {
-      this.svg.select('line.time-range-duration')
+      this.svg.select('line.ampersand-time-range-duration')
         .attr('x1', this.model.startX)
         .attr('x2', this.model.endX);
     }

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ampersand-time-range",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "A time range input using Ampersand and D3.",
   "main": "ampersand-time-range.js",
   "scripts": {