diff --git a/voicegardens/static/images/.DS_Store b/voicegardens/static/images/.DS_Store
new file mode 100644
index 0000000..5008ddf
Binary files /dev/null and b/voicegardens/static/images/.DS_Store differ
diff --git a/voicegardens/static/images/ABOUT-BW.png b/voicegardens/static/images/ABOUT-BW.png
new file mode 100644
index 0000000..980c392
Binary files /dev/null and b/voicegardens/static/images/ABOUT-BW.png differ
diff --git a/voicegardens/static/images/ABOUT-COLOR.png b/voicegardens/static/images/ABOUT-COLOR.png
new file mode 100644
index 0000000..037e61e
Binary files /dev/null and b/voicegardens/static/images/ABOUT-COLOR.png differ
diff --git a/voicegardens/static/images/ABOUT-COLOUR.png b/voicegardens/static/images/ABOUT-COLOUR.png
deleted file mode 100644
index c684a3e..0000000
Binary files a/voicegardens/static/images/ABOUT-COLOUR.png and /dev/null differ
diff --git a/voicegardens/static/images/ABOUT-WHITE.png b/voicegardens/static/images/ABOUT-WHITE.png
deleted file mode 100644
index 725ef9f..0000000
Binary files a/voicegardens/static/images/ABOUT-WHITE.png and /dev/null differ
diff --git a/voicegardens/static/images/CHORUS-BW.png b/voicegardens/static/images/CHORUS-BW.png
new file mode 100644
index 0000000..498c2f5
Binary files /dev/null and b/voicegardens/static/images/CHORUS-BW.png differ
diff --git a/voicegardens/static/images/CHORUS-COLOR.png b/voicegardens/static/images/CHORUS-COLOR.png
new file mode 100644
index 0000000..e349ec1
Binary files /dev/null and b/voicegardens/static/images/CHORUS-COLOR.png differ
diff --git a/voicegardens/static/images/CHORUS-COLOUR.png b/voicegardens/static/images/CHORUS-COLOUR.png
deleted file mode 100644
index 51c1203..0000000
Binary files a/voicegardens/static/images/CHORUS-COLOUR.png and /dev/null differ
diff --git a/voicegardens/static/images/CHORUS-WHITE.png b/voicegardens/static/images/CHORUS-WHITE.png
deleted file mode 100644
index bc39ab5..0000000
Binary files a/voicegardens/static/images/CHORUS-WHITE.png and /dev/null differ
diff --git a/voicegardens/static/images/GARDEN-BW.png b/voicegardens/static/images/GARDEN-BW.png
new file mode 100644
index 0000000..7f26271
Binary files /dev/null and b/voicegardens/static/images/GARDEN-BW.png differ
diff --git a/voicegardens/static/images/GARDEN-COLOR.png b/voicegardens/static/images/GARDEN-COLOR.png
new file mode 100644
index 0000000..003dad9
Binary files /dev/null and b/voicegardens/static/images/GARDEN-COLOR.png differ
diff --git a/voicegardens/static/images/GARDEN-COLOUR.png b/voicegardens/static/images/GARDEN-COLOUR.png
deleted file mode 100644
index bd8b39c..0000000
Binary files a/voicegardens/static/images/GARDEN-COLOUR.png and /dev/null differ
diff --git a/voicegardens/static/images/GARDEN-WHITE.png b/voicegardens/static/images/GARDEN-WHITE.png
deleted file mode 100644
index e01b682..0000000
Binary files a/voicegardens/static/images/GARDEN-WHITE.png and /dev/null differ
diff --git a/voicegardens/static/images/PLAY-BW.png b/voicegardens/static/images/PLAY-BW.png
new file mode 100644
index 0000000..299c1c4
Binary files /dev/null and b/voicegardens/static/images/PLAY-BW.png differ
diff --git a/voicegardens/static/images/PLAY-COLOR.png b/voicegardens/static/images/PLAY-COLOR.png
new file mode 100644
index 0000000..56028e9
Binary files /dev/null and b/voicegardens/static/images/PLAY-COLOR.png differ
diff --git a/voicegardens/static/images/PLAY-COLOUR.png b/voicegardens/static/images/PLAY-COLOUR.png
deleted file mode 100644
index 49c3feb..0000000
Binary files a/voicegardens/static/images/PLAY-COLOUR.png and /dev/null differ
diff --git a/voicegardens/static/images/PLAY-WHITE.png b/voicegardens/static/images/PLAY-WHITE.png
deleted file mode 100644
index b81839e..0000000
Binary files a/voicegardens/static/images/PLAY-WHITE.png and /dev/null differ
diff --git a/voicegardens/static/images/RECORD-BW.png b/voicegardens/static/images/RECORD-BW.png
new file mode 100644
index 0000000..7447453
Binary files /dev/null and b/voicegardens/static/images/RECORD-BW.png differ
diff --git a/voicegardens/static/images/RECORD-COLOR.png b/voicegardens/static/images/RECORD-COLOR.png
new file mode 100644
index 0000000..e72dcab
Binary files /dev/null and b/voicegardens/static/images/RECORD-COLOR.png differ
diff --git a/voicegardens/static/images/RECORD-COLOUR.png b/voicegardens/static/images/RECORD-COLOUR.png
deleted file mode 100644
index 8c5c0ea..0000000
Binary files a/voicegardens/static/images/RECORD-COLOUR.png and /dev/null differ
diff --git a/voicegardens/static/images/RECORD-WHITE.png b/voicegardens/static/images/RECORD-WHITE.png
deleted file mode 100644
index 9aaeaaf..0000000
Binary files a/voicegardens/static/images/RECORD-WHITE.png and /dev/null differ
diff --git a/voicegardens/static/images/STOP-BW.png b/voicegardens/static/images/STOP-BW.png
new file mode 100644
index 0000000..ffb1cae
Binary files /dev/null and b/voicegardens/static/images/STOP-BW.png differ
diff --git a/voicegardens/static/images/STOP-COLOR.png b/voicegardens/static/images/STOP-COLOR.png
new file mode 100644
index 0000000..0d906a3
Binary files /dev/null and b/voicegardens/static/images/STOP-COLOR.png differ
diff --git a/voicegardens/static/images/STOP-COLOUR.png b/voicegardens/static/images/STOP-COLOUR.png
deleted file mode 100644
index 8ed5cab..0000000
Binary files a/voicegardens/static/images/STOP-COLOUR.png and /dev/null differ
diff --git a/voicegardens/static/images/STOP-WHITE.png b/voicegardens/static/images/STOP-WHITE.png
deleted file mode 100644
index e0b54fc..0000000
Binary files a/voicegardens/static/images/STOP-WHITE.png and /dev/null differ
diff --git a/voicegardens/static/p5js/p5.dom.js b/voicegardens/static/p5js/p5.dom.js
new file mode 100644
index 0000000..b860b2d
--- /dev/null
+++ b/voicegardens/static/p5js/p5.dom.js
@@ -0,0 +1,1028 @@
+/*! p5.dom.js v0.2.0 February 2, 2015 */
+/**
+ * The web is much more than just canvas and p5.dom makes it easy to interact
+ * with other HTML5 objects, including text, hyperlink, image, input, video,
+ * audio, and webcam.
+ * There is a set of creation methods, DOM manipulation methods, and
+ * an extended p5.Element that supports a range of HTML elements. See the
+ *
+ * beyond the canvas tutorial for a full overview of how this addon works.
+ *
+ *
Methods and properties shown in black are part of the p5.js core, items in
+ * blue are part of the p5.dom library. You will need to include an extra file
+ * in order to access the blue functions. See the
+ * using a library
+ * section for information on how to include this library. p5.dom comes with
+ * p5 complete or you can download the single file
+ *
+ * here.
+ * See tutorial: beyond the canvas]
+ * for more info on how to use this libary.
+ *
+ * @module p5.dom
+ * @submodule p5.dom
+ * @for p5.dom
+ * @main
+ */
+
+(function (root, factory) {
+ if (typeof define === 'function' && define.amd)
+ define('p5.dom', ['p5'], function (p5) { (factory(p5));});
+ else if (typeof exports === 'object')
+ factory(require('../p5'));
+ else
+ factory(root['p5']);
+}(this, function (p5) {
+// =============================================================================
+// p5 additions
+// =============================================================================
+
+ /**
+ * Searches the page for an element with given ID and returns it as
+ * a p5.Element. The DOM node itself can be accessed with .elt.
+ * Returns null if none found.
+ *
+ * @method getElement
+ * @param {String} id id of element to search for
+ * @return {Object/p5.Element|Null} p5.Element containing node found
+ */
+ p5.prototype.getElement = function (e) {
+ var res = document.getElementById(e);
+ if (res) {
+ return wrapElement(res);
+ } else {
+ return null;
+ }
+ };
+
+ /**
+ * Searches the page for elements with given class and returns an
+ * array of p5.Elements. The DOM nodes themselves can be accessed
+ * with .elt. Returns an empty array if none found.
+ *
+ * @method getElements
+ * @param {String} class class name of elements to search for
+ * @return {Array} array of p5.Element wrapped nodes found
+ */
+ p5.prototype.getElements = function (e) {
+ var arr = [];
+ var res = document.getElementsByClassName(e);
+ if (res) {
+ for (var j = 0; j < res.length; j++) {
+ var obj = wrapElement(res[j]);
+ arr.push(obj);
+ }
+ }
+ return arr;
+ };
+
+ /**
+ * Helper function for getElement and getElements.
+ */
+ function wrapElement(elt) {
+ if (elt.tagName === "VIDEO" || elt.tagName === "AUDIO") {
+ return new p5.MediaElement(elt);
+ } else {
+ return new p5.Element(elt);
+ }
+ }
+
+ /**
+ * Removes all elements created by p5, except any canvas / graphics
+ * elements created by createCanvas or createGraphics.
+ * Event handlers are removed, and element is removed from the DOM.
+ * @method removeElements
+ * @example
+ *
+ * function setup() {
+ * createCanvas(100, 100);
+ * createDiv('this is some text');
+ * createP('this is a paragraph');
+ * }
+ * function mousePressed() {
+ * removeElements(); // this will remove the div and p, not canvas
+ * }
+ *
+ *
+ */
+ p5.prototype.removeElements = function (e) {
+ for (var i=0; ithis
+ * page for further information about supported formats.
+ *
+ * @method createVideo
+ * @param {String|Array} src path to a video file, or array of paths for
+ * supporting different browsers
+ * @param {Object} [callback] callback function to be called upon
+ * 'canplaythrough' event fire, that is, when the
+ * browser can play the media, and estimates that
+ * enough data has been loaded to play the media
+ * up to its end without having to stop for
+ * further buffering of content
+ * @return {Object/p5.Element} pointer to video p5.Element
+ */
+ p5.prototype.createVideo = function(src, callback) {
+ return createMedia(this, 'video', src, callback);
+ };
+
+ /** AUDIO STUFF **/
+
+ /**
+ * Creates a hidden HTML5 <audio> element in the DOM for simple audio
+ * playback. Appends to the container node if one is specified,
+ * otherwise appends to body. The first parameter
+ * can be either a single string path to a audio file, or an array of string
+ * paths to different formats of the same audio. This is useful for ensuring
+ * that your audio can play across different browsers, as each supports
+ * different formats. See this
+ * page for further information about supported formats.
+ *
+ * @method createAudio
+ * @param {String|Array} src path to an audio file, or array of paths for
+ * supporting different browsers
+ * @param {Object} [callback] callback function to be called upon
+ * 'canplaythrough' event fire, that is, when the
+ * browser can play the media, and estimates that
+ * enough data has been loaded to play the media
+ * up to its end without having to stop for
+ * further buffering of content
+ * @return {Object/p5.Element} pointer to audio p5.Element
+ */
+ p5.prototype.createAudio = function(src, callback) {
+ return createMedia(this, 'audio', src, callback);
+ };
+
+
+ /** CAMERA STUFF **/
+
+ p5.prototype.VIDEO = 'video';
+ p5.prototype.AUDIO = 'audio';
+
+ navigator.getUserMedia = navigator.getUserMedia ||
+ navigator.webkitGetUserMedia ||
+ navigator.mozGetUserMedia ||
+ navigator.msGetUserMedia;
+
+ /**
+ * Creates a new <video> element that contains the audio/video feed
+ * from a webcam. This can be drawn onto the canvas using video(). More
+ * specific properties of the stream can be passing in a Constraints object.
+ * See the
+ * W3C
+ * spec for possible properties. Note that not all of these are supported
+ * by all browsers.
+ *
+ * @method createCapture
+ * @param {String/Constant|Object} type type of capture, either VIDEO or
+ * AUDIO if none specified, default both,
+ * or a Constraints boject
+ * @param {Function} callback function to be called once
+ * stream has loaded
+ * @return {Object/p5.Element} capture video p5.Element
+ * @example
+ *
+ * var capture;
+ *
+ * function setup() {
+ * createCanvas(480, 120);
+ * capture = createCapture(VIDEO);
+ * }
+ *
+ * function draw() {
+ * image(capture, 0, 0, width, width*capture.height/capture.width);
+ * filter(INVERT);
+ * }
+ *
+ *
+ * function setup() {
+ * createCanvas(480, 120);
+ * var constraints = {
+ * video: {
+ * mandatory: {
+ * minWidth: 1280,
+ * minHeight: 720
+ * },
+ * optional: [
+ * { maxFrameRate: 10 }
+ * ]
+ * },
+ * audio: true
+ * };
+ * createCapture(constraints, function(stream) {
+ * console.log(stream);
+ * });
+ * }
+ *
+ */
+ p5.prototype.createCapture = function() {
+ var useVideo = true;
+ var useAudio = true;
+ var constraints;
+ var cb;
+ for (var i=0; i
+ * var div0 = createDiv('this is the parent');
+ * var div1 = createDiv('this is the child');
+ * div0.child(div1); // use p5.Element
+ *
+ *
+ * var div0 = createDiv('this is the parent');
+ * var div1 = createDiv('this is the child');
+ * div1.id('apples');
+ * div0.child('apples'); // use id
+ *
+ *
+ * var div0 = createDiv('this is the parent');
+ * var elt = document.getElementById('myChildDiv');
+ * div0.child(elt); // use element from page
+ *
+ */
+ p5.Element.prototype.child = function(c) {
+ if (typeof c === 'string') {
+ c = document.getElementById(c);
+ } else if (c instanceof p5.Element) {
+ c = c.elt;
+ }
+ this.elt.appendChild(c);
+ return this;
+ };
+
+
+ /**
+ *
+ * If an argument is given, sets the inner HTML of the element,
+ * replacing any existing html. If no arguments are given, returns
+ * the inner HTML of the element.
+ *
+ * @for p5.Element
+ * @method html
+ * @param {String} [html] the HTML to be placed inside the element
+ * @return {p5.Element|String}
+ */
+ p5.Element.prototype.html = function(html) {
+ if (typeof html !== 'undefined') {
+ this.elt.innerHTML = html;
+ return this;
+ } else {
+ return this.elt.innerHTML;
+ }
+ };
+
+ /**
+ *
+ * Sets the position of the element relative to (0, 0) of the
+ * window. Essentially, sets position:absolute and left and top
+ * properties of style.
+ *
+ * @method position
+ * @param {Number} x x-position relative to upper left of window
+ * @param {Number} y y-position relative to upper left of window
+ * @return {p5.Element}
+ * @example
+ *
+ * function setup() {
+ * var cnv = createCanvas(100, 100);
+ * // positions canvas 50px to right and 100px
+ * // below upper left corner of the window
+ * cnv.position(50, 100);
+ * }
+ *
+ */
+ p5.Element.prototype.position = function(x, y) {
+ this.elt.style.position = 'absolute';
+ this.elt.style.left = x+'px';
+ this.elt.style.top = y+'px';
+ return this;
+ };
+
+ /**
+ *
+ * Sets the given style (css) property of the element with the given value.
+ * If no value is specified, returns the value of the given property,
+ * or undefined if the property is not.
+ *
+ * @method style
+ * @param {String} property property to be set
+ * @param {String} [value] value to assign to property
+ * @return {String|p5.Element} value of property, if no value is specified
+ * or p5.Element
+ * @example
+ *
+ * var myDiv = createDiv("I like pandas.");
+ * myDiv.style("color", "#ff0000");
+ * myDiv.style("font-size", "18px");
+ *
+ */
+ p5.Element.prototype.style = function(prop, val) {
+ if (typeof val === 'undefined') {
+ var attrs = prop.split(';');
+ for (var i=0; i
+ * var myDiv = createDiv("I like pandas.");
+ *myDiv.attribute("align", "center");
+ *
+ */
+ p5.Element.prototype.attribute = function(attr, value) {
+ if (typeof value === 'undefined') {
+ return this.elt.getAttribute(attr);
+ } else {
+ this.elt.setAttribute(attr, value);
+ return this;
+ }
+ };
+
+
+ /**
+ * Either returns the value of the element if no arguments
+ * given, or sets the value of the element.
+ *
+ * @method value
+ * @param {String|Number} [value]
+ * @return {String|p5.Element} value of element, if no value is
+ * specified or p5.Element
+ */
+ p5.Element.prototype.value = function() {
+ if (arguments.length > 0) {
+ this.elt.value = arguments[0];
+ return this;
+ } else {
+ if (this.elt.type === 'range') {
+ return parseFloat(this.elt.value);
+ }
+ else return this.elt.value;
+ }
+ };
+
+ /**
+ *
+ * Shows the current element. Essentially, setting display:block for the style.
+ *
+ * @method show
+ * @return {p5.Element}
+ */
+ p5.Element.prototype.show = function() {
+ this.elt.style.display = 'block';
+ return this;
+ };
+
+ /**
+ * Hides the current element. Essentially, setting display:none for the style.
+ *
+ * @method hide
+ * @return {p5.Element}
+ */
+ p5.Element.prototype.hide = function() {
+ this.elt.style.display = 'none';
+ return this;
+ };
+
+ /**
+ *
+ * Sets the width and height of the element. AUTO can be used to
+ * only adjust one dimension.
+ *
+ * @method size
+ * @param {Number} w width of the element
+ * @param {Number} h height of the element
+ * @return {p5.Element}
+ */
+ p5.Element.prototype.size = function(w, h) {
+ var aW = w;
+ var aH = h;
+ var AUTO = p5.prototype.AUTO;
+ if (aW !== AUTO || aH !== AUTO) {
+ if (aW === AUTO) {
+ aW = h * this.width / this.height;
+ } else if (aH === AUTO) {
+ aH = w * this.height / this.width;
+ }
+ // set diff for cnv vs normal div
+ if (this.elt instanceof HTMLCanvasElement) {
+ var j = {};
+ var k = this.elt.getContext('2d');
+ for (var prop in k) {
+ j[prop] = k[prop];
+ }
+ this.elt.setAttribute('width', aW * this._pInst._pixelDensity);
+ this.elt.setAttribute('height', aH * this._pInst._pixelDensity);
+ this.elt.setAttribute('style', 'width:' + aW + 'px !important; height:' + aH + 'px !important;');
+ this._pInst.scale(this._pInst._pixelDensity, this._pInst._pixelDensity);
+ for (var prop in j) {
+ this.elt.getContext('2d')[prop] = j[prop];
+ }
+ } else {
+ this.elt.style.width = aW+'px !important';
+ this.elt.style.height = aH+'px !important';
+ this.elt.width = aW;
+ this.elt.height = aH;
+ }
+ this.elt.style.overflow = 'hidden';
+ this.width = this.elt.offsetWidth;
+ this.height = this.elt.offsetHeight;
+
+ if (this._pInst) { // main canvas associated with p5 instance
+ if (this._pInst._curElement.elt === this.elt) {
+ this._pInst._setProperty('width', this.elt.offsetWidth);
+ this._pInst._setProperty('height', this.elt.offsetHeight);
+ }
+ }
+ }
+ return this;
+ };
+
+ /**
+ * Removes the element and deregisters all listeners.
+ * @method remove
+ * @example
+ *
+ * var myDiv = createDiv('this is some text');
+ * myDiv.remove();
+ *
+ */
+ p5.Element.prototype.remove = function() {
+ // deregister events
+ for (var ev in this._events) {
+ this.elt.removeEventListener(ev, this._events[ev]);
+ }
+ if (this.elt.parentNode) {
+ this.elt.parentNode.removeChild(this.elt);
+ }
+ delete(this);
+ };
+
+
+
+// =============================================================================
+// p5.MediaElement additions
+// =============================================================================
+
+
+ /**
+ * Extends p5.Element to handle audio and video. In addition to the methods
+ * of p5.Element, it also contains methods for controlling media. It is not
+ * called directly, but p5.MediaElements are created by calling createVideo,
+ * createAudio, and createCapture.
+ *
+ * @class p5.MediaElement
+ * @constructor
+ * @param {String} elt DOM node that is wrapped
+ * @param {Object} [pInst] pointer to p5 instance
+ */
+ p5.MediaElement = function(elt, pInst) {
+ p5.Element.call(this, elt, pInst);
+ };
+ p5.MediaElement.prototype = Object.create(p5.Element.prototype);
+
+
+
+
+ /**
+ * Play an HTML5 media element.
+ *
+ * @method play
+ * @return {p5.Element}
+ */
+ p5.MediaElement.prototype.play = function() {
+ if (this.elt.currentTime === this.elt.duration) {
+ this.elt.currentTime = 0;
+ }
+ this.elt.play();
+ return this;
+ };
+
+ /**
+ * Stops an HTML5 media element (sets current time to zero).
+ *
+ * @method stop
+ * @return {p5.Element}
+ */
+ p5.MediaElement.prototype.stop = function() {
+ this.elt.pause();
+ this.elt.currentTime = 0;
+ return this;
+ };
+
+ /**
+ * Pauses an HTML5 media element.
+ *
+ * @method pause
+ * @return {p5.Element}
+ */
+ p5.MediaElement.prototype.pause = function() {
+ this.elt.pause();
+ return this;
+ };
+
+ /**
+ * Set 'loop' to true for an HTML5 media element, and starts playing.
+ *
+ * @method loop
+ * @return {p5.Element}
+ */
+ p5.MediaElement.prototype.loop = function() {
+ this.elt.setAttribute('loop', true);
+ this.play();
+ return this;
+ };
+ /**
+ * Set 'loop' to false for an HTML5 media element. Element will stop
+ * when it reaches the end.
+ *
+ * @method noLoop
+ * @return {p5.Element}
+ */
+ p5.MediaElement.prototype.noLoop = function() {
+ this.elt.setAttribute('loop', false);
+ return this;
+ };
+
+
+ /**
+ * Set HTML5 media element to autoplay or not.
+ *
+ * @method autoplay
+ * @param {Boolean} autoplay whether the element should autoplay
+ * @return {p5.Element}
+ */
+ p5.MediaElement.prototype.autoplay = function(val) {
+ this.elt.setAttribute('autoplay', val);
+ return this;
+ };
+
+ /**
+ * Sets volume for this HTML5 media element. If no argument is given,
+ * returns the current volume.
+ *
+ * @param {Number} [val] volume between 0.0 and 1.0
+ * @return {Number|p5.MediaElement} current volume or p5.MediaElement
+ * @method volume
+ */
+ p5.MediaElement.prototype.volume = function(val) {
+ if (typeof val === 'undefined') {
+ return this.elt.volume;
+ } else {
+ this.elt.volume = val;
+ }
+ };
+
+ /**
+ * If no arguments are given, returns the current time of the elmeent.
+ * If an argument is given the current time of the element is set to it.
+ *
+ * @method time
+ * @param {Number} [time] time to jump to (in seconds)
+ * @return {Number|p5.MediaElement} current time (in seconds)
+ * or p5.MediaElement
+ */
+ p5.MediaElement.prototype.time = function(val) {
+ if (typeof val === 'undefined') {
+ return this.elt.currentTime;
+ } else {
+ this.elt.currentTime = val;
+ }
+ };
+
+ /**
+ * Returns the duration of the HTML5 media element.
+ *
+ * @method duration
+ * @return {Number} duration
+ */
+ p5.MediaElement.prototype.duration = function() {
+ return this.elt.duration;
+ };
+ p5.MediaElement.prototype.pixels = [];
+ p5.MediaElement.prototype.loadPixels = function() {
+ if (this.loadedmetadata) { // wait for metadata for w/h
+ if (!this.canvas) {
+ this.canvas = document.createElement('canvas');
+ this.canvas.width = this.width;
+ this.canvas.height = this.height;
+ this.drawingContext = this.canvas.getContext('2d');
+ }
+ this.drawingContext.drawImage(this.elt, 0, 0, this.width, this.height);
+ p5.prototype.loadPixels.call(this);
+ }
+ return this;
+ }
+ p5.MediaElement.prototype.updatePixels = function(x, y, w, h){
+ if (this.loadedmetadata) { // wait for metadata
+ p5.prototype.updatePixels.call(this, x, y, w, h);
+ }
+ return this;
+ }
+ p5.MediaElement.prototype.get = function(x, y, w, h){
+ if (this.loadedmetadata) { // wait for metadata
+ return p5.prototype.get.call(this, x, y, w, h);
+ } else return [0, 0, 0, 255];
+ };
+ p5.MediaElement.prototype.set = function(x, y, imgOrCol){
+ if (this.loadedmetadata) { // wait for metadata
+ p5.prototype.set.call(this, x, y, imgOrCol);
+ }
+ };
+}));