"Uncaught SyntaxError: Unexpected identifier" error in jquery

javascript, jquery, plugins, syntax-error

Solution

You start an in-line function: `$(document).on('mousemove', function(e) {` and never finish the statement after it. Before the line with the error, you need `});` instead of just `}`.

Problem

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: ``` "Uncaught SyntaxError: Unexpected identifier" ``` on the 8th to last line (the one that reads: `$.line();`). The whole 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] >> data[2]) { var lineleft = data[2]; } else { var lineleft = data[0]; } if (data[1] >> data[3]) { var linetop = data[1]; } else { var linetop = data[3]; } $('body').append('<img class="line" src="/lines/line-'+lineColor+'.png" style="position:absolute;top:'+linetop+';left:'+lineleft+';width:'+width+'px;height:'+height+'px;color:'+lineColor+';"/>'); } $.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('<div class="point" style="position:absolute; top:' + _posY + 'px; left:' + _posX + 'px;"></div>'); $.line.data([_posX, _posY]); if (bothpoints == true) { $.line.draw(); } } } $.fn.line.unpoint = function() { this.hide('fast'); if ($.line.data()[0] == this.offset()['left'] && $.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('<meta id="line" />'); $('#lineRegion').click( $.line.point() ); $('.point').click( $.line.unpoint() ); $('.lineEraser').click( $.line.erase(true) ); } })( jQuery ); ```

Original source