Skip to content
This repository has been archived by the owner. It is now read-only.

updating to v0.4.16 and fixes #172 #177

Merged
merged 2 commits into from
Nov 2, 2015
Merged

updating to v0.4.16 and fixes #172 #177

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
1270aa6
updating to v0.4.16 and fixes #172
Oct 12, 2015
4a8e91b
update p5 version
Oct 13, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions public/js/debug-console.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@

var original = window.console;
window.console = {};
window._isNodeWebkit = true;

["log", "warn", "error"].forEach(function(func) {
window.console[func] = function(msg) {
Expand Down
176 changes: 150 additions & 26 deletions public/mode_assets/p5/empty_project/libraries/p5.dom.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/*! p5.dom.js v0.2.2 May 30, 2015 */
/*! p5.dom.js v0.2.4 October 6, 2015 */
/**
* <p>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,
Expand Down Expand Up @@ -164,6 +164,13 @@
* @method createDiv
* @param {String} html inner HTML for element created
* @return {Object/p5.Element} pointer to p5.Element holding created node
* @example
* <div class='norender'><code>
* var myDiv;
* function setup() {
* myDiv = createDiv('this is some text');
* }
* </code></div>
*/

/**
Expand All @@ -175,6 +182,13 @@
* @method createP
* @param {String} html inner HTML for element created
* @return {Object/p5.Element} pointer to p5.Element holding created node
* @example
* <div class='norender'><code>
* var myP;
* function setup() {
* myP = createP('this is some text');
* }
* </code></div>
*/

/**
Expand All @@ -185,6 +199,13 @@
* @method createSpan
* @param {String} html inner HTML for element created
* @return {Object/p5.Element} pointer to p5.Element holding created node
* @example
* <div class='norender'><code>
* var mySpan;
* function setup() {
* mySpan = createSpan('this is some text');
* }
* </code></div>
*/
var tags = ['div', 'p', 'span'];
tags.forEach(function(tag) {
Expand All @@ -207,15 +228,25 @@
* @param {String} [alt] alternate text to be used if image does not load
* @param {Function} [successCallback] callback to be called once image data is loaded
* @return {Object/p5.Element} pointer to p5.Element holding created node
* @example
* <div class='norender'><code>
* var img;
* function setup() {
* img = createImg('http://p5js.org/img/asterisk-01.png');
* }
* </code></div>
*/
p5.prototype.createImg = function() {
var elt = document.createElement('img');
var args = arguments;
var self = {};
var self;
var setAttrs = function(){
self.width = elt.width;
self.height = elt.height;
if (args.length === 3 && typeof args[2] === 'function'){
self.width = elt.offsetWidth;
self.height = elt.offsetHeight;
if (args.length > 1 && typeof args[1] === 'function'){
self.fn = args[1];
self.fn();
}else if (args.length > 1 && typeof args[2] === 'function'){
self.fn = args[2];
self.fn();
}
Expand All @@ -224,12 +255,8 @@
if (args.length > 1 && typeof args[1] === 'string'){
elt.alt = args[1];
}
if (elt.complete){
elt.onload = function(){
setAttrs();
}else{
elt.onload = function(){
setAttrs();
}
}
self = addElement(elt, this);
return self;
Expand All @@ -246,6 +273,13 @@
* @param {String} [target] target where new link should open,
* could be _blank, _self, _parent, _top.
* @return {Object/p5.Element} pointer to p5.Element holding created node
* @example
* <div class='norender'><code>
* var myLink;
* function setup() {
* myLink = createA('http://p5js.org/', 'this is a link');
* }
* </code></div>
*/
p5.prototype.createA = function(href, html, target) {
var elt = document.createElement('a');
Expand All @@ -269,14 +303,28 @@
* @param {Number} max maximum value of the slider
* @param {Number} [value] default value of the slider
* @return {Object/p5.Element} pointer to p5.Element holding created node
* @example
* <div><code>
* var slider;
* function setup() {
* slider = createSlider(0, 255, 100);
* slider.position(10, 10);
* slider.style('width', '80px');
* }
*
* function draw() {
* var val = slider.value();
* background(val);
* }
* </code></div>
*/
p5.prototype.createSlider = function(min, max, value, step) {
var elt = document.createElement('input');
elt.type = 'range';
elt.min = min;
elt.max = max;
if (step) elt.step = step;
if (value) elt.value = value;
if (typeof(value) === "number") elt.value = value;
return addElement(elt, this);
};

Expand All @@ -291,6 +339,22 @@
* @param {String} label label displayed on the button
* @param {String} [value] value of the button
* @return {Object/p5.Element} pointer to p5.Element holding created node
* @example
* <div class='norender'><code>
* var button;
* function setup() {
* createCanvas(100, 100);
* background(0);
* button = createButton('click me');
* button.position(19, 19);
* button.mousePressed(changeBG);
* }
*
* function changeBG() {
* var val = random(255);
* background(val);
* }
* </code></div>
*/
p5.prototype.createButton = function(label, value) {
var elt = document.createElement('button');
Expand Down Expand Up @@ -896,15 +960,22 @@
};

/**
* 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.
* Sets the given style (css) property (1st arg) of the element with the
* given value (2nd arg). If a single argument is given, .style()
* returns the value of the given property; however, if the single argument
* is given in css syntax ('text-align:center'), .style() sets the css
* appropriatly. .style() also handles 2d and 3d css transforms. If
* the 1st arg is 'rotate', 'translate', or 'position', the following arguments
* accept Numbers as values. ('translate', 10, 100, 50);
*
* @method style
* @param {String} property property to be set
* @param {String} [value] value to assign to property
* @param {String|Number} [value] value to assign to property
* @param {String|Number} [value] value to assign to property (rotate/translate)
* @param {String|Number} [value] value to assign to property (rotate/translate)
* @param {String|Number} [value] value to assign to property (translate)
* @return {String|Object/p5.Element} value of property, if no value is specified
* or p5.Element
* or p5.Element
* @example
* <div><code class="norender">
* var myDiv = createDiv("I like pandas.");
Expand All @@ -913,19 +984,72 @@
* </code></div>
*/
p5.Element.prototype.style = function(prop, val) {
var self = this;

if (typeof val === 'undefined') {
var attrs = prop.split(';');
for (var i=0; i<attrs.length; i++) {
var parts = attrs[i].split(':');
if (parts[0] && parts[1]) {
this.elt.style[parts[0].trim()] = parts[1].trim();
if (prop.indexOf(':') === -1) {
var styles = window.getComputedStyle(self.elt);
var style = styles.getPropertyValue(prop);
return style;
} else {
var attrs = prop.split(';');
for (var i = 0; i < attrs.length; i++) {
var parts = attrs[i].split(':');
if (parts[0] && parts[1]) {
this.elt.style[parts[0].trim()] = parts[1].trim();
}
}
}
} else {
this.elt.style[prop] = val;
if (prop === 'width' || prop === 'height' || prop === 'left' || prop === 'top'){
var numVal = val.replace(/\D+/g,'');
this[prop] = parseInt(numVal);
if (prop === 'rotate'){
if (arguments.length === 2) {
var style = this.elt.style.transform.replace(/rotate3d\(.*\)/g, '');
style = style.replace(/rotate[X-Z]?\(.*\)/g, '');
this.elt.style.transform = 'rotate(' + arguments[0] + 'deg)';
this.elt.style.transform += style;
} else if (arguments.length === 3) {
var style = this.elt.style.transform.replace(/rotate3d\(.*\)/g, '');
style = style.replace(/rotate[X-Z]?\(.*\)/g, '');
this.elt.style.transform = 'rotate(' + arguments[0] + 'deg, ' + arguments[1] + 'deg)';
this.elt.style.transform += style;
} else if (arguments.length === 4) {
var style = this.elt.style.transform.replace(/rotate3d\(.*\)/g, '');
style = style.replace(/rotate[X-Z]?\(.*\)/g, '');
this.elt.style.transform = 'rotateX(' + arguments[0] + 'deg)';
this.elt.style.transform += 'rotateY(' + arguments[1] + 'deg)';
this.elt.style.transform += 'rotateZ(' + arguments[2] + 'deg)';
this.elt.style.transform += style;
}
} else if (prop === 'translate') {
if (arguments.length === 3) {
var style = this.elt.style.transform.replace(/translate3d\(.*\)/g, '');
style = style.replace(/translate[X-Z]?\(.*\)/g, '');
this.elt.style.transform = 'translate(' + arguments[0] + 'px, ' + arguments[1] + 'px)';
this.elt.style.transform += style;
} else if (arguments.length === 4) {
var style = this.elt.style.transform.replace(/translate3d\(.*\)/g, '');
style = style.replace(/translate[X-Z]?\(.*\)/g, '');
this.elt.style.transform = 'translate3d(' + arguments[0] + 'px,' + arguments[1] + 'px,' + arguments[2] + 'px)';
this.elt.style.transform += style;
this.elt.parentElement.style.perspective = '1000px';
} else if (arguments.length === 5) {
var style = this.elt.style.transform.replace(/translate3d\(.*\)/g, '');
style = style.replace(/translate[X-Z]?\(.*\)/g, '');
this.elt.style.transform = 'translate3d(' + arguments[0] + 'px,' + arguments[1] + 'px,' + arguments[2] + 'px)';
this.elt.style.transform += style;
this.elt.parentElement.style.perspective = arguments[3] + 'px';
}
} else if (prop === 'position') {
this.elt.style.left = arguments[1] + 'px';
this.elt.style.top = arguments[2] + 'px';
this.x = arguments[1];
this.y = arguments[2];
} else {
this.elt.style[prop] = val;
if (prop === 'width' || prop === 'height' || prop === 'left' || prop === 'top') {
var numVal = val.replace(/\D+/g, '');
this[prop] = parseInt(numVal, 10);
}
}
}
return this;
Expand Down Expand Up @@ -1048,7 +1172,7 @@
this.width = aW;
this.height = aH;
}
this.elt.style.overflow = 'hidden';

this.width = this.elt.offsetWidth;
this.height = this.elt.offsetHeight;

Expand Down
Loading