X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=dashed-canvas.js;h=0fc687450ac4b65cc778cd336b2f0eb701c76b78;hb=f9b5a82c0e67c25b47cc5a40b46ca2f1056c35f5;hp=beb4d47fd7309ac9c944dbf1592f9185fa75a132;hpb=fb63bf1b8b64385b98681417c4ee02b0fb0fd130;p=dygraphs.git

diff --git a/dashed-canvas.js b/dashed-canvas.js
index beb4d47..0fc6874 100644
--- a/dashed-canvas.js
+++ b/dashed-canvas.js
@@ -4,6 +4,9 @@
  * MIT-licensed (http://opensource.org/licenses/MIT)
  */
 
+(function() {
+'use strict';
+
 /**
  * @fileoverview Adds support for dashed lines to the HTML5 canvas.
  *
@@ -27,6 +30,24 @@
  * the drawing context.
  */
 
+/**
+ * Change the stroking style of the canvas drawing context from a solid line to
+ * a pattern (e.g. dashes, dash-dot-dash, etc.)
+ *
+ * Once you've installed the pattern, you can draw with it by using the
+ * beginPath(), moveTo(), lineTo() and stroke() method calls. Note that some
+ * more advanced methods (e.g. quadraticCurveTo() and bezierCurveTo()) are not
+ * supported. See file overview for a working example.
+ *
+ * Side effects of calling this method include adding an "isPatternInstalled"
+ * property and "uninstallPattern" method to this particular canvas context.
+ * You must call uninstallPattern() before calling installPattern() again.
+ *
+ * @param {Array.<number>} pattern A description of the stroke pattern. Even
+ * indices indicate a draw and odd indices indicate a gap (in pixels). The
+ * array should have a even length as any odd lengthed array could be expressed
+ * as a smaller even length array.
+ */
 CanvasRenderingContext2D.prototype.installPattern = function(pattern) {
   if (typeof(this.isPatternInstalled) !== 'undefined') {
     throw "Must un-install old line pattern before installing a new one.";
@@ -45,6 +66,7 @@ CanvasRenderingContext2D.prototype.installPattern = function(pattern) {
   var realMoveTo = this.moveTo;
   var realStroke = this.stroke;
 
+  /** @type {function()|undefined} */
   this.uninstallPattern = function() {
     this.beginPath = realBeginPath;
     this.lineTo = realLineTo;
@@ -97,10 +119,10 @@ CanvasRenderingContext2D.prototype.installPattern = function(pattern) {
 
         // Set last pattern index we used for this pattern.
         var patternIndex = dashedLineToHistory[0];
-        x = 0;
+        var x = 0;
         while (len > x) {
           // Get the length of the pattern segment we are dealing with.
-          segment = pattern[patternIndex];
+          var segment = pattern[patternIndex];
           // If our last draw didn't complete the pattern segment all the way
           // we will try to finish it. Otherwise we will try to do the whole
           // segment.
@@ -136,10 +158,23 @@ CanvasRenderingContext2D.prototype.installPattern = function(pattern) {
         }
 
         this.restore();
-        x1 = x2, y1 = y2;
+        x1 = x2;
+        y1 = y2;
       }
     }
     realStroke.call(this);
     segments = [];
   };
 };
+
+/**
+ * Removes the previously-installed pattern.
+ * You must call installPattern() before calling this. You can install at most
+ * one pattern at a time--there is no pattern stack.
+ */
+CanvasRenderingContext2D.prototype.uninstallPattern = function() {
+  // This will be replaced by a non-error version when a pattern is installed.
+  throw "Must install a line pattern before uninstalling it.";
+};
+
+})();