Code flow: Difference between revisions

From XPUB & Lens-Based wiki
Line 73: Line 73:
Reaching into the document and grabbing hold of the page.
Reaching into the document and grabbing hold of the page.


== Canvas ==
== [[Canvas]] ==


The [[wikipedia:Canvas element|canvas]] tag was introduced by Apple and has been [http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html standardized to become part of HTML5].
The [[wikipedia:Canvas element|canvas]] tag was introduced by Apple and has been [http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html standardized to become part of HTML5].

Revision as of 14:55, 24 September 2012

<slidy theme="aa" />

A Computer Glossary

Charles & Ray Eames 1968

Produced for the IBM Corporation pavilion at Hemisfair, the 1968 Worlds Fair in San Antonio, Texas.

Code

http://rosettacode.org/wiki/Category:Draft_Programming_Tasks

http://rosettacode.org/wiki/99_Bottles_of_Beer

Expression / Evaluation

Some expressions for the console...

5
3
"Tristram"
'SHAndy'

Operations

5 * 3
100 - 1
3 * 8
"Tristram" + "Shandy"

Operations: Functions

Math.sqrt (25)
Math.sqrt (26)

Objects

"Tristram".toUpperCase

?!

"Tristram".toUpperCase()

Assignment

Assignment is the process of storing an expression in a "name", called a variable.

x = 5 * 3
name = "Tristram"

Assignment ++

x = x + 1
x += 1
x++
name = name + " Shandy"

DOM

c=document.getElementById("c")

Reaching into the document and grabbing hold of the page.

Canvas

The canvas tag was introduced by Apple and has been standardized to become part of HTML5.

A simple example page...

A Script

BASIC

BASIC example

Branch

http://en.wikipedia.org/wiki/Conditional_jump

IF-THEN-(ELSE)

Making functions

Function / Callback

Exercise: Canvas

Handouts

Assignment, GeneralImperative + ProgramHighLow

Debug / Trace

Scope

Loop

Afternoon: Image Manipulation

The CanvasPixelArray contains height x width x 4 bytes of data, with index values ranging from 0 to (height x width x 4)-1.

context.getImageData

context.putImageData

! Come up with examples showing variable scope.