4 Replies - 1954 Views - Last Post: 28 December 2012 - 04:59 PM

#1 stringy  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 22
  • Joined: 11-July 12

unable to get sketch.js working

Posted 28 December 2012 - 05:46 AM

I am very new to JQuery and Javascript and I guess i'm cutting a few learning corners here. I have found a JQuery Plug in called sketch.js http://intridea.github.com/sketch.js/ which does exactly what I need, unfortunatley no matter what I try i cannot get it to work.

I have found one youtube vid and downloaded the example but the sketch.js element did not work. In the download for sketch.js there is an example (that sort of works but not with mousedown) that I have tried to manipulate with no joy.

Sketch.js seems to have no help or email address to ask. So if anybody can point me in the right direction it would be great - it seems so simple

Heres what i have so far

Html section
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
 </script>
  <script src="sketch.js" type="text/javascript"></script>
   <script src="canvas.js" type="text/javascript"></script>
   
</head>
<body>
</body>
</html>



Canvas.js

var sketchdataURL;

$(function() 
{	
	$('body').append('<div id="mySketch" style="height: 400px; width: 400px; float:left; border: 3px solid brown;">' + 
						'<canvas height="400px" width="400px"></canvas>' +
					'</div>');
	
	
	$('body').append('<button id="makeSketch">Make Sketch</button> <button id="getSketch">Get Sketch Image</button>');
	$('body').append('<div style="width:100%; height: 30px;"></div>');
	
	
	
	//Bind
	$('#makeSketch').click(function(event) 
	{
		makeSketch();
	});	
	
	$('#getSketch').click(function(event) 
	{
		SketchGetURL();
	});
	
});

function makeSketch()
{
	$('#mySketch canvas').sketch();
}

function SketchGetURL()
{
	var canvas = $('#mySketch canvas')[0];
	sketchdataURL = canvas.toDataURL();
	window.open(sketchdataURL);
}



I have tried with chrome/IE and firefox - anybody know what I am doing wrong ?

Is This A Good Question/Topic? 0
  • +

Replies To: unable to get sketch.js working

#2 SpAm101  Icon User is offline

  • D.I.C Head

Reputation: 11
  • View blog
  • Posts: 54
  • Joined: 28-November 12

Re: unable to get sketch.js working

Posted 28 December 2012 - 08:11 AM

Hi stringy

You code works fine for me with a local version of JQuery :)

Have you tried downloading JQuery and using it locally?
Was This Post Helpful? 0
  • +
  • -

#3 stringy  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 22
  • Joined: 11-July 12

Re: unable to get sketch.js working

Posted 28 December 2012 - 04:44 PM

No joy there either......everything seems to work its just like the ink is white or something

The 'get sketch' button opens a new window etc. I have checked it on all browsers (although the demo works on the sketch.js website), uploaded the latest flash, just cannot get this damn thing working.

the code definately seems fine...........any other suggestions welcome
Was This Post Helpful? 0
  • +
  • -

#4 stringy  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 22
  • Joined: 11-July 12

Re: unable to get sketch.js working

Posted 28 December 2012 - 04:56 PM

just sorted this - spotted a problem with sketch.js. I must have cocked it up when i copied and pasted the code

sorry to waste anybodys time.........
Was This Post Helpful? 0
  • +
  • -

#5 andrewsw  Icon User is offline

  • It's just been revoked!
  • member icon

Reputation: 3813
  • View blog
  • Posts: 13,527
  • Joined: 12-December 12

Re: unable to get sketch.js working

Posted 28 December 2012 - 04:59 PM

You're missing the protocol http:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>

This post has been edited by andrewsw: 28 December 2012 - 05:00 PM

Was This Post Helpful? 1
  • +
  • -

Page 1 of 1