Education/Projects/ProcessingForTheWeb/Tasks
< Education | Projects | ProcessingForTheWeb
Jump to navigation
Jump to search
Summary
This page lists tasks to be done as part of the Processing For The Web project, in order to fully implement all of Processing in processing.js. The work is being led by David Humphrey and Al MacDonald, and done by students at Seneca College. You are welcome to join this work.
Task List
The following lists of Bugs, Features, and Functions was compiled by Al MacDonald.
Bugs
| Bug | Description | Difficulty |
|---|---|---|
| variable + space + semicolon | Defining a variable such as "float y ;" with a space between the number and the semicolon can cause regex parsing errors. | Difficult |
| // Comment | Using double slashed comments // at the end of any script will cause REGEX to loop on parsing, subsequently crashing browser. Quick solution is to add a blank line at the end of every script. | Difficult |
| mouseX & mouseY | mouseX and mouseY are returned as incorrect values when the canvas is a child of a relative element. | Medium |
| nf() | Using nf() on some numbers crashes FireFox. EG: String sf = nf(9.012, 3, 5); from http://processing.org/reference/color_datatype.html will not work. | Difficult |
| keyCode, CODED, etc | Keyboard functions need fleshing out and cross-browser/cross-platform testing. | Medium |
| The Angel Bug | When the regex parse encounters strings with a comma in, it parses the word before the comma as a variable. Work around is to escape strings... String myString = “this \, is a string”; But that is in no way ideal. More info: http://hyper-metrix.com/processing-js/docs/?page=Angels%20Weep | Difficult |
| Drop frame system | A method to drop frames that are not drawn in time. This would be great for media-syncing if you want your app to stay in-time with audio and video. Not sure how plain-old JS timers will handle this... but it's worth testing | Medium |
Missing Features
This is a list of all the out-standing functions in the Processing.js implementation. A more detailed description of the unfinished functions can be found at: http://processingjs.org/reference. (Click “toggle all” to see the list.)
3D Features
| Name | Description | Who's working on it. | STATUS | Difficulty |
|---|---|---|---|---|
| curve() | Need the 3rd dimension here. | Difficult | ||
| box() | And here. | asalga | Difficult | |
| sphere() | And here... | Difficult | ||
| sphereDetail() | Yep... lots of 3D needed. | Difficult | ||
| rotateX() | Done the math. Not implemented in in Processing.js. See: http://hascanvas.com/Disco for example. | Difficult | ||
| rotateY() | Done the math. Not implemented in in PJS. Superior code welcome. | Difficult | ||
| rotateZ() | Done the math. Not implemented in in PJS. Superior code welcome. | Difficult | ||
| abientLight() | Difficult | |||
| directionalLight() | Difficult | |||
| lightFalloff() | ||||
| lightSpecular() | Difficult | |||
| lights() | Difficult | |||
| noLights() | Difficult | |||
| normal() | Done the math. Not implemented in in PJS. Superior code welcome. | Difficult | ||
| pointLight() | Difficult | |||
| spotLight() | Difficult | |||
| beginCamera() | Difficult | |||
| camera() | Difficult | |||
| endCamera() | Difficult | |||
| frustrum() | Done the math. Not implemented in in PJS. Superior code welcome. | Difficult | ||
| ortho() | Difficult | |||
| perspective() | Difficult | |||
| printCamera() | ||||
| printProjection() | Difficult | |||
| modelX() | Difficult | |||
| modelY() | ||||
| modelZ() | Difficult | |||
| screenX() | Difficult | |||
| screenY() | Difficult | |||
| screenZ() | Difficult | |||
| ambient() | Difficult | |||
| emissive() | Difficult | |||
| shininess() | Difficult | |||
| specular() | Difficult | |||
| scale() | Only 2D implemented | Difficult | ||
| rotate() | Only 2D implemented | Difficult | ||
| translate() | Only 2D implemented | Difficult | ||
| hint() | Detects OpenGL hardware, specs etc. | Difficult | ||
| PVector | 2D or 3D vector should be returned. | Difficult |
Misc. Features
| Name | Description | Who's working on it. | STATUS |
|---|---|---|---|
| delay() | Some exploration done... a couple of work-arounds found. A deeper look into this needed as the work-arounds did not function as expected in all situations due to the non-blocking nature of Javascript animation techniques. | ||
| popStyle() | Requested by Google Group. | ||
| private | Worth the effort in Javascript? Maybe. | ||
| pushStyle() | Requested by Google Group. | ||
| cursor() | Some work finished and pushed to master. | ||
| focused | |||
| noCursor() | |||
| online | Relevant in a Javascript environment? Perhaps. | ||
| screen | Could be useful to get window.innerHeight etc? | ||
| long | |||
| Hashmap | |||
| XMLElement | |||
| binary() | |||
| boolean() | |||
| hex() | |||
| unbinary() | |||
| unhex() | |||
| join() | |||
| match() | |||
| matchAll() | |||
| nfc() | |||
| nfp() | |||
| nfs() | |||
| trim() | |||
| split() | |||
| splitTokens() | |||
| append() | |||
| arrayCopy() | |||
| concat() | |||
| expand() | |||
| reverse() | |||
| shorten() | |||
| sort() | |||
| splice() | |||
| subset() | |||
| PShape() | Started working on this myself (outside of PJS). Can parse most SVGs. A whole ton of quircks/bugs cross-browser that stop this in it's tracks in terms of a pure-implementation. Have been adding these to Apple, Opera, BugZilla as I go. More details if needed. | ||
| bezierDetail() | |||
| bezierPoint() | |||
| bezierTangent() | |||
| curveDetail() | |||
| curvePoint() | |||
| curveTangent() | |||
| noSmooth() | Possible/worth the processing with Canvas? Probably not. Feedback welcome. | ||
| strokeCap() | |||
| strokeJoin() | |||
| texture() | |||
| textureMode() | |||
| loadShape() | SVG function. | ||
| shape() | SVG function. | ||
| shapeMode() | SVG function. | ||
| createInput() | |||
| loadBytes() | Started working on this. Can read binary from file with JS using someone else's open-source. Not added into Processing.js yet. | ||
| open() | |||
| selectFolder() | |||
| selectInput() | |||
| param() | Needed in JS? | ||
| status() | Don't think Firefox will let you change status bar with JS re: security. | ||
| save() | Some work done by Google group. Could be combined with binary functions ot HTML5 functions to write directly to server? | ||
| saveFrame() | As above in save(). Probably don't want to start saving TIFs in a web environment. Canvas exports png, gif, jpg natively already. Spec deviation from Processing proper may be wise. | ||
| PrintWriter | Saves text to file. | ||
| beginRaw() | |||
| beginRecord() | |||
| createOutput() | |||
| createReader() | |||
| createWriter() | |||
| endRaw() | |||
| endRecord() | |||
| saveBytes() | |||
| saveStream() | |||
| saveStrings() | |||
| selectOutput() | |||
| applyMatrix() | |||
| printMatrix() | |||
| resetMatrix() | |||
| blendColor() | |||
| brightness() | |||
| hue() | |||
| saturation() | |||
| PImage | Pimage is in the library but it would be great to get PJS loading the images into the DOM dynamically. This is also a fairly common request on the Google group. | ||
| imageMode() | |||
| noTint() | |||
| requestImage() | No sure if this is actually needed in JS as DOM image would load async anyway. Probably worth looking into a little more. | ||
| blend() | |||
| copy() | |||
| filter() | |||
| PGraphics | Could be worth-while to get PGraphics to use a separate canvas and getPixels() from it. Great for say... animating the mouth moving on one canvas before applying the result to a UV map for a 3D object. | ||
| Would this offer any performance/feature reward over using a reagular Javascript 1 dimensional array containing pixels? | |||
| PFont | Already working. The existing routines will likely get either a) merged with PShape's SVG functions or b) dropped in favor of something faster re: real browser fonts if we can borrow a little time from Mozilla developers. (We are currently using SVGs.) | ||
| PVector | 2D...3D vector should be returned. | ||
| exp() | |||
| log() | |||
| mag() | asalga | ||
| map() | |||
| acos() | |||
| asin() | |||
| atan() |