background preloader

Webprogramming

Facebook Twitter

JavaScript Tutorial 16 - Graphics and Imaging. Graphics brings life to applications. JavaScript allows creation and modification of images using HTML5 canvas objects. This basic tutorial introduces some fundamental concepts of graphics and imaging. A more complete tutorial can be found at Mozilla's Canvas Tutorial. The Canvas HTML 5 introduced the canvas element which allows JavaScript 2D objects to be used in documents. <canvas id="canvas" width='100' height='100'><p>Sorry: Browser does not support Graphics Canvas</p></canvas> Note: Not all browsers implement the canvas element.

Shapes and Paths There is only one primitive shape: the rectangle. Paths are used for more complex shapes. Arcs are drawn with arc(x,y,radius,sAng,eAng,rotFlag). sAng and eAng are in radians (note: a simple conversion is var radians=(Math.PI/180)*degrees). rotFlag is boolean. Bezier curves are used to draw complex shapes. Styles and Patterns Fill patterns control how a drawn object is filled in with ink. Line strokes can be styled in several ways. Using Images. JavaFile.com - free java scripts, java applets! JavaScript Tutorial. The Lessons. How to write a FaceBook Application in 10 minutes. Writing F8 apps is where it’s at right now. Everybody knows it. The userbase is huge and now we have a (free) API to. Everything is good….but the documentation. I spent a day writing my Sudoku Facebook application yesterday.

I already had the sudoku javascript widget ready to go - the time was spent wading through pages of documentation and downloading toolkits that (as it turns out) I didn’t need. As far as I can tell, Facebook allows you to create applications that appear to the user in 2 different areas. 1 - The profile. 2 - The ‘Canvas page’. Ok, thats it for the overview. 1. <script type=text/javascript> var iRandom; function Restart() { iRandom = Math.floor(Math.random()*10)+1; alert('OK, I am thinking of a number between 1 and 10'); } function Guess() { var yourGuess = document.getElementById('myGuess').value; if (yourGuess>iRandom) alert('Too High.'); if (yourGuess<iRandom) alert('Too Low.'); if (yourGuess==iRandom) { alert('Well done!

Ok, now log into Facebook. 2. 3. 5. 6. Free Webmaster Tutorials - Quackit.com.

JSP