PlanningPages

=** For Graphics - JavaScript **=
 * ** Show them Xmas slides in Processing **
 * Then same in JavaScript **


 * HTML+JS has the advantage that it is web-based, **
 * so web-access is faster and more reliable than Processing, **
 * and supports more features. **


 * JS is Event Driven - no Draw loop. **
 * Also Object Oriented - we will use OBJECTS to be clickable, **
 * rather than worrying about mouseX and mouseY. **


 * Get started early with GUI elements - buttons, etc. **


 * Need to find an appropriate library. **
 * Don't really need HTML Canvas **
 * support, as we've done enough drawing. **
 * Stick to pictures. **


 * Would be good to figure out how to control videos. **


 * Use [|KOMODO] for editing. **
 * And it has a nice Macro tool **
 * Simple, no surprises, good pop-up syntax completion **

=** My Samples **=

https://dl.dropbox.com/u/239179/graphics/javascript/html4test.html

[|Windows 8 Pic] [|Live Tiles Patent Lawsuit] [|Organizing Tiles]

[|Color Picker]

=EZJS=

[|lesson3]

=My Tutorials=

[|Churchill] [|Clickable Pics PDF] [|Win8tiles]

=HTML 5=

[|Notes and Tutorials]

[|HTML 5 Overview] [|HTML 5 Cheat Sheet] [|Canvas Cheat Sheet]

[|HTML5 Games] [|Dive Into HTML5] [|Slider]

[|30 HTML 5 Tutorials] [|CSS Style Properties]

[|Animation VIDEO Tutor]

[|Javascript Video Tutorial Beginners] [|Eloquent Javascript] [|Thorough JS Notes - organized]


 * CAMERAS**

[|Bigshot DIY]

[|mp4 and m4v] [|Free background music] [|Add music in iMovie]
 * Movies**

http://www.techrepublic.com/blog/webmaster/html5-drawing-images-and-adding-text-to-the-canvas-element/586
 * Digital Signatures**
 * [|BitCoint Techy]** || ** Text Boxes : **

Tutorial http://sixrevisions.com/html/canvas-element/

Canvas Basic Intro http://www.onlywebpro.com/2011/06/25/html5-canvas-for-absolute-beginners-part-1/

Online Tutorial + Framework JCOTTON http://jcotton.sourceforge.net/tutorials.htm

Paper.js - framework + tutorial + reference http://paperjs.org/

Tutorial Videos http://www.developphp.com/view.php?tid=1262

Pretty Drawing Tutorial with Good Reference http://www.html5canvastutorials.com/

Reference Tutorial http://www.html5canvastutorials.com/tutorials/html5-canvas-image-crop/

IMAGE problems **Images must be PRELOADED, otherwise canvasImage will not draw the image**
 * the first time, but rather the second time it executes.**
 * Using a normal works better, but images stretch or shrink automatically,**
 * and you can only put the image in the box - no text or drawings.**

Examples
[|Asteroids]

GOOGLE DRIVE (DOCS)

Drawing Intro Tutorial** [|http://www.youtube.com/watch?v=gQng2kJ-N9k]

=
===================================
 * Freeware for 2013-14 (Macs)**

> . . . . . .. . . . QuickNEasy WebBuilder (20 USD)
 * Web-pages = SeaMonkey . . . BlueGriffon . . . Komodo . . . Firefox

> > > > > . . . . . . jsfiddle.net. . jsbin.com !! . . . Google Sites (adventure game) >
 * Java = BlueJ (IB) . . . . Processing (Graphics+IB) . . . . NetBeans (IB2) . . . . JDK
 * Graphics = GIMP . . . . Inkscape . . . . Jing . . . . QuickTime . . . Skitch (+Evernote)
 * Office = LibreOffice
 * Math = Geogebra
 * Online = Dropbox . . . . WIX . . . . Haiku . . . . GoogleDocs . . . . Weebly?
 * Tools = Task Manager .. . Transfer on LAN . . . Hex Editor ([|DataWorkshop])

Haiku Links

[|IB12 https://fis.haikulearning.com/upper/ib-computerscience/prva/cms_page/view/5779364] [|IB 11 https://fis.haikulearning.com/upper/ib-computerscience/prva/cms_page/view/5779352]

[|CT https://fis.haikulearning.com/upper/gr09-12computertechnology/cms_page/view] [|GR https://fis.haikulearning.com/upper/gr10-12-graphicsprogramming/cms_page/view]

IB Quick Start page []


 * GRAPHICS**


 * SetTimeout --> Rube Goldberg machines (or whatever they call those connection machines)**

[]

[|jeffutecht.com/fis] ||


 * =Computational Thinking=

[|CT What and Why - Wing 2010] [|Purdue CT Every Day Examples] [|CR For Everyone - Overview for Edu] [|Google CT Lessons] [|CT Critical for k-12] [|Measuring CT Concepts] [|Time to Reload - London Knowledge Lab] [|CT For Youth - Development Plan] [|CT in Teacher Training] [|CT WebQuest] [|Embed CT in STEM Lessons] [|Microsoft CT Links] [|eLearning Gizmos] [|NMC Horizon Report] || [|CT Gaming Concepts] [|NW Uni Stem CT] [|Embed CT in STEM] [|Digital Wisdom]

TSP [|TSP Applet] [|TSP in Wired] [|TSP Movie] [|Europe Simulation] [|p vs np Video] [|RSA Factor Challenge]

[|Using Sci Fi for CompSci]

[|CompSci and CompThinkin Schools]

[|Bring Comp Think to Schools] || **IB NOTES**


 * [|Circuits IGCSE]**

[|Nature of Code(simulations Processing)]

[|Basic Comp Sci Notes]

[|Antitrust Movie]

[|Defining Computer Science]

[|Circuit Simulator] [|Pippin CPU Simulator(1 acc)] [|Multi-Register CPU Simulator] [|AEonline Circuit Sim] [|Fetch-Decode-Execute-Store Video] [|Motherboard and Expansion] [|How Computers work in 20 min] || =CT Year End Ideas= Paper folding. . . sploder.com. . . . egreeting cards. . . . **Linux (games)** 3D - Stereograms - Alice - Sketchup [|Ascii Art] Make a Logo Morphing [|Photo Mosaic] Watch videos, Treasure Hunt Downloading - like Wikipedia, CD Images Recording CD's [|GameSalad.com]
 * CIRCUITS**

=Tools -= Encryption, Compression, Disk clean-up, Steganography Tiny writing hidden in pictures, printing resolution MP3 compression levels (need headphones) Digital Rights Management

[|Awesome Facts]
 * VIDEOS**

CT April Ideas
Wiki Biography Better Bulletin Hypercard, Supercard? [] OS Emulations - http://www.makeuseof.com/tag/4-classic-operating-systems-can-access-browser/#twitter

LIVECODE - []