claytical’s gists

claytical / sketch.js

Created November 17, 2015 16:05

	var x;
	var y;
	var adjustedX;
	var adjustedY;
	var angle = 0;
	var diameter;

	function setup() {
	createCanvas(windowWidth,windowHeight);
	x = width/2;

claytical / sketch.js

Created November 3, 2015 14:47

Record and Playback Audio in p5js

	var mic;
	var micOn;
	var recorder;
	var recording;
	var soundFile;

	function setup() {
	// uncomment this line to make the canvas the full size of the window
	createCanvas(windowWidth, windowHeight);
	// the volume is a number between 0 and 1

claytical / sketch.js

Created November 3, 2015 14:30

p5js using mic input

	var mic;
	var micOn;

	function setup() {
	// uncomment this line to make the canvas the full size of the window
	createCanvas(windowWidth, windowHeight);
	// the volume is a number between 0 and 1
	mic = new p5.AudioIn();
	micOn = false;
	}

claytical / sketch.js

Last active November 3, 2015 16:27

Loading a sound file in p5js

	var ferambie;

	function preload() {
	ferambie = loadSound('ferambie.mp3');
	}
	function setup() {
	// uncomment this line to make the canvas the full size of the window
	createCanvas(windowWidth, windowHeight);
	// the volume is a number between 0 and 1
	ferambie.setVolume(0.5);

claytical / sketch.js

Created October 20, 2015 17:19

Resizing a Canvas

	var canvas;
	var middle;
	var paddingAmount;

	function setup() {
	canvas = createCanvas(windowWidth, windowHeight);
	canvas.parent('middle_panel');
	middle = select('#middle_panel');
	resizeCanvas(middle.width, middle.height);
	}

claytical / index.html

Created October 20, 2015 17:11

Using Input Weather Example

	<html>
	<head>
	<meta charset="UTF-8">
	<script language="javascript" type="text/javascript" src="../p5.js"></script>
	<!-- uncomment lines below to include extra p5 libraries -->
	<script language="javascript" src="../addons/p5.dom.js"></script> <!--<script language="javascript" src="../addons/p5.sound.js"></script>-->
	<script language="javascript" type="text/javascript" src="sketch.js"></script>
	<!-- this line removes any default padding and style. you might only need one of these values set. -->
	<style>
	#left_panel {

claytical / sketch.js

Created October 20, 2015 14:35

Looping through Weather Forecast

	var canvas;
	var base_url = "http://api.openweathermap.org/data/2.5/forecast";
	var city_url = "?q=Miami";
	var app_id = "&appid=bd82977b86bf27fb59a04b61b657fb6f";
	var units = "&units=imperial";
	var temp = [];
	var temp_min = [];
	var temp_max = [];
	var xCursor;
	var yCursor;

claytical / sketch.js

Last active March 28, 2016 18:02

Open Weather Map Example, Forecast First

	var canvas;
	var base_url = "http://api.openweathermap.org/data/2.5/forecast";
	var city_url = "?q=Miami";
	var app_id = "&appid=f2dbfb3d770d42cca8ee06ad03edef2a";
	var units = "&units=imperial";
	var temp;
	var temp_min;
	var temp_max;

	function setup() {

claytical / index.html

Created October 13, 2015 03:20

Clicking Example within p5js

	<html>
	<head>
	<meta charset="UTF-8">
	<script language="javascript" type="text/javascript" src="../p5.js"></script>
	<!-- uncomment lines below to include extra p5 libraries -->
	<script language="javascript" src="../addons/p5.dom.js"></script> <!--<script language="javascript" src="../addons/p5.sound.js"></script>-->
	<script language="javascript" type="text/javascript" src="sketch.js"></script>
	<!-- this line removes any default padding and style. you might only need one of these values set. -->
	<style>
	#left_panel {

claytical / index.html

Last active October 13, 2015 03:19

Clicking Example, Existing Inputs

	<html>
	<head>
	<meta charset="UTF-8">
	<script language="javascript" type="text/javascript" src="../p5.js"></script>
	<!-- uncomment lines below to include extra p5 libraries -->
	<script language="javascript" src="../addons/p5.dom.js"></script> <!--<script language="javascript" src="../addons/p5.sound.js"></script>-->
	<script language="javascript" type="text/javascript" src="sketch.js"></script>
	<!-- this line removes any default padding and style. you might only need one of these values set. -->
	<style>
	#left_panel {

Clay Ewing claytical