title: "Uncaught SyntaxError: Unexpected identifier" error in jquery
body: <p>I'm making a new jQuery plugin for drawing lines on a page.
  The problem is that I can't figure out what's going on here, when I run the script, in Chrome it says:</p>
  
  <pre><code>"Uncaught SyntaxError: Unexpected identifier"
  </code></pre>
  
  <p>on the 8th to last line (the one that reads: <code>$.line();</code>).</p>
  
  <p>The whole code:</p>
  
  <pre><code>(function( $ ) {
  
      $.fn.line = function(coordinates) {
  
          var bothpoints;
  
          $.fn.line.draw = function() {
  
              var lineColor = $('#lineRegion').attr('lineColor');
  
              if (!lineColor) {
                  var colors = ['black', 'blue', 'green', 'red', 'yellow', 'purple', 'magenta', 'cyan'];
  
                  $('img.line').each(function () {
                      colors.splice(colors.indexOf($(this).css('color')), 1);
                  });
  
                  var lineColor = colors[0];
  
              }
  
              var data = $.line.data(),
                  width = Math.abs(data[0] - data[2]),
                  height = Math.abs(data[1] - data[3]);
              if (data[0] &gt;&gt; data[2]) {
                  var lineleft = data[2];
              } else {
                  var lineleft = data[0];
              }
              if (data[1] &gt;&gt; data[3]) {
                  var linetop = data[1];
              } else {
                  var linetop = data[3];
              }
  
              $('body').append('&lt;img class="line" src="/lines/line-'+lineColor+'.png" style="position:absolute;top:'+linetop+';left:'+lineleft+';width:'+width+'px;height:'+height+'px;color:'+lineColor+';"/&gt;');
          }
  
          $.fn.line.data = function(coords) {
              if (coords.length == 2) {
                  if ( ! $('#line').data('point1') ) { 
                      $('#line').data('point1', {x: coords[0], y: coords[1]});
                      bothpoints = false;
                  } else {
                      $('#line').data('point2', {x: coords[0], y: coords[1]});
                      bothpoints = true;
                  }
                  $.line.draw();
              } else if (coords == 1) {
                  $('#line').data('point1', false);
                  bothpoints = false;
              } else if (coords == 2) {
                  $('#line').data('point2', false);
                  bothpoints = false;
              } else if (!coords) {
                  return [$('#line').data('point1').x, $('#line').data('point1').y, $('#line').data('point2').x, $('#line').data('point2').y];
              }
          }
  
          $.fn.line.point = function() {
              if (!($.line.data().length == 4)) {
                  var _posY = posy, _posX = posx;
                  $('body').append('&lt;div class="point" style="position:absolute; top:' + _posY + 'px; left:' + _posX + 'px;"&gt;&lt;/div&gt;');
                  $.line.data([_posX, _posY]);
                  if (bothpoints == true) {
                      $.line.draw();
                  }
              }
          }
  
          $.fn.line.unpoint = function() {
              this.hide('fast');
              if ($.line.data()[0] == this.offset()['left'] &amp;&amp; $.line.data[1] == this.offset()['top']) {
                  $.line.data(1);
              } else {
                  $.line.data(2);
              }
              $.line.erase();
          }
  
  
          $.fn.line.erase = function(total) {
              if (total == true) {
                  $('img.line').hide('fast');
                  $('div.point').hide('fast');
                  $.line.data(1);
                  $.line.data(2);
              } else {
                  $('img.line').hide('fast');
              }
          }
  
          if ( coordinates.length == 4) {
              $.line.data([coordinates[0], coordinates[1]]);
              $.line.data([coordinates[2], coordinates[3]]);
              $.line.draw();
          }
  
      };
  
      var posx, posy;
  
      $(document).ready(function(){
          $(document).on('mousemove', function(e) {
              if (!e) var e = window.event;
              if (e.pageX || e.pageY)     {
                  posx = e.pageX;
                  posy = e.pageY;
              }
              else if (e.clientX || e.clientY)    {
                  posx = e.clientX + document.body.scrollLeft
                      + document.documentElement.scrollLeft;
                  posy = e.clientY + document.body.scrollTop
                      + document.documentElement.scrollTop;
              }
          }
          $.line();
          $('head').append('&lt;meta id="line" /&gt;');
          $('#lineRegion').click( $.line.point() );
          $('.point').click( $.line.unpoint() );
          $('.lineEraser').click( $.line.erase(true) );
      }
  
  })( jQuery );
  </code></pre>