+
- Cover
- Download
- Exhibition
- Reference
- Libraries
- Tools
- Environment
- Tutorials
- Examples
- Books
- Handbook
- Overview
- People
-
- Shop
- »Forum
- »GitHub
- »Issues
- »Wiki
- »FAQ
- »Twitter
- »Facebook
-
+Configures a pin to act either as input (INPUT), or input with internal pull-up resistor (INPUT_PULLUP), or input with internal pull-down resistor (INPUT_PULLDOWN) or output (OUTPUT)
Unlike on Arduino, where pins are implicitly set to inputs by default, it is necessary
-to call this function for any pin you want to access, including input pins.
+to call this function for any pin you want to access, including input pins.
+
+Pull-up and pull-down resistors are very useful when connecting buttons and switches, since they will force the value of the pin in a specified electrical state when no electrical connection is made, and the pin would otherwise be left "floating".
+
+The ability to set (and clear) pull-up and pull-down resistors is currently limited to the Raspberry Pi running the Raspbian distribution. On other systems, a warning will be shown.
]]>
diff --git a/content/api_en/LIB_io/GPIO_releasePin.xml b/content/api_en/LIB_io/GPIO_releasePin.xml
index 44bebf1d7..0c25bd518 100755
--- a/content/api_en/LIB_io/GPIO_releasePin.xml
+++ b/content/api_en/LIB_io/GPIO_releasePin.xml
@@ -20,8 +20,6 @@ void setup() {
// On the Raspberry Pi, GPIO 4 is pin 7 on the pin header,
// located on the fourth row, above one of the ground pins
- // For this particular board one could also write:
- // GPIO.pinMode(RPI.PIN7, GPIO.OUTPUT);
frameRate(0.5);
}
@@ -47,7 +45,7 @@ void keyPressed() {
-Without calling this function the pin will remain in the current state even after the sketch has been closed.
+Without calling this function, the pin will remain in the current state even after the sketch has been closed.
]]>
diff --git a/content/api_en/LIB_io/GPIO_waitForInterrupt.xml b/content/api_en/LIB_io/GPIO_waitFor.xml
similarity index 50%
rename from content/api_en/LIB_io/GPIO_waitForInterrupt.xml
rename to content/api_en/LIB_io/GPIO_waitFor.xml
index d0a250c83..d94c87a64 100755
--- a/content/api_en/LIB_io/GPIO_waitForInterrupt.xml
+++ b/content/api_en/LIB_io/GPIO_waitFor.xml
@@ -1,7 +1,7 @@
-waitForInterrupt()
+waitFor()
I/O
@@ -20,14 +20,16 @@ void setup() {
// trigger a reset of an external device with GPIO 4
GPIO.digitalWrite(4, GPIO.HIGH);
+
// wait for the device signalling us that it's ready
// by pulling up our pin 5
- boolean success = GPIO.waitForInterrupt(5, GPIO.RISING, 1000);
- if (!success) {
- println("Device didn't wake up in time");
- exit();
- }
- // do something else...
+ GPIO.waitFor(5, GPIO.RISING, 1000);
+ // if this takes longer than 1000ms an exception will be raised
+
+ // GPIO.waitFor(5, GPIO.RISING);
+ // would alternatively wait indefinitely
+
+ // ...
}
]]>
@@ -36,14 +38,13 @@ void setup() {
-The mode parameter determines when the function will will return: GPIO.FALLING occurs when the level changes from high to low, GPIO.RISING when the level changes from low -to high, and GPIO.CHANGE when either occurs.
+The mode parameter determines when the function will return: GPIO.FALLING occurs when the level changes from high to low, GPIO.RISING when the level changes from low to high, and GPIO.CHANGE when either occurs.
-This function returns true if the change, false if the timeout occured. +The optional timeout parameter determines how many milliseconds the function will wait at the most. If the value of the input pin hasn't changed at this point, an exception is raised for this line. Without a timeout parameter the function will wait indefinitely until the input pin has changed to the desired state. ]]>
-I2C is a serial bus, commonly used to attach peripheral ICs (integrated circuits) +I2C is a serial bus, commonly used to attach peripheral ICs (Integrated Circuits) to processors and microcontrollers. It uses two pins, SDA (for data) and SDL (for the clock signal). Multiple "slave" devices can be connected to the same bus, as long as they are responding to different addresses (see below).
diff --git a/content/api_en/LIB_io/I2C_beginTransmission.xml b/content/api_en/LIB_io/I2C_beginTransmission.xml index 55a6ce909..582fb97ff 100755 --- a/content/api_en/LIB_io/I2C_beginTransmission.xml +++ b/content/api_en/LIB_io/I2C_beginTransmission.xml @@ -23,7 +23,7 @@ void setup() { void draw() { background(map(mouseX, 0, width, 0, 255)); - // send value over I2C to an digital-to-analog + // send value over I2C to a digital-to-analog // converter with address 96 (hex 0x60) int val = int(4095 * map(mouseX, 0, width, 0.0, 1.0)); dac.beginTransmission(0x60); diff --git a/content/api_en/LIB_io/I2C_close.xml b/content/api_en/LIB_io/I2C_close.xml index 43db9573d..b3754a327 100755 --- a/content/api_en/LIB_io/I2C_close.xml +++ b/content/api_en/LIB_io/I2C_close.xml @@ -18,7 +18,7 @@ I2C i2c; void setup() { //printArray(I2C.list()); i2c = new I2C(I2C.list()[0]); - // send a value over I2C to an digital-to-analog + // send a value over I2C to a digital-to-analog // converter with address 96 (hex 0x60) int val = 4095; i2c.beginTransmission(0x60); diff --git a/content/api_en/LIB_io/I2C_endTransmission.xml b/content/api_en/LIB_io/I2C_endTransmission.xml index 83402ff1f..f5f909324 100755 --- a/content/api_en/LIB_io/I2C_endTransmission.xml +++ b/content/api_en/LIB_io/I2C_endTransmission.xml @@ -23,7 +23,7 @@ void setup() { void draw() { background(map(mouseX, 0, width, 0, 255)); - // send value over I2C to an digital-to-analog + // send value over I2C to a digital-to-analog // converter with address 96 (hex 0x60) int val = int(4095 * map(mouseX, 0, width, 0.0, 1.0)); dac.beginTransmission(0x60); diff --git a/content/api_en/LIB_io/I2C_read.xml b/content/api_en/LIB_io/I2C_read.xml index fee60f84d..db2332f3e 100755 --- a/content/api_en/LIB_io/I2C_read.xml +++ b/content/api_en/LIB_io/I2C_read.xml @@ -39,10 +39,10 @@ void draw() {
You must call beginTransmission() before calling this function. -This function also ends the current transmisison and sends any data +This function also ends the current transmission and sends any data that was queued using write() before. It is not necessary to call endTransmission() after read(). ]]>
You must call beginTransmission() before calling this function. The actual writing takes part when read() or endTransmission() is being called. ]]>
+When no period is specified, a default 1 kHz (1000 Hz) is used. ]]>
The "master" device initiates a transfer by pulling the SS pin of the "slave" low, and begins outputting a clock signal. In SPI, both the "master" as well as the "slave" device output data at the same time. It is hence not possible to -read data without also writing some (even if it means outputting zeros or other +read data without writing some (even if it means outputting zeros or other dummy data). There are multiple possible configuration settings for SPI, see diff --git a/content/api_en/LIB_io/SPI_close.xml b/content/api_en/LIB_io/SPI_close.xml index e66756e3e..2e9d7f4a1 100755 --- a/content/api_en/LIB_io/SPI_close.xml +++ b/content/api_en/LIB_io/SPI_close.xml @@ -41,7 +41,7 @@ Closes the SPI interface It is normally not necessary to explicitly close SPI interfaces, as they are closed automatically by the operating system when the sketch exits. -Note: It is possible to have two or more object using the same interface at +Note: It is possible to have two or more objects using the same interface at a time. ]]>
+
+Connect the signal wire (typically colored yellow) to any available GPIO pin +and control the servo's angle as shown in the example sketch. +]]>
+You must call this function before calling write(). Note that the +servo motor will only be instructed to move after the first time +write() is called.
+
+The optional parameters minPulse and maxPulse control the minimum +and maximum pulse width durations. The default values, identical to +those of Arduino's Servo class, should be compatible with most servo +motors. +]]>
+Calling this method will stop the servo from moving or trying to +hold the current orientation. +]]>
+If you are using this class in combination with a continuous rotation +servo, different angles will result in the servo rotating forward or +backward at different speeds. For regular servo motors, this will +instruct the servo to rotate to and hold a specific angle. +]]>
- The Hardware I/O library allows to access the computer's hardware periperals, such as digital + The Hardware I/O library allows access to the computer's hardware periperals, such as digital inputs and outputs, serial busses, and the like, in a fashion similar to the Arduino plaform. This library is only available for embedded Linux boards with the necessary kernel drivers, such as the Raspberry Pi. @@ -28,7 +28,7 @@
GPIO
noInterrupts()interrupts()
releaseInterrupt()
- waitForInterrupt()
+ waitFor()
releasePin()
@@ -66,7 +66,7 @@
LED
PWM
- The PWM class controls hardware Pulse-width modulation channels, if supported by your platform.
+ Use the SoftwareServo class below for the time being. Hardware PWM has yet to be made available by the hardware platforms we support.
PWM
list()
@@ -76,11 +76,15 @@
PWM
-
RPI
+SoftwareServo
- The RPI class is a helper for use with the Raspberry Pi.
+ The SoftwareServo class controls RC servo motors attached to General Purpose I/O pins.
- RPI
+ SoftwareServo
+ attach()
+ write()
+ attached()
+ detach()
-
-
-
-
-
-
-
-play()
-Start the oscillator
-
-
-
-stop()
-Stop the oscillator
-
-
-
-freq()
-Change the frequency of the oscillator
-
-
-
-width()
-Change the pulse width of the oscillator
-
-
-
-amp()
-Change the amplitude/volume of the oscillator
-
-
-
-add()
-Offset the output of the oscillator by given value
-
-
-
-pan()
-Move the sound in a stereo panorama
-
-
-
-set()
-Set multiple parameters at once
-
-
-
-Pulse(parent )
-
-
-
-parent
-PApplet: typically use "this"
-
-
-
-
-
-1.0
-
-Object
-
-Library
-
diff --git a/content/api_en/LIB_sound/Pulse_set.xml b/content/api_en/LIB_sound/Pulse_set.xml
index 0f3d893e0..0e5935e7f 100755
--- a/content/api_en/LIB_sound/Pulse_set.xml
+++ b/content/api_en/LIB_sound/Pulse_set.xml
@@ -29,11 +29,11 @@ void draw() {
void mousePressed() {
float freq=200;
- float width=0.5;
+ float plswidth=0.5;
float amp=0.5;
float add=0.0;
float pos=1;
- pulse.set(freq, width, amp, add, pos);
+ pulse.set(freq, plswidth, amp, add, pos);
}
]]>
diff --git a/content/api_en/LIB_sound/Reverb.xml b/content/api_en/LIB_sound/Reverb.xml
index 8d34c05ce..6697df3b9 100755
--- a/content/api_en/LIB_sound/Reverb.xml
+++ b/content/api_en/LIB_sound/Reverb.xml
@@ -28,6 +28,7 @@ void setup() {
// start the input stream
in.play();
+ reverb.process(in);
}
void draw() {
diff --git a/content/api_en/LIB_sound/Reverb_stop.xml b/content/api_en/LIB_sound/Reverb_stop.xml
index 8d2fe420d..574071bfc 100755
--- a/content/api_en/LIB_sound/Reverb_stop.xml
+++ b/content/api_en/LIB_sound/Reverb_stop.xml
@@ -32,14 +32,14 @@ void setup() {
// Patch the reverb
reverb.process(in, 5);
- reverb.time(0.5);
+ //reverb.damp(0.5);
}
void draw() {
}
void mousePressed() {
- in.stop();
+ //in.stop();
reverb.stop();
}
diff --git a/content/api_en/LIB_sound/SawOsc.xml b/content/api_en/LIB_sound/SawOsc.xml
index 514326e8f..979ca1bb5 100755
--- a/content/api_en/LIB_sound/SawOsc.xml
+++ b/content/api_en/LIB_sound/SawOsc.xml
@@ -9,7 +9,7 @@
-
-
-
-
-
-
-
-
-play()
-Start the oscillator
-
-
-
-stop()
-Stop the oscillator
-
-
-
-freq()
-Change the frequency of the oscillator
-
-
-
-amp()
-Change the amplitude/volume of the oscillator
-
-
-
-add()
-Offset the output of the oscillator by given value
-
-
-
-pan()
-Move the sound in a stereo panorama
-
-
-
-set()
-Set multiple parameters at once
-
-
-
-SqrOsc(parent )
-
-
-
-parent
-PApplet: typically use "this"
-
-
-
-
-
-1.0
-
-Object
-
-Library
-
diff --git a/content/api_en/LIB_sound/SinOsc.xml b/content/api_en/LIB_sound/SinOsc.xml
index 1f6c8ad1e..abec47858 100755
--- a/content/api_en/LIB_sound/SinOsc.xml
+++ b/content/api_en/LIB_sound/SinOsc.xml
@@ -9,7 +9,7 @@
Application
-../../../images/LIB_sound_SinOsc.png
-
-
-
-
-
-
-
-
-play()
-Start the oscillator
-
-
-
-stop()
-Stop the oscillator
-
-
-
-freq()
-Change the frequency of the oscillator
-
-
-
-amp()
-Change the amplitude/volume of the oscillator
-
-
-
-add()
-Offset the output of the oscillator by given value
-
-
-
-pan()
-Move the sound in a stereo panorama
-
-
-
-set()
-Set multiple parameters at once
-
-
-
-SinOsc(parent )
-
-
-
-parent
-PApplet: typically use "this"
-
-
-
-
-
-1.0
-
-Object
-
-Library
-
diff --git a/content/api_en/LIB_sound/SinOsc_play.xml b/content/api_en/LIB_sound/SinOsc_play.xml
index 31761bad6..4c89cd172 100755
--- a/content/api_en/LIB_sound/SinOsc_play.xml
+++ b/content/api_en/LIB_sound/SinOsc_play.xml
@@ -13,7 +13,7 @@
+
+Sound
+
+Sound
+
+Configuration
+
+Application
+
+
+
+
+
+AudioIn
+
+
+
\ No newline at end of file
diff --git a/content/api_en/LIB_sound/SoundFile.xml b/content/api_en/LIB_sound/SoundFile.xml
index db860e881..c6eb0d03c 100755
--- a/content/api_en/LIB_sound/SoundFile.xml
+++ b/content/api_en/LIB_sound/SoundFile.xml
@@ -9,7 +9,6 @@
Application
-
-
-
-
-
-
-
-
-play()
-Play the soundfile
-
-
-
-loop()
-Loop the soundfile
-
-
-
-cue()
-Set the starting position of the soundfile
-
-
-
-jump()
-Jump to a specific position in the file while continuing to play
-
-
-
-stop()
-Stop the soundfile
-
-
-
-rate()
-Change the playback rate of the soundfile
-
-
-
-amp()
-Change the amplitude/volume of the player
-
-
-
-add()
-Offset the output of the player by given value
-
-
-
-pan()
-Move the soundfile in a stereo panorama
-
-
-
-set()
-Set multiple parameters at once
-
-
-
-duration()
-Returns the duration of the soundfile
-
-
-
-sampleRate()
-Returns the sample rate of the soundfile
-
-
-
-frames()
-Returns the number of frames/samples of the soundfile
-
-
-
-channels()
-Returns the number of channels of the soundfile
-
-
-
-SoundFile(parent , path )
-
-
-
-parent
-PApplet: typically use "this"
-
-
-
-path
-Full Path to file or filename for data path
-
-
-
-
-
-1.0
-
-Object
-
-Library
-
diff --git a/content/api_en/LIB_sound/SoundFile_add.xml b/content/api_en/LIB_sound/SoundFile_add.xml
index 28df56508..2b92734e5 100755
--- a/content/api_en/LIB_sound/SoundFile_add.xml
+++ b/content/api_en/LIB_sound/SoundFile_add.xml
@@ -18,12 +18,12 @@ SoundFile file;
void setup() {
size(640, 360);
background(255);
-
+
// Load a soundfile from the /data folder of the sketch and play it back
file = new SoundFile(this, "sample.mp3");
file.play();
file.add(0.1);
-}
+}
void draw() {
}
@@ -32,7 +32,7 @@ void draw() {
diff --git a/content/api_en/LIB_sound/SoundFile_amp.xml b/content/api_en/LIB_sound/SoundFile_amp.xml
index 8fed77f35..34002bbd2 100755
--- a/content/api_en/LIB_sound/SoundFile_amp.xml
+++ b/content/api_en/LIB_sound/SoundFile_amp.xml
@@ -21,8 +21,8 @@ void setup() {
// Load a soundfile from the /data folder of the sketch and play it back
file = new SoundFile(this, "sample.mp3");
- file.play();
file.amp(0.5);
+ file.play();
}
void draw() {
diff --git a/content/api_en/LIB_sound/SoundFile_channels.xml b/content/api_en/LIB_sound/SoundFile_channels.xml
index 2e371f9e2..ace503d83 100755
--- a/content/api_en/LIB_sound/SoundFile_channels.xml
+++ b/content/api_en/LIB_sound/SoundFile_channels.xml
@@ -18,11 +18,11 @@ SoundFile file;
void setup() {
size(640, 360);
background(255);
-
+
// Load a soundfile from the /data folder of the sketch and get the number of channels
file = new SoundFile(this, "sample.mp3");
println(file.channels());
-}
+}
void draw() {
}
@@ -31,22 +31,7 @@ void draw() {
-file .channels()
-
-
-int
-
-1.0
-
-Method
-
-Library
-
-
diff --git a/content/api_en/LIB_sound/SoundFile_cue.xml b/content/api_en/LIB_sound/SoundFile_cue.xml
index 347d45dc4..bded003ce 100755
--- a/content/api_en/LIB_sound/SoundFile_cue.xml
+++ b/content/api_en/LIB_sound/SoundFile_cue.xml
@@ -21,33 +21,17 @@ void setup() {
// Load a soundfile from the /data folder of the sketch and play it back
file = new SoundFile(this, "sample.mp3");
- file.cue(15);
+ file.cue(3.5);
file.play();
}
void draw() {
}
-
]]>
-
-
-
-
-
-
-
-
-play()
-Start the oscillator
-
-
-
-stop()
-Stop the oscillator
-
-
-
-freq()
-Change the frequency of the oscillator
-
-
-
-amp()
-Change the amplitude/volume of the oscillator
-
-
-
-add()
-Offset the output of the oscillator by given value
-
-
-
-pan()
-Move the sound in a stereo panorama
-
-
-
-set()
-Set multiple parameters at once
-
-
-
-SqrOsc(parent )
-
-
-
-parent
-PApplet: typically use "this"
-
-
-
-
-
-1.0
-
-Object
-
-Library
-
diff --git a/content/api_en/LIB_sound/TriOsc.xml b/content/api_en/LIB_sound/TriOsc.xml
index 2ca49c832..d504de89a 100755
--- a/content/api_en/LIB_sound/TriOsc.xml
+++ b/content/api_en/LIB_sound/TriOsc.xml
@@ -9,7 +9,7 @@
Application
-../../../images/LIB_sound_TriOsc.png
-
-
-
-
-
-
-
-
-play()
-Start the oscillator
-
-
-
-stop()
-Stop the oscillator
-
-
-
-freq()
-Change the frequency of the oscillator
-
-
-
-amp()
-Change the amplitude/volume of the oscillator
-
-
-
-add()
-Offset the output of the oscillator by given value
-
-
-
-pan()
-Move the sound in a stereo panorama
-
-
-
-set()
-Set multiple parameters at once
-
-
-
-TriOsc(parent )
-
-
-
-parent
-PApplet: typically use "this"
-
-
-
-
-
-1.0
-
-Object
-
-Library
-
diff --git a/content/api_en/LIB_sound/Waveform.xml b/content/api_en/LIB_sound/Waveform.xml
new file mode 100644
index 000000000..4251ddd60
--- /dev/null
+++ b/content/api_en/LIB_sound/Waveform.xml
@@ -0,0 +1,107 @@
+
+
+
+Waveform
+
+Sound
+
+Analyzer
+
+Application
+
+
+
+
+
+
+
+
+
+
+
+
+input()
+Define the audio input for the analyzer
+
+
+
+analyze()
+Gets the last nsamples captured from the connected input sound source, writes them
+ into this Waveform's `data` array, and returns it.
+
+
+
+stop()
+Stop the analyzer
+
+
+
+data
+`float[]` of length nsamples, with the sample amplitudes between `-1` and `1`
+
+
+
+Waveform(parent )
+
+
+
+parent
+PApplet: typically use "this"
+
+
+
+
+
+Object
+
+Library
+
+
diff --git a/content/api_en/LIB_sound/WhiteNoise.xml b/content/api_en/LIB_sound/WhiteNoise.xml
index 0f67dfb46..ba8d252c2 100755
--- a/content/api_en/LIB_sound/WhiteNoise.xml
+++ b/content/api_en/LIB_sound/WhiteNoise.xml
@@ -29,66 +29,7 @@ void draw() {
-
-
-
-
-
-
-
-play()
-Start the generator
-
-
-
-stop()
-Stop the generator
-
-
-
-amp()
-Change the amplitude/volume of the generator
-
-
-
-add()
-Offset the output of the generator by given value
-
-
-
-pan()
-Move the sound in a stereo panorama
-
-
-
-set()
-Set multiple parameters at once
-
-
-
-WhiteNoise(parent )
-
-
-
-parent
-PApplet: typically use "this"
-
-
-
-
-
-1.0
-
-Object
-
-Library
-
diff --git a/content/api_en/LIB_sound/WhiteNoise_add.xml b/content/api_en/LIB_sound/WhiteNoise_add.xml
index 1876dc1ab..a6da5916b 100755
--- a/content/api_en/LIB_sound/WhiteNoise_add.xml
+++ b/content/api_en/LIB_sound/WhiteNoise_add.xml
@@ -34,19 +34,4 @@ void draw() {
The .add() method is useful for modulating other audio signals.
]]>
-
-noise .add(add)
-
-
-1.0
-
-Method
-
-Library
-
-
diff --git a/content/api_en/LIB_sound/WhiteNoise_amp.xml b/content/api_en/LIB_sound/WhiteNoise_amp.xml
index 98ea36777..83eef598a 100755
--- a/content/api_en/LIB_sound/WhiteNoise_amp.xml
+++ b/content/api_en/LIB_sound/WhiteNoise_amp.xml
@@ -35,24 +35,4 @@ void draw() {
Changes the amplitude/volume of the noise generator. Allowed values are between 0.0 and 1.0.
]]>
-
-noise .amp(vol)
-
-
-
-
-
-
-
-1.0
-
-Method
-
-Library
-
-
diff --git a/content/api_en/LIB_sound/WhiteNoise_pan.xml b/content/api_en/LIB_sound/WhiteNoise_pan.xml
index 3bcfab0ec..ffb68b7cf 100755
--- a/content/api_en/LIB_sound/WhiteNoise_pan.xml
+++ b/content/api_en/LIB_sound/WhiteNoise_pan.xml
@@ -36,19 +36,4 @@ void draw() {
Pan the generator in a stereo panorama. -1.0 pans to the left channel and 1.0 to the right channel.
]]>
-
-noise .pan(pos)
-
-
-1.0
-
-Method
-
-Library
-
-
diff --git a/content/api_en/LIB_sound/WhiteNoise_play.xml b/content/api_en/LIB_sound/WhiteNoise_play.xml
index c25d29486..9dd12d80d 100755
--- a/content/api_en/LIB_sound/WhiteNoise_play.xml
+++ b/content/api_en/LIB_sound/WhiteNoise_play.xml
@@ -34,19 +34,4 @@ void draw() {
Starts the White Noise generator.
]]>
-
-noise .play()
-
-
-1.0
-
-Method
-
-Library
-
-
diff --git a/content/api_en/LIB_sound/WhiteNoise_set.xml b/content/api_en/LIB_sound/WhiteNoise_set.xml
index a4d965129..6ecf74ca1 100755
--- a/content/api_en/LIB_sound/WhiteNoise_set.xml
+++ b/content/api_en/LIB_sound/WhiteNoise_set.xml
@@ -41,19 +41,4 @@ void mousePressed() {
Sets amplitude, add and pan position with one method.
]]>
-
-noise .set(amp, add, pos)
-
-
-1.0
-
-Method
-
-Library
-
-
diff --git a/content/api_en/LIB_sound/WhiteNoise_stop.xml b/content/api_en/LIB_sound/WhiteNoise_stop.xml
index c7a0a65d3..783fa8a36 100755
--- a/content/api_en/LIB_sound/WhiteNoise_stop.xml
+++ b/content/api_en/LIB_sound/WhiteNoise_stop.xml
@@ -1,7 +1,7 @@
-play()
+stop()
Noise
@@ -38,19 +38,4 @@ void mousePressed() {
Stops the White Noise generator.
]]>
-
-noise .stop()
-
-
-1.0
-
-Method
-
-Library
-
-
diff --git a/content/api_en/LIB_sound/index.html b/content/api_en/LIB_sound/index.html
index 007b42f79..5bee0974e 100755
--- a/content/api_en/LIB_sound/index.html
+++ b/content/api_en/LIB_sound/index.html
@@ -1,71 +1,75 @@
-
-Sound
-
-
-
- The new Sound library for Processing 3 provides a simple way to work with audio. It can play, analyze, and synthesize sound. The library comes with a collection of oscillators for basic wave forms, a variety of noise generators, and effects and filters to alter sound files and other generated sounds. The syntax is minimal to make it easy to patch one sound object into another.
-
-
- The source code is available on the processing-sound GitHub repository. Please report bugs here. This library is only compatible with Processing 3.0+.
-
-
-
-
-
-
-
- I/O
-
- AudioDevice
- AudioIn
-
-
- Audio Files
-
-
- SoundFile
-
-
- Effects
-
-
-
- Analysis
-
-
-
-
-
-
-
- Noise
-
- WhiteNoise
- PinkNoise
- BrownNoise
-
-
- Oscillators
-
- SinOsc
- SawOsc
- SqrOsc
- TriOsc
- Pulse
-
-
- Envelopes
-
- Env
-
-
-
+
+Sound
+
+
+
+ The new Sound library for Processing 3 provides a simple way to work with audio. It can play, analyze, and synthesize sound. It provides a collection of oscillators for basic wave forms, a variety of noise generators, and effects and filters to play and alter sound files and other generated sounds. The syntax is minimal to make it easy to patch one sound object into another. The library also comes with example sketches covering many use cases to help you get started.
+
+
+ The source code is available on the processing-sound GitHub repository. Please report bugs here. This library is only compatible with Processing 3.0+.
+
+
+
+
+
+
+
+ Configuration
+
+ Sound
+
+
+ I/O
+
+ AudioIn
+
+
+ Sampling
+
+ SoundFile
+ AudioSample
+
+
+ Effects
+
+
+
+
+
+
+
+
+ Noise
+
+ WhiteNoise
+ PinkNoise
+ BrownNoise
+
+
+ Oscillators
+
+ SinOsc
+ SawOsc
+ SqrOsc
+ TriOsc
+ Pulse
+
+
+ Envelopes
+
+ Env
+
+
+ Analysis
+
+
+
diff --git a/content/api_en/LIB_svg/index.html b/content/api_en/LIB_svg/index.html
new file mode 100644
index 000000000..24737df1d
--- /dev/null
+++ b/content/api_en/LIB_svg/index.html
@@ -0,0 +1,167 @@
+
+SVG Export
+
+
+ The SVG library makes it possible to write SVG files directly from Processing. These vector graphics files can be scaled to any size and output at very high resolutions. The SVG library can flatten 3D data into a 2D vector file, but to export 3D data, use the DXF library. The source code is available on the Processing GitHub repository. Please report bugs here.
+
+ This library can be used with the core Processing function size(), or createGraphics(). See the examples below for different techniques.
+
+
+
+
+SVG Export (No Screen Display)
+
+This example draws a single frame to a SVG file and quits. (Note that no display window will open; this helps when you're trying to create massive SVG images that are far larger than the screen size.)
+
+import processing.svg.*;
+
+void setup() {
+ size(400, 400, SVG, "filename.svg");
+}
+
+void draw() {
+ // Draw something good here
+ line(0, 0, width/2, height);
+
+ // Exit the program
+ println("Finished.");
+ exit();
+}
+
+
+SVG Export (With Screen Display)
+
+To draw to the screen while also saving an SVG beginRecord()
+and endRecord() functions. Unlike the PDF renderer, the SVG renderer will only save the final frame of a sequence. This is slower, but is useful when you need to
+see what you're working on as it saves.
+
+import processing.svg.*;
+
+void setup() {
+ size(400, 400);
+ noLoop();
+ beginRecord(SVG, "filename.svg");
+}
+
+void draw() {
+ // Draw something good here
+ line(0, 0, width/2, height);
+
+ endRecord();
+}
+
+
+Single Frame from an Animation (With Screen Display)
+It's also possible to save one frame from a program with moving elements.
+Create a boolean variable to turn the SVG recording process on and off
+
+import processing.svg.*;
+
+boolean record;
+
+void setup() {
+ size(400, 400);
+}
+
+void draw() {
+ if (record) {
+ // Note that #### will be replaced with the frame number. Fancy!
+ beginRecord(SVG, "frame-####.svg");
+ }
+
+ // Draw something good here
+ background(255);
+ line(mouseX, mouseY, width/2, height/2);
+
+ if (record) {
+ endRecord();
+ record = false;
+ }
+}
+
+// Use a keypress so thousands of files aren't created
+void mousePressed() {
+ record = true;
+}
+
+
+SVG Files from 3D Geometry (With Screen Display)
+
+To create vectors from 3D data, use the beginRaw() and endRaw() commands.
+These commands will grab the shape data just before it is rendered to the screen.
+At this stage, your entire scene is nothing but a long list of lines and triangles.
+This means that a shape created with sphere() method will be made up of hundreds of
+triangles, rather than a single object.
+
+When using beginRaw() and endRaw(), it's possible to write to either a 2D or 3D renderer.
+For instance, beginRaw() with the SVG library will write the geometry as flattened triangles
+and lines.
+
+import processing.svg.*;
+
+boolean record;
+
+void setup() {
+ size(500, 500, P3D);
+}
+
+void draw() {
+ if (record) {
+ beginRaw(SVG, "output.svg");
+ }
+
+ // Do all your drawing here
+ background(204);
+ translate(width/2, height/2, -200);
+ rotateZ(0.2);
+ rotateY(mouseX/500.0);
+ box(200);
+
+ if (record) {
+ endRaw();
+ record = false;
+ }
+}
+
+// Hit 'r' to record a single frame
+void keyPressed() {
+ if (key == 'r') {
+ record = true;
+ }
+}
+
+
+Using createGraphics() to Create an SVG File
+
+To write a SVG file using only the createGraphics() command, rather than as
+part of a sketch, it's necessary to call dispose() on the PGraphicsSVG object.
+This is the same as calling exit(), but it won't quit the sketch.
+
+import processing.svg.*;
+
+PGraphics svg = createGraphics(300, 300, SVG, "output.svg");
+svg.beginDraw();
+svg.background(128, 0, 0);
+svg.line(50, 50, 250, 250);
+svg.dispose();
+svg.endDraw();
+
+
+
+Additional notes for the SVG renderer:
+
+
+
+- If you want 3D data, use the DXF recording library instead.
+
+
- Using hint(ENABLE_DEPTH_SORT) can improve the appearance of 3D geometry drawn to 2D file formats.
+
+
- Many methods, particularly pixel-based methods, don't make sense for SVG renderers. This includes: loadPixels, updatePixels, get, set, mask, filter, copy, blend, save, and image
+
+
- Again, exit() is really important when using SVG with size().
+
+
+
+
+
+
diff --git a/content/api_en/PGraphics.xml b/content/api_en/PGraphics.xml
index 1d2a23efa..f8df4047b 100755
--- a/content/api_en/PGraphics.xml
+++ b/content/api_en/PGraphics.xml
@@ -31,7 +31,7 @@ void draw() {
+Main graphics and rendering context, as well as the base API implementation for processing "core". Use this class if you need to draw into an off-screen graphics buffer. A PGraphics object can be constructed with the createGraphics() function. The beginDraw() and endDraw() methods (see above example) are necessary to set up the buffer and to finalize it. The fields and methods for this class are extensive. For a complete list, visit the developer's reference.
To create a new graphics context, use the createGraphics() function. Do not use the syntax new PGraphics(). ]]>
Limits each channel of the image to the number of colors specified as the parameter. The parameter can be set to values between 2 and 255, but results are most noticeable in the lower ranges.
BLUR
-Executes a Guassian blur with the level parameter specifying the extent of the blurring. If no parameter is used, the blur is equivalent to Guassian blur of radius 1. Larger values increase the blur.
+Executes a Gaussian blur with the level parameter specifying the extent of the blurring. If no parameter is used, the blur is equivalent to Gaussian blur of radius 1. Larger values increase the blur.
ERODE
Reduces the light areas. No parameter is used.
diff --git a/content/api_en/PImage_loadPixels.xml b/content/api_en/PImage_loadPixels.xml index 5e84cfc90..a9c353f84 100644 --- a/content/api_en/PImage_loadPixels.xml +++ b/content/api_en/PImage_loadPixels.xml @@ -34,8 +34,6 @@ void draw() {
-Certain renderers may or may not seem to require loadPixels() or updatePixels(). However, the rule is that any time you want to manipulate the pixels[] array, you must first call loadPixels(), and after changes have been made, call updatePixels(). Even if the renderer may not seem to use this function in the current Processing release, this will always be subject to change. ]]>
+
+Before accessing this array, the data must loaded with the loadPixels() method. Failure to do so may result in a NullPointerException. After the array data has been modified, the updatePixels() method must be run to update the content of the display window. ]]>
To save an image created within the code, rather than through loading, it's necessary to make the image with the createImage() function so it is aware of the location of the program and can therefore save the file to the right place. See the createImage() reference for more information. +Saves the image into a file. Append a file extension to the name of the file, to indicate the file format to be used: either TIFF (.tif), TARGA (.tga), JPEG (.jpg), or PNG (.png). If no extension is included in the filename, the image will save in TIFF format and .tif will be added to the name. These files are saved to the sketch's folder, which may be opened by selecting "Show sketch folder" from the "Sketch" menu.
To save an image created within the code, rather than through loading, it's necessary to make the image with the createImage() function so it is aware of the location of the program and can therefore save the file to the right place. See the createImage() reference for more information. ]]>
-Certain renderers may or may not seem to require loadPixels() or updatePixels(). However, the rule is that any time you want to manipulate the pixels[] array, you must first call loadPixels(), and after changes have been made, call updatePixels(). Even if the renderer may not seem to use this function in the current Processing release, this will always be subject to change. -
-Currently, none of the renderers use the additional parameters to updatePixels(), however this may be implemented in the future. ]]>
-The PShape object contains a group of methods that can operate on the shape data. Some of the methods are listed below, but the full list used for creating and modifying shapes is available here in the Processing Javadoc.
+The PShape object contains a group of methods that can operate on the shape data. Some of the methods are listed below, but the full list used for creating and modifying shapes is available here in the Processing Javadoc.
To create a new shape, use the createShape() function. Do not use the syntax new PShape(). ]]>
+
+Additional Table methods are documented in the Processing Table Javadoc. + ]]>
+
+Additional TableRow methods are documented in the Processing Data Javadoc. ]]>
+Expands a one-dimensional array by one element and adds data to the new position. The datatype of the element parameter must be the same as the datatype of the array.
When using an array of objects, the data returned from the function must be cast to the object array's data type. For example: SomeClass[] items = (SomeClass[]) append(originalArray, element) ]]>
-
-There are three ways to draw an arc; the rendering technique used is defined by the optional seventh parameter. The three options, depicted in the above examples, are PIE, OPEN, and CHORD. The default mode is the OPEN stroke with a PIE fill.
-
+Draws an arc to the screen. Arcs are drawn along the outer edge of an ellipse defined by the a, b, c, and d parameters. The origin of the arc's ellipse may be changed with the ellipseMode() function. Use the start and stop parameters to specify the angles (in radians) at which to draw the arc. The start/stop values must be in clockwise order. +
+There are three ways to draw an arc; the rendering technique used is defined by the optional seventh parameter. The three options, depicted in the above examples, are PIE, OPEN, and CHORD. The default mode is the OPEN stroke with a PIE fill. +
In some cases, the arc() function isn't accurate enough for smooth drawing. For example, the shape may jitter on screen when rotating slowly. If you're having an issue with how arcs are rendered, you'll need to draw the arc yourself with beginShape()/endShape() or a PShape. ]]>
The simplified version with only two arguments — arrayCopy(src, dst) — copies an entire array to another of the same size. It is equivalent to arrayCopy(src, 0, dst, 0, src.length).
-Using this function is far more efficient for copying array data than iterating through a for() loop and copying each element individually. This function only copies references, which means that for most purposes it only copies one-dimensional arrays (a single set of brackets). If used with a two (or three or more) dimensional array, it will only copy the references at the first level, because a two dimensional array is simply an "array of arrays". This does not produce an error, however, because this is often the desired behavior. Internally, this function calls Java's System.arraycopy() method, so most things that apply there are inherited. +Using this function is far more efficient for copying array data than iterating through a for() loop and copying each element individually. This function only copies references, which means that for most purposes it only copies one-dimensional arrays (a single set of brackets). If used with a two (or three or more) dimensional array, it will only copy the references at the first level, because a two dimensional array is simply an "array of arrays". This does not produce an error, however, because this is often the desired behavior. Internally, this function calls Java's System.arraycopy() method, so most things that apply there are inherited. ]]> diff --git a/content/api_en/attrib.xml b/content/api_en/attrib.xml new file mode 100644 index 000000000..3d21bc538 --- /dev/null +++ b/content/api_en/attrib.xml @@ -0,0 +1,63 @@ + +
If you want a background to show up in your files, use rect(0, 0, width, height) after setting the fill() to the background color. Otherwise the background will not be rendered to the file because the background is not shape.
-Using hint(ENABLE_DEPTH_SORT) can improve the appearance of 3D geometry drawn to 2D file formats. See the hint() reference for more details. +Using hint(ENABLE_DEPTH_SORT) can improve the appearance of 3D geometry drawn to 2D file formats.
See examples in the reference for the PDF and DXF libraries for more information. ]]> diff --git a/content/api_en/blend.xml b/content/api_en/blend.xml index d10a95f76..59d8431c9 100755 --- a/content/api_en/blend.xml +++ b/content/api_en/blend.xml @@ -52,15 +52,15 @@ blend(img, 0, 0, 33, 100, 67, 0, 33, 100, LIGHTEST);
-BLEND - linear interpolation of colours: C = A*factor + B
+BLEND - linear interpolation of colors: C = A*factor + B
ADD - additive blending with white clip: C = min(A*factor + B, 255)
SUBTRACT - subtractive blending with black clip: C = max(B - A*factor, 0)
-DARKEST - only the darkest colour succeeds: C = min(A*factor, B)
+DARKEST - only the darkest color succeeds: C = min(A*factor, B)
-LIGHTEST - only the lightest colour succeeds: C = max(A*factor, B)
+LIGHTEST - only the lightest color succeeds: C = max(A*factor, B)
DIFFERENCE - subtract colors from underlying image.
diff --git a/content/api_en/blendMode.xml b/content/api_en/blendMode.xml index 26e3285a2..a3c309cb1 100755 --- a/content/api_en/blendMode.xml +++ b/content/api_en/blendMode.xml @@ -35,17 +35,17 @@ line(75, 25, 25, 75);
-BLEND - linear interpolation of colours: C = A*factor + B. This is the default blending mode.
+BLEND - linear interpolation of colors: C = A*factor + B. This is the default.
ADD - additive blending with white clip: C = min(A*factor + B, 255)
SUBTRACT - subtractive blending with black clip: C = max(B - A*factor, 0)
-DARKEST - only the darkest colour succeeds: C = min(A*factor, B)
+DARKEST - only the darkest color succeeds: C = min(A*factor, B)
-LIGHTEST - only the lightest colour succeeds: C = max(A*factor, B)
+LIGHTEST - only the lightest color succeeds: C = max(A*factor, B)
DIFFERENCE - subtract colors from underlying image.
diff --git a/content/api_en/circle.xml b/content/api_en/circle.xml new file mode 100755 index 000000000..0e1d9adfb --- /dev/null +++ b/content/api_en/circle.xml @@ -0,0 +1,23 @@ + +
+Creates and returns a new PGraphics object. Use this class if you need to draw into an off-screen graphics buffer. The first two parameters define the width and height in pixels. The third, optional parameter specifies the renderer. It can be defined as P2D, P3D, PDF, or SVG. If the third parameter isn't used, the default renderer is set. The PDF and SVG renderers require the filename parameter.
-It's important to consider the renderer used with createGraphics() in relation to the main renderer specified in size(). For example, it's only possible to use P2D or P3D with createGraphics() when one of them is defined in size(). Unlike Processing 1.0, P2D and P3D use OpenGL for drawing, and when using an OpenGL renderer it's necessary for the main drawing surface to be OpenGL-based. If P2D or P3D are used as the renderer in size(), then any of the options can be used with createGraphics(). If the default renderer is used in size(), then only the default or PDF can be used with createGraphics().
+It's important to consider the renderer used with createGraphics() in relation to the main renderer specified in size(). For example, it's only possible to use P2D or P3D with createGraphics() when one of them is defined in size(). Unlike Processing 1.0, P2D and P3D use OpenGL for drawing, and when using an OpenGL renderer it's necessary for the main drawing surface to be OpenGL-based. If P2D or P3D are used as the renderer in size(), then any of the options can be used with createGraphics(). If the default renderer is used in size(), then only the default, PDF, or SVG can be used with createGraphics().
-It's important to call any drawing functions between beginDraw() and endDraw() statements. This is also true for any functions that affect drawing, such as smooth() or colorMode().
+It's important to run all drawing functions between the beginDraw() and endDraw(). As the exception to this rule, smooth() should be run on the PGraphics object before beginDraw(). See the reference for smooth() for more detail.
+
+The createGraphics() function should almost never be used inside draw() because of the memory and time needed to set up the graphics. One-time or occasional use during draw() might be acceptable, but code that calls createGraphics() at 60 frames per second might run out of memory or freeze your sketch.
Unlike the main drawing surface which is completely opaque, surfaces created with createGraphics() can have transparency. This makes it possible to draw into a graphics and maintain the alpha channel. By using save() to write a PNG or TGA file, the transparency of the graphics object will be honored. ]]>
+Creates a BufferedReader object that can be used to read files line-by-line as individual String objects. This is the complement to the createWriter() function. For more information about the BufferedReader class and its methods like readLine() and close used in the above example, please consult a Java reference.
+
Starting with Processing release 0134, all files loaded and saved by the Processing API use UTF-8 encoding. In previous releases, the default encoding for your platform was used, which causes problems when files are moved to other platforms. ]]>
+The createShape() function is used to define a new shape. Once created, this shape can be drawn with the shape() function. The basic way to use the function defines new primitive shapes. One of the following parameters are used as the first parameter: ELLIPSE, RECT, ARC, TRIANGLE, SPHERE, BOX, QUAD, or LINE. The parameters for each of these different shapes are the same as their corresponding functions: ellipse(), rect(), arc(), triangle(), sphere(), box(), quad(), and line(). The first example above clarifies how this works.
Custom, unique shapes can be made by using createShape() without a parameter. After the shape is started, the drawing attributes and geometry can be set directly to the shape within the beginShape() and endShape() methods. See the second example above for specifics, and the reference for beginShape() for all of its options.
The createShape() function can also be used to make a complex shape made of other shapes. This is called a "group" and it's created by using the parameter GROUP as the first parameter. See the fourth example above to see how it works.
-After using createShape(), stroke and fill color can be set by calling methods like setFill() and setStroke(), as seen in the examples above. The complete list of methods and fields for the PShape class are in the Processing Javadoc. +After using createShape(), stroke and fill color can be set by calling methods like setFill() and setStroke(), as seen in the examples above. The complete list of methods and fields for the PShape class are in the Processing Javadoc. ]]>
+Sets the cursor to a predefined symbol or an image, or makes it visible if already hidden. If you are trying to set an image as the cursor, the recommended size is 16x16 or 32x32 pixels. The values for parameters x and y must be less than the dimensions of the image. +
Setting or hiding the cursor does not generally work with "Present" mode (when running full-screen). -
+
With the P2D and P3D renderers, a generic set of cursors are used because the OpenGL renderer doesn't have access to the default cursor images for each platform (Issue 3791). ]]>
setup(), the draw() function continuously executes the lines of code contained inside its block until the program is stopped or noLoop() is called. draw() is called automatically and should never be called explicitly.
+Called directly after setup(), the draw() function continuously executes the lines of code contained inside its block until the program is stopped or noLoop() is called. draw() is called automatically and should never be called explicitly. All Processing programs update the screen at the end of draw(), never earlier.
-It should always be controlled with noLoop(), redraw() and loop(). If noLoop() is used to stop the code in draw() from executing, then redraw() will cause the code inside draw() to be executed a single time, and loop() will cause the code inside draw() to resume executing continuously.
+To stop the code inside of draw() from running continuously, use noLoop(), redraw() and loop(). If noLoop() is used to stop the code in draw() from running, then redraw() will cause the code inside draw() to run a single time, and loop() will cause the code inside draw() to resume running continuously.
The number of times draw() executes in each second may be controlled with the frameRate() function.
-It is common to call background() near the beginning of the draw() loop to clear the contents of the window, as shown in the first example above. Since pixels drawn to the window are cumulative, omitting background() may result in unintended results, especially when drawing anti-aliased shapes or text.
-
+It is common to call background() near the beginning of the draw() loop to clear the contents of the window, as shown in the first example above. Since pixels drawn to the window are cumulative, omitting background() may result in unintended results.
+
There can only be one draw() function for each sketch, and draw() must exist if you want the code to run continuously, or to process events such as mousePressed(). Sometimes, you might have an empty call to draw() in your program, as shown in the second example above.
]]>
diff --git a/content/api_en/endShape.xml b/content/api_en/endShape.xml
index a6c604615..eaa2d1e05 100755
--- a/content/api_en/endShape.xml
+++ b/content/api_en/endShape.xml
@@ -28,7 +28,7 @@ endShape();
endShape() function is the companion to beginShape() and may only be called after beginShape(). When endshape() is called, all of image data defined since the previous call to beginShape() is written into the image buffer. The constant CLOSE as the value for the MODE parameter to close the shape (to connect the beginning and the end).
+The endShape() function is the companion to beginShape() and may only be called after beginShape(). When endShape() is called, all of image data defined since the previous call to beginShape() is written into the image buffer. The constant CLOSE as the value for the MODE parameter to close the shape (to connect the beginning and the end).
]]>
diff --git a/content/api_en/environment/index.html b/content/api_en/environment/index.html
index a65cc2def..5d92731eb 100644
--- a/content/api_en/environment/index.html
+++ b/content/api_en/environment/index.html
@@ -100,7 +100,7 @@
- Additional commands are found within the five menus: File, Edit, Sketch, Debug, Tools, Help.
+ Additional commands are found within the six menus: File, Edit, Sketch, Debug, Tools, Help.
The menus are context sensitive which means only those items relevant to the work currently
being carried out are available.
@@ -112,8 +112,6 @@ File
"sketch_YYMMDDa".Open a sketch in a new window. -
- Open a sketch from the sketchbook folder.
Select a sketch to open from the list of recently closed sketches.
@@ -533,8 +531,8 @@
Android Mode
Sketches written in this mode can be exported to run on Android phones and tablets. - This mode is documented on the - Processing for Android page of the Processing Wiki. To add this mode, click on + This mode is documented on the + Processing for Android page. To add this mode, click on the mode button in the upper-right corner of the PDE and select "Add Mode..."
--> @@ -576,7 +574,7 @@- The Export information and + The Export information and Tips page on the Processing Wiki covers the details of exporting Applications from Java mode.
diff --git a/content/api_en/exit.xml b/content/api_en/exit.xml index 1df2bb8a0..e6ee94323 100755 --- a/content/api_en/exit.xml +++ b/content/api_en/exit.xml @@ -22,7 +22,7 @@ void mousePressed() {+Quits/stops/exits the program. Programs without a draw() function stop automatically after the last line has run, but programs with draw() run continuously until the program is manually stopped or exit() is run.
Rather than terminating immediately, exit() will cause the sketch to exit after draw() has completed (or after setup() completes if called during the setup() function).
diff --git a/content/api_en/expand.xml b/content/api_en/expand.xml index 30c9d4afe..f0f020319 100755 --- a/content/api_en/expand.xml +++ b/content/api_en/expand.xml @@ -32,7 +32,7 @@ println(imgs.length); // Prints "64"
When using an array of objects, the data returned from the function must be cast to the object array's data type. For example: SomeClass[] items = (SomeClass[]) expand(originalArray) ]]>
A frustum is a geometric form: a pyramid with its top cut off. With the viewer's eye at the imaginary top of the pyramid, the six planes of the frustum act as clipping planes when rendering a 3D view. Thus, any form inside the clipping planes is rendered and visible; anything outside those planes is not visible.
-Setting the frustum has the effect of changing the perspective with which the scene is rendered. This can be acheived more simply in many cases by using perspective().
+Setting the frustum has the effect of changing the perspective with which the scene is rendered. This can be achieved more simply in many cases by using perspective().
Note that the near value must be greater than zero (as the point of the frustum "pyramid" cannot converge "behind" the viewer). Similarly, the far value must be greater than the near value (as the "far" plane of the frustum must be "farther away" from the viewer than the near plane).
diff --git a/content/api_en/fullScreen.xml b/content/api_en/fullScreen.xml index eb1fea958..e75bfd541 100755 --- a/content/api_en/fullScreen.xml +++ b/content/api_en/fullScreen.xml @@ -34,7 +34,7 @@ void draw() {
setup(). The first parameter defines the renderer to use and the second defines either an individual screen to display to or to open a full-screen window across all of the attached displays if there are more than one.
+This function is new for Processing 3.0. It opens a sketch using the full size of the computer's display. This function must be the first line in setup(). The size() and fullScreen() functions cannot both be used in the same program, just choose one.
-The size() and fullScreen() methods cannot both be used in the same program, just choose one. Prior to Processing 3.0, a full-screen program was defined with size(displayWidth, displayHeight).
+When fullScreen() is used without a parameter, it draws the sketch to the screen currently selected inside the Preferences window. When it is used with a single parameter, this number defines the screen to display to program on (e.g. 1, 2, 3...). When used with two parameters, the first defines the renderer to use (e.g. P2D) and the second defines the screen. The SPAN parameter can be used in place of a screen number to draw the sketch as a full-screen window across all of the attached displays if there are more than one.
+
+Prior to Processing 3.0, a full-screen program was defined with size(displayWidth, displayHeight).
]]>
diff --git a/content/api_en/get.xml b/content/api_en/get.xml
index c1307b3cd..be56dc889 100755
--- a/content/api_en/get.xml
+++ b/content/api_en/get.xml
@@ -31,10 +31,12 @@ rect(25, 25, 50, 50);
x and y parameters to get the value of one pixel. Get a section of the display window by specifying additional w and h parameters. When getting an image, the x and y parameters define the coordinates for the upper-left corner of the image, regardless of the current imageMode().
-
+Reads the color of any pixel or grabs a section of an image. If no parameters are specified, the entire image is returned. Use the x and y parameters to get the value of one pixel. Get a section of the display window by specifying additional w and h parameters. When getting an image, the x and y parameters define the coordinates for the upper-left corner of the image, regardless of the current imageMode().
+
If the pixel requested is outside of the image window, black is returned. The numbers returned are scaled according to the current color ranges, but only RGB values are returned by this function. For example, even though you may have drawn a shape with colorMode(HSB), the numbers returned will be in RGB format.
+If a width and a height are specified, get(x, y, w, h) returns a PImage corresponding to the part of the original PImage where the top left pixel is at the (x, y) position with a width of w a height of h.
+
Getting the color of a single pixel with get(x, y) is easy, but not as fast as grabbing the data directly from pixels[]. The equivalent statement to get(x, y) using pixels[] is pixels[y*width+x]. See the reference for pixels[] for more information.
]]>
diff --git a/content/api_en/green.xml b/content/api_en/green.xml
index 7d3ff0566..f1c38fe88 100755
--- a/content/api_en/green.xml
+++ b/content/api_en/green.xml
@@ -27,8 +27,8 @@ Extracts the green value from a color, scaled to match current colorMode()
The green() function is easy to use and understand, but it is slower than a technique called bit shifting. When working in colorMode(RGB, 255), you can acheive the same results as green() but with greater speed by using the right shift operator (>>) with a bit mask. For example, the following two lines of code are equivalent means of getting the green value of the color value c:
-float r1 = green(c); // Simpler, but slower to calculate
-float r2 = c >> 8 & 0xFF; // Very fast to calculate
+float g1 = green(c); // Simpler, but slower to calculate
+float g2 = c >> 8 & 0xFF; // Very fast to calculate
]]>An ArrayList is a resizable-array implementation of the Java List interface. It has many methods used to control and search its contents. For example, the length of the ArrayList is returned by its size() method, which is an integer value for the total number of elements in the list. An element is added to an ArrayList with the add() method and is deleted with the remove() method. The get() method returns the element at the specified position in the list. (See the above example for context.)
-For a list of the numerous ArrayList features, please read the Java reference description. +For a list of the numerous ArrayList features, please read the Java reference description. ]]>
-For a list of the numerous HashMap features, please read the Java reference description. +For a list of the numerous HashMap features, please read the Java reference description. ]]>
-To compare the contents of two Strings, use the equals() method, as in if (a.equals(b)), instead of if (a == b). A String is an Object, so comparing them with the == operator only compares whether both Strings are stored in the same memory location. Using the equals() method will ensure that the actual contents are compared. (The troubleshooting reference has a longer explanation.)
+To compare the contents of two Strings, use the equals() method, as in if (a.equals(b)), instead of if (a == b). A String is an Object, so comparing them with the == operator only compares whether both Strings are stored in the same memory location. Using the equals() method will ensure that the actual contents are compared. (The troubleshooting reference has a longer explanation.)
Because a String is defined between double quotation marks, to include such marks within the String itself you must use the \ (backslash) character. (See the third example above.) This is known as an escape sequence. Other escape sequences include \t for the tab character and \n for new line. Because backslash is the escape character, to include a single backslash within a String, you must use two consecutive backslashes, as in: \\
-There are more string methods than those linked from this page. Additional documentation is located online in the official Java documentation. +There are more string methods than those linked from this page. Additional documentation is located online in the official Java documentation. ]]>
Using print() or println() on a color will produce strange results (usually negative numbers) because of the way colors are stored in memory. A better technique is to use the hex() function to format the color data, or use the red(), green(), and blue() functions to get individual values and print those. The hue(), saturation(), and brightness() functions work in a similar fashion. To extract red, green, and blue values more quickly (for instance when analyzing an image or a frame of video), use bit shifting.
diff --git a/content/api_en/include/curlybraces.xml b/content/api_en/include/curlybraces.xml index f4f1898c9..e9984f0d7 100755 --- a/content/api_en/include/curlybraces.xml +++ b/content/api_en/include/curlybraces.xml @@ -26,7 +26,7 @@ void draw() {
+Doc comments may be converted into browseable documentation using external editors and tools such as the command line javadoc, doc generators such as Doxygen, or IDEs such as Eclipse, Netbeans, or IntelliJ IDEA. ]]>
+
+Note that when comparing String objects, you must use the equals() method instead of ==. See the reference for String or the troubleshooting note for more explanation.
-Note that when comparing String objects, you must use the equals() method instead of == to compare their contents. See the reference for String or the troubleshooting note for more explanation. ]]>
Floats are not precise, so adding small values (such as 0.0001) may not always increment precisely due to rounding errors. If you want to increment a value in small intervals, use an int, and divide by a float value before using it. (See the second example above.)
-Floating-point numbers can be as large as 3.40282347E+38 and as low as -3.40282347E+38. They are stored as 32 bits (4 bytes) of information. The float data type is inherited from Java; you can read more about the technical details here and here.
+Floating-point numbers can be as large as 3.40282347E+38 and as low as -3.40282347E+38. They are stored as 32 bits (4 bytes) of information. The float data type is inherited from Java; you can read more about the technical details here and here.
Processing supports the double datatype from Java as well. However, none of the Processing functions use double values, which use more memory and are typically overkill for most work created in Processing. We do not plan to add support for double values, as doing so would require increasing the number of API functions significantly. ]]>
Hints for use with P2D and P3D:
+DISABLE_ASYNC_SAVEFRAME
+save() and saveFrame() will not use separate threads for saving and will block until the image is written to the drive. This was the default behavior in 3.0b7 and before. To enable, call hint(ENABLE_ASYNC_SAVEFRAME). +
DISABLE_OPENGL_ERRORS
Speeds up the P3D renderer setting by not checking for errors while running.
@@ -45,4 +68,27 @@ Forces the P3D renderer to draw each shape (including its strokes) separately, i Enables stroke geometry (lines and points) to be affected by the perspective, meaning that they will look smaller as they move away from the camera. ]]>
+Converts any value of a primitive data type (boolean, byte, char, color, float, int, or long) or String to its integer representation.
When an array of values is passed in, then an int array of the same length is returned. ]]>
Bit shifting is helpful when using the color data type. A right shift can extract red, green, blue, and alpha values from a color. A left shift can be used to quickly reassemble a color value (more quickly than the color() function). ]]>
+There are more features of PSurface documented in the Processing JavaDoc. +]]>
+There are more features of PSurface documented in the Processing JavaDoc. +]]>
+There are more features of PSurface documented in the Processing JavaDoc. +]]>
+Converts a value of a primitive data type (boolean, byte, char, int, or float) to its String representation. For example, converting an integer with str(3) will return the String value of "3", converting a float with str(-12.6) will return "-12.6", and converting a boolean with str(true) will return "true".
When an array of values is passed in, then a String array of the same length is returned. ]]>
-For non-ASCII keys, use the keyCode variable. The keys included in the ASCII specification (BACKSPACE, TAB, ENTER, RETURN, ESC, and DELETE) do not require checking to see if they key is coded, and you should simply use the key variable instead of keyCode If you're making cross-platform projects, note that the ENTER key is commonly used on PCs and Unix and the RETURN key is used instead on Macintosh. Check for both ENTER and RETURN to make sure your program will work for all platforms. +For non-ASCII keys, use the keyCode variable. The keys included in the ASCII specification (BACKSPACE, TAB, ENTER, RETURN, ESC, and DELETE) do not require checking to see if the key is coded, and you should simply use the key variable instead of keyCode If you're making cross-platform projects, note that the ENTER key is commonly used on PCs and Unix and the RETURN key is used instead on Macintosh. Check for both ENTER and RETURN to make sure your program will work for all platforms.
There are issues with how keyCode behaves across different renderers and operating systems. Watch out for unexpected behavior as you switch renderers and operating systems. ]]>
The keys included in the ASCII specification (BACKSPACE, TAB, ENTER, RETURN, ESC, and DELETE) do not require checking to see if the key is coded; for those keys, you should simply use the key variable directly (and not keyCode). If you're making cross-platform projects, note that the ENTER key is commonly used on PCs and Unix, while the RETURN key is used on Macs. Make sure your program will work on all platforms by checking for both ENTER and RETURN.
-For those familiar with Java, the values for UP and DOWN are simply shorter versions of Java's KeyEvent.VK_UP and KeyEvent.VK_DOWN. Other keyCode values can be found in the Java KeyEvent reference. +For those familiar with Java, the values for UP and DOWN are simply shorter versions of Java's KeyEvent.VK_UP and KeyEvent.VK_DOWN. Other keyCode values can be found in the Java KeyEvent reference.
There are issues with how keyCode behaves across different renderers and operating systems. Watch out for unexpected behavior as you switch renderers and operating systems and you are using keys are aren't mentioned in this reference entry. +
+If you are using P2D or P3D as your renderer, use the NEWT KeyEvent constants. ]]> diff --git a/content/api_en/keyPressed.xml b/content/api_en/keyPressed.xml index 224ed7da8..9cc506b40 100755 --- a/content/api_en/keyPressed.xml +++ b/content/api_en/keyPressed.xml @@ -41,6 +41,8 @@ Because of how operating systems handle key repeats, holding down a key may caus Note that there is a similarly named boolean variable called keyPressed. See its reference page for more information.
Mouse and keyboard events only work when a program has draw(). Without draw(), the code is only run once and then stops listening for events. +
+With the release of macOS Sierra, Apple changed how key repeat works, so keyPressed may not function as expected. See here for details of the problem and how to fix it. ]]> diff --git a/content/api_en/launch.xml b/content/api_en/launch.xml index 464902f0a..87b86e389 100755 --- a/content/api_en/launch.xml +++ b/content/api_en/launch.xml @@ -27,36 +27,14 @@ void mousePressed() { ]]> - -
-The argv parameter is a String or String array which is passed to the command line. If you have multiple parameters, e.g. an application and a document, or a command with multiple switches, use the version that takes a String array, and place each individual item in a separate element. -
-If argv is a String (not an array), then it can only be a single file or application with no parameters. It's not the same as executing that String using a shell. For instance, open("jikes -help") will not work properly. -
-This function behaves differently on each platform. On Windows, the parameters are sent to the Windows shell via "cmd /c". On Mac OS X, the "open" command is used (type "man open" in Terminal.app for documentation). On Linux, it first tries gnome-open, then kde-open, but if neither are available, it sends the command to the shell without any alterations. -
-For users familiar with Java, this is not quite the same as Runtime.exec(), because the launcher command is prepended. Instead, the exec(String[]) function is a shortcut for Runtime.getRuntime.exec(String[]). +Attempts to open an application or file using your platform's launcher. The filename parameter is a String specifying the file name and location. The location parameter must be a full path name, or the name of an executable in the system's PATH. In most cases, using a full path is the best option, rather than relying on the system PATH. Be sure to make the file executable before attempting to open it (chmod +x).
+
+This function (roughly) emulates what happens when you double-click an application or document in the macOS Finder, the Windows Explorer, or your favorite Linux file manager. If you're trying to run command line functions directly, use the exec() function instead (see below).
+
+This function behaves differently on each platform. On Windows, the parameters are sent to the Windows shell via "cmd /c". On Mac OS X, the "open" command is used (type "man open" in Terminal.app for documentation). On Linux, it first tries gnome-open, then kde-open, but if neither are available, it sends the command to the shell and prays that something useful happens.
+
+For users familiar with Java, this is not the same as Runtime.exec(), because the launcher command is prepended. Instead, the exec(String[]) function is a shortcut for Runtime.getRuntime.exec(String[]). The exec() function is documented in the JavaDoc in the PApplet class. ]]>
An amount below 0 will be treated as 0. Likewise, amounts above 1 will be capped at 1. This is different from the behavior of lerp(), but necessary because otherwise numbers outside the range will produce strange and unexpected colors. ]]>
PDF Export
Network
Send and receive data over the Internet through simple clients and servers.
SVG Export
+Create SVG files.
+Serial
Send data between Processing and external hardware through serial communication (RS-232).
diff --git a/content/api_en/loadJSONArray.xml b/content/api_en/loadJSONArray.xml index d7b7444ac..da22530e9 100755 --- a/content/api_en/loadJSONArray.xml +++ b/content/api_en/loadJSONArray.xml @@ -13,24 +13,26 @@
pixels[] array. This function must always be called before reading from or writing to pixels[].
-
-Certain renderers may or may not seem to require loadPixels() or updatePixels(). However, the rule is that any time you want to manipulate the pixels[] array, you must first call loadPixels(), and after changes have been made, call updatePixels(). Even if the renderer may not seem to use this function in the current Processing release, this will always be subject to change.
+Loads the pixel data of the current display window into the pixels[] array. This function must always be called before reading from or writing to pixels[]. Subsequent changes to the display window will not be reflected in pixels until loadPixels() is called again.
]]>
diff --git a/content/api_en/loadStrings.xml b/content/api_en/loadStrings.xml
index 50a71d6cf..321fa0140 100755
--- a/content/api_en/loadStrings.xml
+++ b/content/api_en/loadStrings.xml
@@ -11,7 +11,7 @@
.tsv.
+Reads the contents of a file or URL and creates an Table object with its values. If a file is specified, it must be located in the sketch's "data" folder. The filename parameter can also be a URL to a file found online. The filename must either end in an extension or an extension must be specified in the options parameter. For example, to use tab-separated data, include "tsv" in the options parameter if the filename or URL does not end in .tsv. Note: If an extension is in both places, the extension in the options is used.
+
+If the file contains a header row, include "header" in the options parameter. If the file does not have a header row, then simply omit the "header" option.
-If the file contains a header row, include "header" in the options parameter. If the file does not have a header row, then simply omit the "header" option.
+Some CSV files contain newline (CR or LF) characters inside cells. This is rare, but adding the "newlines" option will handle them properly. (This is not enabled by default because the parsing code is much slower.)
-When specifying both a header and the file type, separate the options with commas, as in: loadTable("data.csv", "header, tsv")
+When specifying multiple options, separate them with commas, as in: loadTable("data.csv", "header, tsv")
All files loaded and saved by the Processing API use UTF-8 encoding.
]]>
diff --git a/content/api_en/loadXML.xml b/content/api_en/loadXML.xml
index 07002b68d..6290c6e28 100755
--- a/content/api_en/loadXML.xml
+++ b/content/api_en/loadXML.xml
@@ -46,7 +46,7 @@ void setup() {
-All files loaded and saved by the Processing API use UTF-8 encoding. If you need to load an XML file that's not in UTF-8 format, see the developer's reference for the XML object.
+All files loaded and saved by the Processing API use UTF-8 encoding. If you need to load an XML file that's not in UTF-8 format, see the developer's reference for the XML object.
]]>
diff --git a/content/api_en/match.xml b/content/api_en/match.xml
index 1db3a9f3a..92d1b2fdf 100755
--- a/content/api_en/match.xml
+++ b/content/api_en/match.xml
@@ -51,7 +51,7 @@ To use the function, first check to see if the result is null. If the result is
If there are groups (specified by sets of parentheses) in the regular expression, then the contents of each will be returned in the array. Element [0] of a regular expression match returns the entire matching string, and the match groups start at element [1] (the first group is [1], the second [2], and so on).
-The syntax can be found in the reference for Java's Pattern class. For regular expression syntax, read the Java Tutorial on the topic.
+The syntax can be found in the reference for Java's Pattern class. For regular expression syntax, read the Java Tutorial on the topic.
]]>
diff --git a/content/api_en/matchAll.xml b/content/api_en/matchAll.xml
index 56feb6b5b..4f0345fbe 100644
--- a/content/api_en/matchAll.xml
+++ b/content/api_en/matchAll.xml
@@ -33,7 +33,7 @@ To use the function, first check to see if the result is null. If the result is
If there are groups (specified by sets of parentheses) in the regular expression, then the contents of each will be returned in the array. Assuming a loop with counter variable i, element [i][0] of a regular expression match returns the entire matching string, and the match groups start at element [i][1] (the first group is [i][1], the second [i][2], and so on).
-The syntax can be found in the reference for Java's Pattern class. For regular expression syntax, read the Java Tutorial on the topic.
+The syntax can be found in the reference for Java's Pattern class. For regular expression syntax, read the Java Tutorial on the topic.
]]>
diff --git a/content/api_en/mouseWheel.xml b/content/api_en/mouseWheel.xml
index 02c01cd7a..0a2344176 100755
--- a/content/api_en/mouseWheel.xml
+++ b/content/api_en/mouseWheel.xml
@@ -26,7 +26,7 @@ void mouseWheel(MouseEvent event) {
mouseWheel() function returns positive values when the mouse wheel is rotated down (toward the user), and negative values for the other direction (up or away from the user). On OS X with "natural" scrolling enabled, the values are opposite.
+The code within the mouseWheel() event function is run when the mouse wheel is moved. (Some mice don't have wheels and this function is only applicable with mice that have a wheel.) The getCount() function used within mouseWheel() returns positive values when the mouse wheel is rotated down (toward the user), and negative values for the other direction (up or away from the user). On OS X with "natural" scrolling enabled, the values are opposite.
Mouse and keyboard events only work when a program has draw(). Without draw(), the code is only run once and then stops listening for events.
]]>
diff --git a/content/api_en/nf.xml b/content/api_en/nf.xml
index f1e6123dd..295db43ac 100755
--- a/content/api_en/nf.xml
+++ b/content/api_en/nf.xml
@@ -26,11 +26,16 @@ String se = nf(e, 5, 3);
println(se); // Prints "00040.200"
String sf = nf(f, 3, 5);
println(sf); // Prints "009.01200"
+
+String sf2 = nf(f, 0, 5);
+println(sf2); // Prints "9.01200"
+String sf3 = nf(f, 0, 2);
+println(sf3); // Prints "9.01"
]]>
As shown in the above example, nf() is used to add zeros to the left and/or right of a number. This is typically for aligning a list of numbers. To remove digits from a floating-point number, use the int(), ceil(), floor(), or round() functions. +Utility function for formatting numbers into strings. There are two versions: one for formatting floats, and one for formatting ints. The values for the digits and right parameters should always be positive integers. The left parameter should be positive or 0. If it is zero, only the right side is formatted.
As shown in the above example, nf() is used to add zeros to the left and/or right of a number. This is typically for aligning a list of numbers. To remove digits from a floating-point number, use the int(), ceil(), floor(), or round() functions. ]]>
+Utility function for formatting numbers into strings and placing appropriate commas to mark units of 1000. There are four versions: one for formatting ints, one for formatting an array of ints, one for formatting floats, and one for formatting an array of floats.
+
+The value for the right parameter should always be a positive integer.
+
For a non-US locale, this will insert periods instead of commas, or whatever is apprioriate for that region. ]]>
By default, noise is computed over 4 octaves with each octave contributing exactly half than its predecessor, starting at 50% strength for the first octave. This falloff amount can be changed by adding an additional function parameter. For example, a falloff factor of 0.75 means each octave will now have 75% impact (25% less) of the previous lower octave. While any number between 0.0 and 1.0 is valid, note that values greater than 0.5 may result in noise() returning values greater than 1.0.
diff --git a/content/api_en/parseJSONArray.xml b/content/api_en/parseJSONArray.xml index f4cbb0b98..cdb4a4832 100755 --- a/content/api_en/parseJSONArray.xml +++ b/content/api_en/parseJSONArray.xml @@ -11,7 +11,7 @@
size() in a program without a setup() and used within setup() when a program has one. The pixelDensity() should only be used with hardcoded numbers (in almost all cases this number will be 2) or in combination with displayDensity() as in the third example above.
-
+
+When the pixel density is set to more than 1, it changes all of the pixel operations including the way get(), set(), blend(), copy(), and updatePixels() all work. See the reference for pixelWidth and pixelHeight for more information.
+
To use variables as the arguments to pixelDensity() function, place the pixelDensity() function within the settings() function. There is more information about this on the settings() reference page.
-
]]>-
-Before accessing this array, the data must loaded with the loadPixels() function. After the array data has been modified, the updatePixels() function must be run to update the changes. Without loadPixels(), running the code may (or will in future releases) result in a NullPointerException. +The pixels[] array contains the values for all the pixels in the display window. These values are of the color datatype. This array is defined by the size of the display window. For example, if the window is 100 x 100 pixels, there will be 10,000 values and if the window is 200 x 300 pixels, there will be 60,000 values. When the pixel density is set to higher than 1 with the pixelDensity() function, these values will change. See the reference for pixelWidth or pixelHeight for more information. +
+Before accessing this array, the data must loaded with the loadPixels() function. Failure to do so may result in a NullPointerException. Subsequent changes to the display window will not be reflected in pixels until loadPixels() is called again. After pixels has been modified, the updatePixels() function must be run to update the content of the display window. ]]>
+Use stroke() to set the color of a point(). +
+Point appears round with the default strokeCap(ROUND) and square with strokeCap(PROJECT). Points are invisible with strokeCap(SQUARE) (no cap). +
+Using point() with strokeWeight(1) or smaller may draw nothing to the screen, depending on the graphics settings of the computer. Workarounds include setting the pixel using set() or drawing the point using either circle() or square(). ]]>
+
+push() stores information related to the current transformation state and style settings controlled by the following functions: rotate(), translate(), scale(), fill(), stroke(), tint(), strokeWeight(), strokeCap(), strokeJoin(), imageMode(), rectMode(), ellipseMode(), colorMode(), textAlign(), textFont(), textMode(), textSize(), textLeading().
+
+The push() and pop() functions were added with Processing 3.5. They can be used in place of pushMatrix(), popMatrix(), pushStyles(), and popStyles(). The difference is that push() and pop() control both the transformations (rotate, scale, translate) and the drawing styles at the same time. +]]>
+
+push() stores information related to the current transformation state and style settings controlled by the following functions: rotate(), translate(), scale(), fill(), stroke(), tint(), strokeWeight(), strokeCap(), strokeJoin(), imageMode(), rectMode(), ellipseMode(), colorMode(), textAlign(), textFont(), textMode(), textSize(), textLeading().
+
+The push() and pop() functions were added with Processing 3.5. They can be used in place of pushMatrix(), popMatrix(), pushStyles(), and popStyles(). The difference is that push() and pop() control both the transformations (rotate, scale, translate) and the drawing styles at the same time. +]]>
scale(2.0) increases the dimension of a shape by 200%.
-Transformations apply to everything that happens after and subsequent calls to the function multiply the effect. For example, calling scale(2.0) and then scale(1.5) is the same as scale(3.0). If scale() is called within draw(), the transformation is reset when the loop begins again. Using this fuction with the z parameter requires using P3D as a parameter for size(), as shown in the third example above. This function can be further controlled with pushMatrix() and popMatrix().
+Transformations apply to everything that happens after and subsequent calls to the function multiply the effect. For example, calling scale(2.0) and then scale(1.5) is the same as scale(3.0). If scale() is called within draw(), the transformation is reset when the loop begins again. Using this function with the z parameter requires using P3D as a parameter for size(), as shown in the third example above. This function can be further controlled with pushMatrix() and popMatrix().
]]>
diff --git a/content/api_en/shorten.xml b/content/api_en/shorten.xml
index 82961260a..41746c5ad 100755
--- a/content/api_en/shorten.xml
+++ b/content/api_en/shorten.xml
@@ -20,7 +20,7 @@ println(sa2); // 'sa2' now contains OH, NY
When using an array of objects, the data returned from the function must be cast to the object array's data type. For example: SomeClass[] items = (SomeClass[]) shorten(originalArray) ]]>
+Defines the dimension of the display window width and height in units of pixels. In a program that has the setup() function, the size() function must be the first line of code inside setup(), and the setup() function must appear in the code tab with the same name as your sketch folder.
-The system variables width and height are set by the parameters passed to this function. For example, running size(640, 480) will assign 640 to the width variable and 480 to the height variable. If size() is not used, the window will be given a default size of 100 x 100 pixels.
+The built-in variables width and height are set by the parameters passed to this function. For example, running size(640, 480) will assign 640 to the width variable and 480 to the height variable. If size() is not used, the window will be given a default size of 100 x 100 pixels.
The size() function can only be used once inside a sketch, and it cannot be used for resizing.
-As of Processing 3.0, to run a sketch at the full dimensions of a screen, use the fullScreen() function, rather than the older way of using size(displayWidth, displayHeight).
+As of Processing 3, to run a sketch at the full dimensions of a screen, use the fullScreen() function, rather than the older way of using size(displayWidth, displayHeight).
The maximum width and height is limited by your operating system, and is usually the width and height of your actual screen. On some machines it may simply be the number of pixels on your current screen, meaning that a screen of 800 x 600 could support size(1600, 300), since that is the same number of pixels. This varies widely, so you'll have to try different rendering modes and sizes until you get what you're looking for. If you need something larger, use createGraphics to create a non-visible drawing surface.
+The minimum width and height is around 100 pixels in each direction. This is the smallest that is supported across Windows, macOS, and Linux. We enforce the minimum size so that sketches will run identically on different machines. +
The renderer parameter selects which rendering engine to use. For example, if you will be drawing 3D shapes, use P3D. In addition to the default renderer, other renderers are:
P2D (Processing 2D): 2D graphics renderer that makes use of OpenGL-compatible graphics hardware.
P3D (Processing 3D): 3D graphics renderer that makes use of OpenGL-compatible graphics hardware.
+FX2D (JavaFX 2D): A 2D renderer that uses JavaFX, which may be faster for some applications, but has some compatibility quirks. +
PDF: The PDF renderer draws 2D graphics directly to an Acrobat PDF file. This produces excellent results when you need vector shapes for high-resolution output or printing. You must first use Import Library → PDF to make use of the library. More information can be found in the PDF library reference.
-As of Processing 3.0, to use variables as the parameters to size() function, place the size() function within the settings() function. There is more information about this on the settings() reference page.
+SVG: The SVG renderer draws 2D graphics directly to an SVG file. This is great for importing into other vector programs or using for digital fabrication. You must first use Import Library → SVG Export to make use of the library.
+
+As of Processing 3.0, to use variables as the parameters to size() function, place the size() function within the settings() function (instead of setup()). There is more information about this on the settings() reference page.
]]>
-
-With the P2D and P3D renderers, smooth(2) is the default, this is called "2x anti-aliasing." The code smooth(4) is used for 4x anti-aliasing and smooth(8) is specified for 8x anti-aliasing. The maximum anti-aliasing level is determined by the hardware of the machine that is running the software, so smooth(4) and smooth(8) will not work with every computer.
-
-The default renderer uses smooth(3) by default. This is bicubic smoothing. The other option for the default renderer is smooth(2), which is bilinear smoothing.
-
+Draws all geometry with smooth (anti-aliased) edges. This behavior is the default, so smooth() only needs to be used when a program needs to set the smoothing in a different way. The level parameter increases the amount of smoothness. This is the level of over sampling applied to the graphics buffer. +
+With the P2D and P3D renderers, smooth(2) is the default, this is called "2x anti-aliasing." The code smooth(4) is used for 4x anti-aliasing and smooth(8) is specified for "8x anti-aliasing." The maximum anti-aliasing level is determined by the hardware of the machine that is running the software, so smooth(4) and smooth(8) will not work with every computer. +
+The default renderer uses smooth(3) by default. This is bicubic smoothing. The other option for the default renderer is smooth(2), which is bilinear smoothing. +
With Processing 3.0, smooth() is different than before. It was common to use smooth() and noSmooth() to turn on and off antialiasing within a sketch. Now, because of how the software has changed, smooth() can only be set once within a sketch. It can be used either at the top of a sketch without a setup(), or after the size() function when used in a sketch with setup(). The noSmooth() function also follows the same rules. +
+When smooth() is used with a PGraphics object, it should be run right after the object is created with createGraphics(), as shown in the Reference in the third example. ]]>
When splicing an array of objects, the data returned from the function must be cast to the object array's data type. For example: SomeClass[] items = (SomeClass[]) splice(array1, array2, index) ]]>
-If the result is a set of numbers, you can convert the String[] array to to a float[] or int[] array using the datatype conversion functions int() and float(). (See the second example above.) +If the result is a set of numbers, you can convert the String[] array to a float[] or int[] array using the datatype conversion functions int() and float(). (See the second example above.)
The splitTokens() function works in a similar fashion, except that it splits using a range of characters instead of a specific character or sequence.
-Certain renderers may or may not seem to require loadPixels() or updatePixels(). However, the rule is that any time you want to manipulate the pixels[] array, you must first call loadPixels(), and after changes have been made, call updatePixels(). Even if the renderer may not seem to use this function in the current Processing release, this will always be subject to change. -
-Currently, while none of the renderers use the additional parameters to updatePixels(), this may be implemented in the future. ]]>
Books. Processing books cove
 |
@@ -12,22 +11,22 @@ |||
|
|
- ||
 |
@@ -38,7 +37,7 @@ Books. Processing books cove
» Order Print/EBook from O'Reilly |
||
|
+ |
+ ||
 |
+
+
+ Processing for Android: Create Mobile, Sensor-Aware, and VR Applications Using Processing |
+ ||
| Learning Processing, Second Edition: A Beginner's Guide to Programming Images, Animation, and Interaction Daniel Shiffman. Published August 2015, Morgan Kaufmann. 564 pages. Paperback. - » Order from Amazon.com 
+ » Order from Amazon.com
The second edition of Learning Processing has been updated for compatibility with Processing 3 and includes several new chapters of content including video, sound, data visualization, and networking. For more, visit the Learning Processing website. @@ -73,7 +96,7 @@ Books. Processing books cove
|
+
|||
|
+ |
+ ||
 |
+ Coding Art: The Four Steps to Creative Programming with the Processing Language + Yu Zhang, Mathias Funk. + Published January 2021, Apress. 280 pages. Paperback. + » Order from Apress + » Order from Amazon + + + The authors write, "Finally, a book on creative programming, written directly for artists and designers! Rather than following a computer science curriculum, this book is aimed at creatives who are working in the intersection of design, art, and education. In this book you'll learn to apply computation into the creative process by following a four-step process, and through this, land in the cross section of coding and art, with a focus on practical examples and relevant work structures. You'll follow a real-world use case of computation art and see how it relates back to the four key pillars, and addresses potential pitfalls and challenges in the creative process. All code examples are presented in a fully integrated Processing example library, making it easy for readers to get started." + |
+ ||
|
+ |
+ ||
 |
+ Pro Processing for Images and Computer Vision with OpenCV + Bryan WC Chung. + Published 2017, APress. Paperback, eBook. + » Order from APress + + The Publisher writes, "Pro Processing for Images and Computer Vision with OpenCV is a step-by-step training tool that guides you through a series of worked examples in linear order. Each chapter begins with a basic demonstration, including the code to recreate it on your own system. Then comes a creative challenge by which to engage and develop mastery of the chapter’s topic. The book also includes hints and tips relating to visual arts, interaction design, and industrial best practices. This book is intended for any developer of artistic and otherwise visual applications, such as in augmented reality and digital effects, with a need to manipulate images, and to recognize and manipulate objects within those images. The book is specifically targeted at those making use of the Processing language that is common in artistic fields, and to Java programmers because of Processing’s easy integration into the Java programming environment." + |
+ ||
|
+ |
+ ||
 |
+ Programming 101: The How and Why of Programming Revealed Using the Processing Programming Language + Jeanine Meyer. + Published 2018, APress. Paperback, eBook. + » Order from Apress + + The Publisher writes, "Understand the importance of programming, even if you’ve never programmed before! This book will teach you the basics of programming using the Processing programming language. You will create your own Processing sketches, using personal images, themes, or hobbies that you enjoy. The chapters in the book will demonstrate the process of programming, starting with formulating an idea, planning, building on past projects, and refining the work, similar to writing an essay or composing a song. This approach will guide you to make use of logic and mathematics to produce beautiful effects. The term for program in Processing is sketch, though the sketches featured in this book are far more than static drawings; they incorporate interaction, animation, video, audio, and accessing files on the local computer and on the Web. Technical features are introduced and explained in the context of complete examples: games (Snake, Hangman, jigsaw, slingshot), making a collage of family images and video clips, preparing directions for folding an origami model, rotating objects in 3D, and others." + |
+ ||
|
|
||
|
|
@@ -130,14 +204,14 @@ Generative Design Hartmut Bohnacker, Benedikt Gross, Julia Laub, and Claudius Lazzeroni. August 2012, Princeton Architectural Press. 472 pages. - Originally published in German November 2009, Schmidt Hermann Verlag. 500 pages. + Originally published in German November 2009, Schmidt Hermann Verlag. 500 pages. » Order from Amazon.com 
This book is extraordinary; the design is clear and the production quality is fantastic. This is the design book about Processing that we've hoped for. Unlike most other Processing books, it doesn't discuss programming basics so it's free to start with exciting examples. The publisher promotes, "Generative design is a revolutionary new method of creating artwork, models, and animations from sets of rules, or algorithms. By using accessible programming languages such as Processing, artists and designers are producing extravagant, crystalline structures that can form the basis of anything from patterned textiles and typography to lighting, scientific diagrams, sculptures, films, and even fantastical buildings. Opening with a gallery of thirty-five illustrated case studies, Generative Design takes users through specific, practical instructions on how to create their own visual experiments by combining simple-to-use programming codes with basic design principles. A detailed handbook of advanced strategies provides visual artists with all the tools to achieve proficiency. Both a how-to manual and a showcase for recent work in this exciting new field, Generative Design is the definitive study and reference book that designers have been waiting for." More information about buying this book in German, as well as the complete source code for the examples, are at the book's website. - |
+
|
| The SparkFun Guide to Processing Derek Runberg. - 2015, No Starch Press. 232 pages. + 2015, No Starch Press. 232 pages. Paperback. » Order from Amazon.com 
The publisher writes, "The SparkFun Guide to Processing teaches you to craft your own digital artwork and even combine it with hardware—no prior programming experience required. Over the course of the book, you’ll learn the basics by drawing simple shapes, move on to photo editing and video manipulation, and ultimately affect the physical world by using Processing with an Arduino." @@ -163,7 +237,7 @@ Books. Processing books cove |
+
|||
|
|||
 |
+ Processing: An Introduction to Programming + Jeffrey L. Nyhoff, Larry R. Nyhoff. + Published May 2017, CRC Press. 544 pages. eBook, Paperback. + » Order from CRC Press + + » Order from Amazon.com + + The publisher writes, "The book uses Processing’s capabilities for graphics and interactivity in order to create examples that are simple, illustrative, interesting, and fun. It is designed to appeal to a broad range of readers, including those who want to learn to program to create digital art, as well as those who seek to learn to program to process numerical information or data. It can be used by students and instructors in a first course on programming, as well as by anyone eager to teach them self to program." + + The publisher lists: +
|
+ ||
|
+ |
+ ||
 |
@@ -209,13 +311,11 @@ |||
|
|
||
 |
Processing: Creative Coding and Computational Art (Foundation) @@ -227,11 +327,10 @@ Books. Processing books cove
|
||
|
|
||
+ | |
- Programming Interactivity + | Programming Interactivity Joshua Noble. Published January 2012, O'Reilly. 728 pages. Paperback. » Order from Amazon.com 
- The O'Reilly website says, "Make cool stuff. If you're a designer or artist without a lot of programming experience, this book will teach you to work with 2D and 3D graphics, sound, physical interaction, and electronic circuitry to create all sorts of interesting and compelling experiences -- online and off. Programming Interactivity explains programming and electrical engineering basics, and introduces three freely available tools created specifically for artists and designers: Processing, Arduino, and OpenFrameworks." |
-
|
@@ -274,10 +372,12 @@ |||
 |
- Generative Art + | ||
|
+
+ |
+
+ Generative Art Matt Pearson. Published March 2011, Manning Publications. 300 pages. Paperback. » Order from Amazon.com 
@@ -290,8 +390,9 @@ Books. Processing books cove |
- ||
 |
- Algorithms for Visual Design Using the Processing Language - Kostas Terzidis. - Published May 2009, Wiley. 384 Pages. Hardcover. - » Order from Amazon.com 
- - The Wiley website says, "this book offers a series of generic procedures that can function as building blocks and encourages you to then use those building blocks to experiment, explore, and channel your thoughts, ideas, and principles into potential solutions. The book covers such topics as structured shapes, solid geometry, networking and databases, physical computing, image processing, graphic user interfaces, and more." |
+ ||
|
+
+ |
+
+ Algorithms for Visual Design Using the Processing Language + Kostas Terzidis. + Published May 2009, Wiley. 384 Pages. Hardcover. + » Order from Amazon.com
+ + The Wiley website says, "this book offers a series of generic procedures that can function as building blocks and encourages you to then use those building blocks to experiment, explore, and channel your thoughts, ideas, and principles into potential solutions. The book covers such topics as structured shapes, solid geometry, networking and databases, physical computing, image processing, graphic user interfaces, and more." + |
||
|
|
||
+ 
+ |
+
+ Data-driven Graphic Design: Creative Coding for Visual Communication + Andrew Richardson. + Published January 2016, Bloomsbury. 224 Pages. Paperback. + » Order from Amazon.com + + The book description reads, "Data-driven Graphic Design introduces the creative potential of computational data and how it can be used to inform and create everything from typography, print and moving graphics to interactive design and physical installations. Using code as a creative environment allows designers to step outside the boundaries of commercial software tools, and create a set of unique, digitally informed pieces of work. The use of code offers a new way of thinking about and creating design for the digital environment." + |
+ ||
|
|
||
|
|
|
+ |
 |
+
+
+ Creating Procedural Artworks with Processing |
+ ||
|
+ |
+ ||
 |
+ O Código Transcendente: Uma Introdução Prática à Programação e Arte Gerativa + Mateus Berruezo. + Published December 2019. 270 pages. PDF, Web. + Text in Portuguese. + » Download + » Read online + + + Este livro é um guia de programação com enfoque prático considerando o contexto da arte gerativa e do pensamento computacional. Ele conta com explicações e exemplos visuais cuidadosamente projetados para serem de valor tanto para programadores quanto artistas. As aplicações e estudos de caso foram direcionados para a linguagem Processing cuja própria filosofia segue o princípio da exploração do artístico através do código. + |
+ ||
|
+ |
+ ||
 |
Einführung ins Programmieren mit Processing - Matthias Wolf. - Published August 2013. 178 pages. PDF, Paperback. - » Order Print/EBook from lulu.com - - Die eigenständige Programmiersprache Processing basiert auf Java und ähnelt diesem sehr, verbirgt aber gleichzeitig viel von dessen Komplexität. Dadurch ist Processing für den Programmieranfänger ideal geeignet, um sich Konzepte des Programmierens zu erschließen und bewahrt gleichzeitig die Möglichkeit eines späteren Umstiegs. Dennoch ist die Sprache keineswegs nur für triviale Anfängeraufgaben geeignet: speziell im Bereich der graphischen Datenverarbeitung spielt Processing seine Stärken aus. -Dieses Buch richtet sich in erster Linie an den Einsteiger, den es an die Bewältigung auch komplexerer Aufgaben heranführt, wobei grundlegende Konzepte der imperativen und der objektorientierten Programmierung vorgestellt werden. Auch notwendige theoretische Hintergründe kommen dabei nicht zu kurz. Ausführlich kommentierter Beispielcode erschließt Konzepte und Sprache. Aber auch der routinierte Programmierer, der sich "nur" eine neue Sprache erschließen will, wird fündig! -Aus dem Inhalt: Datentypen — Variablen — Arrays (ein- und mehrdiomensional) — Flusssteuerung — Methoden — Objektorientiertes Programmieren — 2D-Graphik — 3D-Graphik — Dateizugriff — PDF — QuickTimeTM — Arduino®-Mikrocontroller — Alphabetischer Index
+ Matthias Wolf. Die eigenständige Programmiersprache Processing basiert auf Java und ähnelt diesem sehr, verbirgt aber gleichzeitig viel von dessen Komplexität. Dadurch ist Processing für den Programmieranfänger ideal geeignet, um sich Konzepte des Programmierens zu erschließen und bewahrt gleichzeitig die Möglichkeit eines späteren Umstiegs. Dennoch ist die Sprache keineswegs nur für triviale Anfängeraufgaben geeignet: speziell im Bereich der graphischen Datenverarbeitung spielt Processing seine Stärken aus. +Dieses Buch richtet sich in erster Linie an den Einsteiger, den es an die Bewältigung auch komplexerer Aufgaben heranführt, wobei grundlegende Konzepte der imperativen und der objektorientierten Programmierung vorgestellt werden. Auch notwendige theoretische Hintergründe kommen dabei nicht zu kurz. Ausführlich kommentierter Beispielcode erschließt Konzepte und Sprache. Aber auch der routinierte Programmierer, der sich "nur" eine neue Sprache erschließen will, wird fündig! +Aus dem Inhalt: Datentypen — Variablen — Arrays (ein- und mehrdiomensional) — Flusssteuerung — Methoden — Objektorientiertes Programmieren — 2D-Graphik — 3D-Graphik — Dateizugriff — PDF — QuickTimeTM — Arduino®-Mikrocontroller — Alphabetischer Index |
||
 |
+
+ Il Codice dei Cibernetici: Introduzione alla Computer Art con Processing + Antonio Rollo + Published December 2015, Oistros Edizioni. 320 pages. Softcover. + Text in Italian. + + During the 50‘s ”era of cybernetics“, computer entered into the history of art simultaneously in different parts of the world. Art and science were in great turmoil. Science, with its theories and experiments, was approaching artificially mimicking both natural phenomena, such as light and sound, and the human phenomena of language and communication. Art, with its aesthetic and exhibitions, had transcended the boundaries of the avant-garde. Now, with the computer, it was confronting a reality that challenged ”the where“ and ”the how“ of doing art and the very meaning of ”masterpiece“. Antonio Rollo takes us on a tour of these seminal works from his unique perspective of the artist, through the code! + + + There's additional information on the publisher's website. + |
+ ||
|
+ |
+ ||
 |
Built with Processing Published March 2007, BNN. 232 pages. Softcover. - Text in Japanese + Text in Japanese. Note from Casey: "I received a copy of this book from the authors on a recent trip to Japan. It's a beautifully produced full-color book with sections introducing Processing, featuring work created with Processing (many are from the Exhibition section of the Processing website), and introducing programming through progressively complicated examples. The majority of the book is an introduction to programming. There are many good examples and the code is color-coded like in the Processing Environment. This book is less comprehensive than the Greenberg and Reas/Fry books, but it appears to be a good, brief introduction." - There's additional information on the publisher's website. |
+ There's additional information on the publisher's website.
+
||
|
|
||
|
-
- Processing is also discussed through examples and projects in the following books:
-
- - - - - 10 PRINT CHR$(205.5+RND(1)); : GOTO 10  By Nick Montfort, Patsy Baudoin, John Bell, Ian Bogost, Jeremy Douglass, Mark C. Marino, Michael Mateas, Casey Reas, Mark Sample, Noah Vawter. Examples use Processing to explore a modern interpretation of a 1982 Commodore 64 program.- - - - Make: Getting Started with Arduino  By Massimo Banzi. Examples use Processing to communicate with an Arduino board. - - - - Building Wireless Sensor Networks: with ZigBee, XBee, Arduino, and Processing By Robert Faludi. Network examples use Processing. - - - - Physical Computing: Sensing and Controlling the Physical World with Computers - By Dan O'Sullivan and Tom Igoe. Examples using Processing for RS-232 communication and - computer vision. - + |
+ 
+ |
+
+ Programming for Artists + Pavel A. Orlov. + Published 2015. 248 Pages. PDF. + Text in Russian. + » Download the book - - Aesthetic Computing. - Edited by Paul Fishwick. Casey Reas and Ben Fry contributed a chapter entitled - "Processing Code: Programming within the Context of Visual Art and Design." - + The author's website reads, "Летом 2015 года мне удалось подготовить к выходу в свет новую книгу, посвященную программированию для художников и дизайнеров. Книга рассматривает среду Processing как одну из самых простых и доступных в освоении. Я акцентировал внимание на том, что каждый человек, знакомый с азами математики, может научиться использовать программирование для своих творческих задач. Конечно, я говорю про активных дизайнеров, которые не боятся использовать и изучать новые для себя инструменты. - - Hacking Roomba: ExtremeTech By Tod E. Kurt. Processing is introduced and used to design an application to control a Roomba (a robot vacuum cleaner). - + Часто я слышу вопросы: “Зачем художнику нужно программировать? Почему нельзя просто взять и нарисовать от руки? А что, фотошоп отменили? Неужели у художников есть математическая логика?” Мне эти вопросы кажутся замечательными и напоминают художника в момент появления фотографии, когда художники спорили с фотографами примерно теми же словами, разве что слова фотошоп еще не было. И сейчас у нас развивается искусство фотографии бурным потоком. Более развернутый ответ вы можете найти во вступительной статье. - Analog In, Digital Out By Brendan Dawes. Numerous projects created with Processing are illustrated and discussed. |
-
+
+
diff --git a/content/static/foundation-site/donate.html b/content/static/foundation-site/donate.html
deleted file mode 100644
index f7ec3331c..000000000
--- a/content/static/foundation-site/donate.html
+++ /dev/null
@@ -1,38 +0,0 @@
-Download Processing. Processing is available for Linux, Mac OS X, and Windows. Select your choice to download the software below.
+ + + + + +
+
+ 4.0b1
+ (9 August 2021)
+ Windows 64
+ Linux 64
+ macOS
+
+
+ 3.5.4
+ (17 January 2020)
+ Win 32
+ Win 64
+ Linux 64
+ Mac OS X
+
+
+
+
+ 2.2.1
+ (19 May 2014)
+ Win 32
+ Win 64
+ Linux 32
+ Linux 64
+ Mac OS X
+
+
+
+ 1.5.1
+ (15 May 2011)
+ Win (standard)
+ Win (no Java)
+ Linux x86
+ Mac OS X
+
+
+
+
+
+ Stable Releases
+Earlier releases have been removed because we can only support the current versions of the software. To update old code, read the changes page. Changes for each release can be found in revisions.txt. If you have problems with the current release, please file a bug so that we can fix it. Older releases can also be built from the source. Read More about the releases and their numbering. To use Android Mode, Processing 3 or later is required.
+
+
+
+
+ Pre-Releases
+ +The changes document covers incremental updates between 4.x releases, and is especially important to read for pre-releases.
+
+ Processing is Open Source Software. The PDE (Processing Development Environment) is released under the GNU GPL (General Public License). The export libraries (also known as 'core') are released under the GNU LGPL (Lesser General Public License). There's more information about Processing and Open Source in the FAQ and more information about the GNU GPL and GNU LGPL at opensource.org. Please support Processing!
+
+
+Donate
- --
|
-
-
-
-
-
- Processing is open source, free software. All donations fund the Processing Foundation, a nonprofit organization devoted to advancing the role of programming within the visual arts through developing Processing. - - - - - - - - - |
-
Fellowships
- -- -
|
-
- -The Processing Foundation maintains a fellowship program that supports the development and expansion of Processing and its affiliated projects. Work done by fellows is supported through funding and mentorship from The Processing Foundation. The projects done so far have all been undertaken in parallel with each of the fellows’ practices as artists. - - --   
-- - -Wilm Thoben (2013-14) - -
-Thoben developed a new core Sound library from fall 2013 through winter 2014. This library is now released with Processing 3.0.
- -   
-- - -Lauren McCarthy (2013) - -
-McCarthy started the work that has now become p5.js in spring, summer, and fall 2013. p5.js is a JavaScript interpretation of Processing.
- -   
-- - -Greg Borenstein (2013) - -
-Borenstein expanded and released the OpenCV library in spring and summer 2013.
- |
-
Mission
- --
|
-
- - Since its inception in 2001, Processing has sought to bridge the traditionally divided cultures of the arts and the sciences. The mission of the Processing Foundation is to link these two cultures so they can be used within a diverse constituency, by way of developing the Processing software. For those with a tendency to think in numbers, Processing introduces a language of the visual arts through a more familiar computer science vocabulary. Likewise, the software is structured through an image-based framework, making it accessible to visual thinkers. Core computer science concepts like variables, functions, and conditionals are taught side by side with visual basics like image, shape, and color. - - -- The key to our philosophy is the merging between the two: we see software as a medium, or something that connects two things. We view it as a means for making, and see our role as providing a new medium to artists and users across a variety of fields. At a time when our society requires a literacy and sensitivity to media of all kinds, we see ourselves making this possible for a broad spectrum of constituencies. - - - -- Processing serves a wide range of communities in different contexts, from the university classroom to the tinkerer’s garage, used by everyone from the professional to the hobbyist. Within education at a university level, we have seen Processing leveraged as a classroom tool across disciplines as varied as computer science, English, art, architecture, design, and the digital humanities. In the last few years, it has begun to become a presence in high school and middle school classrooms, being particularly effective when used to teach science, math, and more generally, computer science. For example, the Kahn Academy now uses Processing’s tutorials and language in their beginning computer science instruction. In areas of professional development, Processing has become enfolded into the practices of interface and communication designers, artists and media artists, photographers, architects, and filmmakers. It also has a substantial role in the communities of makers and amateurs, and among hackerspaces and gatherings of hobbyists. - - - -- The growing use of Processing in the classroom over the last twelve years has pointed toward a direction to rethink the way students are taught to program. Instead of learning a specific vocational skill (such as any one certain programming language or software), the teaching of Processing follows from a philosophy that advocates for a more generalized and strategic way of thinking. Because technology changes at such a rapid pace, the goal of any education in software has to teach the fundamentals of programming. With knowledge of such a foundation, a student is able to learn any other piece of software. Processing was specifically designed to relate to other languages, so a working knowledge of it means that a student can become well-versed in others that are more domain-specific, in relatively little time. Also, it uses a visual framework, so as to be more accessible to people who don’t naturally think like mathematicians or computer scientists. This has opened the door for software to become part of an artist’s toolkit in a way never before seen. - - -- The use of Processing within the visual arts and design fields has grown continuously since the software was first released. Appearing at a critical moment when artists began introducing new media and technology into their practices, Processing has allowed for thousands of creative professionals to leverage it as a medium, changing the landscape of the arts at the beginning of the 21st century. Software is still a nascent medium for artists and designers, and part of The Processing Foundation’s mission is to nurture this trajectory to be both widely used and accepted. - - -- Within technology, Processing has made it possible to understand massive data sets in a visual and more accessible way. It has also helped foster the connection between engineering and visual design that has been pushed to the fore by Apple and others. - - - |
-
|
-
- - The Processing Foundation was founded in 2012 with the two-fold mission to promote software literacy within the visual arts, and visual literacy within technology-related fields. Our primary goal is to empower people of all interests and backgrounds to learn how to program, so as to facilitate a sophisticated way of thinking about and creating media at a time when such knowledge is crucial. We do this by developing and distributing a group of related software projects, which includes Processing (Java), p5.js (Javascript), and Processing.py (Python). - - --We serve a growing community of artists, designers, educators, programmers, engineers, and anyone in between who has an inclination toward both the arts and technology. Core to our belief is that learning how to program is a process of learning how to think, rather than acquiring a certain skillset, so that this knowledge may be applied to any number of fields, from creating artworks to imagining new technologies. We view Processing as a means to bridge seemingly disparate disciplines, providing platforms for collaboration between communities that might not otherwise have had access to each other. We also envision Processing as a new tool for both artists and technologists to use in their work, as a medium and as a context. We see ourselves situated at the place of convergence between the arts and technology, facilitating the pursuit and literacy of both. - - --Processing is primarily developed by a dedicated group affiliated with Fathom Information Design (Boston), the UCLA Arts Software Studio (Los Angeles), and ITP at NYU (New York City). - - -- The Processing Foundation supports a fellowship program to initiate and develop research projects for the Processing software. - - --We are supported by our community and actively seek donations through downloads of Processing. - - --Contact us at foundation@processing.org - - - |
-
Patrons
- -- -
|
-
- - Individuals making $5 to $100 donations are the largest source of income for the Processing Foundation. We’re grateful to all who have donated and we’re proud to be supported by the community. You can donate when you download the software here. - - -- The University of Denver and the Emergent Digital Practices program sponsored a Processing 3.0 development meeting in November 2014. We thank Chris Coleman and Laleh Mehran for arranging this session and gracefully hosting us. - - -- The Google Summer of Code program has provided and excellent source of energy and new development through supporting students to work with us. This program has now supported Processing for four years, 2010 to 2014. It has provided the base for many important enhancements to the software. - - -- In 2013, O'Reilly Media and Arduino made donations to the Processing Foundation. - - -- Prior to incorporating as a Foundation, Processing received key funding and support from several organizations and companies. These commitments enabled a series of pivotal improvements to the software: - - -
|
-
Board of Directors
- -
- 
- |
- - Ben Fry is principal of Fathom, a design and software consultancy located in Boston. He received his doctoral degree from the Aesthetics + Computation Group at the MIT Media Laboratory, where his research focused on combining fields such as computer science, statistics, graphic design, and data visualization as a means for understanding information. After completing his thesis, he spent time developing tools for visualization of genetic data as a postdoc with Eric Lander at the Eli and Edythe L. Broad Institute of MIT and Harvard. During the 2006-2007 school year, Ben was the Nierenberg Chair of Design for the Carnegie Mellon School of Design. In 2011, he won the National Design Award for Interaction Design from the Cooper-Hewitt. With Casey Reas, Fry initiated Processing in 2001. - | -
- 
- |
- - Daniel Shiffman works as an Associate Arts Professor at the Interactive Telecommunications Program at NYU's Tisch School of the Arts. Originally from Baltimore, Daniel received a BA in Mathematics and Philosophy from Yale University and a Master's Degree from the Interactive Telecommunications Program. He works on developing tutorials, examples, and libraries for Processing, the open source programming language and environment created by Casey Reas and Ben Fry. He is the author of Learning Processing: A Beginner's Guide to Programming Images, Animation, and Interaction and The Nature of Code (self-published via Kickstarter), an open source book about simulating natural phenomenon in Processing. - | -
- 
- |
- - Lauren McCarthy is an artist based in Brooklyn, NY. She is full-time faculty at NYU ITP, and recently a resident at CMU STUDIO for Creative Inquiry and Eyebeam. She holds an MFA from UCLA and a BS Computer Science and BS Art and Design from MIT. Her work explores current systems and structures for being a person and interacting with other people. - | -
- 
- |
- - Casey Reas is an artist and educator based in Los Angeles. He has exhibited, screened, and performed his work internationally in galleries and museums around the world. Reas is a professor at the University of California, Los Angeles. He holds a masters degree from the Massachusetts Institute of Technology in Media Arts and Sciences as well as a bachelors degree from the School of Design, Architecture, Art, and Planning at the University of Cincinnati. With Ben Fry, Reas initiated Processing in 2001. - | -
Assistant Director
- -
- 
- |
- - Johanna Hedva is an artist and writer whose practice manifests in a wide range of projects, from performances of Ancient Greek plays rewritten to respond to feminist and queer political discourse, to poetry, novels, criticism, and theory. She's got an MA in Aesthetics and Politics, and an MFA in Art, from California Institute of the Arts, and has been an artist-in-residence at Headlands Center for the Arts, and writer-in-residence at the Armory Center for the Arts. Her work with the Processing Foundation is motivated by her political and social commitments to gender and racial diversity in technology and the arts; open-source philosophy and practice; and promoting the attenuation of the boundaries between creative and thought-making disciplines of all kinds. - | -
Advisor
- -
- 
- |
- - John Maeda is currently a Design Partner at Kleiner Perkins Caufield & Byers. He was the President of the Rhode Island School of Design from 2008 to 2013, is a recipient of the National Design Award, and is represented in the permanent collection of the Museum of Modern Art. Beginning in 1996, lasting for 13 years, he was a Professor at MIT, where he served as an Associate Director of Research at the MIT Media Lab and was responsible for managing research relationships with 70+ industrial organizations. He received a Ph.D. in Design Science from the University of Tsukuba Institute of Art and Design in Japan. In May 2003, he received an Honorary Doctorate of Fine Arts from the Maryland Institute of Contemporary Art. He received an MBA from Arizona State University in May 2006. - | -
Projects
- --
-
- Processing- -- Processing is a programming language, development environment, and online community. Founded in 2001, Processing was initially created to serve as a software sketchbook and to teach computer programming fundamentals within a visual context. Processing has since evolved into a development tool for professionals, an educational tool used in classrooms around the country, and a new context and medium for artists. Today, there are tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning, prototyping, and production. - - -- It was designed to be a user’s first programming language, inspired by earlier languages like BASIC and Logo, as well as our experiences as students and teaching visual arts foundation curricula. It is now used in classrooms worldwide, often in art schools and visual arts programs in universities, but also in high schools, computer science programs, and humanities curricula. - - -- In addition to educational purposes, the Processing software is used by thousands of visual designers, artists, and architects to create their works. Projects created with Processing have been featured at the Museum of Modern Art in New York, the Victoria and Albert Museum in London, the Centre Georges Pompidou in Paris, and many other prominent venues. Processing is used to create projected stage designs for dance and music performances; to generate images for music videos and film; to export images for posters, magazines, and books; and to create interactive installations in galleries, in museums, and on the street. - - -- - p5.js- -- p5.js is a JavaScript library that starts with the original goal of Processing--to make coding accessible for artists, designers, educators, and beginners--and reinterprets this for today's web. Using the original metaphor of a software sketchbook, p5.js has a full set of drawing functionality for the entire browser page. For this, p5.js has addon libraries that streamline interaction with other HTML5 objects, including text, input, video, webcam, and sound. - - -- Having just been released, p5.js is in active development, with an official editing environment and other features coming soon. - - -- - Processing.py- -- Our most recent initiative: To write Processing code. In Python. - - -- We are thrilled to make available this public release of the Python Mode for Processing, and its associated documentation. If you'd like to help us improve the implementation of Python Mode and its documentation, please find us on Github. - - - |
-
Annual Reports
- -- -
-
- 2013 Report- -- We had a busy and productive 2013 with a wide range of activities: -
- - Google Summer of Code- -2014 Report- -- The Processing Foundation participated in Google Summer of Code for its fourth consecutive year in 2014, completing a total of eleven projects (summarized below) with a group of dedicated, innovative, and inspiring students. -
- 2013 Report- -- In 2013, our third year participating in Google Summer of Code, the Processing Foundation completed four projects in collaboration and mentorship with a group of talented students. -
|
-
Foundation. The Processing Foundation is an organization that develops software tools for the visual arts.
- -- -
-
-
- Overview- -- The goal of the Processing Foundation is to promote software literacy, particularly within the visual arts, and to promote visual literacy within technology. Our primary charge is to develop and distribute the Processing software, both the core Application Programming Interface (API) and the programming environment, the Processing Development Environment (PDE). The board of directors for the Processing Foundation consists of Ben Fry, Casey Reas, and Dan Shiffman. The first member of the board of advisors is John Maeda. - - -- To succeed, the Foundation needs to raise money to support future versions of the Processing software and related initiatives. The Processing team, a small group of volunteers, has released over 200 versions of the software since 2001, leading to the 2.0 release in the spring of 2013.With almost no funding between the 1.0 and 2.0 releases, the software was written slowly while the developers managed full-time work and many other responsibilities. The 2.0 software release happened in an unsustainable way, at tremendous personal expense to the lead developers. The Foundation must raise funding for the initiative to continue. - - -- With the 2.0 software release, we're now asking for donations from individuals who use the software, and we're actively seeking larger gifts from individuals, companies, and other non-profit organizations. To learn more about why you might want to contribute, please read the 2013 status report below. The Processing Foundation was publicly announced in June 2013 with the release of the Processing 2.0 software. Our official non-profit status was was granted by the IRS on 6 March 2014, with our tax exception status retroactive to our date of formation, 14 June 2012. - - - - - -2013 Report- -- We had a busy and productive 2013 with a wide range of activities: -
- Despite the new fundraising goals, Processing remains almost entirely a volunteer organization pushed forward by a small group of people. In starting our fundraising push, the initial goal was to hire one full-time developer to maintain and build the Processing code base, while the current Processing team continues to volunteer time to the project. We've received a constant stream of donations through the Download page interface, but at the end of nine months the amount is about 10% of what we need to hire a developer. We're currently utilizing the donations to support Processing Fellows, short-term appointments to explore future directions for Processing and to produce essential libraries. For instance, we supported Lauren McCarthy to explore new ideas for integrating Processing with JavaScript and we supported Greg Borenstein to development the new OpenCV library. - - - - -Patrons- -- Individuals making $5 to $100 donations are the largest source of income for the Processing Foundation. We're grateful to all who have donated and we're proud to be supported by the community. - - -- In 2013, O'Reilly Media and Arduino made donations to the Processing Foundation. - - -- The Google Summer of Code program has provided and excellent source of energy and new development through supporting students to work with us. This program has now supported Processing for three years, 2010 to 2013. It has provided the base for many important enhancements to the software. - - -- Prior to incorporating as a Foundation, Processing received key funding and support from several organizations and companies. These commitments enabled a series of pivotal improvements to the software. - - -- The Interactive Telecommunications Program (ITP) at New York University sponsored a Processing 2.0 development workshop in the summer of 2011. - - -- The Armstrong Institute for Interactive Media Studies at Miami University funded The Oxford Project, a series of Processing development workshops during the 2008-2009 academic year. These four-day meetings in Oxford, Ohio, enabled the November 2008 launch of Processing 1.0 and stimulated future development. - - -- Oblong Industries funded Ben Fry to develop Processing during the summer of 2008. This funding also assisted in the completion of the 1.0 release. The Rockefeller Foundation awarded Ben Fry with a Media Arts Fellowship in 2006. The grant marked the first time that Ben was able to work on Processing as a funded project. This support led to further developments of the OpenGL and PDF rendering engines, as well as significant enhancements to other libraries and their integration. - - -- The Interaction Design Institute Ivrea funded four individuals' work on Processing in the summer of 2003. This resulted in Dan Mosedale's preprocessor using Antlr, Sami Arola's contributions to the graphics engine, and other contributions to the Processing Development Environment and 2D graphics engine. We are grateful to Interaction Ivrea director Gillian Crampton Smith for her encouragement and support. - - - |
-
Processing: A Programming Handbook
Published December 2014, The MIT Press.
720 Pages. Hardcover.
- » Order from MIT Press
+ » Order from MIT Press
» Order from Amazon
» Download Examples
» Errata
- If you are an educator, you can request a desk/exam copy from the MIT Press website.
+ If you are an educator, you can request a desk/exam copy from the MIT Press website.
@@ -28,7 +28,7 @@
Processing: A Programming Handbook
- Interviews with SUE.C, Larry Cuba, Mark Hansen, Lynn Hershman Leeson, Jürg Lehni, LettError, Golan Levin and Zachary Lieberman, Benjamin Maus, Manfred Mohr, Ash Nehru, Josh On, Bob Sabiston, Jennifer Steinkamp, Jared Tarbell, Steph Thirion, and Robert Winter.
+ Interviews with SUE.C, Larry Cuba, Mark Hansen, Lynn Hershman Leeson, Jürg Lehni, LettError, Golan Levin and Zachary Lieberman, Benjamin Maus, Manfred Mohr, Ash Nehru, Josh On, Bob Sabiston, Jennifer Steinkamp, Jared Tarbell, Steph Thirion, and Robert Winter.
diff --git a/content/static/overview.html b/content/static/overview.html
index 13349191d..d5d3d30ff 100644
--- a/content/static/overview.html
+++ b/content/static/overview.html
@@ -6,14 +6,11 @@ Overview. A short introducti
- For the past fourteen years, Processing has promoted software literacy, particularly within the visual arts, and visual literacy within technology. Initially created to serve as a software sketchbook and to teach programming fundamentals within a visual context, Processing has also evolved into a development tool for professionals. The Processing software is free and open source, and runs on the Mac, Windows, and GNU/Linux platforms.
-
-
- Processing continues to be an alternative to proprietary software tools with restrictive and expensive licenses, making it accessible to schools and individual students. Its open source status encourages the community participation and collaboration that is vital to Processing’s growth. Contributors share programs, contribute code, and build libraries, tools, and modes to extend the possibilities of the software. The Processing community has written more than a hundred libraries to facilitate computer vision, data visualization, music composition, networking, 3D file exporting, and programming electronics.
+ For the past sixteen years, Processing has promoted software literacy, particularly within the visual arts, and visual literacy within technology. Initially created to serve as a software sketchbook and to teach programming fundamentals within a visual context, Processing has also evolved into a development tool for professionals. The Processing software is free and open source, and runs on the Mac, Windows, and GNU/Linux platforms.
- Processing is currently developed primarily in Boston (at Fathom Information Design), Los Angeles (at the UCLA Arts Software Studio), and New York City (at NYU’s ITP).
+ Processing continues to be an alternative to proprietary software tools with restrictive and expensive licenses, making it accessible to schools and individual students. Its open source status encourages the community participation and collaboration that is vital to Processing’s growth. Contributors share programs, contribute code, and build libraries, tools, and modes to extend the possibilities of the software. The Processing community has written more than a hundred libraries to facilitate computer vision, data visualization, music composition, networking, 3D file exporting, and programming electronics.
Education
@@ -27,7 +24,7 @@ Education
- The innovations in teaching through Processing have been adapted for the Khan Academy computer science tutorials, offered online for free. The tutorials begin with drawing, using most of the Processing functions for drawing. The Processing approach has also been applied to electronics through the Arduino and Wiring projects. Arduino uses a syntax inspired by that used with Processing, and continues to use a modified version of the Processing programming environment to make it easier for students to learn how to program robots and countless other electronics projects.
+ The innovations in teaching through Processing have been adapted for the Khan Academy computer science tutorials, offered online for free. The tutorials begin with drawing, using most of the Processing functions for drawing. The Processing approach has also been applied to electronics through the Arduino and Wiring projects. Arduino uses a syntax inspired by that used with Processing, and continues to use a modified version of the Processing programming environment to make it easier for students to learn how to program robots and countless other electronics projects.
Culture
@@ -45,21 +42,23 @@ Research
Foundation
-The primary charge of the Foundation is to develop and distribute the Processing software. This includes the original Processing (Java), p5.js (Javascript), and Processing.py (Python). There is more information about the Foundation at http://foundation.processing.org/.
+The primary charge of the Foundation is to develop and distribute the Processing software. This includes the original Processing (Java), p5.js (Javascript), and Processing.py (Python). There is more information about the Foundation at https://processingfoundation.org/.
History
- Processing was started by Ben Fry and Casey Reas in the spring of 2001, while both were graduate students at the MIT Media Lab within John Maeda's Aesthetics and Computation research group. Development continued in their free time while Casey pursued his artistic and teaching career and Ben pursued a Ph.D. and founded Fathom Information Design. Many of the ideas in Processing go back to Muriel Cooper's Visual Language Workshop, and it grew directly out of Maeda's Design By Numbers project, developed at the Media Lab and released in 1999. The Wiring and Arduino projects, in turn, grew out of Processing while Casey was teaching at the Interaction Design Institute Ivrea in Italy. Processing also prompted John Resig (jQuery) to build Processing.js, a JavaScript version that then inspired more related work such as the Khan Academy curriculum in computer science. Versions of Processing that use Python, Ruby, ActionScript, and Scala are also in development. Processing and its sister projects have inspired over twenty educational books.
+ Processing was started by Ben Fry and Casey Reas in the spring of 2001, while both were graduate students at the MIT Media Lab within John Maeda's Aesthetics and Computation research group. Development continued in their free time while Casey pursued his art and teaching career and Ben pursued a Ph.D. and founded Fathom Information Design. Many of the ideas in Processing go back to Muriel Cooper's Visual Language Workshop, and it grew directly out of Maeda's Design By Numbers project, developed at the Media Lab and released in 1999. The Wiring and Arduino projects, in turn, grew out of Processing while Casey was teaching at the Interaction Design Institute Ivrea in Italy.
+
For more information, please write to foundation@processing.org
diff --git a/content/static/people.html b/content/static/people.html
index ed14bc057..d406b648c 100755
--- a/content/static/people.html
+++ b/content/static/people.html
@@ -6,78 +6,57 @@
People. Processing is a comm
- Lead Developers
+ Project Leads
Ben Fry and Casey Reas
started Processing in Spring 2001 and continue to obsessively work on it. In 2012, they started the Processing Foundation along with Dan Shiffman, who formally joined as a third project lead.
- Senior Developers
- Andres Colubri (Boston), OpenGL / Video
- Florian Jenett (Frankfurt), Forum
- Elie Zananiri (Montreal), Contributed Libraries / Tools
- Scott Murray (San Francisco), Website / Reference / UI
+ Developers
+ Andres Colubri (Boston), OpenGL / Video
+ Elie Zananiri (New York), Contributed Libraries / Tools
+ Samuel Pottinger (San Francisco), Processing Core
-
+
-
+
Libraries, Tools
- The core Processing software is augmented by libraries and tools contributed through the community.
- These inventive extensions are a bright future for the project. We have a list of
- Contributed Libraries and
+ The core Processing software is augmented by libraries and tools contributed through
+ the community. These inventive extensions are a bright future for the project. We have a
+ list of Contributed Libraries and
Contributed Tools posted online.
- These contributions can't be underestimated. For example, see how
- Karsten Schmidt (London) has transformed Processing
- through the toxiclibs library and how
- Damien Di Fede (Austin) has extended the project
- into programming sound through his minim
- library.
-
-
-
-
-
- Fellowship Alumni
- Lauren McCarthy (New York), Spring/Summer/Fall 2013
- Greg Borenstein (New York), Spring/Summer 2013
- Wilm Thoben (Los Angeles), Fall 2013/Winter 2014
+ These contributions can't be underestimated. For example, see how Karsten Schmidt (London) has
+ transformed Processing through the toxiclibs library and how Damien Di Fede (Austin) has extended
+ the project into programming sound through his minim library.
- Developer Alumni
+ Alumni
+ Jakub Valtar (Brno), Processing Core
+ Scott Garner (New York), Hello Processing Website
+ Scott Murray (San Francisco), Website / Reference / UI
+ Gottfried Haider (Los Angeles), Processing for Pi
+ Florian Jenett (Frankfurt), Forum
+ Jamie Kosoy (San Francisco), Website
+ Manindra Moharana (San Diego), PDE / Core
+ James Grady (Boston), Visual Design
+
+
Patrick Hebron, Video Library (Summer 2011)
Peter Kalauskas, Library/Tool/Mode Install Utility (Summer, Fall 2011)
Andreas Schlegel, Libraries (Winter 2008 - Summer 2011)
Harshani Nawarathna, Processing Development Environment (Summer 2011)
Cindy Chi, Reference Editing (Summer 2011)
- Jonathan Feinberg, Parsing & Android Hacking (Spring 2011)
+ Jonathan Feinberg, Parsing & Android Hacking (Spring 2011)
Chris Lonnen, Processing Development Environment (Summer 2011)
Eric Jordan, Graphics Weapon (2007 - 2009)
Tom Carden, Processing Hacks Director (Summer 2005 - Fall 2008)
@@ -132,13 +111,9 @@
People. Processing is a comm
Burak Arikan, Turkish
-
-
-
-
We offer a special "Thank You!" to Sami Arola for writing the base of the original P3D
- and Simon Greenwold for incorporting camera and lights. Tom Carden contributed great
+ and Simon Greenwold for incorporating camera and lights. Tom Carden contributed great
energy by co-creating Processing Hacks and maintaining Processing Blogs. Andreas Schlegel
did amazing work for over three years organizing the Contributed Libraries and building
templates and documentation.
diff --git a/content/static/shop/index.html b/content/static/shop/index.html
index 64177106e..bcfd0ba95 100644
--- a/content/static/shop/index.html
+++ b/content/static/shop/index.html
@@ -114,7 +114,7 @@
If you're interested in buying a book about Processing,
Learning Processing, Second Edition: A Beginner's Guide to Programming Images, Animation, and Interaction
Daniel Shiffman
» More info
- » Order from Amazon.com
+ » Order from Amazon.com
diff --git a/content/static/support.html b/content/static/support.html
new file mode 100644
index 000000000..2a8f77f05
--- /dev/null
+++ b/content/static/support.html
@@ -0,0 +1,48 @@
+
+
+
+ We need your help! Please support Processing by making a donation to the Processing Foundation. Your donation contributes to software development, education resources like code examples and tutorials, Fellowships, and community events.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ The Processing Foundation was established in 2012 after more than a decade of work with the Processing software. The Foundation’s mission is to promote software literacy within the visual arts, and visual literacy within technology-related fields — and to make these fields accessible to diverse communities. Our goal is to empower people of all interests and backgrounds to learn how to program and make creative work with code, especially those who might not otherwise have access to these tools and resources. You can read more about the history of Processing in the short essay "A Modern Prometheus."
+
diff --git a/content/static/tutorials/anatomy/index.html b/content/static/tutorials/anatomy/index.html
index 39423e74e..6fe27c928 100644
--- a/content/static/tutorials/anatomy/index.html
+++ b/content/static/tutorials/anatomy/index.html
@@ -61,7 +61,7 @@ Step 2: Some basic trigonometry
So, if you have a line of length r starting at (0,0) at an angle theta (θ), what are its coordinates in terms of x and y? If you know a little bit of
trigonometry, the answer is that the endpoint of the line is at (r cos θ, r sin θ). If you don’t
know trigonometry, take a look at this tutorial (a general and very light introduction to
- trigonometry), this tutorial (oriented towards Processing), and this example from chapter 13 of Learning Processing. In the following diagram, angles are drawn clockwise, which is how they are measured in Processing.
+ trigonometry), this tutorial (oriented towards Processing), and this example from chapter 13 of Learning Processing. In the following diagram, angles are drawn clockwise, which is how they are measured in Processing.
diff --git a/content/static/tutorials/android/index.html b/content/static/tutorials/android/index.html
index f339fd9ba..75a355092 100644
--- a/content/static/tutorials/android/index.html
+++ b/content/static/tutorials/android/index.html
@@ -121,7 +121,7 @@ Step Three: Running the App on a Device
Some helpful tips when you’re working with Processing & Android:
- I know I’ve said this before, but be patient. Canceling a process (ie. the emulator load or a device compile) can cause problems. If you do this inadvertently, you’re best off restarting Processing.
- - Make sure to check out the Processing Android Wiki, where you’ll find some troubleshooting advice, and some tips on how to get your sketches working properly on your device.
+ - Make sure to check out the Processing Android Wiki, where you’ll find some troubleshooting advice, and some tips on how to get your sketches working properly on your device.
This tutorial is for Processing version 2.0+. If you see any errors or have comments, please let us know. This tutorial is adapted from 'Processing & Android: Mobile App Development Made (Very) Easy' by Jer Thorp
diff --git a/content/static/tutorials/arraylist/index.html b/content/static/tutorials/arraylist/index.html
index 613ffee6a..5f24a6ad5 100644
--- a/content/static/tutorials/arraylist/index.html
+++ b/content/static/tutorials/arraylist/index.html
@@ -1,4 +1,4 @@
-In truth, we could use a simple array to manage our Particle objects. Some particle systems might have a fixed number of particles, and arrays are magnificently efficient in those instances. Processing also offers expand(), contract(), subset(), splice() and other methods for resizing arrays. However, for these examples, the Java class ArrayList (found in the java.util package: http://download.oracle.com/javase/6/docs/api/java/util/ArrayList.html) will prove to be the best solution.
Using an ArrayList is conceptually similar to a standard array, but the syntax is different. Here is some code (that assumes the existence of a generic Particle class) demonstrating identical results: first with an array, and second with an ArrayList.
+In truth, we could use a simple array to manage our Particle objects. Some particle systems might have a fixed number of particles, and arrays are magnificently efficient in those instances. Processing also offers expand(), contract(), subset(), splice() and other methods for resizing arrays. However, for these examples, the Java class ArrayList (found in the java.util package: https://docs.oracle.com/javase/8/docs/api/java/util/ArrayList.html) will prove to be the best solution.
Using an ArrayList is conceptually similar to a standard array, but the syntax is different. Here is some code (that assumes the existence of a generic Particle class) demonstrating identical results: first with an array, and second with an ArrayList.
// THE STANDARD ARRAY WAY
int total = 10;
diff --git a/content/static/tutorials/color/imgs/grayscale.svg b/content/static/tutorials/color/imgs/grayscale.svg
new file mode 100644
index 000000000..ece2648ff
--- /dev/null
+++ b/content/static/tutorials/color/imgs/grayscale.svg
@@ -0,0 +1,24 @@
+
+
+
+
diff --git a/content/static/tutorials/color/imgs/order.svg b/content/static/tutorials/color/imgs/order.svg
new file mode 100644
index 000000000..38176b1bb
--- /dev/null
+++ b/content/static/tutorials/color/imgs/order.svg
@@ -0,0 +1,20 @@
+
+
+
+
diff --git a/content/static/tutorials/color/index.html b/content/static/tutorials/color/index.html
index 9828644ef..c609f8d15 100644
--- a/content/static/tutorials/color/index.html
+++ b/content/static/tutorials/color/index.html
@@ -13,7 +13,7 @@ Daniel Shiffman
In the digital world, when we want to talk about a color, precision is required. Saying "Hey, can you make that circle bluish-green?" will not do. Color, rather, is defined as a range of numbers. Let's start with the simplest case: black & white or grayscale. 0 means black, 255 means white. In between, every other number—50, 87, 162, 209, and so on—is a shade of gray ranging from black to white.
- 
+ 
Does 0-255 seem arbitrary to you?
@@ -40,7 +40,7 @@
Daniel Shiffman
In addition, if we draw two shapes, Processing will always use the most recently specified stroke and fill, reading the code from top to bottom.
- 
+ 
@@ -66,7 +66,7 @@ RGB Color
-
+ Example: RGB color
background(255);
@@ -109,7 +109,7 @@ Color Transparency
-
+ Example: Alpha transparency
size(200,200);
diff --git a/content/static/tutorials/data/imgs/data_03_table.png b/content/static/tutorials/data/imgs/data_03_table.png
index d0ff43b2d..961ac434c 100644
Binary files a/content/static/tutorials/data/imgs/data_03_table.png and b/content/static/tutorials/data/imgs/data_03_table.png differ
diff --git a/content/static/tutorials/data/imgs/data_04_excel.jpg b/content/static/tutorials/data/imgs/data_04_excel.jpg
index 1406af987..c004098da 100755
Binary files a/content/static/tutorials/data/imgs/data_04_excel.jpg and b/content/static/tutorials/data/imgs/data_04_excel.jpg differ
diff --git a/content/static/tutorials/data/imgs/data_06_xml.jpg b/content/static/tutorials/data/imgs/data_06_xml.jpg
index 7a1a18035..10cadd588 100755
Binary files a/content/static/tutorials/data/imgs/data_06_xml.jpg and b/content/static/tutorials/data/imgs/data_06_xml.jpg differ
diff --git a/content/static/tutorials/data/imgs/data_07_weatherxml.jpg b/content/static/tutorials/data/imgs/data_07_weatherxml.jpg
index bc65c1042..e0de2e503 100755
Binary files a/content/static/tutorials/data/imgs/data_07_weatherxml.jpg and b/content/static/tutorials/data/imgs/data_07_weatherxml.jpg differ
diff --git a/content/static/tutorials/data/imgs/fig_18_01_user_input.png b/content/static/tutorials/data/imgs/fig_18_01_user_input.png
new file mode 100755
index 000000000..e4b8f4797
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_01_user_input.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_02_filetxt.png b/content/static/tutorials/data/imgs/fig_18_02_filetxt.png
new file mode 100755
index 000000000..2e82a2f1d
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_02_filetxt.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_03_datatxt.png b/content/static/tutorials/data/imgs/fig_18_03_datatxt.png
new file mode 100755
index 000000000..33a877bcb
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_03_datatxt.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_04_bargraph.png b/content/static/tutorials/data/imgs/fig_18_04_bargraph.png
new file mode 100755
index 000000000..ef797f982
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_04_bargraph.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_05_datacsv.png b/content/static/tutorials/data/imgs/fig_18_05_datacsv.png
new file mode 100755
index 000000000..6c75a3c9c
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_05_datacsv.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png b/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png
new file mode 100755
index 000000000..77de335e7
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png b/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png
new file mode 100755
index 000000000..64a8e5f79
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_08_rollover.png b/content/static/tutorials/data/imgs/fig_18_08_rollover.png
new file mode 100644
index 000000000..7b823a954
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_08_rollover.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png b/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png
new file mode 100755
index 000000000..8d5398cf2
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png b/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png
new file mode 100755
index 000000000..b4456ba92
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png b/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png
new file mode 100755
index 000000000..61acef65d
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png b/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png
new file mode 100644
index 000000000..402f9e213
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png b/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png
new file mode 100644
index 000000000..82fe0b68f
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png b/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png
new file mode 100755
index 000000000..f60db5375
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png b/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png
new file mode 100755
index 000000000..8535f1b6e
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_16_rss.png b/content/static/tutorials/data/imgs/fig_18_16_rss.png
new file mode 100755
index 000000000..1bdb2d482
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_16_rss.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_17_weather.png b/content/static/tutorials/data/imgs/fig_18_17_weather.png
new file mode 100755
index 000000000..f379ab30f
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_17_weather.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png b/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png
new file mode 100755
index 000000000..b58ced2a2
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_19_thread.png b/content/static/tutorials/data/imgs/fig_18_19_thread.png
new file mode 100755
index 000000000..f79c43d28
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_19_thread.png differ
diff --git a/content/static/tutorials/data/index-old.html b/content/static/tutorials/data/index-old.html
new file mode 100644
index 000000000..6221a4a80
--- /dev/null
+++ b/content/static/tutorials/data/index-old.html
@@ -0,0 +1,527 @@
+
+
+
+
+
+ This tutorial is from the book Learning Processing by Daniel Shiffman, published by Morgan Kaufmann, © 2008 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know.
+
+
+ Data
+ Daniel Shiffman
+
+
+
+ This tutorial picks up where the Strings and Drawing Text tutorial leaves off and examines how to use String objects as the basis for reading and writing data. We'll start by learning more sophisticated methods for manipulating Strings, searching in them, chopping them up, and joining them together. Afterwards, we'll see how these skills allow us to use input from data sources, such as text files, web pages, xml feeds, and 3rd party APIs and take a step into the world of data visualization.
+
+
+ Manipulating Strings
+
+
+ In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String class, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API.
+
+
+
+ Let's take a closer look at the following two String functions: indexOf() and substring(). indexOf() locates a sequence of characters within a String. It takes one argument, a search String, and returns a numeric value that corresponds to first occurrence of the search string inside of the string being searched.
+
+
+
+String search = "def";
+String toBeSearched = "abcdefghi";
+int index = toBeSearched.indexOf(search); // The value of index in this example is 3.
+
+
+
+ Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value and therefore can indicate "not found." After finding a search phrase within a String, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as "substring." The substring() function which takes two arguments, a start index and an end index and returns the substring in between the two indices.
+
+
+
+String alphabet = "abcdefghi";
+String sub = alphabet.substring(3,6); // The String sub is now "def".
+
+
+Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know. I know. Wouldn't it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it's actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index.
+
+Splitting and Joining Strings
+
+In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard. Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, we will often be presented that data in the form of an array of strings or as one long string. Depending on what we want to accomplish, it's useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy.
+
+"one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"}
+
+Let's take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the string to be split and the delimiter. (The delimiter can be a single character or a string. Note that in the code below the period is not set as a delimiter and therefore will be included in the last string in the array: "dog."
+
+
+// Splitting a String based on spaces
+String spaceswords = "The quick brown fox jumps over the lazy dog.";
+String[] list = split(spaceswords, " ");
+for (int i = 0; i < list.length; i++) {
+ println(list[i] + " " + i);
+}
+
+
+If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically to split() with one exception: any character that appears in the String qualifies as a delimiter. In the code below, the period is set as a delimiter and therefore will not be included in the last spot in the array: "dog"
+
+
+// Splitting a String based on a multiple delimiters
+String stuff = "hats & apples, cars + phones % elephants dog.";
+String[] list = splitTokens(stuff, " &,+.");
+for (int i = 0; i < list.length; i++) {
+ println(list[i] + " " + i);
+}
+
+
+If we are splitting numbers in a String the resulting array can be converted into an integer array with Processing's int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless we convert them first.
+
+
+// Calculate sum of a list of numbers in a String
+String numbers = "8,67,5,309";
+// Converting the String array to an int array
+int[] list = int(split(numbers, ','));
+int sum = 0;
+for (int i = 0; i < list.length; i++) {
+ sum = sum + list[i];
+}
+println(sum);
+
+
+The reverse of split() is join(). join() takes an array of Strings and joins them together into one long string. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a String of characters.
+
+Consider the following array:
+
+
+String[] lines = {"It", "was", "a", "dark", "and", "stormy", "night."};
+
+
+Using the + operator along with a for loop, we can join an array of strings together as follows:
+
+
+// Manual Concatenation
+String onelongstring = "";
+for (int i = 0; i < lines.length; i++) {
+ onelongstring = onelongstring + lines[i] + " ";
+}
+
+
+The join() function, however, allows us to bypass this process achieving the same result in only one line of code.
+
+
+// Using Processing's join()
+String onelongstring = join(lines," ");
+
+
+Reading and Writing Text Files
+
+Data can come from many different places: web sites, news feeds, databases, etc. To start, we'll demonstrate how to work with the simplest means of data retrieval data: reading from a text file.Text files can be used as a very simple database (we could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source.
+
+In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OSX TextEdit will do, just make sure you format the file as "plain text." It is also advisable to name the text files with the ".txt" extension, just to avoid any confusion. And just as with image files, these text files should be placed in the sketch's "data" directory in order for them to be recognized by the Processing sketch.
+
+Once the text file is in place, Processing's loadStrings() function is used to read the content of the file into an String array. The individual lines of text in the file each become an individual element in the array.
+
+
+
+
+// This code will print all the lines from the source text file.
+String[] lines = loadStrings("file.txt");
+println("there are " + lines.length + " lines");
+println(lines);
+
+
+Text from a file can be used to generate a simple visualization. Take the following data file.
+
+
+
+Here, we can load the numbers separated by commas and split them into an array of ints used to set color and height of rectangles.
+
+
+int[] data;
+
+void setup() {
+ size(200,200);
+ // Load text file as a string
+ String[] stuff = loadStrings("data.txt");
+ // Convert string into an array of integers using ',' as a delimiter
+ data = int(split(stuff[0],','));
+}
+
+void draw() {
+ background(255);
+ stroke(0);
+ for (int i = 0; i < data.length; i++) {
+ fill(data[i]);
+ rect(i*20,0,20,data[i]);
+ }
+}
+
+
+Text can also be written back to a data file with saveStrings(). saveStrings() writes an array of strings to a file, one line per string.
+
+
+String words = "apple bear cat dog";
+String[] list = split(words, ' ');
+
+// Writes the strings to a file, each on a separate line
+saveStrings("nouns.txt", list);
+
+
+There are cases, however, where you don't want to write a text file all at once. Rather, you want to continuously append to a file over time. This can be achieved with the PrintWriter class. Take the following example which writes saves mouseX and mouseY to a text file for each cycle through draw(), quitting when you press a key.
+
+
+PrintWriter output;
+
+void setup() {
+ // Create a new file in the sketch directory
+ output = createWriter("positions.txt");
+}
+
+void draw() {
+ point(mouseX, mouseY);
+ output.println(mouseX); // Write the coordinate to the file
+}
+
+void keyPressed() {
+ output.flush(); // Writes the remaining data to the file
+ output.close(); // Finishes the file
+ exit(); // Stops the program
+}
+
+
+Tabular Data
+
+You may have noticed that the graphing example above loads a text file with numbers separated by commas. Processing includes a Table class which will load a comma-separated (CSV) or tab-separated (TSV) file and automatically parse the data into columns and rows for you. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like:
+
+
+
+Instead of saying:
+
+
+String[] stuff = loadStrings("data.csv");
+
+
+We can now say:
+
+
+Table table = loadTable("data.csv");
+
+
+Now we've missed an important detail. Take a look at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a "header row." This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header" there are other options you can specify. For example if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page.
+
+
+Table table = loadTable("data.csv","header");
+
+
+Now that the table is loaded, we can look at how we grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid.
+
+
+
+In the above grid we can see that the data is organized in terms of rows and columns. One way to access the data would be to therefore request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x, y) location though in this case the y position (i.e. row) comes first. The following code requests a piece of data at a given (row, column) location.
+
+
+int val1 = table.getInt(2, 1); // val now has the value 235
+float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068
+String s = table.getString(0, 3); // s now has the value "Happy"
+
+
+While the numeric index is sometimes useful, it's generally going to be more convenient to access each piece of data by the column name. For example, we could pull out a specific row from the Table.
+
+
+TableRow row = table.getRow(2); // Gets the third row (index 2)
+
+
+Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table.
+
+Once we have the TableRow object, we can ask for data from some or all of the columns.
+
+
+int x = row.getInt("x"); // x has the value 273
+int y = row.getInt("y"); // y has the value 235
+float d = row.getFloat("diameter"); // d has the value 61.14072
+String s = row.getString("name"); // s has the value "Joyous"
+
+
+The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so with the method rows().
+
+
+for (TableRow row : table.rows()) {
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+ // Do something with the data of each row
+}
+
+
+If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows().
+
+In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString().
+
+
+// Update the value of column "x" to mouseX in a given TableRow.
+row.setInt("x",mouseX);
+
+
+To add a new row to a Table, simply call the method addRow() and set the values of each column.
+
+
+// Create a new row
+TableRow row = table.addRow();
+// Set the values of that row
+row.setFloat("x", mouseX);
+row.setFloat("y", mouseY);
+row.setFloat("diameter", random(40, 80));
+row.setString("name", "new label");
+
+
+To delete a row to a Table, simply call the method removeRow() and pass in the numeric index of the row you would like removed. The following code for example, removes the first row whenever the size of the table is greater than ten rows.
+
+
+// If the table has more than 10 rows
+if (table.getRowCount() > 10) {
+ // Delete the first row
+ table.removeRow(0);
+}
+
+
+For an example that creates objects from and saves objects to a Table, take a look at LoadSaveTable under Topics --> Advanced Data.
+
+XML Data
+
+For grabbing data from the web, an XML (Extensible Markup Language) feed is an excellent option (if available). Unlike HTML (which is designed to make content vieweable by a human's eyes) XML is designed to make content viewable by a computer and facilitate the sharing of data across different systems.
+
+XML organizes information in a tree structure. Let's imagine a list of students. Each student has an id number, name, address, e-mail, and telephone number. Each student's address has a city, state, and zip code. An XML tree for this dataset might look like the following:
+
+
+
+
+<?xml version="1.0" encoding="UTF-8"?>
+<students>
+ <student>
+ <id>001</id>
+ <name>Daniel Shiffman</name>
+ <phone>555-555-5555</phone>
+ <email>daniel@shiffman.net</email>
+ <address>
+ <street>123 Processing Way</street>
+ <city>Loops</city>
+ <state>New York</state>
+ <zip>01234</zip>
+ </address>
+ </student>
+ <student>
+ <id>002</id>
+ <name>Zoog</name>
+ <phone>555-555-5555</phone>
+ <email>zoog@planetzoron.uni</email>
+ <address>
+ <street>45.3 Nebula 5</street>
+ <city>Boolean City</city>
+ <state&tt;Booles</state>
+ <zip>12358</zip>
+ </address>
+ </student>
+</students>
+
+
+Note the similarities to object-oriented programming. We could think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an id, a name, a phone number, an e-mail address, and a mailing address. The mailing address is also an object that also has multiple pieces of data, such as street, city, state, and zip.
+
+Let's look at Yahoo's XML feed for weather data. Here is the raw XML source (Note I have edited it for simplification purposes).
+
+
+<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
+<rss version="2.0" xmlns:yweather="http://xml.weather.yahoo.com/ns/rss/1.0">
+ <channel>
+ <item>
+ <title>Conditions for New York, NY at 3:51 pm EST</title>
+ <geo:lat>40.67</geo:lat>
+ <geo:long>-73.94</geo:long>
+ <link>http://xml.weather.yahoo.com/forecast/USNY0996_f.html</link>
+ <pubDate>Mon, 20 Feb 2006 3:51 pm EST</pubDate>
+ <yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/>
+ <yweather:forecast day="Mon" date="20 Feb 2006" low="25" high="37" text="Clear" code="31"/>
+ </item>
+ </channel>
+</rss>
+
+
+And here is the data mapped in the tree structure.
+
+
+
+You may be wondering what the top level "RSS" is all about. Yahoo's XML weather data is provided in RSS format. RSS stands for "Really Simple Syndication" and is a standardized XML format for syndicating web content (such as news articles, etc.)
+
+Now that we have a handle on the tree structure, we should look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, i.e. <channel> and an end tag, i.e. </channel>. Some of these elements have content between the tags:
+
+
+<title>Conditions for New York, NY at 3:51 pm EST</title>
+
+
+and some have attributes (formatted by attribute name equals attribute value in quotes):
+
+
+<yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/>
+
+
+Knowing this format, we could certainly be clever with our use of split(), indexOf(), and substring() to find the pieces we want in the raw XML. The point here, however, is that because XML is a standard format, we don't have to do this. Rather, we can use an XML parser. In Processing, the XML parser is called just that: XML.
+
+
+XML xml = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003");
+
+
+Here, instead of loadStrings() or loadTable(), we're now calling loadXML() and passing in the address (URL or local file) of our XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram, we see that we can find the current temperature via the following path:
+
+
+- The root of the tree is RSS.
+- RSS has a child named channel.
+- Channel has a child named item.
+- Item has a child named yweather:condition.
+- The temperature is stored in yweather:condition as the attribute temp.
+
+
+We could translate the above into code as follows:
+
+
+XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1
+XML channel = root.getChild("channel"); // Step 2
+XML item = channel.getChild("item"); // Step 3
+XML yweather = item.getChild("yweather:condition"); // Step 4
+int temperature = yweather.getInt("temp"); // Step 5
+
+
+This is a bit long-winded, however, and so can be compressed down into one (or three as below) lines of code.
+
+
+XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003); // Step 1
+XML forecast = root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4
+int temperature = forecast.getInt("temp"); // Step 5
+
+
+Finally, the second line of code above can be further condensed to:
+
+
+XML forecast = xml.getChild("channel/item/yweather:condition"); // Steps 2-4
+
+
+It should also be noted that we're accessing the child nodes by their name (i.e. "channel", "item", etc.), but they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children. In LoadSaveTable, we used a series of comma separated values in a text file to store information related to Bubble objects. An XML document can also be used in the same manner. Consider the following XML document:
+
+
+<?xml version="1.0" encoding="UTF-8"?>
+<bubbles>
+ <bubble>
+ <position x="160" y="103"/>
+ <diameter>43.19838</diameter>
+ <label>Happy</label>
+ </bubble>
+ <bubble>
+ <position x="372" y="137"/>
+ <diameter>52.42526</diameter>
+ <label>Sad</label>
+ </bubble>
+ <bubble>
+ <position x="273" y="235"/>
+ <diameter>61.14072</diameter>
+ <label>Joyous</label>
+ </bubble>
+ <bubble>
+ <position x="121" y="179"/>
+ <diameter>44.758068</diameter>
+ <label>Melancholy</label>
+ </bubble>
+</bubbles>
+
+
+In the above XML, the root element is "bubbles" which has four children. Each child "bubble" has 3 children, "position", "diameter", and "label." The "position" element has two attributes, "x" and "y." To access the list of all XML nodes "bubble" we can use the getChildren() method, passing in the name "bubble"
+
+
+// Load an XML document
+XML xml = loadXML("bubbles.xml");
+
+// Get all the child elements
+XML[] children = xml.getChildren("bubble");
+
+
+Once we have the array of XML objects, we can iterate over them, accessing the individual pieces of data for each "bubble". Notice how the syntax for getting XML attributes (in this case, "x" and "y" of the position element is slightly different than pulling content directly from an element (in this case, "diameter" and "label").
+
+
+for (int i = 0; i < bubbles.length; i++) {
+
+ // The position element has two attributes: x and y
+ XML positionElement = children[i].getChild("position");
+ // Note how with attributes we can get an integer or float via getInt() and getFloat()
+ float x = positionElement.getInt("x");
+ float y = positionElement.getInt("y");
+
+ // The diameter is the content of the child named "diamater"
+ XML diameterElement = children[i].getChild("diameter");
+ // Note how with the content of an XML node, we retrieve via getIntContent() and getFloatContent()
+ float diameter = diameterElement.getFloatContent();
+
+ // The label is the content of the child named "label"
+ XML labelElement = children[i].getChild("label");
+ String label = labelElement.getContent();
+}
+
+
+XML elements can be added and removed from the XML tree with the addChild() and removeChild() methods.
+
+For the full example that creates objects from and saves objects to an XML document, take a look at LoadSaveXML under Topics --> Advanced Data.
+
+Threads
+
+You are likely familiar with the idea of writing a program that follows a specific sequence of steps -- setup() first then draw() over and over and over again! A Thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the "Animation" thread. Other threads sequences, however, can run independently of the main Processing sketch. In fact, you can launch any number of threads at one time and they will all run concurrently.
+
+Processing does this all the time, whenever you write an event callback, such as serialEvent(), or captureEvent(), etc. these functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful whenever you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network (XML, database, etc.) If a separate thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread. To create independent, asynchronous threads, you can use the thread() function built into Processing.
+
+
+void setup() {
+ size(200,200);
+ thread("someFunction");
+}
+
+void draw() {
+
+}
+
+void someFunction() {
+ // This function will run as a thread when called via
+ // thread("someFunction") as it was in setup!
+}
+
+
+The thread() function receives a String as an argument. The String should match the name of the function you want to run as a thread. This is especially useful in sketches that grab data for the web. Rather than have the animation freeze while the sketch is waiting to retrieve data, the sketch can continue to loop through draw() updating the data when the thread is completed. In these cases, a boolean variable can be useful to track the status of the thread.
+
+
+boolean loading = false;
+
+
+The function that loads the data can then set loading equal to true at the start and false at the end.
+
+
+void loadData() {
+ loading = true;
+
+ ///////////////////////////////////
+ // All of the data retrival code //
+ ///////////////////////////////////
+
+ loading = false;
+}
+
+
+In draw(), you can choose to display something to indicate the thread is running (when loading equals true).
+
+
+void draw() {
+ if (loading) {
+ // Draw something to indicate loading
+ }
+}
+
+
+
+Two examples that follow this methodology can be found under Topics --> Advanced Data in the Processing examples.
+
+While using the thread() function is a very simple way of getting an independent thread, it should be noted that it is somewhat limited. Being able to make a thread object is a great deal more powerful, and this can be done by extending the Java Thread class.
+
+
+
+
+
+
diff --git a/content/static/tutorials/data/index.html b/content/static/tutorials/data/index.html
index 0df744e1b..ebafcce92 100644
--- a/content/static/tutorials/data/index.html
+++ b/content/static/tutorials/data/index.html
@@ -3,7 +3,7 @@
- This tutorial is from the book Learning Processing by Daniel Shiffman, published by Morgan Kaufmann, © 2008 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know.
+ This tutorial is from the book Learning Processing, 2nd Edition by Daniel Shiffman, published by Morgan Kaufmann, © 2015 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know.
Data
@@ -17,281 +17,771 @@ Daniel Shiffman
Manipulating Strings
- In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String class, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API.
-
-
-
- Let's take a closer look at the following two String functions: indexOf() and substring(). indexOf() locates a sequence of characters within a String. It takes one argument, a search String, and returns a numeric value that corresponds to first occurrence of the search string inside of the string being searched.
-
-
+ In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API.
+
+ Let's take a closer look at the following two String functions: indexOf() and substring().
+ indexOf() locates a sequence of characters within a string. It takes one argument — a search string — and returns a numeric value that corresponds to the first occurrence of the search string inside of the String object being searched.
String search = "def";
String toBeSearched = "abcdefghi";
int index = toBeSearched.indexOf(search); // The value of index in this example is 3.
-
- Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value and therefore can indicate "not found." After finding a search phrase within a String, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as "substring." The substring() function which takes two arguments, a start index and an end index and returns the substring in between the two indices.
-
-
+ Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value in the string itself, and therefore can indicate "not found." There are no negative indices in a string of characters or in an array.
+
+ After finding a search phrase within a string, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as a substring and substrings are made with the substring() function which takes two arguments, a start index and an end index. substring() returns the substring in between the two indices.
+
String alphabet = "abcdefghi";
-String sub = alphabet.substring(3,6); // The String sub is now "def".
+String sub = alphabet.substring(3, 6); // The String sub is now "def".
-
-Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know. I know. Wouldn't it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it's actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index.
+ Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know, I know. Wouldn’t it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it’s actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index.
+
Splitting and Joining Strings
-In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard. Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, we will often be presented that data in the form of an array of strings or as one long string. Depending on what we want to accomplish, it's useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy.
-
-"one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"}
-
-Let's take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the string to be split and the delimiter. (The delimiter can be a single character or a string. Note that in the code below the period is not set as a delimiter and therefore will be included in the last string in the array: "dog."
-
+
+ In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard.
+
+
+
+PFont f;
+
+// Variable to store text currently being typed
+String typing = "";
+// Variable to store saved text when return is hit
+String saved = "";
+
+void setup() {
+ size(300, 200);
+ f = createFont("Arial", 16);
+}
+
+void draw() {
+ background(255);
+ int indent = 25;
+
+ // Set the font and fill for text
+ textFont(f);
+ fill(0);
+
+ // Display everything
+ text("Click in this sketch and type. \nHit return to save what you typed.", indent, 40);
+ text(typing, indent, 90);
+ text(saved, indent, 130);
+}
+
+void keyPressed() {
+ // If the return key is pressed, save the String and clear it
+ if (key == '\n') {
+ saved = typing;
+ typing = "";
+ // Otherwise, concatenate the String
+ } else {
+ typing = typing + key;
+ }
+}
+
+ Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, you might get hold of that data in the form of an array of strings or as one long string. Depending on what you want to accomplish, it’s useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy.
+
+
+ "one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"}
+
+
+ Let’s take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the String object to be split and the delimiter. (The delimiter can be a single character or a string.) In the code below, the period is not set as a delimiter and therefore will be included in the last string in the array: “dog.” Note how printArray() can be used to print the contents of an array and their corresponding indices to the message console.
-// Splitting a String based on spaces
+// Splitting a string based on spaces
String spaceswords = "The quick brown fox jumps over the lazy dog.";
String[] list = split(spaceswords, " ");
-for (int i = 0; i < list.length; i++) {
- println(list[i] + " " + i);
-}
+printArray(list);
-
-If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically to split() with one exception: any character that appears in the String qualifies as a delimiter. In the code below, the period is set as a delimiter and therefore will not be included in the last spot in the array: "dog"
-
+ Here is an example using a comma as the delimiter (this time passing in a single character: ','.)
+
-// Splitting a String based on a multiple delimiters
-String stuff = "hats & apples, cars + phones % elephants dog.";
-String[] list = splitTokens(stuff, " &,+.");
-for (int i = 0; i < list.length; i++) {
- println(list[i] + " " + i);
-}
+// Splitting a string based on commas
+String commaswords = "The,quick,brown,fox,jumps,over,the,lazy,dog.";
+String[] list = split(commaswords, ",");
+printArray(list);
-
-If we are splitting numbers in a String the resulting array can be converted into an integer array with Processing's int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless we convert them first.
-
+ If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically as split() with one exception: any character that appears in the passed string qualifies as a delimiter.) In the code below, the period is specified as a delimiter and therefore will not be included in the last string in the array: “dog”.
+
+// Splitting a String based on multiple delimiters
+String stuff = "hats & apples, cars + phones % elephants dog.";
+String[] list = splitTokens(stuff, " &,+." );
+printArray(list);
+
+ If you are splitting numbers in a string, the resulting array can be converted into an integer array with Processing’s int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless you convert them first.
// Calculate sum of a list of numbers in a String
String numbers = "8,67,5,309";
// Converting the String array to an int array
-int[] list = int(split(numbers, ','));
+int[] list = int(split(numbers, ','));
int sum = 0;
-for (int i = 0; i < list.length; i++) {
+for (int i = 0; i<list.length; i++ ) {
sum = sum + list[i];
}
-println(sum);
+println(sum);
-
-The reverse of split() is join(). join() takes an array of Strings and joins them together into one long string. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a String of characters.
-
-Consider the following array:
-
+ The reverse of split() is join(). join() takes an array of strings and joins them together into one long String object. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a string of characters.
+
+
+
+ Consider the following array:
String[] lines = {"It", "was", "a", "dark", "and", "stormy", "night."};
-
-Using the + operator along with a for loop, we can join an array of strings together as follows:
-
+ Using the “+” operator along with a for loop, you can join a string together as follows:
// Manual Concatenation
String onelongstring = "";
for (int i = 0; i < lines.length; i++) {
- onelongstring = onelongstring + lines[i] + " ";
+ onelongstring = onelongstring + lines[i] + " ";
}
-
-The join() function, however, allows us to bypass this process achieving the same result in only one line of code.
-
+ The join() function, however, allows you to bypass this process, achieving the same result in only one line of code.
// Using Processing's join()
-String onelongstring = join(lines," ");
+String onelongstring = join(lines, " ");
+
-Reading and Writing Text Files
+Dealing with Data
-Data can come from many different places: web sites, news feeds, databases, etc. To start, we'll demonstrate how to work with the simplest means of data retrieval data: reading from a text file.Text files can be used as a very simple database (we could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source.
-
-In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OSX TextEdit will do, just make sure you format the file as "plain text." It is also advisable to name the text files with the ".txt" extension, just to avoid any confusion. And just as with image files, these text files should be placed in the sketch's "data" directory in order for them to be recognized by the Processing sketch.
-
-Once the text file is in place, Processing's loadStrings() function is used to read the content of the file into an String array. The individual lines of text in the file each become an individual element in the array.
-
-
+
+ Data can come from many different places: websites, news feeds, spreadsheets, databases, and so on. Let's say you've decided to make a map of the world's flowers. After searching online you might find a PDF version of a flower encyclopedia, or a spreadsheet of flower genera, or a JSON feed of flower data, or a REST API that provides geolocated lat/lon coordinates, or some web page someone put together with beautiful flower photos, and so on and so forth. The question inevitably arises: “I found all this data; which should I use, and how do I get it into Processing?”
+
+
+
+ If you are really lucky, you might find a Processing library that hands data to you directly with code. Maybe the answer is to just download this library and write some code like:
+
+import flowers.*;
+void setup() {
+ FlowerDatabase fdb = new FlowerDatabase();
+ Flower sunflower = fdb.findFlower("sunflower");
+ float h = sunflower.getAverageHeight();
+}
+
+ In this case, someone else has done all the work for you. They've gathered data about flowers and built a Processing library with a set of functions that hands you the data in an easy-to-understand format. This library, sadly, does not exist (not yet), but there are some that do. For example, YahooWeather is a library by Marcel Schwittlick that grabs weather data from Yahoo for you, allowing you to write code like weather.getWindSpeed() or weather.getSunrise() and more. There is still plenty of work to do in the case of using a library.
+
+
+
+ Let's take another scenario. Say you’re looking to build a visualization of Major League Baseball statistics. You can't find a Processing library to give you the data but you do see everything you’re looking for at mlb.com. If the data is online and your web browser can show it, shouldn't you be able to get the data in Processing? Passing data from one application (like a web application) to another (say, your Processing sketch) is something that comes up again and again in software engineering. A means for doing this is an API or “application programming interface”: a means by which two computer programs can talk to each other. Now that you know this, you might decide to search online for “MLB API”. Unfortunately, mlb.com does not provide its data via an API. In this case you would have to load the raw source of the website itself and manually search for the data you’re looking for. While possible, this solution is much less desirable given the considerable time required to read through the HTML source as well as program algorithms for parsing it.
+
+
+
+ Each means of getting data comes with its own set of challenges. The ease of using a Processing library is dependent on the existence of clear documentation and examples. But in just about all cases, if you can find your data in a format designed for a computer (spreadsheets, XML, JSON, etc.), you'll be able to save some time in the day for a nice walk outside.
+
+
+
+ One other note worth a mention about working with data. When developing an application that involves a data source, such as a data visualization, it’s sometimes useful to develop with “dummy” or “fake” data. You don't want to be debugging your data retrieval process at the same time as solving problems related to algorithms for drawing. In keeping with my one-step-at-a-time mantra, once the meat of the program is completed with dummy data, you can then focus solely on how to retrieve the actual data from the real source. You can always use random or hard-coded numbers into your code when you’re experimenting with a visual idea and connect the real data later.
+
+Working with Text Files
+
+
+ Let's begin by working with the simplest means of data retrieval: reading from a text file. Text files can be used as a very simple database (you could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source.
+
+
+
+ In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OS X TextEdit will do; just make sure you format the file as “plain text.” It is also advisable to name the text files with the “.txt” extension, to avoid any confusion. And just as with image files, these text files should be placed in the sketch’s “data” directory in order for them to be recognized by the Processing sketch.
+
+
+ Once the text file is in place, Processing’s loadStrings() function is used to read the content of the file into a String array. The individual lines of text in the file each become an individual element in the array.
+
+ 
// This code will print all the lines from the source text file.
String[] lines = loadStrings("file.txt");
-println("there are " + lines.length + " lines");
-println(lines);
+println("There are " + lines.length + " lines.");
+printArray(lines);
-
-Text from a file can be used to generate a simple visualization. Take the following data file.
-
-
-
-Here, we can load the numbers separated by commas and split them into an array of ints used to set color and height of rectangles.
-
+ To run the code, create a text file called “file.txt,” type a bunch of lines in that file, and place it in your sketch’s data directory.
Text from a file can be used to generate a simple visualization. Take the following data file.
+
+ 
+
+The results of visualizing this data are shown below.
+
+
+Graphing Comma-Separated Numbers from a Text File
+
+
int[] data;
void setup() {
- size(200,200);
- // Load text file as a string
- String[] stuff = loadStrings("data.txt");
+ size(200, 200);
+ // Load text file as a String
+ String[] stuff = loadStrings("data.csv");
// Convert string into an array of integers using ',' as a delimiter
- data = int(split(stuff[0],','));
+ data = int(split(stuff[0], ','));
}
void draw() {
background(255);
stroke(0);
- for (int i = 0; i < data.length; i++) {
- fill(data[i]);
- rect(i*20,0,20,data[i]);
+ for (int i = 0; i<data.length; i++) {
+ // Use array of ints to set the color and height of each rectangle.
+ rect(i*20, 0, 20, data[i]);
}
+ noLoop();
}
+ Looking at how to parse a csv file with split() was a nice learning exercise. In truth, dealing with csv files (which can easily be generated from spreadsheet software such as Google docs) is such a common activity that Processing has an entire built-in class called Table to handle the parsing for you.
+
+
+Tabular Data
-Text can also be written back to a data file with saveStrings(). saveStrings() writes an array of strings to a file, one line per string.
+
+ A table consists of data arranged as a set of rows and columns, also called “tabular data.” If you've ever used a spreadsheet, this is tabular data. Processing's loadTable() function takes comma-separated (csv) or tab-separated (tsv) values and automatically places the contents into a Table object storing the data in columns and rows. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like:
+
+
+ 
+
+
+ Instead of saying:
+
+String[] stuff = loadStrings("data.csv");
+
+ We can now say:
+
+Table table = loadTable("data.csv");
+
+ Now I've missed an important detail. Take a look again at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a header row. This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header", there are other options you can specify. For example, if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page.
+
+Table table = loadTable("data.csv", "header");
+
+ Now that the table is loaded, I can show how you grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid.
+
+
+
+ In the above grid you can see that the data is organized in terms of rows and columns. One way to access the data, therefore, would be to request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x,y) location, though in this case the y position (row) comes first. The following code requests a piece of data at a given (row, column) location.
+
+int val1 = table.getInt(2, 1); // val now has the value 235
+float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068
+
+String s = table.getString(0, 3); // s now has the value “Happy”
+
+ While the numeric index is sometimes useful, it’s generally going to be more convenient to access each piece of data by the column name. For example, I could pull out a specific row from the Table.
+
+TableRow row = table.getRow(2); // Gets the third row (index 2)
+
+ Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table.
+
+
+
+ Once I have the TableRow object, I can ask for data from some or all of the columns.
-String words = "apple bear cat dog";
-String[] list = split(words, ' ');
+int x = row.getInt("x"); // // x has the value 273
+
+int y = row.getInt("y"); // y has the value 235
+
+float d = row.getFloat("diameter"); // d has the value 61.14072
-// Writes the strings to a file, each on a separate line
-saveStrings("nouns.txt", list);
+String s = row.getString("name"); // s has the value “Joyous”
+ The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so in a loop with a counter accessing each row one at a time. The total number of available rows can be retrieved with getRowCount().
+
+for (int i = 0; i<table.getRowCount(); i++) {
-There are cases, however, where you don't want to write a text file all at once. Rather, you want to continuously append to a file over time. This can be achieved with the PrintWriter class. Take the following example which writes saves mouseX and mouseY to a text file for each cycle through draw(), quitting when you press a key.
+ // Access each row of the table one at a time, in a loop.
+ TableRow row = table.getRow(i);
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+
+ // Do something with the data of each row
+
+}
+
+ If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows().
+
+
+
+ In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString().
+
+row.setInt("x", mouseX); // Update the value of column "x" to mouseX in a given TableRow.
+
+ To add a new row to a Table, simply call the method addRow() and set the values of each column.
+
+//Create a new row.
+TableRow row = table.addRow();
+//Set the values of all columns in that row.
+row.setFloat("x", mouseX);
+row.setFloat("y", mouseY);
+row.setFloat("diameter", random(40, 80));
+row.setString("name", "new label");
+
+ To delete a row, simply call the method removeRow() and pass in the numeric index of the row you would like removed. For example, the following code removes the first row whenever the size of the table is greater than ten rows.
-PrintWriter output;
+// If the table has more than 10 rows
+if (table.getRowCount()>10) {
+
+//Delete the first row (index 0).
+ table.removeRow(0);
+}
+
+ The following example puts all of the above code together. Notice how each row of the table contains the data for a Bubble object.
+
+
+
+Loading and Saving Tabular Data
+
+
+
+
+
+// The data from the Table object will fill the array of Bubble objects
+Table table;
+Bubble[] bubbles;
void setup() {
- // Create a new file in the sketch directory
- output = createWriter("positions.txt");
+ size(480, 360);
+ loadData();
}
void draw() {
- point(mouseX, mouseY);
- output.println(mouseX); // Write the coordinate to the file
+ background(255);
+ // Display all bubbles
+ for (int i = 0; i<bubbles.length; i++) {
+ bubbles[i].display();
+ }
}
-void keyPressed() {
- output.flush(); // Writes the remaining data to the file
- output.close(); // Finishes the file
- exit(); // Stops the program
+void loadData() {
+ // "header" indicates the file has header row. The size of the array
+ // is then determined by the number of rows in the table.
+ table = loadTable("data.csv", "header");
+ bubbles = new Bubble[table.getRowCount()];
+
+
+ for (int i = 0; i<table.getRowCount(); i++) {
+ // Iterate over all the rows in a table.
+ TableRow row = table.getRow(i);
+
+
+ // Access the fields via their column name (or index).
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+ // Make a Bubble object out of the data from each row.
+ bubbles[i] = new Bubble(x, y, d, n);
+ }
}
-
-Tabular Data
-You may have noticed that the graphing example above loads a text file with numbers separated by commas. Processing includes a Table class which will load a comma-separated (CSV) or tab-separated (TSV) file and automatically parse the data into columns and rows for you. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like:
+void mousePressed() {
+ // When the mouse is pressed, create a new row and set the values for each column of that row.
+ TableRow row = table.addRow();
+ row.setFloat("x", mouseX);
+ row.setFloat("y", mouseY);
+ row.setFloat("diameter", random(40, 80));
+ row.setString("name", "Blah");
-
+ // If the table has more than 10 rows, delete the oldest row.
+ if (table.getRowCount()>10) {
+ table.removeRow(0);
+ }
-Instead of saying:
+ // This writes the table back to the original CSV file
+ // and reloads the file so that what's drawn matches.
+ saveTable(table, "data/data.csv");
+ loadData();
+}
-
-String[] stuff = loadStrings("data.csv");
+// This simple Bubble class draws a circle to the window
+// and displays a text label when the mouse hovers.
+class Bubble {
+ float x, y;
+ float diameter;
+ String name;
+
+ boolean over = false;
+
+ // Create the Bubble
+ Bubble(float tempX, float tempY, float tempD, String s) {
+ x = tempX;
+ y = tempY;
+ diameter = tempD;
+ name = s;
+ }
+
+ // Checking if mouse is over the bubble
+ void rollover(float px, float py) {
+ float d = dist(px, py, x, y);
+ if (d<diameter/2) {
+ over = true;
+ } else {
+ over = false;
+ }
+ }
+
+ // Display the Bubble
+ void display() {
+ stroke(0);
+ strokeWeight(2);
+ noFill();
+ ellipse(x, y, diameter, diameter);
+ if (over) {
+ fill(0);
+ textAlign(CENTER);
+ text(name, x, y+diameter/2+20);
+ }
+ }
+}
-
-We can now say:
+
+
+ Here, the distance between a given point and a circle's center is compared to that circle's radius as depicted:
+
+
+ 
+
+
+ In the code below, the function returns a boolean value (true or false) depending on whether the point (mx,my) is inside the circle. Notice how radius is equal to half the diameter.
+
-Table table = loadTable("data.csv");
+boolean rollover(int mx, int my) {
+ if (dist(mx, my, x, y)<diameter/2) {
+ return true;
+ } else {
+ return false;
+ }
+}
+
+Data that is not in a Standardized Format
-Now we've missed an important detail. Take a look at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a "header row." This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header" there are other options you can specify. For example if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page.
-
+
+ What if your data is not in a standard format like a table, how do you deal with it then? One of the nice features about loadStrings() is that in addition to pulling text from a file, you can also grab a URL. For example:
-Table table = loadTable("data.csv","header");
+String[] lines = loadStrings("http://www.yahoo.com");
+ When you send a URL path into loadStrings(), you get back the raw HTML (Hypertext Markup Language) source of the requested web page. It’s the same stuff that appears upon selecting “View Source” from a browser’s menu options. You don’t need to be an HTML expert to follow this section, but if you are not familiar at all with HTML, you might want to read http://en.wikipedia.org/wiki/HTML.
+
+
+
+ Unlike with the comma-delimited data from a text file that was specially formatted for use in a Processing sketch, it’s not practical to have the resulting raw HTML stored in an array of strings (each element representing one line from the source). Converting the array into one long string can make things a bit simpler. As you saw earlier in the chapter, this can be achieved using join().
+
+String onelongstring = join(lines, " ");
+
+ When pulling raw HTML from a web page, it’s likely you do not want all of the source, but just a small piece of it. Perhaps you’re looking for weather information, a stock quote, or a news headline. You can take advantage of the text manipulation functions you learned — indexOf(), substring(), and length() — to find pieces of data within a large block of text. Take, for example, the following String object:
+
+String stuff = "Number of apples:62. Boy, do I like apples or what!";
+
+Let’s say I want to pull out the number of apples from the above text. My algorithm would be as follows:
+
+
+ -
+
Find the end of the substring “apples:” Call it start.
+
+ -
+
Find the first period after “apples:” Call it end.
+
+ -
+
Make a substring of the characters between start and end.
+
+ -
+
Convert the string to a number (if I want to use it as such).
+
+
+
+
+ In code, this looks like:
+
+int start = stuff.indexOf("apples:" ) + 7; // STEP 1
+// The index where a string ends can be found by
+// searching for that string and adding its length (here, 8).
+int end = stuff.indexOf(".", start); // STEP 2
+String apples = stuff.substring(start, end); // STEP 3
+int apple_no = int(apples); // STEP 4
+
+ The above code will do the trick, but I should be a bit more careful to make sure I don’t run into any errors if I do not find the string I am searching for. I can add some error checking and generalize the code into a function:
+
+// A function that returns a substring between two substrings.
+// If the beginning of end "tag" is not found, the function returns an empty string.
+String giveMeTextBetween(String s, String startTag, String endTag) {
+ // Find the index of the beginning tag
+ int startIndex = s.indexOf(startTag);
+ // If I don't find anything
+ if (startIndex == -1) {
+ return "";
+ }
+ // Move to the end of the beginning tag
+ startIndex += startTag.length();
-Now that the table is loaded, we can look at how we grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid.
-
-
-
-In the above grid we can see that the data is organized in terms of rows and columns. One way to access the data would be to therefore request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x, y) location though in this case the y position (i.e. row) comes first. The following code requests a piece of data at a given (row, column) location.
-
+ // Find the index of the end tag
+ int endIndex = s.indexOf(endTag, startIndex);
+
+ // If I don't find the end tag,
+ if (endIndex == -1) {
+ return "";
+ }
+ // Return the text in between
+ return s.substring(startIndex, endIndex);
+}
+
+ With this technique, you are ready to connect to a website from within Processing and grab data to use in your sketches. For example, you could read the HTML source from nytimes.com and look for today’s headlines, search finance.yahoo.com for stock quotes, count how many times the word “flower” appears on your favorite blog, and so on. However, HTML is an ugly, scary place with inconsistently formatted pages that are difficult to reverse engineer and parse effectively. Not to mention the fact that companies change the source code of web pages rather often, so any example that I might make while I am writing this paragraph might break by the time you read this paragraph.
+
+
+
+ For grabbing data from the web, an XML (Extensible Markup Language) or JSON (JavaScript Object Notation) feed will prove to be more reliable and easier to parse. Unlike HTML (which is designed to make content viewable by a human’s eyes) XML and JSON are designed to make content viewable by a computer and facilitate the sharing of data across different systems. Most data (news, weather, and more) is available this way, and I will look at examples in #beginner_xml and #JSON. Though much less desirable, manual HTML parsing is still useful for a couple reasons. First, it never hurts to practice text manipulation techniques that reinforce key programming concepts. But more importantly, sometimes there is data you really want that is not available in an API format, and the only way to get it is with such a technique. (I should also mention that regular expressions, an incredibly powerful techinque in text pattern matching, could also be employed here. As much as I love regex, it’s unfortunately beyond the scope of this tutorial.)
+
+
+
+ An example of data only available as HTML is the Internet Movie Database. IMDb contains information about movies sorted by year, genre, ratings, etc. For each movie, you can find the cast and crew list, a plot summary, running time, a movie poster image, the list goes on. However, IMDb has no API and does not provide its data as XML or JSON. Pulling the data into Processing therefore requires a bit of detective work. Let's look at the page for the Shaun the Sheep Movie
+
+
+ 
+
+
+ Looking in the HTML source from the above URL, I find a giant mess of markup.
+
+
+ 
+
+
+ It’s up to me to pore through the raw source and find the data I am looking for. Let's say I want to know the running time of the movie and grab the movie poster image. After some digging, I find that the movie is 139 minutes long as listed in the following HTML.
-int val1 = table.getInt(2, 1); // val now has the value 235
-float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068
-String s = table.getString(0, 3); // s now has the value "Happy"
+<div class="txt-block">
+ <h4 class="inline">Runtime:</h4>
+ <time itemprop="duration" datetime="PT139M">139 min</time>
+</div>
+ For any given movie, the running time itself will be variable, but the HTML structure of the page will stay the same. I can therefore deduce that running time will always appear in between:
+
+<time itemprop="duration" datetime="PT139M">
+
+ and:
+
+</time>
+
+ Knowing where the data starts and ends, I can use giveMeTextBetween() to pull out the running time. A quote in Java marks the beginning or end of a string. So how do you include an actual quote in a String object? The answer is via an “escape” sequence. A quote can be included using a backward slash, followed by a quote. For example: String q = "This String has a quote \"in it";
+
+String url = "http://www.imdb.com/title/tt0058331";
+String[] lines = loadStrings(url);
+// Get rid of the array in order to search the whole page
+String html = join(lines, " ");
-While the numeric index is sometimes useful, it's generally going to be more convenient to access each piece of data by the column name. For example, we could pull out a specific row from the Table.
+// Searching for running time
+String start = "";
+String runningtime = giveMeTextBetween(html, start, end);
+println(runningtime);
+ The following code retrieves both the running time and movie poster iamge from IMDb and displays it onscreen.
+
+
+ Parsing IMDb Manually
+
+ 
+
+String runningtime;
+PImage poster;
-Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table.
+void setup() {
+ size(300, 350);
+ loadData();
+}
-Once we have the TableRow object, we can ask for data from some or all of the columns.
+void draw() {
+ // Display all the stuff I want to display
+ background(255);
+ image(poster, 10, 10, 164, 250);
+ fill(0);
+ text("Shaun the Sheep", 10, 300);
+ text(runningtime, 10, 320);
+}
-
-int x = row.getInt("x"); // x has the value 273
-int y = row.getInt("y"); // y has the value 235
-float d = row.getFloat("diameter"); // d has the value 61.14072
-String s = row.getString("name"); // s has the value "Joyous"
-
+void loadData() {
+ String url = "http://www.imdb.com/title/tt2872750/";
+
+ // Get the raw HTML source into an array of strings (each line is one element in the array).
+ // The next step is to turn array into one long string with join().
+ String[] lines = loadStrings(url);
+ String html = join(lines, "");
+
+ String start = "";
+ runningtime = giveMeTextBetween(html, start, end);Searching for running time.
+
+ start = "";
+ // Search for the URL of the poster image.
+ String imgUrl = giveMeTextBetween(html, start, end);
+ // Now, load that image!
+ poster = loadImage(imgUrl);
+}
-The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so with the method rows().
+String giveMeTextBetween(String s, String before, String after) {
-
-for (TableRow row : table.rows()) {
- float x = row.getFloat("x");
- float y = row.getFloat("y");
- float d = row.getFloat("diameter");
- String n = row.getString("name");
- // Do something with the data of each row
+ // This function returns a substring between two substrings (before and after).
+ // If it can’t find anything it returns an empty string.
+ String found = "";
+
+ // Find the index of before
+ int start = s.indexOf(before);
+ if (start == -1) {
+ return "";
+ }
+
+ // Move to the end of the beginning tag
+ // and find the index of the "after" String
+ start += before.length();
+ int end = s.indexOf(after, start);
+ if (end == -1) {
+ return "";
+ }
+
+ // Return the text in between
+ return s.substring(start, end);
}
-If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows().
-
-In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString().
-
+
Text Analysis
+
+
+ Loading text from a URL need not only be an exercise in parsing out small bits of information. It’s possible with Processing to analyze large amounts of text found on the web from news feeds, articles, and speeches, to entire books. A nice source is Project Gutenberg which makes available thousands of public domain texts. Algorithms for analyzing text merits an entire book itself, but let’s look at some basic techniques.
+
+
+
+ A text concordance is an alphabetical list of words that appear in a book or body of text along with contextual information. A sophisticated concordance might keep a list of where each word appears (like an index) as well as which words appear next to which other words. In this case, I'm going to create a simple concordance, one that simply stores a list of words and their corresponding counts, i.e., how many times they appeared in the text. Concordances can be used for text analysis applications such as spam filtering or sentiment analysis. To accomplish this task, I am going to use the Processing built-in class IntDict.
+
+
+
+ As you learned earlier, an array is an ordered list of variables. Each element of the array is numbered and be accessed by its numeric index.
+
+ 
+
+ However, what if instead of numbering the elements of an array you could name them? This element is named “Sue,” this one “Bob,” this one “Jane,” and so on and so forth. In programming, this kind of data structure is often referred to as an associative array, map, or dictionary. It’s a collection of (key, value) pairs. Imagine you had a dictionary of people's ages. When you look up “Sue” (the key), the definition, or value, is her age, 24.
+
+ 
+
+ Associative arrays can be incredibly convenient for various applications. For example, you could keep a list of student IDs (student name, id) or a list of prices (product name, price) in a dictionary. Here a dictionary is the perfect data structure to hold the concordance. Each element of the dictionary is a word paired with its count.
+
+
+
+ While there are many classes in Java for dealing with advanced data structures like maps, Processing provides you with a set of three built-in dictionary classes that are easy to use: IntDict, FloatDict, and StringDict. In all of these classes, the key is always a string while the value is variable (an integer, floating point number, or String). For the concordance, I'll use an IntDict.
+
+
+
+ Creating an IntDict is as easy as calling an empty constructor. Let's say you want a dictionary to keep track of an inventory of supplies.
-// Update the value of column "x" to mouseX in a given TableRow.
-row.setInt("x",mouseX);
+IntDict inventory = new IntDict();
-
-To add a new row to a Table, simply call the method addRow() and set the values of each column.
-
+ Values can be paired with their keys using the set() method.
-// Create a new row
-TableRow row = table.addRow();
-// Set the values of that row
-row.setFloat("x", mouseX);
-row.setFloat("y", mouseY);
-row.setFloat("diameter", random(40, 80));
-row.setString("name", "new label");
+// set() assigns an integer to a String.
+inventory.set("pencils", 10);
+inventory.set("paper clips", 128);
+inventory.set("pens, 16");
+
+ There are a variety of other methods that can be called to change the value associated with a particular key. For example, if you wanted to add five pencils, you can use add().
+
+inventory.add("pencils", 5); // The value of “pencils” is now 15.
-To delete a row to a Table, simply call the method removeRow() and pass in the numeric index of the row you would like removed. The following code for example, removes the first row whenever the size of the table is greater than ten rows.
-
+ A particularly convenient method for the concordance example is increment() which adds one to a key's value.
-// If the table has more than 10 rows
-if (table.getRowCount() > 10) {
- // Delete the first row
- table.removeRow(0);
-}
+inventory.increment("pens"); // The value of “pencils” is now 16.
+ To retrieve a value associated with a particular key, the get() method is used.
+
+int num = inventory.get("pencils"); // The value of num is 16.
+
+ Finally, dictionaries can be sorted by their keys (alphabetical) or values (smallest to largest or the reverse) with the methods sortKeys(), sortKeysReverse(), sortValues(), and sortValuesReverse().
+
+
+
+ The concordance now becomes a rather simple program to write. All I need to do is load in a text file, chop it into words with splitTokens() and call increment() on an IntDict for every single word found in the text. The following example does precisely this with the entire text of Shakespeare’s play, A Midsummer Night's Dream, displaying a simple graph of the most used words.
+
+
+Text Concordance Using IntDict
+
+ 
+
+String[] allwords;
-For an example that creates objects from and saves objects to a Table, take a look at LoadSaveTable under Topics --> Advanced Data.
+// Any punctuation is used as a delimiter.
+String delimiters = " ,.?!;:[]";
-XML Data
+IntDict concordance;
-For grabbing data from the web, an XML (Extensible Markup Language) feed is an excellent option (if available). Unlike HTML (which is designed to make content vieweable by a human's eyes) XML is designed to make content viewable by a computer and facilitate the sharing of data across different systems.
+void setup() {
+ size(360, 640);
+
+ // Load A Midsummer Night's Dream into an array of strings
+ String url = "http://www.gutenberg.org/cache/epub/1514/pg1514.txt";
+ String[] rawtext = loadStrings(url);
+
+ // Join the big array together as one long string
+ String everything = join(rawtext, "" );
-XML organizes information in a tree structure. Let's imagine a list of students. Each student has an id number, name, address, e-mail, and telephone number. Each student's address has a city, state, and zip code. An XML tree for this dataset might look like the following:
+ // All the lines in A Midsummer Night's Dream are first joined as one big string
+ // and then split up into an array of individual words.
+ // Note the use of splitTokens() since I am using spaces and punctuation marks as delimiters.
+ allwords = splitTokens(everything, delimiters);
-
+ // Make a new empty dictionary
+ concordance = new IntDict();
+
+ for (int i = 0; i<allwords.length; i++) {
+ // It's useful to convert each word to lower case so that,
+ // for example, “The” and “the” are both counted as the same word.
+ String s = allwords[i].toLowerCase();
+ // For every single word, increase its count in the dictionary.
+ concordance.increment(s);
+ }
+
+ // Sort the dictionary so that words that appear most often are first.
+ concordance.sortValuesReverse();
+}
+
+void draw() {
+ background(255);
+
+ // Display the text and total times the word appears
+ int h = 20;
+ // In order to iterate over every word in the dictionary,
+ // first ask for an array of all of the keys.
+ String[] keys = concordance.keyArray();
+
+ for (int i = 0; i<height/h; i++) {
+ // Look at each key one at a time and retrieve its count.
+ String word = keys[i];
+ int count = concordance.get(word);
+
+ fill(51);
+ // Displaying a rectangle along with the count as a simple graph.
+ rect(0, i*20, count/4, h-4);
+ fill(0);
+ text(word + ": " + count, 10+count/4, i*h+h/2);
+ stroke(0);
+ }
+}
+
+
+ Processing also includes three classes for lists of numbers and strings: IntList, FloatList, and StringList. In other words, if you just want a list of words (without their counts) you could use a StringList rather than an IntDict.
+
+
+
+ If your data is available via a standardized format such as XML or JSON, the process of manually searching through text for individual pieces of data is no longer required. XML is designed to facilitate the sharing of data across different systems, and you can retrieve that data using the built-in Processing XML class.
+
+
+
+ XML organizes information in a tree structure. Let’s imagine a list of students. Each student has an ID number, name, address, email, and telephone number. Each student’s address has a city, state, and zip code. An XML tree for this dataset might look like the following:
+
+
+
+ The XMl source itself (with two students listed) is:
-<?xml version="1.0" encoding="UTF-8"?>
+<?xml version = "1.0" encoding = "UTF-8 "?>
<students>
<student>
<id>001</id>
@@ -313,94 +803,177 @@ XML Data
<address>
<street>45.3 Nebula 5</street>
<city>Boolean City</city>
- <state&tt;Booles</state>
+ <state>Booles</state>
<zip>12358</zip>
</address>
</student>
</students>
-
-Note the similarities to object-oriented programming. We could think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an id, a name, a phone number, an e-mail address, and a mailing address. The mailing address is also an object that also has multiple pieces of data, such as street, city, state, and zip.
-
-Let's look at Yahoo's XML feed for weather data. Here is the raw XML source (Note I have edited it for simplification purposes).
-
+ Note the similarities to object-oriented programming. You can think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an ID, a name, a phone number, an email address, and a mailing address. The mailing address is also an object that has multiple pieces of data, such as street, city, state, and zip.
+
+
+
+ Let's look at some data made available from a web service such as Yahoo Weather. Here is the raw XML source. (Note I have edited it slightly for simplification purposes.)
<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<rss version="2.0" xmlns:yweather="http://xml.weather.yahoo.com/ns/rss/1.0">
<channel>
<item>
- <title>Conditions for New York, NY at 3:51 pm EST</title>
+ <title>Conditions for New York, NY at 12:49 pm EDT</title>
<geo:lat>40.67</geo:lat>
<geo:long>-73.94</geo:long>
- <link>http://xml.weather.yahoo.com/forecast/USNY0996_f.html</link>
- <pubDate>Mon, 20 Feb 2006 3:51 pm EST</pubDate>
- <yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/>
- <yweather:forecast day="Mon" date="20 Feb 2006" low="25" high="37" text="Clear" code="31"/>
+ <link>http://us.rd.yahoo.com/dailynews/rss/weather/New_York__NY//link>
+ <pubDate>Thu, 24 Jul 2014 12:49 pm EDT</pubDate>
+ <yweather:condition text="Partly Cloudy" code="30" temp="76"/>
+ <yweather:forecast day="Thu" low="65" high="82" text="Partly Cloudy"/>
</item>
</channel>
</rss>
-
-And here is the data mapped in the tree structure.
-
-
-
-You may be wondering what the top level "RSS" is all about. Yahoo's XML weather data is provided in RSS format. RSS stands for "Really Simple Syndication" and is a standardized XML format for syndicating web content (such as news articles, etc.)
-
-Now that we have a handle on the tree structure, we should look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, i.e. <channel> and an end tag, i.e. </channel>. Some of these elements have content between the tags:
-
+ The data is mapped in the tree stucture shown below:
+
+
+
+ You may be wondering what the top level “RSS” is all about. Yahoo’s XML weather data is provided in RSS format. RSS stands for “Really Simple Syndication” and is a standardized XML format for syndicating web content (such as news articles, etc.). You can read more about RSS on Wikipedia.
+
+
+ Now that you have a handle on the tree structure, let's look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, that is, <channel>, and an end tag, that is, </channel>. Some of these elements have content between the tags:
-<title>Conditions for New York, NY at 3:51 pm EST</title>
+<title>Conditions for New York, NY at 12:49 pm EDT</title>
-
-and some have attributes (formatted by attribute name equals attribute value in quotes):
-
+and some have attributes (formatted by Attribute Name equals Attribute Value in quotes):
-<yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/>
+<yweather:forecast day="Thu" low="65" high="82" text="Partly Cloudy"/>
+
-Knowing this format, we could certainly be clever with our use of split(), indexOf(), and substring() to find the pieces we want in the raw XML. The point here, however, is that because XML is a standard format, we don't have to do this. Rather, we can use an XML parser. In Processing, the XML parser is called just that: XML.
+Using the Processing XML Class
+
+ Since the syntax of XML is standardized, I could certainly use split(), indexof(), and substring() to find the pieces I want in the XML source. The point here, however, is that because XML is a standard format, I don't have to do this. Rather, I can use an XML parser. In Processing, XML can be parsed using the built-in Processing class XML.
XML xml = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003");
+ Here, instead of loadStrings() or loadTable(), I'm now calling loadXML() and passing in the address (URL or local file) of the XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram from Yahoo Weather, I find the current temperature via the following path:
+
+
+
+ -
+
The root of the tree is RSS.
+
+ -
+
RSS has a child named channel.
+
+ -
+
Channel has a child named item.
+
+ -
+
Item has a child named yweather:condition.
+
+ -
+
The temperature is stored in yweather:condition as the attribute temp.
+
+
+
+
+ The children of an element are accessed via the getChild() function.
+
+// Accessing the “channel” child element of the root element -->
+XML channel = xml.getChild("channel");
+
+ The content of an element itself is retrieved with one of the following methods: getContent(), getIntContent(), or getFloatcContent(). getContent() is for generic use and will always give you the content as a String. If you intend to use the content as a number, Processing will convert it for you with either getIntContent() or getFloatcContent(). Attributes can also be read as either numbers — getInt(), getFloat() — or text — getString().
+
-Here, instead of loadStrings() or loadTable(), we're now calling loadXML() and passing in the address (URL or local file) of our XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram, we see that we can find the current temperature via the following path:
-
-
-- The root of the tree is RSS.
-- RSS has a child named channel.
-- Channel has a child named item.
-- Item has a child named yweather:condition.
-- The temperature is stored in yweather:condition as the attribute temp.
-
+
+ Following steps one through five outlined above through the XML tree, I have:
+
+XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1
-We could translate the above into code as follows:
+XML channel = root.getChild("channel"); // Step 2
-
-XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1
-XML channel = root.getChild("channel"); // Step 2
-XML item = channel.getChild("item"); // Step 3
-XML yweather = item.getChild("yweather:condition"); // Step 4
-int temperature = yweather.getInt("temp"); // Step 5
-
+XML item = channel.getChild("item"); // Step 3
-This is a bit long-winded, however, and so can be compressed down into one (or three as below) lines of code.
+XML yweather = item.getChild("yweather:condition"); // Step 4
-
-XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003); // Step 1
-XML forecast = root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4
-int temperature = forecast.getInt("temp"); // Step 5
+int temperature = yweather.getInt("temp"); // Step 5
+ However, this is a bit long-winded and so can be compressed down into one (or three, as below) lines of code.
+
+XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003);
-Finally, the second line of code above can be further condensed to:
-
+XML forecast =
+ root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4
+int temperature = forecast.getInt("temp");
+
+ Finally, the second line of code above can be further condensed to:
XML forecast = xml.getChild("channel/item/yweather:condition"); // Steps 2-4
+ Following is the above code put together in an example that retrieves weather data for multiple zip codes by parsing Yahoo's XML feed.
+
+
+Parsing Yahoo Weather XML
+
+
+int temperature = 0;Temperature is stored as a number and the description of the weather as a string.
+String weather = "";
+
+
+// The zip code
+String zip = "10003";
+
+void setup() {
+ size(200, 200);
+
+ // The URL for the XML document
+ String url = "http://xml.weather.yahoo.com/forecastrss?p=" + zip;
-It should also be noted that we're accessing the child nodes by their name (i.e. "channel", "item", etc.), but they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children. In LoadSaveTable, we used a series of comma separated values in a text file to store information related to Bubble objects. An XML document can also be used in the same manner. Consider the following XML document:
+ // Load the XML document
+ XML xml = loadXML(url);
+ // Here, I grab the XML element that I want.
+ XML forecast = xml.getChild("channel/item/yweather:forecast");
+
+ // And then I pull the attributes from that XML element.
+ temperature = forecast.getInt("high");
+ weather = forecast.getString("text");
+}
+
+void draw() {
+ background(255);
+ fill(0);
+
+ // Display all the stuff I want to display
+ text("Zip code: " + zip, 10, 50);
+ text("Today’s high: " + temperature, 10, 70);
+ text("Forecast: " + weather, 10, 90);
+}
+
+ Other useful XML functions are:
+
+
+
+ -
+
hasChildren() — checks whether or not an element has any children
+
+ -
+
getChildren() — returns an array containing all child elements
+
+ -
+
getAttributeCount() — counts the specified element's number of attributes
+
+ -
+
hasAttribute() — checks whether or not an element has the specified attribute
+
+
+
+
+
+ In this example I'm accessing the child nodes by their name (i.e., "channel," "item,", etc.), however they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children, much like I did with tabular data when I iterated over rows in a table.
+
+
+
+ Earlier, we used a Table to store information related to Bubble objects. XML document can also be used in the same manner. Here is a possible solution for an XML tree of Bubble objects:
<?xml version="1.0" encoding="UTF-8"?>
<bubbles>
@@ -426,52 +999,321 @@ XML Data
</bubble>
</bubbles>
+ I can use getChildren() to retrieve the array of <bubble> elements and make a Bubble object from each one. Here is the example which uses the identical Bubble class from earlier (not included below). The new code is in bold.
+
+
+
+Using Processing's XML Class
+
+
+// An Array of Bubble objects
+Bubble[] bubbles;
+// An XML object
+XML xml;
+
+void setup() {
+ size(480, 360);
+ loadData();
+}
-In the above XML, the root element is "bubbles" which has four children. Each child "bubble" has 3 children, "position", "diameter", and "label." The "position" element has two attributes, "x" and "y." To access the list of all XML nodes "bubble" we can use the getChildren() method, passing in the name "bubble"
+void loadData() {
+ // Load XML file
+ xml = loadXML("data.xml");
+ // Get all the child nodes named "bubble"
+ XML[] children = xml.getChildren("bubble");
+ bubbles = new Bubble[children.length];
+ // The size of the Bubble array is determined by the total XML elements named “bubble.”
+
+ for (int i = 0; i < bubbles.length; i++) {
+
+ XML positionElement = children[i].getChild("position");
+ // The position element has two attributes: “x” and “y”.
+ // Attributes can be accessed as an integer or float via getInt() and getFloat().
+ float x = positionElement.getInt("x");
+ float y = positionElement.getInt("y");
+
+ // The diameter is the content of the child named "diameter"
+ XML diameterElement = children[i].getChild("diameter");
+ float diameter = diameterElement.getFloatContent();
+ // Notice, however, with the content of an XML node,
+ // I retrieve via getIntContent() and getFloatContent().
+
+ // The label is the content of the child named "label"
+ XML labelElement = children[i].getChild("label");
+ String label = labelElement.getContent();
+
+ // Make a Bubble object out of the data read
+ bubbles[i] = new Bubble(x, y, diameter, label);
+ }
+}
+
+void draw() {
+ background(255);
+ // Display all bubbles
+ for (int i = 0; i < bubbles.length; i++) {
+ bubbles[i].display();
+ bubbles[i].rollover(mouseX, mouseY);
+ }
+}
+
+ In addition to loadXML(), Processing also includes a saveXML() function for writing XML files to your sketch folder. You can modify the XML tree itself by adding or removing elements with addChild() or removeChild(), as well as modify the content of elements or attributes with setContent(), setIntContent(), setFloatContent(), setString(), setInt(), and setFloat().
+
+
+JSON
+
+
+ Another increasingly popular data exchange format is JSON (pronounced like the name Jason), which stands for JavaScript Object Notation. Its design was based on the syntax for objects in the JavaScript programming language (and is most commonly used to pass data between web applications) but has become rather ubiquitous and language-agnostic. While you don't need to know anything about JavaScript to work in Processing, it won't hurt to get a sense of some basic JavaScript syntax while learning it.
+
+
+
+ JSON is an alternative to XML and the data can be looked at in a similarly tree-like manner. All JSON data comes in the following two ways: an object or an array. Luckily, you already know about these two concepts and only need to learn a new syntax for encoding them.
+
+
+
+ Let's take a look at a JSON object first. A JSON object is like a Processing object only with no functions. It’s simply a collection of variables with a name and a value (or "name/value pair"). For example, following is JSON data describing a person:
+
+{
+ "name":"Olympia",
+ // Each name/value pair is separated by a comma.
+ "age":3,
+ "height":96.5,
+ "state":"giggling"
+}
+Notice how this maps closely to classes in Processing.
+
+class Person {
+ String name;
+ int age;
+ float height;
+ String state;
+}
+
+ There are no classes in JSON, only the object literals themselves. Also an object can contain, as part of itself, another object.
+
+{
+ "name":"Olympia",
+ "age":3,
+ "height":96.5,
+ "state":"giggling",
+ // The value of “brother” is an object containing two name/value pairs.
+ "brother":{
+ "name":"Elias",
+ "age":6
+ }
+}
+ In XML, the preceding JSON data would look like the following (for simplicity I'm avoiding the use of XML attributes).
+
+<xml version="1.0" encoding="UTF-8"?>
+<person>
+ <name>Olympia</name>
+ <age>3</age>
+ <height>96.5</height>
+ <state>giggling</state>
+ <brother>
+ <name>Elias</name>
+ <age>6</age>
+ </brother>
+</person>
+
+ Multiple JSON objects can appear in the data as an array. Just like the arrays you use in Processing, a JSON array is simply a list of values (primitives or objects). The syntax, however, is different with square brackets indicating the use of an array rather than curly ones. Here is a simple JSON array of integers:
+
+[1, 7, 8, 9, 10, 13, 15]
+
+ You might find an array as part of an object.
+
+{
+ "name":"Olympia",
+ // The value of “favorite colors” is an array of strings.
+ "favorite colors":[
+ "purple",
+ "blue",
+ "pink"
+ ]
+}
+
+ Or an array of objects themselves. For example, here is what the bubbles would look like in JSON. Notice how this JSON data is organized as a single JSON object "bubbles," which contains a JSON array of JSON objects, the bubbles. Flip back to compare to the CSV and XML versions of the same data.
+
+{
+ "bubbles":[
+ {
+ "position":{
+ "x":160,
+ "y":103
+ },
+ "diameter":43.19838,
+ "label":"Happy"
+ },
+ {
+ "position":{
+ "x":372,
+ "y":137
+ },
+ "diameter":52.42526,
+ "label":"Sad"
+ },
+ {
+ "position":{
+ "x":273,
+ "y":235
+ },
+ "diameter":61.14072,
+ "label":"Joyous"
+ }
+ ]
+}
+
+
+JSONObject and JSONArray
+
+
+ Now that I've covered the syntax of JSON, I can look at using the data in Processing. One thing that can be a bit tricky about working with JSON in Processing is that I have to treat objects and arrays differently. With XML, I simply had a single XML class with all the parsing functionality I needed. With JSON, I have two classes: JSONObject and JSONArray, and I'll have to be conscientious about picking which class I am using during the parsing process.
+
+
+
+ The first step is simply loading the data with either loadJSONObject() or loadJSONArray(). But which one? I have to look and see what is at the root of the JSON file, an object or array. This can be a little tricky. Let's look at these two JSON examples:
+
+
+
+ Sample 1:
+
+[
+ {
+ "name":"Elias"
+ },
+ {
+ "name":"Olympia"
+ }
+]
+
+ Sample 2:
-// Load an XML document
-XML xml = loadXML("bubbles.xml");
+{
+ "names":[
+ {
+ "name":"Elias"
+ },
+ {
+ "name":"Olympia"
+ }
+ ]
+}
+
+ Look how similar the above two samples look. They both contain exactly the same data, two names "Elias" and "Olympia." There is one, very key difference, however, to how the data is formatted: the very first character. Is it a "[" or a "{"? The answer will determine whether you’re loading an array ("[") or an object("{"). JSON objects start with a curly bracket, while JSON arrays start with a square bracket.
+
+JSONObject json = loadJSONObject("file.json");
-// Get all the child elements
-XML[] children = xml.getChildren("bubble");
+JSONArray json = JSONArray("file.json");
+ Typically, even if the data is ultimately organized as an array of objects (such as the array of "bubble" objects), the root element of the JSON data will be an object that contains that array. Let's look at the bubble data one more time.
+
+{
+ "bubbles":[
+ {
+ "position":{
+ "x":160,
+ "y":103
+ },
+ "diameter":43.19838,
+ "label":"Happy"
+ },
+ {
+ "position":{
+ "x":372,
+ "y":137
+ },
+ "diameter":52.42526,
+ "label":"Sad"
+ }
+ ]
+}
+
+ With the above, I first load an object and then pull the array out of that object.
+
+JSONObject json = loadJSONObject("data.json");
+JSONArray bubbleData = json.getJSONArray("bubbles");
+
+ Just as with XML, the data from an element is accessed via its name, in this case "bubbles." With a JSONArray, however, each element of the array is retrieved via its numeric index. The following code iterates over a JSONArray.
+
+for (int i = 0; i < bubbleData.size(); i++) {
+ JSONObject bubble = bubbleData.getJSONObject(i);
+ }
+
+ And when you're looking for a specific piece of data from a JSONObject, such as an integer or string, the functions are identical to those of XML attributes. The following code gets the position object from the bubble object, then gets x and y as integers from the position object. The diameter and label are then available directly from the Bubble object.
+
+ JSONObject position = bubble.getJSONObject("position");
-Once we have the array of XML objects, we can iterate over them, accessing the individual pieces of data for each "bubble". Notice how the syntax for getting XML attributes (in this case, "x" and "y" of the position element is slightly different than pulling content directly from an element (in this case, "diameter" and "label").
-
-for (int i = 0; i < bubbles.length; i++) {
-
- // The position element has two attributes: x and y
- XML positionElement = children[i].getChild("position");
- // Note how with attributes we can get an integer or float via getInt() and getFloat()
- float x = positionElement.getInt("x");
- float y = positionElement.getInt("y");
-
- // The diameter is the content of the child named "diamater"
- XML diameterElement = children[i].getChild("diameter");
- // Note how with the content of an XML node, we retrieve via getIntContent() and getFloatContent()
- float diameter = diameterElement.getFloatContent();
+ int x = position.getInt("x");
+ int y = position.getInt("y");
- // The label is the content of the child named "label"
- XML labelElement = children[i].getChild("label");
- String label = labelElement.getContent();
-}
+ float diameter = bubble.getFloat("diameter");
+ String label = bubble.getString("label");
+ Putting this all together, I can now make a JSON version of the bubbles example (leaving out the draw() function and Bubble class which haven't changed.)
+
+
+
+Using Processing's JSON Classes
+
+
+// An Array of Bubble objects
+Bubble[] bubbles;
-XML elements can be added and removed from the XML tree with the addChild() and removeChild() methods.
+void setup() {
+ size(480, 360);
+ loadData();
+}
-For the full example that creates objects from and saves objects to an XML document, take a look at LoadSaveXML under Topics --> Advanced Data.
+void loadData() {
+ // Load the JSON file and grab the array.
+ JSONObject json = loadJSONObject("data.json");
+ JSONArray bubbleData = json.getJSONArray("bubbles");
-Threads
+ // The size of the array of Bubble objects is determined by the length of the JSON array.
+ bubbles = new Bubble[bubbleData.size()];
+
+
+ for (int i = 0; i<bubbleData.size(); i++) {
+
+ // Iterate through the array, grabbing each JSON object one at a time.
+ JSONObject bubble = bubbleData.getJSONObject(i);
-You are likely familiar with the idea of writing a program that follows a specific sequence of steps -- setup() first then draw() over and over and over again! A Thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the "Animation" thread. Other threads sequences, however, can run independently of the main Processing sketch. In fact, you can launch any number of threads at one time and they will all run concurrently.
+ // Get a position object
+ JSONObject position = bubble.getJSONObject("position");
+ // Get (x,y) from JSON object "position"
+ int x = position.getInt("x");
+ int y = position.getInt("y");
+
+ // Get diamter and label
+ float diameter = bubble.getFloat("diameter");
+ String label = bubble.getString("label");
-Processing does this all the time, whenever you write an event callback, such as serialEvent(), or captureEvent(), etc. these functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful whenever you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network (XML, database, etc.) If a separate thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread. To create independent, asynchronous threads, you can use the thread() function built into Processing.
+ // Put the Bubble objects into an array.
+ bubbles[i] = new Bubble(x, y, diameter, label);
+ }
+}
+
+
+Threads
+
+ As you have seen, the various loading functions — loadStrings(), loadTable(), loadXML(), and loadJSONObject() — can be used for retrieving data from URLs. Nonetheless, unless your sketch only needs to load the data once during setup(), you may have a problem. For example, consider a sketch that grabs the price of AAPL stock from an XML feed every five minutes. Each time loadXML() is called, the sketch will pause while waiting to receive the data. Any animation will stutter. This is because these loading functions are “blocking.” In other words, the sketch will sit and wait at that line of code until loadXML() completes its task. With a local data file, this is extremely fast. Nonetheless, a request for a URL (known as an “HTTP request”) in Processing is synchronous, meaning your sketch waits for a response from the server before continuing. Who knows how will that take? No one; you are at the mercy of the server!
+
+
+
+ The answer to this problem lies in the concept of threads. By now you are quite familiar with the idea of writing a program that follows a specific sequence of steps — setup() first then draw() over and over and over again! A thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the animation thread. Other threads’ sequences, however, can run independently of the main animation loop. In fact, you can launch any number of threads at one time, and they will all run concurrently.
+
+
+
+
+ Processing does this quite often, such as with library functions like captureEvent() and movieEvent(). These functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful when you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network. Here, you want to handle the request asynchronously in a different thread. If that thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread and not the main animation loop.
+
+
+
+ Writing your own thread can be a complex endeavor that involves extending the Java Thread class. However, the thread() method is a quick and dirty way to implement a simple thread in Processing. By passing in a string that matches the name of a function declared elsewhere in the sketch, Processing will execute that function in a separate thread. Let's take a look at a skeleton of how this works.
void setup() {
- size(200,200);
thread("someFunction");
}
@@ -484,44 +1326,201 @@ Threads
// thread("someFunction") as it was in setup!
}
+ The thread() function receives a string as an argument. The string should match the name of the function you want to run as a thread. In the above example it’s "someFunction".
+
+
+
+ Let's look at a more practical example. For an example of data that changes often, I'll use time.jsontest.com which gives you the current time (in milliseconds). While I could retrieve this from the system clock, this works well for demonstrating continuously requesting data that changes over time. Not knowing about threads, my first instinct might be to say:
+
+void draw() {
+ // The code will stop here and wait to receive the data before moving on.
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ String time = json.getString("time");
+ text(time, 40, 100);
+}
+
+ This would give me the current time every cycle through draw(). If I examine the frame rate, however, I'll notice that the sketch is running incredibly slowly (and all it needs to do is draw a single string!). This is where calling the parsing code as a separate thread will help a lot.
+
+String time = "";
-The thread() function receives a String as an argument. The String should match the name of the function you want to run as a thread. This is especially useful in sketches that grab data for the web. Rather than have the animation freeze while the sketch is waiting to retrieve data, the sketch can continue to loop through draw() updating the data when the thread is completed. In these cases, a boolean variable can be useful to track the status of the thread.
+void draw() {
+ // Now the code will move on to the next line while requestData() executes in a separate thread.
+ thread("requestData");
+ text(time, 40, 100);
+}
-
-boolean loading = false;
+void requestData() {
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ time = json.getString("time");
+}
+ The logic is identical, only I am not requesting the data directly in draw(), but executing that request as a separate thread. Notice that I am not doing any drawing in requestData(). This is key as executing drawing functions in code that runs on a separate thread can cause conflicts with the main animation thread (i.e., draw()) resulting in strange behavior and errors.
+
-The function that loads the data can then set loading equal to true at the start and false at the end.
+
+ In the above example, I likely don't want to request the data sixty times per second (the default frame rate). Instead I might make use of the Timer class, and ask for the data once per second. Here is a full example that does exactly that with added animation to show that draw() never stutters.
+
+Threads
+
+ 
+
-void loadData() {
- loading = true;
+Timer timer = new Timer(1000);
+String time = "";
- ///////////////////////////////////
- // All of the data retrival code //
- ///////////////////////////////////
+void setup() {
+ size(200, 200);
+ // Start by requesting the data asynchronously in a thread.
+ thread("retrieveData");
+ timer.start();
+}
+
+void draw() {
+ background(255);
+ // Every one second, make a new request.
+ if (timer.isFinished()) {
+ retrieveData();
- loading = false;
+ // And restart the timer.
+ timer.start();
+ }
+
+ fill(0);
+ text(time, 40, 100);
+
+ translate(20, 100);
+ stroke(0);
+ //Draw a little animation to demonstrate that the draw() loop never pauses.
+ rotate(frameCount*0.04);
+ for (int i = 0; i<10; i++) {
+ rotate(radians(36));
+ line(5, 0, 10, 0);
+ }
+}
+
+// get the data
+void retrieveData() {
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ time = json.getString("time");
+}
+
+
+class Timer {
+
+ int savedTime;
+ boolean running = false;
+ int totalTime;
+
+ Timer(int tempTotalTime) {
+ totalTime = tempTotalTime;
+ }
+
+ void start() {
+ running = true;
+ savedTime = millis();
+ }
+
+ boolean isFinished() {
+ int passedTime = millis() - savedTime;
+ if (running && passedTime > totalTime) {
+ running = false;
+ return true;
+ } else {
+ return false;
+ }
+ }
+
}
-In draw(), you can choose to display something to indicate the thread is running (when loading equals true).
+APIs
+
+
+ It’s a bit silly for me to call this section “APIs” given that most of this chapter is about data from APIs. Still, it’s worth taking a moment to pause and reflect. What makes something an API versus just some data you found, and what are some pitfalls you might run into when using an API?
+
+
+
+ As I've stated, an API (Application Programming Interface) is an interface through which one application can access the services of another. These can come in many forms. Openweathermap.org, as you saw earlier, is an API that offers its data in JSON, XML, and HTML formats. The key element that makes this service an API is exactly that offer; openweathermap.org's sole purpose in life is to offer you its data. And not just offer it, but allow you to query it for specific data in a specific format. Let's look at a short list of sample queries.
+
+
+
+ - http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139
+ - A request for current weather data for a specific latitude and longitude.
+ - http://api.openweathermap.org/data/2.5/forecast/daily?q=London&mode=xml&units=metric&cnt=7&lang=zh_cn
+ - A request for a seven day London forecast in XML format with metric units and in Chinese.
+ - http://api.openweathermap.org/data/2.5/history/station?id=5091&type=day
+ - A request for a historical data for a given weather station.
+
+
+
+ One thing to note about openweathermap.org is that it does not require that you tell the API any information about yourself. You simply send a request to a URL and get the data back. Other APIs, however, require you to sign up and obtain an access token. The New York Times API is one such example. Before you can make a request from Processing, you'll need to visit The New York Times Developer site and request an API key. Once you have that key, you can store it in your code as a string.
+
+// This is not a real key
+String apiKey = "40e2es0b3ca44563f9c62aeded4431dc:12:51913116";
+
+ You also need to know what the URL is for the API itself. This information is documented for you on the developer site, but here it is for simplicity:
+
+String url = "http://api.nytimes.com/svc/search/v2/articlesearch.json";
+
+ Finally, you have to tell the API what it is you are looking for. This is done with a “query string,” a sequence of name value pairs describing the parameters of the query joined with an ampersand. This functions similarly to how you pass arguments to a function in Processing. If you wanted to search for the term "processing" from a search() function you might say:
+
+search("processing");
+
+ Here, the API acts as the function call, and you send it the arguments via the query string. Here is a simple example asking for a list of the oldest articles that contain the term "processing" (the oldest of which turns out to be May 12th, 1852).
+
+// The name/value pairs that configure the API query are: (q,processing) and (sort,oldest)
+String query = "?q=processing&sort=oldest";
+
+ This isn't just guesswork. Figuring out how to put together a query string requires reading through the API's documentation. For The New York Times, it’s all outlined on the Times' developer website. Once you have your query you can join all the pieces together and pass it to loadJSONObject(). Here is a tiny example that simply displays the most recent headline.
+
+
+NYTimes API Query
+
-void draw() {
- if (loading) {
- // Draw something to indicate loading
- }
+void setup() {
+ size(200, 200);
+
+ String apiKey = "40e2ea0b3ca44563f9c62aeded0431dc:18:51513116";
+ String url = "http://api.nytimes.com/svc/search/v2/articlesearch.json";
+ String query = "?q=processing&sort=newest";
+
+ // Make the API query
+ // Here, I format the call to the API by joing the URL with the API key with the query string.
+ JSONObject json = loadJSONObject(url+query+"&api-key="+apiKey);
+
+ String headline = json.getJSONObject("response").getJSONArray("docs").
+ // Grabbing a single headline from the results.
+ getJSONObject(0).getJSONObject("headline").getString("main");
+ background(255);
+ fill(0);
+ text(headline, 10, 10, 180, 190);
}
+ Some APIs require a deeper level of authentication beyond an API access key. Twitter, for example, uses an authentication protocol known as “OAuth” to provide access to its data. Writing an OAuth application requires more than just passing a String into a request and is beyond the scope of this tutorial. However, in these cases, if you’re lucky, you can find a Processing library that handles all of the authentication for you. There are several APIs that can be used directly with Processing via a library, and you can find a list of them in the “Data / Protocols” section of the libraires reference page for some ideas. Temboo, for example, offers a Processing library that handles OAuth for you and provides direct access to many APIs (including Twitter) in Processing. With Temboo, you can write code that looks like:
+
+
+// Temboo acts as a go-between you and Twitter, so first you just authenticate with Temboo.
+TembooSession session = new TembooSession("ACCOUNT_NAME", "APP_NAME", "APP_KEY");
-Two examples that follow this methodology can be found under Topics --> Advanced Data in the Processing examples.
+Tweets tweets = new Tweets(session);
+// Then you can configure a query to send to Twitter itself and grab the results.
+tweets.setCredential("your-twitter-name");
+tweetsChoreo.setQuery("arugula");
+TweetsResultSet tweetsResults = tweets.run();
-While using the thread() function is a very simple way of getting an independent thread, it should be noted that it is somewhat limited. Being able to make a thread object is a great deal more powerful, and this can be done by extending the Java Thread class.
+JSONObject searchResults = parseJSONObject(tweetsResults.getResponse());
+JSONArray statuses = searchResults.getJSONArray("statuses");
+
+// Finally, you can search through the results and grab a tweet.
+JSONObject tweet = statuses.getJSONObject(0);
+String tweetText = tweet.getString("text");
+
-
-
+
+
diff --git a/content/static/tutorials/drawing/imgs/A94665D2BBAE05CF._t_ b/content/static/tutorials/drawing/imgs/A94665D2BBAE05CF._t_
new file mode 100644
index 000000000..fb0b3bb08
--- /dev/null
+++ b/content/static/tutorials/drawing/imgs/A94665D2BBAE05CF._t_
@@ -0,0 +1,147 @@
+
+
+
+
diff --git a/content/static/tutorials/drawing/imgs/A94665DD9FEE952C._t_ b/content/static/tutorials/drawing/imgs/A94665DD9FEE952C._t_
new file mode 100644
index 000000000..914fa8f46
--- /dev/null
+++ b/content/static/tutorials/drawing/imgs/A94665DD9FEE952C._t_
@@ -0,0 +1,150 @@
+
+
+
+
diff --git a/content/static/tutorials/drawing/imgs/A94665F3686FB3E6._t_ b/content/static/tutorials/drawing/imgs/A94665F3686FB3E6._t_
new file mode 100644
index 000000000..011a3cd80
--- /dev/null
+++ b/content/static/tutorials/drawing/imgs/A94665F3686FB3E6._t_
@@ -0,0 +1,101 @@
+
+
+
+
diff --git a/content/static/tutorials/drawing/imgs/drawing-01.svg b/content/static/tutorials/drawing/imgs/drawing-01.svg
index 21f5e8796..bd50213f1 100644
--- a/content/static/tutorials/drawing/imgs/drawing-01.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-01.svg
@@ -2,63 +2,146 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-02.svg b/content/static/tutorials/drawing/imgs/drawing-02.svg
index 53c5804ec..beb9935ab 100644
--- a/content/static/tutorials/drawing/imgs/drawing-02.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-02.svg
@@ -2,34 +2,148 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-03.svg b/content/static/tutorials/drawing/imgs/drawing-03.svg
index cf20e2076..b3c97fe3f 100644
--- a/content/static/tutorials/drawing/imgs/drawing-03.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-03.svg
@@ -1,101 +1,300 @@
-
+
diff --git a/content/static/tutorials/drawing/imgs/drawing-04.svg b/content/static/tutorials/drawing/imgs/drawing-04.svg
index e8e78fca4..a819634e0 100644
--- a/content/static/tutorials/drawing/imgs/drawing-04.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-04.svg
@@ -2,21 +2,100 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-05.svg b/content/static/tutorials/drawing/imgs/drawing-05.svg
index 76a79bf47..44653c110 100644
--- a/content/static/tutorials/drawing/imgs/drawing-05.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-05.svg
@@ -1,64 +1,210 @@
-
-
-
-
+
+
+
diff --git a/content/static/tutorials/drawing/imgs/drawing-06.svg b/content/static/tutorials/drawing/imgs/drawing-06.svg
index 6c0dbeefa..b60a7c33e 100644
--- a/content/static/tutorials/drawing/imgs/drawing-06.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-06.svg
@@ -2,70 +2,273 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-07.svg b/content/static/tutorials/drawing/imgs/drawing-07.svg
index 8f112e8ab..fe9206917 100644
--- a/content/static/tutorials/drawing/imgs/drawing-07.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-07.svg
@@ -2,77 +2,291 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-08.svg b/content/static/tutorials/drawing/imgs/drawing-08.svg
index c921208ee..f6b9defe9 100644
--- a/content/static/tutorials/drawing/imgs/drawing-08.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-08.svg
@@ -1,1583 +1,297 @@
-
-
-
-
-
-
-
-
-]>
-
- Interviews with SUE.C, Larry Cuba, Mark Hansen, Lynn Hershman Leeson, Jürg Lehni, LettError, Golan Levin and Zachary Lieberman, Benjamin Maus, Manfred Mohr, Ash Nehru, Josh On, Bob Sabiston, Jennifer Steinkamp, Jared Tarbell, Steph Thirion, and Robert Winter. + Interviews with SUE.C, Larry Cuba, Mark Hansen, Lynn Hershman Leeson, Jürg Lehni, LettError, Golan Levin and Zachary Lieberman, Benjamin Maus, Manfred Mohr, Ash Nehru, Josh On, Bob Sabiston, Jennifer Steinkamp, Jared Tarbell, Steph Thirion, and Robert Winter.
diff --git a/content/static/overview.html b/content/static/overview.html index 13349191d..d5d3d30ff 100644 --- a/content/static/overview.html +++ b/content/static/overview.html @@ -6,14 +6,11 @@Overview. A short introducti
- For the past fourteen years, Processing has promoted software literacy, particularly within the visual arts, and visual literacy within technology. Initially created to serve as a software sketchbook and to teach programming fundamentals within a visual context, Processing has also evolved into a development tool for professionals. The Processing software is free and open source, and runs on the Mac, Windows, and GNU/Linux platforms.
-
-
- Processing continues to be an alternative to proprietary software tools with restrictive and expensive licenses, making it accessible to schools and individual students. Its open source status encourages the community participation and collaboration that is vital to Processing’s growth. Contributors share programs, contribute code, and build libraries, tools, and modes to extend the possibilities of the software. The Processing community has written more than a hundred libraries to facilitate computer vision, data visualization, music composition, networking, 3D file exporting, and programming electronics.
+ For the past sixteen years, Processing has promoted software literacy, particularly within the visual arts, and visual literacy within technology. Initially created to serve as a software sketchbook and to teach programming fundamentals within a visual context, Processing has also evolved into a development tool for professionals. The Processing software is free and open source, and runs on the Mac, Windows, and GNU/Linux platforms.
- Processing is currently developed primarily in Boston (at Fathom Information Design), Los Angeles (at the UCLA Arts Software Studio), and New York City (at NYU’s ITP).
+ Processing continues to be an alternative to proprietary software tools with restrictive and expensive licenses, making it accessible to schools and individual students. Its open source status encourages the community participation and collaboration that is vital to Processing’s growth. Contributors share programs, contribute code, and build libraries, tools, and modes to extend the possibilities of the software. The Processing community has written more than a hundred libraries to facilitate computer vision, data visualization, music composition, networking, 3D file exporting, and programming electronics.
Education
@@ -27,7 +24,7 @@ Education
- The innovations in teaching through Processing have been adapted for the Khan Academy computer science tutorials, offered online for free. The tutorials begin with drawing, using most of the Processing functions for drawing. The Processing approach has also been applied to electronics through the Arduino and Wiring projects. Arduino uses a syntax inspired by that used with Processing, and continues to use a modified version of the Processing programming environment to make it easier for students to learn how to program robots and countless other electronics projects.
+ The innovations in teaching through Processing have been adapted for the Khan Academy computer science tutorials, offered online for free. The tutorials begin with drawing, using most of the Processing functions for drawing. The Processing approach has also been applied to electronics through the Arduino and Wiring projects. Arduino uses a syntax inspired by that used with Processing, and continues to use a modified version of the Processing programming environment to make it easier for students to learn how to program robots and countless other electronics projects.
Culture
@@ -45,21 +42,23 @@ Research
Foundation
-The primary charge of the Foundation is to develop and distribute the Processing software. This includes the original Processing (Java), p5.js (Javascript), and Processing.py (Python). There is more information about the Foundation at http://foundation.processing.org/.
+The primary charge of the Foundation is to develop and distribute the Processing software. This includes the original Processing (Java), p5.js (Javascript), and Processing.py (Python). There is more information about the Foundation at https://processingfoundation.org/.
History
- Processing was started by Ben Fry and Casey Reas in the spring of 2001, while both were graduate students at the MIT Media Lab within John Maeda's Aesthetics and Computation research group. Development continued in their free time while Casey pursued his artistic and teaching career and Ben pursued a Ph.D. and founded Fathom Information Design. Many of the ideas in Processing go back to Muriel Cooper's Visual Language Workshop, and it grew directly out of Maeda's Design By Numbers project, developed at the Media Lab and released in 1999. The Wiring and Arduino projects, in turn, grew out of Processing while Casey was teaching at the Interaction Design Institute Ivrea in Italy. Processing also prompted John Resig (jQuery) to build Processing.js, a JavaScript version that then inspired more related work such as the Khan Academy curriculum in computer science. Versions of Processing that use Python, Ruby, ActionScript, and Scala are also in development. Processing and its sister projects have inspired over twenty educational books.
+ Processing was started by Ben Fry and Casey Reas in the spring of 2001, while both were graduate students at the MIT Media Lab within John Maeda's Aesthetics and Computation research group. Development continued in their free time while Casey pursued his art and teaching career and Ben pursued a Ph.D. and founded Fathom Information Design. Many of the ideas in Processing go back to Muriel Cooper's Visual Language Workshop, and it grew directly out of Maeda's Design By Numbers project, developed at the Media Lab and released in 1999. The Wiring and Arduino projects, in turn, grew out of Processing while Casey was teaching at the Interaction Design Institute Ivrea in Italy.
+
For more information, please write to foundation@processing.org
diff --git a/content/static/people.html b/content/static/people.html
index ed14bc057..d406b648c 100755
--- a/content/static/people.html
+++ b/content/static/people.html
@@ -6,78 +6,57 @@
People. Processing is a comm
- Lead Developers
+ Project Leads
Ben Fry and Casey Reas
started Processing in Spring 2001 and continue to obsessively work on it. In 2012, they started the Processing Foundation along with Dan Shiffman, who formally joined as a third project lead.
- Senior Developers
- Andres Colubri (Boston), OpenGL / Video
- Florian Jenett (Frankfurt), Forum
- Elie Zananiri (Montreal), Contributed Libraries / Tools
- Scott Murray (San Francisco), Website / Reference / UI
+ Developers
+ Andres Colubri (Boston), OpenGL / Video
+ Elie Zananiri (New York), Contributed Libraries / Tools
+ Samuel Pottinger (San Francisco), Processing Core
-
+
-
+
Libraries, Tools
- The core Processing software is augmented by libraries and tools contributed through the community.
- These inventive extensions are a bright future for the project. We have a list of
- Contributed Libraries and
+ The core Processing software is augmented by libraries and tools contributed through
+ the community. These inventive extensions are a bright future for the project. We have a
+ list of Contributed Libraries and
Contributed Tools posted online.
- These contributions can't be underestimated. For example, see how
- Karsten Schmidt (London) has transformed Processing
- through the toxiclibs library and how
- Damien Di Fede (Austin) has extended the project
- into programming sound through his minim
- library.
-
-
-
-
-
- Fellowship Alumni
- Lauren McCarthy (New York), Spring/Summer/Fall 2013
- Greg Borenstein (New York), Spring/Summer 2013
- Wilm Thoben (Los Angeles), Fall 2013/Winter 2014
+ These contributions can't be underestimated. For example, see how Karsten Schmidt (London) has
+ transformed Processing through the toxiclibs library and how Damien Di Fede (Austin) has extended
+ the project into programming sound through his minim library.
- Developer Alumni
+ Alumni
+ Jakub Valtar (Brno), Processing Core
+ Scott Garner (New York), Hello Processing Website
+ Scott Murray (San Francisco), Website / Reference / UI
+ Gottfried Haider (Los Angeles), Processing for Pi
+ Florian Jenett (Frankfurt), Forum
+ Jamie Kosoy (San Francisco), Website
+ Manindra Moharana (San Diego), PDE / Core
+ James Grady (Boston), Visual Design
+
+
Patrick Hebron, Video Library (Summer 2011)
Peter Kalauskas, Library/Tool/Mode Install Utility (Summer, Fall 2011)
Andreas Schlegel, Libraries (Winter 2008 - Summer 2011)
Harshani Nawarathna, Processing Development Environment (Summer 2011)
Cindy Chi, Reference Editing (Summer 2011)
- Jonathan Feinberg, Parsing & Android Hacking (Spring 2011)
+ Jonathan Feinberg, Parsing & Android Hacking (Spring 2011)
Chris Lonnen, Processing Development Environment (Summer 2011)
Eric Jordan, Graphics Weapon (2007 - 2009)
Tom Carden, Processing Hacks Director (Summer 2005 - Fall 2008)
@@ -132,13 +111,9 @@
People. Processing is a comm
Burak Arikan, Turkish
-
-
-
-
We offer a special "Thank You!" to Sami Arola for writing the base of the original P3D
- and Simon Greenwold for incorporting camera and lights. Tom Carden contributed great
+ and Simon Greenwold for incorporating camera and lights. Tom Carden contributed great
energy by co-creating Processing Hacks and maintaining Processing Blogs. Andreas Schlegel
did amazing work for over three years organizing the Contributed Libraries and building
templates and documentation.
diff --git a/content/static/shop/index.html b/content/static/shop/index.html
index 64177106e..bcfd0ba95 100644
--- a/content/static/shop/index.html
+++ b/content/static/shop/index.html
@@ -114,7 +114,7 @@
If you're interested in buying a book about Processing,
Learning Processing, Second Edition: A Beginner's Guide to Programming Images, Animation, and Interaction
Daniel Shiffman
» More info
- » Order from Amazon.com
+ » Order from Amazon.com
diff --git a/content/static/support.html b/content/static/support.html
new file mode 100644
index 000000000..2a8f77f05
--- /dev/null
+++ b/content/static/support.html
@@ -0,0 +1,48 @@
+
+
+
+ We need your help! Please support Processing by making a donation to the Processing Foundation. Your donation contributes to software development, education resources like code examples and tutorials, Fellowships, and community events.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ The Processing Foundation was established in 2012 after more than a decade of work with the Processing software. The Foundation’s mission is to promote software literacy within the visual arts, and visual literacy within technology-related fields — and to make these fields accessible to diverse communities. Our goal is to empower people of all interests and backgrounds to learn how to program and make creative work with code, especially those who might not otherwise have access to these tools and resources. You can read more about the history of Processing in the short essay "A Modern Prometheus."
+
diff --git a/content/static/tutorials/anatomy/index.html b/content/static/tutorials/anatomy/index.html
index 39423e74e..6fe27c928 100644
--- a/content/static/tutorials/anatomy/index.html
+++ b/content/static/tutorials/anatomy/index.html
@@ -61,7 +61,7 @@ Step 2: Some basic trigonometry
So, if you have a line of length r starting at (0,0) at an angle theta (θ), what are its coordinates in terms of x and y? If you know a little bit of
trigonometry, the answer is that the endpoint of the line is at (r cos θ, r sin θ). If you don’t
know trigonometry, take a look at this tutorial (a general and very light introduction to
- trigonometry), this tutorial (oriented towards Processing), and this example from chapter 13 of Learning Processing. In the following diagram, angles are drawn clockwise, which is how they are measured in Processing.
+ trigonometry), this tutorial (oriented towards Processing), and this example from chapter 13 of Learning Processing. In the following diagram, angles are drawn clockwise, which is how they are measured in Processing.
diff --git a/content/static/tutorials/android/index.html b/content/static/tutorials/android/index.html
index f339fd9ba..75a355092 100644
--- a/content/static/tutorials/android/index.html
+++ b/content/static/tutorials/android/index.html
@@ -121,7 +121,7 @@ Step Three: Running the App on a Device
Some helpful tips when you’re working with Processing & Android:
- I know I’ve said this before, but be patient. Canceling a process (ie. the emulator load or a device compile) can cause problems. If you do this inadvertently, you’re best off restarting Processing.
- - Make sure to check out the Processing Android Wiki, where you’ll find some troubleshooting advice, and some tips on how to get your sketches working properly on your device.
+ - Make sure to check out the Processing Android Wiki, where you’ll find some troubleshooting advice, and some tips on how to get your sketches working properly on your device.
This tutorial is for Processing version 2.0+. If you see any errors or have comments, please let us know. This tutorial is adapted from 'Processing & Android: Mobile App Development Made (Very) Easy' by Jer Thorp
diff --git a/content/static/tutorials/arraylist/index.html b/content/static/tutorials/arraylist/index.html
index 613ffee6a..5f24a6ad5 100644
--- a/content/static/tutorials/arraylist/index.html
+++ b/content/static/tutorials/arraylist/index.html
@@ -1,4 +1,4 @@
-In truth, we could use a simple array to manage our Particle objects. Some particle systems might have a fixed number of particles, and arrays are magnificently efficient in those instances. Processing also offers expand(), contract(), subset(), splice() and other methods for resizing arrays. However, for these examples, the Java class ArrayList (found in the java.util package: http://download.oracle.com/javase/6/docs/api/java/util/ArrayList.html) will prove to be the best solution.
Using an ArrayList is conceptually similar to a standard array, but the syntax is different. Here is some code (that assumes the existence of a generic Particle class) demonstrating identical results: first with an array, and second with an ArrayList.
+In truth, we could use a simple array to manage our Particle objects. Some particle systems might have a fixed number of particles, and arrays are magnificently efficient in those instances. Processing also offers expand(), contract(), subset(), splice() and other methods for resizing arrays. However, for these examples, the Java class ArrayList (found in the java.util package: https://docs.oracle.com/javase/8/docs/api/java/util/ArrayList.html) will prove to be the best solution.
Using an ArrayList is conceptually similar to a standard array, but the syntax is different. Here is some code (that assumes the existence of a generic Particle class) demonstrating identical results: first with an array, and second with an ArrayList.
// THE STANDARD ARRAY WAY
int total = 10;
diff --git a/content/static/tutorials/color/imgs/grayscale.svg b/content/static/tutorials/color/imgs/grayscale.svg
new file mode 100644
index 000000000..ece2648ff
--- /dev/null
+++ b/content/static/tutorials/color/imgs/grayscale.svg
@@ -0,0 +1,24 @@
+
+
+
+
diff --git a/content/static/tutorials/color/imgs/order.svg b/content/static/tutorials/color/imgs/order.svg
new file mode 100644
index 000000000..38176b1bb
--- /dev/null
+++ b/content/static/tutorials/color/imgs/order.svg
@@ -0,0 +1,20 @@
+
+
+
+
diff --git a/content/static/tutorials/color/index.html b/content/static/tutorials/color/index.html
index 9828644ef..c609f8d15 100644
--- a/content/static/tutorials/color/index.html
+++ b/content/static/tutorials/color/index.html
@@ -13,7 +13,7 @@ Daniel Shiffman
In the digital world, when we want to talk about a color, precision is required. Saying "Hey, can you make that circle bluish-green?" will not do. Color, rather, is defined as a range of numbers. Let's start with the simplest case: black & white or grayscale. 0 means black, 255 means white. In between, every other number—50, 87, 162, 209, and so on—is a shade of gray ranging from black to white.
-
+
Does 0-255 seem arbitrary to you?
@@ -40,7 +40,7 @@
Daniel Shiffman
In addition, if we draw two shapes, Processing will always use the most recently specified stroke and fill, reading the code from top to bottom.
-
+
@@ -66,7 +66,7 @@ RGB Color
-
+ Example: RGB color
background(255);
@@ -109,7 +109,7 @@ Color Transparency
-
+ Example: Alpha transparency
size(200,200);
diff --git a/content/static/tutorials/data/imgs/data_03_table.png b/content/static/tutorials/data/imgs/data_03_table.png
index d0ff43b2d..961ac434c 100644
Binary files a/content/static/tutorials/data/imgs/data_03_table.png and b/content/static/tutorials/data/imgs/data_03_table.png differ
diff --git a/content/static/tutorials/data/imgs/data_04_excel.jpg b/content/static/tutorials/data/imgs/data_04_excel.jpg
index 1406af987..c004098da 100755
Binary files a/content/static/tutorials/data/imgs/data_04_excel.jpg and b/content/static/tutorials/data/imgs/data_04_excel.jpg differ
diff --git a/content/static/tutorials/data/imgs/data_06_xml.jpg b/content/static/tutorials/data/imgs/data_06_xml.jpg
index 7a1a18035..10cadd588 100755
Binary files a/content/static/tutorials/data/imgs/data_06_xml.jpg and b/content/static/tutorials/data/imgs/data_06_xml.jpg differ
diff --git a/content/static/tutorials/data/imgs/data_07_weatherxml.jpg b/content/static/tutorials/data/imgs/data_07_weatherxml.jpg
index bc65c1042..e0de2e503 100755
Binary files a/content/static/tutorials/data/imgs/data_07_weatherxml.jpg and b/content/static/tutorials/data/imgs/data_07_weatherxml.jpg differ
diff --git a/content/static/tutorials/data/imgs/fig_18_01_user_input.png b/content/static/tutorials/data/imgs/fig_18_01_user_input.png
new file mode 100755
index 000000000..e4b8f4797
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_01_user_input.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_02_filetxt.png b/content/static/tutorials/data/imgs/fig_18_02_filetxt.png
new file mode 100755
index 000000000..2e82a2f1d
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_02_filetxt.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_03_datatxt.png b/content/static/tutorials/data/imgs/fig_18_03_datatxt.png
new file mode 100755
index 000000000..33a877bcb
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_03_datatxt.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_04_bargraph.png b/content/static/tutorials/data/imgs/fig_18_04_bargraph.png
new file mode 100755
index 000000000..ef797f982
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_04_bargraph.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_05_datacsv.png b/content/static/tutorials/data/imgs/fig_18_05_datacsv.png
new file mode 100755
index 000000000..6c75a3c9c
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_05_datacsv.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png b/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png
new file mode 100755
index 000000000..77de335e7
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png b/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png
new file mode 100755
index 000000000..64a8e5f79
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_08_rollover.png b/content/static/tutorials/data/imgs/fig_18_08_rollover.png
new file mode 100644
index 000000000..7b823a954
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_08_rollover.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png b/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png
new file mode 100755
index 000000000..8d5398cf2
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png b/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png
new file mode 100755
index 000000000..b4456ba92
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png b/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png
new file mode 100755
index 000000000..61acef65d
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png b/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png
new file mode 100644
index 000000000..402f9e213
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png b/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png
new file mode 100644
index 000000000..82fe0b68f
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png b/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png
new file mode 100755
index 000000000..f60db5375
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png b/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png
new file mode 100755
index 000000000..8535f1b6e
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_16_rss.png b/content/static/tutorials/data/imgs/fig_18_16_rss.png
new file mode 100755
index 000000000..1bdb2d482
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_16_rss.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_17_weather.png b/content/static/tutorials/data/imgs/fig_18_17_weather.png
new file mode 100755
index 000000000..f379ab30f
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_17_weather.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png b/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png
new file mode 100755
index 000000000..b58ced2a2
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png differ
diff --git a/content/static/tutorials/data/imgs/fig_18_19_thread.png b/content/static/tutorials/data/imgs/fig_18_19_thread.png
new file mode 100755
index 000000000..f79c43d28
Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_19_thread.png differ
diff --git a/content/static/tutorials/data/index-old.html b/content/static/tutorials/data/index-old.html
new file mode 100644
index 000000000..6221a4a80
--- /dev/null
+++ b/content/static/tutorials/data/index-old.html
@@ -0,0 +1,527 @@
+
+
+
+
+
+ This tutorial is from the book Learning Processing by Daniel Shiffman, published by Morgan Kaufmann, © 2008 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know.
+
+
+ Data
+ Daniel Shiffman
+
+
+
+ This tutorial picks up where the Strings and Drawing Text tutorial leaves off and examines how to use String objects as the basis for reading and writing data. We'll start by learning more sophisticated methods for manipulating Strings, searching in them, chopping them up, and joining them together. Afterwards, we'll see how these skills allow us to use input from data sources, such as text files, web pages, xml feeds, and 3rd party APIs and take a step into the world of data visualization.
+
+
+ Manipulating Strings
+
+
+ In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String class, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API.
+
+
+
+ Let's take a closer look at the following two String functions: indexOf() and substring(). indexOf() locates a sequence of characters within a String. It takes one argument, a search String, and returns a numeric value that corresponds to first occurrence of the search string inside of the string being searched.
+
+
+
+String search = "def";
+String toBeSearched = "abcdefghi";
+int index = toBeSearched.indexOf(search); // The value of index in this example is 3.
+
+
+
+ Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value and therefore can indicate "not found." After finding a search phrase within a String, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as "substring." The substring() function which takes two arguments, a start index and an end index and returns the substring in between the two indices.
+
+
+
+String alphabet = "abcdefghi";
+String sub = alphabet.substring(3,6); // The String sub is now "def".
+
+
+Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know. I know. Wouldn't it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it's actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index.
+
+Splitting and Joining Strings
+
+In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard. Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, we will often be presented that data in the form of an array of strings or as one long string. Depending on what we want to accomplish, it's useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy.
+
+"one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"}
+
+Let's take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the string to be split and the delimiter. (The delimiter can be a single character or a string. Note that in the code below the period is not set as a delimiter and therefore will be included in the last string in the array: "dog."
+
+
+// Splitting a String based on spaces
+String spaceswords = "The quick brown fox jumps over the lazy dog.";
+String[] list = split(spaceswords, " ");
+for (int i = 0; i < list.length; i++) {
+ println(list[i] + " " + i);
+}
+
+
+If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically to split() with one exception: any character that appears in the String qualifies as a delimiter. In the code below, the period is set as a delimiter and therefore will not be included in the last spot in the array: "dog"
+
+
+// Splitting a String based on a multiple delimiters
+String stuff = "hats & apples, cars + phones % elephants dog.";
+String[] list = splitTokens(stuff, " &,+.");
+for (int i = 0; i < list.length; i++) {
+ println(list[i] + " " + i);
+}
+
+
+If we are splitting numbers in a String the resulting array can be converted into an integer array with Processing's int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless we convert them first.
+
+
+// Calculate sum of a list of numbers in a String
+String numbers = "8,67,5,309";
+// Converting the String array to an int array
+int[] list = int(split(numbers, ','));
+int sum = 0;
+for (int i = 0; i < list.length; i++) {
+ sum = sum + list[i];
+}
+println(sum);
+
+
+The reverse of split() is join(). join() takes an array of Strings and joins them together into one long string. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a String of characters.
+
+Consider the following array:
+
+
+String[] lines = {"It", "was", "a", "dark", "and", "stormy", "night."};
+
+
+Using the + operator along with a for loop, we can join an array of strings together as follows:
+
+
+// Manual Concatenation
+String onelongstring = "";
+for (int i = 0; i < lines.length; i++) {
+ onelongstring = onelongstring + lines[i] + " ";
+}
+
+
+The join() function, however, allows us to bypass this process achieving the same result in only one line of code.
+
+
+// Using Processing's join()
+String onelongstring = join(lines," ");
+
+
+Reading and Writing Text Files
+
+Data can come from many different places: web sites, news feeds, databases, etc. To start, we'll demonstrate how to work with the simplest means of data retrieval data: reading from a text file.Text files can be used as a very simple database (we could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source.
+
+In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OSX TextEdit will do, just make sure you format the file as "plain text." It is also advisable to name the text files with the ".txt" extension, just to avoid any confusion. And just as with image files, these text files should be placed in the sketch's "data" directory in order for them to be recognized by the Processing sketch.
+
+Once the text file is in place, Processing's loadStrings() function is used to read the content of the file into an String array. The individual lines of text in the file each become an individual element in the array.
+
+
+
+
+// This code will print all the lines from the source text file.
+String[] lines = loadStrings("file.txt");
+println("there are " + lines.length + " lines");
+println(lines);
+
+
+Text from a file can be used to generate a simple visualization. Take the following data file.
+
+
+
+Here, we can load the numbers separated by commas and split them into an array of ints used to set color and height of rectangles.
+
+
+int[] data;
+
+void setup() {
+ size(200,200);
+ // Load text file as a string
+ String[] stuff = loadStrings("data.txt");
+ // Convert string into an array of integers using ',' as a delimiter
+ data = int(split(stuff[0],','));
+}
+
+void draw() {
+ background(255);
+ stroke(0);
+ for (int i = 0; i < data.length; i++) {
+ fill(data[i]);
+ rect(i*20,0,20,data[i]);
+ }
+}
+
+
+Text can also be written back to a data file with saveStrings(). saveStrings() writes an array of strings to a file, one line per string.
+
+
+String words = "apple bear cat dog";
+String[] list = split(words, ' ');
+
+// Writes the strings to a file, each on a separate line
+saveStrings("nouns.txt", list);
+
+
+There are cases, however, where you don't want to write a text file all at once. Rather, you want to continuously append to a file over time. This can be achieved with the PrintWriter class. Take the following example which writes saves mouseX and mouseY to a text file for each cycle through draw(), quitting when you press a key.
+
+
+PrintWriter output;
+
+void setup() {
+ // Create a new file in the sketch directory
+ output = createWriter("positions.txt");
+}
+
+void draw() {
+ point(mouseX, mouseY);
+ output.println(mouseX); // Write the coordinate to the file
+}
+
+void keyPressed() {
+ output.flush(); // Writes the remaining data to the file
+ output.close(); // Finishes the file
+ exit(); // Stops the program
+}
+
+
+Tabular Data
+
+You may have noticed that the graphing example above loads a text file with numbers separated by commas. Processing includes a Table class which will load a comma-separated (CSV) or tab-separated (TSV) file and automatically parse the data into columns and rows for you. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like:
+
+
+
+Instead of saying:
+
+
+String[] stuff = loadStrings("data.csv");
+
+
+We can now say:
+
+
+Table table = loadTable("data.csv");
+
+
+Now we've missed an important detail. Take a look at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a "header row." This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header" there are other options you can specify. For example if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page.
+
+
+Table table = loadTable("data.csv","header");
+
+
+Now that the table is loaded, we can look at how we grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid.
+
+
+
+In the above grid we can see that the data is organized in terms of rows and columns. One way to access the data would be to therefore request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x, y) location though in this case the y position (i.e. row) comes first. The following code requests a piece of data at a given (row, column) location.
+
+
+int val1 = table.getInt(2, 1); // val now has the value 235
+float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068
+String s = table.getString(0, 3); // s now has the value "Happy"
+
+
+While the numeric index is sometimes useful, it's generally going to be more convenient to access each piece of data by the column name. For example, we could pull out a specific row from the Table.
+
+
+TableRow row = table.getRow(2); // Gets the third row (index 2)
+
+
+Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table.
+
+Once we have the TableRow object, we can ask for data from some or all of the columns.
+
+
+int x = row.getInt("x"); // x has the value 273
+int y = row.getInt("y"); // y has the value 235
+float d = row.getFloat("diameter"); // d has the value 61.14072
+String s = row.getString("name"); // s has the value "Joyous"
+
+
+The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so with the method rows().
+
+
+for (TableRow row : table.rows()) {
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+ // Do something with the data of each row
+}
+
+
+If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows().
+
+In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString().
+
+
+// Update the value of column "x" to mouseX in a given TableRow.
+row.setInt("x",mouseX);
+
+
+To add a new row to a Table, simply call the method addRow() and set the values of each column.
+
+
+// Create a new row
+TableRow row = table.addRow();
+// Set the values of that row
+row.setFloat("x", mouseX);
+row.setFloat("y", mouseY);
+row.setFloat("diameter", random(40, 80));
+row.setString("name", "new label");
+
+
+To delete a row to a Table, simply call the method removeRow() and pass in the numeric index of the row you would like removed. The following code for example, removes the first row whenever the size of the table is greater than ten rows.
+
+
+// If the table has more than 10 rows
+if (table.getRowCount() > 10) {
+ // Delete the first row
+ table.removeRow(0);
+}
+
+
+For an example that creates objects from and saves objects to a Table, take a look at LoadSaveTable under Topics --> Advanced Data.
+
+XML Data
+
+For grabbing data from the web, an XML (Extensible Markup Language) feed is an excellent option (if available). Unlike HTML (which is designed to make content vieweable by a human's eyes) XML is designed to make content viewable by a computer and facilitate the sharing of data across different systems.
+
+XML organizes information in a tree structure. Let's imagine a list of students. Each student has an id number, name, address, e-mail, and telephone number. Each student's address has a city, state, and zip code. An XML tree for this dataset might look like the following:
+
+
+
+
+<?xml version="1.0" encoding="UTF-8"?>
+<students>
+ <student>
+ <id>001</id>
+ <name>Daniel Shiffman</name>
+ <phone>555-555-5555</phone>
+ <email>daniel@shiffman.net</email>
+ <address>
+ <street>123 Processing Way</street>
+ <city>Loops</city>
+ <state>New York</state>
+ <zip>01234</zip>
+ </address>
+ </student>
+ <student>
+ <id>002</id>
+ <name>Zoog</name>
+ <phone>555-555-5555</phone>
+ <email>zoog@planetzoron.uni</email>
+ <address>
+ <street>45.3 Nebula 5</street>
+ <city>Boolean City</city>
+ <state&tt;Booles</state>
+ <zip>12358</zip>
+ </address>
+ </student>
+</students>
+
+
+Note the similarities to object-oriented programming. We could think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an id, a name, a phone number, an e-mail address, and a mailing address. The mailing address is also an object that also has multiple pieces of data, such as street, city, state, and zip.
+
+Let's look at Yahoo's XML feed for weather data. Here is the raw XML source (Note I have edited it for simplification purposes).
+
+
+<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
+<rss version="2.0" xmlns:yweather="http://xml.weather.yahoo.com/ns/rss/1.0">
+ <channel>
+ <item>
+ <title>Conditions for New York, NY at 3:51 pm EST</title>
+ <geo:lat>40.67</geo:lat>
+ <geo:long>-73.94</geo:long>
+ <link>http://xml.weather.yahoo.com/forecast/USNY0996_f.html</link>
+ <pubDate>Mon, 20 Feb 2006 3:51 pm EST</pubDate>
+ <yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/>
+ <yweather:forecast day="Mon" date="20 Feb 2006" low="25" high="37" text="Clear" code="31"/>
+ </item>
+ </channel>
+</rss>
+
+
+And here is the data mapped in the tree structure.
+
+
+
+You may be wondering what the top level "RSS" is all about. Yahoo's XML weather data is provided in RSS format. RSS stands for "Really Simple Syndication" and is a standardized XML format for syndicating web content (such as news articles, etc.)
+
+Now that we have a handle on the tree structure, we should look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, i.e. <channel> and an end tag, i.e. </channel>. Some of these elements have content between the tags:
+
+
+<title>Conditions for New York, NY at 3:51 pm EST</title>
+
+
+and some have attributes (formatted by attribute name equals attribute value in quotes):
+
+
+<yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/>
+
+
+Knowing this format, we could certainly be clever with our use of split(), indexOf(), and substring() to find the pieces we want in the raw XML. The point here, however, is that because XML is a standard format, we don't have to do this. Rather, we can use an XML parser. In Processing, the XML parser is called just that: XML.
+
+
+XML xml = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003");
+
+
+Here, instead of loadStrings() or loadTable(), we're now calling loadXML() and passing in the address (URL or local file) of our XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram, we see that we can find the current temperature via the following path:
+
+
+- The root of the tree is RSS.
+- RSS has a child named channel.
+- Channel has a child named item.
+- Item has a child named yweather:condition.
+- The temperature is stored in yweather:condition as the attribute temp.
+
+
+We could translate the above into code as follows:
+
+
+XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1
+XML channel = root.getChild("channel"); // Step 2
+XML item = channel.getChild("item"); // Step 3
+XML yweather = item.getChild("yweather:condition"); // Step 4
+int temperature = yweather.getInt("temp"); // Step 5
+
+
+This is a bit long-winded, however, and so can be compressed down into one (or three as below) lines of code.
+
+
+XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003); // Step 1
+XML forecast = root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4
+int temperature = forecast.getInt("temp"); // Step 5
+
+
+Finally, the second line of code above can be further condensed to:
+
+
+XML forecast = xml.getChild("channel/item/yweather:condition"); // Steps 2-4
+
+
+It should also be noted that we're accessing the child nodes by their name (i.e. "channel", "item", etc.), but they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children. In LoadSaveTable, we used a series of comma separated values in a text file to store information related to Bubble objects. An XML document can also be used in the same manner. Consider the following XML document:
+
+
+<?xml version="1.0" encoding="UTF-8"?>
+<bubbles>
+ <bubble>
+ <position x="160" y="103"/>
+ <diameter>43.19838</diameter>
+ <label>Happy</label>
+ </bubble>
+ <bubble>
+ <position x="372" y="137"/>
+ <diameter>52.42526</diameter>
+ <label>Sad</label>
+ </bubble>
+ <bubble>
+ <position x="273" y="235"/>
+ <diameter>61.14072</diameter>
+ <label>Joyous</label>
+ </bubble>
+ <bubble>
+ <position x="121" y="179"/>
+ <diameter>44.758068</diameter>
+ <label>Melancholy</label>
+ </bubble>
+</bubbles>
+
+
+In the above XML, the root element is "bubbles" which has four children. Each child "bubble" has 3 children, "position", "diameter", and "label." The "position" element has two attributes, "x" and "y." To access the list of all XML nodes "bubble" we can use the getChildren() method, passing in the name "bubble"
+
+
+// Load an XML document
+XML xml = loadXML("bubbles.xml");
+
+// Get all the child elements
+XML[] children = xml.getChildren("bubble");
+
+
+Once we have the array of XML objects, we can iterate over them, accessing the individual pieces of data for each "bubble". Notice how the syntax for getting XML attributes (in this case, "x" and "y" of the position element is slightly different than pulling content directly from an element (in this case, "diameter" and "label").
+
+
+for (int i = 0; i < bubbles.length; i++) {
+
+ // The position element has two attributes: x and y
+ XML positionElement = children[i].getChild("position");
+ // Note how with attributes we can get an integer or float via getInt() and getFloat()
+ float x = positionElement.getInt("x");
+ float y = positionElement.getInt("y");
+
+ // The diameter is the content of the child named "diamater"
+ XML diameterElement = children[i].getChild("diameter");
+ // Note how with the content of an XML node, we retrieve via getIntContent() and getFloatContent()
+ float diameter = diameterElement.getFloatContent();
+
+ // The label is the content of the child named "label"
+ XML labelElement = children[i].getChild("label");
+ String label = labelElement.getContent();
+}
+
+
+XML elements can be added and removed from the XML tree with the addChild() and removeChild() methods.
+
+For the full example that creates objects from and saves objects to an XML document, take a look at LoadSaveXML under Topics --> Advanced Data.
+
+Threads
+
+You are likely familiar with the idea of writing a program that follows a specific sequence of steps -- setup() first then draw() over and over and over again! A Thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the "Animation" thread. Other threads sequences, however, can run independently of the main Processing sketch. In fact, you can launch any number of threads at one time and they will all run concurrently.
+
+Processing does this all the time, whenever you write an event callback, such as serialEvent(), or captureEvent(), etc. these functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful whenever you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network (XML, database, etc.) If a separate thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread. To create independent, asynchronous threads, you can use the thread() function built into Processing.
+
+
+void setup() {
+ size(200,200);
+ thread("someFunction");
+}
+
+void draw() {
+
+}
+
+void someFunction() {
+ // This function will run as a thread when called via
+ // thread("someFunction") as it was in setup!
+}
+
+
+The thread() function receives a String as an argument. The String should match the name of the function you want to run as a thread. This is especially useful in sketches that grab data for the web. Rather than have the animation freeze while the sketch is waiting to retrieve data, the sketch can continue to loop through draw() updating the data when the thread is completed. In these cases, a boolean variable can be useful to track the status of the thread.
+
+
+boolean loading = false;
+
+
+The function that loads the data can then set loading equal to true at the start and false at the end.
+
+
+void loadData() {
+ loading = true;
+
+ ///////////////////////////////////
+ // All of the data retrival code //
+ ///////////////////////////////////
+
+ loading = false;
+}
+
+
+In draw(), you can choose to display something to indicate the thread is running (when loading equals true).
+
+
+void draw() {
+ if (loading) {
+ // Draw something to indicate loading
+ }
+}
+
+
+
+Two examples that follow this methodology can be found under Topics --> Advanced Data in the Processing examples.
+
+While using the thread() function is a very simple way of getting an independent thread, it should be noted that it is somewhat limited. Being able to make a thread object is a great deal more powerful, and this can be done by extending the Java Thread class.
+
+
+
+
+
+
diff --git a/content/static/tutorials/data/index.html b/content/static/tutorials/data/index.html
index 0df744e1b..ebafcce92 100644
--- a/content/static/tutorials/data/index.html
+++ b/content/static/tutorials/data/index.html
@@ -3,7 +3,7 @@
- This tutorial is from the book Learning Processing by Daniel Shiffman, published by Morgan Kaufmann, © 2008 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know.
+ This tutorial is from the book Learning Processing, 2nd Edition by Daniel Shiffman, published by Morgan Kaufmann, © 2015 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know.
Data
@@ -17,281 +17,771 @@ Daniel Shiffman
Manipulating Strings
- In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String class, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API.
-
-
-
- Let's take a closer look at the following two String functions: indexOf() and substring(). indexOf() locates a sequence of characters within a String. It takes one argument, a search String, and returns a numeric value that corresponds to first occurrence of the search string inside of the string being searched.
-
-
+ In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API.
+
+ Let's take a closer look at the following two String functions: indexOf() and substring().
+ indexOf() locates a sequence of characters within a string. It takes one argument — a search string — and returns a numeric value that corresponds to the first occurrence of the search string inside of the String object being searched.
String search = "def";
String toBeSearched = "abcdefghi";
int index = toBeSearched.indexOf(search); // The value of index in this example is 3.
-
- Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value and therefore can indicate "not found." After finding a search phrase within a String, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as "substring." The substring() function which takes two arguments, a start index and an end index and returns the substring in between the two indices.
-
-
+ Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value in the string itself, and therefore can indicate "not found." There are no negative indices in a string of characters or in an array.
+
+ After finding a search phrase within a string, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as a substring and substrings are made with the substring() function which takes two arguments, a start index and an end index. substring() returns the substring in between the two indices.
+
String alphabet = "abcdefghi";
-String sub = alphabet.substring(3,6); // The String sub is now "def".
+String sub = alphabet.substring(3, 6); // The String sub is now "def".
-
-Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know. I know. Wouldn't it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it's actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index.
+ Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know, I know. Wouldn’t it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it’s actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index.
+
Splitting and Joining Strings
-In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard. Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, we will often be presented that data in the form of an array of strings or as one long string. Depending on what we want to accomplish, it's useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy.
-
-"one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"}
-
-Let's take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the string to be split and the delimiter. (The delimiter can be a single character or a string. Note that in the code below the period is not set as a delimiter and therefore will be included in the last string in the array: "dog."
-
+
+ In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard.
+
+
+
+PFont f;
+
+// Variable to store text currently being typed
+String typing = "";
+// Variable to store saved text when return is hit
+String saved = "";
+
+void setup() {
+ size(300, 200);
+ f = createFont("Arial", 16);
+}
+
+void draw() {
+ background(255);
+ int indent = 25;
+
+ // Set the font and fill for text
+ textFont(f);
+ fill(0);
+
+ // Display everything
+ text("Click in this sketch and type. \nHit return to save what you typed.", indent, 40);
+ text(typing, indent, 90);
+ text(saved, indent, 130);
+}
+
+void keyPressed() {
+ // If the return key is pressed, save the String and clear it
+ if (key == '\n') {
+ saved = typing;
+ typing = "";
+ // Otherwise, concatenate the String
+ } else {
+ typing = typing + key;
+ }
+}
+
+ Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, you might get hold of that data in the form of an array of strings or as one long string. Depending on what you want to accomplish, it’s useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy.
+
+
+ "one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"}
+
+
+ Let’s take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the String object to be split and the delimiter. (The delimiter can be a single character or a string.) In the code below, the period is not set as a delimiter and therefore will be included in the last string in the array: “dog.” Note how printArray() can be used to print the contents of an array and their corresponding indices to the message console.
-// Splitting a String based on spaces
+// Splitting a string based on spaces
String spaceswords = "The quick brown fox jumps over the lazy dog.";
String[] list = split(spaceswords, " ");
-for (int i = 0; i < list.length; i++) {
- println(list[i] + " " + i);
-}
+printArray(list);
-
-If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically to split() with one exception: any character that appears in the String qualifies as a delimiter. In the code below, the period is set as a delimiter and therefore will not be included in the last spot in the array: "dog"
-
+ Here is an example using a comma as the delimiter (this time passing in a single character: ','.)
+
-// Splitting a String based on a multiple delimiters
-String stuff = "hats & apples, cars + phones % elephants dog.";
-String[] list = splitTokens(stuff, " &,+.");
-for (int i = 0; i < list.length; i++) {
- println(list[i] + " " + i);
-}
+// Splitting a string based on commas
+String commaswords = "The,quick,brown,fox,jumps,over,the,lazy,dog.";
+String[] list = split(commaswords, ",");
+printArray(list);
-
-If we are splitting numbers in a String the resulting array can be converted into an integer array with Processing's int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless we convert them first.
-
+ If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically as split() with one exception: any character that appears in the passed string qualifies as a delimiter.) In the code below, the period is specified as a delimiter and therefore will not be included in the last string in the array: “dog”.
+
+// Splitting a String based on multiple delimiters
+String stuff = "hats & apples, cars + phones % elephants dog.";
+String[] list = splitTokens(stuff, " &,+." );
+printArray(list);
+
+ If you are splitting numbers in a string, the resulting array can be converted into an integer array with Processing’s int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless you convert them first.
// Calculate sum of a list of numbers in a String
String numbers = "8,67,5,309";
// Converting the String array to an int array
-int[] list = int(split(numbers, ','));
+int[] list = int(split(numbers, ','));
int sum = 0;
-for (int i = 0; i < list.length; i++) {
+for (int i = 0; i<list.length; i++ ) {
sum = sum + list[i];
}
-println(sum);
+println(sum);
-
-The reverse of split() is join(). join() takes an array of Strings and joins them together into one long string. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a String of characters.
-
-Consider the following array:
-
+ The reverse of split() is join(). join() takes an array of strings and joins them together into one long String object. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a string of characters.
+
+
+
+ Consider the following array:
String[] lines = {"It", "was", "a", "dark", "and", "stormy", "night."};
-
-Using the + operator along with a for loop, we can join an array of strings together as follows:
-
+ Using the “+” operator along with a for loop, you can join a string together as follows:
// Manual Concatenation
String onelongstring = "";
for (int i = 0; i < lines.length; i++) {
- onelongstring = onelongstring + lines[i] + " ";
+ onelongstring = onelongstring + lines[i] + " ";
}
-
-The join() function, however, allows us to bypass this process achieving the same result in only one line of code.
-
+ The join() function, however, allows you to bypass this process, achieving the same result in only one line of code.
// Using Processing's join()
-String onelongstring = join(lines," ");
+String onelongstring = join(lines, " ");
+
-Reading and Writing Text Files
+Dealing with Data
-Data can come from many different places: web sites, news feeds, databases, etc. To start, we'll demonstrate how to work with the simplest means of data retrieval data: reading from a text file.Text files can be used as a very simple database (we could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source.
-
-In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OSX TextEdit will do, just make sure you format the file as "plain text." It is also advisable to name the text files with the ".txt" extension, just to avoid any confusion. And just as with image files, these text files should be placed in the sketch's "data" directory in order for them to be recognized by the Processing sketch.
-
-Once the text file is in place, Processing's loadStrings() function is used to read the content of the file into an String array. The individual lines of text in the file each become an individual element in the array.
-
-
+
+ Data can come from many different places: websites, news feeds, spreadsheets, databases, and so on. Let's say you've decided to make a map of the world's flowers. After searching online you might find a PDF version of a flower encyclopedia, or a spreadsheet of flower genera, or a JSON feed of flower data, or a REST API that provides geolocated lat/lon coordinates, or some web page someone put together with beautiful flower photos, and so on and so forth. The question inevitably arises: “I found all this data; which should I use, and how do I get it into Processing?”
+
+
+
+ If you are really lucky, you might find a Processing library that hands data to you directly with code. Maybe the answer is to just download this library and write some code like:
+
+import flowers.*;
+void setup() {
+ FlowerDatabase fdb = new FlowerDatabase();
+ Flower sunflower = fdb.findFlower("sunflower");
+ float h = sunflower.getAverageHeight();
+}
+
+ In this case, someone else has done all the work for you. They've gathered data about flowers and built a Processing library with a set of functions that hands you the data in an easy-to-understand format. This library, sadly, does not exist (not yet), but there are some that do. For example, YahooWeather is a library by Marcel Schwittlick that grabs weather data from Yahoo for you, allowing you to write code like weather.getWindSpeed() or weather.getSunrise() and more. There is still plenty of work to do in the case of using a library.
+
+
+
+ Let's take another scenario. Say you’re looking to build a visualization of Major League Baseball statistics. You can't find a Processing library to give you the data but you do see everything you’re looking for at mlb.com. If the data is online and your web browser can show it, shouldn't you be able to get the data in Processing? Passing data from one application (like a web application) to another (say, your Processing sketch) is something that comes up again and again in software engineering. A means for doing this is an API or “application programming interface”: a means by which two computer programs can talk to each other. Now that you know this, you might decide to search online for “MLB API”. Unfortunately, mlb.com does not provide its data via an API. In this case you would have to load the raw source of the website itself and manually search for the data you’re looking for. While possible, this solution is much less desirable given the considerable time required to read through the HTML source as well as program algorithms for parsing it.
+
+
+
+ Each means of getting data comes with its own set of challenges. The ease of using a Processing library is dependent on the existence of clear documentation and examples. But in just about all cases, if you can find your data in a format designed for a computer (spreadsheets, XML, JSON, etc.), you'll be able to save some time in the day for a nice walk outside.
+
+
+
+ One other note worth a mention about working with data. When developing an application that involves a data source, such as a data visualization, it’s sometimes useful to develop with “dummy” or “fake” data. You don't want to be debugging your data retrieval process at the same time as solving problems related to algorithms for drawing. In keeping with my one-step-at-a-time mantra, once the meat of the program is completed with dummy data, you can then focus solely on how to retrieve the actual data from the real source. You can always use random or hard-coded numbers into your code when you’re experimenting with a visual idea and connect the real data later.
+
+Working with Text Files
+
+
+ Let's begin by working with the simplest means of data retrieval: reading from a text file. Text files can be used as a very simple database (you could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source.
+
+
+
+ In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OS X TextEdit will do; just make sure you format the file as “plain text.” It is also advisable to name the text files with the “.txt” extension, to avoid any confusion. And just as with image files, these text files should be placed in the sketch’s “data” directory in order for them to be recognized by the Processing sketch.
+
+
+ Once the text file is in place, Processing’s loadStrings() function is used to read the content of the file into a String array. The individual lines of text in the file each become an individual element in the array.
+
+
// This code will print all the lines from the source text file.
String[] lines = loadStrings("file.txt");
-println("there are " + lines.length + " lines");
-println(lines);
+println("There are " + lines.length + " lines.");
+printArray(lines);
-
-Text from a file can be used to generate a simple visualization. Take the following data file.
-
-
-
-Here, we can load the numbers separated by commas and split them into an array of ints used to set color and height of rectangles.
-
+ To run the code, create a text file called “file.txt,” type a bunch of lines in that file, and place it in your sketch’s data directory.
Text from a file can be used to generate a simple visualization. Take the following data file.
+
+
+
+The results of visualizing this data are shown below.
+
+
+Graphing Comma-Separated Numbers from a Text File
+
+
int[] data;
void setup() {
- size(200,200);
- // Load text file as a string
- String[] stuff = loadStrings("data.txt");
+ size(200, 200);
+ // Load text file as a String
+ String[] stuff = loadStrings("data.csv");
// Convert string into an array of integers using ',' as a delimiter
- data = int(split(stuff[0],','));
+ data = int(split(stuff[0], ','));
}
void draw() {
background(255);
stroke(0);
- for (int i = 0; i < data.length; i++) {
- fill(data[i]);
- rect(i*20,0,20,data[i]);
+ for (int i = 0; i<data.length; i++) {
+ // Use array of ints to set the color and height of each rectangle.
+ rect(i*20, 0, 20, data[i]);
}
+ noLoop();
}
+ Looking at how to parse a csv file with split() was a nice learning exercise. In truth, dealing with csv files (which can easily be generated from spreadsheet software such as Google docs) is such a common activity that Processing has an entire built-in class called Table to handle the parsing for you.
+
+
+Tabular Data
-Text can also be written back to a data file with saveStrings(). saveStrings() writes an array of strings to a file, one line per string.
+
+ A table consists of data arranged as a set of rows and columns, also called “tabular data.” If you've ever used a spreadsheet, this is tabular data. Processing's loadTable() function takes comma-separated (csv) or tab-separated (tsv) values and automatically places the contents into a Table object storing the data in columns and rows. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like:
+
+
+
+
+
+ Instead of saying:
+
+String[] stuff = loadStrings("data.csv");
+
+ We can now say:
+
+Table table = loadTable("data.csv");
+
+ Now I've missed an important detail. Take a look again at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a header row. This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header", there are other options you can specify. For example, if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page.
+
+Table table = loadTable("data.csv", "header");
+
+ Now that the table is loaded, I can show how you grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid.
+
+
+
+ In the above grid you can see that the data is organized in terms of rows and columns. One way to access the data, therefore, would be to request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x,y) location, though in this case the y position (row) comes first. The following code requests a piece of data at a given (row, column) location.
+
+int val1 = table.getInt(2, 1); // val now has the value 235
+float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068
+
+String s = table.getString(0, 3); // s now has the value “Happy”
+
+ While the numeric index is sometimes useful, it’s generally going to be more convenient to access each piece of data by the column name. For example, I could pull out a specific row from the Table.
+
+TableRow row = table.getRow(2); // Gets the third row (index 2)
+
+ Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table.
+
+
+
+ Once I have the TableRow object, I can ask for data from some or all of the columns.
-String words = "apple bear cat dog";
-String[] list = split(words, ' ');
+int x = row.getInt("x"); // // x has the value 273
+
+int y = row.getInt("y"); // y has the value 235
+
+float d = row.getFloat("diameter"); // d has the value 61.14072
-// Writes the strings to a file, each on a separate line
-saveStrings("nouns.txt", list);
+String s = row.getString("name"); // s has the value “Joyous”
+ The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so in a loop with a counter accessing each row one at a time. The total number of available rows can be retrieved with getRowCount().
+
+for (int i = 0; i<table.getRowCount(); i++) {
-There are cases, however, where you don't want to write a text file all at once. Rather, you want to continuously append to a file over time. This can be achieved with the PrintWriter class. Take the following example which writes saves mouseX and mouseY to a text file for each cycle through draw(), quitting when you press a key.
+ // Access each row of the table one at a time, in a loop.
+ TableRow row = table.getRow(i);
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+
+ // Do something with the data of each row
+
+}
+
+ If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows().
+
+
+
+ In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString().
+
+row.setInt("x", mouseX); // Update the value of column "x" to mouseX in a given TableRow.
+
+ To add a new row to a Table, simply call the method addRow() and set the values of each column.
+
+//Create a new row.
+TableRow row = table.addRow();
+//Set the values of all columns in that row.
+row.setFloat("x", mouseX);
+row.setFloat("y", mouseY);
+row.setFloat("diameter", random(40, 80));
+row.setString("name", "new label");
+
+ To delete a row, simply call the method removeRow() and pass in the numeric index of the row you would like removed. For example, the following code removes the first row whenever the size of the table is greater than ten rows.
-PrintWriter output;
+// If the table has more than 10 rows
+if (table.getRowCount()>10) {
+
+//Delete the first row (index 0).
+ table.removeRow(0);
+}
+
+ The following example puts all of the above code together. Notice how each row of the table contains the data for a Bubble object.
+
+
+
+Loading and Saving Tabular Data
+
+
+
+
+
+// The data from the Table object will fill the array of Bubble objects
+Table table;
+Bubble[] bubbles;
void setup() {
- // Create a new file in the sketch directory
- output = createWriter("positions.txt");
+ size(480, 360);
+ loadData();
}
void draw() {
- point(mouseX, mouseY);
- output.println(mouseX); // Write the coordinate to the file
+ background(255);
+ // Display all bubbles
+ for (int i = 0; i<bubbles.length; i++) {
+ bubbles[i].display();
+ }
}
-void keyPressed() {
- output.flush(); // Writes the remaining data to the file
- output.close(); // Finishes the file
- exit(); // Stops the program
+void loadData() {
+ // "header" indicates the file has header row. The size of the array
+ // is then determined by the number of rows in the table.
+ table = loadTable("data.csv", "header");
+ bubbles = new Bubble[table.getRowCount()];
+
+
+ for (int i = 0; i<table.getRowCount(); i++) {
+ // Iterate over all the rows in a table.
+ TableRow row = table.getRow(i);
+
+
+ // Access the fields via their column name (or index).
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+ // Make a Bubble object out of the data from each row.
+ bubbles[i] = new Bubble(x, y, d, n);
+ }
}
-
-Tabular Data
-You may have noticed that the graphing example above loads a text file with numbers separated by commas. Processing includes a Table class which will load a comma-separated (CSV) or tab-separated (TSV) file and automatically parse the data into columns and rows for you. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like:
+void mousePressed() {
+ // When the mouse is pressed, create a new row and set the values for each column of that row.
+ TableRow row = table.addRow();
+ row.setFloat("x", mouseX);
+ row.setFloat("y", mouseY);
+ row.setFloat("diameter", random(40, 80));
+ row.setString("name", "Blah");
-
+ // If the table has more than 10 rows, delete the oldest row.
+ if (table.getRowCount()>10) {
+ table.removeRow(0);
+ }
-Instead of saying:
+ // This writes the table back to the original CSV file
+ // and reloads the file so that what's drawn matches.
+ saveTable(table, "data/data.csv");
+ loadData();
+}
-
-String[] stuff = loadStrings("data.csv");
+// This simple Bubble class draws a circle to the window
+// and displays a text label when the mouse hovers.
+class Bubble {
+ float x, y;
+ float diameter;
+ String name;
+
+ boolean over = false;
+
+ // Create the Bubble
+ Bubble(float tempX, float tempY, float tempD, String s) {
+ x = tempX;
+ y = tempY;
+ diameter = tempD;
+ name = s;
+ }
+
+ // Checking if mouse is over the bubble
+ void rollover(float px, float py) {
+ float d = dist(px, py, x, y);
+ if (d<diameter/2) {
+ over = true;
+ } else {
+ over = false;
+ }
+ }
+
+ // Display the Bubble
+ void display() {
+ stroke(0);
+ strokeWeight(2);
+ noFill();
+ ellipse(x, y, diameter, diameter);
+ if (over) {
+ fill(0);
+ textAlign(CENTER);
+ text(name, x, y+diameter/2+20);
+ }
+ }
+}
-
-We can now say:
+
+
+ Here, the distance between a given point and a circle's center is compared to that circle's radius as depicted:
+
+
+
+
+
+ In the code below, the function returns a boolean value (true or false) depending on whether the point (mx,my) is inside the circle. Notice how radius is equal to half the diameter.
+
-Table table = loadTable("data.csv");
+boolean rollover(int mx, int my) {
+ if (dist(mx, my, x, y)<diameter/2) {
+ return true;
+ } else {
+ return false;
+ }
+}
+
+Data that is not in a Standardized Format
-Now we've missed an important detail. Take a look at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a "header row." This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header" there are other options you can specify. For example if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page.
-
+
+ What if your data is not in a standard format like a table, how do you deal with it then? One of the nice features about loadStrings() is that in addition to pulling text from a file, you can also grab a URL. For example:
-Table table = loadTable("data.csv","header");
+String[] lines = loadStrings("http://www.yahoo.com");
+ When you send a URL path into loadStrings(), you get back the raw HTML (Hypertext Markup Language) source of the requested web page. It’s the same stuff that appears upon selecting “View Source” from a browser’s menu options. You don’t need to be an HTML expert to follow this section, but if you are not familiar at all with HTML, you might want to read http://en.wikipedia.org/wiki/HTML.
+
+
+
+ Unlike with the comma-delimited data from a text file that was specially formatted for use in a Processing sketch, it’s not practical to have the resulting raw HTML stored in an array of strings (each element representing one line from the source). Converting the array into one long string can make things a bit simpler. As you saw earlier in the chapter, this can be achieved using join().
+
+String onelongstring = join(lines, " ");
+
+ When pulling raw HTML from a web page, it’s likely you do not want all of the source, but just a small piece of it. Perhaps you’re looking for weather information, a stock quote, or a news headline. You can take advantage of the text manipulation functions you learned — indexOf(), substring(), and length() — to find pieces of data within a large block of text. Take, for example, the following String object:
+
+String stuff = "Number of apples:62. Boy, do I like apples or what!";
+
+Let’s say I want to pull out the number of apples from the above text. My algorithm would be as follows:
+
+
+ -
+
Find the end of the substring “apples:” Call it start.
+
+ -
+
Find the first period after “apples:” Call it end.
+
+ -
+
Make a substring of the characters between start and end.
+
+ -
+
Convert the string to a number (if I want to use it as such).
+
+
+
+
+ In code, this looks like:
+
+int start = stuff.indexOf("apples:" ) + 7; // STEP 1
+// The index where a string ends can be found by
+// searching for that string and adding its length (here, 8).
+int end = stuff.indexOf(".", start); // STEP 2
+String apples = stuff.substring(start, end); // STEP 3
+int apple_no = int(apples); // STEP 4
+
+ The above code will do the trick, but I should be a bit more careful to make sure I don’t run into any errors if I do not find the string I am searching for. I can add some error checking and generalize the code into a function:
+
+// A function that returns a substring between two substrings.
+// If the beginning of end "tag" is not found, the function returns an empty string.
+String giveMeTextBetween(String s, String startTag, String endTag) {
+ // Find the index of the beginning tag
+ int startIndex = s.indexOf(startTag);
+ // If I don't find anything
+ if (startIndex == -1) {
+ return "";
+ }
+ // Move to the end of the beginning tag
+ startIndex += startTag.length();
-Now that the table is loaded, we can look at how we grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid.
-
-
-
-In the above grid we can see that the data is organized in terms of rows and columns. One way to access the data would be to therefore request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x, y) location though in this case the y position (i.e. row) comes first. The following code requests a piece of data at a given (row, column) location.
-
+ // Find the index of the end tag
+ int endIndex = s.indexOf(endTag, startIndex);
+
+ // If I don't find the end tag,
+ if (endIndex == -1) {
+ return "";
+ }
+ // Return the text in between
+ return s.substring(startIndex, endIndex);
+}
+
+ With this technique, you are ready to connect to a website from within Processing and grab data to use in your sketches. For example, you could read the HTML source from nytimes.com and look for today’s headlines, search finance.yahoo.com for stock quotes, count how many times the word “flower” appears on your favorite blog, and so on. However, HTML is an ugly, scary place with inconsistently formatted pages that are difficult to reverse engineer and parse effectively. Not to mention the fact that companies change the source code of web pages rather often, so any example that I might make while I am writing this paragraph might break by the time you read this paragraph.
+
+
+
+ For grabbing data from the web, an XML (Extensible Markup Language) or JSON (JavaScript Object Notation) feed will prove to be more reliable and easier to parse. Unlike HTML (which is designed to make content viewable by a human’s eyes) XML and JSON are designed to make content viewable by a computer and facilitate the sharing of data across different systems. Most data (news, weather, and more) is available this way, and I will look at examples in #beginner_xml and #JSON. Though much less desirable, manual HTML parsing is still useful for a couple reasons. First, it never hurts to practice text manipulation techniques that reinforce key programming concepts. But more importantly, sometimes there is data you really want that is not available in an API format, and the only way to get it is with such a technique. (I should also mention that regular expressions, an incredibly powerful techinque in text pattern matching, could also be employed here. As much as I love regex, it’s unfortunately beyond the scope of this tutorial.)
+
+
+
+ An example of data only available as HTML is the Internet Movie Database. IMDb contains information about movies sorted by year, genre, ratings, etc. For each movie, you can find the cast and crew list, a plot summary, running time, a movie poster image, the list goes on. However, IMDb has no API and does not provide its data as XML or JSON. Pulling the data into Processing therefore requires a bit of detective work. Let's look at the page for the Shaun the Sheep Movie
+
+
+
+
+
+ Looking in the HTML source from the above URL, I find a giant mess of markup.
+
+
+
+
+
+ It’s up to me to pore through the raw source and find the data I am looking for. Let's say I want to know the running time of the movie and grab the movie poster image. After some digging, I find that the movie is 139 minutes long as listed in the following HTML.
-int val1 = table.getInt(2, 1); // val now has the value 235
-float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068
-String s = table.getString(0, 3); // s now has the value "Happy"
+<div class="txt-block">
+ <h4 class="inline">Runtime:</h4>
+ <time itemprop="duration" datetime="PT139M">139 min</time>
+</div>
+ For any given movie, the running time itself will be variable, but the HTML structure of the page will stay the same. I can therefore deduce that running time will always appear in between:
+
+<time itemprop="duration" datetime="PT139M">
+
+ and:
+
+</time>
+
+ Knowing where the data starts and ends, I can use giveMeTextBetween() to pull out the running time. A quote in Java marks the beginning or end of a string. So how do you include an actual quote in a String object? The answer is via an “escape” sequence. A quote can be included using a backward slash, followed by a quote. For example: String q = "This String has a quote \"in it";
+
+String url = "http://www.imdb.com/title/tt0058331";
+String[] lines = loadStrings(url);
+// Get rid of the array in order to search the whole page
+String html = join(lines, " ");
-While the numeric index is sometimes useful, it's generally going to be more convenient to access each piece of data by the column name. For example, we could pull out a specific row from the Table.
+// Searching for running time
+String start = "";
+String runningtime = giveMeTextBetween(html, start, end);
+println(runningtime);
+ The following code retrieves both the running time and movie poster iamge from IMDb and displays it onscreen.
+
+
+ Parsing IMDb Manually
+
+
+
+String runningtime;
+PImage poster;
-Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table.
+void setup() {
+ size(300, 350);
+ loadData();
+}
-Once we have the TableRow object, we can ask for data from some or all of the columns.
+void draw() {
+ // Display all the stuff I want to display
+ background(255);
+ image(poster, 10, 10, 164, 250);
+ fill(0);
+ text("Shaun the Sheep", 10, 300);
+ text(runningtime, 10, 320);
+}
-
-int x = row.getInt("x"); // x has the value 273
-int y = row.getInt("y"); // y has the value 235
-float d = row.getFloat("diameter"); // d has the value 61.14072
-String s = row.getString("name"); // s has the value "Joyous"
-
+void loadData() {
+ String url = "http://www.imdb.com/title/tt2872750/";
+
+ // Get the raw HTML source into an array of strings (each line is one element in the array).
+ // The next step is to turn array into one long string with join().
+ String[] lines = loadStrings(url);
+ String html = join(lines, "");
+
+ String start = "";
+ runningtime = giveMeTextBetween(html, start, end);Searching for running time.
+
+ start = "";
+ // Search for the URL of the poster image.
+ String imgUrl = giveMeTextBetween(html, start, end);
+ // Now, load that image!
+ poster = loadImage(imgUrl);
+}
-The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so with the method rows().
+String giveMeTextBetween(String s, String before, String after) {
-
-for (TableRow row : table.rows()) {
- float x = row.getFloat("x");
- float y = row.getFloat("y");
- float d = row.getFloat("diameter");
- String n = row.getString("name");
- // Do something with the data of each row
+ // This function returns a substring between two substrings (before and after).
+ // If it can’t find anything it returns an empty string.
+ String found = "";
+
+ // Find the index of before
+ int start = s.indexOf(before);
+ if (start == -1) {
+ return "";
+ }
+
+ // Move to the end of the beginning tag
+ // and find the index of the "after" String
+ start += before.length();
+ int end = s.indexOf(after, start);
+ if (end == -1) {
+ return "";
+ }
+
+ // Return the text in between
+ return s.substring(start, end);
}
-If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows().
-
-In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString().
-
+
Text Analysis
+
+
+ Loading text from a URL need not only be an exercise in parsing out small bits of information. It’s possible with Processing to analyze large amounts of text found on the web from news feeds, articles, and speeches, to entire books. A nice source is Project Gutenberg which makes available thousands of public domain texts. Algorithms for analyzing text merits an entire book itself, but let’s look at some basic techniques.
+
+
+
+ A text concordance is an alphabetical list of words that appear in a book or body of text along with contextual information. A sophisticated concordance might keep a list of where each word appears (like an index) as well as which words appear next to which other words. In this case, I'm going to create a simple concordance, one that simply stores a list of words and their corresponding counts, i.e., how many times they appeared in the text. Concordances can be used for text analysis applications such as spam filtering or sentiment analysis. To accomplish this task, I am going to use the Processing built-in class IntDict.
+
+
+
+ As you learned earlier, an array is an ordered list of variables. Each element of the array is numbered and be accessed by its numeric index.
+
+
+
+ However, what if instead of numbering the elements of an array you could name them? This element is named “Sue,” this one “Bob,” this one “Jane,” and so on and so forth. In programming, this kind of data structure is often referred to as an associative array, map, or dictionary. It’s a collection of (key, value) pairs. Imagine you had a dictionary of people's ages. When you look up “Sue” (the key), the definition, or value, is her age, 24.
+
+
+
+ Associative arrays can be incredibly convenient for various applications. For example, you could keep a list of student IDs (student name, id) or a list of prices (product name, price) in a dictionary. Here a dictionary is the perfect data structure to hold the concordance. Each element of the dictionary is a word paired with its count.
+
+
+
+ While there are many classes in Java for dealing with advanced data structures like maps, Processing provides you with a set of three built-in dictionary classes that are easy to use: IntDict, FloatDict, and StringDict. In all of these classes, the key is always a string while the value is variable (an integer, floating point number, or String). For the concordance, I'll use an IntDict.
+
+
+
+ Creating an IntDict is as easy as calling an empty constructor. Let's say you want a dictionary to keep track of an inventory of supplies.
-// Update the value of column "x" to mouseX in a given TableRow.
-row.setInt("x",mouseX);
+IntDict inventory = new IntDict();
-
-To add a new row to a Table, simply call the method addRow() and set the values of each column.
-
+ Values can be paired with their keys using the set() method.
-// Create a new row
-TableRow row = table.addRow();
-// Set the values of that row
-row.setFloat("x", mouseX);
-row.setFloat("y", mouseY);
-row.setFloat("diameter", random(40, 80));
-row.setString("name", "new label");
+// set() assigns an integer to a String.
+inventory.set("pencils", 10);
+inventory.set("paper clips", 128);
+inventory.set("pens, 16");
+
+ There are a variety of other methods that can be called to change the value associated with a particular key. For example, if you wanted to add five pencils, you can use add().
+
+inventory.add("pencils", 5); // The value of “pencils” is now 15.
-To delete a row to a Table, simply call the method removeRow() and pass in the numeric index of the row you would like removed. The following code for example, removes the first row whenever the size of the table is greater than ten rows.
-
+ A particularly convenient method for the concordance example is increment() which adds one to a key's value.
-// If the table has more than 10 rows
-if (table.getRowCount() > 10) {
- // Delete the first row
- table.removeRow(0);
-}
+inventory.increment("pens"); // The value of “pencils” is now 16.
+ To retrieve a value associated with a particular key, the get() method is used.
+
+int num = inventory.get("pencils"); // The value of num is 16.
+
+ Finally, dictionaries can be sorted by their keys (alphabetical) or values (smallest to largest or the reverse) with the methods sortKeys(), sortKeysReverse(), sortValues(), and sortValuesReverse().
+
+
+
+ The concordance now becomes a rather simple program to write. All I need to do is load in a text file, chop it into words with splitTokens() and call increment() on an IntDict for every single word found in the text. The following example does precisely this with the entire text of Shakespeare’s play, A Midsummer Night's Dream, displaying a simple graph of the most used words.
+
+
+Text Concordance Using IntDict
+
+
+
+String[] allwords;
-For an example that creates objects from and saves objects to a Table, take a look at LoadSaveTable under Topics --> Advanced Data.
+// Any punctuation is used as a delimiter.
+String delimiters = " ,.?!;:[]";
-XML Data
+IntDict concordance;
-For grabbing data from the web, an XML (Extensible Markup Language) feed is an excellent option (if available). Unlike HTML (which is designed to make content vieweable by a human's eyes) XML is designed to make content viewable by a computer and facilitate the sharing of data across different systems.
+void setup() {
+ size(360, 640);
+
+ // Load A Midsummer Night's Dream into an array of strings
+ String url = "http://www.gutenberg.org/cache/epub/1514/pg1514.txt";
+ String[] rawtext = loadStrings(url);
+
+ // Join the big array together as one long string
+ String everything = join(rawtext, "" );
-XML organizes information in a tree structure. Let's imagine a list of students. Each student has an id number, name, address, e-mail, and telephone number. Each student's address has a city, state, and zip code. An XML tree for this dataset might look like the following:
+ // All the lines in A Midsummer Night's Dream are first joined as one big string
+ // and then split up into an array of individual words.
+ // Note the use of splitTokens() since I am using spaces and punctuation marks as delimiters.
+ allwords = splitTokens(everything, delimiters);
-
+ // Make a new empty dictionary
+ concordance = new IntDict();
+
+ for (int i = 0; i<allwords.length; i++) {
+ // It's useful to convert each word to lower case so that,
+ // for example, “The” and “the” are both counted as the same word.
+ String s = allwords[i].toLowerCase();
+ // For every single word, increase its count in the dictionary.
+ concordance.increment(s);
+ }
+
+ // Sort the dictionary so that words that appear most often are first.
+ concordance.sortValuesReverse();
+}
+
+void draw() {
+ background(255);
+
+ // Display the text and total times the word appears
+ int h = 20;
+ // In order to iterate over every word in the dictionary,
+ // first ask for an array of all of the keys.
+ String[] keys = concordance.keyArray();
+
+ for (int i = 0; i<height/h; i++) {
+ // Look at each key one at a time and retrieve its count.
+ String word = keys[i];
+ int count = concordance.get(word);
+
+ fill(51);
+ // Displaying a rectangle along with the count as a simple graph.
+ rect(0, i*20, count/4, h-4);
+ fill(0);
+ text(word + ": " + count, 10+count/4, i*h+h/2);
+ stroke(0);
+ }
+}
+
+
+ Processing also includes three classes for lists of numbers and strings: IntList, FloatList, and StringList. In other words, if you just want a list of words (without their counts) you could use a StringList rather than an IntDict.
+
+
+
+ If your data is available via a standardized format such as XML or JSON, the process of manually searching through text for individual pieces of data is no longer required. XML is designed to facilitate the sharing of data across different systems, and you can retrieve that data using the built-in Processing XML class.
+
+
+
+ XML organizes information in a tree structure. Let’s imagine a list of students. Each student has an ID number, name, address, email, and telephone number. Each student’s address has a city, state, and zip code. An XML tree for this dataset might look like the following:
+
+
+
+ The XMl source itself (with two students listed) is:
-<?xml version="1.0" encoding="UTF-8"?>
+<?xml version = "1.0" encoding = "UTF-8 "?>
<students>
<student>
<id>001</id>
@@ -313,94 +803,177 @@ XML Data
<address>
<street>45.3 Nebula 5</street>
<city>Boolean City</city>
- <state&tt;Booles</state>
+ <state>Booles</state>
<zip>12358</zip>
</address>
</student>
</students>
-
-Note the similarities to object-oriented programming. We could think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an id, a name, a phone number, an e-mail address, and a mailing address. The mailing address is also an object that also has multiple pieces of data, such as street, city, state, and zip.
-
-Let's look at Yahoo's XML feed for weather data. Here is the raw XML source (Note I have edited it for simplification purposes).
-
+ Note the similarities to object-oriented programming. You can think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an ID, a name, a phone number, an email address, and a mailing address. The mailing address is also an object that has multiple pieces of data, such as street, city, state, and zip.
+
+
+
+ Let's look at some data made available from a web service such as Yahoo Weather. Here is the raw XML source. (Note I have edited it slightly for simplification purposes.)
<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<rss version="2.0" xmlns:yweather="http://xml.weather.yahoo.com/ns/rss/1.0">
<channel>
<item>
- <title>Conditions for New York, NY at 3:51 pm EST</title>
+ <title>Conditions for New York, NY at 12:49 pm EDT</title>
<geo:lat>40.67</geo:lat>
<geo:long>-73.94</geo:long>
- <link>http://xml.weather.yahoo.com/forecast/USNY0996_f.html</link>
- <pubDate>Mon, 20 Feb 2006 3:51 pm EST</pubDate>
- <yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/>
- <yweather:forecast day="Mon" date="20 Feb 2006" low="25" high="37" text="Clear" code="31"/>
+ <link>http://us.rd.yahoo.com/dailynews/rss/weather/New_York__NY//link>
+ <pubDate>Thu, 24 Jul 2014 12:49 pm EDT</pubDate>
+ <yweather:condition text="Partly Cloudy" code="30" temp="76"/>
+ <yweather:forecast day="Thu" low="65" high="82" text="Partly Cloudy"/>
</item>
</channel>
</rss>
-
-And here is the data mapped in the tree structure.
-
-
-
-You may be wondering what the top level "RSS" is all about. Yahoo's XML weather data is provided in RSS format. RSS stands for "Really Simple Syndication" and is a standardized XML format for syndicating web content (such as news articles, etc.)
-
-Now that we have a handle on the tree structure, we should look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, i.e. <channel> and an end tag, i.e. </channel>. Some of these elements have content between the tags:
-
+ The data is mapped in the tree stucture shown below:
+
+
+
+ You may be wondering what the top level “RSS” is all about. Yahoo’s XML weather data is provided in RSS format. RSS stands for “Really Simple Syndication” and is a standardized XML format for syndicating web content (such as news articles, etc.). You can read more about RSS on Wikipedia.
+
+
+ Now that you have a handle on the tree structure, let's look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, that is, <channel>, and an end tag, that is, </channel>. Some of these elements have content between the tags:
-<title>Conditions for New York, NY at 3:51 pm EST</title>
+<title>Conditions for New York, NY at 12:49 pm EDT</title>
-
-and some have attributes (formatted by attribute name equals attribute value in quotes):
-
+and some have attributes (formatted by Attribute Name equals Attribute Value in quotes):
-<yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/>
+<yweather:forecast day="Thu" low="65" high="82" text="Partly Cloudy"/>
+
-Knowing this format, we could certainly be clever with our use of split(), indexOf(), and substring() to find the pieces we want in the raw XML. The point here, however, is that because XML is a standard format, we don't have to do this. Rather, we can use an XML parser. In Processing, the XML parser is called just that: XML.
+Using the Processing XML Class
+
+ Since the syntax of XML is standardized, I could certainly use split(), indexof(), and substring() to find the pieces I want in the XML source. The point here, however, is that because XML is a standard format, I don't have to do this. Rather, I can use an XML parser. In Processing, XML can be parsed using the built-in Processing class XML.
XML xml = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003");
+ Here, instead of loadStrings() or loadTable(), I'm now calling loadXML() and passing in the address (URL or local file) of the XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram from Yahoo Weather, I find the current temperature via the following path:
+
+
+
+ -
+
The root of the tree is RSS.
+
+ -
+
RSS has a child named channel.
+
+ -
+
Channel has a child named item.
+
+ -
+
Item has a child named yweather:condition.
+
+ -
+
The temperature is stored in yweather:condition as the attribute temp.
+
+
+
+
+ The children of an element are accessed via the getChild() function.
+
+// Accessing the “channel” child element of the root element -->
+XML channel = xml.getChild("channel");
+
+ The content of an element itself is retrieved with one of the following methods: getContent(), getIntContent(), or getFloatcContent(). getContent() is for generic use and will always give you the content as a String. If you intend to use the content as a number, Processing will convert it for you with either getIntContent() or getFloatcContent(). Attributes can also be read as either numbers — getInt(), getFloat() — or text — getString().
+
-Here, instead of loadStrings() or loadTable(), we're now calling loadXML() and passing in the address (URL or local file) of our XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram, we see that we can find the current temperature via the following path:
-
-
-- The root of the tree is RSS.
-- RSS has a child named channel.
-- Channel has a child named item.
-- Item has a child named yweather:condition.
-- The temperature is stored in yweather:condition as the attribute temp.
-
+
+ Following steps one through five outlined above through the XML tree, I have:
+
+XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1
-We could translate the above into code as follows:
+XML channel = root.getChild("channel"); // Step 2
-
-XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1
-XML channel = root.getChild("channel"); // Step 2
-XML item = channel.getChild("item"); // Step 3
-XML yweather = item.getChild("yweather:condition"); // Step 4
-int temperature = yweather.getInt("temp"); // Step 5
-
+XML item = channel.getChild("item"); // Step 3
-This is a bit long-winded, however, and so can be compressed down into one (or three as below) lines of code.
+XML yweather = item.getChild("yweather:condition"); // Step 4
-
-XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003); // Step 1
-XML forecast = root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4
-int temperature = forecast.getInt("temp"); // Step 5
+int temperature = yweather.getInt("temp"); // Step 5
+ However, this is a bit long-winded and so can be compressed down into one (or three, as below) lines of code.
+
+XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003);
-Finally, the second line of code above can be further condensed to:
-
+XML forecast =
+ root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4
+int temperature = forecast.getInt("temp");
+
+ Finally, the second line of code above can be further condensed to:
XML forecast = xml.getChild("channel/item/yweather:condition"); // Steps 2-4
+ Following is the above code put together in an example that retrieves weather data for multiple zip codes by parsing Yahoo's XML feed.
+
+
+Parsing Yahoo Weather XML
+
+
+int temperature = 0;Temperature is stored as a number and the description of the weather as a string.
+String weather = "";
+
+
+// The zip code
+String zip = "10003";
+
+void setup() {
+ size(200, 200);
+
+ // The URL for the XML document
+ String url = "http://xml.weather.yahoo.com/forecastrss?p=" + zip;
-It should also be noted that we're accessing the child nodes by their name (i.e. "channel", "item", etc.), but they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children. In LoadSaveTable, we used a series of comma separated values in a text file to store information related to Bubble objects. An XML document can also be used in the same manner. Consider the following XML document:
+ // Load the XML document
+ XML xml = loadXML(url);
+ // Here, I grab the XML element that I want.
+ XML forecast = xml.getChild("channel/item/yweather:forecast");
+
+ // And then I pull the attributes from that XML element.
+ temperature = forecast.getInt("high");
+ weather = forecast.getString("text");
+}
+
+void draw() {
+ background(255);
+ fill(0);
+
+ // Display all the stuff I want to display
+ text("Zip code: " + zip, 10, 50);
+ text("Today’s high: " + temperature, 10, 70);
+ text("Forecast: " + weather, 10, 90);
+}
+
+ Other useful XML functions are:
+
+
+
+ -
+
hasChildren() — checks whether or not an element has any children
+
+ -
+
getChildren() — returns an array containing all child elements
+
+ -
+
getAttributeCount() — counts the specified element's number of attributes
+
+ -
+
hasAttribute() — checks whether or not an element has the specified attribute
+
+
+
+
+
+ In this example I'm accessing the child nodes by their name (i.e., "channel," "item,", etc.), however they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children, much like I did with tabular data when I iterated over rows in a table.
+
+
+
+ Earlier, we used a Table to store information related to Bubble objects. XML document can also be used in the same manner. Here is a possible solution for an XML tree of Bubble objects:
<?xml version="1.0" encoding="UTF-8"?>
<bubbles>
@@ -426,52 +999,321 @@ XML Data
</bubble>
</bubbles>
+ I can use getChildren() to retrieve the array of <bubble> elements and make a Bubble object from each one. Here is the example which uses the identical Bubble class from earlier (not included below). The new code is in bold.
+
+
+
+Using Processing's XML Class
+
+
+// An Array of Bubble objects
+Bubble[] bubbles;
+// An XML object
+XML xml;
+
+void setup() {
+ size(480, 360);
+ loadData();
+}
-In the above XML, the root element is "bubbles" which has four children. Each child "bubble" has 3 children, "position", "diameter", and "label." The "position" element has two attributes, "x" and "y." To access the list of all XML nodes "bubble" we can use the getChildren() method, passing in the name "bubble"
+void loadData() {
+ // Load XML file
+ xml = loadXML("data.xml");
+ // Get all the child nodes named "bubble"
+ XML[] children = xml.getChildren("bubble");
+ bubbles = new Bubble[children.length];
+ // The size of the Bubble array is determined by the total XML elements named “bubble.”
+
+ for (int i = 0; i < bubbles.length; i++) {
+
+ XML positionElement = children[i].getChild("position");
+ // The position element has two attributes: “x” and “y”.
+ // Attributes can be accessed as an integer or float via getInt() and getFloat().
+ float x = positionElement.getInt("x");
+ float y = positionElement.getInt("y");
+
+ // The diameter is the content of the child named "diameter"
+ XML diameterElement = children[i].getChild("diameter");
+ float diameter = diameterElement.getFloatContent();
+ // Notice, however, with the content of an XML node,
+ // I retrieve via getIntContent() and getFloatContent().
+
+ // The label is the content of the child named "label"
+ XML labelElement = children[i].getChild("label");
+ String label = labelElement.getContent();
+
+ // Make a Bubble object out of the data read
+ bubbles[i] = new Bubble(x, y, diameter, label);
+ }
+}
+
+void draw() {
+ background(255);
+ // Display all bubbles
+ for (int i = 0; i < bubbles.length; i++) {
+ bubbles[i].display();
+ bubbles[i].rollover(mouseX, mouseY);
+ }
+}
+
+ In addition to loadXML(), Processing also includes a saveXML() function for writing XML files to your sketch folder. You can modify the XML tree itself by adding or removing elements with addChild() or removeChild(), as well as modify the content of elements or attributes with setContent(), setIntContent(), setFloatContent(), setString(), setInt(), and setFloat().
+
+
+JSON
+
+
+ Another increasingly popular data exchange format is JSON (pronounced like the name Jason), which stands for JavaScript Object Notation. Its design was based on the syntax for objects in the JavaScript programming language (and is most commonly used to pass data between web applications) but has become rather ubiquitous and language-agnostic. While you don't need to know anything about JavaScript to work in Processing, it won't hurt to get a sense of some basic JavaScript syntax while learning it.
+
+
+
+ JSON is an alternative to XML and the data can be looked at in a similarly tree-like manner. All JSON data comes in the following two ways: an object or an array. Luckily, you already know about these two concepts and only need to learn a new syntax for encoding them.
+
+
+
+ Let's take a look at a JSON object first. A JSON object is like a Processing object only with no functions. It’s simply a collection of variables with a name and a value (or "name/value pair"). For example, following is JSON data describing a person:
+
+{
+ "name":"Olympia",
+ // Each name/value pair is separated by a comma.
+ "age":3,
+ "height":96.5,
+ "state":"giggling"
+}
+Notice how this maps closely to classes in Processing.
+
+class Person {
+ String name;
+ int age;
+ float height;
+ String state;
+}
+
+ There are no classes in JSON, only the object literals themselves. Also an object can contain, as part of itself, another object.
+
+{
+ "name":"Olympia",
+ "age":3,
+ "height":96.5,
+ "state":"giggling",
+ // The value of “brother” is an object containing two name/value pairs.
+ "brother":{
+ "name":"Elias",
+ "age":6
+ }
+}
+ In XML, the preceding JSON data would look like the following (for simplicity I'm avoiding the use of XML attributes).
+
+<xml version="1.0" encoding="UTF-8"?>
+<person>
+ <name>Olympia</name>
+ <age>3</age>
+ <height>96.5</height>
+ <state>giggling</state>
+ <brother>
+ <name>Elias</name>
+ <age>6</age>
+ </brother>
+</person>
+
+ Multiple JSON objects can appear in the data as an array. Just like the arrays you use in Processing, a JSON array is simply a list of values (primitives or objects). The syntax, however, is different with square brackets indicating the use of an array rather than curly ones. Here is a simple JSON array of integers:
+
+[1, 7, 8, 9, 10, 13, 15]
+
+ You might find an array as part of an object.
+
+{
+ "name":"Olympia",
+ // The value of “favorite colors” is an array of strings.
+ "favorite colors":[
+ "purple",
+ "blue",
+ "pink"
+ ]
+}
+
+ Or an array of objects themselves. For example, here is what the bubbles would look like in JSON. Notice how this JSON data is organized as a single JSON object "bubbles," which contains a JSON array of JSON objects, the bubbles. Flip back to compare to the CSV and XML versions of the same data.
+
+{
+ "bubbles":[
+ {
+ "position":{
+ "x":160,
+ "y":103
+ },
+ "diameter":43.19838,
+ "label":"Happy"
+ },
+ {
+ "position":{
+ "x":372,
+ "y":137
+ },
+ "diameter":52.42526,
+ "label":"Sad"
+ },
+ {
+ "position":{
+ "x":273,
+ "y":235
+ },
+ "diameter":61.14072,
+ "label":"Joyous"
+ }
+ ]
+}
+
+
+JSONObject and JSONArray
+
+
+ Now that I've covered the syntax of JSON, I can look at using the data in Processing. One thing that can be a bit tricky about working with JSON in Processing is that I have to treat objects and arrays differently. With XML, I simply had a single XML class with all the parsing functionality I needed. With JSON, I have two classes: JSONObject and JSONArray, and I'll have to be conscientious about picking which class I am using during the parsing process.
+
+
+
+ The first step is simply loading the data with either loadJSONObject() or loadJSONArray(). But which one? I have to look and see what is at the root of the JSON file, an object or array. This can be a little tricky. Let's look at these two JSON examples:
+
+
+
+ Sample 1:
+
+[
+ {
+ "name":"Elias"
+ },
+ {
+ "name":"Olympia"
+ }
+]
+
+ Sample 2:
-// Load an XML document
-XML xml = loadXML("bubbles.xml");
+{
+ "names":[
+ {
+ "name":"Elias"
+ },
+ {
+ "name":"Olympia"
+ }
+ ]
+}
+
+ Look how similar the above two samples look. They both contain exactly the same data, two names "Elias" and "Olympia." There is one, very key difference, however, to how the data is formatted: the very first character. Is it a "[" or a "{"? The answer will determine whether you’re loading an array ("[") or an object("{"). JSON objects start with a curly bracket, while JSON arrays start with a square bracket.
+
+JSONObject json = loadJSONObject("file.json");
-// Get all the child elements
-XML[] children = xml.getChildren("bubble");
+JSONArray json = JSONArray("file.json");
+ Typically, even if the data is ultimately organized as an array of objects (such as the array of "bubble" objects), the root element of the JSON data will be an object that contains that array. Let's look at the bubble data one more time.
+
+{
+ "bubbles":[
+ {
+ "position":{
+ "x":160,
+ "y":103
+ },
+ "diameter":43.19838,
+ "label":"Happy"
+ },
+ {
+ "position":{
+ "x":372,
+ "y":137
+ },
+ "diameter":52.42526,
+ "label":"Sad"
+ }
+ ]
+}
+
+ With the above, I first load an object and then pull the array out of that object.
+
+JSONObject json = loadJSONObject("data.json");
+JSONArray bubbleData = json.getJSONArray("bubbles");
+
+ Just as with XML, the data from an element is accessed via its name, in this case "bubbles." With a JSONArray, however, each element of the array is retrieved via its numeric index. The following code iterates over a JSONArray.
+
+for (int i = 0; i < bubbleData.size(); i++) {
+ JSONObject bubble = bubbleData.getJSONObject(i);
+ }
+
+ And when you're looking for a specific piece of data from a JSONObject, such as an integer or string, the functions are identical to those of XML attributes. The following code gets the position object from the bubble object, then gets x and y as integers from the position object. The diameter and label are then available directly from the Bubble object.
+
+ JSONObject position = bubble.getJSONObject("position");
-Once we have the array of XML objects, we can iterate over them, accessing the individual pieces of data for each "bubble". Notice how the syntax for getting XML attributes (in this case, "x" and "y" of the position element is slightly different than pulling content directly from an element (in this case, "diameter" and "label").
-
-for (int i = 0; i < bubbles.length; i++) {
-
- // The position element has two attributes: x and y
- XML positionElement = children[i].getChild("position");
- // Note how with attributes we can get an integer or float via getInt() and getFloat()
- float x = positionElement.getInt("x");
- float y = positionElement.getInt("y");
-
- // The diameter is the content of the child named "diamater"
- XML diameterElement = children[i].getChild("diameter");
- // Note how with the content of an XML node, we retrieve via getIntContent() and getFloatContent()
- float diameter = diameterElement.getFloatContent();
+ int x = position.getInt("x");
+ int y = position.getInt("y");
- // The label is the content of the child named "label"
- XML labelElement = children[i].getChild("label");
- String label = labelElement.getContent();
-}
+ float diameter = bubble.getFloat("diameter");
+ String label = bubble.getString("label");
+ Putting this all together, I can now make a JSON version of the bubbles example (leaving out the draw() function and Bubble class which haven't changed.)
+
+
+
+Using Processing's JSON Classes
+
+
+// An Array of Bubble objects
+Bubble[] bubbles;
-XML elements can be added and removed from the XML tree with the addChild() and removeChild() methods.
+void setup() {
+ size(480, 360);
+ loadData();
+}
-For the full example that creates objects from and saves objects to an XML document, take a look at LoadSaveXML under Topics --> Advanced Data.
+void loadData() {
+ // Load the JSON file and grab the array.
+ JSONObject json = loadJSONObject("data.json");
+ JSONArray bubbleData = json.getJSONArray("bubbles");
-Threads
+ // The size of the array of Bubble objects is determined by the length of the JSON array.
+ bubbles = new Bubble[bubbleData.size()];
+
+
+ for (int i = 0; i<bubbleData.size(); i++) {
+
+ // Iterate through the array, grabbing each JSON object one at a time.
+ JSONObject bubble = bubbleData.getJSONObject(i);
-You are likely familiar with the idea of writing a program that follows a specific sequence of steps -- setup() first then draw() over and over and over again! A Thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the "Animation" thread. Other threads sequences, however, can run independently of the main Processing sketch. In fact, you can launch any number of threads at one time and they will all run concurrently.
+ // Get a position object
+ JSONObject position = bubble.getJSONObject("position");
+ // Get (x,y) from JSON object "position"
+ int x = position.getInt("x");
+ int y = position.getInt("y");
+
+ // Get diamter and label
+ float diameter = bubble.getFloat("diameter");
+ String label = bubble.getString("label");
-Processing does this all the time, whenever you write an event callback, such as serialEvent(), or captureEvent(), etc. these functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful whenever you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network (XML, database, etc.) If a separate thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread. To create independent, asynchronous threads, you can use the thread() function built into Processing.
+ // Put the Bubble objects into an array.
+ bubbles[i] = new Bubble(x, y, diameter, label);
+ }
+}
+
+
+Threads
+
+ As you have seen, the various loading functions — loadStrings(), loadTable(), loadXML(), and loadJSONObject() — can be used for retrieving data from URLs. Nonetheless, unless your sketch only needs to load the data once during setup(), you may have a problem. For example, consider a sketch that grabs the price of AAPL stock from an XML feed every five minutes. Each time loadXML() is called, the sketch will pause while waiting to receive the data. Any animation will stutter. This is because these loading functions are “blocking.” In other words, the sketch will sit and wait at that line of code until loadXML() completes its task. With a local data file, this is extremely fast. Nonetheless, a request for a URL (known as an “HTTP request”) in Processing is synchronous, meaning your sketch waits for a response from the server before continuing. Who knows how will that take? No one; you are at the mercy of the server!
+
+
+
+ The answer to this problem lies in the concept of threads. By now you are quite familiar with the idea of writing a program that follows a specific sequence of steps — setup() first then draw() over and over and over again! A thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the animation thread. Other threads’ sequences, however, can run independently of the main animation loop. In fact, you can launch any number of threads at one time, and they will all run concurrently.
+
+
+
+
+ Processing does this quite often, such as with library functions like captureEvent() and movieEvent(). These functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful when you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network. Here, you want to handle the request asynchronously in a different thread. If that thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread and not the main animation loop.
+
+
+
+ Writing your own thread can be a complex endeavor that involves extending the Java Thread class. However, the thread() method is a quick and dirty way to implement a simple thread in Processing. By passing in a string that matches the name of a function declared elsewhere in the sketch, Processing will execute that function in a separate thread. Let's take a look at a skeleton of how this works.
void setup() {
- size(200,200);
thread("someFunction");
}
@@ -484,44 +1326,201 @@ Threads
// thread("someFunction") as it was in setup!
}
+ The thread() function receives a string as an argument. The string should match the name of the function you want to run as a thread. In the above example it’s "someFunction".
+
+
+
+ Let's look at a more practical example. For an example of data that changes often, I'll use time.jsontest.com which gives you the current time (in milliseconds). While I could retrieve this from the system clock, this works well for demonstrating continuously requesting data that changes over time. Not knowing about threads, my first instinct might be to say:
+
+void draw() {
+ // The code will stop here and wait to receive the data before moving on.
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ String time = json.getString("time");
+ text(time, 40, 100);
+}
+
+ This would give me the current time every cycle through draw(). If I examine the frame rate, however, I'll notice that the sketch is running incredibly slowly (and all it needs to do is draw a single string!). This is where calling the parsing code as a separate thread will help a lot.
+
+String time = "";
-The thread() function receives a String as an argument. The String should match the name of the function you want to run as a thread. This is especially useful in sketches that grab data for the web. Rather than have the animation freeze while the sketch is waiting to retrieve data, the sketch can continue to loop through draw() updating the data when the thread is completed. In these cases, a boolean variable can be useful to track the status of the thread.
+void draw() {
+ // Now the code will move on to the next line while requestData() executes in a separate thread.
+ thread("requestData");
+ text(time, 40, 100);
+}
-
-boolean loading = false;
+void requestData() {
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ time = json.getString("time");
+}
+ The logic is identical, only I am not requesting the data directly in draw(), but executing that request as a separate thread. Notice that I am not doing any drawing in requestData(). This is key as executing drawing functions in code that runs on a separate thread can cause conflicts with the main animation thread (i.e., draw()) resulting in strange behavior and errors.
+
-The function that loads the data can then set loading equal to true at the start and false at the end.
+
+ In the above example, I likely don't want to request the data sixty times per second (the default frame rate). Instead I might make use of the Timer class, and ask for the data once per second. Here is a full example that does exactly that with added animation to show that draw() never stutters.
+
+Threads
+
+
+
-void loadData() {
- loading = true;
+Timer timer = new Timer(1000);
+String time = "";
- ///////////////////////////////////
- // All of the data retrival code //
- ///////////////////////////////////
+void setup() {
+ size(200, 200);
+ // Start by requesting the data asynchronously in a thread.
+ thread("retrieveData");
+ timer.start();
+}
+
+void draw() {
+ background(255);
+ // Every one second, make a new request.
+ if (timer.isFinished()) {
+ retrieveData();
- loading = false;
+ // And restart the timer.
+ timer.start();
+ }
+
+ fill(0);
+ text(time, 40, 100);
+
+ translate(20, 100);
+ stroke(0);
+ //Draw a little animation to demonstrate that the draw() loop never pauses.
+ rotate(frameCount*0.04);
+ for (int i = 0; i<10; i++) {
+ rotate(radians(36));
+ line(5, 0, 10, 0);
+ }
+}
+
+// get the data
+void retrieveData() {
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ time = json.getString("time");
+}
+
+
+class Timer {
+
+ int savedTime;
+ boolean running = false;
+ int totalTime;
+
+ Timer(int tempTotalTime) {
+ totalTime = tempTotalTime;
+ }
+
+ void start() {
+ running = true;
+ savedTime = millis();
+ }
+
+ boolean isFinished() {
+ int passedTime = millis() - savedTime;
+ if (running && passedTime > totalTime) {
+ running = false;
+ return true;
+ } else {
+ return false;
+ }
+ }
+
}
-In draw(), you can choose to display something to indicate the thread is running (when loading equals true).
+APIs
+
+
+ It’s a bit silly for me to call this section “APIs” given that most of this chapter is about data from APIs. Still, it’s worth taking a moment to pause and reflect. What makes something an API versus just some data you found, and what are some pitfalls you might run into when using an API?
+
+
+
+ As I've stated, an API (Application Programming Interface) is an interface through which one application can access the services of another. These can come in many forms. Openweathermap.org, as you saw earlier, is an API that offers its data in JSON, XML, and HTML formats. The key element that makes this service an API is exactly that offer; openweathermap.org's sole purpose in life is to offer you its data. And not just offer it, but allow you to query it for specific data in a specific format. Let's look at a short list of sample queries.
+
+
+
+ - http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139
+ - A request for current weather data for a specific latitude and longitude.
+ - http://api.openweathermap.org/data/2.5/forecast/daily?q=London&mode=xml&units=metric&cnt=7&lang=zh_cn
+ - A request for a seven day London forecast in XML format with metric units and in Chinese.
+ - http://api.openweathermap.org/data/2.5/history/station?id=5091&type=day
+ - A request for a historical data for a given weather station.
+
+
+
+ One thing to note about openweathermap.org is that it does not require that you tell the API any information about yourself. You simply send a request to a URL and get the data back. Other APIs, however, require you to sign up and obtain an access token. The New York Times API is one such example. Before you can make a request from Processing, you'll need to visit The New York Times Developer site and request an API key. Once you have that key, you can store it in your code as a string.
+
+// This is not a real key
+String apiKey = "40e2es0b3ca44563f9c62aeded4431dc:12:51913116";
+
+ You also need to know what the URL is for the API itself. This information is documented for you on the developer site, but here it is for simplicity:
+
+String url = "http://api.nytimes.com/svc/search/v2/articlesearch.json";
+
+ Finally, you have to tell the API what it is you are looking for. This is done with a “query string,” a sequence of name value pairs describing the parameters of the query joined with an ampersand. This functions similarly to how you pass arguments to a function in Processing. If you wanted to search for the term "processing" from a search() function you might say:
+
+search("processing");
+
+ Here, the API acts as the function call, and you send it the arguments via the query string. Here is a simple example asking for a list of the oldest articles that contain the term "processing" (the oldest of which turns out to be May 12th, 1852).
+
+// The name/value pairs that configure the API query are: (q,processing) and (sort,oldest)
+String query = "?q=processing&sort=oldest";
+
+ This isn't just guesswork. Figuring out how to put together a query string requires reading through the API's documentation. For The New York Times, it’s all outlined on the Times' developer website. Once you have your query you can join all the pieces together and pass it to loadJSONObject(). Here is a tiny example that simply displays the most recent headline.
+
+
+NYTimes API Query
+
-void draw() {
- if (loading) {
- // Draw something to indicate loading
- }
+void setup() {
+ size(200, 200);
+
+ String apiKey = "40e2ea0b3ca44563f9c62aeded0431dc:18:51513116";
+ String url = "http://api.nytimes.com/svc/search/v2/articlesearch.json";
+ String query = "?q=processing&sort=newest";
+
+ // Make the API query
+ // Here, I format the call to the API by joing the URL with the API key with the query string.
+ JSONObject json = loadJSONObject(url+query+"&api-key="+apiKey);
+
+ String headline = json.getJSONObject("response").getJSONArray("docs").
+ // Grabbing a single headline from the results.
+ getJSONObject(0).getJSONObject("headline").getString("main");
+ background(255);
+ fill(0);
+ text(headline, 10, 10, 180, 190);
}
+ Some APIs require a deeper level of authentication beyond an API access key. Twitter, for example, uses an authentication protocol known as “OAuth” to provide access to its data. Writing an OAuth application requires more than just passing a String into a request and is beyond the scope of this tutorial. However, in these cases, if you’re lucky, you can find a Processing library that handles all of the authentication for you. There are several APIs that can be used directly with Processing via a library, and you can find a list of them in the “Data / Protocols” section of the libraires reference page for some ideas. Temboo, for example, offers a Processing library that handles OAuth for you and provides direct access to many APIs (including Twitter) in Processing. With Temboo, you can write code that looks like:
+
+
+// Temboo acts as a go-between you and Twitter, so first you just authenticate with Temboo.
+TembooSession session = new TembooSession("ACCOUNT_NAME", "APP_NAME", "APP_KEY");
-Two examples that follow this methodology can be found under Topics --> Advanced Data in the Processing examples.
+Tweets tweets = new Tweets(session);
+// Then you can configure a query to send to Twitter itself and grab the results.
+tweets.setCredential("your-twitter-name");
+tweetsChoreo.setQuery("arugula");
+TweetsResultSet tweetsResults = tweets.run();
-While using the thread() function is a very simple way of getting an independent thread, it should be noted that it is somewhat limited. Being able to make a thread object is a great deal more powerful, and this can be done by extending the Java Thread class.
+JSONObject searchResults = parseJSONObject(tweetsResults.getResponse());
+JSONArray statuses = searchResults.getJSONArray("statuses");
+
+// Finally, you can search through the results and grab a tweet.
+JSONObject tweet = statuses.getJSONObject(0);
+String tweetText = tweet.getString("text");
+
-
-
+
+
diff --git a/content/static/tutorials/drawing/imgs/A94665D2BBAE05CF._t_ b/content/static/tutorials/drawing/imgs/A94665D2BBAE05CF._t_
new file mode 100644
index 000000000..fb0b3bb08
--- /dev/null
+++ b/content/static/tutorials/drawing/imgs/A94665D2BBAE05CF._t_
@@ -0,0 +1,147 @@
+
+
+
+
diff --git a/content/static/tutorials/drawing/imgs/A94665DD9FEE952C._t_ b/content/static/tutorials/drawing/imgs/A94665DD9FEE952C._t_
new file mode 100644
index 000000000..914fa8f46
--- /dev/null
+++ b/content/static/tutorials/drawing/imgs/A94665DD9FEE952C._t_
@@ -0,0 +1,150 @@
+
+
+
+
diff --git a/content/static/tutorials/drawing/imgs/A94665F3686FB3E6._t_ b/content/static/tutorials/drawing/imgs/A94665F3686FB3E6._t_
new file mode 100644
index 000000000..011a3cd80
--- /dev/null
+++ b/content/static/tutorials/drawing/imgs/A94665F3686FB3E6._t_
@@ -0,0 +1,101 @@
+
+
+
+
diff --git a/content/static/tutorials/drawing/imgs/drawing-01.svg b/content/static/tutorials/drawing/imgs/drawing-01.svg
index 21f5e8796..bd50213f1 100644
--- a/content/static/tutorials/drawing/imgs/drawing-01.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-01.svg
@@ -2,63 +2,146 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-02.svg b/content/static/tutorials/drawing/imgs/drawing-02.svg
index 53c5804ec..beb9935ab 100644
--- a/content/static/tutorials/drawing/imgs/drawing-02.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-02.svg
@@ -2,34 +2,148 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-03.svg b/content/static/tutorials/drawing/imgs/drawing-03.svg
index cf20e2076..b3c97fe3f 100644
--- a/content/static/tutorials/drawing/imgs/drawing-03.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-03.svg
@@ -1,101 +1,300 @@
-
+
diff --git a/content/static/tutorials/drawing/imgs/drawing-04.svg b/content/static/tutorials/drawing/imgs/drawing-04.svg
index e8e78fca4..a819634e0 100644
--- a/content/static/tutorials/drawing/imgs/drawing-04.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-04.svg
@@ -2,21 +2,100 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-05.svg b/content/static/tutorials/drawing/imgs/drawing-05.svg
index 76a79bf47..44653c110 100644
--- a/content/static/tutorials/drawing/imgs/drawing-05.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-05.svg
@@ -1,64 +1,210 @@
-
-
-
-
+
+
+
diff --git a/content/static/tutorials/drawing/imgs/drawing-06.svg b/content/static/tutorials/drawing/imgs/drawing-06.svg
index 6c0dbeefa..b60a7c33e 100644
--- a/content/static/tutorials/drawing/imgs/drawing-06.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-06.svg
@@ -2,70 +2,273 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-07.svg b/content/static/tutorials/drawing/imgs/drawing-07.svg
index 8f112e8ab..fe9206917 100644
--- a/content/static/tutorials/drawing/imgs/drawing-07.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-07.svg
@@ -2,77 +2,291 @@
diff --git a/content/static/tutorials/drawing/imgs/drawing-08.svg b/content/static/tutorials/drawing/imgs/drawing-08.svg
index c921208ee..f6b9defe9 100644
--- a/content/static/tutorials/drawing/imgs/drawing-08.svg
+++ b/content/static/tutorials/drawing/imgs/drawing-08.svg
@@ -1,1583 +1,297 @@
-
-
-
-
-
-
-
-
-]>
-
- For the past fourteen years, Processing has promoted software literacy, particularly within the visual arts, and visual literacy within technology. Initially created to serve as a software sketchbook and to teach programming fundamentals within a visual context, Processing has also evolved into a development tool for professionals. The Processing software is free and open source, and runs on the Mac, Windows, and GNU/Linux platforms. - -
- Processing continues to be an alternative to proprietary software tools with restrictive and expensive licenses, making it accessible to schools and individual students. Its open source status encourages the community participation and collaboration that is vital to Processing’s growth. Contributors share programs, contribute code, and build libraries, tools, and modes to extend the possibilities of the software. The Processing community has written more than a hundred libraries to facilitate computer vision, data visualization, music composition, networking, 3D file exporting, and programming electronics. + For the past sixteen years, Processing has promoted software literacy, particularly within the visual arts, and visual literacy within technology. Initially created to serve as a software sketchbook and to teach programming fundamentals within a visual context, Processing has also evolved into a development tool for professionals. The Processing software is free and open source, and runs on the Mac, Windows, and GNU/Linux platforms.
- Processing is currently developed primarily in Boston (at Fathom Information Design), Los Angeles (at the UCLA Arts Software Studio), and New York City (at NYU’s ITP). + Processing continues to be an alternative to proprietary software tools with restrictive and expensive licenses, making it accessible to schools and individual students. Its open source status encourages the community participation and collaboration that is vital to Processing’s growth. Contributors share programs, contribute code, and build libraries, tools, and modes to extend the possibilities of the software. The Processing community has written more than a hundred libraries to facilitate computer vision, data visualization, music composition, networking, 3D file exporting, and programming electronics.
Education
@@ -27,7 +24,7 @@Education
- The innovations in teaching through Processing have been adapted for the Khan Academy computer science tutorials, offered online for free. The tutorials begin with drawing, using most of the Processing functions for drawing. The Processing approach has also been applied to electronics through the Arduino and Wiring projects. Arduino uses a syntax inspired by that used with Processing, and continues to use a modified version of the Processing programming environment to make it easier for students to learn how to program robots and countless other electronics projects. + The innovations in teaching through Processing have been adapted for the Khan Academy computer science tutorials, offered online for free. The tutorials begin with drawing, using most of the Processing functions for drawing. The Processing approach has also been applied to electronics through the Arduino and Wiring projects. Arduino uses a syntax inspired by that used with Processing, and continues to use a modified version of the Processing programming environment to make it easier for students to learn how to program robots and countless other electronics projects.
Culture
@@ -45,21 +42,23 @@Research
Foundation
-The primary charge of the Foundation is to develop and distribute the Processing software. This includes the original Processing (Java), p5.js (Javascript), and Processing.py (Python). There is more information about the Foundation at http://foundation.processing.org/. +The primary charge of the Foundation is to develop and distribute the Processing software. This includes the original Processing (Java), p5.js (Javascript), and Processing.py (Python). There is more information about the Foundation at https://processingfoundation.org/.
History
- Processing was started by Ben Fry and Casey Reas in the spring of 2001, while both were graduate students at the MIT Media Lab within John Maeda's Aesthetics and Computation research group. Development continued in their free time while Casey pursued his artistic and teaching career and Ben pursued a Ph.D. and founded Fathom Information Design. Many of the ideas in Processing go back to Muriel Cooper's Visual Language Workshop, and it grew directly out of Maeda's Design By Numbers project, developed at the Media Lab and released in 1999. The Wiring and Arduino projects, in turn, grew out of Processing while Casey was teaching at the Interaction Design Institute Ivrea in Italy. Processing also prompted John Resig (jQuery) to build Processing.js, a JavaScript version that then inspired more related work such as the Khan Academy curriculum in computer science. Versions of Processing that use Python, Ruby, ActionScript, and Scala are also in development. Processing and its sister projects have inspired over twenty educational books. + Processing was started by Ben Fry and Casey Reas in the spring of 2001, while both were graduate students at the MIT Media Lab within John Maeda's Aesthetics and Computation research group. Development continued in their free time while Casey pursued his art and teaching career and Ben pursued a Ph.D. and founded Fathom Information Design. Many of the ideas in Processing go back to Muriel Cooper's Visual Language Workshop, and it grew directly out of Maeda's Design By Numbers project, developed at the Media Lab and released in 1999. The Wiring and Arduino projects, in turn, grew out of Processing while Casey was teaching at the Interaction Design Institute Ivrea in Italy.
+For more information, please write to foundation@processing.org diff --git a/content/static/people.html b/content/static/people.html index ed14bc057..d406b648c 100755 --- a/content/static/people.html +++ b/content/static/people.html @@ -6,78 +6,57 @@
People. Processing is a comm
- Lead Developers
+ Project Leads
Ben Fry and Casey Reas
started Processing in Spring 2001 and continue to obsessively work on it. In 2012, they started the Processing Foundation along with Dan Shiffman, who formally joined as a third project lead.
- Senior Developers
- Andres Colubri (Boston), OpenGL / Video
- Florian Jenett (Frankfurt), Forum
- Elie Zananiri (Montreal), Contributed Libraries / Tools
- Scott Murray (San Francisco), Website / Reference / UI
+ Developers
+ Andres Colubri (Boston), OpenGL / Video
+ Elie Zananiri (New York), Contributed Libraries / Tools
+ Samuel Pottinger (San Francisco), Processing Core
-
+
-
+
Libraries, Tools
- The core Processing software is augmented by libraries and tools contributed through the community.
- These inventive extensions are a bright future for the project. We have a list of
- Contributed Libraries and
+ The core Processing software is augmented by libraries and tools contributed through
+ the community. These inventive extensions are a bright future for the project. We have a
+ list of Contributed Libraries and
Contributed Tools posted online.
- These contributions can't be underestimated. For example, see how
- Karsten Schmidt (London) has transformed Processing
- through the toxiclibs library and how
- Damien Di Fede (Austin) has extended the project
- into programming sound through his minim
- library.
-
-
-
-
-
- Fellowship Alumni
- Lauren McCarthy (New York), Spring/Summer/Fall 2013
- Greg Borenstein (New York), Spring/Summer 2013
- Wilm Thoben (Los Angeles), Fall 2013/Winter 2014
+ These contributions can't be underestimated. For example, see how Karsten Schmidt (London) has
+ transformed Processing through the toxiclibs library and how Damien Di Fede (Austin) has extended
+ the project into programming sound through his minim library.
- Developer Alumni
+ Alumni
+ Jakub Valtar (Brno), Processing Core
+ Scott Garner (New York), Hello Processing Website
+ Scott Murray (San Francisco), Website / Reference / UI
+ Gottfried Haider (Los Angeles), Processing for Pi
+ Florian Jenett (Frankfurt), Forum
+ Jamie Kosoy (San Francisco), Website
+ Manindra Moharana (San Diego), PDE / Core
+ James Grady (Boston), Visual Design
+
+
Patrick Hebron, Video Library (Summer 2011)
Peter Kalauskas, Library/Tool/Mode Install Utility (Summer, Fall 2011)
Andreas Schlegel, Libraries (Winter 2008 - Summer 2011)
Harshani Nawarathna, Processing Development Environment (Summer 2011)
Cindy Chi, Reference Editing (Summer 2011)
- Jonathan Feinberg, Parsing & Android Hacking (Spring 2011)
+ Jonathan Feinberg, Parsing & Android Hacking (Spring 2011)
Chris Lonnen, Processing Development Environment (Summer 2011)
Eric Jordan, Graphics Weapon (2007 - 2009)
Tom Carden, Processing Hacks Director (Summer 2005 - Fall 2008)
@@ -132,13 +111,9 @@
People. Processing is a comm
Burak Arikan, Turkish
-
-
-
-
We offer a special "Thank You!" to Sami Arola for writing the base of the original P3D
- and Simon Greenwold for incorporting camera and lights. Tom Carden contributed great
+ and Simon Greenwold for incorporating camera and lights. Tom Carden contributed great
energy by co-creating Processing Hacks and maintaining Processing Blogs. Andreas Schlegel
did amazing work for over three years organizing the Contributed Libraries and building
templates and documentation.
diff --git a/content/static/shop/index.html b/content/static/shop/index.html
index 64177106e..bcfd0ba95 100644
--- a/content/static/shop/index.html
+++ b/content/static/shop/index.html
@@ -114,7 +114,7 @@
If you're interested in buying a book about Processing,
Learning Processing, Second Edition: A Beginner's Guide to Programming Images, Animation, and Interaction
Daniel Shiffman
» More info
- » Order from Amazon.com
+ » Order from Amazon.com
diff --git a/content/static/support.html b/content/static/support.html
new file mode 100644
index 000000000..2a8f77f05
--- /dev/null
+++ b/content/static/support.html
@@ -0,0 +1,48 @@
+
+
+
+ We need your help! Please support Processing by making a donation to the Processing Foundation. Your donation contributes to software development, education resources like code examples and tutorials, Fellowships, and community events.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ The Processing Foundation was established in 2012 after more than a decade of work with the Processing software. The Foundation’s mission is to promote software literacy within the visual arts, and visual literacy within technology-related fields — and to make these fields accessible to diverse communities. Our goal is to empower people of all interests and backgrounds to learn how to program and make creative work with code, especially those who might not otherwise have access to these tools and resources. You can read more about the history of Processing in the short essay "A Modern Prometheus."
+
diff --git a/content/static/tutorials/anatomy/index.html b/content/static/tutorials/anatomy/index.html
index 39423e74e..6fe27c928 100644
--- a/content/static/tutorials/anatomy/index.html
+++ b/content/static/tutorials/anatomy/index.html
@@ -61,7 +61,7 @@ Step 2: Some basic trigonometry
So, if you have a line of length r starting at (0,0) at an angle theta (θ), what are its coordinates in terms of x and y? If you know a little bit of
trigonometry, the answer is that the endpoint of the line is at (r cos θ, r sin θ). If you don’t
know trigonometry, take a look at this tutorial (a general and very light introduction to
- trigonometry), this tutorial (oriented towards Processing), and this example from chapter 13 of Learning Processing. In the following diagram, angles are drawn clockwise, which is how they are measured in Processing.
+ trigonometry), this tutorial (oriented towards Processing), and this example from chapter 13 of Learning Processing. In the following diagram, angles are drawn clockwise, which is how they are measured in Processing.
diff --git a/content/static/tutorials/android/index.html b/content/static/tutorials/android/index.html
index f339fd9ba..75a355092 100644
--- a/content/static/tutorials/android/index.html
+++ b/content/static/tutorials/android/index.html
@@ -121,7 +121,7 @@ Step Three: Running the App on a Device
- Lead Developers
+ Project Leads
Ben Fry and Casey Reas
started Processing in Spring 2001 and continue to obsessively work on it. In 2012, they started the Processing Foundation along with Dan Shiffman, who formally joined as a third project lead.
- Senior Developers
- Andres Colubri (Boston), OpenGL / Video
- Florian Jenett (Frankfurt), Forum
- Elie Zananiri (Montreal), Contributed Libraries / Tools
- Scott Murray (San Francisco), Website / Reference / UI
+ Developers
+ Andres Colubri (Boston), OpenGL / Video
+ Elie Zananiri (New York), Contributed Libraries / Tools
+ Samuel Pottinger (San Francisco), Processing Core
+ -
+
Libraries, Tools
- The core Processing software is augmented by libraries and tools contributed through the community.
- These inventive extensions are a bright future for the project. We have a list of
- Contributed Libraries and
+ The core Processing software is augmented by libraries and tools contributed through
+ the community. These inventive extensions are a bright future for the project. We have a
+ list of Contributed Libraries and
Contributed Tools posted online.
- These contributions can't be underestimated. For example, see how
- Karsten Schmidt (London) has transformed Processing
- through the toxiclibs library and how
- Damien Di Fede (Austin) has extended the project
- into programming sound through his minim
- library.
-
- Fellowship Alumni
- Lauren McCarthy (New York), Spring/Summer/Fall 2013
- Greg Borenstein (New York), Spring/Summer 2013
- Wilm Thoben (Los Angeles), Fall 2013/Winter 2014
+ These contributions can't be underestimated. For example, see how Karsten Schmidt (London) has
+ transformed Processing through the toxiclibs library and how Damien Di Fede (Austin) has extended
+ the project into programming sound through his minim library.
- Developer Alumni
+ Alumni
+ Jakub Valtar (Brno), Processing Core
+ Scott Garner (New York), Hello Processing Website
+ Scott Murray (San Francisco), Website / Reference / UI
+ Gottfried Haider (Los Angeles), Processing for Pi
+ Florian Jenett (Frankfurt), Forum
+ Jamie Kosoy (San Francisco), Website
+ Manindra Moharana (San Diego), PDE / Core
+ James Grady (Boston), Visual Design
+
+
Patrick Hebron, Video Library (Summer 2011)
Peter Kalauskas, Library/Tool/Mode Install Utility (Summer, Fall 2011)
Andreas Schlegel, Libraries (Winter 2008 - Summer 2011)
Harshani Nawarathna, Processing Development Environment (Summer 2011)
Cindy Chi, Reference Editing (Summer 2011)
- Jonathan Feinberg, Parsing & Android Hacking (Spring 2011)
+ Jonathan Feinberg, Parsing & Android Hacking (Spring 2011)
Chris Lonnen, Processing Development Environment (Summer 2011)
Eric Jordan, Graphics Weapon (2007 - 2009)
Tom Carden, Processing Hacks Director (Summer 2005 - Fall 2008)
@@ -132,13 +111,9 @@
People. Processing is a comm Burak Arikan, Turkish -
- -
-We offer a special "Thank You!" to Sami Arola for writing the base of the original P3D - and Simon Greenwold for incorporting camera and lights. Tom Carden contributed great + and Simon Greenwold for incorporating camera and lights. Tom Carden contributed great energy by co-creating Processing Hacks and maintaining Processing Blogs. Andreas Schlegel did amazing work for over three years organizing the Contributed Libraries and building templates and documentation. diff --git a/content/static/shop/index.html b/content/static/shop/index.html index 64177106e..bcfd0ba95 100644 --- a/content/static/shop/index.html +++ b/content/static/shop/index.html @@ -114,7 +114,7 @@
If you're interested in buying a book about Processing,
Learning Processing, Second Edition: A Beginner's Guide to Programming Images, Animation, and Interaction
Daniel Shiffman
» More info
- » Order from Amazon.com
+ » Order from Amazon.com
Some helpful tips when you’re working with Processing & Android:
- I know I’ve said this before, but be patient. Canceling a process (ie. the emulator load or a device compile) can cause problems. If you do this inadvertently, you’re best off restarting Processing.
-- Make sure to check out the Processing Android Wiki, where you’ll find some troubleshooting advice, and some tips on how to get your sketches working properly on your device.
+- Make sure to check out the Processing Android Wiki, where you’ll find some troubleshooting advice, and some tips on how to get your sketches working properly on your device.
This tutorial is for Processing version 2.0+. If you see any errors or have comments, please let us know. This tutorial is adapted from 'Processing & Android: Mobile App Development Made (Very) Easy' by Jer Thorp
diff --git a/content/static/tutorials/arraylist/index.html b/content/static/tutorials/arraylist/index.html index 613ffee6a..5f24a6ad5 100644 --- a/content/static/tutorials/arraylist/index.html +++ b/content/static/tutorials/arraylist/index.html @@ -1,4 +1,4 @@ -In truth, we could use a simple array to manage our Particle objects. Some particle systems might have a fixed number of particles, and arrays are magnificently efficient in those instances. Processing also offers expand(), contract(), subset(), splice() and other methods for resizing arrays. However, for these examples, the Java class ArrayList (found in the java.util package: http://download.oracle.com/javase/6/docs/api/java/util/ArrayList.html) will prove to be the best solution. Using an ArrayList is conceptually similar to a standard array, but the syntax is different. Here is some code (that assumes the existence of a generic Particle class) demonstrating identical results: first with an array, and second with an ArrayList. +In truth, we could use a simple array to manage our Particle objects. Some particle systems might have a fixed number of particles, and arrays are magnificently efficient in those instances. Processing also offers expand(), contract(), subset(), splice() and other methods for resizing arrays. However, for these examples, the Java class ArrayList (found in the java.util package: https://docs.oracle.com/javase/8/docs/api/java/util/ArrayList.html) will prove to be the best solution. Using an ArrayList is conceptually similar to a standard array, but the syntax is different. Here is some code (that assumes the existence of a generic Particle class) demonstrating identical results: first with an array, and second with an ArrayList. // THE STANDARD ARRAY WAY int total = 10; diff --git a/content/static/tutorials/color/imgs/grayscale.svg b/content/static/tutorials/color/imgs/grayscale.svg new file mode 100644 index 000000000..ece2648ff --- /dev/null +++ b/content/static/tutorials/color/imgs/grayscale.svg @@ -0,0 +1,24 @@ + + + + diff --git a/content/static/tutorials/color/imgs/order.svg b/content/static/tutorials/color/imgs/order.svg new file mode 100644 index 000000000..38176b1bb --- /dev/null +++ b/content/static/tutorials/color/imgs/order.svg @@ -0,0 +1,20 @@ + + + + diff --git a/content/static/tutorials/color/index.html b/content/static/tutorials/color/index.html index 9828644ef..c609f8d15 100644 --- a/content/static/tutorials/color/index.html +++ b/content/static/tutorials/color/index.html @@ -13,7 +13,7 @@Daniel Shiffman
In the digital world, when we want to talk about a color, precision is required. Saying "Hey, can you make that circle bluish-green?" will not do. Color, rather, is defined as a range of numbers. Let's start with the simplest case: black & white or grayscale. 0 means black, 255 means white. In between, every other number—50, 87, 162, 209, and so on—is a shade of gray ranging from black to white. -
+
Does 0-255 seem arbitrary to you?
@@ -40,7 +40,7 @@
Daniel Shiffman
In addition, if we draw two shapes, Processing will always use the most recently specified stroke and fill, reading the code from top to bottom. -
+
@@ -66,7 +66,7 @@ RGB Color
-
+ Example: RGB color
background(255); @@ -109,7 +109,7 @@Color Transparency
size(200,200); diff --git a/content/static/tutorials/data/imgs/data_03_table.png b/content/static/tutorials/data/imgs/data_03_table.png index d0ff43b2d..961ac434c 100644 Binary files a/content/static/tutorials/data/imgs/data_03_table.png and b/content/static/tutorials/data/imgs/data_03_table.png differ diff --git a/content/static/tutorials/data/imgs/data_04_excel.jpg b/content/static/tutorials/data/imgs/data_04_excel.jpg index 1406af987..c004098da 100755 Binary files a/content/static/tutorials/data/imgs/data_04_excel.jpg and b/content/static/tutorials/data/imgs/data_04_excel.jpg differ diff --git a/content/static/tutorials/data/imgs/data_06_xml.jpg b/content/static/tutorials/data/imgs/data_06_xml.jpg index 7a1a18035..10cadd588 100755 Binary files a/content/static/tutorials/data/imgs/data_06_xml.jpg and b/content/static/tutorials/data/imgs/data_06_xml.jpg differ diff --git a/content/static/tutorials/data/imgs/data_07_weatherxml.jpg b/content/static/tutorials/data/imgs/data_07_weatherxml.jpg index bc65c1042..e0de2e503 100755 Binary files a/content/static/tutorials/data/imgs/data_07_weatherxml.jpg and b/content/static/tutorials/data/imgs/data_07_weatherxml.jpg differ diff --git a/content/static/tutorials/data/imgs/fig_18_01_user_input.png b/content/static/tutorials/data/imgs/fig_18_01_user_input.png new file mode 100755 index 000000000..e4b8f4797 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_01_user_input.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_02_filetxt.png b/content/static/tutorials/data/imgs/fig_18_02_filetxt.png new file mode 100755 index 000000000..2e82a2f1d Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_02_filetxt.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_03_datatxt.png b/content/static/tutorials/data/imgs/fig_18_03_datatxt.png new file mode 100755 index 000000000..33a877bcb Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_03_datatxt.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_04_bargraph.png b/content/static/tutorials/data/imgs/fig_18_04_bargraph.png new file mode 100755 index 000000000..ef797f982 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_04_bargraph.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_05_datacsv.png b/content/static/tutorials/data/imgs/fig_18_05_datacsv.png new file mode 100755 index 000000000..6c75a3c9c Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_05_datacsv.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png b/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png new file mode 100755 index 000000000..77de335e7 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_06_datacsv_grid.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png b/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png new file mode 100755 index 000000000..64a8e5f79 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_07_tablebubbles.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_08_rollover.png b/content/static/tutorials/data/imgs/fig_18_08_rollover.png new file mode 100644 index 000000000..7b823a954 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_08_rollover.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png b/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png new file mode 100755 index 000000000..8d5398cf2 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_09_shaunsheep.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png b/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png new file mode 100755 index 000000000..b4456ba92 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_10_shaunsheep_sourc.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png b/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png new file mode 100755 index 000000000..61acef65d Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_11_parsing_imdb.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png b/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png new file mode 100644 index 000000000..402f9e213 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_12_traditional_arra.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png b/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png new file mode 100644 index 000000000..82fe0b68f Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_13_associative_arra.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png b/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png new file mode 100755 index 000000000..f60db5375 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_14_concordance_viz.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png b/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png new file mode 100755 index 000000000..8535f1b6e Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_15_xml_tree.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_16_rss.png b/content/static/tutorials/data/imgs/fig_18_16_rss.png new file mode 100755 index 000000000..1bdb2d482 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_16_rss.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_17_weather.png b/content/static/tutorials/data/imgs/fig_18_17_weather.png new file mode 100755 index 000000000..f379ab30f Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_17_weather.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png b/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png new file mode 100755 index 000000000..b58ced2a2 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_18_xmlbubbles.png differ diff --git a/content/static/tutorials/data/imgs/fig_18_19_thread.png b/content/static/tutorials/data/imgs/fig_18_19_thread.png new file mode 100755 index 000000000..f79c43d28 Binary files /dev/null and b/content/static/tutorials/data/imgs/fig_18_19_thread.png differ diff --git a/content/static/tutorials/data/index-old.html b/content/static/tutorials/data/index-old.html new file mode 100644 index 000000000..6221a4a80 --- /dev/null +++ b/content/static/tutorials/data/index-old.html @@ -0,0 +1,527 @@ +
|
+
+ + This tutorial is from the book Learning Processing by Daniel Shiffman, published by Morgan Kaufmann, © 2008 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know. + + +Data+Daniel Shiffman+ + ++ This tutorial picks up where the Strings and Drawing Text tutorial leaves off and examines how to use String objects as the basis for reading and writing data. We'll start by learning more sophisticated methods for manipulating Strings, searching in them, chopping them up, and joining them together. Afterwards, we'll see how these skills allow us to use input from data sources, such as text files, web pages, xml feeds, and 3rd party APIs and take a step into the world of data visualization. + + +Manipulating Strings+ ++ In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String class, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API. + + ++ Let's take a closer look at the following two String functions: indexOf() and substring(). indexOf() locates a sequence of characters within a String. It takes one argument, a search String, and returns a numeric value that corresponds to first occurrence of the search string inside of the string being searched. + + ++String search = "def"; +String toBeSearched = "abcdefghi"; +int index = toBeSearched.indexOf(search); // The value of index in this example is 3. ++ + + Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value and therefore can indicate "not found." After finding a search phrase within a String, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as "substring." The substring() function which takes two arguments, a start index and an end index and returns the substring in between the two indices. + + ++String alphabet = "abcdefghi"; +String sub = alphabet.substring(3,6); // The String sub is now "def". ++ + Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know. I know. Wouldn't it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it's actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index. + +Splitting and Joining Strings+ +In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard. Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, we will often be presented that data in the form of an array of strings or as one long string. Depending on what we want to accomplish, it's useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy. + +"one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"} + +Let's take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the string to be split and the delimiter. (The delimiter can be a single character or a string. Note that in the code below the period is not set as a delimiter and therefore will be included in the last string in the array: "dog." + +
+// Splitting a String based on spaces
+String spaceswords = "The quick brown fox jumps over the lazy dog.";
+String[] list = split(spaceswords, " ");
+for (int i = 0; i < list.length; i++) {
+ println(list[i] + " " + i);
+}
+
+
+If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically to split() with one exception: any character that appears in the String qualifies as a delimiter. In the code below, the period is set as a delimiter and therefore will not be included in the last spot in the array: "dog" + +
+// Splitting a String based on a multiple delimiters
+String stuff = "hats & apples, cars + phones % elephants dog.";
+String[] list = splitTokens(stuff, " &,+.");
+for (int i = 0; i < list.length; i++) {
+ println(list[i] + " " + i);
+}
+
+
+If we are splitting numbers in a String the resulting array can be converted into an integer array with Processing's int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless we convert them first. + +
+// Calculate sum of a list of numbers in a String
+String numbers = "8,67,5,309";
+// Converting the String array to an int array
+int[] list = int(split(numbers, ','));
+int sum = 0;
+for (int i = 0; i < list.length; i++) {
+ sum = sum + list[i];
+}
+println(sum);
+
+
+The reverse of split() is join(). join() takes an array of Strings and joins them together into one long string. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a String of characters. + +Consider the following array: + +
+String[] lines = {"It", "was", "a", "dark", "and", "stormy", "night."};
+
+
+Using the + operator along with a for loop, we can join an array of strings together as follows: + +
+// Manual Concatenation
+String onelongstring = "";
+for (int i = 0; i < lines.length; i++) {
+ onelongstring = onelongstring + lines[i] + " ";
+}
+
+
+The join() function, however, allows us to bypass this process achieving the same result in only one line of code. + ++// Using Processing's join() +String onelongstring = join(lines," "); ++ + Reading and Writing Text Files+ +Data can come from many different places: web sites, news feeds, databases, etc. To start, we'll demonstrate how to work with the simplest means of data retrieval data: reading from a text file.Text files can be used as a very simple database (we could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source. + +In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OSX TextEdit will do, just make sure you format the file as "plain text." It is also advisable to name the text files with the ".txt" extension, just to avoid any confusion. And just as with image files, these text files should be placed in the sketch's "data" directory in order for them to be recognized by the Processing sketch. + +Once the text file is in place, Processing's loadStrings() function is used to read the content of the file into an String array. The individual lines of text in the file each become an individual element in the array. + +
+
+
+// This code will print all the lines from the source text file.
+String[] lines = loadStrings("file.txt");
+println("there are " + lines.length + " lines");
+println(lines);
+
+
+Text from a file can be used to generate a simple visualization. Take the following data file. + +
+
+Here, we can load the numbers separated by commas and split them into an array of ints used to set color and height of rectangles. + +
+int[] data;
+
+void setup() {
+ size(200,200);
+ // Load text file as a string
+ String[] stuff = loadStrings("data.txt");
+ // Convert string into an array of integers using ',' as a delimiter
+ data = int(split(stuff[0],','));
+}
+
+void draw() {
+ background(255);
+ stroke(0);
+ for (int i = 0; i < data.length; i++) {
+ fill(data[i]);
+ rect(i*20,0,20,data[i]);
+ }
+}
+
+
+Text can also be written back to a data file with saveStrings(). saveStrings() writes an array of strings to a file, one line per string. + +
+String words = "apple bear cat dog";
+String[] list = split(words, ' ');
+
+// Writes the strings to a file, each on a separate line
+saveStrings("nouns.txt", list);
+
+
+There are cases, however, where you don't want to write a text file all at once. Rather, you want to continuously append to a file over time. This can be achieved with the PrintWriter class. Take the following example which writes saves mouseX and mouseY to a text file for each cycle through draw(), quitting when you press a key. + +
+PrintWriter output;
+
+void setup() {
+ // Create a new file in the sketch directory
+ output = createWriter("positions.txt");
+}
+
+void draw() {
+ point(mouseX, mouseY);
+ output.println(mouseX); // Write the coordinate to the file
+}
+
+void keyPressed() {
+ output.flush(); // Writes the remaining data to the file
+ output.close(); // Finishes the file
+ exit(); // Stops the program
+}
+
+
+Tabular Data+ +You may have noticed that the graphing example above loads a text file with numbers separated by commas. Processing includes a Table class which will load a comma-separated (CSV) or tab-separated (TSV) file and automatically parse the data into columns and rows for you. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like: + +
+
+Instead of saying: + +
+String[] stuff = loadStrings("data.csv");
+
+
+We can now say: + +
+Table table = loadTable("data.csv");
+
+
+Now we've missed an important detail. Take a look at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a "header row." This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header" there are other options you can specify. For example if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page. + +
+Table table = loadTable("data.csv","header");
+
+
+Now that the table is loaded, we can look at how we grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid. + +
+
+In the above grid we can see that the data is organized in terms of rows and columns. One way to access the data would be to therefore request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x, y) location though in this case the y position (i.e. row) comes first. The following code requests a piece of data at a given (row, column) location. + ++int val1 = table.getInt(2, 1); // val now has the value 235 +float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068 +String s = table.getString(0, 3); // s now has the value "Happy" ++ + While the numeric index is sometimes useful, it's generally going to be more convenient to access each piece of data by the column name. For example, we could pull out a specific row from the Table. + ++TableRow row = table.getRow(2); // Gets the third row (index 2) ++ +Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table. + +Once we have the TableRow object, we can ask for data from some or all of the columns. + +
+int x = row.getInt("x"); // x has the value 273
+int y = row.getInt("y"); // y has the value 235
+float d = row.getFloat("diameter"); // d has the value 61.14072
+String s = row.getString("name"); // s has the value "Joyous"
+
+
+The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so with the method rows().
+
+
+for (TableRow row : table.rows()) {
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+ // Do something with the data of each row
+}
+
+
+If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows().
+
+In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString(). + +
+// Update the value of column "x" to mouseX in a given TableRow.
+row.setInt("x",mouseX);
+
+
+To add a new row to a Table, simply call the method addRow() and set the values of each column. + +
+// Create a new row
+TableRow row = table.addRow();
+// Set the values of that row
+row.setFloat("x", mouseX);
+row.setFloat("y", mouseY);
+row.setFloat("diameter", random(40, 80));
+row.setString("name", "new label");
+
+
+To delete a row to a Table, simply call the method removeRow() and pass in the numeric index of the row you would like removed. The following code for example, removes the first row whenever the size of the table is greater than ten rows. + +
+// If the table has more than 10 rows
+if (table.getRowCount() > 10) {
+ // Delete the first row
+ table.removeRow(0);
+}
+
+
+For an example that creates objects from and saves objects to a Table, take a look at LoadSaveTable under Topics --> Advanced Data. + +XML Data+ +For grabbing data from the web, an XML (Extensible Markup Language) feed is an excellent option (if available). Unlike HTML (which is designed to make content vieweable by a human's eyes) XML is designed to make content viewable by a computer and facilitate the sharing of data across different systems. + +XML organizes information in a tree structure. Let's imagine a list of students. Each student has an id number, name, address, e-mail, and telephone number. Each student's address has a city, state, and zip code. An XML tree for this dataset might look like the following: + +
+<?xml version="1.0" encoding="UTF-8"?> +<students> + <student> + <id>001</id> + <name>Daniel Shiffman</name> + <phone>555-555-5555</phone> + <email>daniel@shiffman.net</email> + <address> + <street>123 Processing Way</street> + <city>Loops</city> + <state>New York</state> + <zip>01234</zip> + </address> + </student> + <student> + <id>002</id> + <name>Zoog</name> + <phone>555-555-5555</phone> + <email>zoog@planetzoron.uni</email> + <address> + <street>45.3 Nebula 5</street> + <city>Boolean City</city> + <state&tt;Booles</state> + <zip>12358</zip> + </address> + </student> +</students> ++ + Note the similarities to object-oriented programming. We could think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an id, a name, a phone number, an e-mail address, and a mailing address. The mailing address is also an object that also has multiple pieces of data, such as street, city, state, and zip. + +Let's look at Yahoo's XML feed for weather data. Here is the raw XML source (Note I have edited it for simplification purposes). + ++<?xml version="1.0" encoding="UTF-8" standalone="yes" ?> +<rss version="2.0" xmlns:yweather="http://xml.weather.yahoo.com/ns/rss/1.0"> + <channel> + <item> + <title>Conditions for New York, NY at 3:51 pm EST</title> + <geo:lat>40.67</geo:lat> + <geo:long>-73.94</geo:long> + <link>http://xml.weather.yahoo.com/forecast/USNY0996_f.html</link> + <pubDate>Mon, 20 Feb 2006 3:51 pm EST</pubDate> + <yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/> + <yweather:forecast day="Mon" date="20 Feb 2006" low="25" high="37" text="Clear" code="31"/> + </item> + </channel> +</rss> ++ + And here is the data mapped in the tree structure. + +
You may be wondering what the top level "RSS" is all about. Yahoo's XML weather data is provided in RSS format. RSS stands for "Really Simple Syndication" and is a standardized XML format for syndicating web content (such as news articles, etc.) + +Now that we have a handle on the tree structure, we should look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, i.e. <channel> and an end tag, i.e. </channel>. Some of these elements have content between the tags: + ++<title>Conditions for New York, NY at 3:51 pm EST</title> ++ + and some have attributes (formatted by attribute name equals attribute value in quotes): + ++<yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/> ++ + Knowing this format, we could certainly be clever with our use of split(), indexOf(), and substring() to find the pieces we want in the raw XML. The point here, however, is that because XML is a standard format, we don't have to do this. Rather, we can use an XML parser. In Processing, the XML parser is called just that: XML. + +
+XML xml = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003");
+
+
+Here, instead of loadStrings() or loadTable(), we're now calling loadXML() and passing in the address (URL or local file) of our XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram, we see that we can find the current temperature via the following path: + +
We could translate the above into code as follows: + +
+XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1
+XML channel = root.getChild("channel"); // Step 2
+XML item = channel.getChild("item"); // Step 3
+XML yweather = item.getChild("yweather:condition"); // Step 4
+int temperature = yweather.getInt("temp"); // Step 5
+
+
+This is a bit long-winded, however, and so can be compressed down into one (or three as below) lines of code. + +
+XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003); // Step 1
+XML forecast = root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4
+int temperature = forecast.getInt("temp"); // Step 5
+
+
+Finally, the second line of code above can be further condensed to:
+
+
+XML forecast = xml.getChild("channel/item/yweather:condition"); // Steps 2-4
+
+
+It should also be noted that we're accessing the child nodes by their name (i.e. "channel", "item", etc.), but they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children. In LoadSaveTable, we used a series of comma separated values in a text file to store information related to Bubble objects. An XML document can also be used in the same manner. Consider the following XML document: + ++<?xml version="1.0" encoding="UTF-8"?> +<bubbles> + <bubble> + <position x="160" y="103"/> + <diameter>43.19838</diameter> + <label>Happy</label> + </bubble> + <bubble> + <position x="372" y="137"/> + <diameter>52.42526</diameter> + <label>Sad</label> + </bubble> + <bubble> + <position x="273" y="235"/> + <diameter>61.14072</diameter> + <label>Joyous</label> + </bubble> + <bubble> + <position x="121" y="179"/> + <diameter>44.758068</diameter> + <label>Melancholy</label> + </bubble> +</bubbles> ++ + In the above XML, the root element is "bubbles" which has four children. Each child "bubble" has 3 children, "position", "diameter", and "label." The "position" element has two attributes, "x" and "y." To access the list of all XML nodes "bubble" we can use the getChildren() method, passing in the name "bubble" + +
+// Load an XML document
+XML xml = loadXML("bubbles.xml");
+
+// Get all the child elements
+XML[] children = xml.getChildren("bubble");
+
+
+Once we have the array of XML objects, we can iterate over them, accessing the individual pieces of data for each "bubble". Notice how the syntax for getting XML attributes (in this case, "x" and "y" of the position element is slightly different than pulling content directly from an element (in this case, "diameter" and "label"). + +
+for (int i = 0; i < bubbles.length; i++) {
+
+ // The position element has two attributes: x and y
+ XML positionElement = children[i].getChild("position");
+ // Note how with attributes we can get an integer or float via getInt() and getFloat()
+ float x = positionElement.getInt("x");
+ float y = positionElement.getInt("y");
+
+ // The diameter is the content of the child named "diamater"
+ XML diameterElement = children[i].getChild("diameter");
+ // Note how with the content of an XML node, we retrieve via getIntContent() and getFloatContent()
+ float diameter = diameterElement.getFloatContent();
+
+ // The label is the content of the child named "label"
+ XML labelElement = children[i].getChild("label");
+ String label = labelElement.getContent();
+}
+
+
+XML elements can be added and removed from the XML tree with the addChild() and removeChild() methods. + +For the full example that creates objects from and saves objects to an XML document, take a look at LoadSaveXML under Topics --> Advanced Data. + +Threads+ +You are likely familiar with the idea of writing a program that follows a specific sequence of steps -- setup() first then draw() over and over and over again! A Thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the "Animation" thread. Other threads sequences, however, can run independently of the main Processing sketch. In fact, you can launch any number of threads at one time and they will all run concurrently. + +Processing does this all the time, whenever you write an event callback, such as serialEvent(), or captureEvent(), etc. these functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful whenever you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network (XML, database, etc.) If a separate thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread. To create independent, asynchronous threads, you can use the thread() function built into Processing. + +
+void setup() {
+ size(200,200);
+ thread("someFunction");
+}
+
+void draw() {
+
+}
+
+void someFunction() {
+ // This function will run as a thread when called via
+ // thread("someFunction") as it was in setup!
+}
+
+
+The thread() function receives a String as an argument. The String should match the name of the function you want to run as a thread. This is especially useful in sketches that grab data for the web. Rather than have the animation freeze while the sketch is waiting to retrieve data, the sketch can continue to loop through draw() updating the data when the thread is completed. In these cases, a boolean variable can be useful to track the status of the thread. + ++boolean loading = false; ++ + The function that loads the data can then set loading equal to true at the start and false at the end. + +
+void loadData() {
+ loading = true;
+
+ ///////////////////////////////////
+ // All of the data retrival code //
+ ///////////////////////////////////
+
+ loading = false;
+}
+
+
+In draw(), you can choose to display something to indicate the thread is running (when loading equals true). + +
+void draw() {
+ if (loading) {
+ // Draw something to indicate loading
+ }
+}
+
+
+
+Two examples that follow this methodology can be found under Topics --> Advanced Data in the Processing examples. + +While using the thread() function is a very simple way of getting an independent thread, it should be noted that it is somewhat limited. Being able to make a thread object is a great deal more powerful, and this can be done by extending the Java Thread class. + + + |
+
- This tutorial is from the book Learning Processing by Daniel Shiffman, published by Morgan Kaufmann, © 2008 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know. + This tutorial is from the book Learning Processing, 2nd Edition by Daniel Shiffman, published by Morgan Kaufmann, © 2015 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know.
Data
@@ -17,281 +17,771 @@Daniel Shiffman
Manipulating Strings
- In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String class, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API. -
- -- Let's take a closer look at the following two String functions: indexOf() and substring(). indexOf() locates a sequence of characters within a String. It takes one argument, a search String, and returns a numeric value that corresponds to first occurrence of the search string inside of the string being searched. -
- + In Strings and Drawing Text, we touched on a few of the basic functions available in the Java String, such as charAt(), toUpperCase(), equals(), and length(). These functions are documented on the Processing reference page for Strings. Nevertheless, in order to perform some more advanced data parsing techniques, we'll need to explore some additional String manipulation functions documented in the Java API. ++ Let's take a closer look at the following two String functions: indexOf() and substring().
+ indexOf() locates a sequence of characters within a string. It takes one argument — a search string — and returns a numeric value that corresponds to the first occurrence of the search string inside of the String object being searched.
String search = "def"; String toBeSearched = "abcdefghi"; int index = toBeSearched.indexOf(search); // The value of index in this example is 3.-
- Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value and therefore can indicate "not found." After finding a search phrase within a String, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as "substring." The substring() function which takes two arguments, a start index and an end index and returns the substring in between the two indices. -
- + Strings are just like arrays, in that the first character is index number zero and the last character is the length of the string minus one. If the search string cannot be found, indexOf() returns -1. This is a good choice because -1 is not a legitimate index value in the string itself, and therefore can indicate "not found." There are no negative indices in a string of characters or in an array. ++ After finding a search phrase within a string, we might want to separate out part of the string, saving it in a different variable. A part of a string is known as a substring and substrings are made with the substring() function which takes two arguments, a start index and an end index. substring() returns the substring in between the two indices.
+
String alphabet = "abcdefghi"; -String sub = alphabet.substring(3,6); // The String sub is now "def". +String sub = alphabet.substring(3, 6); // The String sub is now "def".- -
Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know. I know. Wouldn't it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it's actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index.
+ Note that the substring begins at the specified start index (the first argument) and extends to the character at end index (the second argument) minus one. I know, I know. Wouldn’t it have been easier to just take the substring from the start index all the way to the end index? While this might initially seem true, it’s actually quite convenient to stop at end index minus one. For example, if you ever want to make a substring that extends to the end of a string, you can simply go all the way to thestring.length(). In addition, with end index minus one marking the end, the length of the substring is easily calculated as end index minus begin index. +Splitting and Joining Strings
-In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard. Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, we will often be presented that data in the form of an array of strings or as one long string. Depending on what we want to accomplish, it's useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy.
- -"one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"} - -Let's take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the string to be split and the delimiter. (The delimiter can be a single character or a string. Note that in the code below the period is not set as a delimiter and therefore will be included in the last string in the array: "dog."
- +
+ In Strings and Drawing Text, we saw how strings can be joined together (referred to as "concatenation") using the "+" operator. Let's review with a example that uses concatenation to get user input from a keyboard.
+
+
+
+PFont f;
+
+// Variable to store text currently being typed
+String typing = "";
+// Variable to store saved text when return is hit
+String saved = "";
+
+void setup() {
+ size(300, 200);
+ f = createFont("Arial", 16);
+}
+
+void draw() {
+ background(255);
+ int indent = 25;
+
+ // Set the font and fill for text
+ textFont(f);
+ fill(0);
+
+ // Display everything
+ text("Click in this sketch and type. \nHit return to save what you typed.", indent, 40);
+ text(typing, indent, 90);
+ text(saved, indent, 130);
+}
+
+void keyPressed() {
+ // If the return key is pressed, save the String and clear it
+ if (key == '\n') {
+ saved = typing;
+ typing = "";
+ // Otherwise, concatenate the String
+ } else {
+ typing = typing + key;
+ }
+}
+
+ Processing has two additional functions that make joining strings (or the reverse, splitting them up) easy. In sketches that involve parsing data from a file or the web, you might get hold of that data in the form of an array of strings or as one long string. Depending on what you want to accomplish, it’s useful to know how to switch between these two modes of storage. This is where these two new functions, split() and join(), will come in handy.
+
+
+ "one long string or array of strings" ←→ {"one", "long", "string", "or" ,"array", "of", "strings"}
+
+
+ Let’s take a look at the split() function. split() separates a longer string into an array of strings, based on a split character known as the delimiter. It takes two arguments, the String object to be split and the delimiter. (The delimiter can be a single character or a string.) In the code below, the period is not set as a delimiter and therefore will be included in the last string in the array: “dog.” Note how printArray() can be used to print the contents of an array and their corresponding indices to the message console.
-// Splitting a String based on spaces
+// Splitting a string based on spaces
String spaceswords = "The quick brown fox jumps over the lazy dog.";
String[] list = split(spaceswords, " ");
-for (int i = 0; i < list.length; i++) {
- println(list[i] + " " + i);
-}
+printArray(list);
-
-If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically to split() with one exception: any character that appears in the String qualifies as a delimiter. In the code below, the period is set as a delimiter and therefore will not be included in the last spot in the array: "dog"
- + Here is an example using a comma as the delimiter (this time passing in a single character: ','.) +
-// Splitting a String based on a multiple delimiters
-String stuff = "hats & apples, cars + phones % elephants dog.";
-String[] list = splitTokens(stuff, " &,+.");
-for (int i = 0; i < list.length; i++) {
- println(list[i] + " " + i);
-}
+// Splitting a string based on commas
+String commaswords = "The,quick,brown,fox,jumps,over,the,lazy,dog.";
+String[] list = split(commaswords, ",");
+printArray(list);
-
-If we are splitting numbers in a String the resulting array can be converted into an integer array with Processing's int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless we convert them first.
- + If you want to use more than one delimiter to split up a text, you must use the Processing function splitTokens(). splitTokens() works identically as split() with one exception: any character that appears in the passed string qualifies as a delimiter.) In the code below, the period is specified as a delimiter and therefore will not be included in the last string in the array: “dog”.+
+// Splitting a String based on multiple delimiters +String stuff = "hats & apples, cars + phones % elephants dog."; +String[] list = splitTokens(stuff, " &,+." ); +printArray(list); ++ If you are splitting numbers in a string, the resulting array can be converted into an integer array with Processing’s int() function. Numbers in a string are not numbers and cannot be used in mathematical operations unless you convert them first.
// Calculate sum of a list of numbers in a String
String numbers = "8,67,5,309";
// Converting the String array to an int array
-int[] list = int(split(numbers, ','));
+int[] list = int(split(numbers, ','));
int sum = 0;
-for (int i = 0; i < list.length; i++) {
+for (int i = 0; i<list.length; i++ ) {
sum = sum + list[i];
}
-println(sum);
+println(sum);
-
-The reverse of split() is join(). join() takes an array of Strings and joins them together into one long string. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a String of characters.
- -Consider the following array:
- + The reverse of split() is join(). join() takes an array of strings and joins them together into one long String object. The join() function also takes two arguments, the array to be joined and a separator. The separator can either be a single character or a string of characters. + + +
+ Consider the following array:
String[] lines = {"It", "was", "a", "dark", "and", "stormy", "night."};
-
-Using the + operator along with a for loop, we can join an array of strings together as follows:
- + Using the “+” operator along with afor loop, you can join a string together as follows:
// Manual Concatenation
String onelongstring = "";
for (int i = 0; i < lines.length; i++) {
- onelongstring = onelongstring + lines[i] + " ";
+ onelongstring = onelongstring + lines[i] + " ";
}
-
-The join() function, however, allows us to bypass this process achieving the same result in only one line of code.
- + The join() function, however, allows you to bypass this process, achieving the same result in only one line of code.// Using Processing's join() -String onelongstring = join(lines," "); +String onelongstring = join(lines, " ");+ -
Reading and Writing Text Files
+Dealing with Data
-Data can come from many different places: web sites, news feeds, databases, etc. To start, we'll demonstrate how to work with the simplest means of data retrieval data: reading from a text file.Text files can be used as a very simple database (we could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source.
- -In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OSX TextEdit will do, just make sure you format the file as "plain text." It is also advisable to name the text files with the ".txt" extension, just to avoid any confusion. And just as with image files, these text files should be placed in the sketch's "data" directory in order for them to be recognized by the Processing sketch.
- -Once the text file is in place, Processing's loadStrings() function is used to read the content of the file into an String array. The individual lines of text in the file each become an individual element in the array.
- -
+ + Data can come from many different places: websites, news feeds, spreadsheets, databases, and so on. Let's say you've decided to make a map of the world's flowers. After searching online you might find a PDF version of a flower encyclopedia, or a spreadsheet of flower genera, or a JSON feed of flower data, or a REST API that provides geolocated lat/lon coordinates, or some web page someone put together with beautiful flower photos, and so on and so forth. The question inevitably arises: “I found all this data; which should I use, and how do I get it into Processing?” +
+ +
+ If you are really lucky, you might find a Processing library that hands data to you directly with code. Maybe the answer is to just download this library and write some code like:
+
+import flowers.*;
+void setup() {
+ FlowerDatabase fdb = new FlowerDatabase();
+ Flower sunflower = fdb.findFlower("sunflower");
+ float h = sunflower.getAverageHeight();
+}
+
+ In this case, someone else has done all the work for you. They've gathered data about flowers and built a Processing library with a set of functions that hands you the data in an easy-to-understand format. This library, sadly, does not exist (not yet), but there are some that do. For example, YahooWeather is a library by Marcel Schwittlick that grabs weather data from Yahoo for you, allowing you to write code like weather.getWindSpeed() or weather.getSunrise() and more. There is still plenty of work to do in the case of using a library.
+
+
+ + Let's take another scenario. Say you’re looking to build a visualization of Major League Baseball statistics. You can't find a Processing library to give you the data but you do see everything you’re looking for at mlb.com. If the data is online and your web browser can show it, shouldn't you be able to get the data in Processing? Passing data from one application (like a web application) to another (say, your Processing sketch) is something that comes up again and again in software engineering. A means for doing this is an API or “application programming interface”: a means by which two computer programs can talk to each other. Now that you know this, you might decide to search online for “MLB API”. Unfortunately, mlb.com does not provide its data via an API. In this case you would have to load the raw source of the website itself and manually search for the data you’re looking for. While possible, this solution is much less desirable given the considerable time required to read through the HTML source as well as program algorithms for parsing it. +
+ ++ Each means of getting data comes with its own set of challenges. The ease of using a Processing library is dependent on the existence of clear documentation and examples. But in just about all cases, if you can find your data in a format designed for a computer (spreadsheets, XML, JSON, etc.), you'll be able to save some time in the day for a nice walk outside. +
+ ++ One other note worth a mention about working with data. When developing an application that involves a data source, such as a data visualization, it’s sometimes useful to develop with “dummy” or “fake” data. You don't want to be debugging your data retrieval process at the same time as solving problems related to algorithms for drawing. In keeping with my one-step-at-a-time mantra, once the meat of the program is completed with dummy data, you can then focus solely on how to retrieve the actual data from the real source. You can always use random or hard-coded numbers into your code when you’re experimenting with a visual idea and connect the real data later.
+ +Working with Text Files
+ ++ Let's begin by working with the simplest means of data retrieval: reading from a text file. Text files can be used as a very simple database (you could store settings for a program, a list of high scores, numbers for a graph, etc.) or to simulate a more complex data source. +
+ ++ In order to create a text file, you can use any simple text editor. Windows Notepad or Mac OS X TextEdit will do; just make sure you format the file as “plain text.” It is also advisable to name the text files with the “.txt” extension, to avoid any confusion. And just as with image files, these text files should be placed in the sketch’s “data” directory in order for them to be recognized by the Processing sketch.
+ +
+ Once the text file is in place, Processing’s loadStrings() function is used to read the content of the file into a String array. The individual lines of text in the file each become an individual element in the array.
+
+
// This code will print all the lines from the source text file.
String[] lines = loadStrings("file.txt");
-println("there are " + lines.length + " lines");
-println(lines);
+println("There are " + lines.length + " lines.");
+printArray(lines);
-
-Text from a file can be used to generate a simple visualization. Take the following data file.
- -
-
-Here, we can load the numbers separated by commas and split them into an array of ints used to set color and height of rectangles.
- + To run the code, create a text file called “file.txt,” type a bunch of lines in that file, and place it in your sketch’s data directory.Text from a file can be used to generate a simple visualization. Take the following data file. +
+
+ +The results of visualizing this data are shown below. + +
+Graphing Comma-Separated Numbers from a Text File
+
+
int[] data;
void setup() {
- size(200,200);
- // Load text file as a string
- String[] stuff = loadStrings("data.txt");
+ size(200, 200);
+ // Load text file as a String
+ String[] stuff = loadStrings("data.csv");
// Convert string into an array of integers using ',' as a delimiter
- data = int(split(stuff[0],','));
+ data = int(split(stuff[0], ','));
}
void draw() {
background(255);
stroke(0);
- for (int i = 0; i < data.length; i++) {
- fill(data[i]);
- rect(i*20,0,20,data[i]);
+ for (int i = 0; i<data.length; i++) {
+ // Use array of ints to set the color and height of each rectangle.
+ rect(i*20, 0, 20, data[i]);
}
+ noLoop();
}
+ Looking at how to parse a csv file with split() was a nice learning exercise. In truth, dealing with csv files (which can easily be generated from spreadsheet software such as Google docs) is such a common activity that Processing has an entire built-in class called Table to handle the parsing for you.
+
+
+Tabular Data
-Text can also be written back to a data file with saveStrings(). saveStrings() writes an array of strings to a file, one line per string.
++ A table consists of data arranged as a set of rows and columns, also called “tabular data.” If you've ever used a spreadsheet, this is tabular data. Processing's loadTable() function takes comma-separated (csv) or tab-separated (tsv) values and automatically places the contents into a Table object storing the data in columns and rows. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like: +
++
+
+
+ Instead of saying:
+
+String[] stuff = loadStrings("data.csv");
+
+ We can now say:+
+Table table = loadTable("data.csv");
+
+ Now I've missed an important detail. Take a look again at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a header row. This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header", there are other options you can specify. For example, if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page.+
+Table table = loadTable("data.csv", "header");
+
+ Now that the table is loaded, I can show how you grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid.
+ +
++ In the above grid you can see that the data is organized in terms of rows and columns. One way to access the data, therefore, would be to request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x,y) location, though in this case the y position (row) comes first. The following code requests a piece of data at a given (row, column) location.
+
+int val1 = table.getInt(2, 1); // val now has the value 235 +float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068 + +String s = table.getString(0, 3); // s now has the value “Happy” ++ While the numeric index is sometimes useful, it’s generally going to be more convenient to access each piece of data by the column name. For example, I could pull out a specific row from the Table.
+
+TableRow row = table.getRow(2); // Gets the third row (index 2) ++ Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table. + + +
+ Once I have the TableRow object, I can ask for data from some or all of the columns.
-String words = "apple bear cat dog";
-String[] list = split(words, ' ');
+int x = row.getInt("x"); // // x has the value 273
+
+int y = row.getInt("y"); // y has the value 235
+
+float d = row.getFloat("diameter"); // d has the value 61.14072
-// Writes the strings to a file, each on a separate line
-saveStrings("nouns.txt", list);
+String s = row.getString("name"); // s has the value “Joyous”
+ The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so in a loop with a counter accessing each row one at a time. The total number of available rows can be retrieved with getRowCount().+
+for (int i = 0; i<table.getRowCount(); i++) {
-There are cases, however, where you don't want to write a text file all at once. Rather, you want to continuously append to a file over time. This can be achieved with the PrintWriter class. Take the following example which writes saves mouseX and mouseY to a text file for each cycle through draw(), quitting when you press a key.
+ // Access each row of the table one at a time, in a loop.
+ TableRow row = table.getRow(i);
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+
+ // Do something with the data of each row
+
+}
+
+ If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows().
+
+
+
+ In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString().
+
+row.setInt("x", mouseX); // Update the value of column "x" to mouseX in a given TableRow.
+
+ To add a new row to a Table, simply call the method addRow() and set the values of each column.+
+//Create a new row.
+TableRow row = table.addRow();
+//Set the values of all columns in that row.
+row.setFloat("x", mouseX);
+row.setFloat("y", mouseY);
+row.setFloat("diameter", random(40, 80));
+row.setString("name", "new label");
+
+ To delete a row, simply call the method removeRow() and pass in the numeric index of the row you would like removed. For example, the following code removes the first row whenever the size of the table is greater than ten rows.
-PrintWriter output;
+// If the table has more than 10 rows
+if (table.getRowCount()>10) {
+
+//Delete the first row (index 0).
+ table.removeRow(0);
+}
+
+ The following example puts all of the above code together. Notice how each row of the table contains the data for a Bubble object.
+
+
+
+Loading and Saving Tabular Data
++
+
+
+
+// The data from the Table object will fill the array of Bubble objects
+Table table;
+Bubble[] bubbles;
void setup() {
- // Create a new file in the sketch directory
- output = createWriter("positions.txt");
+ size(480, 360);
+ loadData();
}
void draw() {
- point(mouseX, mouseY);
- output.println(mouseX); // Write the coordinate to the file
+ background(255);
+ // Display all bubbles
+ for (int i = 0; i<bubbles.length; i++) {
+ bubbles[i].display();
+ }
}
-void keyPressed() {
- output.flush(); // Writes the remaining data to the file
- output.close(); // Finishes the file
- exit(); // Stops the program
+void loadData() {
+ // "header" indicates the file has header row. The size of the array
+ // is then determined by the number of rows in the table.
+ table = loadTable("data.csv", "header");
+ bubbles = new Bubble[table.getRowCount()];
+
+
+ for (int i = 0; i<table.getRowCount(); i++) {
+ // Iterate over all the rows in a table.
+ TableRow row = table.getRow(i);
+
+
+ // Access the fields via their column name (or index).
+ float x = row.getFloat("x");
+ float y = row.getFloat("y");
+ float d = row.getFloat("diameter");
+ String n = row.getString("name");
+ // Make a Bubble object out of the data from each row.
+ bubbles[i] = new Bubble(x, y, d, n);
+ }
}
-
-Tabular Data
-You may have noticed that the graphing example above loads a text file with numbers separated by commas. Processing includes a Table class which will load a comma-separated (CSV) or tab-separated (TSV) file and automatically parse the data into columns and rows for you. This is a great deal more convenient than struggling to manually parse large data files with split(). It works as follows. Let's say you have a data file that looks like:
+void mousePressed() { + // When the mouse is pressed, create a new row and set the values for each column of that row. + TableRow row = table.addRow(); + row.setFloat("x", mouseX); + row.setFloat("y", mouseY); + row.setFloat("diameter", random(40, 80)); + row.setString("name", "Blah"); -
+ // If the table has more than 10 rows, delete the oldest row.
+ if (table.getRowCount()>10) {
+ table.removeRow(0);
+ }
-Instead of saying:
+ // This writes the table back to the original CSV file + // and reloads the file so that what's drawn matches. + saveTable(table, "data/data.csv"); + loadData(); +} -
-String[] stuff = loadStrings("data.csv");
+// This simple Bubble class draws a circle to the window
+// and displays a text label when the mouse hovers.
+class Bubble {
+ float x, y;
+ float diameter;
+ String name;
+
+ boolean over = false;
+
+ // Create the Bubble
+ Bubble(float tempX, float tempY, float tempD, String s) {
+ x = tempX;
+ y = tempY;
+ diameter = tempD;
+ name = s;
+ }
+
+ // Checking if mouse is over the bubble
+ void rollover(float px, float py) {
+ float d = dist(px, py, x, y);
+ if (d<diameter/2) {
+ over = true;
+ } else {
+ over = false;
+ }
+ }
+
+ // Display the Bubble
+ void display() {
+ stroke(0);
+ strokeWeight(2);
+ noFill();
+ ellipse(x, y, diameter, diameter);
+ if (over) {
+ fill(0);
+ textAlign(CENTER);
+ text(name, x, y+diameter/2+20);
+ }
+ }
+}
-
-We can now say: + +
+ Here, the distance between a given point and a circle's center is compared to that circle's radius as depicted: +
++
+
+ + In the code below, the function returns a boolean value (true or false) depending on whether the point (mx,my) is inside the circle. Notice how radius is equal to half the diameter. +
-Table table = loadTable("data.csv");
+boolean rollover(int mx, int my) {
+ if (dist(mx, my, x, y)<diameter/2) {
+ return true;
+ } else {
+ return false;
+ }
+}
+
+Data that is not in a Standardized Format
-Now we've missed an important detail. Take a look at the data.csv text file above. Notice how the first line of text is not the data itself, but rather a "header row." This row includes labels that describe the data included in each subsequent row. The good news is that Processing can automatically interpret and store the headers for you, if you pass in the option "header" when loading the table. (In addition to "header" there are other options you can specify. For example if your file is called data.txt but is comma separated data you can pass in the option "csv". If it also has a header row, then you can specifiy both options like so: "header,csv"). A full list of options can be found on the loadTable() documentation page.
- +
+ What if your data is not in a standard format like a table, how do you deal with it then? One of the nice features about loadStrings() is that in addition to pulling text from a file, you can also grab a URL. For example:
-Table table = loadTable("data.csv","header");
+String[] lines = loadStrings("http://www.yahoo.com");
+ When you send a URL path into loadStrings(), you get back the raw HTML (Hypertext Markup Language) source of the requested web page. It’s the same stuff that appears upon selecting “View Source” from a browser’s menu options. You don’t need to be an HTML expert to follow this section, but if you are not familiar at all with HTML, you might want to read http://en.wikipedia.org/wiki/HTML.
+
+
+
+ Unlike with the comma-delimited data from a text file that was specially formatted for use in a Processing sketch, it’s not practical to have the resulting raw HTML stored in an array of strings (each element representing one line from the source). Converting the array into one long string can make things a bit simpler. As you saw earlier in the chapter, this can be achieved using join().
+
+String onelongstring = join(lines, " "); ++ When pulling raw HTML from a web page, it’s likely you do not want all of the source, but just a small piece of it. Perhaps you’re looking for weather information, a stock quote, or a news headline. You can take advantage of the text manipulation functions you learned — indexOf(), substring(), and length() — to find pieces of data within a large block of text. Take, for example, the following String object:
+
+String stuff = "Number of apples:62. Boy, do I like apples or what!"; ++Let’s say I want to pull out the number of apples from the above text. My algorithm would be as follows: + +
-
+
-
+
Find the end of the substring “apples:” Call it start.
+
+ -
+
Find the first period after “apples:” Call it end.
+
+ -
+
Make a substring of the characters between start and end.
+
+ -
+
Convert the string to a number (if I want to use it as such).
+
+
+ In code, this looks like:
+
+int start = stuff.indexOf("apples:" ) + 7; // STEP 1
+// The index where a string ends can be found by
+// searching for that string and adding its length (here, 8).
+int end = stuff.indexOf(".", start); // STEP 2
+String apples = stuff.substring(start, end); // STEP 3
+int apple_no = int(apples); // STEP 4
+
+ The above code will do the trick, but I should be a bit more careful to make sure I don’t run into any errors if I do not find the string I am searching for. I can add some error checking and generalize the code into a function:+
+// A function that returns a substring between two substrings.
+// If the beginning of end "tag" is not found, the function returns an empty string.
+String giveMeTextBetween(String s, String startTag, String endTag) {
+ // Find the index of the beginning tag
+ int startIndex = s.indexOf(startTag);
+ // If I don't find anything
+ if (startIndex == -1) {
+ return "";
+ }
+ // Move to the end of the beginning tag
+ startIndex += startTag.length();
-Now that the table is loaded, we can look at how we grab individual pieces of data or iterate over the entire table. Let's look at the data visualized as a grid.
-
-
-
-In the above grid we can see that the data is organized in terms of rows and columns. One way to access the data would be to therefore request a value by its numeric row and column location (with zero being the first row or first column). This is similar to accessing a pixel color at a given (x, y) location though in this case the y position (i.e. row) comes first. The following code requests a piece of data at a given (row, column) location.
-
+ // Find the index of the end tag
+ int endIndex = s.indexOf(endTag, startIndex);
+
+ // If I don't find the end tag,
+ if (endIndex == -1) {
+ return "";
+ }
+ // Return the text in between
+ return s.substring(startIndex, endIndex);
+}
+
+ With this technique, you are ready to connect to a website from within Processing and grab data to use in your sketches. For example, you could read the HTML source from nytimes.com and look for today’s headlines, search finance.yahoo.com for stock quotes, count how many times the word “flower” appears on your favorite blog, and so on. However, HTML is an ugly, scary place with inconsistently formatted pages that are difficult to reverse engineer and parse effectively. Not to mention the fact that companies change the source code of web pages rather often, so any example that I might make while I am writing this paragraph might break by the time you read this paragraph.
+
+
+ + For grabbing data from the web, an XML (Extensible Markup Language) or JSON (JavaScript Object Notation) feed will prove to be more reliable and easier to parse. Unlike HTML (which is designed to make content viewable by a human’s eyes) XML and JSON are designed to make content viewable by a computer and facilitate the sharing of data across different systems. Most data (news, weather, and more) is available this way, and I will look at examples in #beginner_xml and #JSON. Though much less desirable, manual HTML parsing is still useful for a couple reasons. First, it never hurts to practice text manipulation techniques that reinforce key programming concepts. But more importantly, sometimes there is data you really want that is not available in an API format, and the only way to get it is with such a technique. (I should also mention that regular expressions, an incredibly powerful techinque in text pattern matching, could also be employed here. As much as I love regex, it’s unfortunately beyond the scope of this tutorial.) +
+ ++ An example of data only available as HTML is the Internet Movie Database. IMDb contains information about movies sorted by year, genre, ratings, etc. For each movie, you can find the cast and crew list, a plot summary, running time, a movie poster image, the list goes on. However, IMDb has no API and does not provide its data as XML or JSON. Pulling the data into Processing therefore requires a bit of detective work. Let's look at the page for the Shaun the Sheep Movie +
+ +
+
+ + Looking in the HTML source from the above URL, I find a giant mess of markup. +
+ +
+
+
+ It’s up to me to pore through the raw source and find the data I am looking for. Let's say I want to know the running time of the movie and grab the movie poster image. After some digging, I find that the movie is 139 minutes long as listed in the following HTML.
-int val1 = table.getInt(2, 1); // val now has the value 235 -float val2 = table.getFloat(3, 2); // val2 now has the value 44.758068 -String s = table.getString(0, 3); // s now has the value "Happy" +<div class="txt-block"> + <h4 class="inline">Runtime:</h4> + <time itemprop="duration" datetime="PT139M">139 min</time> +</div>+ For any given movie, the running time itself will be variable, but the HTML structure of the page will stay the same. I can therefore deduce that running time will always appear in between:
+
+<time itemprop="duration" datetime="PT139M"> ++ and:
+
+</time> ++ Knowing where the data starts and ends, I can use giveMeTextBetween() to pull out the running time. A quote in Java marks the beginning or end of a string. So how do you include an actual quote in a String object? The answer is via an “escape” sequence. A quote can be included using a backward slash, followed by a quote. For example: String q = "This String has a quote \"in it";
+
+String url = "http://www.imdb.com/title/tt0058331"; +String[] lines = loadStrings(url); +// Get rid of the array in order to search the whole page +String html = join(lines, " "); -+ The following code retrieves both the running time and movie poster iamge from IMDb and displays it onscreen. + + + Parsing IMDb Manually +While the numeric index is sometimes useful, it's generally going to be more convenient to access each piece of data by the column name. For example, we could pull out a specific row from the Table.
+// Searching for running time +String start = ""; +String runningtime = giveMeTextBetween(html, start, end); +println(runningtime);
+
++String runningtime; +PImage poster; -Note in the above line of code that a Table object refers to the entire table of data while a TableRow object handles an individual row of data within the Table. +void setup() { + size(300, 350); + loadData(); +} -Once we have the TableRow object, we can ask for data from some or all of the columns. +void draw() { + // Display all the stuff I want to display + background(255); + image(poster, 10, 10, 164, 250); + fill(0); + text("Shaun the Sheep", 10, 300); + text(runningtime, 10, 320); +} --int x = row.getInt("x"); // x has the value 273 -int y = row.getInt("y"); // y has the value 235 -float d = row.getFloat("diameter"); // d has the value 61.14072 -String s = row.getString("name"); // s has the value "Joyous" -+void loadData() { + String url = "http://www.imdb.com/title/tt2872750/"; + + // Get the raw HTML source into an array of strings (each line is one element in the array). + // The next step is to turn array into one long string with join(). + String[] lines = loadStrings(url); + String html = join(lines, ""); + + String start = ""; + runningtime = giveMeTextBetween(html, start, end);Searching for running time. + + start = ""; + // Search for the URL of the poster image. + String imgUrl = giveMeTextBetween(html, start, end); + // Now, load that image! + poster = loadImage(imgUrl); +} -The method getRow() returns a single row from the table. If you want to grab all the rows and iterate over them you can do so with the method rows(). +String giveMeTextBetween(String s, String before, String after) { --for (TableRow row : table.rows()) { - float x = row.getFloat("x"); - float y = row.getFloat("y"); - float d = row.getFloat("diameter"); - String n = row.getString("name"); - // Do something with the data of each row + // This function returns a substring between two substrings (before and after). + // If it can’t find anything it returns an empty string. + String found = ""; + + // Find the index of before + int start = s.indexOf(before); + if (start == -1) { + return ""; + } + + // Move to the end of the beginning tag + // and find the index of the "after" String + start += before.length(); + int end = s.indexOf(after, start); + if (end == -1) { + return ""; + } + + // Return the text in between + return s.substring(start, end); }-If you want to search for a select number of rows within the table, you can do so with findRows() and matchRows(). - -In addition to being read, Table objects can be altered or created on the fly while a sketch is running. Cell values can be adjusted, rows can be removed, and new rows can be added. For example, to set new values in a cell there are functions setInt(), setFloat(), and setString(). - +
Text Analysis
+ ++ Loading text from a URL need not only be an exercise in parsing out small bits of information. It’s possible with Processing to analyze large amounts of text found on the web from news feeds, articles, and speeches, to entire books. A nice source is Project Gutenberg which makes available thousands of public domain texts. Algorithms for analyzing text merits an entire book itself, but let’s look at some basic techniques. +
+ ++ A text concordance is an alphabetical list of words that appear in a book or body of text along with contextual information. A sophisticated concordance might keep a list of where each word appears (like an index) as well as which words appear next to which other words. In this case, I'm going to create a simple concordance, one that simply stores a list of words and their corresponding counts, i.e., how many times they appeared in the text. Concordances can be used for text analysis applications such as spam filtering or sentiment analysis. To accomplish this task, I am going to use the Processing built-in class IntDict. +
+ ++ As you learned earlier, an array is an ordered list of variables. Each element of the array is numbered and be accessed by its numeric index. +
++ However, what if instead of numbering the elements of an array you could name them? This element is named “Sue,” this one “Bob,” this one “Jane,” and so on and so forth. In programming, this kind of data structure is often referred to as an associative array, map, or dictionary. It’s a collection of (key, value) pairs. Imagine you had a dictionary of people's ages. When you look up “Sue” (the key), the definition, or value, is her age, 24. +
++ Associative arrays can be incredibly convenient for various applications. For example, you could keep a list of student IDs (student name, id) or a list of prices (product name, price) in a dictionary. Here a dictionary is the perfect data structure to hold the concordance. Each element of the dictionary is a word paired with its count. +
+ ++ While there are many classes in Java for dealing with advanced data structures like maps, Processing provides you with a set of three built-in dictionary classes that are easy to use: IntDict, FloatDict, and StringDict. In all of these classes, the key is always a string while the value is variable (an integer, floating point number, or String). For the concordance, I'll use an IntDict. +
+ ++ Creating an IntDict is as easy as calling an empty constructor. Let's say you want a dictionary to keep track of an inventory of supplies.
-// Update the value of column "x" to mouseX in a given TableRow. -row.setInt("x",mouseX); +IntDict inventory = new IntDict();- -To add a new row to a Table, simply call the method addRow() and set the values of each column.
- + Values can be paired with their keys using the set() method.
-// Create a new row -TableRow row = table.addRow(); -// Set the values of that row -row.setFloat("x", mouseX); -row.setFloat("y", mouseY); -row.setFloat("diameter", random(40, 80)); -row.setString("name", "new label"); +// set() assigns an integer to a String. +inventory.set("pencils", 10); +inventory.set("paper clips", 128); +inventory.set("pens, 16"); ++ There are a variety of other methods that can be called to change the value associated with a particular key. For example, if you wanted to add five pencils, you can use add().
++inventory.add("pencils", 5); // The value of “pencils” is now 15.-To delete a row to a Table, simply call the method removeRow() and pass in the numeric index of the row you would like removed. The following code for example, removes the first row whenever the size of the table is greater than ten rows.
- + A particularly convenient method for the concordance example is increment() which adds one to a key's value.
-// If the table has more than 10 rows -if (table.getRowCount() > 10) { - // Delete the first row - table.removeRow(0); -} +inventory.increment("pens"); // The value of “pencils” is now 16.+ To retrieve a value associated with a particular key, the get() method is used.
++int num = inventory.get("pencils"); // The value of num is 16. ++ Finally, dictionaries can be sorted by their keys (alphabetical) or values (smallest to largest or the reverse) with the methods sortKeys(), sortKeysReverse(), sortValues(), and sortValuesReverse(). + + ++ The concordance now becomes a rather simple program to write. All I need to do is load in a text file, chop it into words with splitTokens() and call increment() on an IntDict for every single word found in the text. The following example does precisely this with the entire text of Shakespeare’s play, A Midsummer Night's Dream, displaying a simple graph of the most used words. +
+ +Text Concordance Using IntDict +
++String[] allwords; -+For an example that creates objects from and saves objects to a Table, take a look at LoadSaveTable under Topics --> Advanced Data.
+// Any punctuation is used as a delimiter. +String delimiters = " ,.?!;:[]"; -XML Data
+IntDict concordance; -For grabbing data from the web, an XML (Extensible Markup Language) feed is an excellent option (if available). Unlike HTML (which is designed to make content vieweable by a human's eyes) XML is designed to make content viewable by a computer and facilitate the sharing of data across different systems.
+void setup() { + size(360, 640); + + // Load A Midsummer Night's Dream into an array of strings + String url = "http://www.gutenberg.org/cache/epub/1514/pg1514.txt"; + String[] rawtext = loadStrings(url); + + // Join the big array together as one long string + String everything = join(rawtext, "" ); -XML organizes information in a tree structure. Let's imagine a list of students. Each student has an id number, name, address, e-mail, and telephone number. Each student's address has a city, state, and zip code. An XML tree for this dataset might look like the following:
+ // All the lines in A Midsummer Night's Dream are first joined as one big string + // and then split up into an array of individual words. + // Note the use of splitTokens() since I am using spaces and punctuation marks as delimiters. + allwords = splitTokens(everything, delimiters); -+ // Make a new empty dictionary + concordance = new IntDict(); + + for (int i = 0; i<allwords.length; i++) { + // It's useful to convert each word to lower case so that, + // for example, “The” and “the” are both counted as the same word. + String s = allwords[i].toLowerCase(); + // For every single word, increase its count in the dictionary. + concordance.increment(s); + } + + // Sort the dictionary so that words that appear most often are first. + concordance.sortValuesReverse(); +} + +void draw() { + background(255); + + // Display the text and total times the word appears + int h = 20; + // In order to iterate over every word in the dictionary, + // first ask for an array of all of the keys. + String[] keys = concordance.keyArray(); + + for (int i = 0; i<height/h; i++) { + // Look at each key one at a time and retrieve its count. + String word = keys[i]; + int count = concordance.get(word); + + fill(51); + // Displaying a rectangle along with the count as a simple graph. + rect(0, i*20, count/4, h-4); + fill(0); + text(word + ": " + count, 10+count/4, i*h+h/2); + stroke(0); + } +} +
+ Processing also includes three classes for lists of numbers and strings: IntList, FloatList, and StringList. In other words, if you just want a list of words (without their counts) you could use a StringList rather than an IntDict. +
+ ++ If your data is available via a standardized format such as XML or JSON, the process of manually searching through text for individual pieces of data is no longer required. XML is designed to facilitate the sharing of data across different systems, and you can retrieve that data using the built-in Processing XML class. +
+ ++ XML organizes information in a tree structure. Let’s imagine a list of students. Each student has an ID number, name, address, email, and telephone number. Each student’s address has a city, state, and zip code. An XML tree for this dataset might look like the following: +
++ The XMl source itself (with two students listed) is:
-<?xml version="1.0" encoding="UTF-8"?> +<?xml version = "1.0" encoding = "UTF-8 "?> <students> <student> <id>001</id> @@ -313,94 +803,177 @@- -XML Data
<address> <street>45.3 Nebula 5</street> <city>Boolean City</city> - <state&tt;Booles</state> + <state>Booles</state> <zip>12358</zip> </address> </student> </students>Note the similarities to object-oriented programming. We could think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an id, a name, a phone number, an e-mail address, and a mailing address. The mailing address is also an object that also has multiple pieces of data, such as street, city, state, and zip.
- -Let's look at Yahoo's XML feed for weather data. Here is the raw XML source (Note I have edited it for simplification purposes).
- + Note the similarities to object-oriented programming. You can think of the XML tree in the following terms. The XML document represents an array of student objects. Each student object has multiple pieces of information, an ID, a name, a phone number, an email address, and a mailing address. The mailing address is also an object that has multiple pieces of data, such as street, city, state, and zip. + + ++ Let's look at some data made available from a web service such as Yahoo Weather. Here is the raw XML source. (Note I have edited it slightly for simplification purposes.)
<?xml version="1.0" encoding="UTF-8" standalone="yes" ?> <rss version="2.0" xmlns:yweather="http://xml.weather.yahoo.com/ns/rss/1.0"> <channel> <item> - <title>Conditions for New York, NY at 3:51 pm EST</title> + <title>Conditions for New York, NY at 12:49 pm EDT</title> <geo:lat>40.67</geo:lat> <geo:long>-73.94</geo:long> - <link>http://xml.weather.yahoo.com/forecast/USNY0996_f.html</link> - <pubDate>Mon, 20 Feb 2006 3:51 pm EST</pubDate> - <yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/> - <yweather:forecast day="Mon" date="20 Feb 2006" low="25" high="37" text="Clear" code="31"/> + <link>http://us.rd.yahoo.com/dailynews/rss/weather/New_York__NY//link> + <pubDate>Thu, 24 Jul 2014 12:49 pm EDT</pubDate> + <yweather:condition text="Partly Cloudy" code="30" temp="76"/> + <yweather:forecast day="Thu" low="65" high="82" text="Partly Cloudy"/> </item> </channel> </rss>- -And here is the data mapped in the tree structure.
- -- -
You may be wondering what the top level "RSS" is all about. Yahoo's XML weather data is provided in RSS format. RSS stands for "Really Simple Syndication" and is a standardized XML format for syndicating web content (such as news articles, etc.)
- -Now that we have a handle on the tree structure, we should look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, i.e. <channel> and an end tag, i.e. </channel>. Some of these elements have content between the tags:
- + The data is mapped in the tree stucture shown below: + ++ You may be wondering what the top level “RSS” is all about. Yahoo’s XML weather data is provided in RSS format. RSS stands for “Really Simple Syndication” and is a standardized XML format for syndicating web content (such as news articles, etc.). You can read more about RSS on Wikipedia. +
+ +Now that you have a handle on the tree structure, let's look at the specifics inside that structure. With the exception of the first line (which simply indicates that this page is XML formatted), this XML document contains a nested list of elements, each with a start tag, that is, <channel>, and an end tag, that is, </channel>. Some of these elements have content between the tags:
-<title>Conditions for New York, NY at 3:51 pm EST</title> +<title>Conditions for New York, NY at 12:49 pm EDT</title>- -and some have attributes (formatted by attribute name equals attribute value in quotes):
- +and some have attributes (formatted by Attribute Name equals Attribute Value in quotes):
-<yweather:condition text="Fair" code="34" temp="35" date="Mon, 20 Feb 2006 3:51 pm EST"/> +<yweather:forecast day="Thu" low="65" high="82" text="Partly Cloudy"/>+ -Knowing this format, we could certainly be clever with our use of split(), indexOf(), and substring() to find the pieces we want in the raw XML. The point here, however, is that because XML is a standard format, we don't have to do this. Rather, we can use an XML parser. In Processing, the XML parser is called just that: XML.
+Using the Processing XML Class
++ Since the syntax of XML is standardized, I could certainly use split(), indexof(), and substring() to find the pieces I want in the XML source. The point here, however, is that because XML is a standard format, I don't have to do this. Rather, I can use an XML parser. In Processing, XML can be parsed using the built-in Processing class XML.
XML xml = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003");+ Here, instead of loadStrings() or loadTable(), I'm now calling loadXML() and passing in the address (URL or local file) of the XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram from Yahoo Weather, I find the current temperature via the following path: + + ++
+ +- +
+The root of the tree is RSS.
+- +
+RSS has a child named channel.
+- +
+Channel has a child named item.
+- +
+Item has a child named yweather:condition.
+- +
+The temperature is stored in yweather:condition as the attribute temp.
++ The children of an element are accessed via the getChild() function.
++// Accessing the “channel” child element of the root element --> +XML channel = xml.getChild("channel"); ++ The content of an element itself is retrieved with one of the following methods: getContent(), getIntContent(), or getFloatcContent(). getContent() is for generic use and will always give you the content as a String. If you intend to use the content as a number, Processing will convert it for you with either getIntContent() or getFloatcContent(). Attributes can also be read as either numbers — getInt(), getFloat() — or text — getString(). + -Here, instead of loadStrings() or loadTable(), we're now calling loadXML() and passing in the address (URL or local file) of our XML document. An XML object represents one element of an XML tree. When a document is first loaded, that XML object is always the root element. Referring back to XML tree diagram, we see that we can find the current temperature via the following path:
- --
+- The root of the tree is RSS.
-- RSS has a child named channel.
-- Channel has a child named item.
-- Item has a child named yweather:condition.
-- The temperature is stored in yweather:condition as the attribute temp.
-+ Following steps one through five outlined above through the XML tree, I have:
++XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1 -We could translate the above into code as follows:
+XML channel = root.getChild("channel"); // Step 2 --XML root = loadXML("http://xml.weather.yahoo.com/forecastrss?p=10003"); // Step 1 -XML channel = root.getChild("channel"); // Step 2 -XML item = channel.getChild("item"); // Step 3 -XML yweather = item.getChild("yweather:condition"); // Step 4 -int temperature = yweather.getInt("temp"); // Step 5 -+XML item = channel.getChild("item"); // Step 3 -This is a bit long-winded, however, and so can be compressed down into one (or three as below) lines of code.
+XML yweather = item.getChild("yweather:condition"); // Step 4 --XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003); // Step 1 -XML forecast = root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4 -int temperature = forecast.getInt("temp"); // Step 5 +int temperature = yweather.getInt("temp"); // Step 5+ However, this is a bit long-winded and so can be compressed down into one (or three, as below) lines of code.
++XML root = loadXML(http://xml.weather.yahoo.com/forecastrss?p=10003); -Finally, the second line of code above can be further condensed to: - +XML forecast = + root.getChild("channel").getChild("item").getChild("yweather:condition"); // Steps 2-4 +int temperature = forecast.getInt("temp"); ++ Finally, the second line of code above can be further condensed to:
XML forecast = xml.getChild("channel/item/yweather:condition"); // Steps 2-4+ Following is the above code put together in an example that retrieves weather data for multiple zip codes by parsing Yahoo's XML feed. + ++Parsing Yahoo Weather XML +
+int temperature = 0;Temperature is stored as a number and the description of the weather as a string. +String weather = ""; + + +// The zip code +String zip = "10003"; + +void setup() { + size(200, 200); + + // The URL for the XML document + String url = "http://xml.weather.yahoo.com/forecastrss?p=" + zip; -+ Other useful XML functions are: + + +It should also be noted that we're accessing the child nodes by their name (i.e. "channel", "item", etc.), but they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children. In LoadSaveTable, we used a series of comma separated values in a text file to store information related to Bubble objects. An XML document can also be used in the same manner. Consider the following XML document:
+ // Load the XML document + XML xml = loadXML(url); + // Here, I grab the XML element that I want. + XML forecast = xml.getChild("channel/item/yweather:forecast"); + + // And then I pull the attributes from that XML element. + temperature = forecast.getInt("high"); + weather = forecast.getString("text"); +} + +void draw() { + background(255); + fill(0); + + // Display all the stuff I want to display + text("Zip code: " + zip, 10, 50); + text("Today’s high: " + temperature, 10, 70); + text("Forecast: " + weather, 10, 90); +} +
-
+
-
+
hasChildren() — checks whether or not an element has any children
+
+ -
+
getChildren() — returns an array containing all child elements
+
+ -
+
getAttributeCount() — counts the specified element's number of attributes
+
+ -
+
hasAttribute() — checks whether or not an element has the specified attribute
+
+
+ In this example I'm accessing the child nodes by their name (i.e., "channel," "item,", etc.), however they can also be accessed numerically via an index (starting at zero, same as an array). This is convenient when looping over a list of children, much like I did with tabular data when I iterated over rows in a table. +
+ +
+ Earlier, we used a Table to store information related to Bubble objects. XML document can also be used in the same manner. Here is a possible solution for an XML tree of Bubble objects:
<?xml version="1.0" encoding="UTF-8"?> <bubbles> @@ -426,52 +999,321 @@+ I can use getChildren() to retrieve the array of <bubble> elements and make a Bubble object from each one. Here is the example which uses the identical Bubble class from earlier (not included below). The new code is in bold. + + +XML Data
</bubble> </bubbles>
+Using Processing's XML Class
+
+
+// An Array of Bubble objects
+Bubble[] bubbles;
+// An XML object
+XML xml;
+
+void setup() {
+ size(480, 360);
+ loadData();
+}
-In the above XML, the root element is "bubbles" which has four children. Each child "bubble" has 3 children, "position", "diameter", and "label." The "position" element has two attributes, "x" and "y." To access the list of all XML nodes "bubble" we can use the getChildren() method, passing in the name "bubble"
+void loadData() {
+ // Load XML file
+ xml = loadXML("data.xml");
+ // Get all the child nodes named "bubble"
+ XML[] children = xml.getChildren("bubble");
+ bubbles = new Bubble[children.length];
+ // The size of the Bubble array is determined by the total XML elements named “bubble.”
+
+ for (int i = 0; i < bubbles.length; i++) {
+
+ XML positionElement = children[i].getChild("position");
+ // The position element has two attributes: “x” and “y”.
+ // Attributes can be accessed as an integer or float via getInt() and getFloat().
+ float x = positionElement.getInt("x");
+ float y = positionElement.getInt("y");
+
+ // The diameter is the content of the child named "diameter"
+ XML diameterElement = children[i].getChild("diameter");
+ float diameter = diameterElement.getFloatContent();
+ // Notice, however, with the content of an XML node,
+ // I retrieve via getIntContent() and getFloatContent().
+
+ // The label is the content of the child named "label"
+ XML labelElement = children[i].getChild("label");
+ String label = labelElement.getContent();
+
+ // Make a Bubble object out of the data read
+ bubbles[i] = new Bubble(x, y, diameter, label);
+ }
+}
+
+void draw() {
+ background(255);
+ // Display all bubbles
+ for (int i = 0; i < bubbles.length; i++) {
+ bubbles[i].display();
+ bubbles[i].rollover(mouseX, mouseY);
+ }
+}
+
+ In addition to loadXML(), Processing also includes a saveXML() function for writing XML files to your sketch folder. You can modify the XML tree itself by adding or removing elements with addChild() or removeChild(), as well as modify the content of elements or attributes with setContent(), setIntContent(), setFloatContent(), setString(), setInt(), and setFloat().
+
+
+JSON
+ ++ Another increasingly popular data exchange format is JSON (pronounced like the name Jason), which stands for JavaScript Object Notation. Its design was based on the syntax for objects in the JavaScript programming language (and is most commonly used to pass data between web applications) but has become rather ubiquitous and language-agnostic. While you don't need to know anything about JavaScript to work in Processing, it won't hurt to get a sense of some basic JavaScript syntax while learning it. +
+ ++ JSON is an alternative to XML and the data can be looked at in a similarly tree-like manner. All JSON data comes in the following two ways: an object or an array. Luckily, you already know about these two concepts and only need to learn a new syntax for encoding them. +
+ +
+ Let's take a look at a JSON object first. A JSON object is like a Processing object only with no functions. It’s simply a collection of variables with a name and a value (or "name/value pair"). For example, following is JSON data describing a person:
+
+{
+ "name":"Olympia",
+ // Each name/value pair is separated by a comma.
+ "age":3,
+ "height":96.5,
+ "state":"giggling"
+}
+Notice how this maps closely to classes in Processing.
+
+class Person {
+ String name;
+ int age;
+ float height;
+ String state;
+}
+
+ There are no classes in JSON, only the object literals themselves. Also an object can contain, as part of itself, another object.+
+{
+ "name":"Olympia",
+ "age":3,
+ "height":96.5,
+ "state":"giggling",
+ // The value of “brother” is an object containing two name/value pairs.
+ "brother":{
+ "name":"Elias",
+ "age":6
+ }
+}
+ In XML, the preceding JSON data would look like the following (for simplicity I'm avoiding the use of XML attributes).+
+<xml version="1.0" encoding="UTF-8"?> +<person> + <name>Olympia</name> + <age>3</age> + <height>96.5</height> + <state>giggling</state> + <brother> + <name>Elias</name> + <age>6</age> + </brother> +</person> ++ Multiple JSON objects can appear in the data as an array. Just like the arrays you use in Processing, a JSON array is simply a list of values (primitives or objects). The syntax, however, is different with square brackets indicating the use of an array rather than curly ones. Here is a simple JSON array of integers:
+
+[1, 7, 8, 9, 10, 13, 15] ++ You might find an array as part of an object.
+
+{
+ "name":"Olympia",
+ // The value of “favorite colors” is an array of strings.
+ "favorite colors":[
+ "purple",
+ "blue",
+ "pink"
+ ]
+}
+
+ Or an array of objects themselves. For example, here is what the bubbles would look like in JSON. Notice how this JSON data is organized as a single JSON object "bubbles," which contains a JSON array of JSON objects, the bubbles. Flip back to compare to the CSV and XML versions of the same data.+
+{
+ "bubbles":[
+ {
+ "position":{
+ "x":160,
+ "y":103
+ },
+ "diameter":43.19838,
+ "label":"Happy"
+ },
+ {
+ "position":{
+ "x":372,
+ "y":137
+ },
+ "diameter":52.42526,
+ "label":"Sad"
+ },
+ {
+ "position":{
+ "x":273,
+ "y":235
+ },
+ "diameter":61.14072,
+ "label":"Joyous"
+ }
+ ]
+}
+
+
+JSONObject and JSONArray
+ ++ Now that I've covered the syntax of JSON, I can look at using the data in Processing. One thing that can be a bit tricky about working with JSON in Processing is that I have to treat objects and arrays differently. With XML, I simply had a single XML class with all the parsing functionality I needed. With JSON, I have two classes: JSONObject and JSONArray, and I'll have to be conscientious about picking which class I am using during the parsing process. +
+ ++ The first step is simply loading the data with either loadJSONObject() or loadJSONArray(). But which one? I have to look and see what is at the root of the JSON file, an object or array. This can be a little tricky. Let's look at these two JSON examples: +
+ +
+ Sample 1:
+
+[
+ {
+ "name":"Elias"
+ },
+ {
+ "name":"Olympia"
+ }
+]
+
+ Sample 2:
-// Load an XML document
-XML xml = loadXML("bubbles.xml");
+{
+ "names":[
+ {
+ "name":"Elias"
+ },
+ {
+ "name":"Olympia"
+ }
+ ]
+}
+
+ Look how similar the above two samples look. They both contain exactly the same data, two names "Elias" and "Olympia." There is one, very key difference, however, to how the data is formatted: the very first character. Is it a "[" or a "{"? The answer will determine whether you’re loading an array ("[") or an object("{"). JSON objects start with a curly bracket, while JSON arrays start with a square bracket.+
+JSONObject json = loadJSONObject("file.json");
-// Get all the child elements
-XML[] children = xml.getChildren("bubble");
+JSONArray json = JSONArray("file.json");
+ Typically, even if the data is ultimately organized as an array of objects (such as the array of "bubble" objects), the root element of the JSON data will be an object that contains that array. Let's look at the bubble data one more time.+
+{
+ "bubbles":[
+ {
+ "position":{
+ "x":160,
+ "y":103
+ },
+ "diameter":43.19838,
+ "label":"Happy"
+ },
+ {
+ "position":{
+ "x":372,
+ "y":137
+ },
+ "diameter":52.42526,
+ "label":"Sad"
+ }
+ ]
+}
+
+ With the above, I first load an object and then pull the array out of that object.+
+JSONObject json = loadJSONObject("data.json");
+JSONArray bubbleData = json.getJSONArray("bubbles");
+
+ Just as with XML, the data from an element is accessed via its name, in this case "bubbles." With a JSONArray, however, each element of the array is retrieved via its numeric index. The following code iterates over a JSONArray.+
+for (int i = 0; i < bubbleData.size(); i++) {
+ JSONObject bubble = bubbleData.getJSONObject(i);
+ }
+
+ And when you're looking for a specific piece of data from a JSONObject, such as an integer or string, the functions are identical to those of XML attributes. The following code gets the position object from the bubble object, then gets x and y as integers from the position object. The diameter and label are then available directly from the Bubble object.+
+ JSONObject position = bubble.getJSONObject("position");
-Once we have the array of XML objects, we can iterate over them, accessing the individual pieces of data for each "bubble". Notice how the syntax for getting XML attributes (in this case, "x" and "y" of the position element is slightly different than pulling content directly from an element (in this case, "diameter" and "label").
-
-for (int i = 0; i < bubbles.length; i++) {
-
- // The position element has two attributes: x and y
- XML positionElement = children[i].getChild("position");
- // Note how with attributes we can get an integer or float via getInt() and getFloat()
- float x = positionElement.getInt("x");
- float y = positionElement.getInt("y");
-
- // The diameter is the content of the child named "diamater"
- XML diameterElement = children[i].getChild("diameter");
- // Note how with the content of an XML node, we retrieve via getIntContent() and getFloatContent()
- float diameter = diameterElement.getFloatContent();
+ int x = position.getInt("x");
+ int y = position.getInt("y");
- // The label is the content of the child named "label"
- XML labelElement = children[i].getChild("label");
- String label = labelElement.getContent();
-}
+ float diameter = bubble.getFloat("diameter");
+ String label = bubble.getString("label");
+ Putting this all together, I can now make a JSON version of the bubbles example (leaving out the draw() function and Bubble class which haven't changed.)
+
+
+
+Using Processing's JSON Classes
+
+
+// An Array of Bubble objects
+Bubble[] bubbles;
-XML elements can be added and removed from the XML tree with the addChild() and removeChild() methods.
+void setup() {
+ size(480, 360);
+ loadData();
+}
-For the full example that creates objects from and saves objects to an XML document, take a look at LoadSaveXML under Topics --> Advanced Data.
+void loadData() {
+ // Load the JSON file and grab the array.
+ JSONObject json = loadJSONObject("data.json");
+ JSONArray bubbleData = json.getJSONArray("bubbles");
-Threads
+ // The size of the array of Bubble objects is determined by the length of the JSON array.
+ bubbles = new Bubble[bubbleData.size()];
+
+
+ for (int i = 0; i<bubbleData.size(); i++) {
+
+ // Iterate through the array, grabbing each JSON object one at a time.
+ JSONObject bubble = bubbleData.getJSONObject(i);
-You are likely familiar with the idea of writing a program that follows a specific sequence of steps -- setup() first then draw() over and over and over again! A Thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the "Animation" thread. Other threads sequences, however, can run independently of the main Processing sketch. In fact, you can launch any number of threads at one time and they will all run concurrently.
+ // Get a position object
+ JSONObject position = bubble.getJSONObject("position");
+ // Get (x,y) from JSON object "position"
+ int x = position.getInt("x");
+ int y = position.getInt("y");
+
+ // Get diamter and label
+ float diameter = bubble.getFloat("diameter");
+ String label = bubble.getString("label");
-Processing does this all the time, whenever you write an event callback, such as serialEvent(), or captureEvent(), etc. these functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful whenever you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network (XML, database, etc.) If a separate thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread. To create independent, asynchronous threads, you can use the thread() function built into Processing.
+ // Put the Bubble objects into an array.
+ bubbles[i] = new Bubble(x, y, diameter, label);
+ }
+}
+
+
+Threads
+
+ As you have seen, the various loading functions — loadStrings(), loadTable(), loadXML(), and loadJSONObject() — can be used for retrieving data from URLs. Nonetheless, unless your sketch only needs to load the data once during setup(), you may have a problem. For example, consider a sketch that grabs the price of AAPL stock from an XML feed every five minutes. Each time loadXML() is called, the sketch will pause while waiting to receive the data. Any animation will stutter. This is because these loading functions are “blocking.” In other words, the sketch will sit and wait at that line of code until loadXML() completes its task. With a local data file, this is extremely fast. Nonetheless, a request for a URL (known as an “HTTP request”) in Processing is synchronous, meaning your sketch waits for a response from the server before continuing. Who knows how will that take? No one; you are at the mercy of the server!
+
+
+
+ The answer to this problem lies in the concept of threads. By now you are quite familiar with the idea of writing a program that follows a specific sequence of steps — setup() first then draw() over and over and over again! A thread is also a series of steps with a beginning, a middle, and an end. A Processing sketch is a single thread, often referred to as the animation thread. Other threads’ sequences, however, can run independently of the main animation loop. In fact, you can launch any number of threads at one time, and they will all run concurrently.
+
+
+
+
+ Processing does this quite often, such as with library functions like captureEvent() and movieEvent(). These functions are triggered by a different thread running behind the scenes, and they alert Processing whenever they have something to report. This is useful when you need to perform a task that takes too long and would slow down the main animation's frame rate, such as grabbing data from the network. Here, you want to handle the request asynchronously in a different thread. If that thread gets stuck or has an error, the entire program won't grind to a halt, since the error only stops that individual thread and not the main animation loop.
+
+
+
+ Writing your own thread can be a complex endeavor that involves extending the Java Thread class. However, the thread() method is a quick and dirty way to implement a simple thread in Processing. By passing in a string that matches the name of a function declared elsewhere in the sketch, Processing will execute that function in a separate thread. Let's take a look at a skeleton of how this works.
void setup() {
- size(200,200);
thread("someFunction");
}
@@ -484,44 +1326,201 @@ Threads
// thread("someFunction") as it was in setup!
}
+ The thread() function receives a string as an argument. The string should match the name of the function you want to run as a thread. In the above example it’s "someFunction".
+
+
+
+ Let's look at a more practical example. For an example of data that changes often, I'll use time.jsontest.com which gives you the current time (in milliseconds). While I could retrieve this from the system clock, this works well for demonstrating continuously requesting data that changes over time. Not knowing about threads, my first instinct might be to say:
+
+void draw() {
+ // The code will stop here and wait to receive the data before moving on.
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ String time = json.getString("time");
+ text(time, 40, 100);
+}
+
+ This would give me the current time every cycle through draw(). If I examine the frame rate, however, I'll notice that the sketch is running incredibly slowly (and all it needs to do is draw a single string!). This is where calling the parsing code as a separate thread will help a lot.
+
+String time = "";
-The thread() function receives a String as an argument. The String should match the name of the function you want to run as a thread. This is especially useful in sketches that grab data for the web. Rather than have the animation freeze while the sketch is waiting to retrieve data, the sketch can continue to loop through draw() updating the data when the thread is completed. In these cases, a boolean variable can be useful to track the status of the thread.
+void draw() {
+ // Now the code will move on to the next line while requestData() executes in a separate thread.
+ thread("requestData");
+ text(time, 40, 100);
+}
-
-boolean loading = false;
+void requestData() {
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ time = json.getString("time");
+}
+ The logic is identical, only I am not requesting the data directly in draw(), but executing that request as a separate thread. Notice that I am not doing any drawing in requestData(). This is key as executing drawing functions in code that runs on a separate thread can cause conflicts with the main animation thread (i.e., draw()) resulting in strange behavior and errors.
+
-The function that loads the data can then set loading equal to true at the start and false at the end.
+
+ In the above example, I likely don't want to request the data sixty times per second (the default frame rate). Instead I might make use of the Timer class, and ask for the data once per second. Here is a full example that does exactly that with added animation to show that draw() never stutters.
+
+Threads
+
+
+
-void loadData() {
- loading = true;
+Timer timer = new Timer(1000);
+String time = "";
- ///////////////////////////////////
- // All of the data retrival code //
- ///////////////////////////////////
+void setup() {
+ size(200, 200);
+ // Start by requesting the data asynchronously in a thread.
+ thread("retrieveData");
+ timer.start();
+}
+
+void draw() {
+ background(255);
+ // Every one second, make a new request.
+ if (timer.isFinished()) {
+ retrieveData();
- loading = false;
+ // And restart the timer.
+ timer.start();
+ }
+
+ fill(0);
+ text(time, 40, 100);
+
+ translate(20, 100);
+ stroke(0);
+ //Draw a little animation to demonstrate that the draw() loop never pauses.
+ rotate(frameCount*0.04);
+ for (int i = 0; i<10; i++) {
+ rotate(radians(36));
+ line(5, 0, 10, 0);
+ }
+}
+
+// get the data
+void retrieveData() {
+ JSONObject json = loadJSONObject("http://time.jsontest.com/");
+ time = json.getString("time");
+}
+
+
+class Timer {
+
+ int savedTime;
+ boolean running = false;
+ int totalTime;
+
+ Timer(int tempTotalTime) {
+ totalTime = tempTotalTime;
+ }
+
+ void start() {
+ running = true;
+ savedTime = millis();
+ }
+
+ boolean isFinished() {
+ int passedTime = millis() - savedTime;
+ if (running && passedTime > totalTime) {
+ running = false;
+ return true;
+ } else {
+ return false;
+ }
+ }
+
}
-In draw(), you can choose to display something to indicate the thread is running (when loading equals true).
+APIs
+
+
+ It’s a bit silly for me to call this section “APIs” given that most of this chapter is about data from APIs. Still, it’s worth taking a moment to pause and reflect. What makes something an API versus just some data you found, and what are some pitfalls you might run into when using an API?
+
+
+
+ As I've stated, an API (Application Programming Interface) is an interface through which one application can access the services of another. These can come in many forms. Openweathermap.org, as you saw earlier, is an API that offers its data in JSON, XML, and HTML formats. The key element that makes this service an API is exactly that offer; openweathermap.org's sole purpose in life is to offer you its data. And not just offer it, but allow you to query it for specific data in a specific format. Let's look at a short list of sample queries.
+
+
+
-
+
- http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139 +
- A request for current weather data for a specific latitude and longitude. +
- http://api.openweathermap.org/data/2.5/forecast/daily?q=London&mode=xml&units=metric&cnt=7&lang=zh_cn +
- A request for a seven day London forecast in XML format with metric units and in Chinese. +
- http://api.openweathermap.org/data/2.5/history/station?id=5091&type=day +
- A request for a historical data for a given weather station. +
+ One thing to note about openweathermap.org is that it does not require that you tell the API any information about yourself. You simply send a request to a URL and get the data back. Other APIs, however, require you to sign up and obtain an access token. The New York Times API is one such example. Before you can make a request from Processing, you'll need to visit The New York Times Developer site and request an API key. Once you have that key, you can store it in your code as a string.
+
+// This is not a real key +String apiKey = "40e2es0b3ca44563f9c62aeded4431dc:12:51913116"; ++ You also need to know what the URL is for the API itself. This information is documented for you on the developer site, but here it is for simplicity:
+
+String url = "http://api.nytimes.com/svc/search/v2/articlesearch.json"; ++ Finally, you have to tell the API what it is you are looking for. This is done with a “query string,” a sequence of name value pairs describing the parameters of the query joined with an ampersand. This functions similarly to how you pass arguments to a function in Processing. If you wanted to search for the term "processing" from a search() function you might say:
+
+search("processing");
+
+ Here, the API acts as the function call, and you send it the arguments via the query string. Here is a simple example asking for a list of the oldest articles that contain the term "processing" (the oldest of which turns out to be May 12th, 1852).+
+// The name/value pairs that configure the API query are: (q,processing) and (sort,oldest) +String query = "?q=processing&sort=oldest"; ++ This isn't just guesswork. Figuring out how to put together a query string requires reading through the API's documentation. For The New York Times, it’s all outlined on the Times' developer website. Once you have your query you can join all the pieces together and pass it to loadJSONObject(). Here is a tiny example that simply displays the most recent headline. + +
+NYTimes API Query
+
-void draw() {
- if (loading) {
- // Draw something to indicate loading
- }
+void setup() {
+ size(200, 200);
+
+ String apiKey = "40e2ea0b3ca44563f9c62aeded0431dc:18:51513116";
+ String url = "http://api.nytimes.com/svc/search/v2/articlesearch.json";
+ String query = "?q=processing&sort=newest";
+
+ // Make the API query
+ // Here, I format the call to the API by joing the URL with the API key with the query string.
+ JSONObject json = loadJSONObject(url+query+"&api-key="+apiKey);
+
+ String headline = json.getJSONObject("response").getJSONArray("docs").
+ // Grabbing a single headline from the results.
+ getJSONObject(0).getJSONObject("headline").getString("main");
+ background(255);
+ fill(0);
+ text(headline, 10, 10, 180, 190);
}
+ Some APIs require a deeper level of authentication beyond an API access key. Twitter, for example, uses an authentication protocol known as “OAuth” to provide access to its data. Writing an OAuth application requires more than just passing a String into a request and is beyond the scope of this tutorial. However, in these cases, if you’re lucky, you can find a Processing library that handles all of the authentication for you. There are several APIs that can be used directly with Processing via a library, and you can find a list of them in the “Data / Protocols” section of the libraires reference page for some ideas. Temboo, for example, offers a Processing library that handles OAuth for you and provides direct access to many APIs (including Twitter) in Processing. With Temboo, you can write code that looks like:
+
+
+// Temboo acts as a go-between you and Twitter, so first you just authenticate with Temboo.
+TembooSession session = new TembooSession("ACCOUNT_NAME", "APP_NAME", "APP_KEY");
-Two examples that follow this methodology can be found under Topics --> Advanced Data in the Processing examples.
+Tweets tweets = new Tweets(session);
+// Then you can configure a query to send to Twitter itself and grab the results.
+tweets.setCredential("your-twitter-name");
+tweetsChoreo.setQuery("arugula");
+TweetsResultSet tweetsResults = tweets.run();
-While using the thread() function is a very simple way of getting an independent thread, it should be noted that it is somewhat limited. Being able to make a thread object is a great deal more powerful, and this can be done by extending the Java Thread class.
+JSONObject searchResults = parseJSONObject(tweetsResults.getResponse());
+JSONArray statuses = searchResults.getJSONArray("statuses");
+
+// Finally, you can search through the results and grab a tweet.
+JSONObject tweet = statuses.getJSONObject(0);
+String tweetText = tweet.getString("text");
+
With any luck, the main Processing window will now be visible. Everyone's setup is different, so if the program didn't start, or you're otherwise stuck, visit the troubleshooting page for possible solutions.
+With any luck, the main Processing window will now be visible. Everyone's setup is different, so if the program didn't start, or you're otherwise stuck, visit the troubleshooting page for possible solutions.
diff --git a/content/static/tutorials/imgs/video.png b/content/static/tutorials/imgs/video.png new file mode 100644 index 000000000..4a408066c Binary files /dev/null and b/content/static/tutorials/imgs/video.png differ diff --git a/content/static/tutorials/index.html b/content/static/tutorials/index.html index 1001c0010..7434e5bbb 100644 --- a/content/static/tutorials/index.html +++ b/content/static/tutorials/index.html @@ -7,8 +7,8 @@
Video Tutorials. Links to vi
- 
-
Hello Processing
+
+
Hello Processing
by Daniel Shiffman et al.
Short video lessons introduce coding exercises that lead to designing an interactive drawing program.
@@ -286,14 +286,37 @@ Text Tutorials. A collection
-
- 
-
Anatomy of a Program
- by J David Eisenberg
- How do you analyze a problem and break it down into steps that the computer can do?
+ 
+
Video
+ by Daniel Shiffman
+ How to display live and recorded video
Level: Advanced
+
+
+
+
+
Anatomy of a Program
+ by J David Eisenberg
+ How do you analyze a problem and break it down into steps that the computer can do?
+ Level: Advanced
+
+
+
+
+
+
+
+
+// Example: Two Car objects
Car myCar1;
Car myCar2; // Two objects!
@@ -384,7 +384,7 @@ Objects are data types too!
If you were programming the Space Invaders game, for example, you might create a Spaceship class, an Enemy class, and a Bullet class, using an object for each entity in your game.
-In addition, although not primitive, classes are data types just like integers and floats. And since classes are made up of data, an object can therefore contain other objects! For example, let's assume you had just finished programming a Fork and Spoon class. Moving on to a PlaceSetting class, you would likely include variables for both a Fork object and a Spoon object inside that class itself. This is perfectly reasonable and quite common in object-oriented programming.
+In addition, although not primitive, classes are data types, just like integers and floats. And since classes are made up of data, an object can therefore contain other objects! For example, let's assume you had just finished programming a Fork and Spoon class. Moving on to a PlaceSetting class, you would likely include variables for both a Fork object and a Spoon object inside that class itself. This is perfectly reasonable and quite common in object-oriented programming.
@@ -413,11 +413,10 @@ Objects are data types too!
-When a primitive value (integer, float, etc.) is passed in a function, a copy is made. With objects, this is not the case, and the result is a bit more intuitive. If changes are made to an object after it is passed into a function, those changes will affect that object used anywhere else throughout the sketch. This is known as pass by reference since instead of a copy, a reference to the actual object itself is passed into the function.
+When a primitive value (integer, float, etc.) is passed in a function, a copy is made. With objects, this is not the case, and the result is a bit more intuitive. If changes are made to an object after it is passed into a function, those changes will affect that object used anywhere else throughout the sketch. This is known as pass by reference since, instead of a copy, a reference to the actual object itself is passed into the function.
-
diff --git a/content/static/tutorials/p3d/index.html b/content/static/tutorials/p3d/index.html
index 8b5667019..22bfd8eb1 100644
--- a/content/static/tutorials/p3d/index.html
+++ b/content/static/tutorials/p3d/index.html
@@ -10,7 +10,7 @@ P3D
Daniel Shiffman
-
-
-
Hello Processing
+
+
Hello Processing
by Daniel Shiffman et al.
Short video lessons introduce coding exercises that lead to designing an interactive drawing program.
Text Tutorials. A collection
-
-
+
-
Anatomy of a Program
- by J David Eisenberg
How do you analyze a problem and break it down into steps that the computer can do?
+
+
Video
+ by Daniel Shiffman
How to display live and recorded video
Level: Advanced
+
+
+
+
Anatomy of a Program
+ by J David Eisenberg
How do you analyze a problem and break it down into steps that the computer can do?
+Level: Advanced
+Objects are data types too!
If you were programming the Space Invaders game, for example, you might create a Spaceship class, an Enemy class, and a Bullet class, using an object for each entity in your game.
-In addition, although not primitive, classes are data types just like integers and floats. And since classes are made up of data, an object can therefore contain other objects! For example, let's assume you had just finished programming a Fork and Spoon class. Moving on to a PlaceSetting class, you would likely include variables for both a Fork object and a Spoon object inside that class itself. This is perfectly reasonable and quite common in object-oriented programming. +In addition, although not primitive, classes are data types, just like integers and floats. And since classes are made up of data, an object can therefore contain other objects! For example, let's assume you had just finished programming a Fork and Spoon class. Moving on to a PlaceSetting class, you would likely include variables for both a Fork object and a Spoon object inside that class itself. This is perfectly reasonable and quite common in object-oriented programming.
@@ -413,11 +413,10 @@Objects are data types too!
-When a primitive value (integer, float, etc.) is passed in a function, a copy is made. With objects, this is not the case, and the result is a bit more intuitive. If changes are made to an object after it is passed into a function, those changes will affect that object used anywhere else throughout the sketch. This is known as pass by reference since instead of a copy, a reference to the actual object itself is passed into the function. +When a primitive value (integer, float, etc.) is passed in a function, a copy is made. With objects, this is not the case, and the result is a bit more intuitive. If changes are made to an object after it is passed into a function, those changes will affect that object used anywhere else throughout the sketch. This is known as pass by reference since, instead of a copy, a reference to the actual object itself is passed into the function.
- There are four render modes: the default renderer, P2D, P3D, and PDF. To use a non-default renderer, you can specify via the size() function. + There are five render modes: the default renderer, P2D, P3D, PDF, and SVG. To use a non-default renderer, you can specify via the size() function.
@@ -28,8 +28,8 @@Daniel Shiffman
- You are drawing in 3D! In three-dimensional space, a third axis (the z-axis) refers to the depth of any given point. How far in front or behind the window does a pixel live? Now, we all know there are no actual pixels floating in the air in front of or behind your screen! What we're talking about here is how to use the theoretical z-axis to create the illusion of three-dimensional space in your Processing window. P3D is required for this. -
- You want your sketch to run faster! P2D and P3D make use of OpenGL-compatible graphics hardware. In other words, some of the work required to draw all the pixels in the window can happen on your computer's graphics card which is often more effecient. Keep in mind that OpenGL is not magic pixie dust that makes any sketch faster (though it's close), you will also need to carefully consider the techniques you are using to do the drawing as well. In particular, using the new "shape recording" functionality available in PShape (see PShape tutorial) can greatly increase speed in P3D mode. -
- You are drawing in 2D but want to use a particular graphic effect not available in default renderer! Some graphics functions are only available in P2D such as textures and lighting (see below). +
- You want your sketch to run faster! P2D and P3D make use of OpenGL-compatible graphics hardware. In other words, some of the work required to draw all the pixels in the window can happen on your computer's graphics card which is often more efficient. Keep in mind that OpenGL is not magic pixie dust that makes any sketch faster (though it's close), you will also need to carefully consider the techniques you are using to do the drawing as well. In particular, using the new "shape recording" functionality available in PShape (see PShape tutorial) can greatly increase speed in P3D mode. +
- You are drawing in 2D but want to use a particular graphic effect not available in default renderer! Some graphics functions are only available in P3D such as textures and lighting (see below).
3D Transformations
- In order to draw something at a point in three dimensions the coordinates are specified in the order you would expect: x, y, z. Cartesian 3D systems are often described as "left-handed" or "right-handed." If you point your index finger in the positive y direction (up) and your thumb in the positive x direction (to the right), the rest of your fingers will point towards the positive z direction. It's left-handed if you use your left hand and do the same. In Processing, the system is left-handed, as follows: + In order to draw something at a point in three dimensions the coordinates are specified in the order you would expect: x, y, z. Cartesian 3D systems are often described as "left-handed" or "right-handed." If you point your index finger in the positive y direction (down) and your thumb in the positive x direction (to the right), the rest of your fingers will point towards the positive z direction. It's left-handed if you use your left hand and do the same. In Processing, the system is left-handed, as follows:
Lighting
-
Note how the call to the lights() function is included in draw(). Just as with matrix transformations, the 3D scene is reset each time through draw() any therefore any lighting must be included in order to remain persistent.
+Note how the call to the lights() function is included in draw(). Just as with matrix transformations, the 3D scene is reset each time through draw() and therefore any lighting must be included in order to remain persistent.
In order to set custom lighting for your scene there are four different kinds of lights.
@@ -394,7 +394,7 @@Perspective
float cameraZ = (height/2.0) / tan(fov/2.0); perspective(fov, float(width)/float(height), cameraZ/2.0, cameraZ*2.0); } else { - ortho(0, width, 0, height); + ortho(-width/2, width/2, -height/2, height/2); } translate(width/2, height/2, 0); rotateX(-PI/6); diff --git a/content/static/tutorials/pixels/index.html b/content/static/tutorials/pixels/index.html index 114693e0d..126d87c9d 100644 --- a/content/static/tutorials/pixels/index.html +++ b/content/static/tutorials/pixels/index.html @@ -202,7 +202,7 @@Pixels, pixels, and more pixels
Take the following simple example. This program sets each pixel in a window to a random grayscale value. The pixels array is just like an other array, the only difference is that we don't have to declare it since it is a Processing built-in variable. - +Example: Setting Pixelssize(200, 200); @@ -256,7 +256,7 @@Pixels, pixels, and more pixels
Let's look at how it is done. - +Example: Setting Pixels according to their 2D locationsize(200, 200); @@ -305,7 +305,7 @@Intro To Image Processing
Access to these fields allows us to loop through all the pixels of an image and display them onscreen. - +Example: Displaying the pixels of an imagePImage img; @@ -361,7 +361,7 @@Our second image filter, making our own "tint"
Just a few paragraphs ago, we were enjoying a relaxing coding session, colorizing images and adding alpha transparency with the friendly tint() method. For basic filtering, this method did the trick. The pixel by pixel method, however, will allow us to develop custom algorithms for mathematically altering the colors of an image. Consider brightness—brighter colors have higher values for their red, green, and blue components. It follows naturally that we can alter the brightness of an image by increasing or decreasing the color components of each pixel. In the next example, we dynamically increase or decrease those values based on the mouse's horizontal location. (Note, the next two examples include only the image processing loop itself, the rest of the code is assumed.) - +Example: Adjusting image brightnessfor (int x = 0; x < img.width; x++) { @@ -394,7 +394,7 @@Our second image filter, making our own "tint"
- +Example: Adjusting image brightness based on pixel location
for (int x = 0; x < img.width; x++) { @@ -438,7 +438,7 @@Writing to another PImage object's pixels
- +Example: Brightness Threshold
PImage source; // Source image @@ -538,7 +538,7 @@Level II: Pixel Group Processing
- +Example: Pixel neighbor differences (edges)
// Since we are looking at left neighbors @@ -600,7 +600,7 @@Level II: Pixel Group Processing
- +Example: Sharpen with Convolution
PImage img; @@ -695,7 +695,7 @@Visualizing the Image
- +Example: "Pointillism"
PImage img; @@ -739,7 +739,7 @@Visualizing the Image
- +Example: 2D image mapped to 3DPImage img; // The source image diff --git a/content/static/tutorials/pshader/imgs/pipeline.png b/content/static/tutorials/pshader/imgs/pipeline.png index 389e0b840..12132bf4e 100644 Binary files a/content/static/tutorials/pshader/imgs/pipeline.png and b/content/static/tutorials/pshader/imgs/pipeline.png differ diff --git a/content/static/tutorials/pshader/index.html b/content/static/tutorials/pshader/index.html index 64be71338..5ac13895c 100644 --- a/content/static/tutorials/pshader/index.html +++ b/content/static/tutorials/pshader/index.html @@ -31,7 +31,7 @@Andres Colubri
Writing shaders requires an understanding of the individual stages involved in the rendering a scene with the GPU, and how we can use GLSL to program them. The sequence of these stages is called the "graphical pipeline" in the technical parlance of computer graphics, and we will now take a look at the main stages in the pipeline from the perspective of a Processing sketch. -Note that the goal of this document is not to provide a programming guide to GLSL, but to describe in detail the new shader API in Processing so that users already familiar with GLSL can write their own custom shaders and then use them in Processing. There are several resources, such as online tutorials and forums, books, and coding sandboxes, that can be recommended for learning GLSL programming. Furthermore, the GLSL experience gained using a different programming interface, platform or toolkit (openFrameworks, Cinder, webGL, iOS, Android, etc.) can be easily translated over to Processing.
+
Note that the goal of this document is not to provide a programming guide to GLSL, but to describe in detail the new shader API in Processing so that users already familiar with GLSL can write their own custom shaders and then use them in Processing. There are several resources, such as online tutorials and forums, books, and web coding sandboxes (for example Shader Toy, GLSL Sandbox, and Vertex Shader Art), that can be recommended for learning GLSL programming. Furthermore, the GLSL experience gained using a different programming interface, platform or toolkit (openFrameworks, Cinder, webGL, iOS, Android, etc.) can be easily translated over to Processing.
Let's start with a simple 3D sketch as the model to understand the relationship between the Processing functions and variables and the underlying pipeline running on the GPU. This sketch draws a quad with lights and some geometric transformations applied to it: @@ -43,14 +43,14 @@
Andres Colubri
void setup() { size(400, 400, P3D); - noStroke(); + noStroke(); } void draw() { background(0); - camera(width/2, height/2, 300, width/2, height/2, 0, 0, 1, 0); - pointLight(200, 200, 200, width/2, height/2, 200); + + pointLight(200, 200, 200, width/2, height/2, -200); translate(width/2, height/2); rotateY(angle); @@ -63,7 +63,7 @@Andres Colubri
fill(200, 50, 50); vertex(+100, -100); vertex(-100, -100); - endShape(); + endShape(); angle += 0.01; } @@ -88,7 +88,7 @@Andres Colubri
-The vertex shader doesn't know how the vertices are connected to each other forming a shape since it receives each vertex independently of the others. Therefore, the immediate output of the vertex stage is just the list of vertices projected onto the screen plane. In Processing we set how the vertices of a shape are connected with each other by passing an argument to beginShape(). This argument, which in the case of this example is QUADS, determines how the next stage in the pipeline, called primitive assembly, builds geometric primitives out of the individual vertices that come out of the vertex shader. +The vertex shader doesn't know how the vertices are connected to each other forming a shape since it receives each vertex independently of the others. Therefore, the immediate output of the vertex stage is just the list of vertices projected onto the screen plane. In Processing we set how the vertices of a shape are connected with each other by passing an argument to beginShape(). This argument, which in the case of this example is QUADS, determines how the next stage in the pipeline, called primitive assembly, builds geometric primitives out of the individual vertices that come out of the vertex shader.
@@ -110,7 +110,7 @@
Andres Colubri
function vertexShader(vertex) { projPos = projection * modelview * vertex.position; - litColor = lightColor * dot(vertex.normal, lightDirection); + litColor = lightColor * dot(vertex.normal, lightDirection); return (projPos, litColor); }@@ -134,11 +134,11 @@Andres Colubri
-The fragment shader can perform additional operations on each fragment, and in fact these could be potentially very complex. It is possible to implement a ray-tracer entirely in the fragment shader, and we will touch on this topic briefly with some more advanced examples. One important limitation of the fragment shader to keep in mind is that it cannot access fragments other than the one is currently processing (same as the vertex shader cannot access a vertex other than the one is currently operating on). +The fragment shader can perform additional operations on each fragment, and in fact these could be potentially very complex. It is possible to implement a ray-tracer entirely in the fragment shader, and we will touch on this topic briefly with some more advanced examples. One important limitation of the fragment shader to keep in mind is that it cannot access fragments other than the one is currently processing (same as the vertex shader cannot access a vertex other than the one is currently operating on). The Book of Shaders by Patricio Gonzalez Vivo and Jen Lowe gives an excellent illustrated introduction to GLSL shaders, and it is a terrific resource for programming of fragment shaders in general.
-From all the stages described in our simplified pipeline, only the vertex and fragment shaders can be modified to run our own custom code. The other stages are all hard-coded in the GPU. With this picture in mind, we can move forward and start working through the actual shader API in Processing. +From all the stages described in our simplified pipeline, only the vertex and fragment shaders can be modified to run our own custom code. The other stages are all hard-coded in the GPU. With this picture in mind, we can move forward and start working through the actual shader API in Processing.
The PShader class
@@ -167,7 +167,7 @@The PShader class
void draw() { shader(toon); - background(0); + background(0); float dirY = (mouseY / float(height) - 0.5) * 2; float dirX = (mouseX / float(width) - 0.5) * 2; directionalLight(204, 204, 204, -dirX, -dirY, -1); @@ -181,7 +181,7 @@The PShader class
uniform mat3 normalMatrix; uniform vec3 lightNormal; -attribute vec4 vertex; +attribute vec4 position; attribute vec4 color; attribute vec3 normal; @@ -190,7 +190,7 @@The PShader class
varying vec3 vertLightDir; void main() { - gl_Position = transform * vertex; + gl_Position = transform * position; vertColor = color; vertNormal = normalize(normalMatrix * normal); vertLightDir = -lightNormal; @@ -203,15 +203,13 @@The PShader class
precision mediump int; #endif -#define PROCESSING_LIGHT_SHADER - uniform float fraction; varying vec4 vertColor; varying vec3 vertNormal; varying vec3 vertLightDir; -void main() { +void main() { float intensity; vec4 color; intensity = max(0.0, dot(vertLightDir, vertNormal)); @@ -226,14 +224,14 @@The PShader class
color = vec4(vec3(0.2), 1.0); } - gl_FragColor = color * vertColor; + gl_FragColor = color * vertColor; }-The ifdef section in the fragment shader is required to make the shader compatible with OpenGL ES and WebGL. It sets the precision of the float and integer numbers to medium, which should be fine for most devices. These precision statements are optional on the desktop. There is also a #define line declaring the PROCESSING_LIGHT_SHADER symbol. This define is used by Processing to determine the type of shader, and whether or not it is valid to render the geometry in the sketch. This topic will be explain in detail in the next section. +The ifdef section in the fragment shader is required to make the shader compatible with OpenGL ES and WebGL. It sets the precision of the float and integer numbers to medium, which should be fine for most devices. These precision statements are optional on the desktop.
@@ -248,7 +246,7 @@
The PShader class
Types of shaders in Processing
-From the code and pseudo-code examples presented in the previous sections, it can be appreciated that different shaders have different uniform and attribute variables. Clearly, a shader that does not compute lighting does not need uniforms holding the light source's position and color, for example. If we work with a low-level toolkit in C or C++ with direct access to the OpenGL API, we are free to name the uniforms and attributes of a shader in any way we like, since we have absolute control on the way the geometry is stored in our application, and how and when it is passed over to the GPU pipeline using the OpenGL functions. This is different when working in Processing, since the shaders are handled automatically by the renderers and should be able to handle the geometry that is described with the drawing API of Processing. This doesn't imply that custom shaders must render things in the same way as Processing does by default, quite in the contrary, the use of custom shaders opens up the possibility of greatly altering the rendering pipeline in Processing. However, custom shaders meant to be used in conjunction with the standard drawing API have to follow certain naming conventions, and are bound by some limitations. +From the code and pseudo-code examples presented in the previous sections, it can be appreciated that different shaders have different uniform and attribute variables. For example, a shader that does not compute lighting does not need uniforms holding the light source's position and color, for example. If we work with a low-level toolkit in C or C++ with direct access to the OpenGL API, we are free to name the uniforms and attributes of a shader in any way we like, since we have absolute control on the way the geometry is stored in our application, and how and when it is passed over to the GPU pipeline using the OpenGL functions. This is different when working in Processing, since the shaders are handled automatically by the renderers and should be able to handle the geometry that is described with the drawing API of Processing. This doesn't imply that custom shaders must render things in the same way as Processing does by default, quite in the contrary, the use of custom shaders opens up the possibility of greatly altering the rendering pipeline in Processing. However, custom shaders meant to be used in conjunction with the standard drawing API have to follow certain naming conventions, and are bound by some limitations.
@@ -260,20 +258,20 @@
Types of shaders in Processing
-
-
- POINT shaders: used to render stroke points. -
- LINE shaders: used to render stroke lines. -
- TRIANGLE shaders: used to render anything else, which means that they will handle (lit/unlit, textured/non-textured) shapes. Because all shapes in Processing are ultimately made out of triangles, they are can be called TRIANGLE shaders. +
- POINT shaders: used to render stroke points. +
- LINE shaders: used to render stroke lines. +
- TRIANGLE shaders: used to render anything else, which means that they will handle (lit/unlit, textured/non-textured) shapes. Because all shapes in Processing are ultimately made out of triangles, they are can be called TRIANGLE shaders.
-When setting a shader with the shader() function, if no type argument is specified then the shader will be assumed to be a triangle shader: +When setting a shader with the shader() function, we can specify the shader type explicitly:
void draw() { shader(pointShader, POINTS); shader(lineShader, LINES); - shader(polyShader); // same as shader(polyShader, TRIANGLE); + shader(polyShader); // Processing will autodetect stroke(255); beginShape(POLYGON); @@ -282,7 +280,7 @@Types of shaders in Processing
-This code will result in Processing using pointShader to render stroke points, lineShader to render lines, and polyShader to render triangles (anything else). +This code will result in Processing using pointShader to render stroke points, lineShader to render lines, and polyShader to render the appropriate kind of geometry.
@@ -301,7 +299,7 @@
Types of shaders in Processing
-As mentioned earlier, a shader for rendering lit geometry requires additional attributes and uniform variables to be sent from Processing that are not needed by a shader that only renders flat-colored geometry without lights or textures. Similarly, a shader for rendering textured polygons needs its own uniforms and attributes (texture sampler and texture coordinates) that would not be required otherwise. Although it could have been possible to have a generic shader in Processing that takes care of all different rendering scenarios, this would be very inefficient because of all the branching that should take place inside the shaders to choose the appropriate rendering path. In general, GPUs are not very efficient at handling branches in their shaders, particularly those available on mobile devices. +As mentioned earlier, a shader for rendering lit geometry requires additional attributes and uniform variables to be sent from Processing that are not needed by a shader that only renders flat-colored geometry without lights or textures. Similarly, a shader for rendering textured polygons needs its own uniforms and attributes (texture sampler and texture coordinates) that would not be required otherwise. Depending on what uniforms and attributes are defined in the shader, it will be capable of rendering the current scene correctly or not.
In consequence, the triangle shaders are further discriminated in 4 types:
@@ -314,52 +312,19 @@Types of shaders in Processing
-Together with the POINT and LINE shaders mentioned earlier, we end up having 6 different types of shaders in Processing. -
+Together with the POINT and LINE shaders mentioned earlier, we end up having 6 different types of shaders in Processing. In the next sections we will describe each type of shader in detail. --Processing needs to use the right type of shader when drawing a piece of geometry, and by default it picks the correct shader by checking whether the geometry about to be rendered has lights or textures associated to it and then enabling the appropriate shader. When we set our own custom shader, we need to make sure that it belongs to the correct type to handle the subsequent drawing calls. For example, if simpleShader below is of type COLOR, then in the following code the rectangle will be renderer using simpleShader: -
- --shader(simpleShader); -noLights(); -fill(180); -rect(0, 0, 100, 100); -- -
However, if we do:
- --shader(simpleShader); -lights(); -fill(180); -rect(0, 0, 100, 100); -- -
-then Processing will simply ignore simpleShader and will render the lit rectangle with its own default LIGHT shader. -
- --The type of a shader can be specified inside the GLSL code, either in the vertex shader or the fragment shader (or both), by using a #define line, which are the following: -
+The shader type can be set explicitly in the source code of the shader using pre-processor #defines, which override Processing's autodetection. The supported #defines are the following:
-
-
- #define PROCESSING_POINT_SHADER for POINT shaders -
- #define PROCESSING_LINE_SHADER for LINE shaders -
- #define PROCESSING_COLOR_SHADER for COLOR shaders -
- #define PROCESSING_LIGHT_SHADER for LIGHT shaders -
- #define PROCESSING_TEXTURE_SHADER for TEXTURE shaders -
- #define PROCESSING_TEXLIGHT_SHADER for TEXLIGHT shaders +
- #define PROCESSING_POINT_SHADER +
- #define PROCESSING_LINE_SHADER +
- #define PROCESSING_COLOR_SHADER +
- #define PROCESSING_LIGHT_SHADER +
- #define PROCESSING_TEXTURE_SHADER +
- #define PROCESSING_TEXLIGHT_SHADER
-These defines are in fact hints for the renderer, and could be absent from the shader code altogether. This is convenient for more advanced applications where the data used by the shader is not necessarily determined by the texture/lighting state of the scene, but we will leave the discussion of this functionality for a future tutorial. -
- -In the next sections we will describe each type of shader in detail.
-Color shaders
@@ -379,11 +344,11 @@
Color shaders
can = createCan(100, 200, 32); } -void draw() { +void draw() { background(0); translate(width/2, height/2); - rotateY(angle); - shape(can); + rotateY(angle); + shape(can); angle += 0.01; } @@ -399,9 +364,9 @@Color shaders
float u = float(i) / detail; sh.normal(x, 0, z); sh.vertex(x * r, -h/2, z * r, u, 0); - sh.vertex(x * r, +h/2, z * r, u, 1); + sh.vertex(x * r, +h/2, z * r, u, 1); } - sh.endShape(); + sh.endShape(); return sh; } @@ -422,17 +387,15 @@Color shaders
colorvert.glsl:
-#define PROCESSING_COLOR_SHADER
-
uniform mat4 transform;
-attribute vec4 vertex;
+attribute vec4 position;
attribute vec4 color;
varying vec4 vertColor;
void main() {
- gl_Position = transform * vertex;
+ gl_Position = transform * position;
vertColor = color;
}
@@ -456,7 +419,7 @@ Color shaders
Now, we need to make two changes to our main program to make use of our new shader. At the end of our setup function we need to add
- colorShader = loadShader("colorfrag.glsl", "colorvert.glsl");
+ colorShader = loadShader("colorfrag.glsl", "colorvert.glsl");
to load the shader files. Then, right after background(), add
@@ -469,7 +432,7 @@
Color shaders
-The type of shader is indicated here with the define in the vertex shader, but it could also be in the fragment shader. In this example, there is only one uniform variable, transform, which is a 4x4 matrix holding the product of the projection and the modelview matrices. The multiplication of a vertex in world coordinates by the transform matrix gives the clip coordinates. The vertex and color attributes hold the position and color of the input vertex, respectively. The input color is copied without any modification to the vertColor varying, which passes the value down to the fragment shader. The fragment shader is nothing more than a pass-through shader since the color is sent to the output without any further modifications. The uniform transform and the attributes vertex and color are automatically set by Processing.
+The type of shader is indicated here with the define in the vertex shader, but it could also be in the fragment shader. In this example, there is only one uniform variable, transform, which is a 4x4 matrix holding the product of the projection and the modelview matrices. The multiplication of a position in world coordinates by the transform matrix gives the clip coordinates. The position and color attributes hold the position and color of the input vertex, respectively. The input color is copied without any modification to the vertColor varying, which passes the value down to the fragment shader. The fragment shader is nothing more than a pass-through shader since the color is sent to the output without any further modifications. The uniform transform and the attributes position and color are automatically set by Processing.
@@ -499,20 +462,20 @@
Texture shaders
PShader texShader;
void setup() {
- size(640, 360, P3D);
+ size(640, 360, P3D);
label = loadImage("lachoy.jpg");
can = createCan(100, 200, 32, label);
texShader = loadShader("texfrag.glsl", "texvert.glsl");
}
-void draw() {
+void draw() {
background(0);
- shader(texShader);
+ shader(texShader);
translate(width/2, height/2);
- rotateY(angle);
- shape(can);
+ rotateY(angle);
+ shape(can);
angle += 0.01;
}
@@ -529,20 +492,18 @@ Texture shaders
float u = float(i) / detail;
sh.normal(x, 0, z);
sh.vertex(x * r, -h/2, z * r, u, 0);
- sh.vertex(x * r, +h/2, z * r, u, 1);
+ sh.vertex(x * r, +h/2, z * r, u, 1);
}
- sh.endShape();
+ sh.endShape();
return sh;
}
texvert.glsl:
-#define PROCESSING_TEXTURE_SHADER
-
uniform mat4 transform;
uniform mat4 texMatrix;
-attribute vec4 vertex;
+attribute vec4 position;
attribute vec4 color;
attribute vec2 texCoord;
@@ -550,8 +511,8 @@ Texture shaders
varying vec4 vertTexCoord;
void main() {
- gl_Position = transform * vertex;
-
+ gl_Position = transform * position;
+
vertColor = color;
vertTexCoord = texMatrix * vec4(texCoord, 1.0, 1.0);
}
@@ -588,7 +549,7 @@ Texture shaders
void main() {
int si = int(vertTexCoord.s * 50.0);
- int sj = int(vertTexCoord.t * 50.0);
+ int sj = int(vertTexCoord.t * 50.0);
gl_FragColor = texture2D(texture, vec2(float(si) / 50.0, float(sj) / 50.0)) * vertColor;
}
@@ -626,7 +587,7 @@ Light shaders
lightShader = loadShader("lightfrag.glsl", "lightvert.glsl");
}
-void draw() {
+void draw() {
background(0);
shader(lightShader);
@@ -634,35 +595,33 @@ Light shaders
pointLight(255, 255, 255, width/2, height, 200);
translate(width/2, height/2);
- rotateY(angle);
- shape(can);
+ rotateY(angle);
+ shape(can);
angle += 0.01;
}
lightvert.glsl:
-#define PROCESSING_LIGHT_SHADER
-
uniform mat4 modelview;
uniform mat4 transform;
uniform mat3 normalMatrix;
uniform vec4 lightPosition;
-attribute vec4 vertex;
+attribute vec4 position;
attribute vec4 color;
attribute vec3 normal;
varying vec4 vertColor;
void main() {
- gl_Position = transform * vertex;
- vec3 ecVertex = vec3(modelview * vertex);
+ gl_Position = transform * position;
+ vec3 ecPosition = vec3(modelview * position);
vec3 ecNormal = normalize(normalMatrix * normal);
- vec3 direction = normalize(lightPosition.xyz - ecVertex);
+ vec3 direction = normalize(lightPosition.xyz - ecPosition);
float intensity = max(0.0, dot(direction, ecNormal));
- vertColor = vec4(intensity, intensity, intensity, 1) * color;
+ vertColor = vec4(intensity, intensity, intensity, 1) * color;
}
lightfrag.glsl:
@@ -682,7 +641,7 @@ Light shaders
-In the vertex shader, the ecVertex variable is the position of the input vertex expressed in eye-coordinates, since it is obtained by multiplying vertex by the modelview matrix. Similarly, multiplying the input normal vector by the normalMatrix yields its coordinates in the eye-system. Once all the vectors are expressed in the same coordinate system, they can be used to calculate the intensity of the incident light at the current vector. From the formula used in the shader, the intensity is directly proportional to the angle between the normal and the vector between the vertex and the light source.
+In the vertex shader, the ecPosition variable is the position of the input vertex expressed in eye-coordinates, since it is obtained by multiplying vertex by the modelview matrix. Similarly, multiplying the input normal vector by the normalMatrix yields its coordinates in the eye-system. Once all the vectors are expressed in the same coordinate system, they can be used to calculate the intensity of the incident light at the current vector. From the formula used in the shader, the intensity is directly proportional to the angle between the normal and the vector between the vertex and the light source.
@@ -701,7 +660,7 @@
Light shaders
-The values in this uniforms completely specify any lighting configuration set in the sketch using the ambientLight(), pointLight(), directionalLight() and spotLight() functions in Processing. To see how all these uniforms are used in the default light shader, which covers all the possible lighting combinations, take a look at its source code from the Processing core. However, a valid light shader doesn't need to declare all of these uniforms, for example in the previous example we only needed the lightPosition uniform.
+The values in this uniforms completely specify any lighting configuration set in the sketch using the ambientLight(), pointLight(), directionalLight() and spotLight() functions in Processing. To see how all these uniforms are used in the default light shader, which covers all the possible lighting combinations, take a look at its source code from the Processing core. However, a valid light shader doesn't need to declare all of these uniforms, for example in the previous example we only needed the lightPosition uniform.
@@ -714,8 +673,6 @@
Light shaders
pixlightvert.glsl:
-#define PROCESSING_LIGHT_SHADER
-
uniform mat4 modelview;
uniform mat4 transform;
uniform mat3 normalMatrix;
@@ -723,7 +680,7 @@ Light shaders
uniform vec4 lightPosition;
uniform vec3 lightNormal;
-attribute vec4 vertex;
+attribute vec4 position;
attribute vec4 color;
attribute vec3 normal;
@@ -732,11 +689,11 @@ Light shaders
varying vec3 lightDir;
void main() {
- gl_Position = transform * vertex;
- vec3 ecVertex = vec3(modelview * vertex);
-
+ gl_Position = transform * position;
+ vec3 ecPosition = vec3(modelview * position);
+
ecNormal = normalize(normalMatrix * normal);
- lightDir = normalize(lightPosition.xyz - ecVertex);
+ lightDir = normalize(lightPosition.xyz - ecPosition);
vertColor = color;
}
@@ -751,7 +708,7 @@ Light shaders
varying vec3 ecNormal;
varying vec3 lightDir;
-void main() {
+void main() {
vec3 direction = normalize(lightDir);
vec3 normal = normalize(ecNormal);
float intensity = max(0.0, dot(direction, normal));
@@ -792,29 +749,27 @@ Texture-light shaders
PShader texlightShader;
void setup() {
- size(640, 360, P3D);
+ size(640, 360, P3D);
label = loadImage("lachoy.jpg");
can = createCan(100, 200, 32, label);
texlightShader = loadShader("texlightfrag.glsl", "texlightvert.glsl");
}
-void draw() {
+void draw() {
background(0);
shader(texlightShader);
- pointLight(255, 255, 255, width/2, height, 200);
+ pointLight(255, 255, 255, width/2, height, 200);
translate(width/2, height/2);
- rotateY(angle);
- shape(can);
+ rotateY(angle);
+ shape(can);
angle += 0.01;
}
texlightvert.glsl:
-#define PROCESSING_TEXLIGHT_SHADER
-
uniform mat4 modelview;
uniform mat4 transform;
uniform mat3 normalMatrix;
@@ -822,7 +777,7 @@ Texture-light shaders
uniform vec4 lightPosition;
-attribute vec4 vertex;
+attribute vec4 position;
attribute vec4 color;
attribute vec3 normal;
attribute vec2 texCoord;
@@ -831,15 +786,15 @@ Texture-light shaders
varying vec4 vertTexCoord;
void main() {
- gl_Position = transform * vertex;
- vec3 ecVertex = vec3(modelview * vertex);
+ gl_Position = transform * position;
+ vec3 ecPosition = vec3(modelview * position);
vec3 ecNormal = normalize(normalMatrix * normal);
- vec3 direction = normalize(lightPosition.xyz - ecVertex);
+ vec3 direction = normalize(lightPosition.xyz - ecPosition);
float intensity = max(0.0, dot(direction, ecNormal));
- vertColor = vec4(intensity, intensity, intensity, 1) * color;
-
- vertTexCoord = texMatrix * vec4(texCoord, 1.0, 1.0);
+ vertColor = vec4(intensity, intensity, intensity, 1) * color;
+
+ vertTexCoord = texMatrix * vec4(texCoord, 1.0, 1.0);
}
texlightfrag.glsl:
@@ -871,8 +826,6 @@ Texture-light shaders
pixlightxvert.glsl:
-#define PROCESSING_TEXLIGHT_SHADER
-
uniform mat4 modelview;
uniform mat4 transform;
uniform mat3 normalMatrix;
@@ -880,7 +833,7 @@ Texture-light shaders
uniform vec4 lightPosition;
-attribute vec4 vertex;
+attribute vec4 position;
attribute vec4 color;
attribute vec3 normal;
attribute vec2 texCoord;
@@ -891,14 +844,14 @@ Texture-light shaders
varying vec4 vertTexCoord;
void main() {
- gl_Position = transform * vertex;
- vec3 ecVertex = vec3(modelview * vertex);
-
- ecNormal = normalize(normalMatrix * normal);
- lightDir = normalize(lightPosition.xyz - ecVertex);
- vertColor = color;
-
- vertTexCoord = texMatrix * vec4(texCoord, 1.0, 1.0);
+ gl_Position = transform * position;
+ vec3 ecPosition = vec3(modelview * position);
+
+ ecNormal = normalize(normalMatrix * normal);
+ lightDir = normalize(lightPosition.xyz - ecPosition);
+ vertColor = color;
+
+ vertTexCoord = texMatrix * vec4(texCoord, 1.0, 1.0);
}
pixlightxfrag.glsl:
@@ -930,6 +883,19 @@ Texture-light shaders
Note that a texlight cannot be used to render a scene only with textures or only with lights, in those cases either a texture or light shader will be needed.
+Aliases for uniforms and attributes
+
+A few of the most common vertex attributes and shader uniforms have an alternative short-hand name, listed below:
+
+
-
+
- position or vertex +
- transform or transformMatrix +
- modelview or modelviewMatrix +
- projection or projectionMatrix +
- texture or texMap +
Image post-processing effects
@@ -942,8 +908,6 @@
Image post-processing effects
precision mediump int; #endif -#define PROCESSING_TEXTURE_SHADER - uniform sampler2D texture; varying vec4 vertColor; @@ -958,7 +922,7 @@Image post-processing effects
gl_FragColor = vertColor; } else { gl_FragColor = vec4(0, 0, 0, 1); - } + } } @@ -977,20 +941,20 @@Image post-processing effects
PShader bwShader; void setup() { - size(640, 360, P3D); + size(640, 360, P3D); label = loadImage("lachoy.jpg"); can = createCan(100, 200, 32, label); bwShader = loadShader("bwfrag.glsl"); } -void draw() { +void draw() { background(0); shader(bwShader); translate(width/2, height/2); - rotateY(angle); - shape(can); + rotateY(angle); + shape(can); angle += 0.01; } @@ -998,7 +962,7 @@Image post-processing effects
-You will notice that this time the loadShader() function only receives the filename of the fragment shader. Because the GLSL code contains the #define PROCESSING_TEXTURE_SHADER line, Processing will know that we are providing the fragment stage of a texture shader. How does it complete the entire shader program? The answer is that it uses the default vertex stage for texture shaders. As a consequence of this, and since the varying variables are first declared in the vertex stage, the fragment shader has to follow the varying names adopted in the default shader. In this case, the varying variables for the fragment color and texture coordinate must be named vertColor and vertTexCoord, respectively. +You will notice that this time the loadShader() function only receives the filename of the fragment shader. How does Processing complete the entire shader program? The answer is that it uses the default vertex stage for texture shaders. As a consequence of this, and since the varying variables are first declared in the vertex stage, the fragment shader has to follow the varying names adopted in the default shader. In this case, the varying variables for the fragment color and texture coordinate must be named vertColor and vertTexCoord, respectively.
@@ -1014,8 +978,6 @@
Image post-processing effects
precision mediump int; #endif -#define PROCESSING_TEXTURE_SHADER - uniform sampler2D texture; uniform vec2 texOffset; @@ -1034,7 +996,7 @@Image post-processing effects
vec2 tc6 = vertTexCoord.st + vec2(-texOffset.s, +texOffset.t); vec2 tc7 = vertTexCoord.st + vec2( 0.0, +texOffset.t); vec2 tc8 = vertTexCoord.st + vec2(+texOffset.s, +texOffset.t); - + vec4 col0 = texture2D(texture, tc0); vec4 col1 = texture2D(texture, tc1); vec4 col2 = texture2D(texture, tc2); @@ -1045,8 +1007,8 @@Image post-processing effects
vec4 col7 = texture2D(texture, tc7); vec4 col8 = texture2D(texture, tc8); - vec4 sum = 8.0 * col4 - (col0 + col1 + col2 + col3 + col5 + col6 + col7 + col8); - gl_FragColor = vec4(sum.rgb, 1.0) * vertColor; + vec4 sum = 8.0 * col4 - (col0 + col1 + col2 + col3 + col5 + col6 + col7 + col8); + gl_FragColor = vec4(sum.rgb, 1.0) * vertColor; } @@ -1061,8 +1023,6 @@Image post-processing effects
precision mediump int; #endif -#define PROCESSING_TEXTURE_SHADER - uniform sampler2D texture; uniform vec2 texOffset; @@ -1078,7 +1038,7 @@Image post-processing effects
vec2 tc3 = vertTexCoord.st + vec2(+texOffset.s, 0.0); vec2 tc4 = vertTexCoord.st + vec2( 0.0, +texOffset.t); vec2 tc5 = vertTexCoord.st + vec2(+texOffset.s, +texOffset.t); - + vec4 col0 = texture2D(texture, tc0); vec4 col1 = texture2D(texture, tc1); vec4 col2 = texture2D(texture, tc2); @@ -1088,7 +1048,7 @@Image post-processing effects
vec4 sum = vec4(0.5) + (col0 + col1 + col2) - (col3 + col4 + col5); float lum = dot(sum, lumcoeff); - gl_FragColor = vec4(lum, lum, lum, 1.0) * vertColor; + gl_FragColor = vec4(lum, lum, lum, 1.0) * vertColor; } @@ -1133,13 +1093,13 @@Putting all together
PShader embossShader; void setup() { - size(480, 480, P3D); + size(480, 480, P3D); label = loadImage("lachoy.jpg"); can = createCan(canSize, 2 * canSize, 32, label); cap = createCap(canSize, 32); colorShader = loadShader("colorfrag.glsl", "colorvert.glsl"); - lightShader = loadShader("lightfrag.glsl", "lightvert.glsl"); + lightShader = loadShader("lightfrag.glsl", "lightvert.glsl"); texShader = loadShader("texfrag.glsl", "texvert.glsl"); texlightShader = loadShader("texlightfrag.glsl", "texlightvert.glsl"); @@ -1153,10 +1113,10 @@Putting all together
selShader = texlightShader; useLight = true; useTexture = true; - println("Vertex lights, texture shading"); + println("Vertex lights, texture shading"); } -void draw() { +void draw() { background(0); float x = 1.88 * canSize; @@ -1181,7 +1141,7 @@Putting all together
if (useLight) { pointLight(255, 255, 255, centerx, centery, 200); } - shader(selShader); + shader(selShader); translate(centerx, centery, 65); rotateY(rotAngle); @@ -1193,15 +1153,15 @@Putting all together
shape(can); noLights(); - resetShader(); + resetShader(); pushMatrix(); - translate(0, canSize - 5, 0); + translate(0, canSize - 5, 0); shape(cap); popMatrix(); pushMatrix(); - translate(0, -canSize + 5, 0); + translate(0, -canSize + 5, 0); shape(cap); popMatrix(); @@ -1221,9 +1181,9 @@Putting all together
float u = float(i) / detail; sh.normal(x, 0, z); sh.vertex(x * r, -h/2, z * r, u, 0); - sh.vertex(x * r, +h/2, z * r, u, 1); + sh.vertex(x * r, +h/2, z * r, u, 1); } - sh.endShape(); + sh.endShape(); return sh; } @@ -1240,7 +1200,7 @@Putting all together
sh.vertex(x * r, 0, z * r); } sh.endShape(); - return sh; + return sh; } void keyPressed() { @@ -1248,47 +1208,47 @@Putting all together
println("No lights, no texture shading"); selShader = colorShader; useLight = false; - useTexture = false; + useTexture = false; } else if (key == '2') { println("Vertex lights, no texture shading"); selShader = lightShader; useLight = true; - useTexture = false; + useTexture = false; } else if (key == '3') { println("No lights, texture shading"); selShader = texShader; useLight = false; - useTexture = true; + useTexture = true; } else if (key == '4') { println("Vertex lights, texture shading"); selShader = texlightShader; useLight = true; - useTexture = true; + useTexture = true; } else if (key == '5') { println("Pixel lights, no texture shading"); selShader = pixlightShader; useLight = true; - useTexture = false; + useTexture = false; } else if (key == '6') { println("Pixel lights, texture shading"); selShader = texlightxShader; useLight = true; - useTexture = true; + useTexture = true; } else if (key == '7') { println("Black&white texture filtering"); selShader = bwShader; useLight = false; - useTexture = true; + useTexture = true; } else if (key == '8') { println("Edge detection filtering"); selShader = edgesShader; useLight = false; - useTexture = true; + useTexture = true; } else if (key == '9') { println("Emboss filtering"); selShader = embossShader; useLight = false; - useTexture = true; + useTexture = true; } } @@ -1343,32 +1303,30 @@10. Point and line shaders
background(0); } -void draw() { +void draw() { shader(pointShader, POINTS); - if (mousePressed) { + if (mousePressed) { point(mouseX, mouseY); } } pointvert.glsl: -#define PROCESSING_POINT_SHADER - uniform mat4 projection; uniform mat4 modelview; -attribute vec4 vertex; +attribute vec4 position; attribute vec4 color; attribute vec2 offset; varying vec4 vertColor; void main() { - vec4 pos = modelview * vertex; + vec4 pos = modelview * position; vec4 clip = projection * pos; - + gl_Position = clip + projection * vec4(offset, 0, 0); - + vertColor = color; } @@ -1381,7 +1339,7 @@10. Point and line shaders
varying vec4 vertColor; -void main() { +void main() { gl_FragColor = vertColor; } @@ -1414,7 +1372,7 @@10. Point and line shaders
pointShader.set("weight", weight); cloud1 = loadImage("cloud1.png"); cloud2 = loadImage("cloud2.png"); - cloud3 = loadImage("cloud3.png"); + cloud3 = loadImage("cloud3.png"); pointShader.set("sprite", cloud1); strokeWeight(weight); @@ -1424,9 +1382,9 @@10. Point and line shaders
background(0); } -void draw() { +void draw() { shader(pointShader, POINTS); - if (mousePressed) { + if (mousePressed) { point(mouseX, mouseY); } } @@ -1443,14 +1401,12 @@10. Point and line shaders
spritevert.glsl: -#define PROCESSING_POINT_SHADER - uniform mat4 projection; uniform mat4 modelview; uniform float weight; - -attribute vec4 vertex; + +attribute vec4 position; attribute vec4 color; attribute vec2 offset; @@ -1458,13 +1414,13 @@10. Point and line shaders
varying vec2 texCoord; void main() { - vec4 pos = modelview * vertex; + vec4 pos = modelview * position; vec4 clip = projection * pos; - + gl_Position = clip + projection * vec4(offset, 0, 0); - + texCoord = (vec2(0.5) + offset / weight); - + vertColor = color; } @@ -1480,7 +1436,7 @@10. Point and line shaders
varying vec4 vertColor; varying vec2 texCoord; -void main() { +void main() { gl_FragColor = texture2D(sprite, texCoord) * vertColor; } @@ -1500,7 +1456,7 @@10. Point and line shaders
-Another limitation of the default point rendering in Processing that we can overcome with a custom point shader is the use of many vertices to represent a single point. We saw that in the case of square points, actually 5 vertices are sent to the GPU per point. In the case of rounds points, this number could be significantly higher since the point circles are approximated with regular polygons of n sides. The number n grows as the point is larger on the screen. +Another limitation of the default point rendering in Processing that we can overcome with a custom point shader is the use of many vertices to represent a single point. We saw that in the case of square points, actually 5 vertices are sent to the GPU per point. In the case of rounds points, this number could be significantly higher since the point circles are approximated with regular polygons of n sides. The number n grows as the point is larger on the screen.
@@ -1516,11 +1472,11 @@
10. Point and line shaders
void setup() { size(640, 360, P3D); - pointShader = loadShader("pointfrag.glsl", "pointvert.glsl"); + pointShader = loadShader("pointfrag.glsl", "pointvert.glsl"); pointShader.set("sharpness", 0.9); strokeCap(SQUARE); - background(0); + background(0); } void draw() { @@ -1531,19 +1487,17 @@10. Point and line shaders
pointShader.set("weight", w); strokeWeight(w); - stroke(random(255), random(255), random(255)); + stroke(random(255), random(255), random(255)); point(mouseX, mouseY); } } pointvert.glsl: -#define PROCESSING_POINT_SHADER - uniform mat4 projection; uniform mat4 transform; - -attribute vec4 vertex; + +attribute vec4 position; attribute vec4 color; attribute vec2 offset; @@ -1552,9 +1506,9 @@10. Point and line shaders
varying vec2 pos; void main() { - vec4 clip = transform * vertex; + vec4 clip = transform * position; gl_Position = clip + projection * vec4(offset, 0, 0); - + vertColor = color; center = clip.xy; pos = offset; @@ -1574,12 +1528,12 @@10. Point and line shaders
varying vec2 center; varying vec2 pos; -void main() { +void main() { float len = weight/2.0 - length(pos); vec4 color = vec4(1.0, 1.0, 1.0, len); - color = mix(vec4(0.0), color, sharpness); - color = clamp(color, 0.0, 1.0); - gl_FragColor = color * vertColor; + color = mix(vec4(0.0), color, sharpness); + color = clamp(color, 0.0, 1.0); + gl_FragColor = color * vertColor; } @@ -1631,37 +1585,35 @@10. Point and line shaders
linevert.glsl: -#define PROCESSING_LINE_SHADER - uniform mat4 transform; uniform vec4 viewport; -attribute vec4 vertex; +attribute vec4 position; attribute vec4 color; attribute vec4 direction; varying vec4 vertColor; - + vec3 clipToWindow(vec4 clip, vec4 viewport) { vec3 dclip = clip.xyz / clip.w; vec2 xypos = (dclip.xy + vec2(1.0, 1.0)) * 0.5 * viewport.zw; return vec3(xypos, dclip.z * 0.5 + 0.5); } - + void main() { - vec4 clip0 = transform * vertex; + vec4 clip0 = transform * position; vec4 clip1 = clip0 + transform * vec4(direction.xyz, 0); float thickness = direction.w; - - vec3 win0 = clipToWindow(clip0, viewport); - vec3 win1 = clipToWindow(clip1, viewport); + + vec3 win0 = clipToWindow(clip0, viewport); + vec3 win1 = clipToWindow(clip1, viewport); vec2 tangent = win1.xy - win0.xy; - + vec2 normal = normalize(vec2(-tangent.y, tangent.x)); vec2 offset = normal * thickness; gl_Position.xy = clip0.xy + offset.xy; gl_Position.zw = clip0.zw; - vertColor = color; + vertColor = color; } linefrag.glsl: @@ -1733,40 +1685,38 @@10. Point and line shaders
linevert.glsl: -#define PROCESSING_LINE_SHADER - uniform mat4 transform; uniform vec4 viewport; -attribute vec4 vertex; +attribute vec4 position; attribute vec4 color; attribute vec4 direction; varying vec2 center; varying vec2 normal; varying vec4 vertColor; - + vec3 clipToWindow(vec4 clip, vec4 viewport) { vec3 dclip = clip.xyz / clip.w; vec2 xypos = (dclip.xy + vec2(1.0, 1.0)) * 0.5 * viewport.zw; return vec3(xypos, dclip.z * 0.5 + 0.5); } - + void main() { - vec4 clip0 = transform * vertex; + vec4 clip0 = transform * position; vec4 clip1 = clip0 + transform * vec4(direction.xyz, 0); float thickness = direction.w; - - vec3 win0 = clipToWindow(clip0, viewport); - vec3 win1 = clipToWindow(clip1, viewport); + + vec3 win0 = clipToWindow(clip0, viewport); + vec3 win1 = clipToWindow(clip1, viewport); vec2 tangent = win1.xy - win0.xy; - + normal = normalize(vec2(-tangent.y, tangent.x)); vec2 offset = normal * thickness; gl_Position.xy = clip0.xy + offset.xy; gl_Position.zw = clip0.zw; - vertColor = color; - + vertColor = color; + center = (win0.xy + win1.xy) / 2.0; } @@ -1785,14 +1735,14 @@10. Point and line shaders
void main() { vec2 v = gl_FragCoord.xy - center; - float alpha = 1.0 - abs(2.0 * dot(normalize(normal), v) / weight); + float alpha = 1.0 - abs(2.0 * dot(normalize(normal), v) / weight); gl_FragColor = vec4(vertColor.rgb, alpha); } -The key calculation here is the dot product between the normal vector and the vector from the center of the stroke quad and the current fragment position, dot(normalize(normal), v), which will be exactly 0 along the spine of the quad, and so, giving alpha equal to 1. +
The key calculation here is the dot product between the normal vector and the vector from the center of the stroke quad and the current fragment position, dot(normalize(normal), v), which will be exactly 0 along the spine of the quad, and so, giving alpha equal to 1.
The DISABLE_DEPTH_MASK hint in the sketch code is a simple (but not perfect) trick to avoid obvious visual artifacts due to the use of semi-transparent geometry together with alpha blending.
@@ -1801,4 +1751,3 @@10. Point and line shaders
- diff --git a/content/static/tutorials/pvector/imgs/add.svg b/content/static/tutorials/pvector/imgs/add.svg index ce3a5376e..0a398a332 100644 --- a/content/static/tutorials/pvector/imgs/add.svg +++ b/content/static/tutorials/pvector/imgs/add.svg @@ -1,38 +1,74 @@ - + diff --git a/content/static/tutorials/pvector/imgs/definition.svg b/content/static/tutorials/pvector/imgs/definition.svg index 6a67730d8..408fe7e92 100644 --- a/content/static/tutorials/pvector/imgs/definition.svg +++ b/content/static/tutorials/pvector/imgs/definition.svg @@ -1,15 +1,233 @@ - + diff --git a/content/static/tutorials/pvector/imgs/div.svg b/content/static/tutorials/pvector/imgs/div.svg index 18f2a74e6..dcca3cb7a 100644 --- a/content/static/tutorials/pvector/imgs/div.svg +++ b/content/static/tutorials/pvector/imgs/div.svg @@ -1,37 +1,76 @@ - + diff --git a/content/static/tutorials/pvector/imgs/howtogetthere.svg b/content/static/tutorials/pvector/imgs/howtogetthere.svg index a17c8393e..3832d1762 100644 --- a/content/static/tutorials/pvector/imgs/howtogetthere.svg +++ b/content/static/tutorials/pvector/imgs/howtogetthere.svg @@ -1,22 +1,272 @@ - + diff --git a/content/static/tutorials/pvector/imgs/mag.svg b/content/static/tutorials/pvector/imgs/mag.svg index adff47405..21dc49665 100644 --- a/content/static/tutorials/pvector/imgs/mag.svg +++ b/content/static/tutorials/pvector/imgs/mag.svg @@ -1,21 +1,86 @@ - + diff --git a/content/static/tutorials/pvector/imgs/mouseaccelerate1.svg b/content/static/tutorials/pvector/imgs/mouseaccelerate1.svg index 15ca363b6..bc42489e4 100644 --- a/content/static/tutorials/pvector/imgs/mouseaccelerate1.svg +++ b/content/static/tutorials/pvector/imgs/mouseaccelerate1.svg @@ -1,17 +1,267 @@ - + diff --git a/content/static/tutorials/pvector/imgs/mouseaccelerate2.svg b/content/static/tutorials/pvector/imgs/mouseaccelerate2.svg index 45ab52b6d..6fd4dda8c 100644 --- a/content/static/tutorials/pvector/imgs/mouseaccelerate2.svg +++ b/content/static/tutorials/pvector/imgs/mouseaccelerate2.svg @@ -1,15 +1,130 @@ - + diff --git a/content/static/tutorials/pvector/imgs/mult.svg b/content/static/tutorials/pvector/imgs/mult.svg index a98190c81..0a631c266 100644 --- a/content/static/tutorials/pvector/imgs/mult.svg +++ b/content/static/tutorials/pvector/imgs/mult.svg @@ -2,38 +2,76 @@ diff --git a/content/static/tutorials/pvector/imgs/normalize1.svg b/content/static/tutorials/pvector/imgs/normalize1.svg index 586c3c115..0713c19ec 100644 --- a/content/static/tutorials/pvector/imgs/normalize1.svg +++ b/content/static/tutorials/pvector/imgs/normalize1.svg @@ -1,34 +1,361 @@ - + diff --git a/content/static/tutorials/pvector/imgs/normalize2.svg b/content/static/tutorials/pvector/imgs/normalize2.svg index 906959ff3..c6a924fee 100644 --- a/content/static/tutorials/pvector/imgs/normalize2.svg +++ b/content/static/tutorials/pvector/imgs/normalize2.svg @@ -1,31 +1,197 @@ - + diff --git a/content/static/tutorials/pvector/imgs/pythagorean.svg b/content/static/tutorials/pvector/imgs/pythagorean.svg index 14f7f3ab8..58d3a0057 100644 --- a/content/static/tutorials/pvector/imgs/pythagorean.svg +++ b/content/static/tutorials/pvector/imgs/pythagorean.svg @@ -1,17 +1,52 @@ - + diff --git a/content/static/tutorials/pvector/imgs/steps.svg b/content/static/tutorials/pvector/imgs/steps.svg index b954d79af..f9d92c388 100644 --- a/content/static/tutorials/pvector/imgs/steps.svg +++ b/content/static/tutorials/pvector/imgs/steps.svg @@ -1,61 +1,730 @@ - + diff --git a/content/static/tutorials/pvector/imgs/sub.svg b/content/static/tutorials/pvector/imgs/sub.svg index 02072d88c..4462f9bfe 100644 --- a/content/static/tutorials/pvector/imgs/sub.svg +++ b/content/static/tutorials/pvector/imgs/sub.svg @@ -1,43 +1,84 @@ - + diff --git a/content/static/tutorials/pvector/imgs/v.svg b/content/static/tutorials/pvector/imgs/v.svg index 98e0e22a8..34f82eac4 100644 --- a/content/static/tutorials/pvector/imgs/v.svg +++ b/content/static/tutorials/pvector/imgs/v.svg @@ -1,28 +1,51 @@ - + diff --git a/content/static/tutorials/pvector/index.html b/content/static/tutorials/pvector/index.html index 7678ca4ca..81039248b 100644 --- a/content/static/tutorials/pvector/index.html +++ b/content/static/tutorials/pvector/index.html @@ -22,7 +22,7 @@Daniel Shiffman
Vectors: You Complete Me
-Before we get into vectors themselves, let's look at a beginner Processing example that demonstrates why it is in the first place we should care. If you've read any of the introductory Processing textbooks or taken a class on programming with Processing (and hopefully you've done one of these things to help prepare you for this book), you probably, at one point or another, learned to how to write a simple bouncing ball sketch.
+Before we get into vectors themselves, let's look at a beginner Processing example that demonstrates why it is in the first place we should care. If you've read any of the introductory Processing textbooks or taken a class on programming with Processing (and hopefully you've done one of these things to help prepare you for this book), you probably, at one point or another, learned how to write a simple bouncing ball sketch.
@@ -410,7 +410,7 @@
Vectors: More Algebra
w = (-9, 21)
-
+
The function inside the PVector class therefore is written as:
diff --git a/content/static/tutorials/sound/index.html b/content/static/tutorials/sound/index.html index 4fecd9535..e1fada6b0 100644 --- a/content/static/tutorials/sound/index.html +++ b/content/static/tutorials/sound/index.html @@ -80,10 +80,6 @@Sound and musical informatics
This representation of sound, as a discrete “frame” of frequencies and amplitudes independent of time, is more akin to the way in which we perceive our sonic environment than the raw pressure wave of the time domain. Jean-Baptiste-Joseph Fourier, a nineteenth-century French mathematician, developed the equations that allow us to translate a sound pressure wave (no matter how complex) into its constituent frequencies and amplitudes. This Fourier transform is an important tool in working with sound in the computer. -- This representation of sound, as a discrete “frame” of frequencies and amplitudes independent of time, is more akin to the way in which we perceive our sonic environment than the raw pressure wave of the time domain. Jean-Baptiste-Joseph Fourier, a nineteenth-century French mathematician, developed the equations that allow us to translate a sound pressure wave (no matter how complex) into its constituent frequencies and amplitudes. This Fourier transform is an important tool in working with sound in the computer. -
-Our auditory system takes these streams of frequency and amplitude information from our two ears and uses them to construct an auditory “scene,” akin to the visual scene derived from the light reaching our retinas.6 Our brain analyzes the acoustic information based on a number of parameters such as onset time, stereo correlation, harmonic ratio, and complexity to parse out a number of acoustic sources that are then placed in a three-dimensional image representing what we hear. Many of the parameters that psychoacousticians believe we use to comprehend our sonic environment are similar to the grouping principles defined in Gestalt psychology.
@@ -207,7 +203,7 @@Tools for sound programming
- Classic computer music “languages,” most of which are derived from Max Mathews’ MUSIC program, are still in wide use today. Some of these, such as CSound (developed by Barry Vercoe at MIT) have wide followings and are taught in computer music studios as standard tools for electroacoustic composition. The majority of these MUSIC-N programs use text files for input, though they are increasingly available with graphical editors for many tasks. Typically, two text files are used; the first contains a description of the sound to be generated using a specification language that defines one or more “instruments” made by combining simple unit generators. A second file contains the “score,” a list of instructions specifying which instrument in the first file plays what event, when, for how long, and with what variable parameters. Most of these programs go beyond simple task-based synthesis and audio processing to facilitate algorithmic composition, often by building on top of a standard programming language; F. Richard Moore’s CLM package, for example, is built on top of Common LISP. Some of these languages have been retrofitted in recent years to work in real time (as opposed to rendering a sound file to disk); Real-Time Cmix, for example, contains a C-style parser as well as support for connectivity from clients over network sockets and MIDI. + Classic computer music “languages,” most of which are derived from Max Mathews’ MUSIC program, are still in wide use today. Some of these, such as CSound (developed by Barry Vercoe at MIT) have wide followings and are taught in computer music studios as standard tools for electroacoustic composition. The majority of these MUSIC-N programs use text files for input, though they are increasingly available with graphical editors for many tasks. Typically, two text files are used; the first contains a description of the sound to be generated using a specification language that defines one or more “instruments” made by combining simple unit generators. A second file contains the “score,” a list of instructions specifying which instrument in the first file plays what event, when, for how long, and with what variable parameters. Most of these programs go beyond simple task-based synthesis and audio processing to facilitate algorithmic composition, often by building on top of a standard programming language; Bill Schottstaedt ’s CLM package, for example, is built on top of Common LISP. Some of these languages have been retrofitted in recent years to work in real time (as opposed to rendering a sound file to disk); Real-Time Cmix, for example, contains a C-style parser as well as support for connectivity from clients over network sockets and MIDI.
@@ -237,140 +233,140 @@
Example 1, 2: Synthesizer
-/** - * Processing Sound Library, Example 1 - * - * Five sine waves are layered to construct a cluster of frequencies. - * This method is called additive synthesis. Use the mouse position - * inside the display window to detune the cluster. - */ - -import processing.sound.*; - -SinOsc[] sineWaves; // Array of sines -float[] sineFreq; // Array of frequencies -int numSines = 5; // Number of oscillators to use - -void setup() { - size(640, 360); - background(255); - - sineWaves = new SinOsc[numSines]; // Initialize the oscillators - sineFreq = new float[numSines]; // Initialize array for Frequencies - - for (int i = 0; i < numSines; i++) { - // Calculate the amplitude for each oscillator - float sineVolume = (1.0 / numSines) / (i + 1); - // Create the oscillators - sineWaves[i] = new SinOsc(this); - // Start Oscillators - sineWaves[i].play(); - // Set the amplitudes for all oscillators - sineWaves[i].amp(sineVolume); - } +/** + * Processing Sound Library, Example 1 + * + * Five sine waves are layered to construct a cluster of frequencies. + * This method is called additive synthesis. Use the mouse position + * inside the display window to detune the cluster. + */ + +import processing.sound.*; + +SinOsc[] sineWaves; // Array of sines +float[] sineFreq; // Array of frequencies +int numSines = 5; // Number of oscillators to use + +void setup() { + size(640, 360); + background(255); + + sineWaves = new SinOsc[numSines]; // Initialize the oscillators + sineFreq = new float[numSines]; // Initialize array for Frequencies + + for (int i = 0; i < numSines; i++) { + // Calculate the amplitude for each oscillator + float sineVolume = (1.0 / numSines) / (i + 1); + // Create the oscillators + sineWaves[i] = new SinOsc(this); + // Start Oscillators + sineWaves[i].play(); + // Set the amplitudes for all oscillators + sineWaves[i].amp(sineVolume); + } } -void draw() { - //Map mouseY from 0 to 1 - float yoffset = map(mouseY, 0, height, 0, 1); - //Map mouseY logarithmically to 150 - 1150 to create a base frequency range - float frequency = pow(1000, yoffset) + 150; - //Use mouseX mapped from -0.5 to 0.5 as a detune argument - float detune = map(mouseX, 0, width, -0.5, 0.5); - - for (int i = 0; i < numSines; i++) { - sineFreq[i] = frequency * (i + 1 * detune); - // Set the frequencies for all oscillators - sineWaves[i].freq(sineFreq[i]); - } +void draw() { + //Map mouseY from 0 to 1 + float yoffset = map(mouseY, 0, height, 0, 1); + //Map mouseY logarithmically to 150 - 1150 to create a base frequency range + float frequency = pow(1000, yoffset) + 150; + //Use mouseX mapped from -0.5 to 0.5 as a detune argument + float detune = map(mouseX, 0, width, -0.5, 0.5); + + for (int i = 0; i < numSines; i++) { + sineFreq[i] = frequency * (i + 1 * detune); + // Set the frequencies for all oscillators + sineWaves[i].freq(sineFreq[i]); + } }
-/** - * Processing Sound Library, Example 2 - * - * This sketch shows how to use envelopes and oscillators. - * Envelopes describe to course of amplitude over time. - * The Sound library provides an ASR envelope which stands for - * attack, sustain, release. - * - * .________ - * . --- - * . --- - * . --- - * A S R - */ - -import processing.sound.*; - -// Oscillator and envelope -TriOsc triOsc; -Env env; - -// Times and levels for the ASR envelope -float attackTime = 0.001; -float sustainTime = 0.004; -float sustainLevel = 0.2; -float releaseTime = 0.2; - -// This is an octave in MIDI notes. -int[] midiSequence = { - 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72 -}; - -// Set the duration between the notes -int duration = 200; -// Set the note trigger -int trigger = 0; - -// An index to count up the notes -int note = 0; - -void setup() { - size(640, 360); - background(255); - - // Create triangle wave and envelope - triOsc = new TriOsc(this); - env = new Env(this); +/** + * Processing Sound Library, Example 2 + * + * This sketch shows how to use envelopes and oscillators. + * Envelopes describe to course of amplitude over time. + * The Sound library provides an ASR envelope which stands for + * attack, sustain, release. + * + * .________ + * . --- + * . --- + * . --- + * A S R + */ + +import processing.sound.*; + +TriOsc triOsc; +Env env; + +// Times and levels for the ASR envelope +float attackTime = 0.001; +float sustainTime = 0.004; +float sustainLevel = 0.3; +float releaseTime = 0.2; + +// This is an octave in MIDI notes. +int[] midiSequence = { 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72 }; + +// Play a new note every 200ms +int duration = 200; + +// This variable stores the point in time when the next note should be triggered +int trigger = millis(); + +// An index to count up the notes +int note = 0; + +void setup() { + size(640, 360); + background(255); + + // Create triangle wave and start it + triOsc = new TriOsc(this); + + // Create the envelope + env = new Env(this); } -void draw() { +void draw() { - // If value of trigger is equal to the computer clock and if not all - // notes have been played yet, the next note gets triggered. - if ((millis() > trigger) && (note<midiSequence.length)) { + // If the determined trigger moment in time matches up with the computer clock and + // the sequence of notes hasn't been finished yet, the next note gets played. + if ((millis() > trigger) && (note<midiSequence.length)) { - // midiToFreq transforms the MIDI value into a frequency in Hz which we use - //to control the triangle oscillator with an amplitute of 0.8 - triOsc.play(midiToFreq(midiSequence[note]), 0.8); + // midiToFreq transforms the MIDI value into a frequency in Hz which we use to + // control the triangle oscillator with an amplitute of 0.5 + triOsc.play(midiToFreq(midiSequence[note]), 0.5); - // The envelope gets triggered with the oscillator as input and the times and - // levels we defined earlier - env.play(triOsc, attackTime, sustainTime, sustainLevel, releaseTime); + // The envelope gets triggered with the oscillator as input and the times and + // levels we defined earlier + env.play(triOsc, attackTime, sustainTime, sustainLevel, releaseTime); - // Create the new trigger according to predefined durations and speed - trigger = millis() + duration; + // Create the new trigger according to predefined duration + trigger = millis() + duration; - // Advance by one note in the midiSequence; - note++; + // Advance by one note in the midiSequence; + note++; - // Loop the sequence - if (note == 12) { - note = 0; - } - } -} + // Loop the sequence, notice the jitter + if (note == 12) { + note = 0; + } + } +} -// This function calculates the respective frequency of a MIDI note -float midiToFreq(int note) { - return (pow(2, ((note-69)/12.0)))*440; +// This helper function calculates the respective frequency of a MIDI note +float midiToFreq(int note) { + return (pow(2, ((note-69)/12.0))) * 440; } -+
@@ -384,97 +380,96 @@
Example 3, 4: Sample playback
-/** - * Processing Sound Library, Example 3 - * - * This example shows how to make a simple sampler and sequencer - * with the Sound library. In this sketch, five different samples are - * loaded and played back at different pitches, in this case five - * different octaves. The sequencer triggers an event every 200-1000 - * milliseconds randomly. Each time a sound is played a colored - * rect with a random color is displayed. - */ - -import processing.sound.*; - -SoundFile[] files; - -// Create an array of values which represent the octaves. -// 1.0 is playback at normal speed, 0.5 is half and therefore -// one octave down. 2.0 is double so one octave up. -float[] octave = { - 0.25, 0.5, 1.0, 2.0, 4.0 -}; - -// The playSound array is defining how many samples will be -// played at each trigger event -int[] playSound = { - 1, 1, 1, 1, 1 -}; - -// The trigger is an integer number in milliseconds so we -// can schedule new events in the draw loop -int trigger=0; - -// This array holds the pixel positions of the rectangles -// that are drawn each event -int[] posx = { - 0, 128, 256, 384, 512 -}; - - -void setup() { - size(640, 360); - background(255); - - // Create an array of 5 empty soundfiles - files = new SoundFile[5]; - - // Load 5 soundfiles from a folder in a for loop. By naming - // the files 1., 2., 3., [...], n.aif it is easy to iterate - // through the folder and load all files in one line of code. - for (int i = 0; i < files.length; i++) { - files[i] = new SoundFile(this, (i+1) + ".aif"); - } +/** + * Processing Sound Library, Example 3 + * + * This example shows how to make a simple sampler and sequencer + * with the Sound library. In this sketch, five different samples are + * loaded and played back at different pitches, in this case five + * different octaves. The sequencer triggers an event every 200-1000 + * milliseconds randomly. Each time a sound is played a colored + * rect with a random color is displayed. + * + * Load this example with included sound files from the Processing Editor: + * Examples > Libraries > Sound > Soundfile > Sampler + */ + +import processing.sound.*; + +SoundFile[] file; + +// Define the number of samples +int numsounds = 5; + +// Create an array of values which represent the octaves. +// 1.0 is playback at normal speed, 0.5 is half and +// therefore one octave down. 2.0 is double so one octave up. +float[] octave = {0.25, 0.5, 1.0, 2.0, 4.0}; + +// The playSound array is defining how many samples will +// be played at each trigger event +int[] playSound = {1, 1, 1, 1, 1}; + +// The trigger is an integer number in milliseconds so we +// can schedule new events in the draw loop +int trigger; + +// This array holds the pixel positions of the rectangles +// which are drawn each event +int[] posx = {0, 128, 256, 384, 512}; + + +void setup() { + size(640, 360); + background(255); + + // Create an array of empty soundfiles + file = new SoundFile[numsounds]; + + // Load 5 soundfiles from a folder in a for loop. + // By naming the files 1., 2., 3., n.aif it is easy to iterate + // through the folder and load all files in one line of code. + for (int i = 0; i < numsounds; i++) { + file[i] = new SoundFile(this, (i+1) + ".aif"); + } + + // Create a trigger which will be the basis for our random sequencer. + trigger = millis(); } -void draw() { - - // If the determined trigger moment in time matches up with - // the computer clock events get triggered. - if (millis() > trigger) { - - // Redraw the background every time to erase old rects - background(255); - - // By iterating through the playSound array we check for - // 1 or 0, 1 plays a sound and draws a rect, for 0 nothing happens - - for (int i = 0; i < files.length; i++) { - // Check which indexes are 1 and 0. - if (playSound[i] == 1) { - float rate; - // Choose a random color and get set to noStroke() - fill(int(random(255)), int(random(255)), int(random(255))); - noStroke(); - // Draw the rect in the positions we defined earlier in posx - rect(posx[i], 50, 128, 260); - // Choose a random index of the octave array - rate = octave[int(random(0, 5))]; - // Play the soundfile from the array with the respective - // rate and loop set to false - files[i].play(rate, 1.0); - } - - // Renew the indexes of playSound so that at the next event - // the order is different and randomized. - playSound[i] = int(random(0, 2)); - } - - // Create a new triggertime in the future, with a random offset - // between 200 and 1000 milliseconds - trigger = millis() + int(random(200, 1000)); - } +void draw() { + + // If the determined trigger moment in time matches up with the + // computer clock events get triggered. + if (millis() > trigger) { + // Redraw the background every time to erase old rects + background(255); + + // By iterating through the playSound array we check for 1 or 0, + // 1 plays a sound and draws a rect, for 0 nothing happens. + + for (int i = 0; i < numsounds; i++) { + // Check which indexes are 1 and 0. + if (playSound[i] == 1) { + float rate; + // Choose a random color and get set to noStroke() + fill(int(random(255)), int(random(255)), int(random(255))); + noStroke(); + // Draw the rect in the positions we defined earlier in posx + rect(posx[i], 50, 128, 260); + // Choose a random index of the octave array + rate = octave[int(random(0, 5))]; + // Play the soundfile from the array with the respective rate and loop set to false + file[i].play(rate, 1.0); + } + + // Renew the indexes of playSound so that at the next event the order is different and randomized. + playSound[i] = int(random(0, 2)); + } + + // Create a new triggertime in the future, with a random offset between 200 and 1000 milliseconds + trigger = millis() + int(random(200, 1000)); + } }@@ -482,81 +477,150 @@
Example 3, 4: Sample playback
-/** - * Processing Sound Library, Example 4 - * - * Five soundfiles are mapped to the numbers on the keyboard. - * Numbers 1-5 are played back an octave lower and numbers - * 6-0 an octave higher. - */ - -import processing.sound.*; - -AudioDevice device; -SoundFile[] file; - -int red, green, blue; - -void setup() { - size(640, 360); - background(255); - - // Create an AudioDevice with low buffer size - // and create an array containing 5 empty soundfiles - device = new AudioDevice(this, 48000, 32); - file = new SoundFile[5]; - - // Load 5 soundfiles from a folder in a for loop. - for (int i = 0; i < file.length; i++) { - file[i] = new SoundFile(this, (i+1) + ".aif"); - } +/** + * Processing Sound Library, Example 4 + * + * This example shows how to make a simple keyboard-triggered sampler with the Sound + * library. In this sketch 5 different short samples are loaded and played back at + * different speeds, which also changes their perceived pitch by one or two octaves. + * + * Load this example with included sound files from the Processing Editor: + * Examples > Libraries > Sound > Soundfile > Keyboard + */ + +import processing.sound.*; + +SoundFile[] file; + +// Define the number of samples +int numsounds = 5; + +// Define a variable to store the randomly generated background color in +int backgroundColor[] = {255, 255, 255}; + +void setup() { + size(640, 360); + + // Create a Sound renderer and an array of empty soundfiles + file = new SoundFile[numsounds]; + + // Load 5 soundfiles from a folder in a for loop. By naming + // the files 1.aif, 2.aif, 3.aif, ..., n.aif it is easy to iterate + // through the folder and load all files in one line of code. + for (int i = 0; i < numsounds; i++) { + file[i] = new SoundFile(this, (i+1) + ".aif"); + } } -void draw() { - background(red, green, blue); +void draw() { + background(backgroundColor[0], backgroundColor[1], backgroundColor[2]); } -void keyPressed() { - // Set a random background color each time you hit then number keys - red=int(random(255)); - green=int(random(255)); - blue=int(random(255)); - - // Assign a sound to each number on your keyboard. 1-5 play at - // an octave below the original pitch of the file, 6-0 play at - // an octave above. - switch(key) { - case '1': - file[0].play(0.5, 1.0); - break; - case '2': - file[1].play(0.5, 1.0); - break; - case '3': - file[2].play(0.5, 1.0); - break; - case '4': - file[3].play(0.5, 1.0); - break; - case '5': - file[4].play(0.5, 1.0); - break; - case '6': - file[0].play(2.0, 1.0); - break; - case '7': - file[1].play(2.0, 1.0); - break; - case '8': - file[2].play(2.0, 1.0); - break; - case '9': - file[3].play(2.0, 1.0); - break; - case '0': - file[4].play(2.0, 1.0); - break; - } +void keyPressed() { + // We use a boolean helper variable to determine whether one of the branches + // of the switch-statement was activated or not + boolean validKey = true; + + switch(key) { + case 'a': + file[0].play(0.5, 1.0); + break; + + case 's': + file[1].play(0.5, 1.0); + break; + + case 'd': + file[2].play(0.5, 1.0); + break; + + case 'f': + file[3].play(0.5, 1.0); + break; + + case 'g': + file[4].play(0.5, 1.0); + break; + + case 'h': + file[0].play(1.0, 1.0); + break; + + case 'j': + file[1].play(1.0, 1.0); + break; + + case 'k': + file[2].play(1.0, 1.0); + break; + + case 'l': + file[3].play(1.0, 1.0); + break; + + case ';': + file[4].play(1.0, 1.0); + break; + + case '\'': + file[0].play(2.0, 1.0); + break; + + case 'q': + file[1].play(2.0, 1.0); + break; + + case 'w': + file[2].play(2.0, 1.0); + break; + + case 'e': + file[3].play(2.0, 1.0); + break; + + case 'r': + file[4].play(2.0, 1.0); + break; + + case 't': + file[0].play(3.0, 1.0); + break; + + case 'y': + file[1].play(3.0, 1.0); + break; + + case 'u': + file[2].play(3.0, 1.0); + break; + + case 'i': + file[3].play(3.0, 1.0); + break; + + case 'o': + file[4].play(3.0, 1.0); + break; + + case 'p': + file[0].play(4.0, 1.0); + break; + + case '[': + file[1].play(4.0, 1.0); + break; + + // no valid key was pressed, store that information + default: + validKey = false; + } + + // If a new sample playback was triggered, change the background color + if (validKey) { + for (int i = 0; i < 3; i++) { + backgroundColor[i] = int(random(255)); + } + } }@@ -577,130 +641,134 @@
Example 5, 6: Audio analysis
-/** - * Processing Sound Library, Example 5 - * - * This sketch shows how to use the FFT class to analyze a stream - * of sound. Change the variable bands to get more or less - * spectral bands to work with. The smooth_factor variable determines - * how much the signal will be smoothed on a scale form 0-1. - */ - -import processing.sound.*; - -// Declare the processing sound variables -SoundFile sample; -FFT fft; -AudioDevice device; - -// Declare a scaling factor -int scale = 5; - -// Define how many FFT bands we want -int bands = 128; - -// declare a drawing variable for calculating rect width -float r_width; - -// Create a smoothing vector -float[] sum = new float[bands]; - -// Create a smoothing factor -float smooth_factor = 0.2; - -void setup() { - size(640, 360); - background(255); - - // If the Buffersize is larger than the FFT Size, the FFT will fail - // so we set Buffersize equal to bands - device = new AudioDevice(this, 44000, bands); - - // Calculate the width of the rects depending on how many bands we have - r_width = width/float(bands); - - // Load and play a soundfile and loop it. This has to be called - // before the FFT is created. - sample = new SoundFile(this, "beat.aiff"); - sample.loop(); - - // Create and patch the FFT analyzer - fft = new FFT(this, bands); - fft.input(sample); -} - -void draw() { - // Set background color, noStroke and fill color - background(204); - fill(0, 0, 255); - noStroke(); - - fft.analyze(); - for (int i = 0; i < bands; i++) { - // Smooth the FFT data by smoothing factor - sum[i] += (fft.spectrum[i] - sum[i]) * smooth_factor; - - // Draw the rects with a scale factor - rect( i*r_width, height, r_width, -sum[i]*height*scale ); - } +/** + * Processing Sound Library, Example 5 + * + * This sketch shows how to use the FFT class to analyze a stream + * of sound. Change the number of bands to get more spectral bands + * (at the expense of more coarse-grained time resolution of the spectrum). + * + * Load this example with included sound files from the Processing Editor: + * Examples > Libraries > Sound > Analysis > FFTSpectrum + */ + +import processing.sound.*; + +// Declare the sound source and FFT analyzer variables +SoundFile sample; +FFT fft; + +// Define how many FFT bands to use (this needs to be a power of two) +int bands = 128; + +// Define a smoothing factor which determines how much the spectrums of consecutive +// points in time should be combined to create a smoother visualisation of the spectrum. +// A smoothing factor of 1.0 means no smoothing (only the data from the newest analysis +// is rendered), decrease the factor down towards 0.0 to have the visualisation update +// more slowly, which is easier on the eye. +float smoothingFactor = 0.2; + +// Create a vector to store the smoothed spectrum data in +float[] sum = new float[bands]; + +// Variables for drawing the spectrum: +// Declare a scaling factor for adjusting the height of the rectangles +int scale = 5; +// Declare a drawing variable for calculating the width of the +float barWidth; + +public void setup() { + size(640, 360); + background(255); + + // Calculate the width of the rects depending on how many bands we have + barWidth = width/float(bands); + + // Load and play a soundfile and loop it. + sample = new SoundFile(this, "beat.aiff"); + sample.loop(); + + // Create the FFT analyzer and connect the playing soundfile to it. + fft = new FFT(this, bands); + fft.input(sample); } -- -
- -
-/** - * Processing Sound Library, Example 6 - * - * This sketch shows how to use the Amplitude class to analyze a - * stream of sound. In this case a sample is analyzed. The smoothFactor - * variable determines how much the signal will be smoothed on a scale - * from 0 - 1. - */ - -import processing.sound.*; - -// Declare the processing sound variables -SoundFile sample; -Amplitude rms; - -// Declare a scaling factor -float scale = 5.0; - -// Declare a smooth factor -float smoothFactor = 0.25; - -// Used for smoothing -float sum; +public void draw() { + // Set background color, noStroke and fill color + background(125, 255, 125); + fill(255, 0, 150); + noStroke(); -void setup() { - size(640, 360); + // Perform the analysis + fft.analyze(); - //Load and play a soundfile and loop it - sample = new SoundFile(this, "beat.aiff"); - sample.loop(); + for (int i = 0; i < bands; i++) { + // Smooth the FFT spectrum data by smoothing factor + sum[i] += (fft.spectrum[i] - sum[i]) * smoothingFactor; - // Create and patch the rms tracker - rms = new Amplitude(this); - rms.input(sample); -} - -void draw() { - // Set background color, noStroke and fill color - background(0, 0, 255); - noStroke(); - fill(255, 0, 150); + // Draw the rectangles, adjust their height using the scale factor + rect(i*barWidth, height, barWidth, -sum[i]*height*scale); + } +} - // Smooth the rms data by smoothing factor - sum += (rms.analyze() - sum) * smoothFactor; +- // rms.analyze() return a value between 0 and 1. It's - // scaled to height/2 and then multiplied by a scale factor - float rmsScaled = sum * (height/2) * scale; +
- // Draw an ellipse at a size based on the audio analysis - ellipse(width/2, height/2, rmsScaled, rmsScaled); +
+/**
+ * Processing Sound Library, Example 6
+ *
+ * This sketch shows how to use the Amplitude class to analyze the changing
+ * "loudness" of a stream of sound. In this case an audio sample is analyzed.
+ *
+ * Load this example with included sound files from the Processing Editor:
+ * Examples > Libraries > Sound > Analysis > PeakAmplitude
+ */
+
+import processing.sound.*;
+
+// Declare the processing sound variables
+SoundFile sample;
+Amplitude rms;
+
+// Declare a smooth factor to smooth out sudden changes in amplitude.
+// With a smooth factor of 1, only the last measured amplitude is used for the
+// visualisation, which can lead to very abrupt changes. As you decrease the
+// smooth factor towards 0, the measured amplitudes are averaged across frames,
+// leading to more pleasant gradual changes
+float smoothingFactor = 0.25;
+
+// Used for storing the smoothed amplitude value
+float sum;
+
+public void setup() {
+ size(640, 360);
+
+ //Load and play a soundfile and loop it
+ sample = new SoundFile(this, "beat.aiff");
+ sample.loop();
+
+ // Create and patch the rms tracker
+ rms = new Amplitude(this);
+ rms.input(sample);
+}
+
+public void draw() {
+ // Set background color, noStroke and fill color
+ background(125, 255, 125);
+ noStroke();
+ fill(255, 0, 150);
+
+ // smooth the rms data by smoothing factor
+ sum += (rms.analyze() - sum) * smoothingFactor;
+
+ // rms.analyze() return a value between 0 and 1. It's
+ // scaled to height/2 and then multiplied by a fixed scale factor
+ float rms_scaled = sum * (height/2) * 5;
+
+ // We draw a circle whose size is coupled to the audio analysis
+ ellipse(width/2, height/2, rms_scaled, rms_scaled);
}
diff --git a/content/static/tutorials/text/index.html b/content/static/tutorials/text/index.html
index a0415456f..4636aea5d 100644
--- a/content/static/tutorials/text/index.html
+++ b/content/static/tutorials/text/index.html
@@ -32,7 +32,7 @@ Where do we find documentation for the String class?
- This page only covers some of the available methods of the String class. The full documentation can be found on java's String page. + This page only covers some of the available methods of the String class. The full documentation can be found on java's String page.
@@ -246,7 +246,7 @@Animating Text
-
+Example Text Align
PFont f; @@ -325,7 +325,7 @@Animating Text
Here's the full example that displays a different headline each time the previous headline leaves the screen. The headlines are stored in a String array.- +Example Scrolling Headlines // An array of news headlines String[] headlines = { @@ -374,7 +374,7 @@Rotating text
Translation and rotation can also be applied to text. For example, to rotate text around its center, translate to an origin point and use textAlign(CENTER) before displaying the text.
- +Example: Rotating Text PFont f; String message = "this text is spinning"; float theta; @@ -496,7 +496,7 @@Displaying text character by character
- +Example Text breaking up PFont f; String message = "click mouse to shake it up"; // An array of Letter objects @@ -575,7 +575,7 @@Displaying text character by character
- +Example Boxes along a curve
PFont f; @@ -635,7 +635,7 @@Displaying text character by character
- +Example Characters along a curve // The message to be displayed String message = "text along a curve"; diff --git a/content/static/tutorials/transform2d/index.html b/content/static/tutorials/transform2d/index.html index 115af7c22..5647b937f 100644 --- a/content/static/tutorials/transform2d/index.html +++ b/content/static/tutorials/transform2d/index.html @@ -118,7 +118,7 @@What’s the Advantage?
is a lot more trouble than just adding to coordinates. For a simple example like the rectangle, you are correct. But let’s take an example of wheretranslate()can make life easier. Here is some -code that draws a row of houses. It uses a loop that calls +code that draws a row of houses. It uses a loop that calls a function namedhouse(), which takes the x and y location of the house’s upper-left corner as its parameters. @@ -410,7 +410,7 @@The Transformation Matrix
Push and Pop
-What, about the push and pop part of the names? These come from a computer +What about the push and pop part of the names? These come from a computer concept known as a stack, which works like a spring-loaded tray dispenser in a cafeteria. When someone returns a tray to the stack, its weight pushes the platform down. diff --git a/content/static/tutorials/tutorials.xml b/content/static/tutorials/tutorials.xml index a9cad915b..9db78bd35 100644 --- a/content/static/tutorials/tutorials.xml +++ b/content/static/tutorials/tutorials.xml @@ -119,12 +119,14 @@
true- + +-->- \ No newline at end of file + Electronics @@ -182,4 +184,11 @@false+ + + diff --git a/content/static/tutorials/typography/index.html b/content/static/tutorials/typography/index.html index c71b0d284..931690834 100644 --- a/content/static/tutorials/typography/index.html +++ b/content/static/tutorials/typography/index.html @@ -156,7 +156,7 @@Video +video +true +false+Draw text
Vector Fonts
- To work with fonts different than the default, more functions are needed to prepare a font to be used with Processing. The createFont() function is used to convert a TrueType font (.ttf) or OpenType font (.otf) so that is can display through text(). The textFont() function is used to define the current font to display. Any compatible font installed on the computer running Processing or stored in the sketch’s data folder may be used. The following short program is used to print the list of the available installed fonts to the console: + To work with fonts different than the default, more functions are needed to prepare a font to be used with Processing. The createFont() function is used to convert a TrueType font (.ttf) or OpenType font (.otf) so that it can display through text(). The textFont() function is used to define the current font to display. Any compatible font installed on the computer running Processing or stored in the sketch’s data folder may be used. The following short program is used to print the list of the available installed fonts to the console:
diff --git a/content/static/tutorials/video/imgs/fig_16_01_capture.png b/content/static/tutorials/video/imgs/fig_16_01_capture.png new file mode 100755 index 000000000..09bfc22ce Binary files /dev/null and b/content/static/tutorials/video/imgs/fig_16_01_capture.png differ diff --git a/content/static/tutorials/video/imgs/fig_16_02_tintvideo.png b/content/static/tutorials/video/imgs/fig_16_02_tintvideo.png new file mode 100755 index 000000000..aa8c0cc35 Binary files /dev/null and b/content/static/tutorials/video/imgs/fig_16_02_tintvideo.png differ diff --git a/content/static/tutorials/video/imgs/fig_16_03_flashlight.png b/content/static/tutorials/video/imgs/fig_16_03_flashlight.png new file mode 100755 index 000000000..a395fa12c Binary files /dev/null and b/content/static/tutorials/video/imgs/fig_16_03_flashlight.png differ diff --git a/content/static/tutorials/video/imgs/fig_16_04_blankgrid.png b/content/static/tutorials/video/imgs/fig_16_04_blankgrid.png new file mode 100755 index 000000000..75c47bd1d Binary files /dev/null and b/content/static/tutorials/video/imgs/fig_16_04_blankgrid.png differ diff --git a/content/static/tutorials/video/imgs/fig_16_05_pixelated.png b/content/static/tutorials/video/imgs/fig_16_05_pixelated.png new file mode 100755 index 000000000..6e9c6b356 Binary files /dev/null and b/content/static/tutorials/video/imgs/fig_16_05_pixelated.png differ diff --git a/content/static/tutorials/video/imgs/fig_16_06_mirror.png b/content/static/tutorials/video/imgs/fig_16_06_mirror.png new file mode 100755 index 000000000..3af852ae3 Binary files /dev/null and b/content/static/tutorials/video/imgs/fig_16_06_mirror.png differ diff --git a/content/static/tutorials/video/imgs/fig_16_07_blank_scribble.png b/content/static/tutorials/video/imgs/fig_16_07_blank_scribble.png new file mode 100755 index 000000000..72fc30783 Binary files /dev/null and b/content/static/tutorials/video/imgs/fig_16_07_blank_scribble.png differ diff --git a/content/static/tutorials/video/imgs/fig_16_08_scribblermirror.png b/content/static/tutorials/video/imgs/fig_16_08_scribblermirror.png new file mode 100755 index 000000000..ecc48f703 Binary files /dev/null and b/content/static/tutorials/video/imgs/fig_16_08_scribblermirror.png differ diff --git a/content/static/tutorials/video/index.html b/content/static/tutorials/video/index.html new file mode 100644 index 000000000..22ccf759b --- /dev/null +++ b/content/static/tutorials/video/index.html @@ -0,0 +1,575 @@ +
|
+
+ + This tutorial is from the book Learning Processing, 2nd Edition by Daniel Shiffman, published by Morgan Kaufmann, © 2015 Elsevier Inc. All rights reserved. If you see any errors or have comments, please let us know. + + +Video+Daniel Shiffman+ +Live Video+ +
+Now that you’ve explored static images in Processing, you are ready to move on to moving images, specifically from a live camera (and later, from a recorded movie). I’ll begin by walking through the basic steps of importing the video library and using the Capture class to display live video.
+ +import processing.video.*; ++Using the “Import Library” menu option does nothing other than automatically insert that line into your code, so manual typing is entirely equivalent. + + +Step 2. Declare a Capture object. + +You’ve recently seen how to create objects from classes built into the Processing language such as PShape and PImage. Both of these classes, it should be noted, are part of the processing.core library and, therefore,no import statement were required. The processing.video library has two useful classes inside of it — Capture, for live video, and Movie, for recorded video. In this step, I’ll be declaring a Capture object. + +Capture video; ++ +Step 3. Initialize the Capture object. + +The Capture object “video” is just like any other object — to construct an object, you use the new operator followed by the constructor. With a Capture object, this code typically appears in setup(). + +video = new Capture(); ++The above line of code is missing the appropriate arguments for the constructor. Remember, this is not a class you wrote yourself so there is no way to know what is required between the parentheses without consulting the online reference. + +The reference will show there are several ways to call the Capture constructor. A typical way to call the constructor is with three arguments: +
+void setup() {
+ video = new Capture(this, 320, 240);
+}
+
+Let’s walk through the arguments used in the Capture constructor.
+
+
+ +printArray(Capture.list()); ++You can use the text of these configurations to create a Capture object. On a Mac with a built-in camera,for example, this might look like: + +video = new Capture(this, "name=FaceTime HD Camera (Built-in),size=320x240,fps=30"); ++Capture.list() actually gives you an array so you can also simply refer to the index of the configuration you want. + +video = new Capture(this, Capture.list()[0]); ++ +Step 4. Start the capture process. + +Once the camera is ready, it’s up to you to tell Processing to start capturing images. +
+void setup() {
+ video = new Capture(this, 320, 240);
+ video.start();
+}
+
+In almost every case you want to begin capturing right in setup(). Nevertheless, start() is its own method, and you do have the option of, say, not starting capturing until some other time (such as when a button is pressed, etc.)
++ +Step 5. Read the image from the camera. + +There are two strategies for reading frames from the camera. I will briefly look at both and choose one forthe remainder of the examples in this chapter. Both strategies, however, operate under the same fundamental principle: I only want to read an image from the camera when a new frame is available to be read. + + +In order to check if an image is available, you use the function available(), which returns true or false depending on whether something is there. If it is there, the function read() is called and the frame from the camera is read into memory. You can do this over and over again in the draw() loop, always checking to see if a new image is free to be read. +
+void draw() {
+ if (video.available()) {
+ video.read();
+ }
+}
+
+The second strategy, the “event” approach, requires a function that executes any time a certain event — in this case a camera event — occurs. The function mousePressed() is executed whenever the mouse is pressed. With video, you have the option to implement the function captureEvent(), which is invoked any time a capture event occurs, that is, a new frame is available from the camera. These event functions (mousePressed(), keyPressed(), captureEvent(), etc.) aresometimes referred to as a “callback.” And as a brief aside, if you’re following closely, this is where this fits in. The Capture object, video, knows to notify this sketch by invoking captureEvent() because you passed it a reference to this sketch when creating the Capture object video.
++captureEvent() is a function and therefore needs to live in its own block, outside of setup() and draw(). +
+void captureEvent(Capture video) {
+ video.read();
+}
+
+You might notice something odd about captureEvent(). It includes an argument of type Capture in its definition. This might seem redundant to you; after all, in this example I already have a global variable video. Nevertheless in the case where you might have more than one capture device, the same event function can be used for both and the video library will make sure that the correct Capture object is passed in to captureEvent().
++To summarize, I want to call the function read() whenever there is something to read, and I can do so by either checking manually using available() within draw() or allowing a callback to handle it for you — captureEvent(). This allows sketches to operate more efficientlyby separating out the logic for reading from the camera from the main animation loop. + +Step 6. Display the video image. + +This is, without a doubt, the easiest part. You can think of a Capture object as a PImage that changes over time, and, in fact, a Capture object can be utilized in an identical manner as a PImage object. + + 
++image(video, 0, 0); ++All of this is put together in the following code: +
+// Step 1. Import the video library.
+import processing.video.*;
+
+//Step 2. Declare a capture object.
+Capture video;
+
+// Step 5. Read from the camera when a new image is available!
+void captureEvent(Capture video) {
+ video.read();
+}
+
+void setup() {
+ size(320, 240);
+
+ // Step 3. Initialize Capture object.
+ video = new Capture(this, 320, 240);
+
+ // Step 4. Start the capturing process.
+ video.start();
+}
+
+// Step 6. Display the image.
+void draw() {
+image(video, 0, 0);
+}
+
+Again, anything you can do with a PImage (resize, tint, move, etc.) you can do with a Capture object. As long as you read() from that object, the video image will update as you manipulate it. See the following example:
++ 
+
+import processing.video.*;
+
+Capture video;
+
+void setup() {
+ size(320, 240);
+ video = new Capture(this, 320, 240);
+ video.start();
+}
+
+void captureEvent(Capture video) {
+ video.read();
+}
+
+void draw() {
+ background(255);
+ tint(mouseX, mouseY, 255);
+ translate(width/2, height/2);
+ imageMode(CENTER);
+ rotate(PI/4);
+ image(video, 0, 0, mouseX, mouseY);
+}
+
+Note that a video image can be tinted just like a PImage. It can also be moved, rotated, and sized just like a PImage. Following is the “adjusting brightness” example with a video image:
++ 
+
+// Step 1. Import the video library
+import processing.video.*;
+
+// Step 2. Declare a Capture object
+Capture video;
+
+void setup() {
+ size(320, 240);
+
+ // Step 3. Initialize Capture object via Constructor
+ video = new Capture(this, 320, 240);
+ video.start();
+}
+
+// An event for when a new frame is available
+void captureEvent(Capture video) {
+ // Step 4. Read the image from the camera.
+ video.read();
+}
+void draw() {
+ loadPixels();
+ video.loadPixels();
+
+ for (int x = 0; x < video.width; x++) {
+ for (int y = 0; y < video.height; y++) {
+ // Calculate the 1D location from a 2D grid
+ int loc = x + y * video.width;
+
+ // Get the red, green, blue values from a pixel
+ float r = red (video.pixels[loc]);
+ float g = green(video.pixels[loc]);
+ float b = blue (video.pixels[loc]);
+
+ // Calculate an amount to change brightness based on proximity to the mouse
+ float d = dist(x, y, mouseX, mouseY);
+ float adjustbrightness = map(d, 0, 100, 4, 0);
+ r *= adjustbrightness;
+ g *= adjustbrightness;
+ b *= adjustbrightness;
+
+ // Constrain RGB to make sure they are within 0-255 color range
+ r = constrain(r, 0, 255);
+ g = constrain(g, 0, 255);
+ b = constrain(b, 0, 255);
+
+ // Make a new color and set pixel in the window
+ color c = color(r, g, b);
+ pixels[loc] = c;
+ }
+ }
+
+ updatePixels();
+}
+
+
+
+Recorded video+
+Displaying recorded video follows much of the same structure as live video. Processing’s video library accepts most video file formats; for specifics, visit the Movie reference. +Movie movie; ++ +Step 2. Initialize Movie object. + +movie = new Movie(this, "testmovie.mov"); ++The only necessary arguments are this and the movie’s filename enclosed in quotes. The movie file should be stored in the sketch’s data directory. + + +Step 3. Start movie playing. + +There are two options, play(), which plays the movie once, or loop(), which loops it continuously. + +movie.loop(); ++ +Step 4. Read frame from movie. + +Again, this is identical to capture. You can either check to see if a new frame is available, or use a callback function. +
+void draw() {
+ if (movie.available()) {
+ movie.read();
+ }
+}
+
+Or:+
+void movieEvent(Movie movie) {
+ movie.read();
+}
+
+
+Step 5. Display the movie.+ +image(movie, 0, 0); ++The following code shows the program all together: +
+import processing.video.*;
+
+// Step 1. Declare a Movie object.
+Movie movie;
+
+void setup() {
+ size(320, 240);
+
+ // Step 2. Initialize Movie object. The file "testmovie.mov" should live in the data folder.
+ movie = new Movie(this, "testmovie.mov");
+
+ // Step 3. Start playing movie. To play just once play() can be used instead.
+ movie.loop();
+}
+
+// Step 4. Read new frames from the movie.
+void movieEvent(Movie movie) {
+ movie.read();
+}
+
+// Step 5. Display movie.
+void draw() {
+ image(movie, 0, 0);
+}
+
+
+Although Processing is by no means the most sophisticated environment for displaying and manipulating recorded video, there are some more advanced features available in the video library. There are functions for obtaining the duration (length measured in seconds) of a video, for speeding it up and slowing it down, and for jumping to a specific point in the video (among others). If you find that performance is sluggish and the video playback is choppy, I would suggest trying the P2D or P3D renderers.
++Following is an example that makes use of jump() (jump to a specific point in the video) and duration() (returns the length of movie in seconds). In this example, if mouseX equals 0, the video jumps to the beginning. If mouseX equals width, it jumps to the end. Any other value is in between. The jump() function allows you to jump immediately to a point of time within the video. duration() returns the total length of the movie in seconds. + +
+import processing.video.*;
+
+Movie movie;
+
+void setup() {
+ size(200, 200);
+ background(0);
+ movie = new Movie(this, "testmovie.mov");
+}
+
+void movieEvent(Movie movie) {
+ movie.read();
+}
+
+void draw() {
+ // Ratio of mouse X over width
+ float ratio = mouseX / (float) width;
+
+ movie.jump(ratio * movie.duration());
+
+ image(movie, 0, 0);
+}
+
+
+
+Software mirrors+
+With small video cameras attached to more and more personal computers, developing software that manipulates an image in real-time is becoming increasingly popular. These types of applications are sometimes referred to as “mirrors,” as they provide a digital reflection of a viewer’s image. Processing’s extensive library of functions for graphics and its ability to capture from a camera in real-time make it an excellent environment for prototyping and experimenting with software mirrors.
+
+// Size of each cell in the grid, ratio of window size to video size
+int videoScale = 8;
+// Number of columns and rows in the system
+int cols, rows;
+
+void setup() {
+ size(640, 480);
+ // Initialize columns and rows
+ cols = width/videoScale;
+ rows = height/videoScale;
+}
+
+void draw() {
+ // Begin loop for columns
+ for (int i = 0; i < cols; i++) {
+ // Begin loop for rows
+ for (int j = 0; j < rows; j++) {
+ // Scaling up to draw a rectangle at (x,y)
+ int x = i*videoScale;
+ int y = j*videoScale;
+ fill(255);
+ stroke(0);
+ rect(x, y, videoScale, videoScale);
+ }
+ }
+}
+
+Knowing that I want to have squares eight pixels wide by eight pixels high, I can calculate the number of columns as the width divided by eight and the number of rows as the height divided by eight.
+
+ 
++For every square at column i and row j, I look up the color at pixel (i, j) in the video image and color it accordingly. See the following example with the new parts in bold: +
+import processing.video.*;
+
+// Size of each cell in the grid, ratio of window size to video size
+int videoScale = 8;
+// Number of columns and rows in the system
+int cols, rows;
+// Variable to hold onto Capture object
+Capture video;
+
+void setup() {
+ size(640, 480);
+ // Initialize columns and rows
+ cols = width/videoScale;
+ rows = height/videoScale;
+ background(0);
+ video = new Capture(this, cols, rows);
+ video.start()
+}
+
+// Read image from the camera
+void captureEvent(Capture video) {
+ video.read();
+}
+
+void draw() {
+ video.loadPixels();
+ // Begin loop for columns
+ for (int i = 0; i < cols; i++) {
+ // Begin loop for rows
+ for (int j = 0; j < rows; j++) {
+ // Where are you, pixel-wise?
+ int x = i*videoScale;
+ int y = j*videoScale;
+ color c = video.pixels[i + j*video.width];
+ fill(c);
+ stroke(0);
+ rect(x, y, videoScale, videoScale);
+ }
+ }
+}
+
+As you can see, expanding the simple grid system to include colors from video only requires a few additions. I have to declare and initialize the Capture object, read from it, and pull colors from the pixel array.+ 
+Less literal mappings of pixel colors to shapes in the grid can also be applied. In the following example, only the colors black and white are used. Squares are larger where brighter pixels in the video appear, and smaller for darker pixels.+
+// Each pixel from the video source is drawn as
+// a rectangle with size based on brightness.
+
+import processing.video.*;
+// Size of each cell in the grid
+int videoScale = 10;
+// Number of columns and rows in the system
+int cols, rows;
+// Variable for capture device
+Capture video;
+
+void setup() {
+ size(640, 480);
+ // Initialize columns and rows
+ cols = width / videoScale;
+ rows = height / videoScale;
+ // Construct the Capture object
+ video = new Capture(this, cols, rows);
+ video.start();
+}
+
+void captureEvent(Capture video) {
+ video.read();
+}
+
+void draw() {
+ background(0);
+ video.loadPixels();
+ // Begin loop for columns
+ for (int i = 0; i < cols; i++) {
+ // Begin loop for rows
+ for (int j = 0; j < rows; j++) {
+ // Where are you, pixel-wise?
+ int x = i*videoScale;
+ int y = j*videoScale;
+
+ // Reverse the column to mirro the image.
+ int loc = (video.width - i - 1) + j * video.width;
+
+ color c = video.pixels[loc];
+ // A rectangle's size is calculated as a function of the pixel’s brightness.
+ // A bright pixel is a large rectangle, and a dark pixel is a small one.
+ float sz = (brightness(c)/255) * videoScale;
+
+ rectMode(CENTER);
+ fill(255);
+ noStroke();
+ rect(x + videoScale/2, y + videoScale/2, sz, sz);
+ }
+ }
+}
+
+It’s often useful to think of developing software mirrors in two steps. This will also help you think beyondthe more obvious mapping of pixels to shapes on a grid.
++Step 1. Develop an interesting pattern that covers an entire window. + +Step 2. Use a video’s pixels as a look-up table for coloring that pattern. + +Say for Step 1, I write a program that scribbles a random line around the window. Here is my algorithm, written in pseudocode. +
+ 
+
+// Two global variables
+float x;
+float y;
+
+void setup() {
+ size(320, 240);
+ background(255);
+ // Start x and y in the center
+ x = width/2;
+ y = height/2;
+}
+
+void draw() {
+ float newx = constrain(x + random(-20, 20), 0, width);
+ float newy = constrain(y + random(-20, 20), 0, height);
+
+ // Line from (x,y) to the (newx,newy)
+ stroke(0);
+ strokeWeight(4);
+ line(x, y, newx, newy);
+
+ x = newx;
+ y = newy;
+}
+
+Now that I have finished the pattern generating sketch, I can change stroke() to set a color according to the video image. Note again the new lines of code added in bold in the following code:
++ 
+
+import processing.video.*;
+// Two global variables
+float x;
+float y;
+
+// Variable to hold onto Capture object.
+Capture video;
+
+void setup() {
+ size(320, 240);
+ background(255);
+ // Start x and y in the center
+ x = width/2;
+ y = height/2;
+ // Start the capture process
+ video = new Capture(this, width, height);
+ video.start();
+}
+
+void captureEvent(Capture video) {
+ // Read image from the camera
+ video.read();
+}
+
+void draw() {
+ video.loadPixels();
+ float newx = constrain(x + random(-20, 20), 0, width);
+ float newy = constrain(y + random(-20, 20), 0, height-1);
+
+ // Find the midpoint of the line
+ int midx = int((newx + x) / 2);
+ int midy = int((newy + y) / 2);
+ // Pick the color from the video, reversing x
+ color c = video.pixels[(width-1-midx) + midy*video.width];
+
+ // Draw a line from (x,y) to (newx,newy)
+ stroke(c);
+ strokeWeight(4);
+ line(x, y, newx, newy);
+
+ // Save (newx,newy) in (x,y)
+ x = newx;
+ y = newy;
+}
+
+
+
+ |
+
-
-
-
-
-
-
-
-
-
-
-
diff --git a/download/_emailtest.php b/download/_emailtest.php
deleted file mode 100644
index 61c0f87d4..000000000
--- a/download/_emailtest.php
+++ /dev/null
@@ -1,79 +0,0 @@
-Download Processing. Processing is available for Linux, Mac OS X, and Windows. Select your choice to download the software below.
- -Thank you for donating to the Processing Foundation.
- - - -
-
- 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Stable Releases
--
-
- - 3.0.1 - (23 October 2015) - Win 32 - Win 64 - Linux 32 - Linux 64 - Linux ARMv6hf - Mac OS X - - -
- - 3.0 - (30 September 2015, 3p ET) - Win 32 - Win 64 - Linux 32 - Linux 64 - Mac OS X - - - -
- - 2.2.1 - (19 May 2014) - Win 32 - Win 64 - Linux 32 - Linux 64 - Mac OS X - - - -
- - 1.5.1 - (15 May 2011) - Win (standard) - Win (no Java) - Linux x86 - Mac OS X - -
Earlier releases have been removed because we can only support the current versions of the software. To update old code, read the changes page. Per-release changes can be found in revisions.txt. If you have problems with the current release, please file a bug so that we can fix it. Older releases can also be built from the source. Read More about the releases and their numbering. To use Android Mode, Processing 3.0 beta or later is required.
-
-
-
-
- Pre-Releases
--
-
- No pre-release versions are currently available. - - - - -
The revisions cover incremental changes between releases, and are especially important to read for pre-releases.
-
- Processing is Open Source Software. The PDE (Processing Development Environment) is released under the GNU GPL (General Public License). The export libraries (also known as 'core') are released under the GNU LGPL (Lesser General Public License). There's more information about Processing and Open Source in the FAQ and more information about the GNU GPL and GNU LGPL at opensource.org. Please contribute to Processing!
-
-
-- Scott"; -$name = "Scott Murray"; -$email = "shm@alignedleft.com"; - - - -// Build and send the email *using PHPMailer - -$mail = new PHPMailer(); - -$mail->SMTPDebug = 3; //0 is no debug output, 3 is verbose - -$mail->IsSMTP(); -$mail->SMTPAuth = true; -$mail->SMTPSecure = 'tls'; -$mail->Port = 25; -$mail->Host = $mailConfig['host']; -$mail->Username = $mailConfig['user']; -$mail->Password = $mailConfig['pass']; - -$mail->From = 'foundation@processing.org'; -$mail->FromName = 'Processing Foundation'; -$mail->addAddress($email, $name); -$mail->addBCC('foundation@processing.org'); - -$message = str_replace('%name%', $name , $body) . "\n\n"; -$message .= "Email: " . $email . "
\n"; - -$mail->isHTML(true); -$mail->Subject = "Test message from Processing.org"; -$mail->Body = $message; - -if(!$mail->send()) { - echo 'Message could not be sent.'; - echo 'Mailer Error: ' . $mail->ErrorInfo; -} else { - echo 'Message has been sent'; -} - - -//echo("
mailed returned " . $result . "
"); -//echo("ErrorInfo is " . $mail->ErrorInfo . "
"); - - - - - -exit; - -?> \ No newline at end of file diff --git a/download/_helpers.php b/download/_helpers.php deleted file mode 100644 index dc5c90325..000000000 --- a/download/_helpers.php +++ /dev/null @@ -1,24 +0,0 @@ - \ No newline at end of file diff --git a/download/_js/donate.js b/download/_js/donate.js deleted file mode 100644 index bd58eda3c..000000000 --- a/download/_js/donate.js +++ /dev/null @@ -1,54 +0,0 @@ -$(function(){ - - var $donateForm = $('#donateForm') - var $submit = $donateForm.find('input[type="submit"]') - var stripe = true - - // if($('input[name=type]:checked').val() != 'stripe'){ - // stripe = false - // $('.ccInfo').hide() - // } - - $('input[name=type]').on('change', function(){ - if($(this).val()=='stripe'){ - stripe = true - $('.ccInfo').show() - } else if($(this).val()=='paypal'){ - stripe = false - $('.ccInfo').hide() - } - }) - - var stripeResponseHandler = function(status, response) { - if (response.error) { - $('.messages').html(response.error.message) - $submit.prop('disabled', false).val('Complete Donation') - } else { - var token = response['id'] - $donateForm.append('') - $donateForm.get(0).submit() - } - } - - // $donateForm.validate() - $donateForm.on('submit',function(){ - $submit.prop('disabled', true).val('Processing...'); - - if(stripe){ - Stripe.createToken({ - name: $('.first-name').val() + ' ' + $('.last-name').val(), - number: $('.card-number').val(), - cvc: $('.card-cvc').val(), - exp_month: $('.card-expiry-month').val(), - exp_year: $('.card-expiry-year').val() - }, stripeResponseHandler); - - return false; - } - - if(!stripe){ - - } - }) - -}) \ No newline at end of file diff --git a/download/_js/jquery.validate.min.js b/download/_js/jquery.validate.min.js deleted file mode 100755 index cc0414e65..000000000 --- a/download/_js/jquery.validate.min.js +++ /dev/null @@ -1,4 +0,0 @@ -/*! jQuery Validation Plugin - v1.11.0 - 2/4/2013 -* https://github.com/jzaefferer/jquery-validation -* Copyright (c) 2013 Jörn Zaefferer; Licensed MIT */ -(function(e){e.extend(e.fn,{validate:function(t){if(!this.length){t&&t.debug&&window.console&&console.warn("Nothing selected, can't validate, returning nothing.");return}var n=e.data(this[0],"validator");return n?n:(this.attr("novalidate","novalidate"),n=new e.validator(t,this[0]),e.data(this[0],"validator",n),n.settings.onsubmit&&(this.validateDelegate(":submit","click",function(t){n.settings.submitHandler&&(n.submitButton=t.target),e(t.target).hasClass("cancel")&&(n.cancelSubmit=!0)}),this.submit(function(t){function r(){var r;return n.settings.submitHandler?(n.submitButton&&(r=e("").attr("name",n.submitButton.name).val(n.submitButton.value).appendTo(n.currentForm)),n.settings.submitHandler.call(n,n.currentForm,t),n.submitButton&&r.remove(),!1):!0}return n.settings.debug&&t.preventDefault(),n.cancelSubmit?(n.cancelSubmit=!1,r()):n.form()?n.pendingRequest?(n.formSubmitted=!0,!1):r():(n.focusInvalid(),!1)})),n)},valid:function(){if(e(this[0]).is("form"))return this.validate().form();var t=!0,n=e(this[0].form).validate();return this.each(function(){t&=n.element(this)}),t},removeAttrs:function(t){var n={},r=this;return e.each(t.split(/\s/),function(e,t){n[t]=r.attr(t),r.removeAttr(t)}),n},rules:function(t,n){var r=this[0];if(t){var i=e.data(r.form,"validator").settings,s=i.rules,o=e.validator.staticRules(r);switch(t){case"add":e.extend(o,e.validator.normalizeRule(n)),s[r.name]=o,n.messages&&(i.messages[r.name]=e.extend(i.messages[r.name],n.messages));break;case"remove":if(!n)return delete s[r.name],o;var u={};return e.each(n.split(/\s/),function(e,t){u[t]=o[t],delete o[t]}),u}}var a=e.validator.normalizeRules(e.extend({},e.validator.classRules(r),e.validator.attributeRules(r),e.validator.dataRules(r),e.validator.staticRules(r)),r);if(a.required){var f=a.required;delete a.required,a=e.extend({required:f},a)}return a}}),e.extend(e.expr[":"],{blank:function(t){return!e.trim(""+t.value)},filled:function(t){return!!e.trim(""+t.value)},unchecked:function(e){return!e.checked}}),e.validator=function(t,n){this.settings=e.extend(!0,{},e.validator.defaults,t),this.currentForm=n,this.init()},e.validator.format=function(t,n){return arguments.length===1?function(){var n=e.makeArray(arguments);return n.unshift(t),e.validator.format.apply(this,n)}:(arguments.length>2&&n.constructor!==Array&&(n=e.makeArray(arguments).slice(1)),n.constructor!==Array&&(n=[n]),e.each(n,function(e,n){t=t.replace(new RegExp("\\{"+e+"\\}","g"),function(){return n})}),t)},e.extend(e.validator,{defaults:{messages:{},groups:{},rules:{},errorClass:"error",validClass:"valid",errorElement:"label",focusInvalid:!0,errorContainer:e([]),errorLabelContainer:e([]),onsubmit:!0,ignore:":hidden",ignoreTitle:!1,onfocusin:function(e,t){this.lastActive=e,this.settings.focusCleanup&&!this.blockFocusCleanup&&(this.settings.unhighlight&&this.settings.unhighlight.call(this,e,this.settings.errorClass,this.settings.validClass),this.addWrapper(this.errorsFor(e)).hide())},onfocusout:function(e,t){!this.checkable(e)&&(e.name in this.submitted||!this.optional(e))&&this.element(e)},onkeyup:function(e,t){if(t.which===9&&this.elementValue(e)==="")return;(e.name in this.submitted||e===this.lastElement)&&this.element(e)},onclick:function(e,t){e.name in this.submitted?this.element(e):e.parentNode.name in this.submitted&&this.element(e.parentNode)},highlight:function(t,n,r){t.type==="radio"?this.findByName(t.name).addClass(n).removeClass(r):e(t).addClass(n).removeClass(r)},unhighlight:function(t,n,r){t.type==="radio"?this.findByName(t.name).removeClass(n).addClass(r):e(t).removeClass(n).addClass(r)}},setDefaults:function(t){e.extend(e.validator.defaults,t)},messages:{required:"This field is required.",remote:"Please fix this field.",email:"Please enter a valid email address.",url:"Please enter a valid URL.",date:"Please enter a valid date.",dateISO:"Please enter a valid date (ISO).",number:"Please enter a valid number.",digits:"Please enter only digits.",creditcard:"Please enter a valid credit card number.",equalTo:"Please enter the same value again.",maxlength:e.validator.format("Please enter no more than {0} characters."),minlength:e.validator.format("Please enter at least {0} characters."),rangelength:e.validator.format("Please enter a value between {0} and {1} characters long."),range:e.validator.format("Please enter a value between {0} and {1}."),max:e.validator.format("Please enter a value less than or equal to {0}."),min:e.validator.format("Please enter a value greater than or equal to {0}.")},autoCreateRanges:!1,prototype:{init:function(){function r(t){var n=e.data(this[0].form,"validator"),r="on"+t.type.replace(/^validate/,"");n.settings[r]&&n.settings[r].call(n,this[0],t)}this.labelContainer=e(this.settings.errorLabelContainer),this.errorContext=this.labelContainer.length&&this.labelContainer||e(this.currentForm),this.containers=e(this.settings.errorContainer).add(this.settings.errorLabelContainer),this.submitted={},this.valueCache={},this.pendingRequest=0,this.pending={},this.invalid={},this.reset();var t=this.groups={};e.each(this.settings.groups,function(n,r){typeof r=="string"&&(r=r.split(/\s/)),e.each(r,function(e,r){t[r]=n})});var n=this.settings.rules;e.each(n,function(t,r){n[t]=e.validator.normalizeRule(r)}),e(this.currentForm).validateDelegate(":text, [type='password'], [type='file'], select, textarea, [type='number'], [type='search'] ,[type='tel'], [type='url'], [type='email'], [type='datetime'], [type='date'], [type='month'], [type='week'], [type='time'], [type='datetime-local'], [type='range'], [type='color'] ","focusin focusout keyup",r).validateDelegate("[type='radio'], [type='checkbox'], select, option","click",r),this.settings.invalidHandler&&e(this.currentForm).bind("invalid-form.validate",this.settings.invalidHandler)},form:function(){return this.checkForm(),e.extend(this.submitted,this.errorMap),this.invalid=e.extend({},this.errorMap),this.valid()||e(this.currentForm).triggerHandler("invalid-form",[this]),this.showErrors(),this.valid()},checkForm:function(){this.prepareForm();for(var e=0,t=this.currentElements=this.elements();t[e];e++)this.check(t[e]);return this.valid()},element:function(t){t=this.validationTargetFor(this.clean(t)),this.lastElement=t,this.prepareElement(t),this.currentElements=e(t);var n=this.check(t)!==!1;return n?delete this.invalid[t.name]:this.invalid[t.name]=!0,this.numberOfInvalids()||(this.toHide=this.toHide.add(this.containers)),this.showErrors(),n},showErrors:function(t){if(t){e.extend(this.errorMap,t),this.errorList=[];for(var n in t)this.errorList.push({message:t[n],element:this.findByName(n)[0]});this.successList=e.grep(this.successList,function(e){return!(e.name in t)})}this.settings.showErrors?this.settings.showErrors.call(this,this.errorMap,this.errorList):this.defaultShowErrors()},resetForm:function(){e.fn.resetForm&&e(this.currentForm).resetForm(),this.submitted={},this.lastElement=null,this.prepareForm(),this.hideErrors(),this.elements().removeClass(this.settings.errorClass).removeData("previousValue")},numberOfInvalids:function(){return this.objectLength(this.invalid)},objectLength:function(e){var t=0;for(var n in e)t++;return t},hideErrors:function(){this.addWrapper(this.toHide).hide()},valid:function(){return this.size()===0},size:function(){return this.errorList.length},focusInvalid:function(){if(this.settings.focusInvalid)try{e(this.findLastActive()||this.errorList.length&&this.errorList[0].element||[]).filter(":visible").focus().trigger("focusin")}catch(t){}},findLastActive:function(){var t=this.lastActive;return t&&e.grep(this.errorList,function(e){return e.element.name===t.name}).length===1&&t},elements:function(){var t=this,n={};return e(this.currentForm).find("input, select, textarea").not(":submit, :reset, :image, [disabled]").not(this.settings.ignore).filter(function(){return!this.name&&t.settings.debug&&window.console&&console.error("%o has no name assigned",this),this.name in n||!t.objectLength(e(this).rules())?!1:(n[this.name]=!0,!0)})},clean:function(t){return e(t)[0]},errors:function(){var t=this.settings.errorClass.replace(" ",".");return e(this.settings.errorElement+"."+t,this.errorContext)},reset:function(){this.successList=[],this.errorList=[],this.errorMap={},this.toShow=e([]),this.toHide=e([]),this.currentElements=e([])},prepareForm:function(){this.reset(),this.toHide=this.errors().add(this.containers)},prepareElement:function(e){this.reset(),this.toHide=this.errorsFor(e)},elementValue:function(t){var n=e(t).attr("type"),r=e(t).val();return n==="radio"||n==="checkbox"?e("input[name='"+e(t).attr("name")+"']:checked").val():typeof r=="string"?r.replace(/\r/g,""):r},check:function(t){t=this.validationTargetFor(this.clean(t));var n=e(t).rules(),r=!1,i=this.elementValue(t),s;for(var o in n){var u={method:o,parameters:n[o]};try{s=e.validator.methods[o].call(this,i,t,u.parameters);if(s==="dependency-mismatch"){r=!0;continue}r=!1;if(s==="pending"){this.toHide=this.toHide.not(this.errorsFor(t));return}if(!s)return this.formatAndAdd(t,u),!1}catch(a){throw this.settings.debug&&window.console&&console.log("Exception occured when checking element "+t.id+", check the '"+u.method+"' method.",a),a}}if(r)return;return this.objectLength(n)&&this.successList.push(t),!0},customDataMessage:function(t,n){return e(t).data("msg-"+n.toLowerCase())||t.attributes&&e(t).attr("data-msg-"+n.toLowerCase())},customMessage:function(e,t){var n=this.settings.messages[e];return n&&(n.constructor===String?n:n[t])},findDefined:function(){for(var e=0;eDownload Processing. Please consider making a donation to the Processing Foundation before downloading the software.
- -
-
-
\ No newline at end of file
diff --git a/download/_paypalProcessing.php b/download/_paypalProcessing.php
deleted file mode 100644
index 4d0c08ea9..000000000
--- a/download/_paypalProcessing.php
+++ /dev/null
@@ -1,21 +0,0 @@
-doExpressCheckout($amount, 'Donation to the Processing Foundation'));
-
-//An error occured. The auxiliary information is in the $ret array
-
-echo 'Error:';
-
-print_r($ret);
-
-?>
\ No newline at end of file
diff --git a/download/_ppEmailThanks.php b/download/_ppEmailThanks.php
deleted file mode 100644
index d477f43d2..000000000
--- a/download/_ppEmailThanks.php
+++ /dev/null
@@ -1,74 +0,0 @@
-doPayment();
-
-if ($final['ACK'] == 'Success') {
-
- $payment = $r->getCheckoutDetails($final['TOKEN']);
-
- //If payment from PayPal is successful, send out our thankyou email
- $first_name = $payment['FIRSTNAME'];
- $last_name = $payment['LASTNAME'];
- $name = $first_name . ' ' . $last_name;
- $email = $payment['EMAIL'];
- $amount = $payment['CUSTOM'];
- $amount = explode("|", $amount, 2);
- $amount = $amount[0];
- $date = $payment['TIMESTAMP'];
- $date = strtotime($date);
-
- // Build and send the email *using PHPMailer
- $mail = new PHPMailer();
-
- $mail->SMTPDebug = 0; //0 is no debug output, 3 is verbose
-
- $mail->IsSMTP();
- $mail->SMTPAuth = true;
- $mail->SMTPSecure = 'tls';
- $mail->Port = 25;
- $mail->Host = $mailConfig['host'];
- $mail->Username = $mailConfig['user'];
- $mail->Password = $mailConfig['pass'];
-
- $mail->From = 'foundation@processing.org';
- $mail->FromName = 'Processing Foundation';
- $mail->addAddress($email, $name);
- $mail->addBCC('foundation@processing.org');
-
- // Build message from PayPal values. Find and replace from config email
- $message = str_replace('%name%', $name , $config['email-message']) . "\n\n";
- $message .= "Amount: $" . $amount . "$ will be donated to the Processing Foundation
- - - - - -\n"; - $message .= "Email: " . $email . "
\n"; - $message .= "Date: " . date('M j, Y', $date) . "
\n"; - $message .= "Best regards, and thanks again,
Ben Fry, Casey Reas, and Dan Shiffman"; - - $mail->isHTML(true); - $mail->Subject = $config['email-subject']; - $mail->Body = $message; - - $mail->Send(); - - $log = __DIR__ . '/../../../cred/purchases.log'; - $cleanDate = date('Y-m-d', $date); - $data = $cleanDate."\t".$amount."\t".'paypal'."\t".$name."\t".$email."\t".get_client_ip()."\n"; - file_put_contents($log, $data, FILE_APPEND | LOCK_EX); - - -} - -?> \ No newline at end of file diff --git a/download/_selectForm.php b/download/_selectForm.php deleted file mode 100644 index a3ac30aff..000000000 --- a/download/_selectForm.php +++ /dev/null @@ -1,35 +0,0 @@ -
Download Processing. Please consider making a donation to the Processing Foundation before downloading the software.
- - - -
-
-
\ No newline at end of file
diff --git a/download/_stripeProcessing.php b/download/_stripeProcessing.php
deleted file mode 100644
index 67dc7876d..000000000
--- a/download/_stripeProcessing.php
+++ /dev/null
@@ -1,97 +0,0 @@
- $token,
- 'description' => 'Donation by ' . $name . ' (' . $email . ')',
- 'amount' => $amount * 100,
- 'currency' => 'usd')
- );
-
- // Build and send the email *using PHPMailer
- $mail = new PHPMailer();
-
- $mail->SMTPDebug = 0; //0 is no debug output, 3 is verbose
-
- $mail->IsSMTP();
- $mail->SMTPAuth = true;
- $mail->SMTPSecure = 'tls';
- $mail->Port = 25;
- $mail->Host = $mailConfig['host'];
- $mail->Username = $mailConfig['user'];
- $mail->Password = $mailConfig['pass'];
-
- $mail->From = 'foundation@processing.org';
- $mail->FromName = 'Processing Foundation';
- $mail->addAddress($email, $name);
- $mail->addBCC('foundation@processing.org');
-
- // Build message from Stripe values. Find and replace from config email
- $message = str_replace('%name%', $name , $config['email-message']) . "\n\n";
- $message .= "Amount: $" . $amount . "Processing is open source, free software. All donations fund the Processing Foundation, a nonprofit organization devoted to advancing the role of programming within the visual arts through developing Processing.
- - - - - - - - -\n"; - $message .= "Email: " . $email . "
\n"; - $message .= "Date: " . date('M j, Y', $donation['created']) . "
\n"; - $message .= "Transaction ID: " . $donation['id'] . "
\n\n\n"; - $message .= "Best regards, and thanks again,
Ben Fry, Casey Reas, and Dan Shiffman"; - - $mail->isHTML(true); - $mail->Subject = $config['email-subject']; - $mail->Body = $message; - - $mail->Send(); - - $log = __DIR__ . '/../../../cred/purchases.log'; - $cleanDate = date('Y-m-d', $donation['created']); - $data = $cleanDate."\t".$amount."\t".'stripe'."\t".$name."\t".$email."\t".get_client_ip()."\n"; - file_put_contents($log, $data, FILE_APPEND | LOCK_EX); - - - // Forward to "Downloads" page - header('Location: ' . $config['download']); - exit; - - } - catch (Stripe_Error $e) { - $showPaymentForm = true; - $dinky = $e->getJsonBody(); - $dinky = $dinky['error']['message']; - } - catch (Exception $e) { - $error = $e->getMessage(); - } -} - -?> \ No newline at end of file diff --git a/download/index.php b/download/index.php deleted file mode 100755 index 7a84b8df2..000000000 --- a/download/index.php +++ /dev/null @@ -1,160 +0,0 @@ - - - - - -
' . $this->Lang('smtp_error') . $lasterror['smtp_msg'] . "
\n"; - } - } - $this->ErrorInfo = $msg; - } - - /** - * Returns the proper RFC 822 formatted date. - * @access public - * @return string - * @static - */ - public static function RFCDate() { - $tz = date('Z'); - $tzs = ($tz < 0) ? '-' : '+'; - $tz = abs($tz); - $tz = (int)($tz/3600)*100 + ($tz%3600)/60; - $result = sprintf("%s %s%04d", date('D, j M Y H:i:s'), $tzs, $tz); - - return $result; - } - - /** - * Returns the server hostname or 'localhost.localdomain' if unknown. - * @access protected - * @return string - */ - protected function ServerHostname() { - if (!empty($this->Hostname)) { - $result = $this->Hostname; - } elseif (isset($_SERVER['SERVER_NAME'])) { - $result = $_SERVER['SERVER_NAME']; - } else { - $result = 'localhost.localdomain'; - } - - return $result; - } - - /** - * Returns a message in the appropriate language. - * @access protected - * @param string $key - * @return string - */ - protected function Lang($key) { - if(count($this->language) < 1) { - $this->SetLanguage('en'); // set the default language - } - - if(isset($this->language[$key])) { - return $this->language[$key]; - } else { - return 'Language string failed to load: ' . $key; - } - } - - /** - * Returns true if an error occurred. - * @access public - * @return bool - */ - public function IsError() { - return ($this->error_count > 0); - } - - /** - * Changes every end of line from CRLF, CR or LF to $this->LE. - * @access public - * @param string $str String to FixEOL - * @return string - */ - public function FixEOL($str) { - // condense down to \n - $nstr = str_replace(array("\r\n", "\r"), "\n", $str); - // Now convert LE as needed - if ($this->LE !== "\n") { - $nstr = str_replace("\n", $this->LE, $nstr); - } - return $nstr; - } - - /** - * Adds a custom header. $name value can be overloaded to contain - * both header name and value (name:value) - * @access public - * @param string $name custom header name - * @param string $value header value - * @return void - */ - public function AddCustomHeader($name, $value=null) { - if ($value === null) { - // Value passed in as name:value - $this->CustomHeader[] = explode(':', $name, 2); - } else { - $this->CustomHeader[] = array($name, $value); - } - } - - /** - * Evaluates the message and returns modifications for inline images and backgrounds - * Overwrites any existing values in $this->Body and $this->AltBody - * @access public - * @param string $message Text to be HTML modified - * @param string $basedir baseline directory for path - * @return string $message - */ - public function MsgHTML($message, $basedir = '') { - preg_match_all("/(src|background)=[\"'](.*)[\"']/Ui", $message, $images); - if(isset($images[2])) { - foreach($images[2] as $i => $url) { - // do not change urls for absolute images (thanks to corvuscorax) - if (!preg_match('#^[A-z]+://#', $url)) { - $filename = basename($url); - $directory = dirname($url); - if ($directory == '.') { - $directory = ''; - } - $cid = 'cid:' . md5($url); - $ext = pathinfo($filename, PATHINFO_EXTENSION); - $mimeType = self::_mime_types($ext); - if ( strlen($basedir) > 1 && substr($basedir, -1) != '/') { $basedir .= '/'; } - if ( strlen($directory) > 1 && substr($directory, -1) != '/') { $directory .= '/'; } - if ( $this->AddEmbeddedImage($basedir.$directory.$filename, md5($url), $filename, 'base64', $mimeType) ) { - $message = preg_replace("/".$images[1][$i]."=[\"']".preg_quote($url, '/')."[\"']/Ui", $images[1][$i]."=\"".$cid."\"", $message); - } - } - } - } - $this->IsHTML(true); - $this->Body = $message; - $this->AltBody = $this->html2text($message); - if (empty($this->AltBody)) { - $this->AltBody = 'To view this email message, open it in a program that understands HTML!' . "\n\n"; - } - return $message; - } - - /** - * Convert an HTML string into a plain text version - * @param string $html The HTML text to convert - * @return string - */ - public function html2text($html) { - return html_entity_decode(trim(strip_tags(preg_replace('/<(head|title|style|script)[^>]*>.*?<\/\\1>/s', '', $html))), ENT_QUOTES, $this->CharSet); - } - - /** - * Gets the MIME type of the embedded or inline image - * @param string $ext File extension - * @access public - * @return string MIME type of ext - * @static - */ - public static function _mime_types($ext = '') { - $mimes = array( - 'xl' => 'application/excel', - 'hqx' => 'application/mac-binhex40', - 'cpt' => 'application/mac-compactpro', - 'bin' => 'application/macbinary', - 'doc' => 'application/msword', - 'word' => 'application/msword', - 'class' => 'application/octet-stream', - 'dll' => 'application/octet-stream', - 'dms' => 'application/octet-stream', - 'exe' => 'application/octet-stream', - 'lha' => 'application/octet-stream', - 'lzh' => 'application/octet-stream', - 'psd' => 'application/octet-stream', - 'sea' => 'application/octet-stream', - 'so' => 'application/octet-stream', - 'oda' => 'application/oda', - 'pdf' => 'application/pdf', - 'ai' => 'application/postscript', - 'eps' => 'application/postscript', - 'ps' => 'application/postscript', - 'smi' => 'application/smil', - 'smil' => 'application/smil', - 'mif' => 'application/vnd.mif', - 'xls' => 'application/vnd.ms-excel', - 'ppt' => 'application/vnd.ms-powerpoint', - 'wbxml' => 'application/vnd.wap.wbxml', - 'wmlc' => 'application/vnd.wap.wmlc', - 'dcr' => 'application/x-director', - 'dir' => 'application/x-director', - 'dxr' => 'application/x-director', - 'dvi' => 'application/x-dvi', - 'gtar' => 'application/x-gtar', - 'php3' => 'application/x-httpd-php', - 'php4' => 'application/x-httpd-php', - 'php' => 'application/x-httpd-php', - 'phtml' => 'application/x-httpd-php', - 'phps' => 'application/x-httpd-php-source', - 'js' => 'application/x-javascript', - 'swf' => 'application/x-shockwave-flash', - 'sit' => 'application/x-stuffit', - 'tar' => 'application/x-tar', - 'tgz' => 'application/x-tar', - 'xht' => 'application/xhtml+xml', - 'xhtml' => 'application/xhtml+xml', - 'zip' => 'application/zip', - 'mid' => 'audio/midi', - 'midi' => 'audio/midi', - 'mp2' => 'audio/mpeg', - 'mp3' => 'audio/mpeg', - 'mpga' => 'audio/mpeg', - 'aif' => 'audio/x-aiff', - 'aifc' => 'audio/x-aiff', - 'aiff' => 'audio/x-aiff', - 'ram' => 'audio/x-pn-realaudio', - 'rm' => 'audio/x-pn-realaudio', - 'rpm' => 'audio/x-pn-realaudio-plugin', - 'ra' => 'audio/x-realaudio', - 'wav' => 'audio/x-wav', - 'bmp' => 'image/bmp', - 'gif' => 'image/gif', - 'jpeg' => 'image/jpeg', - 'jpe' => 'image/jpeg', - 'jpg' => 'image/jpeg', - 'png' => 'image/png', - 'tiff' => 'image/tiff', - 'tif' => 'image/tiff', - 'eml' => 'message/rfc822', - 'css' => 'text/css', - 'html' => 'text/html', - 'htm' => 'text/html', - 'shtml' => 'text/html', - 'log' => 'text/plain', - 'text' => 'text/plain', - 'txt' => 'text/plain', - 'rtx' => 'text/richtext', - 'rtf' => 'text/rtf', - 'xml' => 'text/xml', - 'xsl' => 'text/xml', - 'mpeg' => 'video/mpeg', - 'mpe' => 'video/mpeg', - 'mpg' => 'video/mpeg', - 'mov' => 'video/quicktime', - 'qt' => 'video/quicktime', - 'rv' => 'video/vnd.rn-realvideo', - 'avi' => 'video/x-msvideo', - 'movie' => 'video/x-sgi-movie' - ); - return (!isset($mimes[strtolower($ext)])) ? 'application/octet-stream' : $mimes[strtolower($ext)]; - } - - /** - * Set (or reset) Class Objects (variables) - * - * Usage Example: - * $page->set('X-Priority', '3'); - * - * @access public - * @param string $name Parameter Name - * @param mixed $value Parameter Value - * NOTE: will not work with arrays, there are no arrays to set/reset - * @throws phpmailerException - * @return bool - * @todo Should this not be using __set() magic function? - */ - public function set($name, $value = '') { - try { - if (isset($this->$name) ) { - $this->$name = $value; - } else { - throw new phpmailerException($this->Lang('variable_set') . $name, self::STOP_CRITICAL); - } - } catch (Exception $e) { - $this->SetError($e->getMessage()); - if ($e->getCode() == self::STOP_CRITICAL) { - return false; - } - } - return true; - } - - /** - * Strips newlines to prevent header injection. - * @access public - * @param string $str String - * @return string - */ - public function SecureHeader($str) { - return trim(str_replace(array("\r", "\n"), '', $str)); - } - - /** - * Set the private key file and password to sign the message. - * - * @access public - * @param $cert_filename - * @param string $key_filename Parameter File Name - * @param string $key_pass Password for private key - */ - public function Sign($cert_filename, $key_filename, $key_pass) { - $this->sign_cert_file = $cert_filename; - $this->sign_key_file = $key_filename; - $this->sign_key_pass = $key_pass; - } - - /** - * Set the private key file and password to sign the message. - * - * @access public - * @param string $txt - * @return string - */ - public function DKIM_QP($txt) { - $line = ''; - for ($i = 0; $i < strlen($txt); $i++) { - $ord = ord($txt[$i]); - if ( ((0x21 <= $ord) && ($ord <= 0x3A)) || $ord == 0x3C || ((0x3E <= $ord) && ($ord <= 0x7E)) ) { - $line .= $txt[$i]; - } else { - $line .= "=".sprintf("%02X", $ord); - } - } - return $line; - } - - /** - * Generate DKIM signature - * - * @access public - * @param string $s Header - * @throws phpmailerException - * @return string - */ - public function DKIM_Sign($s) { - if (!defined('PKCS7_TEXT')) { - if ($this->exceptions) { - throw new phpmailerException($this->Lang("signing").' OpenSSL extension missing.'); - } - return ''; - } - $privKeyStr = file_get_contents($this->DKIM_private); - if ($this->DKIM_passphrase != '') { - $privKey = openssl_pkey_get_private($privKeyStr, $this->DKIM_passphrase); - } else { - $privKey = $privKeyStr; - } - if (openssl_sign($s, $signature, $privKey)) { - return base64_encode($signature); - } - return ''; - } - - /** - * Generate DKIM Canonicalization Header - * - * @access public - * @param string $s Header - * @return string - */ - public function DKIM_HeaderC($s) { - $s = preg_replace("/\r\n\s+/", " ", $s); - $lines = explode("\r\n", $s); - foreach ($lines as $key => $line) { - list($heading, $value) = explode(":", $line, 2); - $heading = strtolower($heading); - $value = preg_replace("/\s+/", " ", $value) ; // Compress useless spaces - $lines[$key] = $heading.":".trim($value) ; // Don't forget to remove WSP around the value - } - $s = implode("\r\n", $lines); - return $s; - } - - /** - * Generate DKIM Canonicalization Body - * - * @access public - * @param string $body Message Body - * @return string - */ - public function DKIM_BodyC($body) { - if ($body == '') return "\r\n"; - // stabilize line endings - $body = str_replace("\r\n", "\n", $body); - $body = str_replace("\n", "\r\n", $body); - // END stabilize line endings - while (substr($body, strlen($body) - 4, 4) == "\r\n\r\n") { - $body = substr($body, 0, strlen($body) - 2); - } - return $body; - } - - /** - * Create the DKIM header, body, as new header - * - * @access public - * @param string $headers_line Header lines - * @param string $subject Subject - * @param string $body Body - * @return string - */ - public function DKIM_Add($headers_line, $subject, $body) { - $DKIMsignatureType = 'rsa-sha1'; // Signature & hash algorithms - $DKIMcanonicalization = 'relaxed/simple'; // Canonicalization of header/body - $DKIMquery = 'dns/txt'; // Query method - $DKIMtime = time() ; // Signature Timestamp = seconds since 00:00:00 - Jan 1, 1970 (UTC time zone) - $subject_header = "Subject: $subject"; - $headers = explode($this->LE, $headers_line); - $from_header = ""; - $to_header = ""; - foreach($headers as $header) { - if (strpos($header, 'From:') === 0) { - $from_header = $header; - } elseif (strpos($header, 'To:') === 0) { - $to_header = $header; - } - } - $from = str_replace('|', '=7C', $this->DKIM_QP($from_header)); - $to = str_replace('|', '=7C', $this->DKIM_QP($to_header)); - $subject = str_replace('|', '=7C', $this->DKIM_QP($subject_header)) ; // Copied header fields (dkim-quoted-printable - $body = $this->DKIM_BodyC($body); - $DKIMlen = strlen($body) ; // Length of body - $DKIMb64 = base64_encode(pack("H*", sha1($body))) ; // Base64 of packed binary SHA-1 hash of body - $ident = ($this->DKIM_identity == '')? '' : " i=" . $this->DKIM_identity . ";"; - $dkimhdrs = "DKIM-Signature: v=1; a=" . $DKIMsignatureType . "; q=" . $DKIMquery . "; l=" . $DKIMlen . "; s=" . $this->DKIM_selector . ";\r\n". - "\tt=" . $DKIMtime . "; c=" . $DKIMcanonicalization . ";\r\n". - "\th=From:To:Subject;\r\n". - "\td=" . $this->DKIM_domain . ";" . $ident . "\r\n". - "\tz=$from\r\n". - "\t|$to\r\n". - "\t|$subject;\r\n". - "\tbh=" . $DKIMb64 . ";\r\n". - "\tb="; - $toSign = $this->DKIM_HeaderC($from_header . "\r\n" . $to_header . "\r\n" . $subject_header . "\r\n" . $dkimhdrs); - $signed = $this->DKIM_Sign($toSign); - return "X-PHPMAILER-DKIM: code.google.com/a/apache-extras.org/p/phpmailer/\r\n".$dkimhdrs.$signed."\r\n"; - } - - /** - * Perform callback - * @param boolean $isSent - * @param string $to - * @param string $cc - * @param string $bcc - * @param string $subject - * @param string $body - * @param string $from - */ - protected function doCallback($isSent, $to, $cc, $bcc, $subject, $body, $from = null) { - if (!empty($this->action_function) && is_callable($this->action_function)) { - $params = array($isSent, $to, $cc, $bcc, $subject, $body, $from); - call_user_func_array($this->action_function, $params); - } - } -} - -/** - * Exception handler for PHPMailer - * @package PHPMailer - */ -class phpmailerException extends Exception { - /** - * Prettify error message output - * @return string - */ - public function errorMessage() { - $errorMsg = '' . $this->getMessage() . "\n"; - return $errorMsg; - } -} diff --git a/download/phpmailer/class.pop3.php b/download/phpmailer/class.pop3.php deleted file mode 100755 index d4082a0d7..000000000 --- a/download/phpmailer/class.pop3.php +++ /dev/null @@ -1,417 +0,0 @@ - - * @author Andy Prevost - * @author Jim Jagielski - */ - -class POP3 { - /** - * Default POP3 port - * @var int - */ - public $POP3_PORT = 110; - - /** - * Default Timeout - * @var int - */ - public $POP3_TIMEOUT = 30; - - /** - * POP3 Carriage Return + Line Feed - * @var string - */ - public $CRLF = "\r\n"; - - /** - * Displaying Debug warnings? (0 = now, 1+ = yes) - * @var int - */ - public $do_debug = 2; - - /** - * POP3 Mail Server - * @var string - */ - public $host; - - /** - * POP3 Port - * @var int - */ - public $port; - - /** - * POP3 Timeout Value - * @var int - */ - public $tval; - - /** - * POP3 Username - * @var string - */ - public $username; - - /** - * POP3 Password - * @var string - */ - public $password; - - /** - * Sets the POP3 PHPMailer Version number - * @var string - */ - public $Version = '5.2.4'; - - ///////////////////////////////////////////////// - // PROPERTIES, PRIVATE AND PROTECTED - ///////////////////////////////////////////////// - - /** - * @var resource Resource handle for the POP connection socket - */ - private $pop_conn; - /** - * @var boolean Are we connected? - */ - private $connected; - /** - * @var array Error container - */ - private $error; // Error log array - - /** - * Constructor, sets the initial values - * @access public - * @return POP3 - */ - public function __construct() { - $this->pop_conn = 0; - $this->connected = false; - $this->error = null; - } - - /** - * Combination of public events - connect, login, disconnect - * @access public - * @param string $host - * @param bool|int $port - * @param bool|int $tval - * @param string $username - * @param string $password - * @param int $debug_level - * @return bool - */ - public function Authorise ($host, $port = false, $tval = false, $username, $password, $debug_level = 0) { - $this->host = $host; - - // If no port value is passed, retrieve it - if ($port == false) { - $this->port = $this->POP3_PORT; - } else { - $this->port = $port; - } - - // If no port value is passed, retrieve it - if ($tval == false) { - $this->tval = $this->POP3_TIMEOUT; - } else { - $this->tval = $tval; - } - - $this->do_debug = $debug_level; - $this->username = $username; - $this->password = $password; - - // Refresh the error log - $this->error = null; - - // Connect - $result = $this->Connect($this->host, $this->port, $this->tval); - - if ($result) { - $login_result = $this->Login($this->username, $this->password); - - if ($login_result) { - $this->Disconnect(); - - return true; - } - - } - - // We need to disconnect regardless if the login succeeded - $this->Disconnect(); - - return false; - } - - /** - * Connect to the POP3 server - * @access public - * @param string $host - * @param bool|int $port - * @param integer $tval - * @return boolean - */ - public function Connect ($host, $port = false, $tval = 30) { - // Are we already connected? - if ($this->connected) { - return true; - } - - /* - On Windows this will raise a PHP Warning error if the hostname doesn't exist. - Rather than supress it with @fsockopen, let's capture it cleanly instead - */ - - set_error_handler(array(&$this, 'catchWarning')); - - // Connect to the POP3 server - $this->pop_conn = fsockopen($host, // POP3 Host - $port, // Port # - $errno, // Error Number - $errstr, // Error Message - $tval); // Timeout (seconds) - - // Restore the error handler - restore_error_handler(); - - // Does the Error Log now contain anything? - if ($this->error && $this->do_debug >= 1) { - $this->displayErrors(); - } - - // Did we connect? - if ($this->pop_conn == false) { - // It would appear not... - $this->error = array( - 'error' => "Failed to connect to server $host on port $port", - 'errno' => $errno, - 'errstr' => $errstr - ); - - if ($this->do_debug >= 1) { - $this->displayErrors(); - } - - return false; - } - - // Increase the stream time-out - - // Check for PHP 4.3.0 or later - if (version_compare(phpversion(), '5.0.0', 'ge')) { - stream_set_timeout($this->pop_conn, $tval, 0); - } else { - // Does not work on Windows - if (substr(PHP_OS, 0, 3) !== 'WIN') { - socket_set_timeout($this->pop_conn, $tval, 0); - } - } - - // Get the POP3 server response - $pop3_response = $this->getResponse(); - - // Check for the +OK - if ($this->checkResponse($pop3_response)) { - // The connection is established and the POP3 server is talking - $this->connected = true; - return true; - } - return false; - } - - /** - * Login to the POP3 server (does not support APOP yet) - * @access public - * @param string $username - * @param string $password - * @return boolean - */ - public function Login ($username = '', $password = '') { - if ($this->connected == false) { - $this->error = 'Not connected to POP3 server'; - - if ($this->do_debug >= 1) { - $this->displayErrors(); - } - } - - if (empty($username)) { - $username = $this->username; - } - - if (empty($password)) { - $password = $this->password; - } - - $pop_username = "USER $username" . $this->CRLF; - $pop_password = "PASS $password" . $this->CRLF; - - // Send the Username - $this->sendString($pop_username); - $pop3_response = $this->getResponse(); - - if ($this->checkResponse($pop3_response)) { - // Send the Password - $this->sendString($pop_password); - $pop3_response = $this->getResponse(); - - if ($this->checkResponse($pop3_response)) { - return true; - } - } - return false; - } - - /** - * Disconnect from the POP3 server - * @access public - */ - public function Disconnect () { - $this->sendString('QUIT'); - - fclose($this->pop_conn); - } - - ///////////////////////////////////////////////// - // Private Methods - ///////////////////////////////////////////////// - - /** - * Get the socket response back. - * $size is the maximum number of bytes to retrieve - * @access private - * @param integer $size - * @return string - */ - private function getResponse ($size = 128) { - $pop3_response = fgets($this->pop_conn, $size); - - return $pop3_response; - } - - /** - * Send a string down the open socket connection to the POP3 server - * @access private - * @param string $string - * @return integer - */ - private function sendString ($string) { - $bytes_sent = fwrite($this->pop_conn, $string, strlen($string)); - - return $bytes_sent; - } - - /** - * Checks the POP3 server response for +OK or -ERR - * @access private - * @param string $string - * @return boolean - */ - private function checkResponse ($string) { - if (substr($string, 0, 3) !== '+OK') { - $this->error = array( - 'error' => "Server reported an error: $string", - 'errno' => 0, - 'errstr' => '' - ); - - if ($this->do_debug >= 1) { - $this->displayErrors(); - } - - return false; - } else { - return true; - } - - } - - /** - * If debug is enabled, display the error message array - * @access private - */ - private function displayErrors () { - echo '
';
-
- foreach ($this->error as $single_error) {
- print_r($single_error);
- }
-
- echo '';
- }
-
- /**
- * Takes over from PHP for the socket warning handler
- * @access private
- * @param integer $errno
- * @param string $errstr
- * @param string $errfile
- * @param integer $errline
- */
- private function catchWarning ($errno, $errstr, $errfile, $errline) {
- $this->error[] = array(
- 'error' => "Connecting to the POP3 server raised a PHP warning: ",
- 'errno' => $errno,
- 'errstr' => $errstr
- );
- }
-
- // End of class
-}
diff --git a/download/phpmailer/class.smtp.php b/download/phpmailer/class.smtp.php
deleted file mode 100755
index f0e4062ec..000000000
--- a/download/phpmailer/class.smtp.php
+++ /dev/null
@@ -1,1087 +0,0 @@
-Debugoutput == 'error_log') {
- error_log($str);
- } else {
- echo $str;
- }
- }
-
- /**
- * Initialize the class so that the data is in a known state.
- * @access public
- * @return SMTP
- */
- public function __construct() {
- $this->smtp_conn = 0;
- $this->error = null;
- $this->helo_rply = null;
-
- $this->do_debug = 0;
- }
-
- /////////////////////////////////////////////////
- // CONNECTION FUNCTIONS
- /////////////////////////////////////////////////
-
- /**
- * Connect to the server specified on the port specified.
- * If the port is not specified use the default SMTP_PORT.
- * If tval is specified then a connection will try and be
- * established with the server for that number of seconds.
- * If tval is not specified the default is 30 seconds to
- * try on the connection.
- *
- * SMTP CODE SUCCESS: 220
- * SMTP CODE FAILURE: 421
- * @access public
- * @param string $host
- * @param int $port
- * @param int $tval
- * @return bool
- */
- public function Connect($host, $port = 0, $tval = 30) {
- // set the error val to null so there is no confusion
- $this->error = null;
-
- // make sure we are __not__ connected
- if($this->connected()) {
- // already connected, generate error
- $this->error = array('error' => 'Already connected to a server');
- return false;
- }
-
- if(empty($port)) {
- $port = $this->SMTP_PORT;
- }
-
- // connect to the smtp server
- $this->smtp_conn = @fsockopen($host, // the host of the server
- $port, // the port to use
- $errno, // error number if any
- $errstr, // error message if any
- $tval); // give up after ? secs
- // verify we connected properly
- if(empty($this->smtp_conn)) {
- $this->error = array('error' => 'Failed to connect to server',
- 'errno' => $errno,
- 'errstr' => $errstr);
- if($this->do_debug >= 1) {
- $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ": $errstr ($errno)" . $this->CRLF . ''); - } - return false; - } - - // SMTP server can take longer to respond, give longer timeout for first read - // Windows does not have support for this timeout function - if(substr(PHP_OS, 0, 3) != 'WIN') { - $max = ini_get('max_execution_time'); - if ($max != 0 && $tval > $max) { // don't bother if unlimited - @set_time_limit($tval); - } - stream_set_timeout($this->smtp_conn, $tval, 0); - } - - // get any announcement - $announce = $this->get_lines(); - - if($this->do_debug >= 2) { - $this->edebug('SMTP -> FROM SERVER:' . $announce . $this->CRLF . '
'); - } - - return true; - } - - /** - * Initiate a TLS communication with the server. - * - * SMTP CODE 220 Ready to start TLS - * SMTP CODE 501 Syntax error (no parameters allowed) - * SMTP CODE 454 TLS not available due to temporary reason - * @access public - * @return bool success - */ - public function StartTLS() { - $this->error = null; # to avoid confusion - - if(!$this->connected()) { - $this->error = array('error' => 'Called StartTLS() without being connected'); - return false; - } - - $this->client_send('STARTTLS' . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($this->do_debug >= 2) { - $this->edebug('SMTP -> FROM SERVER:' . $rply . $this->CRLF . '
'); - } - - if($code != 220) { - $this->error = - array('error' => 'STARTTLS not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - - // Begin encrypted connection - if(!stream_socket_enable_crypto($this->smtp_conn, true, STREAM_CRYPTO_METHOD_TLS_CLIENT)) { - return false; - } - - return true; - } - - /** - * Performs SMTP authentication. Must be run after running the - * Hello() method. Returns true if successfully authenticated. - * @access public - * @param string $username - * @param string $password - * @param string $authtype - * @param string $realm - * @param string $workstation - * @return bool - */ - public function Authenticate($username, $password, $authtype='LOGIN', $realm='', $workstation='') { - if (empty($authtype)) { - $authtype = 'LOGIN'; - } - - switch ($authtype) { - case 'PLAIN': - // Start authentication - $this->client_send('AUTH PLAIN' . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($code != 334) { - $this->error = - array('error' => 'AUTH not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - // Send encoded username and password - $this->client_send(base64_encode("\0".$username."\0".$password) . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($code != 235) { - $this->error = - array('error' => 'Authentication not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - break; - case 'LOGIN': - // Start authentication - $this->client_send('AUTH LOGIN' . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($code != 334) { - $this->error = - array('error' => 'AUTH not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - - // Send encoded username - $this->client_send(base64_encode($username) . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($code != 334) { - $this->error = - array('error' => 'Username not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - - // Send encoded password - $this->client_send(base64_encode($password) . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($code != 235) { - $this->error = - array('error' => 'Password not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - break; - case 'NTLM': - /* - * ntlm_sasl_client.php - ** Bundled with Permission - ** - ** How to telnet in windows: http://technet.microsoft.com/en-us/library/aa995718%28EXCHG.65%29.aspx - ** PROTOCOL Documentation http://curl.haxx.se/rfc/ntlm.html#ntlmSmtpAuthentication - */ - require_once 'extras/ntlm_sasl_client.php'; - $temp = new stdClass(); - $ntlm_client = new ntlm_sasl_client_class; - if(! $ntlm_client->Initialize($temp)){//let's test if every function its available - $this->error = array('error' => $temp->error); - if($this->do_debug >= 1) { - $this->edebug('You need to enable some modules in your php.ini file: ' . $this->error['error'] . $this->CRLF); - } - return false; - } - $msg1 = $ntlm_client->TypeMsg1($realm, $workstation);//msg1 - - $this->client_send('AUTH NTLM ' . base64_encode($msg1) . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - - if($code != 334) { - $this->error = - array('error' => 'AUTH not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF); - } - return false; - } - - $challenge = substr($rply, 3);//though 0 based, there is a white space after the 3 digit number....//msg2 - $challenge = base64_decode($challenge); - $ntlm_res = $ntlm_client->NTLMResponse(substr($challenge, 24, 8), $password); - $msg3 = $ntlm_client->TypeMsg3($ntlm_res, $username, $realm, $workstation);//msg3 - // Send encoded username - $this->client_send(base64_encode($msg3) . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($code != 235) { - $this->error = - array('error' => 'Could not authenticate', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF); - } - return false; - } - break; - case 'CRAM-MD5': - // Start authentication - $this->client_send('AUTH CRAM-MD5' . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($code != 334) { - $this->error = - array('error' => 'AUTH not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - - // Get the challenge - $challenge = base64_decode(substr($rply, 4)); - - // Build the response - $response = $username . ' ' . $this->hmac($challenge, $password); - - // Send encoded credentials - $this->client_send(base64_encode($response) . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($code != 334) { - $this->error = - array('error' => 'Credentials not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - break; - } - return true; - } - - /** - * Works like hash_hmac('md5', $data, $key) in case that function is not available - * @access private - * @param string $data - * @param string $key - * @return string - */ - private function hmac($data, $key) { - if (function_exists('hash_hmac')) { - return hash_hmac('md5', $data, $key); - } - - // The following borrowed from http://php.net/manual/en/function.mhash.php#27225 - - // RFC 2104 HMAC implementation for php. - // Creates an md5 HMAC. - // Eliminates the need to install mhash to compute a HMAC - // Hacked by Lance Rushing - - $b = 64; // byte length for md5 - if (strlen($key) > $b) { - $key = pack('H*', md5($key)); - } - $key = str_pad($key, $b, chr(0x00)); - $ipad = str_pad('', $b, chr(0x36)); - $opad = str_pad('', $b, chr(0x5c)); - $k_ipad = $key ^ $ipad ; - $k_opad = $key ^ $opad; - - return md5($k_opad . pack('H*', md5($k_ipad . $data))); - } - - /** - * Returns true if connected to a server otherwise false - * @access public - * @return bool - */ - public function Connected() { - if(!empty($this->smtp_conn)) { - $sock_status = stream_get_meta_data($this->smtp_conn); - if($sock_status['eof']) { - // the socket is valid but we are not connected - if($this->do_debug >= 1) { - $this->edebug('SMTP -> NOTICE:' . $this->CRLF . 'EOF caught while checking if connected'); - } - $this->Close(); - return false; - } - return true; // everything looks good - } - return false; - } - - /** - * Closes the socket and cleans up the state of the class. - * It is not considered good to use this function without - * first trying to use QUIT. - * @access public - * @return void - */ - public function Close() { - $this->error = null; // so there is no confusion - $this->helo_rply = null; - if(!empty($this->smtp_conn)) { - // close the connection and cleanup - fclose($this->smtp_conn); - $this->smtp_conn = 0; - } - } - - ///////////////////////////////////////////////// - // SMTP COMMANDS - ///////////////////////////////////////////////// - - /** - * Issues a data command and sends the msg_data to the server - * finializing the mail transaction. $msg_data is the message - * that is to be send with the headers. Each header needs to be - * on a single line followed by a
'); - } - - if($code != 354) { - $this->error = - array('error' => 'DATA command not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - - /* the server is ready to accept data! - * according to rfc 821 we should not send more than 1000 - * including the CRLF - * characters on a single line so we will break the data up - * into lines by \r and/or \n then if needed we will break - * each of those into smaller lines to fit within the limit. - * in addition we will be looking for lines that start with - * a period '.' and append and additional period '.' to that - * line. NOTE: this does not count towards limit. - */ - - // normalize the line breaks so we know the explode works - $msg_data = str_replace("\r\n", "\n", $msg_data); - $msg_data = str_replace("\r", "\n", $msg_data); - $lines = explode("\n", $msg_data); - - /* we need to find a good way to determine is headers are - * in the msg_data or if it is a straight msg body - * currently I am assuming rfc 822 definitions of msg headers - * and if the first field of the first line (':' sperated) - * does not contain a space then it _should_ be a header - * and we can process all lines before a blank "" line as - * headers. - */ - - $field = substr($lines[0], 0, strpos($lines[0], ':')); - $in_headers = false; - if(!empty($field) && !strstr($field, ' ')) { - $in_headers = true; - } - - $max_line_length = 998; // used below; set here for ease in change - - while(list(, $line) = @each($lines)) { - $lines_out = null; - if($line == '' && $in_headers) { - $in_headers = false; - } - // ok we need to break this line up into several smaller lines - while(strlen($line) > $max_line_length) { - $pos = strrpos(substr($line, 0, $max_line_length), ' '); - - // Patch to fix DOS attack - if(!$pos) { - $pos = $max_line_length - 1; - $lines_out[] = substr($line, 0, $pos); - $line = substr($line, $pos); - } else { - $lines_out[] = substr($line, 0, $pos); - $line = substr($line, $pos + 1); - } - - /* if processing headers add a LWSP-char to the front of new line - * rfc 822 on long msg headers - */ - if($in_headers) { - $line = "\t" . $line; - } - } - $lines_out[] = $line; - - // send the lines to the server - while(list(, $line_out) = @each($lines_out)) { - if(strlen($line_out) > 0) - { - if(substr($line_out, 0, 1) == '.') { - $line_out = '.' . $line_out; - } - } - $this->client_send($line_out . $this->CRLF); - } - } - - // message data has been sent - $this->client_send($this->CRLF . '.' . $this->CRLF); - - $rply = $this->get_lines(); - $code = substr($rply, 0, 3); - - if($this->do_debug >= 2) { - $this->edebug('SMTP -> FROM SERVER:' . $rply . $this->CRLF . '
'); - } - - if($code != 250) { - $this->error = - array('error' => 'DATA not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - return true; - } - - /** - * Sends the HELO command to the smtp server. - * This makes sure that we and the server are in - * the same known state. - * - * Implements from rfc 821: HELO
'); - } - - if($code != 250) { - $this->error = - array('error' => $hello . ' not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - - $this->helo_rply = $rply; - - return true; - } - - /** - * Starts a mail transaction from the email address specified in - * $from. Returns true if successful or false otherwise. If True - * the mail transaction is started and then one or more Recipient - * commands may be called followed by a Data command. - * - * Implements rfc 821: MAIL
'); - } - - if($code != 250) { - $this->error = - array('error' => 'MAIL not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - return true; - } - - /** - * Sends the quit command to the server and then closes the socket - * if there is no error or the $close_on_error argument is true. - * - * Implements from rfc 821: QUIT
'); - } - - $rval = true; - $e = null; - - $code = substr($byemsg, 0, 3); - if($code != 221) { - // use e as a tmp var cause Close will overwrite $this->error - $e = array('error' => 'SMTP server rejected quit command', - 'smtp_code' => $code, - 'smtp_rply' => substr($byemsg, 4)); - $rval = false; - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $e['error'] . ': ' . $byemsg . $this->CRLF . '
'); - } - } - - if(empty($e) || $close_on_error) { - $this->Close(); - } - - return $rval; - } - - /** - * Sends the command RCPT to the SMTP server with the TO: argument of $to. - * Returns true if the recipient was accepted false if it was rejected. - * - * Implements from rfc 821: RCPT
'); - } - - if($code != 250 && $code != 251) { - $this->error = - array('error' => 'RCPT not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - return true; - } - - /** - * Sends the RSET command to abort and transaction that is - * currently in progress. Returns true if successful false - * otherwise. - * - * Implements rfc 821: RSET
'); - } - - if($code != 250) { - $this->error = - array('error' => 'RSET failed', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - - return true; - } - - /** - * Starts a mail transaction from the email address specified in - * $from. Returns true if successful or false otherwise. If True - * the mail transaction is started and then one or more Recipient - * commands may be called followed by a Data command. This command - * will send the message to the users terminal if they are logged - * in and send them an email. - * - * Implements rfc 821: SAML
'); - } - - if($code != 250) { - $this->error = - array('error' => 'SAML not accepted from server', - 'smtp_code' => $code, - 'smtp_msg' => substr($rply, 4)); - if($this->do_debug >= 1) { - $this->edebug('SMTP -> ERROR: ' . $this->error['error'] . ': ' . $rply . $this->CRLF . '
'); - } - return false; - } - return true; - } - - /** - * This is an optional command for SMTP that this class does not - * support. This method is here to make the RFC821 Definition - * complete for this class and __may__ be implimented in the future - * - * Implements from rfc 821: TURN
'); - } - return false; - } - - /** - * Sends data to the server - * @param string $data - * @access public - * @return Integer number of bytes sent to the server or FALSE on error - */ - public function client_send($data) { - if ($this->do_debug >= 1) { - $this->edebug("CLIENT -> SMTP: $data" . $this->CRLF . '
'); - } - return fwrite($this->smtp_conn, $data); - } - - /** - * Get the current error - * @access public - * @return array - */ - public function getError() { - return $this->error; - } - - ///////////////////////////////////////////////// - // INTERNAL FUNCTIONS - ///////////////////////////////////////////////// - - /** - * Read in as many lines as possible - * either before eof or socket timeout occurs on the operation. - * With SMTP we can tell if we have more lines to read if the - * 4th character is '-' symbol. If it is a space then we don't - * need to read anything else. - * @access private - * @return string - */ - private function get_lines() { - $data = ''; - $endtime = 0; - /* If for some reason the fp is bad, don't inf loop */ - if (!is_resource($this->smtp_conn)) { - return $data; - } - stream_set_timeout($this->smtp_conn, $this->Timeout); - if ($this->Timelimit > 0) { - $endtime = time() + $this->Timelimit; - } - while(is_resource($this->smtp_conn) && !feof($this->smtp_conn)) { - $str = @fgets($this->smtp_conn, 515); - if($this->do_debug >= 4) { - $this->edebug("SMTP -> get_lines(): \$data was \"$data\"" . $this->CRLF . '
'); - $this->edebug("SMTP -> get_lines(): \$str is \"$str\"" . $this->CRLF . '
'); - } - $data .= $str; - if($this->do_debug >= 4) { - $this->edebug("SMTP -> get_lines(): \$data is \"$data\"" . $this->CRLF . '
'); - } - // if 4th character is a space, we are done reading, break the loop - if(substr($str, 3, 1) == ' ') { break; } - // Timed-out? Log and break - $info = stream_get_meta_data($this->smtp_conn); - if ($info['timed_out']) { - if($this->do_debug >= 4) { - $this->edebug('SMTP -> get_lines(): timed-out (' . $this->Timeout . ' seconds)
'); - } - break; - } - // Now check if reads took too long - if ($endtime) { - if (time() > $endtime) { - if($this->do_debug >= 4) { - $this->edebug('SMTP -> get_lines(): timelimit reached (' . $this->Timelimit . ' seconds)
'); - } - break; - } - } - } - return $data; - } - -} diff --git a/download/phpmailer529/.gitignore b/download/phpmailer529/.gitignore deleted file mode 100755 index 989164d65..000000000 --- a/download/phpmailer529/.gitignore +++ /dev/null @@ -1,5 +0,0 @@ -docs/phpdoc/ -test/message.txt -test/testbootstrap.php -.idea -build/ diff --git a/download/phpmailer529/.scrutinizer.yml b/download/phpmailer529/.scrutinizer.yml deleted file mode 100755 index be706aeeb..000000000 --- a/download/phpmailer529/.scrutinizer.yml +++ /dev/null @@ -1,143 +0,0 @@ -before_commands: - - "composer install --prefer-source" - -tools: - # Code Coverage - external_code_coverage: - enabled: true - timeout: 300 - filter: - excluded_paths: - - 'docs/*' - - 'examples/*' - - 'extras/*' - - 'test/*' - - 'vendor/*' - - - php_code_coverage: - enabled: false - test_command: phpunit - filter: - excluded_paths: - - 'docs/*' - - 'examples/*' - - 'extras/*' - - 'test/*' - - 'vendor/*' - - - # Code Sniffer - php_code_sniffer: - enabled: true - command: phpcs - config: - standard: PSR2 - sniffs: - generic: - files: - one_class_per_file_sniff: false - filter: - excluded_paths: - - 'docs/*' - - 'examples/*' - - 'extras/*' - - 'test/*' - - 'vendor/*' - - - # Copy/Paste Detector - php_cpd: - enabled: true - command: phpcpd - excluded_dirs: - - docs - - examples - - extras - - test - - vendor - - - # PHP CS Fixer (http://http://cs.sensiolabs.org/). - php_cs_fixer: - enabled: true - command: php-cs-fixer - config: - level: psr2 - filter: - excluded_paths: - - 'docs/*' - - 'examples/*' - - 'extras/*' - - 'test/*' - - 'vendor/*' - - - # Analyzes the size and structure of a PHP project. - php_loc: - enabled: true - command: phploc - excluded_dirs: - - docs - - examples - - extras - - test - - vendor - - - # PHP Mess Detector (http://phpmd.org). - php_mess_detector: - enabled: true - command: phpmd - config: - rulesets: - - codesize - - unusedcode - - naming - - design - naming_rules: - short_variable: { minimum: 2 } - filter: - excluded_paths: - - 'docs/*' - - 'examples/*' - - 'extras/*' - - 'test/*' - - 'vendor/*' - - # Analyzes the size and structure of a PHP project. - php_pdepend: - enabled: true - command: pdepend - excluded_dirs: - - docs - - examples - - extras - - test - - vendor - - # Runs Scrutinizer's PHP Analyzer Tool - # https://scrutinizer-ci.com/docs/tools/php/php-analyzer/config_reference - php_analyzer: - enabled: true - config: - checkstyle: - enabled: true - naming: - enabled: true - property_name: ^[_a-zA-Z][a-zA-Z0-9_]*$ #Allow underscores & caps - method_name: ^(?:[_a-zA-Z]|__)[a-zA-Z0-9_]*$ #Allow underscores & caps - parameter_name: ^[a-z][a-zA-Z0-9_]*$ # Allow underscores - local_variable: ^[a-zA-Z][a-zA-Z0-9_]*$ #Allow underscores & caps - exception_name: ^[a-zA-Z][a-zA-Z0-9]*Exception$ - isser_method_name: ^(?:[_a-zA-Z]|__)[a-zA-Z0-9]*$ #Allow underscores & caps - filter: - excluded_paths: - - 'docs/*' - - 'examples/*' - - 'extras/*' - - 'test/*' - - 'vendor/*' - - # Security Advisory Checker - sensiolabs_security_checker: true diff --git a/download/phpmailer529/.travis.yml b/download/phpmailer529/.travis.yml deleted file mode 100755 index c49dd2182..000000000 --- a/download/phpmailer529/.travis.yml +++ /dev/null @@ -1,33 +0,0 @@ -language: php -php: - - 5.6 - - 5.5 - - 5.4 - - 5.3 - - hhvm - -matrix: - allow_failures: - - php: hhvm - -before_install: - - sudo apt-get update -qq - - sudo apt-get install -y -qq postfix -before_script: - - sudo service postfix stop - - smtp-sink -d "%d.%H.%M.%S" localhost:2500 1000 & - - mkdir -p build/logs - - cd test - - cp testbootstrap-dist.php testbootstrap.php - - chmod +x fakesendmail.sh - - sudo mkdir -p /var/qmail/bin - - sudo cp fakesendmail.sh /var/qmail/bin/sendmail - - sudo cp fakesendmail.sh /usr/sbin/sendmail - - echo 'sendmail_path = "/usr/sbin/sendmail -t -i "' | sudo tee "/home/travis/.phpenv/versions/`php -r 'echo PHP_VERSION;'`/etc/conf.d/sendmail.ini" - - pwd - - ls -al -script: - - phpunit --configuration ../travis.phpunit.xml.dist -after_script: - - wget https://scrutinizer-ci.com/ocular.phar - - php ocular.phar code-coverage:upload --format=php-clover ../build/logs/clover.xml diff --git a/download/phpmailer529/LICENSE b/download/phpmailer529/LICENSE deleted file mode 100755 index 8e0763d1c..000000000 --- a/download/phpmailer529/LICENSE +++ /dev/null @@ -1,504 +0,0 @@ - GNU LESSER GENERAL PUBLIC LICENSE - Version 2.1, February 1999 - - Copyright (C) 1991, 1999 Free Software Foundation, Inc. - 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA - Everyone is permitted to copy and distribute verbatim copies - of this license document, but changing it is not allowed. - -[This is the first released version of the Lesser GPL. It also counts - as the successor of the GNU Library Public License, version 2, hence - the version number 2.1.] - - Preamble - - The licenses for most software are designed to take away your -freedom to share and change it. By contrast, the GNU General Public -Licenses are intended to guarantee your freedom to share and change -free software--to make sure the software is free for all its users. - - This license, the Lesser General Public License, applies to some -specially designated software packages--typically libraries--of the -Free Software Foundation and other authors who decide to use it. You -can use it too, but we suggest you first think carefully about whether -this license or the ordinary General Public License is the better -strategy to use in any particular case, based on the explanations below. - - When we speak of free software, we are referring to freedom of use, -not price. Our General Public Licenses are designed to make sure that -you have the freedom to distribute copies of free software (and charge -for this service if you wish); that you receive source code or can get -it if you want it; that you can change the software and use pieces of -it in new free programs; and that you are informed that you can do -these things. - - To protect your rights, we need to make restrictions that forbid -distributors to deny you these rights or to ask you to surrender these -rights. These restrictions translate to certain responsibilities for -you if you distribute copies of the library or if you modify it. - - For example, if you distribute copies of the library, whether gratis -or for a fee, you must give the recipients all the rights that we gave -you. You must make sure that they, too, receive or can get the source -code. If you link other code with the library, you must provide -complete object files to the recipients, so that they can relink them -with the library after making changes to the library and recompiling -it. And you must show them these terms so they know their rights. - - We protect your rights with a two-step method: (1) we copyright the -library, and (2) we offer you this license, which gives you legal -permission to copy, distribute and/or modify the library. - - To protect each distributor, we want to make it very clear that -there is no warranty for the free library. Also, if the library is -modified by someone else and passed on, the recipients should know -that what they have is not the original version, so that the original -author's reputation will not be affected by problems that might be -introduced by others. - - Finally, software patents pose a constant threat to the existence of -any free program. We wish to make sure that a company cannot -effectively restrict the users of a free program by obtaining a -restrictive license from a patent holder. Therefore, we insist that -any patent license obtained for a version of the library must be -consistent with the full freedom of use specified in this license. - - Most GNU software, including some libraries, is covered by the -ordinary GNU General Public License. This license, the GNU Lesser -General Public License, applies to certain designated libraries, and -is quite different from the ordinary General Public License. We use -this license for certain libraries in order to permit linking those -libraries into non-free programs. - - When a program is linked with a library, whether statically or using -a shared library, the combination of the two is legally speaking a -combined work, a derivative of the original library. The ordinary -General Public License therefore permits such linking only if the -entire combination fits its criteria of freedom. The Lesser General -Public License permits more lax criteria for linking other code with -the library. - - We call this license the "Lesser" General Public License because it -does Less to protect the user's freedom than the ordinary General -Public License. It also provides other free software developers Less -of an advantage over competing non-free programs. These disadvantages -are the reason we use the ordinary General Public License for many -libraries. However, the Lesser license provides advantages in certain -special circumstances. - - For example, on rare occasions, there may be a special need to -encourage the widest possible use of a certain library, so that it becomes -a de-facto standard. To achieve this, non-free programs must be -allowed to use the library. A more frequent case is that a free -library does the same job as widely used non-free libraries. In this -case, there is little to gain by limiting the free library to free -software only, so we use the Lesser General Public License. - - In other cases, permission to use a particular library in non-free -programs enables a greater number of people to use a large body of -free software. For example, permission to use the GNU C Library in -non-free programs enables many more people to use the whole GNU -operating system, as well as its variant, the GNU/Linux operating -system. - - Although the Lesser General Public License is Less protective of the -users' freedom, it does ensure that the user of a program that is -linked with the Library has the freedom and the wherewithal to run -that program using a modified version of the Library. - - The precise terms and conditions for copying, distribution and -modification follow. Pay close attention to the difference between a -"work based on the library" and a "work that uses the library". The -former contains code derived from the library, whereas the latter must -be combined with the library in order to run. - - GNU LESSER GENERAL PUBLIC LICENSE - TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION - - 0. This License Agreement applies to any software library or other -program which contains a notice placed by the copyright holder or -other authorized party saying it may be distributed under the terms of -this Lesser General Public License (also called "this License"). -Each licensee is addressed as "you". - - A "library" means a collection of software functions and/or data -prepared so as to be conveniently linked with application programs -(which use some of those functions and data) to form executables. - - The "Library", below, refers to any such software library or work -which has been distributed under these terms. A "work based on the -Library" means either the Library or any derivative work under -copyright law: that is to say, a work containing the Library or a -portion of it, either verbatim or with modifications and/or translated -straightforwardly into another language. (Hereinafter, translation is -included without limitation in the term "modification".) - - "Source code" for a work means the preferred form of the work for -making modifications to it. For a library, complete source code means -all the source code for all modules it contains, plus any associated -interface definition files, plus the scripts used to control compilation -and installation of the library. - - Activities other than copying, distribution and modification are not -covered by this License; they are outside its scope. The act of -running a program using the Library is not restricted, and output from -such a program is covered only if its contents constitute a work based -on the Library (independent of the use of the Library in a tool for -writing it). Whether that is true depends on what the Library does -and what the program that uses the Library does. - - 1. You may copy and distribute verbatim copies of the Library's -complete source code as you receive it, in any medium, provided that -you conspicuously and appropriately publish on each copy an -appropriate copyright notice and disclaimer of warranty; keep intact -all the notices that refer to this License and to the absence of any -warranty; and distribute a copy of this License along with the -Library. - - You may charge a fee for the physical act of transferring a copy, -and you may at your option offer warranty protection in exchange for a -fee. - - 2. You may modify your copy or copies of the Library or any portion -of it, thus forming a work based on the Library, and copy and -distribute such modifications or work under the terms of Section 1 -above, provided that you also meet all of these conditions: - - a) The modified work must itself be a software library. - - b) You must cause the files modified to carry prominent notices - stating that you changed the files and the date of any change. - - c) You must cause the whole of the work to be licensed at no - charge to all third parties under the terms of this License. - - d) If a facility in the modified Library refers to a function or a - table of data to be supplied by an application program that uses - the facility, other than as an argument passed when the facility - is invoked, then you must make a good faith effort to ensure that, - in the event an application does not supply such function or - table, the facility still operates, and performs whatever part of - its purpose remains meaningful. - - (For example, a function in a library to compute square roots has - a purpose that is entirely well-defined independent of the - application. Therefore, Subsection 2d requires that any - application-supplied function or table used by this function must - be optional: if the application does not supply it, the square - root function must still compute square roots.) - -These requirements apply to the modified work as a whole. If -identifiable sections of that work are not derived from the Library, -and can be reasonably considered independent and separate works in -themselves, then this License, and its terms, do not apply to those -sections when you distribute them as separate works. But when you -distribute the same sections as part of a whole which is a work based -on the Library, the distribution of the whole must be on the terms of -this License, whose permissions for other licensees extend to the -entire whole, and thus to each and every part regardless of who wrote -it. - -Thus, it is not the intent of this section to claim rights or contest -your rights to work written entirely by you; rather, the intent is to -exercise the right to control the distribution of derivative or -collective works based on the Library. - -In addition, mere aggregation of another work not based on the Library -with the Library (or with a work based on the Library) on a volume of -a storage or distribution medium does not bring the other work under -the scope of this License. - - 3. You may opt to apply the terms of the ordinary GNU General Public -License instead of this License to a given copy of the Library. To do -this, you must alter all the notices that refer to this License, so -that they refer to the ordinary GNU General Public License, version 2, -instead of to this License. (If a newer version than version 2 of the -ordinary GNU General Public License has appeared, then you can specify -that version instead if you wish.) Do not make any other change in -these notices. - - Once this change is made in a given copy, it is irreversible for -that copy, so the ordinary GNU General Public License applies to all -subsequent copies and derivative works made from that copy. - - This option is useful when you wish to copy part of the code of -the Library into a program that is not a library. - - 4. You may copy and distribute the Library (or a portion or -derivative of it, under Section 2) in object code or executable form -under the terms of Sections 1 and 2 above provided that you accompany -it with the complete corresponding machine-readable source code, which -must be distributed under the terms of Sections 1 and 2 above on a -medium customarily used for software interchange. - - If distribution of object code is made by offering access to copy -from a designated place, then offering equivalent access to copy the -source code from the same place satisfies the requirement to -distribute the source code, even though third parties are not -compelled to copy the source along with the object code. - - 5. A program that contains no derivative of any portion of the -Library, but is designed to work with the Library by being compiled or -linked with it, is called a "work that uses the Library". Such a -work, in isolation, is not a derivative work of the Library, and -therefore falls outside the scope of this License. - - However, linking a "work that uses the Library" with the Library -creates an executable that is a derivative of the Library (because it -contains portions of the Library), rather than a "work that uses the -library". The executable is therefore covered by this License. -Section 6 states terms for distribution of such executables. - - When a "work that uses the Library" uses material from a header file -that is part of the Library, the object code for the work may be a -derivative work of the Library even though the source code is not. -Whether this is true is especially significant if the work can be -linked without the Library, or if the work is itself a library. The -threshold for this to be true is not precisely defined by law. - - If such an object file uses only numerical parameters, data -structure layouts and accessors, and small macros and small inline -functions (ten lines or less in length), then the use of the object -file is unrestricted, regardless of whether it is legally a derivative -work. (Executables containing this object code plus portions of the -Library will still fall under Section 6.) - - Otherwise, if the work is a derivative of the Library, you may -distribute the object code for the work under the terms of Section 6. -Any executables containing that work also fall under Section 6, -whether or not they are linked directly with the Library itself. - - 6. As an exception to the Sections above, you may also combine or -link a "work that uses the Library" with the Library to produce a -work containing portions of the Library, and distribute that work -under terms of your choice, provided that the terms permit -modification of the work for the customer's own use and reverse -engineering for debugging such modifications. - - You must give prominent notice with each copy of the work that the -Library is used in it and that the Library and its use are covered by -this License. You must supply a copy of this License. If the work -during execution displays copyright notices, you must include the -copyright notice for the Library among them, as well as a reference -directing the user to the copy of this License. Also, you must do one -of these things: - - a) Accompany the work with the complete corresponding - machine-readable source code for the Library including whatever - changes were used in the work (which must be distributed under - Sections 1 and 2 above); and, if the work is an executable linked - with the Library, with the complete machine-readable "work that - uses the Library", as object code and/or source code, so that the - user can modify the Library and then relink to produce a modified - executable containing the modified Library. (It is understood - that the user who changes the contents of definitions files in the - Library will not necessarily be able to recompile the application - to use the modified definitions.) - - b) Use a suitable shared library mechanism for linking with the - Library. A suitable mechanism is one that (1) uses at run time a - copy of the library already present on the user's computer system, - rather than copying library functions into the executable, and (2) - will operate properly with a modified version of the library, if - the user installs one, as long as the modified version is - interface-compatible with the version that the work was made with. - - c) Accompany the work with a written offer, valid for at - least three years, to give the same user the materials - specified in Subsection 6a, above, for a charge no more - than the cost of performing this distribution. - - d) If distribution of the work is made by offering access to copy - from a designated place, offer equivalent access to copy the above - specified materials from the same place. - - e) verify that the user has already received a copy of these - materials or that you have already sent this user a copy. - - For an executable, the required form of the "work that uses the -Library" must include any data and utility programs needed for -reproducing the executable from it. However, as a special exception, -the materials to be distributed need not include anything that is -normally distributed (in either source or binary form) with the major -components (compiler, kernel, and so on) of the operating system on -which the executable runs, unless that component itself accompanies -the executable. - - It may happen that this requirement contradicts the license -restrictions of other proprietary libraries that do not normally -accompany the operating system. Such a contradiction means you cannot -use both them and the Library together in an executable that you -distribute. - - 7. You may place library facilities that are a work based on the -Library side-by-side in a single library together with other library -facilities not covered by this License, and distribute such a combined -library, provided that the separate distribution of the work based on -the Library and of the other library facilities is otherwise -permitted, and provided that you do these two things: - - a) Accompany the combined library with a copy of the same work - based on the Library, uncombined with any other library - facilities. This must be distributed under the terms of the - Sections above. - - b) Give prominent notice with the combined library of the fact - that part of it is a work based on the Library, and explaining - where to find the accompanying uncombined form of the same work. - - 8. You may not copy, modify, sublicense, link with, or distribute -the Library except as expressly provided under this License. Any -attempt otherwise to copy, modify, sublicense, link with, or -distribute the Library is void, and will automatically terminate your -rights under this License. However, parties who have received copies, -or rights, from you under this License will not have their licenses -terminated so long as such parties remain in full compliance. - - 9. You are not required to accept this License, since you have not -signed it. However, nothing else grants you permission to modify or -distribute the Library or its derivative works. These actions are -prohibited by law if you do not accept this License. Therefore, by -modifying or distributing the Library (or any work based on the -Library), you indicate your acceptance of this License to do so, and -all its terms and conditions for copying, distributing or modifying -the Library or works based on it. - - 10. Each time you redistribute the Library (or any work based on the -Library), the recipient automatically receives a license from the -original licensor to copy, distribute, link with or modify the Library -subject to these terms and conditions. You may not impose any further -restrictions on the recipients' exercise of the rights granted herein. -You are not responsible for enforcing compliance by third parties with -this License. - - 11. If, as a consequence of a court judgment or allegation of patent -infringement or for any other reason (not limited to patent issues), -conditions are imposed on you (whether by court order, agreement or -otherwise) that contradict the conditions of this License, they do not -excuse you from the conditions of this License. If you cannot -distribute so as to satisfy simultaneously your obligations under this -License and any other pertinent obligations, then as a consequence you -may not distribute the Library at all. For example, if a patent -license would not permit royalty-free redistribution of the Library by -all those who receive copies directly or indirectly through you, then -the only way you could satisfy both it and this License would be to -refrain entirely from distribution of the Library. - -If any portion of this section is held invalid or unenforceable under any -particular circumstance, the balance of the section is intended to apply, -and the section as a whole is intended to apply in other circumstances. - -It is not the purpose of this section to induce you to infringe any -patents or other property right claims or to contest validity of any -such claims; this section has the sole purpose of protecting the -integrity of the free software distribution system which is -implemented by public license practices. Many people have made -generous contributions to the wide range of software distributed -through that system in reliance on consistent application of that -system; it is up to the author/donor to decide if he or she is willing -to distribute software through any other system and a licensee cannot -impose that choice. - -This section is intended to make thoroughly clear what is believed to -be a consequence of the rest of this License. - - 12. If the distribution and/or use of the Library is restricted in -certain countries either by patents or by copyrighted interfaces, the -original copyright holder who places the Library under this License may add -an explicit geographical distribution limitation excluding those countries, -so that distribution is permitted only in or among countries not thus -excluded. In such case, this License incorporates the limitation as if -written in the body of this License. - - 13. The Free Software Foundation may publish revised and/or new -versions of the Lesser General Public License from time to time. -Such new versions will be similar in spirit to the present version, -but may differ in detail to address new problems or concerns. - -Each version is given a distinguishing version number. If the Library -specifies a version number of this License which applies to it and -"any later version", you have the option of following the terms and -conditions either of that version or of any later version published by -the Free Software Foundation. If the Library does not specify a -license version number, you may choose any version ever published by -the Free Software Foundation. - - 14. If you wish to incorporate parts of the Library into other free -programs whose distribution conditions are incompatible with these, -write to the author to ask for permission. For software which is -copyrighted by the Free Software Foundation, write to the Free -Software Foundation; we sometimes make exceptions for this. Our -decision will be guided by the two goals of preserving the free status -of all derivatives of our free software and of promoting the sharing -and reuse of software generally. - - NO WARRANTY - - 15. BECAUSE THE LIBRARY IS LICENSED FREE OF CHARGE, THERE IS NO -WARRANTY FOR THE LIBRARY, TO THE EXTENT PERMITTED BY APPLICABLE LAW. -EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR -OTHER PARTIES PROVIDE THE LIBRARY "AS IS" WITHOUT WARRANTY OF ANY -KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR -PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE -LIBRARY IS WITH YOU. SHOULD THE LIBRARY PROVE DEFECTIVE, YOU ASSUME -THE COST OF ALL NECESSARY SERVICING, REPAIR OR CORRECTION. - - 16. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN -WRITING WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY -AND/OR REDISTRIBUTE THE LIBRARY AS PERMITTED ABOVE, BE LIABLE TO YOU -FOR DAMAGES, INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR -CONSEQUENTIAL DAMAGES ARISING OUT OF THE USE OR INABILITY TO USE THE -LIBRARY (INCLUDING BUT NOT LIMITED TO LOSS OF DATA OR DATA BEING -RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD PARTIES OR A -FAILURE OF THE LIBRARY TO OPERATE WITH ANY OTHER SOFTWARE), EVEN IF -SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH -DAMAGES. - - END OF TERMS AND CONDITIONS - - How to Apply These Terms to Your New Libraries - - If you develop a new library, and you want it to be of the greatest -possible use to the public, we recommend making it free software that -everyone can redistribute and change. You can do so by permitting -redistribution under these terms (or, alternatively, under the terms of the -ordinary General Public License). - - To apply these terms, attach the following notices to the library. It is -safest to attach them to the start of each source file to most effectively -convey the exclusion of warranty; and each file should have at least the -"copyright" line and a pointer to where the full notice is found. - -
-
-Other contributions are gladly received, whether in beer 🍺, T-shirts 👕, Amazon wishlist raids, or cold, hard cash 💰.
-
-## Changelog
-
-See [changelog](changelog.md).
-
-## History
-- PHPMailer was originally written in 2001 by Brent R. Matzelle as a [SourceForge project](http://sourceforge.net/projects/phpmailer/).
-- Marcus Bointon (coolbru on SF) and Andy Prevost (codeworxtech) took over the project in 2004.
-- Became an Apache incubator project on Google Code in 2010, managed by Jim Jagielski.
-- Marcus created his fork on [GitHub](https://github.com/Synchro/PHPMailer).
-- Jim and Marcus decide to join forces and use GitHub as the canonical and official repo for PHPMailer.
-- PHPMailer moves to the [PHPMailer organisation](https://github.com/PHPMailer) on GitHub.
-
-### What's changed since moving from SourceForge?
-- Official successor to the SourceForge and Google Code projects.
-- Test suite.
-- Continuous integration with Travis-CI.
-- Composer support.
-- Public development.
-- Additional languages and language strings.
-- CRAM-MD5 authentication support.
-- Preserves full repo history of authors, commits and branches from the original SourceForge project.
diff --git a/download/phpmailer529/VERSION b/download/phpmailer529/VERSION
deleted file mode 100755
index 485d792a3..000000000
--- a/download/phpmailer529/VERSION
+++ /dev/null
@@ -1 +0,0 @@
-5.2.9
\ No newline at end of file
diff --git a/download/phpmailer529/changelog.md b/download/phpmailer529/changelog.md
deleted file mode 100755
index 52bc328ad..000000000
--- a/download/phpmailer529/changelog.md
+++ /dev/null
@@ -1,573 +0,0 @@
-# ChangeLog
-
-* Use `application/javascript` for .js attachments
-* Improve RFC2821 compliance for timelimits, especially for end-of-data
-* Add Azerbaijani translations (Thanks to @mirjalal)
-* Minor code cleanup for robustness
-* Add Indonesian translations (Thanks to @ceceprawiro)
-* Avoid `error_log` Debugoutput naming clash
-* Add ability to parse server capabilities in response to EHLO (useful for SendGrid etc)
-* Amended default values for WordWrap to match RFC
-* Remove html2text converter class, provide new mechanism for injecting converters
-* Improve pointers to docs and support in README
-* Add example file upload script
-* Refactor and major cleanup of EasyPeasyICS, now a lot more usable
-
-## Version 5.2.9 (Sept 25th 2014)
-* **Important: The autoloader is no longer autoloaded by the PHPMailer class**
-* Update html2text from https://github.com/mtibben/html2text
-* Improve Arabic translations (Thanks to @tarekdj)
-* Consistent handling of connection variables in SMTP and POP3
-* PHPDoc cleanup
-* Update composer to use PHPUnit 4.1
-* Pass consistent params to callbacks
-* More consistent handling of error states and debug output
-* Use property defaults, remove constructors
-* Remove unreachable code
-* Use older regex validation pattern for troublesome PCRE library versions
-* Improve PCRE detection in older PHP versions
-* Handle debug output consistently, and always in UTF-8
-* Allow user-defined debug output method via a callable
-* msgHTML now converts data URIs to embedded images
-* SMTP::getLastReply() will now always be populated
-* Improved example code in README
-* Ensure long filenames in Content-Disposition are encoded correctly
-* Simplify SMTP debug output mechanism, clarify levels with constants
-* Add SMTP connection check example
-* Simplify examples, don't use mysql* functions
-
-## Version 5.2.8 (May 14th 2014)
-* Increase timeout to match RFC2821 section 4.5.3.2 and thus not fail greetdelays, fixes #104
-* Add timestamps to default debug output
-* Add connection events and new level 3 to debug output options
-* Chinese language update (Thanks to @binaryoung)
-* Allow custom Mailer types (Thanks to @michield)
-* Cope with spaces around SMTP host specs
-* Fix processing of multiple hosts in connect string
-* Added Galician translation (Thanks to @donatorouco)
-* Autoloader now prepends
-* Docs updates
-* Add Latvian translation (Thanks to @eddsstudio)
-* Add Belarusian translation (Thanks to @amaksymiuk)
-* Make autoloader work better on older PHP versions
-* Avoid double-encoding if mbstring is overloading mail()
-* Add Portuguese translation (Thanks to @Jonadabe)
-* Make quoted-printable encoder respect line ending setting
-* Improve Chinese translation (Thanks to @PeterDaveHello)
-* Add Georgian translation (Thanks to @akalongman)
-* Add Greek translation (Thanks to @lenasterg)
-* Fix serverHostname on PHP < 5.3
-* Improve performance of SMTP class
-* Implement automatic 7bit downgrade
-* Add Vietnamese translation (Thanks to @vinades)
-* Improve example images, switch to PNG
-* Add Croatian translation (Thanks to @hrvoj3e)
-* Remove setting the Return-Path and deprecate the Return-path property - it's just wrong!
-* Fix language file loading if CWD has changed (@stephandesouza)
-* Add HTML5 email validation pattern
-* Improve Turkish translations (Thanks to @yasinaydin)
-* Improve Romanian translations (Thanks to @aflorea)
-* Check php.ini for path to sendmail/qmail before using default
-* Improve Farsi translation (Thanks to @MHM5000)
-* Don't use quoted-printable encoding for multipart types
-* Add Serbian translation (Thanks to ajevremovic at gmail.com)
-* Remove useless PHP5 check
-* Use SVG for build status badges
-* Store MessageDate on creation
-* Better default behaviour for validateAddress
-
-## Version 5.2.7 (September 12th 2013)
-* Add Ukrainian translation from @Krezalis
-* Support for do_verp
-* Fix bug in CRAM-MD5 AUTH
-* Propagate Debugoutput option to SMTP class (@Reblutus)
-* Determine MIME type of attachments automatically
-* Add cross-platform, multibyte-safe pathinfo replacement (with tests) and use it
-* Add a new 'html' Debugoutput type
-* Clean up SMTP debug output, remove embedded HTML
-* Some small changes in header formatting to improve IETF msglint test results
-* Update test_script to use some recently changed features, rename to code_generator
-* Generated code actually works!
-* Update SyntaxHighlighter
-* Major overhaul and cleanup of example code
-* New PHPMailer graphic
-* msgHTML now uses RFC2392-compliant content ids
-* Add line break normalization function and use it in msgHTML
-* Don't set unnecessary reply-to addresses
-* Make fakesendmail.sh a bit cleaner and safer
-* Set a content-transfer-encoding on multiparts (fixes msglint error)
-* Fix cid generation in msgHTML (Thanks to @digitalthought)
-* Fix handling of multiple SMTP servers (Thanks to @NanoCaiordo)
-* SMTP->connect() now supports stream context options (Thanks to @stanislavdavid)
-* Add support for iCal event alternatives (Thanks to @reblutus)
-* Update to Polish language file (Thanks to Krzysztof Kowalewski)
-* Update to Norwegian language file (Thanks to @datagutten)
-* Update to Hungarian language file (Thanks to @dominicus-75)
-* Add Persian/Farsi translation from @jaii
-* Make SMTPDebug property type match type in SMTP class
-* Add unit tests for DKIM
-* Major refactor of SMTP class
-* Reformat to PSR-2 coding standard
-* Introduce autoloader
-* Allow overriding of SMTP class
-* Overhaul of PHPDocs
-* Fix broken Q-encoding
-* Czech language update (Thanks to @nemelu)
-* Removal of excess blank lines in messages
-* Added fake POP server and unit tests for POP-before-SMTP
-
-## Version 5.2.6 (April 11th 2013)
-* Reflect move to PHPMailer GitHub organisation at https://github.com/PHPMailer/PHPMailer
-* Fix unbumped version numbers
-* Update packagist.org with new location
-* Clean up Changelog
-
-## Version 5.2.5 (April 6th 2013)
-* First official release after move from Google Code
-* Fixes for qmail when sending via mail()
-* Merge in changes from Google code 5.2.4 release
-* Minor coding standards cleanup in SMTP class
-* Improved unit tests, now tests S/MIME signing
-* Travis-CI support on GitHub, runs tests with fake SMTP server
-
-## Version 5.2.4 (February 19, 2013)
-* Fix tag and version bug.
-* un-deprecate isSMTP(), isMail(), IsSendmail() and isQmail().
-* Numerous translation updates
-
-## Version 5.2.3 (February 8, 2013)
-* Fix issue with older PCREs and ValidateAddress() (Bugz: 124)
-* Add CRAM-MD5 authentication, thanks to Elijah madden, https://github.com/okonomiyaki3000
-* Replacement of obsolete Quoted-Printable encoder with a much better implementation
-* Composer package definition
-* New language added: Hebrew
-
-## Version 5.2.2 (December 3, 2012)
-* Some fixes and syncs from https://github.com/Synchro/PHPMailer
-* Add Slovak translation, thanks to Michal Tinka
-
-## Version 5.2.2-rc2 (November 6, 2012)
-* Fix SMTP server rotation (Bugz: 118)
-* Allow override of autogen'ed 'Date' header (for Drupal's
- og_mailinglist module)
-* No whitespace after '-f' option (Bugz: 116)
-* Work around potential warning (Bugz: 114)
-
-## Version 5.2.2-rc1 (September 28, 2012)
-* Header encoding works with long lines (Bugz: 93)
-* Turkish language update (Bugz: 94)
-* undefined $pattern in EncodeQ bug squashed (Bugz: 98)
-* use of mail() in safe_mode now works (Bugz: 96)
-* ValidateAddress() now 'public static' so people can override the
- default and use their own validation scheme.
-* ValidateAddress() no longer uses broken FILTER_VALIDATE_EMAIL
-* Added in AUTH PLAIN SMTP authentication
-
-## Version 5.2.2-beta2 (August 17, 2012)
-* Fixed Postfix VERP support (Bugz: 92)
-* Allow action_function callbacks to pass/use
- the From address (passed as final param)
-* Prevent inf look for get_lines() (Bugz: 77)
-* New public var ($UseSendmailOptions). Only pass sendmail()
- options iff we really are using sendmail or something sendmail
- compatible. (Bugz: 75)
-* default setting for LE returned to "\n" due to popular demand.
-
-## Version 5.2.2-beta1 (July 13, 2012)
-* Expose PreSend() and PostSend() as public methods to allow
- for more control if serializing message sending.
-* GetSentMIMEMessage() only constructs the message copy when
- needed. Save memory.
-* Only pass params to mail() if the underlying MTA is
- "sendmail" (as defined as "having the string sendmail
- in its pathname") [#69]
-* Attachments now work with Amazon SES and others [Bugz#70]
-* Debug output now sent to stdout (via echo) or error_log [Bugz#5]
-* New var: Debugoutput (for above) [Bugz#5]
-* SMTP reads now Timeout aware (new var: Timeout=15) [Bugz#71]
-* SMTP reads now can have a Timelimit associated with them
- (new var: Timelimit=30)[Bugz#71]
-* Fix quoting issue associated with charsets
-* default setting for LE is now RFC compliant: "\r\n"
-* Return-Path can now be user defined (new var: ReturnPath)
- (the default is "" which implies no change from previous
- behavior, which was to use either From or Sender) [Bugz#46]
-* X-Mailer header can now be disabled (by setting to a
- whitespace string, eg " ") [Bugz#66]
-* Bugz closed: #68, #60, #42, #43, #59, #55, #66, #48, #49,
- #52, #31, #41, #5. #70, #69
-
-## Version 5.2.1 (January 16, 2012)
-* Closed several bugs #5
-* Performance improvements
-* MsgHTML() now returns the message as required.
-* New method: GetSentMIMEMessage() (returns full copy of sent message)
-
-## Version 5.2 (July 19, 2011)
-* protected MIME body and header
-* better DKIM DNS Resource Record support
-* better aly handling
-* htmlfilter class added to extras
-* moved to Apache Extras
-
-## Version 5.1 (October 20, 2009)
-* fixed filename issue with AddStringAttachment (thanks to Tony)
-* fixed "SingleTo" property, now works with Senmail, Qmail, and SMTP in
- addition to PHP mail()
-* added DKIM digital signing functionality, new properties:
- - DKIM_domain (sets the domain name)
- - DKIM_private (holds DKIM private key)
- - DKIM_passphrase (holds your DKIM passphrase)
- - DKIM_selector (holds the DKIM "selector")
- - DKIM_identity (holds the identifying email address)
-* added callback function support
- - callback function parameters include:
- result, to, cc, bcc, subject and body
- - see the test/test_callback.php file for usage.
-* added "auto" identity functionality
- - can automatically add:
- - Return-path (if Sender not set)
- - Reply-To (if ReplyTo not set)
- - can be disabled:
- - $mail->SetFrom('yourname@yourdomain.com','First Last',false);
- - or by adding the $mail->Sender and/or $mail->ReplyTo properties
-
-Note: "auto" identity added to help with emails ending up in spam or junk boxes because of missing headers
-
-## Version 5.0.2 (May 24, 2009)
-* Fix for missing attachments when inline graphics are present
-* Fix for missing Cc in header when using SMTP (mail was sent,
- but not displayed in header -- Cc receiver only saw email To:
- line and no Cc line, but did get the email (To receiver
- saw same)
-
-## Version 5.0.1 (April 05, 2009)
-* Temporary fix for missing attachments
-
-## Version 5.0.0 (April 02, 2009)
-With the release of this version, we are initiating a new version numbering
-system to differentiate from the PHP4 version of PHPMailer.
-Most notable in this release is fully object oriented code.
-
-### class.smtp.php:
-* Refactored class.smtp.php to support new exception handling
-* code size reduced from 29.2 Kb to 25.6 Kb
-* Removed unnecessary functions from class.smtp.php:
- - public function Expand($name) {
- - public function Help($keyword="") {
- - public function Noop() {
- - public function Send($from) {
- - public function SendOrMail($from) {
- - public function Verify($name) {
-
-### class.phpmailer.php:
-* Refactored class.phpmailer.php with new exception handling
-* Changed processing functionality of Sendmail and Qmail so they cannot be
- inadvertently used
-* removed getFile() function, just became a simple wrapper for
- file_get_contents()
-* added check for PHP version (will gracefully exit if not at least PHP 5.0)
-* enhanced code to check if an attachment source is the same as an embedded or
- inline graphic source to eliminate duplicate attachments
-
-### New /test_script
-We have written a test script you can use to test the script as part of your
-installation. Once you press submit, the test script will send a multi-mime
-email with either the message you type in or an HTML email with an inline
-graphic. Two attachments are included in the email (one of the attachments
-is also the inline graphic so you can see that only one copy of the graphic
-is sent in the email). The test script will also display the functional
-script that you can copy/paste to your editor to duplicate the functionality.
-
-### New examples
-All new examples in both basic and advanced modes. Advanced examples show
- Exception handling.
-
-### PHPDocumentator (phpdocs) documentation for PHPMailer version 5.0.0
-All new documentation
-
-## Version 2.3 (November 06, 2008)
-* added Arabic language (many thanks to Bahjat Al Mostafa)
-* removed English language from language files and made it a default within
- class.phpmailer.php - if no language is found, it will default to use
- the english language translation
-* fixed public/private declarations
-* corrected line 1728, $basedir to $directory
-* added $sign_cert_file to avoid improper duplicate use of $sign_key_file
-* corrected $this->Hello on line 612 to $this->Helo
-* changed default of $LE to "\r\n" to comply with RFC 2822. Can be set by the user
- if default is not acceptable
-* removed trim() from return results in EncodeQP
-* /test and three files it contained are removed from version 2.3
-* fixed phpunit.php for compliance with PHP5
-* changed $this->AltBody = $textMsg; to $this->AltBody = html_entity_decode($textMsg);
-* We have removed the /phpdoc from the downloads. All documentation is now on
- the http://phpmailer.codeworxtech.com website.
-
-## Version 2.2.1 () July 19 2008
-* fixed line 1092 in class.smtp.php (my apologies, error on my part)
-
-## Version 2.2 () July 15 2008
-* Fixed redirect issue (display of UTF-8 in thank you redirect)
-* fixed error in getResponse function declaration (class.pop3.php)
-* PHPMailer now PHP6 compliant
-* fixed line 1092 in class.smtp.php (endless loop from missing = sign)
-
-## Version 2.1 (Wed, June 04 2008)
-NOTE: WE HAVE A NEW LANGUAGE VARIABLE FOR DIGITALLY SIGNED S/MIME EMAILS. IF YOU CAN HELP WITH LANGUAGES OTHER THAN ENGLISH AND SPANISH, IT WOULD BE APPRECIATED.
-
-* added S/MIME functionality (ability to digitally sign emails)
- BIG THANKS TO "sergiocambra" for posting this patch back in November 2007.
- The "Signed Emails" functionality adds the Sign method to pass the private key
- filename and the password to read it, and then email will be sent with
- content-type multipart/signed and with the digital signature attached.
-* fully compatible with E_STRICT error level
- - Please note:
- In about half the test environments this development version was subjected
- to, an error was thrown for the date() functions used (line 1565 and 1569).
- This is NOT a PHPMailer error, it is the result of an incorrectly configured
- PHP5 installation. The fix is to modify your 'php.ini' file and include the
- date.timezone = Etc/UTC (or your own zone)
- directive, to your own server timezone
- - If you do get this error, and are unable to access your php.ini file:
- In your PHP script, add
- `date_default_timezone_set('Etc/UTC');`
- - do not try to use
- `$myVar = date_default_timezone_get();`
- as a test, it will throw an error.
-* added ability to define path (mainly for embedded images)
- function `MsgHTML($message,$basedir='')` ... where:
- `$basedir` is the fully qualified path
-* fixed `MsgHTML()` function:
- - Embedded Images where images are specified by ``, appropriate for browser output - * * `error_log` Output to error log as configured in php.ini - * - * Alternatively, you can provide a callable expecting two params: a message string and the debug level: - *
- * $mail->Debugoutput = function($str, $level) {echo "debug level $level; message: $str";};
- *
- * @type string|callable
- * @see SMTP::$Debugoutput
- */
- public $Debugoutput = 'echo';
-
- /**
- * Whether to keep SMTP connection open after each message.
- * If this is set to true then to close the connection
- * requires an explicit call to smtpClose().
- * @type boolean
- */
- public $SMTPKeepAlive = false;
-
- /**
- * Whether to split multiple to addresses into multiple messages
- * or send them all in one message.
- * @type boolean
- */
- public $SingleTo = false;
-
- /**
- * Storage for addresses when SingleTo is enabled.
- * @type array
- * @TODO This should really not be public
- */
- public $SingleToArray = array();
-
- /**
- * Whether to generate VERP addresses on send.
- * Only applicable when sending via SMTP.
- * @link http://en.wikipedia.org/wiki/Variable_envelope_return_path
- * @link http://www.postfix.org/VERP_README.html Postfix VERP info
- * @type boolean
- */
- public $do_verp = false;
-
- /**
- * Whether to allow sending messages with an empty body.
- * @type boolean
- */
- public $AllowEmpty = false;
-
- /**
- * The default line ending.
- * @note The default remains "\n". We force CRLF where we know
- * it must be used via self::CRLF.
- * @type string
- */
- public $LE = "\n";
-
- /**
- * DKIM selector.
- * @type string
- */
- public $DKIM_selector = '';
-
- /**
- * DKIM Identity.
- * Usually the email address used as the source of the email
- * @type string
- */
- public $DKIM_identity = '';
-
- /**
- * DKIM passphrase.
- * Used if your key is encrypted.
- * @type string
- */
- public $DKIM_passphrase = '';
-
- /**
- * DKIM signing domain name.
- * @example 'example.com'
- * @type string
- */
- public $DKIM_domain = '';
-
- /**
- * DKIM private key file path.
- * @type string
- */
- public $DKIM_private = '';
-
- /**
- * Callback Action function name.
- *
- * The function that handles the result of the send email action.
- * It is called out by send() for each email sent.
- *
- * Value can be any php callable: http://www.php.net/is_callable
- *
- * Parameters:
- * boolean $result result of the send action
- * string $to email address of the recipient
- * string $cc cc email addresses
- * string $bcc bcc email addresses
- * string $subject the subject
- * string $body the email body
- * string $from email address of sender
- * @type string
- */
- public $action_function = '';
-
- /**
- * What to use in the X-Mailer header.
- * Options: null for default, whitespace for none, or a string to use
- * @type string
- */
- public $XMailer = '';
-
- /**
- * An instance of the SMTP sender class.
- * @type SMTP
- * @access protected
- */
- protected $smtp = null;
-
- /**
- * The array of 'to' addresses.
- * @type array
- * @access protected
- */
- protected $to = array();
-
- /**
- * The array of 'cc' addresses.
- * @type array
- * @access protected
- */
- protected $cc = array();
-
- /**
- * The array of 'bcc' addresses.
- * @type array
- * @access protected
- */
- protected $bcc = array();
-
- /**
- * The array of reply-to names and addresses.
- * @type array
- * @access protected
- */
- protected $ReplyTo = array();
-
- /**
- * An array of all kinds of addresses.
- * Includes all of $to, $cc, $bcc, $replyto
- * @type array
- * @access protected
- */
- protected $all_recipients = array();
-
- /**
- * The array of attachments.
- * @type array
- * @access protected
- */
- protected $attachment = array();
-
- /**
- * The array of custom headers.
- * @type array
- * @access protected
- */
- protected $CustomHeader = array();
-
- /**
- * The most recent Message-ID (including angular brackets).
- * @type string
- * @access protected
- */
- protected $lastMessageID = '';
-
- /**
- * The message's MIME type.
- * @type string
- * @access protected
- */
- protected $message_type = '';
-
- /**
- * The array of MIME boundary strings.
- * @type array
- * @access protected
- */
- protected $boundary = array();
-
- /**
- * The array of available languages.
- * @type array
- * @access protected
- */
- protected $language = array();
-
- /**
- * The number of errors encountered.
- * @type integer
- * @access protected
- */
- protected $error_count = 0;
-
- /**
- * The S/MIME certificate file path.
- * @type string
- * @access protected
- */
- protected $sign_cert_file = '';
-
- /**
- * The S/MIME key file path.
- * @type string
- * @access protected
- */
- protected $sign_key_file = '';
-
- /**
- * The S/MIME password for the key.
- * Used only if the key is encrypted.
- * @type string
- * @access protected
- */
- protected $sign_key_pass = '';
-
- /**
- * Whether to throw exceptions for errors.
- * @type boolean
- * @access protected
- */
- protected $exceptions = false;
-
- /**
- * Error severity: message only, continue processing.
- */
- const STOP_MESSAGE = 0;
-
- /**
- * Error severity: message, likely ok to continue processing.
- */
- const STOP_CONTINUE = 1;
-
- /**
- * Error severity: message, plus full stop, critical error reached.
- */
- const STOP_CRITICAL = 2;
-
- /**
- * SMTP RFC standard line ending.
- */
- const CRLF = "\r\n";
-
- /**
- * Constructor.
- * @param boolean $exceptions Should we throw external exceptions?
- */
- public function __construct($exceptions = false)
- {
- $this->exceptions = (boolean)$exceptions;
- }
-
- /**
- * Destructor.
- */
- public function __destruct()
- {
- if ($this->Mailer == 'smtp') { //close any open SMTP connection nicely
- $this->smtpClose();
- }
- }
-
- /**
- * Call mail() in a safe_mode-aware fashion.
- * Also, unless sendmail_path points to sendmail (or something that
- * claims to be sendmail), don't pass params (not a perfect fix,
- * but it will do)
- * @param string $to To
- * @param string $subject Subject
- * @param string $body Message Body
- * @param string $header Additional Header(s)
- * @param string $params Params
- * @access private
- * @return boolean
- */
- private function mailPassthru($to, $subject, $body, $header, $params)
- {
- //Check overloading of mail function to avoid double-encoding
- if (ini_get('mbstring.func_overload') & 1) {
- $subject = $this->secureHeader($subject);
- } else {
- $subject = $this->encodeHeader($this->secureHeader($subject));
- }
- if (ini_get('safe_mode') || !($this->UseSendmailOptions)) {
- $result = @mail($to, $subject, $body, $header);
- } else {
- $result = @mail($to, $subject, $body, $header, $params);
- }
- return $result;
- }
-
- /**
- * Output debugging info via user-defined method.
- * Only generates output if SMTP debug output is enabled (@see SMTP::$do_debug).
- * @see PHPMailer::$Debugoutput
- * @see PHPMailer::$SMTPDebug
- * @param string $str
- */
- protected function edebug($str)
- {
- if ($this->SMTPDebug <= 0) {
- return;
- }
- //Avoid clash with built-in function names
- if (!in_array($this->Debugoutput, array('error_log', 'html', 'echo')) and is_callable($this->Debugoutput)) {
- call_user_func($this->Debugoutput, $str, $this->SMTPDebug);
- return;
- }
- switch ($this->Debugoutput) {
- case 'error_log':
- //Don't output, just log
- error_log($str);
- break;
- case 'html':
- //Cleans up output a bit for a better looking, HTML-safe output
- echo htmlentities(
- preg_replace('/[\r\n]+/', '', $str),
- ENT_QUOTES,
- 'UTF-8'
- )
- . "\n"; - break; - case 'echo': - default: - //Normalize line breaks - $str = preg_replace('/(\r\n|\r|\n)/ms', "\n", $str); - echo gmdate('Y-m-d H:i:s') . "\t" . str_replace( - "\n", - "\n \t ", - trim($str) - ) . "\n"; - } - } - - /** - * Sets message type to HTML or plain. - * @param boolean $isHtml True for HTML mode. - * @return void - */ - public function isHTML($isHtml = true) - { - if ($isHtml) { - $this->ContentType = 'text/html'; - } else { - $this->ContentType = 'text/plain'; - } - } - - /** - * Send messages using SMTP. - * @return void - */ - public function isSMTP() - { - $this->Mailer = 'smtp'; - } - - /** - * Send messages using PHP's mail() function. - * @return void - */ - public function isMail() - { - $this->Mailer = 'mail'; - } - - /** - * Send messages using $Sendmail. - * @return void - */ - public function isSendmail() - { - $ini_sendmail_path = ini_get('sendmail_path'); - - if (!stristr($ini_sendmail_path, 'sendmail')) { - $this->Sendmail = '/usr/sbin/sendmail'; - } else { - $this->Sendmail = $ini_sendmail_path; - } - $this->Mailer = 'sendmail'; - } - - /** - * Send messages using qmail. - * @return void - */ - public function isQmail() - { - $ini_sendmail_path = ini_get('sendmail_path'); - - if (!stristr($ini_sendmail_path, 'qmail')) { - $this->Sendmail = '/var/qmail/bin/qmail-inject'; - } else { - $this->Sendmail = $ini_sendmail_path; - } - $this->Mailer = 'qmail'; - } - - /** - * Add a "To" address. - * @param string $address - * @param string $name - * @return boolean true on success, false if address already used - */ - public function addAddress($address, $name = '') - { - return $this->addAnAddress('to', $address, $name); - } - - /** - * Add a "CC" address. - * @note: This function works with the SMTP mailer on win32, not with the "mail" mailer. - * @param string $address - * @param string $name - * @return boolean true on success, false if address already used - */ - public function addCC($address, $name = '') - { - return $this->addAnAddress('cc', $address, $name); - } - - /** - * Add a "BCC" address. - * @note: This function works with the SMTP mailer on win32, not with the "mail" mailer. - * @param string $address - * @param string $name - * @return boolean true on success, false if address already used - */ - public function addBCC($address, $name = '') - { - return $this->addAnAddress('bcc', $address, $name); - } - - /** - * Add a "Reply-to" address. - * @param string $address - * @param string $name - * @return boolean - */ - public function addReplyTo($address, $name = '') - { - return $this->addAnAddress('Reply-To', $address, $name); - } - - /** - * Add an address to one of the recipient arrays. - * Addresses that have been added already return false, but do not throw exceptions - * @param string $kind One of 'to', 'cc', 'bcc', 'ReplyTo' - * @param string $address The email address to send to - * @param string $name - * @throws phpmailerException - * @return boolean true on success, false if address already used or invalid in some way - * @access protected - */ - protected function addAnAddress($kind, $address, $name = '') - { - if (!preg_match('/^(to|cc|bcc|Reply-To)$/', $kind)) { - $this->setError($this->lang('Invalid recipient array') . ': ' . $kind); - $this->edebug($this->lang('Invalid recipient array') . ': ' . $kind); - if ($this->exceptions) { - throw new phpmailerException('Invalid recipient array: ' . $kind); - } - return false; - } - $address = trim($address); - $name = trim(preg_replace('/[\r\n]+/', '', $name)); //Strip breaks and trim - if (!$this->validateAddress($address)) { - $this->setError($this->lang('invalid_address') . ': ' . $address); - $this->edebug($this->lang('invalid_address') . ': ' . $address); - if ($this->exceptions) { - throw new phpmailerException($this->lang('invalid_address') . ': ' . $address); - } - return false; - } - if ($kind != 'Reply-To') { - if (!isset($this->all_recipients[strtolower($address)])) { - array_push($this->$kind, array($address, $name)); - $this->all_recipients[strtolower($address)] = true; - return true; - } - } else { - if (!array_key_exists(strtolower($address), $this->ReplyTo)) { - $this->ReplyTo[strtolower($address)] = array($address, $name); - return true; - } - } - return false; - } - - /** - * Set the From and FromName properties. - * @param string $address - * @param string $name - * @param boolean $auto Whether to also set the Sender address, defaults to true - * @throws phpmailerException - * @return boolean - */ - public function setFrom($address, $name = '', $auto = true) - { - $address = trim($address); - $name = trim(preg_replace('/[\r\n]+/', '', $name)); //Strip breaks and trim - if (!$this->validateAddress($address)) { - $this->setError($this->lang('invalid_address') . ': ' . $address); - $this->edebug($this->lang('invalid_address') . ': ' . $address); - if ($this->exceptions) { - throw new phpmailerException($this->lang('invalid_address') . ': ' . $address); - } - return false; - } - $this->From = $address; - $this->FromName = $name; - if ($auto) { - if (empty($this->Sender)) { - $this->Sender = $address; - } - } - return true; - } - - /** - * Return the Message-ID header of the last email. - * Technically this is the value from the last time the headers were created, - * but it's also the message ID of the last sent message except in - * pathological cases. - * @return string - */ - public function getLastMessageID() - { - return $this->lastMessageID; - } - - /** - * Check that a string looks like an email address. - * @param string $address The email address to check - * @param string $patternselect A selector for the validation pattern to use : - * * `auto` Pick strictest one automatically; - * * `pcre8` Use the squiloople.com pattern, requires PCRE > 8.0, PHP >= 5.3.2, 5.2.14; - * * `pcre` Use old PCRE implementation; - * * `php` Use PHP built-in FILTER_VALIDATE_EMAIL; same as pcre8 but does not allow 'dotless' domains; - * * `html5` Use the pattern given by the HTML5 spec for 'email' type form input elements. - * * `noregex` Don't use a regex: super fast, really dumb. - * @return boolean - * @static - * @access public - */ - public static function validateAddress($address, $patternselect = 'auto') - { - if (!$patternselect or $patternselect == 'auto') { - //Check this constant first so it works when extension_loaded() is disabled by safe mode - //Constant was added in PHP 5.2.4 - if (defined('PCRE_VERSION')) { - //This pattern can get stuck in a recursive loop in PCRE <= 8.0.2 - if (version_compare(PCRE_VERSION, '8.0.3') >= 0) { - $patternselect = 'pcre8'; - } else { - $patternselect = 'pcre'; - } - } elseif (function_exists('extension_loaded') and extension_loaded('pcre')) { - //Fall back to older PCRE - $patternselect = 'pcre'; - } else { - //Filter_var appeared in PHP 5.2.0 and does not require the PCRE extension - if (version_compare(PHP_VERSION, '5.2.0') >= 0) { - $patternselect = 'php'; - } else { - $patternselect = 'noregex'; - } - } - } - switch ($patternselect) { - case 'pcre8': - /** - * Uses the same RFC5322 regex on which FILTER_VALIDATE_EMAIL is based, but allows dotless domains. - * @link http://squiloople.com/2009/12/20/email-address-validation/ - * @copyright 2009-2010 Michael Rushton - * Feel free to use and redistribute this code. But please keep this copyright notice. - */ - return (boolean)preg_match( - '/^(?!(?>(?1)"?(?>\\\[ -~]|[^"])"?(?1)){255,})(?!(?>(?1)"?(?>\\\[ -~]|[^"])"?(?1)){65,}@)' . - '((?>(?>(?>((?>(?>(?>\x0D\x0A)?[\t ])+|(?>[\t ]*\x0D\x0A)?[\t ]+)?)(\((?>(?2)' . - '(?>[\x01-\x08\x0B\x0C\x0E-\'*-\[\]-\x7F]|\\\[\x00-\x7F]|(?3)))*(?2)\)))+(?2))|(?2))?)' . - '([!#-\'*+\/-9=?^-~-]+|"(?>(?2)(?>[\x01-\x08\x0B\x0C\x0E-!#-\[\]-\x7F]|\\\[\x00-\x7F]))*' . - '(?2)")(?>(?1)\.(?1)(?4))*(?1)@(?!(?1)[a-z0-9-]{64,})(?1)(?>([a-z0-9](?>[a-z0-9-]*[a-z0-9])?)' . - '(?>(?1)\.(?!(?1)[a-z0-9-]{64,})(?1)(?5)){0,126}|\[(?:(?>IPv6:(?>([a-f0-9]{1,4})(?>:(?6)){7}' . - '|(?!(?:.*[a-f0-9][:\]]){8,})((?6)(?>:(?6)){0,6})?::(?7)?))|(?>(?>IPv6:(?>(?6)(?>:(?6)){5}:' . - '|(?!(?:.*[a-f0-9]:){6,})(?8)?::(?>((?6)(?>:(?6)){0,4}):)?))?(25[0-5]|2[0-4][0-9]|1[0-9]{2}' . - '|[1-9]?[0-9])(?>\.(?9)){3}))\])(?1)$/isD', - $address - ); - case 'pcre': - //An older regex that doesn't need a recent PCRE - return (boolean)preg_match( - '/^(?!(?>"?(?>\\\[ -~]|[^"])"?){255,})(?!(?>"?(?>\\\[ -~]|[^"])"?){65,}@)(?>' . - '[!#-\'*+\/-9=?^-~-]+|"(?>(?>[\x01-\x08\x0B\x0C\x0E-!#-\[\]-\x7F]|\\\[\x00-\xFF]))*")' . - '(?>\.(?>[!#-\'*+\/-9=?^-~-]+|"(?>(?>[\x01-\x08\x0B\x0C\x0E-!#-\[\]-\x7F]|\\\[\x00-\xFF]))*"))*' . - '@(?>(?![a-z0-9-]{64,})(?>[a-z0-9](?>[a-z0-9-]*[a-z0-9])?)(?>\.(?![a-z0-9-]{64,})' . - '(?>[a-z0-9](?>[a-z0-9-]*[a-z0-9])?)){0,126}|\[(?:(?>IPv6:(?>(?>[a-f0-9]{1,4})(?>:' . - '[a-f0-9]{1,4}){7}|(?!(?:.*[a-f0-9][:\]]){8,})(?>[a-f0-9]{1,4}(?>:[a-f0-9]{1,4}){0,6})?' . - '::(?>[a-f0-9]{1,4}(?>:[a-f0-9]{1,4}){0,6})?))|(?>(?>IPv6:(?>[a-f0-9]{1,4}(?>:' . - '[a-f0-9]{1,4}){5}:|(?!(?:.*[a-f0-9]:){6,})(?>[a-f0-9]{1,4}(?>:[a-f0-9]{1,4}){0,4})?' . - '::(?>(?:[a-f0-9]{1,4}(?>:[a-f0-9]{1,4}){0,4}):)?))?(?>25[0-5]|2[0-4][0-9]|1[0-9]{2}' . - '|[1-9]?[0-9])(?>\.(?>25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}))\])$/isD', - $address - ); - case 'html5': - /** - * This is the pattern used in the HTML5 spec for validation of 'email' type form input elements. - * @link http://www.whatwg.org/specs/web-apps/current-work/#e-mail-state-(type=email) - */ - return (boolean)preg_match( - '/^[a-zA-Z0-9.!#$%&\'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}' . - '[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/sD', - $address - ); - case 'noregex': - //No PCRE! Do something _very_ approximate! - //Check the address is 3 chars or longer and contains an @ that's not the first or last char - return (strlen($address) >= 3 - and strpos($address, '@') >= 1 - and strpos($address, '@') != strlen($address) - 1); - case 'php': - default: - return (boolean)filter_var($address, FILTER_VALIDATE_EMAIL); - } - } - - /** - * Create a message and send it. - * Uses the sending method specified by $Mailer. - * @throws phpmailerException - * @return boolean false on error - See the ErrorInfo property for details of the error. - */ - public function send() - { - try { - if (!$this->preSend()) { - return false; - } - return $this->postSend(); - } catch (phpmailerException $exc) { - $this->mailHeader = ''; - $this->setError($exc->getMessage()); - if ($this->exceptions) { - throw $exc; - } - return false; - } - } - - /** - * Prepare a message for sending. - * @throws phpmailerException - * @return boolean - */ - public function preSend() - { - try { - $this->mailHeader = ''; - if ((count($this->to) + count($this->cc) + count($this->bcc)) < 1) { - throw new phpmailerException($this->lang('provide_address'), self::STOP_CRITICAL); - } - - // Set whether the message is multipart/alternative - if (!empty($this->AltBody)) { - $this->ContentType = 'multipart/alternative'; - } - - $this->error_count = 0; // reset errors - $this->setMessageType(); - // Refuse to send an empty message unless we are specifically allowing it - if (!$this->AllowEmpty and empty($this->Body)) { - throw new phpmailerException($this->lang('empty_message'), self::STOP_CRITICAL); - } - - $this->MIMEHeader = $this->createHeader(); - $this->MIMEBody = $this->createBody(); - - // To capture the complete message when using mail(), create - // an extra header list which createHeader() doesn't fold in - if ($this->Mailer == 'mail') { - if (count($this->to) > 0) { - $this->mailHeader .= $this->addrAppend('To', $this->to); - } else { - $this->mailHeader .= $this->headerLine('To', 'undisclosed-recipients:;'); - } - $this->mailHeader .= $this->headerLine( - 'Subject', - $this->encodeHeader($this->secureHeader(trim($this->Subject))) - ); - } - - // Sign with DKIM if enabled - if (!empty($this->DKIM_domain) - && !empty($this->DKIM_private) - && !empty($this->DKIM_selector) - && file_exists($this->DKIM_private)) { - $header_dkim = $this->DKIM_Add( - $this->MIMEHeader . $this->mailHeader, - $this->encodeHeader($this->secureHeader($this->Subject)), - $this->MIMEBody - ); - $this->MIMEHeader = rtrim($this->MIMEHeader, "\r\n ") . self::CRLF . - str_replace("\r\n", "\n", $header_dkim) . self::CRLF; - } - return true; - - } catch (phpmailerException $exc) { - $this->setError($exc->getMessage()); - if ($this->exceptions) { - throw $exc; - } - return false; - } - } - - /** - * Actually send a message. - * Send the email via the selected mechanism - * @throws phpmailerException - * @return boolean - */ - public function postSend() - { - try { - // Choose the mailer and send through it - switch ($this->Mailer) { - case 'sendmail': - case 'qmail': - return $this->sendmailSend($this->MIMEHeader, $this->MIMEBody); - case 'smtp': - return $this->smtpSend($this->MIMEHeader, $this->MIMEBody); - case 'mail': - return $this->mailSend($this->MIMEHeader, $this->MIMEBody); - default: - $sendMethod = $this->Mailer.'Send'; - if (method_exists($this, $sendMethod)) { - return $this->$sendMethod($this->MIMEHeader, $this->MIMEBody); - } - - return $this->mailSend($this->MIMEHeader, $this->MIMEBody); - } - } catch (phpmailerException $exc) { - $this->setError($exc->getMessage()); - $this->edebug($exc->getMessage()); - if ($this->exceptions) { - throw $exc; - } - } - return false; - } - - /** - * Send mail using the $Sendmail program. - * @param string $header The message headers - * @param string $body The message body - * @see PHPMailer::$Sendmail - * @throws phpmailerException - * @access protected - * @return boolean - */ - protected function sendmailSend($header, $body) - { - if ($this->Sender != '') { - if ($this->Mailer == 'qmail') { - $sendmail = sprintf('%s -f%s', escapeshellcmd($this->Sendmail), escapeshellarg($this->Sender)); - } else { - $sendmail = sprintf('%s -oi -f%s -t', escapeshellcmd($this->Sendmail), escapeshellarg($this->Sender)); - } - } else { - if ($this->Mailer == 'qmail') { - $sendmail = sprintf('%s', escapeshellcmd($this->Sendmail)); - } else { - $sendmail = sprintf('%s -oi -t', escapeshellcmd($this->Sendmail)); - } - } - if ($this->SingleTo) { - foreach ($this->SingleToArray as $toAddr) { - if (!@$mail = popen($sendmail, 'w')) { - throw new phpmailerException($this->lang('execute') . $this->Sendmail, self::STOP_CRITICAL); - } - fputs($mail, 'To: ' . $toAddr . "\n"); - fputs($mail, $header); - fputs($mail, $body); - $result = pclose($mail); - $this->doCallback( - ($result == 0), - array($toAddr), - $this->cc, - $this->bcc, - $this->Subject, - $body, - $this->From - ); - if ($result != 0) { - throw new phpmailerException($this->lang('execute') . $this->Sendmail, self::STOP_CRITICAL); - } - } - } else { - if (!@$mail = popen($sendmail, 'w')) { - throw new phpmailerException($this->lang('execute') . $this->Sendmail, self::STOP_CRITICAL); - } - fputs($mail, $header); - fputs($mail, $body); - $result = pclose($mail); - $this->doCallback(($result == 0), $this->to, $this->cc, $this->bcc, $this->Subject, $body, $this->From); - if ($result != 0) { - throw new phpmailerException($this->lang('execute') . $this->Sendmail, self::STOP_CRITICAL); - } - } - return true; - } - - /** - * Send mail using the PHP mail() function. - * @param string $header The message headers - * @param string $body The message body - * @link http://www.php.net/manual/en/book.mail.php - * @throws phpmailerException - * @access protected - * @return boolean - */ - protected function mailSend($header, $body) - { - $toArr = array(); - foreach ($this->to as $toaddr) { - $toArr[] = $this->addrFormat($toaddr); - } - $to = implode(', ', $toArr); - - if (empty($this->Sender)) { - $params = ' '; - } else { - $params = sprintf('-f%s', $this->Sender); - } - if ($this->Sender != '' and !ini_get('safe_mode')) { - $old_from = ini_get('sendmail_from'); - ini_set('sendmail_from', $this->Sender); - } - $result = false; - if ($this->SingleTo && count($toArr) > 1) { - foreach ($toArr as $toAddr) { - $result = $this->mailPassthru($toAddr, $this->Subject, $body, $header, $params); - $this->doCallback($result, array($toAddr), $this->cc, $this->bcc, $this->Subject, $body, $this->From); - } - } else { - $result = $this->mailPassthru($to, $this->Subject, $body, $header, $params); - $this->doCallback($result, $this->to, $this->cc, $this->bcc, $this->Subject, $body, $this->From); - } - if (isset($old_from)) { - ini_set('sendmail_from', $old_from); - } - if (!$result) { - throw new phpmailerException($this->lang('instantiate'), self::STOP_CRITICAL); - } - return true; - } - - /** - * Get an instance to use for SMTP operations. - * Override this function to load your own SMTP implementation - * @return SMTP - */ - public function getSMTPInstance() - { - if (!is_object($this->smtp)) { - $this->smtp = new SMTP; - } - return $this->smtp; - } - - /** - * Send mail via SMTP. - * Returns false if there is a bad MAIL FROM, RCPT, or DATA input. - * Uses the PHPMailerSMTP class by default. - * @see PHPMailer::getSMTPInstance() to use a different class. - * @param string $header The message headers - * @param string $body The message body - * @throws phpmailerException - * @uses SMTP - * @access protected - * @return boolean - */ - protected function smtpSend($header, $body) - { - $bad_rcpt = array(); - - if (!$this->smtpConnect()) { - throw new phpmailerException($this->lang('smtp_connect_failed'), self::STOP_CRITICAL); - } - $smtp_from = ($this->Sender == '') ? $this->From : $this->Sender; - if (!$this->smtp->mail($smtp_from)) { - $this->setError($this->lang('from_failed') . $smtp_from . ' : ' . implode(',', $this->smtp->getError())); - throw new phpmailerException($this->ErrorInfo, self::STOP_CRITICAL); - } - - // Attempt to send to all recipients - foreach ($this->to as $to) { - if (!$this->smtp->recipient($to[0])) { - $bad_rcpt[] = $to[0]; - $isSent = false; - } else { - $isSent = true; - } - $this->doCallback($isSent, array($to[0]), array(), array(), $this->Subject, $body, $this->From); - } - foreach ($this->cc as $cc) { - if (!$this->smtp->recipient($cc[0])) { - $bad_rcpt[] = $cc[0]; - $isSent = false; - } else { - $isSent = true; - } - $this->doCallback($isSent, array(), array($cc[0]), array(), $this->Subject, $body, $this->From); - } - foreach ($this->bcc as $bcc) { - if (!$this->smtp->recipient($bcc[0])) { - $bad_rcpt[] = $bcc[0]; - $isSent = false; - } else { - $isSent = true; - } - $this->doCallback($isSent, array(), array(), array($bcc[0]), $this->Subject, $body, $this->From); - } - - // Only send the DATA command if we have viable recipients - if ((count($this->all_recipients) > count($bad_rcpt)) and !$this->smtp->data($header . $body)) { - throw new phpmailerException($this->lang('data_not_accepted'), self::STOP_CRITICAL); - } - if ($this->SMTPKeepAlive) { - $this->smtp->reset(); - } else { - $this->smtp->quit(); - $this->smtp->close(); - } - if (count($bad_rcpt) > 0) { // Create error message for any bad addresses - throw new phpmailerException( - $this->lang('recipients_failed') . implode(', ', $bad_rcpt), - self::STOP_CONTINUE - ); - } - return true; - } - - /** - * Initiate a connection to an SMTP server. - * Returns false if the operation failed. - * @param array $options An array of options compatible with stream_context_create() - * @uses SMTP - * @access public - * @throws phpmailerException - * @return boolean - */ - public function smtpConnect($options = array()) - { - if (is_null($this->smtp)) { - $this->smtp = $this->getSMTPInstance(); - } - - // Already connected? - if ($this->smtp->connected()) { - return true; - } - - $this->smtp->setTimeout($this->Timeout); - $this->smtp->setDebugLevel($this->SMTPDebug); - $this->smtp->setDebugOutput($this->Debugoutput); - $this->smtp->setVerp($this->do_verp); - $hosts = explode(';', $this->Host); - $lastexception = null; - - foreach ($hosts as $hostentry) { - $hostinfo = array(); - if (!preg_match('/^((ssl|tls):\/\/)*([a-zA-Z0-9\.-]*):?([0-9]*)$/', trim($hostentry), $hostinfo)) { - // Not a valid host entry - continue; - } - // $hostinfo[2]: optional ssl or tls prefix - // $hostinfo[3]: the hostname - // $hostinfo[4]: optional port number - // The host string prefix can temporarily override the current setting for SMTPSecure - // If it's not specified, the default value is used - $prefix = ''; - $tls = ($this->SMTPSecure == 'tls'); - if ($hostinfo[2] == 'ssl' or ($hostinfo[2] == '' and $this->SMTPSecure == 'ssl')) { - $prefix = 'ssl://'; - $tls = false; // Can't have SSL and TLS at once - } elseif ($hostinfo[2] == 'tls') { - $tls = true; - // tls doesn't use a prefix - } - $host = $hostinfo[3]; - $port = $this->Port; - $tport = (integer)$hostinfo[4]; - if ($tport > 0 and $tport < 65536) { - $port = $tport; - } - if ($this->smtp->connect($prefix . $host, $port, $this->Timeout, $options)) { - try { - if ($this->Helo) { - $hello = $this->Helo; - } else { - $hello = $this->serverHostname(); - } - $this->smtp->hello($hello); - - if ($tls) { - if (!$this->smtp->startTLS()) { - throw new phpmailerException($this->lang('connect_host')); - } - // We must resend HELO after tls negotiation - $this->smtp->hello($hello); - } - if ($this->SMTPAuth) { - if (!$this->smtp->authenticate( - $this->Username, - $this->Password, - $this->AuthType, - $this->Realm, - $this->Workstation - ) - ) { - throw new phpmailerException($this->lang('authenticate')); - } - } - return true; - } catch (phpmailerException $exc) { - $lastexception = $exc; - // We must have connected, but then failed TLS or Auth, so close connection nicely - $this->smtp->quit(); - } - } - } - // If we get here, all connection attempts have failed, so close connection hard - $this->smtp->close(); - // As we've caught all exceptions, just report whatever the last one was - if ($this->exceptions and !is_null($lastexception)) { - throw $lastexception; - } - return false; - } - - /** - * Close the active SMTP session if one exists. - * @return void - */ - public function smtpClose() - { - if ($this->smtp !== null) { - if ($this->smtp->connected()) { - $this->smtp->quit(); - $this->smtp->close(); - } - } - } - - /** - * Set the language for error messages. - * Returns false if it cannot load the language file. - * The default language is English. - * @param string $langcode ISO 639-1 2-character language code (e.g. French is "fr") - * @param string $lang_path Path to the language file directory, with trailing separator (slash) - * @return boolean - * @access public - */ - public function setLanguage($langcode = 'en', $lang_path = '') - { - // Define full set of translatable strings in English - $PHPMAILER_LANG = array( - 'authenticate' => 'SMTP Error: Could not authenticate.', - 'connect_host' => 'SMTP Error: Could not connect to SMTP host.', - 'data_not_accepted' => 'SMTP Error: data not accepted.', - 'empty_message' => 'Message body empty', - 'encoding' => 'Unknown encoding: ', - 'execute' => 'Could not execute: ', - 'file_access' => 'Could not access file: ', - 'file_open' => 'File Error: Could not open file: ', - 'from_failed' => 'The following From address failed: ', - 'instantiate' => 'Could not instantiate mail function.', - 'invalid_address' => 'Invalid address', - 'mailer_not_supported' => ' mailer is not supported.', - 'provide_address' => 'You must provide at least one recipient email address.', - 'recipients_failed' => 'SMTP Error: The following recipients failed: ', - 'signing' => 'Signing Error: ', - 'smtp_connect_failed' => 'SMTP connect() failed.', - 'smtp_error' => 'SMTP server error: ', - 'variable_set' => 'Cannot set or reset variable: ' - ); - if (empty($lang_path)) { - // Calculate an absolute path so it can work if CWD is not here - $lang_path = dirname(__FILE__). DIRECTORY_SEPARATOR . 'language'. DIRECTORY_SEPARATOR; - } - $foundlang = true; - $lang_file = $lang_path . 'phpmailer.lang-' . $langcode . '.php'; - if ($langcode != 'en') { // There is no English translation file - // Make sure language file path is readable - if (!is_readable($lang_file)) { - $foundlang = false; - } else { - // Overwrite language-specific strings. - // This way we'll never have missing translations. - $foundlang = include $lang_file; - } - } - $this->language = $PHPMAILER_LANG; - return (boolean)$foundlang; // Returns false if language not found - } - - /** - * Get the array of strings for the current language. - * @return array - */ - public function getTranslations() - { - return $this->language; - } - - /** - * Create recipient headers. - * @access public - * @param string $type - * @param array $addr An array of recipient, - * where each recipient is a 2-element indexed array with element 0 containing an address - * and element 1 containing a name, like: - * array(array('joe@example.com', 'Joe User'), array('zoe@example.com', 'Zoe User')) - * @return string - */ - public function addrAppend($type, $addr) - { - $addresses = array(); - foreach ($addr as $address) { - $addresses[] = $this->addrFormat($address); - } - return $type . ': ' . implode(', ', $addresses) . $this->LE; - } - - /** - * Format an address for use in a message header. - * @access public - * @param array $addr A 2-element indexed array, element 0 containing an address, element 1 containing a name - * like array('joe@example.com', 'Joe User') - * @return string - */ - public function addrFormat($addr) - { - if (empty($addr[1])) { // No name provided - return $this->secureHeader($addr[0]); - } else { - return $this->encodeHeader($this->secureHeader($addr[1]), 'phrase') . ' <' . $this->secureHeader( - $addr[0] - ) . '>'; - } - } - - /** - * Word-wrap message. - * For use with mailers that do not automatically perform wrapping - * and for quoted-printable encoded messages. - * Original written by philippe. - * @param string $message The message to wrap - * @param integer $length The line length to wrap to - * @param boolean $qp_mode Whether to run in Quoted-Printable mode - * @access public - * @return string - */ - public function wrapText($message, $length, $qp_mode = false) - { - $soft_break = ($qp_mode) ? sprintf(' =%s', $this->LE) : $this->LE; - // If utf-8 encoding is used, we will need to make sure we don't - // split multibyte characters when we wrap - $is_utf8 = (strtolower($this->CharSet) == 'utf-8'); - $lelen = strlen($this->LE); - $crlflen = strlen(self::CRLF); - - $message = $this->fixEOL($message); - if (substr($message, -$lelen) == $this->LE) { - $message = substr($message, 0, -$lelen); - } - - $line = explode($this->LE, $message); // Magic. We know fixEOL uses $LE - $message = ''; - for ($i = 0; $i < count($line); $i++) { - $line_part = explode(' ', $line[$i]); - $buf = ''; - for ($e = 0; $e < count($line_part); $e++) { - $word = $line_part[$e]; - if ($qp_mode and (strlen($word) > $length)) { - $space_left = $length - strlen($buf) - $crlflen; - if ($e != 0) { - if ($space_left > 20) { - $len = $space_left; - if ($is_utf8) { - $len = $this->utf8CharBoundary($word, $len); - } elseif (substr($word, $len - 1, 1) == '=') { - $len--; - } elseif (substr($word, $len - 2, 1) == '=') { - $len -= 2; - } - $part = substr($word, 0, $len); - $word = substr($word, $len); - $buf .= ' ' . $part; - $message .= $buf . sprintf('=%s', self::CRLF); - } else { - $message .= $buf . $soft_break; - } - $buf = ''; - } - while (strlen($word) > 0) { - if ($length <= 0) { - break; - } - $len = $length; - if ($is_utf8) { - $len = $this->utf8CharBoundary($word, $len); - } elseif (substr($word, $len - 1, 1) == '=') { - $len--; - } elseif (substr($word, $len - 2, 1) == '=') { - $len -= 2; - } - $part = substr($word, 0, $len); - $word = substr($word, $len); - - if (strlen($word) > 0) { - $message .= $part . sprintf('=%s', self::CRLF); - } else { - $buf = $part; - } - } - } else { - $buf_o = $buf; - $buf .= ($e == 0) ? $word : (' ' . $word); - - if (strlen($buf) > $length and $buf_o != '') { - $message .= $buf_o . $soft_break; - $buf = $word; - } - } - } - $message .= $buf . self::CRLF; - } - - return $message; - } - - /** - * Find the last character boundary prior to $maxLength in a utf-8 - * quoted (printable) encoded string. - * Original written by Colin Brown. - * @access public - * @param string $encodedText utf-8 QP text - * @param integer $maxLength find last character boundary prior to this length - * @return integer - */ - public function utf8CharBoundary($encodedText, $maxLength) - { - $foundSplitPos = false; - $lookBack = 3; - while (!$foundSplitPos) { - $lastChunk = substr($encodedText, $maxLength - $lookBack, $lookBack); - $encodedCharPos = strpos($lastChunk, '='); - if (false !== $encodedCharPos) { - // Found start of encoded character byte within $lookBack block. - // Check the encoded byte value (the 2 chars after the '=') - $hex = substr($encodedText, $maxLength - $lookBack + $encodedCharPos + 1, 2); - $dec = hexdec($hex); - if ($dec < 128) { // Single byte character. - // If the encoded char was found at pos 0, it will fit - // otherwise reduce maxLength to start of the encoded char - $maxLength = ($encodedCharPos == 0) ? $maxLength : - $maxLength - ($lookBack - $encodedCharPos); - $foundSplitPos = true; - } elseif ($dec >= 192) { // First byte of a multi byte character - // Reduce maxLength to split at start of character - $maxLength = $maxLength - ($lookBack - $encodedCharPos); - $foundSplitPos = true; - } elseif ($dec < 192) { // Middle byte of a multi byte character, look further back - $lookBack += 3; - } - } else { - // No encoded character found - $foundSplitPos = true; - } - } - return $maxLength; - } - - /** - * Set the body wrapping. - * @access public - * @return void - */ - public function setWordWrap() - { - if ($this->WordWrap < 1) { - return; - } - - switch ($this->message_type) { - case 'alt': - case 'alt_inline': - case 'alt_attach': - case 'alt_inline_attach': - $this->AltBody = $this->wrapText($this->AltBody, $this->WordWrap); - break; - default: - $this->Body = $this->wrapText($this->Body, $this->WordWrap); - break; - } - } - - /** - * Assemble message headers. - * @access public - * @return string The assembled headers - */ - public function createHeader() - { - $result = ''; - - // Set the boundaries - $uniq_id = md5(uniqid(time())); - $this->boundary[1] = 'b1_' . $uniq_id; - $this->boundary[2] = 'b2_' . $uniq_id; - $this->boundary[3] = 'b3_' . $uniq_id; - - if ($this->MessageDate == '') { - $this->MessageDate = self::rfcDate(); - } - $result .= $this->headerLine('Date', $this->MessageDate); - - - // To be created automatically by mail() - if ($this->SingleTo) { - if ($this->Mailer != 'mail') { - foreach ($this->to as $toaddr) { - $this->SingleToArray[] = $this->addrFormat($toaddr); - } - } - } else { - if (count($this->to) > 0) { - if ($this->Mailer != 'mail') { - $result .= $this->addrAppend('To', $this->to); - } - } elseif (count($this->cc) == 0) { - $result .= $this->headerLine('To', 'undisclosed-recipients:;'); - } - } - - $result .= $this->addrAppend('From', array(array(trim($this->From), $this->FromName))); - - // sendmail and mail() extract Cc from the header before sending - if (count($this->cc) > 0) { - $result .= $this->addrAppend('Cc', $this->cc); - } - - // sendmail and mail() extract Bcc from the header before sending - if (( - $this->Mailer == 'sendmail' or $this->Mailer == 'qmail' or $this->Mailer == 'mail' - ) - and count($this->bcc) > 0 - ) { - $result .= $this->addrAppend('Bcc', $this->bcc); - } - - if (count($this->ReplyTo) > 0) { - $result .= $this->addrAppend('Reply-To', $this->ReplyTo); - } - - // mail() sets the subject itself - if ($this->Mailer != 'mail') { - $result .= $this->headerLine('Subject', $this->encodeHeader($this->secureHeader($this->Subject))); - } - - if ($this->MessageID != '') { - $this->lastMessageID = $this->MessageID; - } else { - $this->lastMessageID = sprintf('<%s@%s>', $uniq_id, $this->ServerHostname()); - } - $result .= $this->HeaderLine('Message-ID', $this->lastMessageID); - $result .= $this->headerLine('X-Priority', $this->Priority); - if ($this->XMailer == '') { - $result .= $this->headerLine( - 'X-Mailer', - 'PHPMailer ' . $this->Version . ' (https://github.com/PHPMailer/PHPMailer/)' - ); - } else { - $myXmailer = trim($this->XMailer); - if ($myXmailer) { - $result .= $this->headerLine('X-Mailer', $myXmailer); - } - } - - if ($this->ConfirmReadingTo != '') { - $result .= $this->headerLine('Disposition-Notification-To', '<' . trim($this->ConfirmReadingTo) . '>'); - } - - // Add custom headers - for ($index = 0; $index < count($this->CustomHeader); $index++) { - $result .= $this->headerLine( - trim($this->CustomHeader[$index][0]), - $this->encodeHeader(trim($this->CustomHeader[$index][1])) - ); - } - if (!$this->sign_key_file) { - $result .= $this->headerLine('MIME-Version', '1.0'); - $result .= $this->getMailMIME(); - } - - return $result; - } - - /** - * Get the message MIME type headers. - * @access public - * @return string - */ - public function getMailMIME() - { - $result = ''; - $ismultipart = true; - switch ($this->message_type) { - case 'inline': - $result .= $this->headerLine('Content-Type', 'multipart/related;'); - $result .= $this->textLine("\tboundary=\"" . $this->boundary[1] . '"'); - break; - case 'attach': - case 'inline_attach': - case 'alt_attach': - case 'alt_inline_attach': - $result .= $this->headerLine('Content-Type', 'multipart/mixed;'); - $result .= $this->textLine("\tboundary=\"" . $this->boundary[1] . '"'); - break; - case 'alt': - case 'alt_inline': - $result .= $this->headerLine('Content-Type', 'multipart/alternative;'); - $result .= $this->textLine("\tboundary=\"" . $this->boundary[1] . '"'); - break; - default: - // Catches case 'plain': and case '': - $result .= $this->textLine('Content-Type: ' . $this->ContentType . '; charset=' . $this->CharSet); - $ismultipart = false; - break; - } - // RFC1341 part 5 says 7bit is assumed if not specified - if ($this->Encoding != '7bit') { - // RFC 2045 section 6.4 says multipart MIME parts may only use 7bit, 8bit or binary CTE - if ($ismultipart) { - if ($this->Encoding == '8bit') { - $result .= $this->headerLine('Content-Transfer-Encoding', '8bit'); - } - // The only remaining alternatives are quoted-printable and base64, which are both 7bit compatible - } else { - $result .= $this->headerLine('Content-Transfer-Encoding', $this->Encoding); - } - } - - if ($this->Mailer != 'mail') { - $result .= $this->LE; - } - - return $result; - } - - /** - * Returns the whole MIME message. - * Includes complete headers and body. - * Only valid post preSend(). - * @see PHPMailer::preSend() - * @access public - * @return string - */ - public function getSentMIMEMessage() - { - return $this->MIMEHeader . $this->mailHeader . self::CRLF . $this->MIMEBody; - } - - - /** - * Assemble the message body. - * Returns an empty string on failure. - * @access public - * @throws phpmailerException - * @return string The assembled message body - */ - public function createBody() - { - $body = ''; - - if ($this->sign_key_file) { - $body .= $this->getMailMIME() . $this->LE; - } - - $this->setWordWrap(); - - $bodyEncoding = $this->Encoding; - $bodyCharSet = $this->CharSet; - if ($bodyEncoding == '8bit' and !$this->has8bitChars($this->Body)) { - $bodyEncoding = '7bit'; - $bodyCharSet = 'us-ascii'; - } - $altBodyEncoding = $this->Encoding; - $altBodyCharSet = $this->CharSet; - if ($altBodyEncoding == '8bit' and !$this->has8bitChars($this->AltBody)) { - $altBodyEncoding = '7bit'; - $altBodyCharSet = 'us-ascii'; - } - switch ($this->message_type) { - case 'inline': - $body .= $this->getBoundary($this->boundary[1], $bodyCharSet, '', $bodyEncoding); - $body .= $this->encodeString($this->Body, $bodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->attachAll('inline', $this->boundary[1]); - break; - case 'attach': - $body .= $this->getBoundary($this->boundary[1], $bodyCharSet, '', $bodyEncoding); - $body .= $this->encodeString($this->Body, $bodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->attachAll('attachment', $this->boundary[1]); - break; - case 'inline_attach': - $body .= $this->textLine('--' . $this->boundary[1]); - $body .= $this->headerLine('Content-Type', 'multipart/related;'); - $body .= $this->textLine("\tboundary=\"" . $this->boundary[2] . '"'); - $body .= $this->LE; - $body .= $this->getBoundary($this->boundary[2], $bodyCharSet, '', $bodyEncoding); - $body .= $this->encodeString($this->Body, $bodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->attachAll('inline', $this->boundary[2]); - $body .= $this->LE; - $body .= $this->attachAll('attachment', $this->boundary[1]); - break; - case 'alt': - $body .= $this->getBoundary($this->boundary[1], $altBodyCharSet, 'text/plain', $altBodyEncoding); - $body .= $this->encodeString($this->AltBody, $altBodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->getBoundary($this->boundary[1], $bodyCharSet, 'text/html', $bodyEncoding); - $body .= $this->encodeString($this->Body, $bodyEncoding); - $body .= $this->LE . $this->LE; - if (!empty($this->Ical)) { - $body .= $this->getBoundary($this->boundary[1], '', 'text/calendar; method=REQUEST', ''); - $body .= $this->encodeString($this->Ical, $this->Encoding); - $body .= $this->LE . $this->LE; - } - $body .= $this->endBoundary($this->boundary[1]); - break; - case 'alt_inline': - $body .= $this->getBoundary($this->boundary[1], $altBodyCharSet, 'text/plain', $altBodyEncoding); - $body .= $this->encodeString($this->AltBody, $altBodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->textLine('--' . $this->boundary[1]); - $body .= $this->headerLine('Content-Type', 'multipart/related;'); - $body .= $this->textLine("\tboundary=\"" . $this->boundary[2] . '"'); - $body .= $this->LE; - $body .= $this->getBoundary($this->boundary[2], $bodyCharSet, 'text/html', $bodyEncoding); - $body .= $this->encodeString($this->Body, $bodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->attachAll('inline', $this->boundary[2]); - $body .= $this->LE; - $body .= $this->endBoundary($this->boundary[1]); - break; - case 'alt_attach': - $body .= $this->textLine('--' . $this->boundary[1]); - $body .= $this->headerLine('Content-Type', 'multipart/alternative;'); - $body .= $this->textLine("\tboundary=\"" . $this->boundary[2] . '"'); - $body .= $this->LE; - $body .= $this->getBoundary($this->boundary[2], $altBodyCharSet, 'text/plain', $altBodyEncoding); - $body .= $this->encodeString($this->AltBody, $altBodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->getBoundary($this->boundary[2], $bodyCharSet, 'text/html', $bodyEncoding); - $body .= $this->encodeString($this->Body, $bodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->endBoundary($this->boundary[2]); - $body .= $this->LE; - $body .= $this->attachAll('attachment', $this->boundary[1]); - break; - case 'alt_inline_attach': - $body .= $this->textLine('--' . $this->boundary[1]); - $body .= $this->headerLine('Content-Type', 'multipart/alternative;'); - $body .= $this->textLine("\tboundary=\"" . $this->boundary[2] . '"'); - $body .= $this->LE; - $body .= $this->getBoundary($this->boundary[2], $altBodyCharSet, 'text/plain', $altBodyEncoding); - $body .= $this->encodeString($this->AltBody, $altBodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->textLine('--' . $this->boundary[2]); - $body .= $this->headerLine('Content-Type', 'multipart/related;'); - $body .= $this->textLine("\tboundary=\"" . $this->boundary[3] . '"'); - $body .= $this->LE; - $body .= $this->getBoundary($this->boundary[3], $bodyCharSet, 'text/html', $bodyEncoding); - $body .= $this->encodeString($this->Body, $bodyEncoding); - $body .= $this->LE . $this->LE; - $body .= $this->attachAll('inline', $this->boundary[3]); - $body .= $this->LE; - $body .= $this->endBoundary($this->boundary[2]); - $body .= $this->LE; - $body .= $this->attachAll('attachment', $this->boundary[1]); - break; - default: - // catch case 'plain' and case '' - $body .= $this->encodeString($this->Body, $bodyEncoding); - break; - } - - if ($this->isError()) { - $body = ''; - } elseif ($this->sign_key_file) { - try { - if (!defined('PKCS7_TEXT')) { - throw new phpmailerException($this->lang('signing') . ' OpenSSL extension missing.'); - } - // @TODO would be nice to use php://temp streams here, but need to wrap for PHP < 5.1 - $file = tempnam(sys_get_temp_dir(), 'mail'); - if (false === file_put_contents($file, $body)) { - throw new phpmailerException($this->lang('signing') . ' Could not write temp file'); - } - $signed = tempnam(sys_get_temp_dir(), 'signed'); - if (@openssl_pkcs7_sign( - $file, - $signed, - 'file://' . realpath($this->sign_cert_file), - array('file://' . realpath($this->sign_key_file), $this->sign_key_pass), - null - ) - ) { - @unlink($file); - $body = file_get_contents($signed); - @unlink($signed); - } else { - @unlink($file); - @unlink($signed); - throw new phpmailerException($this->lang('signing') . openssl_error_string()); - } - } catch (phpmailerException $exc) { - $body = ''; - if ($this->exceptions) { - throw $exc; - } - } - } - return $body; - } - - /** - * Return the start of a message boundary. - * @access protected - * @param string $boundary - * @param string $charSet - * @param string $contentType - * @param string $encoding - * @return string - */ - protected function getBoundary($boundary, $charSet, $contentType, $encoding) - { - $result = ''; - if ($charSet == '') { - $charSet = $this->CharSet; - } - if ($contentType == '') { - $contentType = $this->ContentType; - } - if ($encoding == '') { - $encoding = $this->Encoding; - } - $result .= $this->textLine('--' . $boundary); - $result .= sprintf('Content-Type: %s; charset=%s', $contentType, $charSet); - $result .= $this->LE; - // RFC1341 part 5 says 7bit is assumed if not specified - if ($encoding != '7bit') { - $result .= $this->headerLine('Content-Transfer-Encoding', $encoding); - } - $result .= $this->LE; - - return $result; - } - - /** - * Return the end of a message boundary. - * @access protected - * @param string $boundary - * @return string - */ - protected function endBoundary($boundary) - { - return $this->LE . '--' . $boundary . '--' . $this->LE; - } - - /** - * Set the message type. - * PHPMailer only supports some preset message types, - * not arbitrary MIME structures. - * @access protected - * @return void - */ - protected function setMessageType() - { - $type = array(); - if ($this->alternativeExists()) { - $type[] = 'alt'; - } - if ($this->inlineImageExists()) { - $type[] = 'inline'; - } - if ($this->attachmentExists()) { - $type[] = 'attach'; - } - $this->message_type = implode('_', $type); - if ($this->message_type == '') { - $this->message_type = 'plain'; - } - } - - /** - * Format a header line. - * @access public - * @param string $name - * @param string $value - * @return string - */ - public function headerLine($name, $value) - { - return $name . ': ' . $value . $this->LE; - } - - /** - * Return a formatted mail line. - * @access public - * @param string $value - * @return string - */ - public function textLine($value) - { - return $value . $this->LE; - } - - /** - * Add an attachment from a path on the filesystem. - * Returns false if the file could not be found or read. - * @param string $path Path to the attachment. - * @param string $name Overrides the attachment name. - * @param string $encoding File encoding (see $Encoding). - * @param string $type File extension (MIME) type. - * @param string $disposition Disposition to use - * @throws phpmailerException - * @return boolean - */ - public function addAttachment($path, $name = '', $encoding = 'base64', $type = '', $disposition = 'attachment') - { - try { - if (!@is_file($path)) { - throw new phpmailerException($this->lang('file_access') . $path, self::STOP_CONTINUE); - } - - // If a MIME type is not specified, try to work it out from the file name - if ($type == '') { - $type = self::filenameToType($path); - } - - $filename = basename($path); - if ($name == '') { - $name = $filename; - } - - $this->attachment[] = array( - 0 => $path, - 1 => $filename, - 2 => $name, - 3 => $encoding, - 4 => $type, - 5 => false, // isStringAttachment - 6 => $disposition, - 7 => 0 - ); - - } catch (phpmailerException $exc) { - $this->setError($exc->getMessage()); - $this->edebug($exc->getMessage()); - if ($this->exceptions) { - throw $exc; - } - return false; - } - return true; - } - - /** - * Return the array of attachments. - * @return array - */ - public function getAttachments() - { - return $this->attachment; - } - - /** - * Attach all file, string, and binary attachments to the message. - * Returns an empty string on failure. - * @access protected - * @param string $disposition_type - * @param string $boundary - * @return string - */ - protected function attachAll($disposition_type, $boundary) - { - // Return text of body - $mime = array(); - $cidUniq = array(); - $incl = array(); - - // Add all attachments - foreach ($this->attachment as $attachment) { - // Check if it is a valid disposition_filter - if ($attachment[6] == $disposition_type) { - // Check for string attachment - $string = ''; - $path = ''; - $bString = $attachment[5]; - if ($bString) { - $string = $attachment[0]; - } else { - $path = $attachment[0]; - } - - $inclhash = md5(serialize($attachment)); - if (in_array($inclhash, $incl)) { - continue; - } - $incl[] = $inclhash; - $name = $attachment[2]; - $encoding = $attachment[3]; - $type = $attachment[4]; - $disposition = $attachment[6]; - $cid = $attachment[7]; - if ($disposition == 'inline' && isset($cidUniq[$cid])) { - continue; - } - $cidUniq[$cid] = true; - - $mime[] = sprintf('--%s%s', $boundary, $this->LE); - $mime[] = sprintf( - 'Content-Type: %s; name="%s"%s', - $type, - $this->encodeHeader($this->secureHeader($name)), - $this->LE - ); - // RFC1341 part 5 says 7bit is assumed if not specified - if ($encoding != '7bit') { - $mime[] = sprintf('Content-Transfer-Encoding: %s%s', $encoding, $this->LE); - } - - if ($disposition == 'inline') { - $mime[] = sprintf('Content-ID: <%s>%s', $cid, $this->LE); - } - - // If a filename contains any of these chars, it should be quoted, - // but not otherwise: RFC2183 & RFC2045 5.1 - // Fixes a warning in IETF's msglint MIME checker - // Allow for bypassing the Content-Disposition header totally - if (!(empty($disposition))) { - $encoded_name = $this->encodeHeader($this->secureHeader($name)); - if (preg_match('/[ \(\)<>@,;:\\"\/\[\]\?=]/', $encoded_name)) { - $mime[] = sprintf( - 'Content-Disposition: %s; filename="%s"%s', - $disposition, - $encoded_name, - $this->LE . $this->LE - ); - } else { - $mime[] = sprintf( - 'Content-Disposition: %s; filename=%s%s', - $disposition, - $encoded_name, - $this->LE . $this->LE - ); - } - } else { - $mime[] = $this->LE; - } - - // Encode as string attachment - if ($bString) { - $mime[] = $this->encodeString($string, $encoding); - if ($this->isError()) { - return ''; - } - $mime[] = $this->LE . $this->LE; - } else { - $mime[] = $this->encodeFile($path, $encoding); - if ($this->isError()) { - return ''; - } - $mime[] = $this->LE . $this->LE; - } - } - } - - $mime[] = sprintf('--%s--%s', $boundary, $this->LE); - - return implode('', $mime); - } - - /** - * Encode a file attachment in requested format. - * Returns an empty string on failure. - * @param string $path The full path to the file - * @param string $encoding The encoding to use; one of 'base64', '7bit', '8bit', 'binary', 'quoted-printable' - * @throws phpmailerException - * @see EncodeFile(encodeFile - * @access protected - * @return string - */ - protected function encodeFile($path, $encoding = 'base64') - { - try { - if (!is_readable($path)) { - throw new phpmailerException($this->lang('file_open') . $path, self::STOP_CONTINUE); - } - $magic_quotes = get_magic_quotes_runtime(); - if ($magic_quotes) { - if (version_compare(PHP_VERSION, '5.3.0', '<')) { - set_magic_quotes_runtime(false); - } else { - //Doesn't exist in PHP 5.4, but we don't need to check because - //get_magic_quotes_runtime always returns false in 5.4+ - //so it will never get here - ini_set('magic_quotes_runtime', 0); - } - } - $file_buffer = file_get_contents($path); - $file_buffer = $this->encodeString($file_buffer, $encoding); - if ($magic_quotes) { - if (version_compare(PHP_VERSION, '5.3.0', '<')) { - set_magic_quotes_runtime($magic_quotes); - } else { - ini_set('magic_quotes_runtime', ($magic_quotes?'1':'0')); - } - } - return $file_buffer; - } catch (Exception $exc) { - $this->setError($exc->getMessage()); - return ''; - } - } - - /** - * Encode a string in requested format. - * Returns an empty string on failure. - * @param string $str The text to encode - * @param string $encoding The encoding to use; one of 'base64', '7bit', '8bit', 'binary', 'quoted-printable' - * @access public - * @return string - */ - public function encodeString($str, $encoding = 'base64') - { - $encoded = ''; - switch (strtolower($encoding)) { - case 'base64': - $encoded = chunk_split(base64_encode($str), 76, $this->LE); - break; - case '7bit': - case '8bit': - $encoded = $this->fixEOL($str); - // Make sure it ends with a line break - if (substr($encoded, -(strlen($this->LE))) != $this->LE) { - $encoded .= $this->LE; - } - break; - case 'binary': - $encoded = $str; - break; - case 'quoted-printable': - $encoded = $this->encodeQP($str); - break; - default: - $this->setError($this->lang('encoding') . $encoding); - break; - } - return $encoded; - } - - /** - * Encode a header string optimally. - * Picks shortest of Q, B, quoted-printable or none. - * @access public - * @param string $str - * @param string $position - * @return string - */ - public function encodeHeader($str, $position = 'text') - { - $matchcount = 0; - switch (strtolower($position)) { - case 'phrase': - if (!preg_match('/[\200-\377]/', $str)) { - // Can't use addslashes as we don't know the value of magic_quotes_sybase - $encoded = addcslashes($str, "\0..\37\177\\\""); - if (($str == $encoded) && !preg_match('/[^A-Za-z0-9!#$%&\'*+\/=?^_`{|}~ -]/', $str)) { - return ($encoded); - } else { - return ("\"$encoded\""); - } - } - $matchcount = preg_match_all('/[^\040\041\043-\133\135-\176]/', $str, $matches); - break; - /** @noinspection PhpMissingBreakStatementInspection */ - case 'comment': - $matchcount = preg_match_all('/[()"]/', $str, $matches); - // Intentional fall-through - case 'text': - default: - $matchcount += preg_match_all('/[\000-\010\013\014\016-\037\177-\377]/', $str, $matches); - break; - } - - if ($matchcount == 0) { // There are no chars that need encoding - return ($str); - } - - $maxlen = 75 - 7 - strlen($this->CharSet); - // Try to select the encoding which should produce the shortest output - if ($matchcount > strlen($str) / 3) { - // More than a third of the content will need encoding, so B encoding will be most efficient - $encoding = 'B'; - if (function_exists('mb_strlen') && $this->hasMultiBytes($str)) { - // Use a custom function which correctly encodes and wraps long - // multibyte strings without breaking lines within a character - $encoded = $this->base64EncodeWrapMB($str, "\n"); - } else { - $encoded = base64_encode($str); - $maxlen -= $maxlen % 4; - $encoded = trim(chunk_split($encoded, $maxlen, "\n")); - } - } else { - $encoding = 'Q'; - $encoded = $this->encodeQ($str, $position); - $encoded = $this->wrapText($encoded, $maxlen, true); - $encoded = str_replace('=' . self::CRLF, "\n", trim($encoded)); - } - - $encoded = preg_replace('/^(.*)$/m', ' =?' . $this->CharSet . "?$encoding?\\1?=", $encoded); - $encoded = trim(str_replace("\n", $this->LE, $encoded)); - - return $encoded; - } - - /** - * Check if a string contains multi-byte characters. - * @access public - * @param string $str multi-byte text to wrap encode - * @return boolean - */ - public function hasMultiBytes($str) - { - if (function_exists('mb_strlen')) { - return (strlen($str) > mb_strlen($str, $this->CharSet)); - } else { // Assume no multibytes (we can't handle without mbstring functions anyway) - return false; - } - } - - /** - * Does a string contain any 8-bit chars (in any charset)? - * @param string $text - * @return boolean - */ - public function has8bitChars($text) - { - return (boolean)preg_match('/[\x80-\xFF]/', $text); - } - - /** - * Encode and wrap long multibyte strings for mail headers - * without breaking lines within a character. - * Adapted from a function by paravoid - * @link http://www.php.net/manual/en/function.mb-encode-mimeheader.php#60283 - * @access public - * @param string $str multi-byte text to wrap encode - * @param string $linebreak string to use as linefeed/end-of-line - * @return string - */ - public function base64EncodeWrapMB($str, $linebreak = null) - { - $start = '=?' . $this->CharSet . '?B?'; - $end = '?='; - $encoded = ''; - if ($linebreak === null) { - $linebreak = $this->LE; - } - - $mb_length = mb_strlen($str, $this->CharSet); - // Each line must have length <= 75, including $start and $end - $length = 75 - strlen($start) - strlen($end); - // Average multi-byte ratio - $ratio = $mb_length / strlen($str); - // Base64 has a 4:3 ratio - $avgLength = floor($length * $ratio * .75); - - for ($i = 0; $i < $mb_length; $i += $offset) { - $lookBack = 0; - do { - $offset = $avgLength - $lookBack; - $chunk = mb_substr($str, $i, $offset, $this->CharSet); - $chunk = base64_encode($chunk); - $lookBack++; - } while (strlen($chunk) > $length); - $encoded .= $chunk . $linebreak; - } - - // Chomp the last linefeed - $encoded = substr($encoded, 0, -strlen($linebreak)); - return $encoded; - } - - /** - * Encode a string in quoted-printable format. - * According to RFC2045 section 6.7. - * @access public - * @param string $string The text to encode - * @param integer $line_max Number of chars allowed on a line before wrapping - * @return string - * @link http://www.php.net/manual/en/function.quoted-printable-decode.php#89417 Adapted from this comment - */ - public function encodeQP($string, $line_max = 76) - { - if (function_exists('quoted_printable_encode')) { // Use native function if it's available (>= PHP5.3) - return $this->fixEOL(quoted_printable_encode($string)); - } - // Fall back to a pure PHP implementation - $string = str_replace( - array('%20', '%0D%0A.', '%0D%0A', '%'), - array(' ', "\r\n=2E", "\r\n", '='), - rawurlencode($string) - ); - $string = preg_replace('/[^\r\n]{' . ($line_max - 3) . '}[^=\r\n]{2}/', "$0=\r\n", $string); - return $this->fixEOL($string); - } - - /** - * Backward compatibility wrapper for an old QP encoding function that was removed. - * @see PHPMailer::encodeQP() - * @access public - * @param string $string - * @param integer $line_max - * @param boolean $space_conv - * @return string - * @deprecated Use encodeQP instead. - */ - public function encodeQPphp( - $string, - $line_max = 76, - /** @noinspection PhpUnusedParameterInspection */ $space_conv = false - ) { - return $this->encodeQP($string, $line_max); - } - - /** - * Encode a string using Q encoding. - * @link http://tools.ietf.org/html/rfc2047 - * @param string $str the text to encode - * @param string $position Where the text is going to be used, see the RFC for what that means - * @access public - * @return string - */ - public function encodeQ($str, $position = 'text') - { - // There should not be any EOL in the string - $pattern = ''; - $encoded = str_replace(array("\r", "\n"), '', $str); - switch (strtolower($position)) { - case 'phrase': - // RFC 2047 section 5.3 - $pattern = '^A-Za-z0-9!*+\/ -'; - break; - /** @noinspection PhpMissingBreakStatementInspection */ - case 'comment': - // RFC 2047 section 5.2 - $pattern = '\(\)"'; - // intentional fall-through - // for this reason we build the $pattern without including delimiters and [] - case 'text': - default: - // RFC 2047 section 5.1 - // Replace every high ascii, control, =, ? and _ characters - $pattern = '\000-\011\013\014\016-\037\075\077\137\177-\377' . $pattern; - break; - } - $matches = array(); - if (preg_match_all("/[{$pattern}]/", $encoded, $matches)) { - // If the string contains an '=', make sure it's the first thing we replace - // so as to avoid double-encoding - $eqkey = array_search('=', $matches[0]); - if (false !== $eqkey) { - unset($matches[0][$eqkey]); - array_unshift($matches[0], '='); - } - foreach (array_unique($matches[0]) as $char) { - $encoded = str_replace($char, '=' . sprintf('%02X', ord($char)), $encoded); - } - } - // Replace every spaces to _ (more readable than =20) - return str_replace(' ', '_', $encoded); - } - - - /** - * Add a string or binary attachment (non-filesystem). - * This method can be used to attach ascii or binary data, - * such as a BLOB record from a database. - * @param string $string String attachment data. - * @param string $filename Name of the attachment. - * @param string $encoding File encoding (see $Encoding). - * @param string $type File extension (MIME) type. - * @param string $disposition Disposition to use - * @return void - */ - public function addStringAttachment( - $string, - $filename, - $encoding = 'base64', - $type = '', - $disposition = 'attachment' - ) { - // If a MIME type is not specified, try to work it out from the file name - if ($type == '') { - $type = self::filenameToType($filename); - } - // Append to $attachment array - $this->attachment[] = array( - 0 => $string, - 1 => $filename, - 2 => basename($filename), - 3 => $encoding, - 4 => $type, - 5 => true, // isStringAttachment - 6 => $disposition, - 7 => 0 - ); - } - - /** - * Add an embedded (inline) attachment from a file. - * This can include images, sounds, and just about any other document type. - * These differ from 'regular' attachments in that they are intended to be - * displayed inline with the message, not just attached for download. - * This is used in HTML messages that embed the images - * the HTML refers to using the $cid value. - * @param string $path Path to the attachment. - * @param string $cid Content ID of the attachment; Use this to reference - * the content when using an embedded image in HTML. - * @param string $name Overrides the attachment name. - * @param string $encoding File encoding (see $Encoding). - * @param string $type File MIME type. - * @param string $disposition Disposition to use - * @return boolean True on successfully adding an attachment - */ - public function addEmbeddedImage($path, $cid, $name = '', $encoding = 'base64', $type = '', $disposition = 'inline') - { - if (!@is_file($path)) { - $this->setError($this->lang('file_access') . $path); - return false; - } - - // If a MIME type is not specified, try to work it out from the file name - if ($type == '') { - $type = self::filenameToType($path); - } - - $filename = basename($path); - if ($name == '') { - $name = $filename; - } - - // Append to $attachment array - $this->attachment[] = array( - 0 => $path, - 1 => $filename, - 2 => $name, - 3 => $encoding, - 4 => $type, - 5 => false, // isStringAttachment - 6 => $disposition, - 7 => $cid - ); - return true; - } - - /** - * Add an embedded stringified attachment. - * This can include images, sounds, and just about any other document type. - * Be sure to set the $type to an image type for images: - * JPEG images use 'image/jpeg', GIF uses 'image/gif', PNG uses 'image/png'. - * @param string $string The attachment binary data. - * @param string $cid Content ID of the attachment; Use this to reference - * the content when using an embedded image in HTML. - * @param string $name - * @param string $encoding File encoding (see $Encoding). - * @param string $type MIME type. - * @param string $disposition Disposition to use - * @return boolean True on successfully adding an attachment - */ - public function addStringEmbeddedImage( - $string, - $cid, - $name = '', - $encoding = 'base64', - $type = '', - $disposition = 'inline' - ) { - // If a MIME type is not specified, try to work it out from the name - if ($type == '') { - $type = self::filenameToType($name); - } - - // Append to $attachment array - $this->attachment[] = array( - 0 => $string, - 1 => $name, - 2 => $name, - 3 => $encoding, - 4 => $type, - 5 => true, // isStringAttachment - 6 => $disposition, - 7 => $cid - ); - return true; - } - - /** - * Check if an inline attachment is present. - * @access public - * @return boolean - */ - public function inlineImageExists() - { - foreach ($this->attachment as $attachment) { - if ($attachment[6] == 'inline') { - return true; - } - } - return false; - } - - /** - * Check if an attachment (non-inline) is present. - * @return boolean - */ - public function attachmentExists() - { - foreach ($this->attachment as $attachment) { - if ($attachment[6] == 'attachment') { - return true; - } - } - return false; - } - - /** - * Check if this message has an alternative body set. - * @return boolean - */ - public function alternativeExists() - { - return !empty($this->AltBody); - } - - /** - * Clear all To recipients. - * @return void - */ - public function clearAddresses() - { - foreach ($this->to as $to) { - unset($this->all_recipients[strtolower($to[0])]); - } - $this->to = array(); - } - - /** - * Clear all CC recipients. - * @return void - */ - public function clearCCs() - { - foreach ($this->cc as $cc) { - unset($this->all_recipients[strtolower($cc[0])]); - } - $this->cc = array(); - } - - /** - * Clear all BCC recipients. - * @return void - */ - public function clearBCCs() - { - foreach ($this->bcc as $bcc) { - unset($this->all_recipients[strtolower($bcc[0])]); - } - $this->bcc = array(); - } - - /** - * Clear all ReplyTo recipients. - * @return void - */ - public function clearReplyTos() - { - $this->ReplyTo = array(); - } - - /** - * Clear all recipient types. - * @return void - */ - public function clearAllRecipients() - { - $this->to = array(); - $this->cc = array(); - $this->bcc = array(); - $this->all_recipients = array(); - } - - /** - * Clear all filesystem, string, and binary attachments. - * @return void - */ - public function clearAttachments() - { - $this->attachment = array(); - } - - /** - * Clear all custom headers. - * @return void - */ - public function clearCustomHeaders() - { - $this->CustomHeader = array(); - } - - /** - * Add an error message to the error container. - * @access protected - * @param string $msg - * @return void - */ - protected function setError($msg) - { - $this->error_count++; - if ($this->Mailer == 'smtp' and !is_null($this->smtp)) { - $lasterror = $this->smtp->getError(); - if (!empty($lasterror) and array_key_exists('smtp_msg', $lasterror)) { - $msg .= '
' . $this->lang('smtp_error') . $lasterror['smtp_msg'] . "
\n"; - } - } - $this->ErrorInfo = $msg; - } - - /** - * Return an RFC 822 formatted date. - * @access public - * @return string - * @static - */ - public static function rfcDate() - { - // Set the time zone to whatever the default is to avoid 500 errors - // Will default to UTC if it's not set properly in php.ini - date_default_timezone_set(@date_default_timezone_get()); - return date('D, j M Y H:i:s O'); - } - - /** - * Get the server hostname. - * Returns 'localhost.localdomain' if unknown. - * @access protected - * @return string - */ - protected function serverHostname() - { - $result = 'localhost.localdomain'; - if (!empty($this->Hostname)) { - $result = $this->Hostname; - } elseif (isset($_SERVER) and array_key_exists('SERVER_NAME', $_SERVER) and !empty($_SERVER['SERVER_NAME'])) { - $result = $_SERVER['SERVER_NAME']; - } elseif (function_exists('gethostname') && gethostname() !== false) { - $result = gethostname(); - } elseif (php_uname('n') !== false) { - $result = php_uname('n'); - } - return $result; - } - - /** - * Get an error message in the current language. - * @access protected - * @param string $key - * @return string - */ - protected function lang($key) - { - if (count($this->language) < 1) { - $this->setLanguage('en'); // set the default language - } - - if (isset($this->language[$key])) { - return $this->language[$key]; - } else { - return 'Language string failed to load: ' . $key; - } - } - - /** - * Check if an error occurred. - * @access public - * @return boolean True if an error did occur. - */ - public function isError() - { - return ($this->error_count > 0); - } - - /** - * Ensure consistent line endings in a string. - * Changes every end of line from CRLF, CR or LF to $this->LE. - * @access public - * @param string $str String to fixEOL - * @return string - */ - public function fixEOL($str) - { - // Normalise to \n - $nstr = str_replace(array("\r\n", "\r"), "\n", $str); - // Now convert LE as needed - if ($this->LE !== "\n") { - $nstr = str_replace("\n", $this->LE, $nstr); - } - return $nstr; - } - - /** - * Add a custom header. - * $name value can be overloaded to contain - * both header name and value (name:value) - * @access public - * @param string $name Custom header name - * @param string $value Header value - * @return void - */ - public function addCustomHeader($name, $value = null) - { - if ($value === null) { - // Value passed in as name:value - $this->CustomHeader[] = explode(':', $name, 2); - } else { - $this->CustomHeader[] = array($name, $value); - } - } - - /** - * Create a message from an HTML string. - * Automatically makes modifications for inline images and backgrounds - * and creates a plain-text version by converting the HTML. - * Overwrites any existing values in $this->Body and $this->AltBody - * @access public - * @param string $message HTML message string - * @param string $basedir baseline directory for path - * @param boolean|callable $advanced Whether to use the internal HTML to text converter - * or your own custom converter @see html2text() - * @return string $message - */ - public function msgHTML($message, $basedir = '', $advanced = false) - { - preg_match_all('/(src|background)=["\'](.*)["\']/Ui', $message, $images); - if (isset($images[2])) { - foreach ($images[2] as $imgindex => $url) { - // Convert data URIs into embedded images - if (preg_match('#^data:(image[^;,]*)(;base64)?,#', $url, $match)) { - $data = substr($url, strpos($url, ',')); - if ($match[2]) { - $data = base64_decode($data); - } else { - $data = rawurldecode($data); - } - $cid = md5($url) . '@phpmailer.0'; // RFC2392 S 2 - if ($this->addStringEmbeddedImage($data, $cid, '', 'base64', $match[1])) { - $message = str_replace( - $images[0][$imgindex], - $images[1][$imgindex] . '="cid:' . $cid . '"', - $message - ); - } - } elseif (!preg_match('#^[A-z]+://#', $url)) { - // Do not change urls for absolute images (thanks to corvuscorax) - $filename = basename($url); - $directory = dirname($url); - if ($directory == '.') { - $directory = ''; - } - $cid = md5($url) . '@phpmailer.0'; // RFC2392 S 2 - if (strlen($basedir) > 1 && substr($basedir, -1) != '/') { - $basedir .= '/'; - } - if (strlen($directory) > 1 && substr($directory, -1) != '/') { - $directory .= '/'; - } - if ($this->addEmbeddedImage( - $basedir . $directory . $filename, - $cid, - $filename, - 'base64', - self::_mime_types((string)self::mb_pathinfo($filename, PATHINFO_EXTENSION)) - ) - ) { - $message = preg_replace( - '/' . $images[1][$imgindex] . '=["\']' . preg_quote($url, '/') . '["\']/Ui', - $images[1][$imgindex] . '="cid:' . $cid . '"', - $message - ); - } - } - } - } - $this->isHTML(true); - // Convert all message body line breaks to CRLF, makes quoted-printable encoding work much better - $this->Body = $this->normalizeBreaks($message); - $this->AltBody = $this->normalizeBreaks($this->html2text($message, $advanced)); - if (empty($this->AltBody)) { - $this->AltBody = 'To view this email message, open it in a program that understands HTML!' . - self::CRLF . self::CRLF; - } - return $this->Body; - } - - /** - * Convert an HTML string into plain text. - * This is used by msgHTML(). - * Note - older versions of this function used a bundled advanced converter - * which was been removed for license reasons in #232 - * Example usage: - *
- * // Use default conversion
- * $plain = $mail->html2text($html);
- * // Use your own custom converter
- * $plain = $mail->html2text($html, function($html) {
- * $converter = new MyHtml2text($html);
- * return $converter->get_text();
- * });
- *
- * @param string $html The HTML text to convert
- * @param boolean|callable $advanced Any boolean value to use the internal converter,
- * or provide your own callable for custom conversion.
- * @return string
- */
- public function html2text($html, $advanced = false)
- {
- if (is_callable($advanced)) {
- return call_user_func($advanced, $html);
- }
- return html_entity_decode(
- trim(strip_tags(preg_replace('/<(head|title|style|script)[^>]*>.*?<\/\\1>/si', '', $html))),
- ENT_QUOTES,
- $this->CharSet
- );
- }
-
- /**
- * Get the MIME type for a file extension.
- * @param string $ext File extension
- * @access public
- * @return string MIME type of file.
- * @static
- */
- public static function _mime_types($ext = '')
- {
- $mimes = array(
- 'xl' => 'application/excel',
- 'js' => 'application/javascript',
- 'hqx' => 'application/mac-binhex40',
- 'cpt' => 'application/mac-compactpro',
- 'bin' => 'application/macbinary',
- 'doc' => 'application/msword',
- 'word' => 'application/msword',
- 'class' => 'application/octet-stream',
- 'dll' => 'application/octet-stream',
- 'dms' => 'application/octet-stream',
- 'exe' => 'application/octet-stream',
- 'lha' => 'application/octet-stream',
- 'lzh' => 'application/octet-stream',
- 'psd' => 'application/octet-stream',
- 'sea' => 'application/octet-stream',
- 'so' => 'application/octet-stream',
- 'oda' => 'application/oda',
- 'pdf' => 'application/pdf',
- 'ai' => 'application/postscript',
- 'eps' => 'application/postscript',
- 'ps' => 'application/postscript',
- 'smi' => 'application/smil',
- 'smil' => 'application/smil',
- 'mif' => 'application/vnd.mif',
- 'xls' => 'application/vnd.ms-excel',
- 'ppt' => 'application/vnd.ms-powerpoint',
- 'wbxml' => 'application/vnd.wap.wbxml',
- 'wmlc' => 'application/vnd.wap.wmlc',
- 'dcr' => 'application/x-director',
- 'dir' => 'application/x-director',
- 'dxr' => 'application/x-director',
- 'dvi' => 'application/x-dvi',
- 'gtar' => 'application/x-gtar',
- 'php3' => 'application/x-httpd-php',
- 'php4' => 'application/x-httpd-php',
- 'php' => 'application/x-httpd-php',
- 'phtml' => 'application/x-httpd-php',
- 'phps' => 'application/x-httpd-php-source',
- 'swf' => 'application/x-shockwave-flash',
- 'sit' => 'application/x-stuffit',
- 'tar' => 'application/x-tar',
- 'tgz' => 'application/x-tar',
- 'xht' => 'application/xhtml+xml',
- 'xhtml' => 'application/xhtml+xml',
- 'zip' => 'application/zip',
- 'mid' => 'audio/midi',
- 'midi' => 'audio/midi',
- 'mp2' => 'audio/mpeg',
- 'mp3' => 'audio/mpeg',
- 'mpga' => 'audio/mpeg',
- 'aif' => 'audio/x-aiff',
- 'aifc' => 'audio/x-aiff',
- 'aiff' => 'audio/x-aiff',
- 'ram' => 'audio/x-pn-realaudio',
- 'rm' => 'audio/x-pn-realaudio',
- 'rpm' => 'audio/x-pn-realaudio-plugin',
- 'ra' => 'audio/x-realaudio',
- 'wav' => 'audio/x-wav',
- 'bmp' => 'image/bmp',
- 'gif' => 'image/gif',
- 'jpeg' => 'image/jpeg',
- 'jpe' => 'image/jpeg',
- 'jpg' => 'image/jpeg',
- 'png' => 'image/png',
- 'tiff' => 'image/tiff',
- 'tif' => 'image/tiff',
- 'eml' => 'message/rfc822',
- 'css' => 'text/css',
- 'html' => 'text/html',
- 'htm' => 'text/html',
- 'shtml' => 'text/html',
- 'log' => 'text/plain',
- 'text' => 'text/plain',
- 'txt' => 'text/plain',
- 'rtx' => 'text/richtext',
- 'rtf' => 'text/rtf',
- 'vcf' => 'text/vcard',
- 'vcard' => 'text/vcard',
- 'xml' => 'text/xml',
- 'xsl' => 'text/xml',
- 'mpeg' => 'video/mpeg',
- 'mpe' => 'video/mpeg',
- 'mpg' => 'video/mpeg',
- 'mov' => 'video/quicktime',
- 'qt' => 'video/quicktime',
- 'rv' => 'video/vnd.rn-realvideo',
- 'avi' => 'video/x-msvideo',
- 'movie' => 'video/x-sgi-movie'
- );
- return (array_key_exists(strtolower($ext), $mimes) ? $mimes[strtolower($ext)]: 'application/octet-stream');
- }
-
- /**
- * Map a file name to a MIME type.
- * Defaults to 'application/octet-stream', i.e.. arbitrary binary data.
- * @param string $filename A file name or full path, does not need to exist as a file
- * @return string
- * @static
- */
- public static function filenameToType($filename)
- {
- // In case the path is a URL, strip any query string before getting extension
- $qpos = strpos($filename, '?');
- if (false !== $qpos) {
- $filename = substr($filename, 0, $qpos);
- }
- $pathinfo = self::mb_pathinfo($filename);
- return self::_mime_types($pathinfo['extension']);
- }
-
- /**
- * Multi-byte-safe pathinfo replacement.
- * Drop-in replacement for pathinfo(), but multibyte-safe, cross-platform-safe, old-version-safe.
- * Works similarly to the one in PHP >= 5.2.0
- * @link http://www.php.net/manual/en/function.pathinfo.php#107461
- * @param string $path A filename or path, does not need to exist as a file
- * @param integer|string $options Either a PATHINFO_* constant,
- * or a string name to return only the specified piece, allows 'filename' to work on PHP < 5.2
- * @return string|array
- * @static
- */
- public static function mb_pathinfo($path, $options = null)
- {
- $ret = array('dirname' => '', 'basename' => '', 'extension' => '', 'filename' => '');
- $pathinfo = array();
- if (preg_match('%^(.*?)[\\\\/]*(([^/\\\\]*?)(\.([^\.\\\\/]+?)|))[\\\\/\.]*$%im', $path, $pathinfo)) {
- if (array_key_exists(1, $pathinfo)) {
- $ret['dirname'] = $pathinfo[1];
- }
- if (array_key_exists(2, $pathinfo)) {
- $ret['basename'] = $pathinfo[2];
- }
- if (array_key_exists(5, $pathinfo)) {
- $ret['extension'] = $pathinfo[5];
- }
- if (array_key_exists(3, $pathinfo)) {
- $ret['filename'] = $pathinfo[3];
- }
- }
- switch ($options) {
- case PATHINFO_DIRNAME:
- case 'dirname':
- return $ret['dirname'];
- case PATHINFO_BASENAME:
- case 'basename':
- return $ret['basename'];
- case PATHINFO_EXTENSION:
- case 'extension':
- return $ret['extension'];
- case PATHINFO_FILENAME:
- case 'filename':
- return $ret['filename'];
- default:
- return $ret;
- }
- }
-
- /**
- * Set or reset instance properties.
- *
- * Usage Example:
- * $page->set('X-Priority', '3');
- *
- * @access public
- * @param string $name
- * @param mixed $value
- * NOTE: will not work with arrays, there are no arrays to set/reset
- * @throws phpmailerException
- * @return boolean
- * @TODO Should this not be using __set() magic function?
- */
- public function set($name, $value = '')
- {
- try {
- if (isset($this->$name)) {
- $this->$name = $value;
- } else {
- throw new phpmailerException($this->lang('variable_set') . $name, self::STOP_CRITICAL);
- }
- } catch (Exception $exc) {
- $this->setError($exc->getMessage());
- if ($exc->getCode() == self::STOP_CRITICAL) {
- return false;
- }
- }
- return true;
- }
-
- /**
- * Strip newlines to prevent header injection.
- * @access public
- * @param string $str
- * @return string
- */
- public function secureHeader($str)
- {
- return trim(str_replace(array("\r", "\n"), '', $str));
- }
-
- /**
- * Normalize line breaks in a string.
- * Converts UNIX LF, Mac CR and Windows CRLF line breaks into a single line break format.
- * Defaults to CRLF (for message bodies) and preserves consecutive breaks.
- * @param string $text
- * @param string $breaktype What kind of line break to use, defaults to CRLF
- * @return string
- * @access public
- * @static
- */
- public static function normalizeBreaks($text, $breaktype = "\r\n")
- {
- return preg_replace('/(\r\n|\r|\n)/ms', $breaktype, $text);
- }
-
-
- /**
- * Set the public and private key files and password for S/MIME signing.
- * @access public
- * @param string $cert_filename
- * @param string $key_filename
- * @param string $key_pass Password for private key
- */
- public function sign($cert_filename, $key_filename, $key_pass)
- {
- $this->sign_cert_file = $cert_filename;
- $this->sign_key_file = $key_filename;
- $this->sign_key_pass = $key_pass;
- }
-
- /**
- * Quoted-Printable-encode a DKIM header.
- * @access public
- * @param string $txt
- * @return string
- */
- public function DKIM_QP($txt)
- {
- $line = '';
- for ($i = 0; $i < strlen($txt); $i++) {
- $ord = ord($txt[$i]);
- if (((0x21 <= $ord) && ($ord <= 0x3A)) || $ord == 0x3C || ((0x3E <= $ord) && ($ord <= 0x7E))) {
- $line .= $txt[$i];
- } else {
- $line .= '=' . sprintf('%02X', $ord);
- }
- }
- return $line;
- }
-
- /**
- * Generate a DKIM signature.
- * @access public
- * @param string $signHeader
- * @throws phpmailerException
- * @return string
- */
- public function DKIM_Sign($signHeader)
- {
- if (!defined('PKCS7_TEXT')) {
- if ($this->exceptions) {
- throw new phpmailerException($this->lang('signing') . ' OpenSSL extension missing.');
- }
- return '';
- }
- $privKeyStr = file_get_contents($this->DKIM_private);
- if ($this->DKIM_passphrase != '') {
- $privKey = openssl_pkey_get_private($privKeyStr, $this->DKIM_passphrase);
- } else {
- $privKey = $privKeyStr;
- }
- if (openssl_sign($signHeader, $signature, $privKey)) {
- return base64_encode($signature);
- }
- return '';
- }
-
- /**
- * Generate a DKIM canonicalization header.
- * @access public
- * @param string $signHeader Header
- * @return string
- */
- public function DKIM_HeaderC($signHeader)
- {
- $signHeader = preg_replace('/\r\n\s+/', ' ', $signHeader);
- $lines = explode("\r\n", $signHeader);
- foreach ($lines as $key => $line) {
- list($heading, $value) = explode(':', $line, 2);
- $heading = strtolower($heading);
- $value = preg_replace('/\s+/', ' ', $value); // Compress useless spaces
- $lines[$key] = $heading . ':' . trim($value); // Don't forget to remove WSP around the value
- }
- $signHeader = implode("\r\n", $lines);
- return $signHeader;
- }
-
- /**
- * Generate a DKIM canonicalization body.
- * @access public
- * @param string $body Message Body
- * @return string
- */
- public function DKIM_BodyC($body)
- {
- if ($body == '') {
- return "\r\n";
- }
- // stabilize line endings
- $body = str_replace("\r\n", "\n", $body);
- $body = str_replace("\n", "\r\n", $body);
- // END stabilize line endings
- while (substr($body, strlen($body) - 4, 4) == "\r\n\r\n") {
- $body = substr($body, 0, strlen($body) - 2);
- }
- return $body;
- }
-
- /**
- * Create the DKIM header and body in a new message header.
- * @access public
- * @param string $headers_line Header lines
- * @param string $subject Subject
- * @param string $body Body
- * @return string
- */
- public function DKIM_Add($headers_line, $subject, $body)
- {
- $DKIMsignatureType = 'rsa-sha1'; // Signature & hash algorithms
- $DKIMcanonicalization = 'relaxed/simple'; // Canonicalization of header/body
- $DKIMquery = 'dns/txt'; // Query method
- $DKIMtime = time(); // Signature Timestamp = seconds since 00:00:00 - Jan 1, 1970 (UTC time zone)
- $subject_header = "Subject: $subject";
- $headers = explode($this->LE, $headers_line);
- $from_header = '';
- $to_header = '';
- $current = '';
- foreach ($headers as $header) {
- if (strpos($header, 'From:') === 0) {
- $from_header = $header;
- $current = 'from_header';
- } elseif (strpos($header, 'To:') === 0) {
- $to_header = $header;
- $current = 'to_header';
- } else {
- if ($current && strpos($header, ' =?') === 0) {
- $current .= $header;
- } else {
- $current = '';
- }
- }
- }
- $from = str_replace('|', '=7C', $this->DKIM_QP($from_header));
- $to = str_replace('|', '=7C', $this->DKIM_QP($to_header));
- $subject = str_replace(
- '|',
- '=7C',
- $this->DKIM_QP($subject_header)
- ); // Copied header fields (dkim-quoted-printable)
- $body = $this->DKIM_BodyC($body);
- $DKIMlen = strlen($body); // Length of body
- $DKIMb64 = base64_encode(pack('H*', sha1($body))); // Base64 of packed binary SHA-1 hash of body
- $ident = ($this->DKIM_identity == '') ? '' : ' i=' . $this->DKIM_identity . ';';
- $dkimhdrs = 'DKIM-Signature: v=1; a=' .
- $DKIMsignatureType . '; q=' .
- $DKIMquery . '; l=' .
- $DKIMlen . '; s=' .
- $this->DKIM_selector .
- ";\r\n" .
- "\tt=" . $DKIMtime . '; c=' . $DKIMcanonicalization . ";\r\n" .
- "\th=From:To:Subject;\r\n" .
- "\td=" . $this->DKIM_domain . ';' . $ident . "\r\n" .
- "\tz=$from\r\n" .
- "\t|$to\r\n" .
- "\t|$subject;\r\n" .
- "\tbh=" . $DKIMb64 . ";\r\n" .
- "\tb=";
- $toSign = $this->DKIM_HeaderC(
- $from_header . "\r\n" . $to_header . "\r\n" . $subject_header . "\r\n" . $dkimhdrs
- );
- $signed = $this->DKIM_Sign($toSign);
- return $dkimhdrs . $signed . "\r\n";
- }
-
- /**
- * Allows for public read access to 'to' property.
- * @access public
- * @return array
- */
- public function getToAddresses()
- {
- return $this->to;
- }
-
- /**
- * Allows for public read access to 'cc' property.
- * @access public
- * @return array
- */
- public function getCcAddresses()
- {
- return $this->cc;
- }
-
- /**
- * Allows for public read access to 'bcc' property.
- * @access public
- * @return array
- */
- public function getBccAddresses()
- {
- return $this->bcc;
- }
-
- /**
- * Allows for public read access to 'ReplyTo' property.
- * @access public
- * @return array
- */
- public function getReplyToAddresses()
- {
- return $this->ReplyTo;
- }
-
- /**
- * Allows for public read access to 'all_recipients' property.
- * @access public
- * @return array
- */
- public function getAllRecipientAddresses()
- {
- return $this->all_recipients;
- }
-
- /**
- * Perform a callback.
- * @param boolean $isSent
- * @param array $to
- * @param array $cc
- * @param array $bcc
- * @param string $subject
- * @param string $body
- * @param string $from
- */
- protected function doCallback($isSent, $to, $cc, $bcc, $subject, $body, $from)
- {
- if (!empty($this->action_function) && is_callable($this->action_function)) {
- $params = array($isSent, $to, $cc, $bcc, $subject, $body, $from);
- call_user_func_array($this->action_function, $params);
- }
- }
-}
-
-/**
- * PHPMailer exception handler
- * @package PHPMailer
- */
-class phpmailerException extends Exception
-{
- /**
- * Prettify error message output
- * @return string
- */
- public function errorMessage()
- {
- $errorMsg = '' . $this->getMessage() . "\n"; - return $errorMsg; - } -} diff --git a/download/phpmailer529/class.pop3.php b/download/phpmailer529/class.pop3.php deleted file mode 100755 index 984885ff0..000000000 --- a/download/phpmailer529/class.pop3.php +++ /dev/null @@ -1,397 +0,0 @@ - - * @author Jim Jagielski (jimjag)
';
- foreach ($this->errors as $error) {
- print_r($error);
- }
- echo '';
- }
- }
-
- /**
- * POP3 connection error handler.
- * @param integer $errno
- * @param string $errstr
- * @param string $errfile
- * @param integer $errline
- * @access private
- */
- private function catchWarning($errno, $errstr, $errfile, $errline)
- {
- $this->setError(array(
- 'error' => "Connecting to the POP3 server raised a PHP warning: ",
- 'errno' => $errno,
- 'errstr' => $errstr,
- 'errfile' => $errfile,
- 'errline' => $errline
- ));
- }
-}
diff --git a/download/phpmailer529/class.smtp.php b/download/phpmailer529/class.smtp.php
deleted file mode 100755
index d6991970f..000000000
--- a/download/phpmailer529/class.smtp.php
+++ /dev/null
@@ -1,1132 +0,0 @@
-
- * @author Jim Jagielski (jimjag) `, appropriate for browser output - * * `error_log` Output to error log as configured in php.ini - * - * Alternatively, you can provide a callable expecting two params: a message string and the debug level: - *
- * $smtp->Debugoutput = function($str, $level) {echo "debug level $level; message: $str";};
- *
- * @type string|callable
- */
- public $Debugoutput = 'echo';
-
- /**
- * Whether to use VERP.
- * @link http://en.wikipedia.org/wiki/Variable_envelope_return_path
- * @link http://www.postfix.org/VERP_README.html Info on VERP
- * @type boolean
- */
- public $do_verp = false;
-
- /**
- * The timeout value for connection, in seconds.
- * Default of 5 minutes (300sec) is from RFC2821 section 4.5.3.2
- * This needs to be quite high to function correctly with hosts using greetdelay as an anti-spam measure.
- * @link http://tools.ietf.org/html/rfc2821#section-4.5.3.2
- * @type integer
- */
- public $Timeout = 300;
-
- /**
- * How long to wait for commands to complete, in seconds.
- * Default of 5 minutes (300sec) is from RFC2821 section 4.5.3.2
- * @type integer
- */
- public $Timelimit = 300;
-
- /**
- * The socket for the server connection.
- * @type resource
- */
- protected $smtp_conn;
-
- /**
- * Error message, if any, for the last call.
- * @type array
- */
- protected $error = array();
-
- /**
- * The reply the server sent to us for HELO.
- * If null, no HELO string has yet been received.
- * @type string|null
- */
- protected $helo_rply = null;
-
- /**
- * The set of SMTP extensions sent in reply to EHLO command.
- * Indexes of the array are extension names.
- * Value at index 'HELO' or 'EHLO' (according to command that was sent)
- * represents the server name. In case of HELO it is the only element of the array.
- * Other values can be boolean TRUE or an array containing extension options.
- * If null, no HELO/EHLO string has yet been received.
- * @type array|null
- */
- protected $server_caps = null;
-
- /**
- * The most recent reply received from the server.
- * @type string
- */
- protected $last_reply = '';
-
- /**
- * Output debugging info via a user-selected method.
- * @see SMTP::$Debugoutput
- * @see SMTP::$do_debug
- * @param string $str Debug string to output
- * @param integer $level The debug level of this message; see DEBUG_* constants
- * @return void
- */
- protected function edebug($str, $level = 0)
- {
- if ($level > $this->do_debug) {
- return;
- }
- //Avoid clash with built-in function names
- if (!in_array($this->Debugoutput, array('error_log', 'html', 'echo')) and is_callable($this->Debugoutput)) {
- call_user_func($this->Debugoutput, $str, $this->do_debug);
- return;
- }
- switch ($this->Debugoutput) {
- case 'error_log':
- //Don't output, just log
- error_log($str);
- break;
- case 'html':
- //Cleans up output a bit for a better looking, HTML-safe output
- echo htmlentities(
- preg_replace('/[\r\n]+/', '', $str),
- ENT_QUOTES,
- 'UTF-8'
- )
- . "\n"; - break; - case 'echo': - default: - //Normalize line breaks - $str = preg_replace('/(\r\n|\r|\n)/ms', "\n", $str); - echo gmdate('Y-m-d H:i:s') . "\t" . str_replace( - "\n", - "\n \t ", - trim($str) - )."\n"; - } - } - - /** - * Connect to an SMTP server. - * @param string $host SMTP server IP or host name - * @param integer $port The port number to connect to - * @param integer $timeout How long to wait for the connection to open - * @param array $options An array of options for stream_context_create() - * @access public - * @return boolean - */ - public function connect($host, $port = null, $timeout = 30, $options = array()) - { - static $streamok; - //This is enabled by default since 5.0.0 but some providers disable it - //Check this once and cache the result - if (is_null($streamok)) { - $streamok = function_exists('stream_socket_client'); - } - // Clear errors to avoid confusion - $this->error = array(); - // Make sure we are __not__ connected - if ($this->connected()) { - // Already connected, generate error - $this->error = array('error' => 'Already connected to a server'); - return false; - } - if (empty($port)) { - $port = self::DEFAULT_SMTP_PORT; - } - // Connect to the SMTP server - $this->edebug( - "Connection: opening to $host:$port, t=$timeout, opt=".var_export($options, true), - self::DEBUG_CONNECTION - ); - $errno = 0; - $errstr = ''; - if ($streamok) { - $socket_context = stream_context_create($options); - //Suppress errors; connection failures are handled at a higher level - $this->smtp_conn = @stream_socket_client( - $host . ":" . $port, - $errno, - $errstr, - $timeout, - STREAM_CLIENT_CONNECT, - $socket_context - ); - } else { - //Fall back to fsockopen which should work in more places, but is missing some features - $this->edebug( - "Connection: stream_socket_client not available, falling back to fsockopen", - self::DEBUG_CONNECTION - ); - $this->smtp_conn = fsockopen( - $host, - $port, - $errno, - $errstr, - $timeout - ); - } - // Verify we connected properly - if (!is_resource($this->smtp_conn)) { - $this->error = array( - 'error' => 'Failed to connect to server', - 'errno' => $errno, - 'errstr' => $errstr - ); - $this->edebug( - 'SMTP ERROR: ' . $this->error['error'] - . ": $errstr ($errno)", - self::DEBUG_CLIENT - ); - return false; - } - $this->edebug('Connection: opened', self::DEBUG_CONNECTION); - // SMTP server can take longer to respond, give longer timeout for first read - // Windows does not have support for this timeout function - if (substr(PHP_OS, 0, 3) != 'WIN') { - $max = ini_get('max_execution_time'); - if ($max != 0 && $timeout > $max) { // Don't bother if unlimited - @set_time_limit($timeout); - } - stream_set_timeout($this->smtp_conn, $timeout, 0); - } - // Get any announcement - $announce = $this->get_lines(); - $this->edebug('SERVER -> CLIENT: ' . $announce, self::DEBUG_SERVER); - return true; - } - - /** - * Initiate a TLS (encrypted) session. - * @access public - * @return boolean - */ - public function startTLS() - { - if (!$this->sendCommand('STARTTLS', 'STARTTLS', 220)) { - return false; - } - // Begin encrypted connection - if (!stream_socket_enable_crypto( - $this->smtp_conn, - true, - STREAM_CRYPTO_METHOD_TLS_CLIENT - )) { - return false; - } - return true; - } - - /** - * Perform SMTP authentication. - * Must be run after hello(). - * @see hello() - * @param string $username The user name - * @param string $password The password - * @param string $authtype The auth type (PLAIN, LOGIN, NTLM, CRAM-MD5) - * @param string $realm The auth realm for NTLM - * @param string $workstation The auth workstation for NTLM - * @access public - * @return boolean True if successfully authenticated. - */ - public function authenticate( - $username, - $password, - $authtype = null, - $realm = '', - $workstation = '' - ) { - if (!$this->server_caps) { - $this->error = array('error' => 'Authentication is not allowed before HELO/EHLO'); - return false; - } - - if (array_key_exists('EHLO', $this->server_caps)) { - // SMTP extensions are available. Let's try to find a proper authentication method - - if (!array_key_exists('AUTH', $this->server_caps)) { - $this->error = array( 'error' => 'Authentication is not allowed at this stage' ); - // 'at this stage' means that auth may be allowed after the stage changes - // e.g. after STARTTLS - return false; - } - - self::edebug('Auth method requested: ' . ($authtype ? $authtype : 'UNKNOWN'), self::DEBUG_LOWLEVEL); - self::edebug( - 'Auth methods available on the server: ' . implode(',', $this->server_caps['AUTH']), - self::DEBUG_LOWLEVEL - ); - - if (empty($authtype)) { - foreach (array('LOGIN', 'CRAM-MD5', 'NTLM', 'PLAIN') as $method) { - if (in_array($method, $this->server_caps['AUTH'])) { - $authtype = $method; - break; - } - } - if (empty($authtype)) { - $this->error = array( 'error' => 'No supported authentication methods found' ); - return false; - } - self::edebug('Auth method selected: '.$authtype, self::DEBUG_LOWLEVEL); - } - - if (!in_array($authtype, $this->server_caps['AUTH'])) { - $this->error = array( 'error' => 'The requested authentication method "' - . $authtype . '" is not supported by the server' ); - return false; - } - } elseif (empty($authtype)) { - $authtype = 'LOGIN'; - } - switch ($authtype) { - case 'PLAIN': - // Start authentication - if (!$this->sendCommand('AUTH', 'AUTH PLAIN', 334)) { - return false; - } - // Send encoded username and password - if (!$this->sendCommand( - 'User & Password', - base64_encode("\0" . $username . "\0" . $password), - 235 - ) - ) { - return false; - } - break; - case 'LOGIN': - // Start authentication - if (!$this->sendCommand('AUTH', 'AUTH LOGIN', 334)) { - return false; - } - if (!$this->sendCommand("Username", base64_encode($username), 334)) { - return false; - } - if (!$this->sendCommand("Password", base64_encode($password), 235)) { - return false; - } - break; - case 'NTLM': - /* - * ntlm_sasl_client.php - * Bundled with Permission - * - * How to telnet in windows: - * http://technet.microsoft.com/en-us/library/aa995718%28EXCHG.65%29.aspx - * PROTOCOL Docs http://curl.haxx.se/rfc/ntlm.html#ntlmSmtpAuthentication - */ - require_once 'extras/ntlm_sasl_client.php'; - $temp = new stdClass(); - $ntlm_client = new ntlm_sasl_client_class; - //Check that functions are available - if (!$ntlm_client->Initialize($temp)) { - $this->error = array('error' => $temp->error); - $this->edebug( - 'You need to enable some modules in your php.ini file: ' - . $this->error['error'], - self::DEBUG_CLIENT - ); - return false; - } - //msg1 - $msg1 = $ntlm_client->TypeMsg1($realm, $workstation); //msg1 - - if (!$this->sendCommand( - 'AUTH NTLM', - 'AUTH NTLM ' . base64_encode($msg1), - 334 - ) - ) { - return false; - } - //Though 0 based, there is a white space after the 3 digit number - //msg2 - $challenge = substr($this->last_reply, 3); - $challenge = base64_decode($challenge); - $ntlm_res = $ntlm_client->NTLMResponse( - substr($challenge, 24, 8), - $password - ); - //msg3 - $msg3 = $ntlm_client->TypeMsg3( - $ntlm_res, - $username, - $realm, - $workstation - ); - // send encoded username - return $this->sendCommand('Username', base64_encode($msg3), 235); - case 'CRAM-MD5': - // Start authentication - if (!$this->sendCommand('AUTH CRAM-MD5', 'AUTH CRAM-MD5', 334)) { - return false; - } - // Get the challenge - $challenge = base64_decode(substr($this->last_reply, 4)); - - // Build the response - $response = $username . ' ' . $this->hmac($challenge, $password); - - // send encoded credentials - return $this->sendCommand('Username', base64_encode($response), 235); - default: - $this->error = array( 'error' => 'Authentication method "' . $authtype . '" is not supported' ); - return false; - } - return true; - } - - /** - * Calculate an MD5 HMAC hash. - * Works like hash_hmac('md5', $data, $key) - * in case that function is not available - * @param string $data The data to hash - * @param string $key The key to hash with - * @access protected - * @return string - */ - protected function hmac($data, $key) - { - if (function_exists('hash_hmac')) { - return hash_hmac('md5', $data, $key); - } - - // The following borrowed from - // http://php.net/manual/en/function.mhash.php#27225 - - // RFC 2104 HMAC implementation for php. - // Creates an md5 HMAC. - // Eliminates the need to install mhash to compute a HMAC - // by Lance Rushing - - $bytelen = 64; // byte length for md5 - if (strlen($key) > $bytelen) { - $key = pack('H*', md5($key)); - } - $key = str_pad($key, $bytelen, chr(0x00)); - $ipad = str_pad('', $bytelen, chr(0x36)); - $opad = str_pad('', $bytelen, chr(0x5c)); - $k_ipad = $key ^ $ipad; - $k_opad = $key ^ $opad; - - return md5($k_opad . pack('H*', md5($k_ipad . $data))); - } - - /** - * Check connection state. - * @access public - * @return boolean True if connected. - */ - public function connected() - { - if (is_resource($this->smtp_conn)) { - $sock_status = stream_get_meta_data($this->smtp_conn); - if ($sock_status['eof']) { - // The socket is valid but we are not connected - $this->edebug( - 'SMTP NOTICE: EOF caught while checking if connected', - self::DEBUG_CLIENT - ); - $this->close(); - return false; - } - return true; // everything looks good - } - return false; - } - - /** - * Close the socket and clean up the state of the class. - * Don't use this function without first trying to use QUIT. - * @see quit() - * @access public - * @return void - */ - public function close() - { - $this->error = array(); - $this->server_caps = null; - $this->helo_rply = null; - if (is_resource($this->smtp_conn)) { - // close the connection and cleanup - fclose($this->smtp_conn); - $this->smtp_conn = null; //Makes for cleaner serialization - $this->edebug('Connection: closed', self::DEBUG_CONNECTION); - } - } - - /** - * Send an SMTP DATA command. - * Issues a data command and sends the msg_data to the server, - * finializing the mail transaction. $msg_data is the message - * that is to be send with the headers. Each header needs to be - * on a single line followed by a
Examples using PHPMailer
- -1. Advanced Example
-- -This demonstrates sending multiple email messages with binary attachments -from a MySQL database using multipart/alternative messages.
- -
-require 'PHPMailerAutoload.php';
-
-$mail = new PHPMailer();
-
-$mail->From = 'list@example.com';
-$mail->FromName = 'List manager';
-$mail->Host = 'smtp1.example.com;smtp2.example.com';
-$mail->Mailer = 'smtp';
-
-@mysqli_connect('localhost','root','password');
-@mysqli_select_db("my_company");
-$query = "SELECT full_name, email, photo FROM employee";
-$result = @mysqli_query($query);
-
-while ($row = mysqli_fetch_assoc($result))
-{
- // HTML body
- $body = "Hello <font size=\"4\">" . $row['full_name'] . "</font>, <p>";
- $body .= "<i>Your</i> personal photograph to this message.<p>";
- $body .= "Sincerely, <br>";
- $body .= "phpmailer List manager";
-
- // Plain text body (for mail clients that cannot read HTML)
- $text_body = 'Hello ' . $row['full_name'] . ", \n\n";
- $text_body .= "Your personal photograph to this message.\n\n";
- $text_body .= "Sincerely, \n";
- $text_body .= 'phpmailer List manager';
-
- $mail->Body = $body;
- $mail->AltBody = $text_body;
- $mail->addAddress($row['email'], $row['full_name']);
- $mail->addStringAttachment($row['photo'], 'YourPhoto.jpg');
-
- if(!$mail->send())
- echo "There has been a mail error sending to " . $row['email'] . "<br>";
-
- // Clear all addresses and attachments for next loop
- $mail->clearAddresses();
- $mail->clearAttachments();
-}
-
-- -
2. Extending PHPMailer
-- -Extending classes with inheritance is one of the most -powerful features of object-oriented programming. It allows you to make changes to the -original class for your own personal use without hacking the original -classes, and it's very easy to do: - -
-Here's a class that extends the phpmailer class and sets the defaults
-for the particular site:
-PHP include file: my_phpmailer.php
-
- -
-require 'PHPMailerAutoload.php';
-
-class my_phpmailer extends PHPMailer {
- // Set default variables for all new objects
- public $From = 'from@example.com';
- public $FromName = 'Mailer';
- public $Host = 'smtp1.example.com;smtp2.example.com';
- public $Mailer = 'smtp'; // Alternative to isSMTP()
- public $WordWrap = 75;
-
- // Replace the default debug output function
- protected function edebug($msg) {
- print('My Site Error');
- print('Description:');
- printf('%s', $msg);
- exit;
- }
-
- //Extend the send function
- public function send() {
- $this->Subject = '[Yay for me!] '.$this->Subject;
- return parent::send()
- }
-
- // Create an additional function
- public function do_something($something) {
- // Place your new code here
- }
-}
-
--Now here's a normal PHP page in the site, which will have all the defaults set above:
- -
-require 'my_phpmailer.php';
-
-// Instantiate your new class
-$mail = new my_phpmailer;
-
-// Now you only need to add the necessary stuff
-$mail->addAddress('josh@example.com', 'Josh Adams');
-$mail->Subject = 'Here is the subject';
-$mail->Body = 'This is the message body';
-$mail->addAttachment('c:/temp/11-10-00.zip', 'new_name.zip'); // optional name
-
-if(!$mail->send())
-{
- echo 'There was an error sending the message';
- exit;
-}
-
-echo 'Message was sent successfully';
-
-
-
diff --git a/download/phpmailer529/docs/faq.html b/download/phpmailer529/docs/faq.html
deleted file mode 100755
index 7033a142e..000000000
--- a/download/phpmailer529/docs/faq.html
+++ /dev/null
@@ -1,28 +0,0 @@
-
-
-PHPMailer FAQ
--
-
- Q: I am concerned that using include files will take up too much
- processing time on my computer. How can I make it run faster?
- A: PHP by itself is fairly fast, but it recompiles scripts every time they are run, which takes up valuable - computer resources. You can bypass this by using an opcode cache which compiles - PHP code and store it in memory to reduce overhead immensely. APC - (Alternative PHP Cache) is a free opcode cache extension in the PECL library.
- - Q: Which mailer gives me the best performance?
- A: On a single machine the sendmail (or Qmail) is fastest overall. - Next fastest is mail() to give you the best performance. Both do not have the overhead of SMTP. - If you do not have a local mail server (as is typical on Windows), SMTP is your only option.
- - Q: When I try to attach a file with on my server I get a
- "Could not find {file} on filesystem error". Why is this?
- A: If you are using a Unix machine this is probably because the user - running your web server does not have read access to the directory in question. If you are using Windows, - then the problem is probably that you have used single backslashes to denote directories (\). - A single backslash has a special meaning to PHP so these are not - valid. Instead use double backslashes ("\\") or a single forward - slash ("/").
-
Run results
\\n\";"; -$example_code .= "\n echo \"- \\n\";";
-$example_code .= "\nforeach (\$results_messages as \$result) {";
-$example_code .= "\n echo \"
- \$result \\n\";"; -$example_code .= "\n}"; -$example_code .= "\necho \"
Run results
'; - echo '- ';
- foreach ($results_messages as $result) {
- echo "
- $result "; - } - echo '
\n"; - echo "
Script:\n"; - echo "
\n"; - echo $example_code; - echo "\n\n"; - echo "\n
\n"; -} -?> - - - \ No newline at end of file diff --git a/download/phpmailer529/examples/contents.html b/download/phpmailer529/examples/contents.html deleted file mode 100755 index 9257f6dd9..000000000 --- a/download/phpmailer529/examples/contents.html +++ /dev/null @@ -1,17 +0,0 @@ - - - - -
-
-
-
diff --git a/download/phpmailer529/examples/exceptions.phps b/download/phpmailer529/examples/exceptions.phps
deleted file mode 100755
index 0e941e733..000000000
--- a/download/phpmailer529/examples/exceptions.phps
+++ /dev/null
@@ -1,35 +0,0 @@
-setFrom('from@example.com', 'First Last');
- //Set an alternative reply-to address
- $mail->addReplyTo('replyto@example.com', 'First Last');
- //Set who the message is to be sent to
- $mail->addAddress('whoto@example.com', 'John Doe');
- //Set the subject line
- $mail->Subject = 'PHPMailer Exceptions test';
- //Read an HTML message body from an external file, convert referenced images to embedded,
- //and convert the HTML into a basic plain-text alternative body
- $mail->msgHTML(file_get_contents('contents.html'), dirname(__FILE__));
- //Replace the plain text body with one created manually
- $mail->AltBody = 'This is a plain-text message body';
- //Attach an image file
- $mail->addAttachment('images/phpmailer_mini.png');
- //send the message
- //Note that we don't need check the response from this because it will throw an exception if it has trouble
- $mail->send();
- echo "Message sent!";
-} catch (phpmailerException $e) {
- echo $e->errorMessage(); //Pretty error messages from PHPMailer
-} catch (Exception $e) {
- echo $e->getMessage(); //Boring error messages from anything else!
-}
diff --git a/download/phpmailer529/examples/gmail.phps b/download/phpmailer529/examples/gmail.phps
deleted file mode 100755
index b020f3380..000000000
--- a/download/phpmailer529/examples/gmail.phps
+++ /dev/null
@@ -1,72 +0,0 @@
-isSMTP();
-
-//Enable SMTP debugging
-// 0 = off (for production use)
-// 1 = client messages
-// 2 = client and server messages
-$mail->SMTPDebug = 2;
-
-//Ask for HTML-friendly debug output
-$mail->Debugoutput = 'html';
-
-//Set the hostname of the mail server
-$mail->Host = 'smtp.gmail.com';
-
-//Set the SMTP port number - 587 for authenticated TLS, a.k.a. RFC4409 SMTP submission
-$mail->Port = 587;
-
-//Set the encryption system to use - ssl (deprecated) or tls
-$mail->SMTPSecure = 'tls';
-
-//Whether to use SMTP authentication
-$mail->SMTPAuth = true;
-
-//Username to use for SMTP authentication - use full email address for gmail
-$mail->Username = "username@gmail.com";
-
-//Password to use for SMTP authentication
-$mail->Password = "yourpassword";
-
-//Set who the message is to be sent from
-$mail->setFrom('from@example.com', 'First Last');
-
-//Set an alternative reply-to address
-$mail->addReplyTo('replyto@example.com', 'First Last');
-
-//Set who the message is to be sent to
-$mail->addAddress('whoto@example.com', 'John Doe');
-
-//Set the subject line
-$mail->Subject = 'PHPMailer GMail SMTP test';
-
-//Read an HTML message body from an external file, convert referenced images to embedded,
-//convert HTML into a basic plain-text alternative body
-$mail->msgHTML(file_get_contents('contents.html'), dirname(__FILE__));
-
-//Replace the plain text body with one created manually
-$mail->AltBody = 'This is a plain-text message body';
-
-//Attach an image file
-$mail->addAttachment('images/phpmailer_mini.png');
-
-//send the message, check for errors
-if (!$mail->send()) {
- echo "Mailer Error: " . $mail->ErrorInfo;
-} else {
- echo "Message sent!";
-}
diff --git a/download/phpmailer529/examples/images/phpmailer.png b/download/phpmailer529/examples/images/phpmailer.png
deleted file mode 100755
index 9bdd83c8d..000000000
Binary files a/download/phpmailer529/examples/images/phpmailer.png and /dev/null differ
diff --git a/download/phpmailer529/examples/images/phpmailer_mini.png b/download/phpmailer529/examples/images/phpmailer_mini.png
deleted file mode 100755
index e6915f431..000000000
Binary files a/download/phpmailer529/examples/images/phpmailer_mini.png and /dev/null differ
diff --git a/download/phpmailer529/examples/index.html b/download/phpmailer529/examples/index.html
deleted file mode 100755
index bbb830d19..000000000
--- a/download/phpmailer529/examples/index.html
+++ /dev/null
@@ -1,48 +0,0 @@
-
-
-
-
- This is a test of PHPMailer.
-
- 
-
-
- This example uses HTML.
-The PHPMailer image at the top has been embedded automatically.
-PHPMailer code examples
-This folder contains a collection of examples of using PHPMailer.
-About testing email sending
-When working on email sending code you'll find yourself worrying about what might happen if all these test emails got sent to your mailing list. The solution is to use a fake mail server, one that acts just like the real thing, but just doesn't actually send anything out. Some offer web interfaces, feedback, logging, the ability to return specific error codes, all things that are useful for testing error handling, authentication etc. Here's a selection of mail testing tools you might like to try:
--
-
- FakeSMTP, a Java desktop app with the ability to show an SMTP log and save messages to a folder. -
- FakeEmail, a Python-based fake mail server with a web interface. -
- smtp-sink, part of the Postfix mail server, so you probably already have this installed. This is used in the Travis-CI configuration to run PHPMailer's unit tests. -
- smtp4dev, a dummy SMTP server for Windows. -
- fakesendmail.sh, part of PHPMailer's test setup, this is a shell script that emulates sendmail for testing 'mail' or 'sendmail' methods in PHPMailer. -
- msglint, not a mail server, the IETF's MIME structure analyser checks the formatting of your messages. -
-
-Security note
-Before running these examples you'll need to rename them with '.php' extensions. They are supplied as '.phps' files which will usually be displayed with syntax highlighting by PHP instead of running them. This prevents potential security issues with running potential spam-gateway code if you happen to deploy these code examples on a live site - please don't do that! Similarly, don't leave your passwords in these files as they will be visible to the world!
-code_generator.phps
-This script is a simple code generator - fill in the form and hit submit, and it will use when you entered to email you a message, and will also generate PHP code using your settings that you can copy and paste to use in your own apps. If you need to get going quickly, this is probably the best place to start.
-mail.phps
-This script is a basic example which creates an email message from an external HTML file, creates a plain text body, sets various addresses, adds an attachment and sends the message. It uses PHP's built-in mail() function which is the simplest to use, but relies on the presence of a local mail server, something which is not usually available on Windows. If you find yourself in that situation, either install a local mail server, or use a remote one and send using SMTP instead.
-exceptions.phps
-The same as the mail example, but shows how to use PHPMailer's optional exceptions for error handling.
-smtp.phps
-A simple example sending using SMTP with authentication.
-smtp_no_auth.phps
-A simple example sending using SMTP without authentication.
-sendmail.phps
-A simple example using sendmail. Sendmail is a program (usually found on Linux/BSD, OS X and other UNIX-alikes) that can be used to submit messages to a local mail server without a lengthy SMTP conversation. It's probably the fastest sending mechanism, but lacks some error reporting features. There are sendmail emulators for most popular mail servers including postfix, qmail, exim etc.
-gmail.phps
-Submitting email via Google's Gmail service is a popular use of PHPMailer. It's much the same as normal SMTP sending, just with some specific settings, namely using TLS encryption, authentication is enabled, and it connects to the SMTP submission port 587 on the smtp.gmail.com host. This example does all that.
-pop_before_smtp.phps
-Before effective SMTP authentication mechanisms were available, it was common for ISPs to use POP-before-SMTP authentication. As it implies, you authenticate using the POP3 protocol (an older protocol now mostly replaced by the far superior IMAP), and then the SMTP server will allow send access from your IP address for a short while, usually 5-15 minutes. PHPMailer includes a POP3 protocol client, so it can carry out this sequence - it's just like a normal SMTP conversation (without authentication), but connects via POP first.
-mailing_list.phps
-This is a somewhat naïve example of sending similar emails to a list of different addresses. It sets up a PHPMailer instance using SMTP, then connects to a MySQL database to retrieve a list of recipients. The code loops over this list, sending email to each person using their info and marks them as sent in the database. It makes use of SMTP keepalive which saves reconnecting and re-authenticating between each message.
--
smtp_check.phps
-This is an example showing how to use the SMTP class by itself (without PHPMailer) to check an SMTP connection.
--
Most of these examples use the 'example.com' domain. This domain is reserved by IANA for illustrative purposes, as documented in RFC 2606. Don't use made-up domains like 'mydomain.com' or 'somedomain.com' in examples as someone, somewhere, probably owns them!
- - diff --git a/download/phpmailer529/examples/mail.phps b/download/phpmailer529/examples/mail.phps deleted file mode 100755 index 8e129f47d..000000000 --- a/download/phpmailer529/examples/mail.phps +++ /dev/null @@ -1,31 +0,0 @@ -setFrom('from@example.com', 'First Last'); -//Set an alternative reply-to address -$mail->addReplyTo('replyto@example.com', 'First Last'); -//Set who the message is to be sent to -$mail->addAddress('whoto@example.com', 'John Doe'); -//Set the subject line -$mail->Subject = 'PHPMailer mail() test'; -//Read an HTML message body from an external file, convert referenced images to embedded, -//convert HTML into a basic plain-text alternative body -$mail->msgHTML(file_get_contents('contents.html'), dirname(__FILE__)); -//Replace the plain text body with one created manually -$mail->AltBody = 'This is a plain-text message body'; -//Attach an image file -$mail->addAttachment('images/phpmailer_mini.png'); - -//send the message, check for errors -if (!$mail->send()) { - echo "Mailer Error: " . $mail->ErrorInfo; -} else { - echo "Message sent!"; -} diff --git a/download/phpmailer529/examples/mailing_list.phps b/download/phpmailer529/examples/mailing_list.phps deleted file mode 100755 index 8644bb596..000000000 --- a/download/phpmailer529/examples/mailing_list.phps +++ /dev/null @@ -1,59 +0,0 @@ -isSMTP(); -$mail->Host = 'smtp.example.com'; -$mail->SMTPAuth = true; -$mail->SMTPKeepAlive = true; // SMTP connection will not close after each email sent, reduces SMTP overhead -$mail->Port = 25; -$mail->Username = 'yourname@example.com'; -$mail->Password = 'yourpassword'; -$mail->setFrom('list@example.com', 'List manager'); -$mail->addReplyTo('list@example.com', 'List manager'); - -$mail->Subject = "PHPMailer Simple database mailing list test"; - -//Same body for all messages, so set this before the sending loop -//If you generate a different body for each recipient (e.g. you're using a templating system), -//set it inside the loop -$mail->msgHTML($body); -//msgHTML also sets AltBody, but if you want a custom one, set it afterwards -$mail->AltBody = 'To view the message, please use an HTML compatible email viewer!'; - -//Connect to the database and select the recipients from your mailing list that have not yet been sent to -//You'll need to alter this to match your database -$mysql = mysqli_connect('localhost', 'username', 'password'); -mysqli_select_db($mysql, 'mydb'); -$result = mysqli_query($mysql, 'SELECT full_name, email, photo FROM mailinglist WHERE sent = false'); - -foreach ($result as $row) { //This iterator syntax only works in PHP 5.4+ - $mail->addAddress($row['email'], $row['full_name']); - if (!empty($row['photo'])) { - $mail->addStringAttachment($row['photo'], 'YourPhoto.jpg'); //Assumes the image data is stored in the DB - } - - if (!$mail->send()) { - echo "Mailer Error (" . str_replace("@", "@", $row["email"]) . ') ' . $mail->ErrorInfo . ''; - break; //Abandon sending - } else { - echo "Message sent to :" . $row['full_name'] . ' (' . str_replace("@", "@", $row['email']) . ')
'; - //Mark it as sent in the DB - mysqli_query( - $mysql, - "UPDATE mailinglist SET sent = true WHERE email = '" . - mysqli_real_escape_string($mysql, $row['email']) . "'" - ); - } - // Clear all addresses and attachments for next loop - $mail->clearAddresses(); - $mail->clearAttachments(); -} diff --git a/download/phpmailer529/examples/pop_before_smtp.phps b/download/phpmailer529/examples/pop_before_smtp.phps deleted file mode 100755 index 164dfe8dd..000000000 --- a/download/phpmailer529/examples/pop_before_smtp.phps +++ /dev/null @@ -1,54 +0,0 @@ -isSMTP(); - //Enable SMTP debugging - // 0 = off (for production use) - // 1 = client messages - // 2 = client and server messages - $mail->SMTPDebug = 2; - //Ask for HTML-friendly debug output - $mail->Debugoutput = 'html'; - //Set the hostname of the mail server - $mail->Host = "mail.example.com"; - //Set the SMTP port number - likely to be 25, 465 or 587 - $mail->Port = 25; - //Whether to use SMTP authentication - $mail->SMTPAuth = false; - //Set who the message is to be sent from - $mail->setFrom('from@example.com', 'First Last'); - //Set an alternative reply-to address - $mail->addReplyTo('replyto@example.com', 'First Last'); - //Set who the message is to be sent to - $mail->addAddress('whoto@example.com', 'John Doe'); - //Set the subject line - $mail->Subject = 'PHPMailer POP-before-SMTP test'; - //Read an HTML message body from an external file, convert referenced images to embedded, - //and convert the HTML into a basic plain-text alternative body - $mail->msgHTML(file_get_contents('contents.html'), dirname(__FILE__)); - //Replace the plain text body with one created manually - $mail->AltBody = 'This is a plain-text message body'; - //Attach an image file - $mail->addAttachment('images/phpmailer_mini.png'); - //send the message - //Note that we don't need check the response from this because it will throw an exception if it has trouble - $mail->send(); - echo "Message sent!"; -} catch (phpmailerException $e) { - echo $e->errorMessage(); //Pretty error messages from PHPMailer -} catch (Exception $e) { - echo $e->getMessage(); //Boring error messages from anything else! -} diff --git a/download/phpmailer529/examples/scripts/XRegExp.js b/download/phpmailer529/examples/scripts/XRegExp.js deleted file mode 100755 index ebdb9c948..000000000 --- a/download/phpmailer529/examples/scripts/XRegExp.js +++ /dev/null @@ -1,664 +0,0 @@ -// XRegExp 1.5.1 -// (c) 2007-2012 Steven Levithan -// MIT License -//
| '+this.getLineNumbersHtml(t)+" | ":"")+''+' '+n+" "+" | "+"
.*?)"+"(?"+t.end+")","sgi")}}},e}();typeof exports!="undefined"?exports.SyntaxHighlighter=SyntaxHighlighter:null
\ No newline at end of file
diff --git a/download/phpmailer529/examples/scripts/shLegacy.js b/download/phpmailer529/examples/scripts/shLegacy.js
deleted file mode 100755
index 35c582c97..000000000
--- a/download/phpmailer529/examples/scripts/shLegacy.js
+++ /dev/null
@@ -1,141 +0,0 @@
-var dp = {
- SyntaxHighlighter : {}
-};
-
-dp.SyntaxHighlighter = {
- parseParams: function(
- input,
- showGutter,
- showControls,
- collapseAll,
- firstLine,
- showColumns
- )
- {
- function getValue(list, name)
- {
- var regex = new XRegExp('^' + name + '\\[(?\\w+)\\]$', 'gi'),
- match = null
- ;
-
- for (var i = 0; i < list.length; i++)
- if ((match = regex.exec(list[i])) != null)
- return match.value;
-
- return null;
- };
-
- function defaultValue(value, def)
- {
- return value != null ? value : def;
- };
-
- function asString(value)
- {
- return value != null ? value.toString() : null;
- };
-
- var parts = input.split(':'),
- brushName = parts[0],
- options = {},
- straight = { 'true' : true }
- reverse = { 'true' : false },
- result = null,
- defaults = SyntaxHighlighter.defaults
- ;
-
- for (var i in parts)
- options[parts[i]] = 'true';
-
- showGutter = asString(defaultValue(showGutter, defaults.gutter));
- showControls = asString(defaultValue(showControls, defaults.toolbar));
- collapseAll = asString(defaultValue(collapseAll, defaults.collapse));
- showColumns = asString(defaultValue(showColumns, defaults.ruler));
- firstLine = asString(defaultValue(firstLine, defaults['first-line']));
-
- return {
- brush : brushName,
- gutter : defaultValue(reverse[options.nogutter], showGutter),
- toolbar : defaultValue(reverse[options.nocontrols], showControls),
- collapse : defaultValue(straight[options.collapse], collapseAll),
- // ruler : defaultValue(straight[options.showcolumns], showColumns),
- 'first-line' : defaultValue(getValue(parts, 'firstline'), firstLine)
- };
- },
-
- HighlightAll: function(
- name,
- showGutter /* optional */,
- showControls /* optional */,
- collapseAll /* optional */,
- firstLine /* optional */,
- showColumns /* optional */
- )
- {
- function findValue()
- {
- var a = arguments;
-
- for (var i = 0; i < a.length; i++)
- {
- if (a[i] === null)
- continue;
-
- if (typeof(a[i]) == 'string' && a[i] != '')
- return a[i] + '';
-
- if (typeof(a[i]) == 'object' && a[i].value != '')
- return a[i].value + '';
- }
-
- return null;
- };
-
- function findTagsByName(list, name, tagName)
- {
- var tags = document.getElementsByTagName(tagName);
-
- for (var i = 0; i < tags.length; i++)
- if (tags[i].getAttribute('name') == name)
- list.push(tags[i]);
- }
-
- var elements = [],
- highlighter = null,
- registered = {},
- propertyName = 'innerHTML'
- ;
-
- // for some reason IE doesn't find by name, however it does see them just fine by tag name...
- findTagsByName(elements, name, 'pre');
- findTagsByName(elements, name, 'textarea');
-
- if (elements.length === 0)
- return;
-
- for (var i = 0; i < elements.length; i++)
- {
- var element = elements[i],
- params = findValue(
- element.attributes['class'], element.className,
- element.attributes['language'], element.language
- ),
- language = ''
- ;
-
- if (params === null)
- continue;
-
- params = dp.SyntaxHighlighter.parseParams(
- params,
- showGutter,
- showControls,
- collapseAll,
- firstLine,
- showColumns
- );
-
- SyntaxHighlighter.highlight(params, element);
- }
- }
-};
diff --git a/download/phpmailer529/examples/send_file_upload.phps b/download/phpmailer529/examples/send_file_upload.phps
deleted file mode 100755
index 3919cbefe..000000000
--- a/download/phpmailer529/examples/send_file_upload.phps
+++ /dev/null
@@ -1,49 +0,0 @@
-setFrom('from@example.com', 'First Last');
- $mail->addAddress('whoto@example.com', 'John Doe');
- $mail->Subject = 'PHPMailer file sender';
- $mail->msgHTML("My message body");
- // Attach the uploaded file
- $mail->addAttachment($uploadfile, 'My uploaded file');
- if (!$mail->send()) {
- $msg = "Mailer Error: " . $mail->ErrorInfo;
- } else {
- $msg = "Message sent!";
- }
- } else {
- $msg = 'Failed to move file to ' . $uploadfile;
- }
-}
-?>
-
-
-
-
- PHPMailer Upload
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/download/phpmailer529/examples/sendmail.phps b/download/phpmailer529/examples/sendmail.phps
deleted file mode 100755
index a830e4952..000000000
--- a/download/phpmailer529/examples/sendmail.phps
+++ /dev/null
@@ -1,33 +0,0 @@
-isSendmail();
-//Set who the message is to be sent from
-$mail->setFrom('from@example.com', 'First Last');
-//Set an alternative reply-to address
-$mail->addReplyTo('replyto@example.com', 'First Last');
-//Set who the message is to be sent to
-$mail->addAddress('whoto@example.com', 'John Doe');
-//Set the subject line
-$mail->Subject = 'PHPMailer sendmail test';
-//Read an HTML message body from an external file, convert referenced images to embedded,
-//convert HTML into a basic plain-text alternative body
-$mail->msgHTML(file_get_contents('contents.html'), dirname(__FILE__));
-//Replace the plain text body with one created manually
-$mail->AltBody = 'This is a plain-text message body';
-//Attach an image file
-$mail->addAttachment('images/phpmailer_mini.png');
-
-//send the message, check for errors
-if (!$mail->send()) {
- echo "Mailer Error: " . $mail->ErrorInfo;
-} else {
- echo "Message sent!";
-}
diff --git a/download/phpmailer529/examples/smtp.phps b/download/phpmailer529/examples/smtp.phps
deleted file mode 100755
index 7c6b02396..000000000
--- a/download/phpmailer529/examples/smtp.phps
+++ /dev/null
@@ -1,54 +0,0 @@
-isSMTP();
-//Enable SMTP debugging
-// 0 = off (for production use)
-// 1 = client messages
-// 2 = client and server messages
-$mail->SMTPDebug = 2;
-//Ask for HTML-friendly debug output
-$mail->Debugoutput = 'html';
-//Set the hostname of the mail server
-$mail->Host = "mail.example.com";
-//Set the SMTP port number - likely to be 25, 465 or 587
-$mail->Port = 25;
-//Whether to use SMTP authentication
-$mail->SMTPAuth = true;
-//Username to use for SMTP authentication
-$mail->Username = "yourname@example.com";
-//Password to use for SMTP authentication
-$mail->Password = "yourpassword";
-//Set who the message is to be sent from
-$mail->setFrom('from@example.com', 'First Last');
-//Set an alternative reply-to address
-$mail->addReplyTo('replyto@example.com', 'First Last');
-//Set who the message is to be sent to
-$mail->addAddress('whoto@example.com', 'John Doe');
-//Set the subject line
-$mail->Subject = 'PHPMailer SMTP test';
-//Read an HTML message body from an external file, convert referenced images to embedded,
-//convert HTML into a basic plain-text alternative body
-$mail->msgHTML(file_get_contents('contents.html'), dirname(__FILE__));
-//Replace the plain text body with one created manually
-$mail->AltBody = 'This is a plain-text message body';
-//Attach an image file
-$mail->addAttachment('images/phpmailer_mini.png');
-
-//send the message, check for errors
-if (!$mail->send()) {
- echo "Mailer Error: " . $mail->ErrorInfo;
-} else {
- echo "Message sent!";
-}
diff --git a/download/phpmailer529/examples/smtp_check.phps b/download/phpmailer529/examples/smtp_check.phps
deleted file mode 100755
index c42ed0bea..000000000
--- a/download/phpmailer529/examples/smtp_check.phps
+++ /dev/null
@@ -1,40 +0,0 @@
-do_debug = SMTP::DEBUG_CONNECTION;
-
-try {
-//Connect to an SMTP server
- if ($smtp->connect('mail.example.com', 25)) {
- //Say hello
- if ($smtp->hello('localhost')) { //Put your host name in here
- //Authenticate
- if ($smtp->authenticate('username', 'password')) {
- echo "Connected ok!";
- } else {
- throw new Exception('Authentication failed: ' . $smtp->getLastReply());
- }
- } else {
- throw new Exception('HELO failed: '. $smtp->getLastReply());
- }
- } else {
- throw new Exception('Connect failed');
- }
-} catch (Exception $e) {
- echo 'SMTP error: '. $e->getMessage(), "\n";
-}
-//Whatever happened, close the connection.
-$smtp->quit(true);
diff --git a/download/phpmailer529/examples/smtp_no_auth.phps b/download/phpmailer529/examples/smtp_no_auth.phps
deleted file mode 100755
index b59029842..000000000
--- a/download/phpmailer529/examples/smtp_no_auth.phps
+++ /dev/null
@@ -1,50 +0,0 @@
-isSMTP();
-//Enable SMTP debugging
-// 0 = off (for production use)
-// 1 = client messages
-// 2 = client and server messages
-$mail->SMTPDebug = 2;
-//Ask for HTML-friendly debug output
-$mail->Debugoutput = 'html';
-//Set the hostname of the mail server
-$mail->Host = "mail.example.com";
-//Set the SMTP port number - likely to be 25, 465 or 587
-$mail->Port = 25;
-//Whether to use SMTP authentication
-$mail->SMTPAuth = false;
-//Set who the message is to be sent from
-$mail->setFrom('from@example.com', 'First Last');
-//Set an alternative reply-to address
-$mail->addReplyTo('replyto@example.com', 'First Last');
-//Set who the message is to be sent to
-$mail->addAddress('whoto@example.com', 'John Doe');
-//Set the subject line
-$mail->Subject = 'PHPMailer SMTP without auth test';
-//Read an HTML message body from an external file, convert referenced images to embedded,
-//convert HTML into a basic plain-text alternative body
-$mail->msgHTML(file_get_contents('contents.html'), dirname(__FILE__));
-//Replace the plain text body with one created manually
-$mail->AltBody = 'This is a plain-text message body';
-//Attach an image file
-$mail->addAttachment('images/phpmailer_mini.png');
-
-//send the message, check for errors
-if (!$mail->send()) {
- echo "Mailer Error: " . $mail->ErrorInfo;
-} else {
- echo "Message sent!";
-}
diff --git a/download/phpmailer529/examples/styles/shCore.css b/download/phpmailer529/examples/styles/shCore.css
deleted file mode 100755
index 3b26ae7e7..000000000
--- a/download/phpmailer529/examples/styles/shCore.css
+++ /dev/null
@@ -1,46 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
diff --git a/download/phpmailer529/examples/styles/shCoreDefault.css b/download/phpmailer529/examples/styles/shCoreDefault.css
deleted file mode 100755
index 3f15ebaad..000000000
--- a/download/phpmailer529/examples/styles/shCoreDefault.css
+++ /dev/null
@@ -1,77 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
-.syntaxhighlighter{background-color:white !important;}
-.syntaxhighlighter .line.alt1{background-color:white !important;}
-.syntaxhighlighter .line.alt2{background-color:white !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#e0e0e0 !important;}
-.syntaxhighlighter .line.highlighted.number{color:black !important;}
-.syntaxhighlighter table caption{color:black !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #6ce26c !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#6ce26c !important;color:white !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:blue !important;background:white !important;border:1px solid #6ce26c !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:blue !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:red !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#6ce26c !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:black !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:black !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#008200 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:blue !important;}
-.syntaxhighlighter .keyword{color:#006699 !important;}
-.syntaxhighlighter .preprocessor{color:gray !important;}
-.syntaxhighlighter .variable{color:#aa7700 !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#ff1493 !important;}
-.syntaxhighlighter .constants{color:#0066cc !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#006699 !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:gray !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:red !important;}
-.syntaxhighlighter .keyword{font-weight:bold !important;}
diff --git a/download/phpmailer529/examples/styles/shCoreDjango.css b/download/phpmailer529/examples/styles/shCoreDjango.css
deleted file mode 100755
index 19c5eb4e9..000000000
--- a/download/phpmailer529/examples/styles/shCoreDjango.css
+++ /dev/null
@@ -1,78 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
-.syntaxhighlighter{background-color:#0a2b1d !important;}
-.syntaxhighlighter .line.alt1{background-color:#0a2b1d !important;}
-.syntaxhighlighter .line.alt2{background-color:#0a2b1d !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#233729 !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:#f8f8f8 !important;}
-.syntaxhighlighter .gutter{color:#497958 !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #41a83e !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#41a83e !important;color:#0a2b1d !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#96dd3b !important;background:black !important;border:1px solid #41a83e !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#96dd3b !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:white !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#41a83e !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:#ffe862 !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:#f8f8f8 !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#336442 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#9df39f !important;}
-.syntaxhighlighter .keyword{color:#96dd3b !important;}
-.syntaxhighlighter .preprocessor{color:#91bb9e !important;}
-.syntaxhighlighter .variable{color:#ffaa3e !important;}
-.syntaxhighlighter .value{color:#f7e741 !important;}
-.syntaxhighlighter .functions{color:#ffaa3e !important;}
-.syntaxhighlighter .constants{color:#e0e8ff !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#96dd3b !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#eb939a !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#91bb9e !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#edef7d !important;}
-.syntaxhighlighter .comments{font-style:italic !important;}
-.syntaxhighlighter .keyword{font-weight:bold !important;}
diff --git a/download/phpmailer529/examples/styles/shCoreEclipse.css b/download/phpmailer529/examples/styles/shCoreEclipse.css
deleted file mode 100755
index fc8c59dab..000000000
--- a/download/phpmailer529/examples/styles/shCoreEclipse.css
+++ /dev/null
@@ -1,80 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
-.syntaxhighlighter{background-color:white !important;}
-.syntaxhighlighter .line.alt1{background-color:white !important;}
-.syntaxhighlighter .line.alt2{background-color:white !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#c3defe !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:black !important;}
-.syntaxhighlighter .gutter{color:#787878 !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #d4d0c8 !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#d4d0c8 !important;color:white !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#3f5fbf !important;background:white !important;border:1px solid #d4d0c8 !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#3f5fbf !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#aa7700 !important;}
-.syntaxhighlighter .toolbar{color:#a0a0a0 !important;background:#d4d0c8 !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:#a0a0a0 !important;}
-.syntaxhighlighter .toolbar a:hover{color:red !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:black !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#3f5fbf !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#2a00ff !important;}
-.syntaxhighlighter .keyword{color:#7f0055 !important;}
-.syntaxhighlighter .preprocessor{color:#646464 !important;}
-.syntaxhighlighter .variable{color:#aa7700 !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#ff1493 !important;}
-.syntaxhighlighter .constants{color:#0066cc !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#7f0055 !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:gray !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:red !important;}
-.syntaxhighlighter .keyword{font-weight:bold !important;}
-.syntaxhighlighter .xml .keyword{color:#3f7f7f !important;font-weight:normal !important;}
-.syntaxhighlighter .xml .color1,.syntaxhighlighter .xml .color1 a{color:#7f007f !important;}
-.syntaxhighlighter .xml .string{font-style:italic !important;color:#2a00ff !important;}
diff --git a/download/phpmailer529/examples/styles/shCoreEmacs.css b/download/phpmailer529/examples/styles/shCoreEmacs.css
deleted file mode 100755
index 4fbd3254f..000000000
--- a/download/phpmailer529/examples/styles/shCoreEmacs.css
+++ /dev/null
@@ -1,76 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
-.syntaxhighlighter{background-color:black !important;}
-.syntaxhighlighter .line.alt1{background-color:black !important;}
-.syntaxhighlighter .line.alt2{background-color:black !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#2a3133 !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:#d3d3d3 !important;}
-.syntaxhighlighter .gutter{color:#d3d3d3 !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #990000 !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#990000 !important;color:black !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#ebdb8d !important;background:black !important;border:1px solid #990000 !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#ebdb8d !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#ff7d27 !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#990000 !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:#9ccff4 !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:#d3d3d3 !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#ff7d27 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#ff9e7b !important;}
-.syntaxhighlighter .keyword{color:aqua !important;}
-.syntaxhighlighter .preprocessor{color:#aec4de !important;}
-.syntaxhighlighter .variable{color:#ffaa3e !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#81cef9 !important;}
-.syntaxhighlighter .constants{color:#ff9e7b !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:aqua !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#ebdb8d !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#ff7d27 !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#aec4de !important;}
diff --git a/download/phpmailer529/examples/styles/shCoreFadeToGrey.css b/download/phpmailer529/examples/styles/shCoreFadeToGrey.css
deleted file mode 100755
index 398d6ee8d..000000000
--- a/download/phpmailer529/examples/styles/shCoreFadeToGrey.css
+++ /dev/null
@@ -1,77 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
-.syntaxhighlighter{background-color:#121212 !important;}
-.syntaxhighlighter .line.alt1{background-color:#121212 !important;}
-.syntaxhighlighter .line.alt2{background-color:#121212 !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#2c2c29 !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:white !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #3185b9 !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#3185b9 !important;color:#121212 !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#3185b9 !important;background:black !important;border:1px solid #3185b9 !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#3185b9 !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#d01d33 !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#3185b9 !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:#96daff !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:white !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#696854 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#e3e658 !important;}
-.syntaxhighlighter .keyword{color:#d01d33 !important;}
-.syntaxhighlighter .preprocessor{color:#435a5f !important;}
-.syntaxhighlighter .variable{color:#898989 !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#aaaaaa !important;}
-.syntaxhighlighter .constants{color:#96daff !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#d01d33 !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#ffc074 !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#4a8cdb !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#96daff !important;}
-.syntaxhighlighter .functions{font-weight:bold !important;}
diff --git a/download/phpmailer529/examples/styles/shCoreMDUltra.css b/download/phpmailer529/examples/styles/shCoreMDUltra.css
deleted file mode 100755
index 87a3cc2b3..000000000
--- a/download/phpmailer529/examples/styles/shCoreMDUltra.css
+++ /dev/null
@@ -1,76 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
-.syntaxhighlighter{background-color:#222222 !important;}
-.syntaxhighlighter .line.alt1{background-color:#222222 !important;}
-.syntaxhighlighter .line.alt2{background-color:#222222 !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#253e5a !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:lime !important;}
-.syntaxhighlighter .gutter{color:#38566f !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #435a5f !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#435a5f !important;color:#222222 !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#428bdd !important;background:black !important;border:1px solid #435a5f !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#428bdd !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:lime !important;}
-.syntaxhighlighter .toolbar{color:#aaaaff !important;background:#435a5f !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:#aaaaff !important;}
-.syntaxhighlighter .toolbar a:hover{color:#9ccff4 !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:lime !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#428bdd !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:lime !important;}
-.syntaxhighlighter .keyword{color:#aaaaff !important;}
-.syntaxhighlighter .preprocessor{color:#8aa6c1 !important;}
-.syntaxhighlighter .variable{color:aqua !important;}
-.syntaxhighlighter .value{color:#f7e741 !important;}
-.syntaxhighlighter .functions{color:#ff8000 !important;}
-.syntaxhighlighter .constants{color:yellow !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#aaaaff !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:red !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:yellow !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#ffaa3e !important;}
diff --git a/download/phpmailer529/examples/styles/shCoreMidnight.css b/download/phpmailer529/examples/styles/shCoreMidnight.css
deleted file mode 100755
index 3c02103ce..000000000
--- a/download/phpmailer529/examples/styles/shCoreMidnight.css
+++ /dev/null
@@ -1,76 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
-.syntaxhighlighter{background-color:#0f192a !important;}
-.syntaxhighlighter .line.alt1{background-color:#0f192a !important;}
-.syntaxhighlighter .line.alt2{background-color:#0f192a !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#253e5a !important;}
-.syntaxhighlighter .line.highlighted.number{color:#38566f !important;}
-.syntaxhighlighter table caption{color:#d1edff !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #435a5f !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#435a5f !important;color:#0f192a !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#428bdd !important;background:black !important;border:1px solid #435a5f !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#428bdd !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#1dc116 !important;}
-.syntaxhighlighter .toolbar{color:#d1edff !important;background:#435a5f !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:#d1edff !important;}
-.syntaxhighlighter .toolbar a:hover{color:#8aa6c1 !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:#d1edff !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#428bdd !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#1dc116 !important;}
-.syntaxhighlighter .keyword{color:#b43d3d !important;}
-.syntaxhighlighter .preprocessor{color:#8aa6c1 !important;}
-.syntaxhighlighter .variable{color:#ffaa3e !important;}
-.syntaxhighlighter .value{color:#f7e741 !important;}
-.syntaxhighlighter .functions{color:#ffaa3e !important;}
-.syntaxhighlighter .constants{color:#e0e8ff !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#b43d3d !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#f8bb00 !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:white !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#ffaa3e !important;}
diff --git a/download/phpmailer529/examples/styles/shCoreRDark.css b/download/phpmailer529/examples/styles/shCoreRDark.css
deleted file mode 100755
index f5b7b474a..000000000
--- a/download/phpmailer529/examples/styles/shCoreRDark.css
+++ /dev/null
@@ -1,76 +0,0 @@
-.syntaxhighlighter a,.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody,.syntaxhighlighter table thead,.syntaxhighlighter table caption,.syntaxhighlighter textarea{-moz-border-radius:0 0 0 0 !important;-webkit-border-radius:0 0 0 0 !important;background:none !important;border:0 !important;bottom:auto !important;float:none !important;height:auto !important;left:auto !important;line-height:1.1em !important;margin:0 !important;outline:0 !important;overflow:visible !important;padding:0 !important;position:static !important;right:auto !important;text-align:left !important;top:auto !important;vertical-align:baseline !important;width:auto !important;box-sizing:content-box !important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;font-weight:normal !important;font-style:normal !important;font-size:1em !important;min-height:inherit !important;min-height:auto !important;}
-.syntaxhighlighter{width:100% !important;margin:1em 0 1em 0 !important;position:relative !important;overflow:auto !important;font-size:1em !important;}
-.syntaxhighlighter.source{overflow:hidden !important;}
-.syntaxhighlighter .bold{font-weight:bold !important;}
-.syntaxhighlighter .italic{font-style:italic !important;}
-.syntaxhighlighter .line{white-space:pre !important;}
-.syntaxhighlighter table{width:100% !important;}
-.syntaxhighlighter table caption{text-align:left !important;padding:.5em 0 0.5em 1em !important;}
-.syntaxhighlighter table td.code{width:100% !important;}
-.syntaxhighlighter table td.code .container{position:relative !important;}
-.syntaxhighlighter table td.code .container textarea{box-sizing:border-box !important;position:absolute !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;border:none !important;background:white !important;padding-left:1em !important;overflow:hidden !important;white-space:pre !important;}
-.syntaxhighlighter table td.gutter .line{text-align:right !important;padding:0 0.5em 0 1em !important;}
-.syntaxhighlighter table td.code .line{padding:0 1em !important;}
-.syntaxhighlighter.nogutter td.code .container textarea,.syntaxhighlighter.nogutter td.code .line{padding-left:0em !important;}
-.syntaxhighlighter.show{display:block !important;}
-.syntaxhighlighter.collapsed table{display:none !important;}
-.syntaxhighlighter.collapsed .toolbar{padding:0.1em 0.8em 0em 0.8em !important;font-size:1em !important;position:static !important;width:auto !important;height:auto !important;}
-.syntaxhighlighter.collapsed .toolbar span{display:inline !important;margin-right:1em !important;}
-.syntaxhighlighter.collapsed .toolbar span a{padding:0 !important;display:none !important;}
-.syntaxhighlighter.collapsed .toolbar span a.expandSource{display:inline !important;}
-.syntaxhighlighter .toolbar{position:absolute !important;right:1px !important;top:1px !important;width:11px !important;height:11px !important;font-size:10px !important;z-index:10 !important;}
-.syntaxhighlighter .toolbar span.title{display:inline !important;}
-.syntaxhighlighter .toolbar a{display:block !important;text-align:center !important;text-decoration:none !important;padding-top:1px !important;}
-.syntaxhighlighter .toolbar a.expandSource{display:none !important;}
-.syntaxhighlighter.ie{font-size:.9em !important;padding:1px 0 1px 0 !important;}
-.syntaxhighlighter.ie .toolbar{line-height:8px !important;}
-.syntaxhighlighter.ie .toolbar a{padding-top:0px !important;}
-.syntaxhighlighter.printing .line.alt1 .content,.syntaxhighlighter.printing .line.alt2 .content,.syntaxhighlighter.printing .line.highlighted .number,.syntaxhighlighter.printing .line.highlighted.alt1 .content,.syntaxhighlighter.printing .line.highlighted.alt2 .content{background:none !important;}
-.syntaxhighlighter.printing .line .number{color:#bbbbbb !important;}
-.syntaxhighlighter.printing .line .content{color:black !important;}
-.syntaxhighlighter.printing .toolbar{display:none !important;}
-.syntaxhighlighter.printing a{text-decoration:none !important;}
-.syntaxhighlighter.printing .plain,.syntaxhighlighter.printing .plain a{color:black !important;}
-.syntaxhighlighter.printing .comments,.syntaxhighlighter.printing .comments a{color:#008200 !important;}
-.syntaxhighlighter.printing .string,.syntaxhighlighter.printing .string a{color:blue !important;}
-.syntaxhighlighter.printing .keyword{color:#006699 !important;font-weight:bold !important;}
-.syntaxhighlighter.printing .preprocessor{color:gray !important;}
-.syntaxhighlighter.printing .variable{color:#aa7700 !important;}
-.syntaxhighlighter.printing .value{color:#009900 !important;}
-.syntaxhighlighter.printing .functions{color:#ff1493 !important;}
-.syntaxhighlighter.printing .constants{color:#0066cc !important;}
-.syntaxhighlighter.printing .script{font-weight:bold !important;}
-.syntaxhighlighter.printing .color1,.syntaxhighlighter.printing .color1 a{color:gray !important;}
-.syntaxhighlighter.printing .color2,.syntaxhighlighter.printing .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter.printing .color3,.syntaxhighlighter.printing .color3 a{color:red !important;}
-.syntaxhighlighter.printing .break,.syntaxhighlighter.printing .break a{color:black !important;}
-.syntaxhighlighter{background-color:#1b2426 !important;}
-.syntaxhighlighter .line.alt1{background-color:#1b2426 !important;}
-.syntaxhighlighter .line.alt2{background-color:#1b2426 !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#323e41 !important;}
-.syntaxhighlighter .line.highlighted.number{color:#b9bdb6 !important;}
-.syntaxhighlighter table caption{color:#b9bdb6 !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #435a5f !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#435a5f !important;color:#1b2426 !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#5ba1cf !important;background:black !important;border:1px solid #435a5f !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#5ba1cf !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#5ce638 !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#435a5f !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:#e0e8ff !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:#b9bdb6 !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#878a85 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#5ce638 !important;}
-.syntaxhighlighter .keyword{color:#5ba1cf !important;}
-.syntaxhighlighter .preprocessor{color:#435a5f !important;}
-.syntaxhighlighter .variable{color:#ffaa3e !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#ffaa3e !important;}
-.syntaxhighlighter .constants{color:#e0e8ff !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#5ba1cf !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#e0e8ff !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:white !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#ffaa3e !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeAppleScript.css b/download/phpmailer529/examples/styles/shThemeAppleScript.css
deleted file mode 100755
index 7881bad44..000000000
--- a/download/phpmailer529/examples/styles/shThemeAppleScript.css
+++ /dev/null
@@ -1,21 +0,0 @@
-.syntaxhighlighter.applescript{background:white;font-size:1em;color:black;}
-.syntaxhighlighter.applescript div,.syntaxhighlighter.applescript code{font:1em/1.25 Verdana,sans-serif !important;}
-.syntaxhighlighter.applescript .code .line{overflow:hidden !important;}
-.syntaxhighlighter.applescript .code .line.highlighted{background:#b5d5ff !important;}
-.syntaxhighlighter.applescript .color1{color:#000000 !important;}
-.syntaxhighlighter.applescript .color2{color:#000000 !important;}
-.syntaxhighlighter.applescript .color3{color:#000000 !important;font-weight:bold !important;}
-.syntaxhighlighter.applescript .keyword{color:#000000 !important;font-weight:bold !important;}
-.syntaxhighlighter.applescript .color4{color:#0000ff !important;font-style:italic !important;}
-.syntaxhighlighter.applescript .comments{color:#4c4d4d !important;}
-.syntaxhighlighter.applescript .plain{color:#408000 !important;}
-.syntaxhighlighter.applescript .string{color:#000000 !important;}
-.syntaxhighlighter.applescript .commandNames{color:#0000ff !important;font-weight:bold !important;}
-.syntaxhighlighter.applescript .parameterNames{color:#0000ff !important;}
-.syntaxhighlighter.applescript .classes{color:#0000ff !important;font-style:italic !important;}
-.syntaxhighlighter.applescript .properties{color:#6c04d4 !important;}
-.syntaxhighlighter.applescript .enumeratedValues{color:#4a1e7f !important;}
-.syntaxhighlighter.applescript .additionCommandNames{color:#0016b0 !important;font-weight:bold !important;}
-.syntaxhighlighter.applescript .additionParameterNames{color:#0016b0 !important;}
-.syntaxhighlighter.applescript .additionClasses{color:#0016b0 !important;font-style:italic !important;}
-.syntaxhighlighter.applescript .spaces{display:inline-block;height:0 !important;font-size:1.75em !important;line-height:0 !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeDefault.css b/download/phpmailer529/examples/styles/shThemeDefault.css
deleted file mode 100755
index 8034517ee..000000000
--- a/download/phpmailer529/examples/styles/shThemeDefault.css
+++ /dev/null
@@ -1,31 +0,0 @@
-.syntaxhighlighter{background-color:white !important;}
-.syntaxhighlighter .line.alt1{background-color:white !important;}
-.syntaxhighlighter .line.alt2{background-color:white !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#e0e0e0 !important;}
-.syntaxhighlighter .line.highlighted.number{color:black !important;}
-.syntaxhighlighter table caption{color:black !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #6ce26c !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#6ce26c !important;color:white !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:blue !important;background:white !important;border:1px solid #6ce26c !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:blue !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:red !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#6ce26c !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:black !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:black !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#008200 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:blue !important;}
-.syntaxhighlighter .keyword{color:#006699 !important;}
-.syntaxhighlighter .preprocessor{color:gray !important;}
-.syntaxhighlighter .variable{color:#aa7700 !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#ff1493 !important;}
-.syntaxhighlighter .constants{color:#0066cc !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#006699 !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:gray !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:red !important;}
-.syntaxhighlighter .keyword{font-weight:bold !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeDjango.css b/download/phpmailer529/examples/styles/shThemeDjango.css
deleted file mode 100755
index 5cb724f90..000000000
--- a/download/phpmailer529/examples/styles/shThemeDjango.css
+++ /dev/null
@@ -1,32 +0,0 @@
-.syntaxhighlighter{background-color:#0a2b1d !important;}
-.syntaxhighlighter .line.alt1{background-color:#0a2b1d !important;}
-.syntaxhighlighter .line.alt2{background-color:#0a2b1d !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#233729 !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:#f8f8f8 !important;}
-.syntaxhighlighter .gutter{color:#497958 !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #41a83e !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#41a83e !important;color:#0a2b1d !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#96dd3b !important;background:black !important;border:1px solid #41a83e !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#96dd3b !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:white !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#41a83e !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:#ffe862 !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:#f8f8f8 !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#336442 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#9df39f !important;}
-.syntaxhighlighter .keyword{color:#96dd3b !important;}
-.syntaxhighlighter .preprocessor{color:#91bb9e !important;}
-.syntaxhighlighter .variable{color:#ffaa3e !important;}
-.syntaxhighlighter .value{color:#f7e741 !important;}
-.syntaxhighlighter .functions{color:#ffaa3e !important;}
-.syntaxhighlighter .constants{color:#e0e8ff !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#96dd3b !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#eb939a !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#91bb9e !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#edef7d !important;}
-.syntaxhighlighter .comments{font-style:italic !important;}
-.syntaxhighlighter .keyword{font-weight:bold !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeEclipse.css b/download/phpmailer529/examples/styles/shThemeEclipse.css
deleted file mode 100755
index b089c5d7c..000000000
--- a/download/phpmailer529/examples/styles/shThemeEclipse.css
+++ /dev/null
@@ -1,34 +0,0 @@
-.syntaxhighlighter{background-color:white !important;}
-.syntaxhighlighter .line.alt1{background-color:white !important;}
-.syntaxhighlighter .line.alt2{background-color:white !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#c3defe !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:black !important;}
-.syntaxhighlighter .gutter{color:#787878 !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #d4d0c8 !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#d4d0c8 !important;color:white !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#3f5fbf !important;background:white !important;border:1px solid #d4d0c8 !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#3f5fbf !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#aa7700 !important;}
-.syntaxhighlighter .toolbar{color:#a0a0a0 !important;background:#d4d0c8 !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:#a0a0a0 !important;}
-.syntaxhighlighter .toolbar a:hover{color:red !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:black !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#3f5fbf !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#2a00ff !important;}
-.syntaxhighlighter .keyword{color:#7f0055 !important;}
-.syntaxhighlighter .preprocessor{color:#646464 !important;}
-.syntaxhighlighter .variable{color:#aa7700 !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#ff1493 !important;}
-.syntaxhighlighter .constants{color:#0066cc !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#7f0055 !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:gray !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:red !important;}
-.syntaxhighlighter .keyword{font-weight:bold !important;}
-.syntaxhighlighter .xml .keyword{color:#3f7f7f !important;font-weight:normal !important;}
-.syntaxhighlighter .xml .color1,.syntaxhighlighter .xml .color1 a{color:#7f007f !important;}
-.syntaxhighlighter .xml .string{font-style:italic !important;color:#2a00ff !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeEmacs.css b/download/phpmailer529/examples/styles/shThemeEmacs.css
deleted file mode 100755
index a3dcfc92b..000000000
--- a/download/phpmailer529/examples/styles/shThemeEmacs.css
+++ /dev/null
@@ -1,30 +0,0 @@
-.syntaxhighlighter{background-color:black !important;}
-.syntaxhighlighter .line.alt1{background-color:black !important;}
-.syntaxhighlighter .line.alt2{background-color:black !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#2a3133 !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:#d3d3d3 !important;}
-.syntaxhighlighter .gutter{color:#d3d3d3 !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #990000 !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#990000 !important;color:black !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#ebdb8d !important;background:black !important;border:1px solid #990000 !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#ebdb8d !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#ff7d27 !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#990000 !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:#9ccff4 !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:#d3d3d3 !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#ff7d27 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#ff9e7b !important;}
-.syntaxhighlighter .keyword{color:aqua !important;}
-.syntaxhighlighter .preprocessor{color:#aec4de !important;}
-.syntaxhighlighter .variable{color:#ffaa3e !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#81cef9 !important;}
-.syntaxhighlighter .constants{color:#ff9e7b !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:aqua !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#ebdb8d !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#ff7d27 !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#aec4de !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeFadeToGrey.css b/download/phpmailer529/examples/styles/shThemeFadeToGrey.css
deleted file mode 100755
index d0b1c93e0..000000000
--- a/download/phpmailer529/examples/styles/shThemeFadeToGrey.css
+++ /dev/null
@@ -1,31 +0,0 @@
-.syntaxhighlighter{background-color:#121212 !important;}
-.syntaxhighlighter .line.alt1{background-color:#121212 !important;}
-.syntaxhighlighter .line.alt2{background-color:#121212 !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#2c2c29 !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:white !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #3185b9 !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#3185b9 !important;color:#121212 !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#3185b9 !important;background:black !important;border:1px solid #3185b9 !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#3185b9 !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#d01d33 !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#3185b9 !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:#96daff !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:white !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#696854 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#e3e658 !important;}
-.syntaxhighlighter .keyword{color:#d01d33 !important;}
-.syntaxhighlighter .preprocessor{color:#435a5f !important;}
-.syntaxhighlighter .variable{color:#898989 !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#aaaaaa !important;}
-.syntaxhighlighter .constants{color:#96daff !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#d01d33 !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#ffc074 !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#4a8cdb !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#96daff !important;}
-.syntaxhighlighter .functions{font-weight:bold !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeMDUltra.css b/download/phpmailer529/examples/styles/shThemeMDUltra.css
deleted file mode 100755
index 6f712fd65..000000000
--- a/download/phpmailer529/examples/styles/shThemeMDUltra.css
+++ /dev/null
@@ -1,30 +0,0 @@
-.syntaxhighlighter{background-color:#222222 !important;}
-.syntaxhighlighter .line.alt1{background-color:#222222 !important;}
-.syntaxhighlighter .line.alt2{background-color:#222222 !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#253e5a !important;}
-.syntaxhighlighter .line.highlighted.number{color:white !important;}
-.syntaxhighlighter table caption{color:lime !important;}
-.syntaxhighlighter .gutter{color:#38566f !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #435a5f !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#435a5f !important;color:#222222 !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#428bdd !important;background:black !important;border:1px solid #435a5f !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#428bdd !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:lime !important;}
-.syntaxhighlighter .toolbar{color:#aaaaff !important;background:#435a5f !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:#aaaaff !important;}
-.syntaxhighlighter .toolbar a:hover{color:#9ccff4 !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:lime !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#428bdd !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:lime !important;}
-.syntaxhighlighter .keyword{color:#aaaaff !important;}
-.syntaxhighlighter .preprocessor{color:#8aa6c1 !important;}
-.syntaxhighlighter .variable{color:aqua !important;}
-.syntaxhighlighter .value{color:#f7e741 !important;}
-.syntaxhighlighter .functions{color:#ff8000 !important;}
-.syntaxhighlighter .constants{color:yellow !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#aaaaff !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:red !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:yellow !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#ffaa3e !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeMidnight.css b/download/phpmailer529/examples/styles/shThemeMidnight.css
deleted file mode 100755
index e9c177e6e..000000000
--- a/download/phpmailer529/examples/styles/shThemeMidnight.css
+++ /dev/null
@@ -1,30 +0,0 @@
-.syntaxhighlighter{background-color:#0f192a !important;}
-.syntaxhighlighter .line.alt1{background-color:#0f192a !important;}
-.syntaxhighlighter .line.alt2{background-color:#0f192a !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#253e5a !important;}
-.syntaxhighlighter .line.highlighted.number{color:#38566f !important;}
-.syntaxhighlighter table caption{color:#d1edff !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #435a5f !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#435a5f !important;color:#0f192a !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#428bdd !important;background:black !important;border:1px solid #435a5f !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#428bdd !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#1dc116 !important;}
-.syntaxhighlighter .toolbar{color:#d1edff !important;background:#435a5f !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:#d1edff !important;}
-.syntaxhighlighter .toolbar a:hover{color:#8aa6c1 !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:#d1edff !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#428bdd !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#1dc116 !important;}
-.syntaxhighlighter .keyword{color:#b43d3d !important;}
-.syntaxhighlighter .preprocessor{color:#8aa6c1 !important;}
-.syntaxhighlighter .variable{color:#ffaa3e !important;}
-.syntaxhighlighter .value{color:#f7e741 !important;}
-.syntaxhighlighter .functions{color:#ffaa3e !important;}
-.syntaxhighlighter .constants{color:#e0e8ff !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#b43d3d !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#f8bb00 !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:white !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#ffaa3e !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeRDark.css b/download/phpmailer529/examples/styles/shThemeRDark.css
deleted file mode 100755
index 42d8710f5..000000000
--- a/download/phpmailer529/examples/styles/shThemeRDark.css
+++ /dev/null
@@ -1,30 +0,0 @@
-.syntaxhighlighter{background-color:#1b2426 !important;}
-.syntaxhighlighter .line.alt1{background-color:#1b2426 !important;}
-.syntaxhighlighter .line.alt2{background-color:#1b2426 !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#323e41 !important;}
-.syntaxhighlighter .line.highlighted.number{color:#b9bdb6 !important;}
-.syntaxhighlighter table caption{color:#b9bdb6 !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #435a5f !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#435a5f !important;color:#1b2426 !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:#5ba1cf !important;background:black !important;border:1px solid #435a5f !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:#5ba1cf !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:#5ce638 !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#435a5f !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:#e0e8ff !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:#b9bdb6 !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#878a85 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#5ce638 !important;}
-.syntaxhighlighter .keyword{color:#5ba1cf !important;}
-.syntaxhighlighter .preprocessor{color:#435a5f !important;}
-.syntaxhighlighter .variable{color:#ffaa3e !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#ffaa3e !important;}
-.syntaxhighlighter .constants{color:#e0e8ff !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#5ba1cf !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:#e0e8ff !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:white !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:#ffaa3e !important;}
diff --git a/download/phpmailer529/examples/styles/shThemeVisualStudio.css b/download/phpmailer529/examples/styles/shThemeVisualStudio.css
deleted file mode 100755
index 8ed369f58..000000000
--- a/download/phpmailer529/examples/styles/shThemeVisualStudio.css
+++ /dev/null
@@ -1,31 +0,0 @@
-.syntaxhighlighter{background-color:white !important;}
-.syntaxhighlighter .line.alt1{background-color:white !important;}
-.syntaxhighlighter .line.alt2{background-color:white !important;}
-.syntaxhighlighter .line.highlighted.alt1,.syntaxhighlighter .line.highlighted.alt2{background-color:#e0e0e0 !important;}
-.syntaxhighlighter .line.highlighted.number{color:black !important;}
-.syntaxhighlighter table caption{color:black !important;}
-.syntaxhighlighter .gutter{color:#afafaf !important;}
-.syntaxhighlighter .gutter .line{border-right:3px solid #6ce26c !important;}
-.syntaxhighlighter .gutter .line.highlighted{background-color:#6ce26c !important;color:white !important;}
-.syntaxhighlighter.printing .line .content{border:none !important;}
-.syntaxhighlighter.collapsed{overflow:visible !important;}
-.syntaxhighlighter.collapsed .toolbar{color:blue !important;background:white !important;border:1px solid #6ce26c !important;}
-.syntaxhighlighter.collapsed .toolbar a{color:blue !important;}
-.syntaxhighlighter.collapsed .toolbar a:hover{color:red !important;}
-.syntaxhighlighter .toolbar{color:white !important;background:#6ce26c !important;border:none !important;}
-.syntaxhighlighter .toolbar a{color:white !important;}
-.syntaxhighlighter .toolbar a:hover{color:black !important;}
-.syntaxhighlighter .plain,.syntaxhighlighter .plain a{color:black !important;}
-.syntaxhighlighter .comments,.syntaxhighlighter .comments a{color:#008200 !important;}
-.syntaxhighlighter .string,.syntaxhighlighter .string a{color:#d11010 !important;}
-.syntaxhighlighter .keyword{color:#006699 !important;}
-.syntaxhighlighter .preprocessor{color:gray !important;}
-.syntaxhighlighter .variable{color:#aa7700 !important;}
-.syntaxhighlighter .value{color:#009900 !important;}
-.syntaxhighlighter .functions{color:#ff1493 !important;}
-.syntaxhighlighter .constants{color:#0066cc !important;}
-.syntaxhighlighter .script{font-weight:bold !important;color:#006699 !important;background-color:none !important;}
-.syntaxhighlighter .color1,.syntaxhighlighter .color1 a{color:gray !important;}
-.syntaxhighlighter .color2,.syntaxhighlighter .color2 a{color:#ff1493 !important;}
-.syntaxhighlighter .color3,.syntaxhighlighter .color3 a{color:red !important;}
-.syntaxhighlighter .keyword{font-weight:bold !important;}
diff --git a/download/phpmailer529/examples/styles/wrapping.png b/download/phpmailer529/examples/styles/wrapping.png
deleted file mode 100755
index 6972c5e59..000000000
Binary files a/download/phpmailer529/examples/styles/wrapping.png and /dev/null differ
diff --git a/download/phpmailer529/extras/EasyPeasyICS.php b/download/phpmailer529/extras/EasyPeasyICS.php
deleted file mode 100755
index 1d50b0195..000000000
--- a/download/phpmailer529/extras/EasyPeasyICS.php
+++ /dev/null
@@ -1,148 +0,0 @@
-
- * @author Manuel Reinhard
- *
- * Built with inspiration from
- * http://stackoverflow.com/questions/1463480/how-can-i-use-php-to-dynamically-publish-an-ical-file-to-be-read-by-google-calend/1464355#1464355
- * History:
- * 2010/12/17 - Manuel Reinhard - when it all started
- * 2014 PHPMailer project becomes maintainer
- */
-
-/**
- * Class EasyPeasyICS.
- * Simple ICS data generator
- * @package phpmailer
- * @subpackage easypeasyics
- */
-class EasyPeasyICS
-{
- /**
- * The name of the calendar
- * @type string
- */
- protected $calendarName;
- /**
- * The array of events to add to this calendar
- * @type array
- */
- protected $events = array();
-
- /**
- * Constructor
- * @param string $calendarName
- */
- public function __construct($calendarName = "")
- {
- $this->calendarName = $calendarName;
- }
-
- /**
- * Add an event to this calendar.
- * @param string $start The start date and time as a unix timestamp
- * @param string $end The end date and time as a unix timestamp
- * @param string $summary A summary or title for the event
- * @param string $description A description of the event
- * @param string $url A URL for the event
- * @param string $uid A unique identifier for the event - generated automatically if not provided
- * @return array An array of event details, including any generated UID
- */
- public function addEvent($start, $end, $summary = '', $description = '', $url = '', $uid = '')
- {
- if (empty($uid)) {
- $uid = md5(uniqid(mt_rand(), true)) . '@EasyPeasyICS';
- }
- $event = array(
- 'start' => gmdate('Ymd', $start) . 'T' . gmdate('His', $start) . 'Z',
- 'end' => gmdate('Ymd', $end) . 'T' . gmdate('His', $end) . 'Z',
- 'summary' => $summary,
- 'description' => $description,
- 'url' => $url,
- 'uid' => $uid
- );
- $this->events[] = $event;
- return $event;
- }
-
- /**
- * @return array Get the array of events.
- */
- public function getEvents()
- {
- return $this->events;
- }
-
- /**
- * Clear all events.
- */
- public function clearEvents()
- {
- $this->events = array();
- }
-
- /**
- * Get the name of the calendar.
- * @return string
- */
- public function getName()
- {
- return $this->calendarName;
- }
-
- /**
- * Set the name of the calendar.
- * @param $name
- */
- public function setName($name)
- {
- $this->calendarName = $name;
- }
-
- /**
- * Render and optionally output a vcal string.
- * @param bool $output Whether to output the calendar data directly (the default).
- * @return string The complete rendered vlal
- */
- public function render($output = true)
- {
- //Add header
- $ics = 'BEGIN:VCALENDAR
-METHOD:PUBLISH
-VERSION:2.0
-X-WR-CALNAME:' . $this->calendarName . '
-PRODID:-//hacksw/handcal//NONSGML v1.0//EN';
-
- //Add events
- foreach ($this->events as $event) {
- $ics .= '
-BEGIN:VEVENT
-UID:' . $event['uid'] . '
-DTSTAMP:' . gmdate('Ymd') . 'T' . gmdate('His') . 'Z
-DTSTART:' . $event['start'] . '
-DTEND:' . $event['end'] . '
-SUMMARY:' . str_replace("\n", "\\n", $event['summary']) . '
-DESCRIPTION:' . str_replace("\n", "\\n", $event['description']) . '
-URL;VALUE=URI:' . $event['url'] . '
-END:VEVENT';
- }
-
- //Add footer
- $ics .= '
-END:VCALENDAR';
-
- if ($output) {
- //Output
- $filename = $this->calendarName;
- //Filename needs quoting if it contains spaces
- if (strpos($filename, ' ') !== false) {
- $filename = '"'.$filename.'"';
- }
- header('Content-type: text/calendar; charset=utf-8');
- header('Content-Disposition: inline; filename=' . $filename . '.ics');
- echo $ics;
- }
- return $ics;
- }
-}
diff --git a/download/phpmailer529/extras/README.md b/download/phpmailer529/extras/README.md
deleted file mode 100755
index dac79e05f..000000000
--- a/download/phpmailer529/extras/README.md
+++ /dev/null
@@ -1,17 +0,0 @@
-#PHPMailer Extras
-
-These classes provide optional additional functions to PHPMailer.
-
-These are not loaded by the PHPMailer autoloader, so in some cases you may need to `require` them yourself before using them.
-
-##EasyPeasyICS
-
-This class was originally written by Manuel Reinhard and provides a simple means of generating ICS/vCal files that are used in sending calendar events. PHPMailer does not use it directly, but you can use it to generate content appropriate for placing in the `Ical` property of PHPMailer. The PHPMailer project is now its official home as Manuel has given permission for that and is no longer maintaining it himself.
-
-##htmlfilter
-
-This class by Konstantin Riabitsev and Jim Jagielski implements HTML filtering to remove potentially malicious tags, such as `';
-
+ // Insert the p5 version of the example into the page
+
+ //Container for example
+ $html .= "\n";
+ //$html = "\n"; // CR -- Change 8 Dec 2015
+ //Script tag for example
+ $html .= '';
+
+ //Description
$html .= "\n";
$html .= nl2br($this->doc);
#$html .= $this->doc;
$html .= "
\n";
+ //Raw code from Processing (not p5) version
$html .= "\n\n";
- $html .= $this->code;
+ $html .= $this->pde_code;
$html .= "\n\n";
$html .= "\n\n"; // END example div
diff --git a/generate/lib/functions.inc.php b/generate/lib/functions.inc.php
index 6f3d5543a..59e0f4923 100755
--- a/generate/lib/functions.inc.php
+++ b/generate/lib/functions.inc.php
@@ -81,10 +81,16 @@ function innerHTML(&$xml, $nodeName)
$nodes = $xml->getElementsByTagName($nodeName);
if ($nodes->getLength() > 0) {
$node = $nodes->item(0);
- eregi("<$nodeName>(.*)<\/$nodeName>", $node->toString(), $matches);
- // replace invalid with
- $string = str_replace(array('', ' '), array('', ''), $matches[1]);
- if (substr($string, 0, 1) == "\n") { $string = substr($string, 1); }
+ // The following line with eregi() stopped working PHP 7+
+ // there are multiple instanced of eregi() in this document,
+ // replace all -- CR 5 July 2017
+ //eregi("<$nodeName>(.*)<\/$nodeName>", $node->toString(), $matches);
+ preg_match_all("'<$nodeName>(.*?)'si", $node->toString(), $matches);
+ // replace invalid with
+ $string = str_replace(array('', ' '), array('', ''), $matches[1]);
+ if (substr($string, 0, 1) == "\n") {
+ $string = substr($string, 1);
+ }
return trim(chars($string));
} else {
return false;
@@ -429,7 +435,9 @@ function category_index($array)
*****************************************************************/
function category_image($cat)
{
- return strtolower(eregi_replace("[^A-Za-z0-9]", '', eregi_replace("\&(.+);", '', $cat))) . ".gif";
+ // Replaced 5 July 2017, CR
+ //return strtolower(eregi_replace("[^A-Za-z0-9]", '', eregi_replace("\&(.+);", '', $cat))) . ".gif";
+ return strtolower(preg_match("/[^A-Za-z0-9]/", '', preg_match("/\&(.+);/", '', $cat))) . ".gif";
}
/****************************************************************
@@ -440,12 +448,16 @@ function alpha_index($array)
$per_col = ceil(count($array)/3);
$firstchar = key($array);
- $firstchar = eregi_replace("[^A-Za-z0-9]", '', $firstchar{0});
+ // Replaced 5 July 2017, CR
+ //$firstchar = eregi_replace("[^A-Za-z0-9]", '', $firstchar{0});
+ $firstchar = preg_match("/[^A-Za-z0-9]/", '', $firstchar{0});
$count = 0;
$html = "\n";
foreach ($array as $key => $ref) {
- if (eregi_replace("[^A-Za-z0-9]", '', $key{0}) != $firstchar) {
+ // Replaced 5 July 2017, CR
+ //if (eregi_replace("[^A-Za-z0-9]", '', $key{0}) != $firstchar) {
+ if (preg_match("/[^A-Za-z0-9]/", '', $key{0}) != $firstchar) {
$firstchar = $key{0};
$html .= "
\n\n";
if ($count >= $per_col) {
diff --git a/generate/libraries.php b/generate/libraries.php
index ee8bc5652..d34c53ba2 100755
--- a/generate/libraries.php
+++ b/generate/libraries.php
@@ -19,7 +19,7 @@
//`cd $path && /usr/bin/git pull https://github.com/processing/processing-docs/`;
-$libraries = array('net', 'serial', 'video', 'dxf', 'pdf', 'sound', 'io');
+$libraries = array('net', 'serial', 'video', 'dxf', 'pdf', 'sound', 'io', 'svg');
$lib_dir = REFERENCEDIR.'libraries/';
// Create Index
@@ -47,7 +47,7 @@
// template and copy index
$index = CONTENTDIR.$source.'/index.html';
- if($lib == 'pdf' || $lib == 'dxf') {
+ if($lib == 'pdf' || $lib == 'dxf' || $lib == 'svg') {
//$page = new Page(strtoupper($lib) . ' \\ Libraries', 'Libraries', 'Library-index');
$page = new Page(strtoupper($lib) . ' \\ Libraries', 'Libraries');
} else {
diff --git a/generate/libraries_local.php b/generate/libraries_local.php
index 7c946d94f..ddaeaff96 100755
--- a/generate/libraries_local.php
+++ b/generate/libraries_local.php
@@ -8,7 +8,7 @@
$benchmark_start = microtime_float();
-$libraries = array('net', 'serial', 'video', 'dxf', 'pdf', 'sound', 'io');
+$libraries = array('net', 'serial', 'video', 'dxf', 'pdf', 'sound', 'io', 'svg');
$lib_dir = DISTDIR.'libraries';
diff --git a/generate/reference.php b/generate/reference.php
index fd6ecc0f8..5e2a7532c 100644
--- a/generate/reference.php
+++ b/generate/reference.php
@@ -38,7 +38,9 @@ function out($output) {
out("Pulling in latest changes from processing/processing-sound/...");
$soundRepoPath = "{$path}../processing-sound";
-$shell_output = shell_exec("cd $soundRepoPath && /usr/bin/git pull https://github.com/processing/processing-sound/ 2>&1");
+//$shell_output = shell_exec("cd $soundRepoPath && /usr/bin/git pull https://github.com/processing/processing-sound/ 2>&1");
+// clone new processing-sound library from work-in-progress repository instead
+$shell_output = shell_exec("rm -rf $soundRepoPath && mkdir $soundRepoPath && cd $soundRepoPath && /usr/bin/git clone https://github.com/processing/processing-sound.git . 2>&1");
out($shell_output);
out("---------------");
@@ -64,20 +66,24 @@ function out($output) {
// Compress distribution into a ZIP, so it can be rolled into an IDE build.
+// processing/processing/java/
out("Compressing distribution directory...");
shell_exec("rm $mainRepoPath/build/shared/reference.zip 2>&1");
+//shell_exec("rm $mainRepoPath/java/reference.zip 2>&1"); // Add 10 Nov 2016 - CR
$docsRepoPath = "{$path}../processing-docs";
$shell_output = shell_exec("cd $docsRepoPath && cp -r distribution/ $mainRepoPath/build/shared/reference/ 2>&1");
+//$shell_output = shell_exec("cd $docsRepoPath && cp -r distribution/ $mainRepoPath/java/reference/ 2>&1"); // Add 10 Nov 2016 - CR
out($shell_output);
$shell_output = shell_exec("cd $mainRepoPath/build/shared/ && zip -r reference.zip reference/ 2>&1");
+//$shell_output = shell_exec("cd $mainRepoPath/java/ && zip -r reference.zip reference/ 2>&1"); // Add 10 Nov 2016 - CR
out($shell_output);
shell_exec("rm -r $mainRepoPath/build/shared/reference/ 2>&1");
+//shell_exec("rm -r $mainRepoPath/java/reference/ 2>&1"); // Add 10 Nov 2016 - CR
out("Done compressing!");
-
$benchmark_end = microtime_float();
$execution_time = round($benchmark_end - $benchmark_start, 4);
out("Generated files in $execution_time seconds.");
-?>
\ No newline at end of file
+?>
diff --git a/generate/staticpages.php b/generate/staticpages.php
index 307199396..1a60b6291 100755
--- a/generate/staticpages.php
+++ b/generate/staticpages.php
@@ -28,9 +28,9 @@
writeFile('overview/index.html', $page->out());
#copydirr($source.'/images', $path.'/images');
-$page = new Page("Foundation", "Foundation");
-$page->content(file_get_contents($source."foundation.html"));
-writeFile('foundation/index.html', $page->out());
+#$page = new Page("Foundation", "Foundation");
+#$page->content(file_get_contents($source."foundation.html"));
+#writeFile('foundation/index.html', $page->out());
$page = new Page("People", "People");
$page->content(file_get_contents($source."people.html"));
@@ -44,6 +44,17 @@
$page->content(file_get_contents($source."handbook.html"));
writeFile('handbook/index.html', $page->out());
+// Added 4 April 2017 for Membership Initiative
+$page = new Page("Support", "Donate");
+$page->content(file_get_contents($source."support.html"));
+writeFile('download/support.html', $page->out());
+
+// Added 6 April 2017 for Membership Initiative
+$page = new Page("Download", "Download");
+$page->content(file_get_contents($source."download.html"));
+writeFile('download/index.html', $page->out());
+
+
// Copy over the errata file for Processing: A Programming Handbook...
// copy($source.'processing-errata.txt', $path.'books/processing-errata.txt');
// Copy over the media.zip file for Getting Started with Processing...
@@ -54,21 +65,21 @@
writeFile('copyright.html', $page->out());
// Copy over the images for the shop index
-if (!is_dir($path.'shop')) {
- mkdir($path.'shop', 0757);
-}
+#if (!is_dir($path.'shop')) {
+# mkdir($path.'shop', 0757);
+#}
-if (!is_dir($path.'shop/imgs')) {
- mkdir($path.'shop/imgs', 0757);
-}
+#if (!is_dir($path.'shop/imgs')) {
+# mkdir($path.'shop/imgs', 0757);
+#}
-if (is_dir($path.'shop/imgs')) {
- copydirr($source.'shop/imgs', $path.'shop/imgs', null, 0757, false);
-}
+#if (is_dir($path.'shop/imgs')) {
+# copydirr($source.'shop/imgs', $path.'shop/imgs', null, 0757, false);
+#}
-$page = new Page("Shop", "Shop");
-$page->content(file_get_contents($source.'shop/'."index.html"));
-writeFile('shop/index.html', $page->out());
+#$page = new Page("Shop", "Shop");
+#$page->content(file_get_contents($source.'shop/'."index.html"));
+#writeFile('shop/index.html', $page->out());
$benchmark_end = microtime_float();
$execution_time = round($benchmark_end - $benchmark_start, 4);
diff --git a/img/cc.png b/img/cc.png
new file mode 100644
index 000000000..4acf8c4ec
Binary files /dev/null and b/img/cc.png differ
diff --git a/img/learning/books/coding-art.jpg b/img/learning/books/coding-art.jpg
new file mode 100644
index 000000000..79fa91e5a
Binary files /dev/null and b/img/learning/books/coding-art.jpg differ
diff --git a/img/learning/books/creating-procedural-artworks.jpg b/img/learning/books/creating-procedural-artworks.jpg
new file mode 100644
index 000000000..2724174b5
Binary files /dev/null and b/img/learning/books/creating-procedural-artworks.jpg differ
diff --git a/img/learning/books/data-driven-graphic-design.jpg b/img/learning/books/data-driven-graphic-design.jpg
new file mode 100644
index 000000000..d04fcb2cd
Binary files /dev/null and b/img/learning/books/data-driven-graphic-design.jpg differ
diff --git a/img/learning/books/il-codice-dei-cibernetici-sm.jpg b/img/learning/books/il-codice-dei-cibernetici-sm.jpg
new file mode 100644
index 000000000..6c1033a16
Binary files /dev/null and b/img/learning/books/il-codice-dei-cibernetici-sm.jpg differ
diff --git a/img/learning/books/il-codice-dei-cibernetici.jpg b/img/learning/books/il-codice-dei-cibernetici.jpg
new file mode 100644
index 000000000..725940450
Binary files /dev/null and b/img/learning/books/il-codice-dei-cibernetici.jpg differ
diff --git a/img/learning/books/o-codigo.jpg b/img/learning/books/o-codigo.jpg
new file mode 100644
index 000000000..e70fad0e9
Binary files /dev/null and b/img/learning/books/o-codigo.jpg differ
diff --git a/img/learning/books/opencv.jpg b/img/learning/books/opencv.jpg
new file mode 100644
index 000000000..826db6e99
Binary files /dev/null and b/img/learning/books/opencv.jpg differ
diff --git a/img/learning/books/pro-processing.jpg b/img/learning/books/pro-processing.jpg
new file mode 100644
index 000000000..25e7f6863
Binary files /dev/null and b/img/learning/books/pro-processing.jpg differ
diff --git a/img/learning/books/processing-an-introduction-to-programming.png b/img/learning/books/processing-an-introduction-to-programming.png
new file mode 100644
index 000000000..e92a39b12
Binary files /dev/null and b/img/learning/books/processing-an-introduction-to-programming.png differ
diff --git a/img/learning/books/processing-android-sm.jpg b/img/learning/books/processing-android-sm.jpg
new file mode 100644
index 000000000..a6b81a2a0
Binary files /dev/null and b/img/learning/books/processing-android-sm.jpg differ
diff --git a/img/learning/books/processing-android.jpg b/img/learning/books/processing-android.jpg
new file mode 100644
index 000000000..e66bc832f
Binary files /dev/null and b/img/learning/books/processing-android.jpg differ
diff --git a/img/learning/books/programming-101.jpg b/img/learning/books/programming-101.jpg
new file mode 100644
index 000000000..3749c36a2
Binary files /dev/null and b/img/learning/books/programming-101.jpg differ
diff --git a/img/learning/books/programming-for-artists.jpg b/img/learning/books/programming-for-artists.jpg
new file mode 100644
index 000000000..dce698ddf
Binary files /dev/null and b/img/learning/books/programming-for-artists.jpg differ
diff --git a/img/membership/membership-diy.jpg b/img/membership/membership-diy.jpg
new file mode 100644
index 000000000..475f57512
Binary files /dev/null and b/img/membership/membership-diy.jpg differ
diff --git a/img/membership/membership-learntoteach.jpg b/img/membership/membership-learntoteach.jpg
new file mode 100644
index 000000000..f6f8e206a
Binary files /dev/null and b/img/membership/membership-learntoteach.jpg differ
diff --git a/img/membership/membership-miami.jpg b/img/membership/membership-miami.jpg
new file mode 100644
index 000000000..13ce0d278
Binary files /dev/null and b/img/membership/membership-miami.jpg differ
diff --git a/img/membership/membership-p5.jpg b/img/membership/membership-p5.jpg
new file mode 100644
index 000000000..0a218af0d
Binary files /dev/null and b/img/membership/membership-p5.jpg differ
diff --git a/img/pcd17.png b/img/pcd17.png
new file mode 100644
index 000000000..cb5f2b18c
Binary files /dev/null and b/img/pcd17.png differ
diff --git a/java_generate/templates/class.template.html b/java_generate/templates/class.template.html
index 317ea7ffc..96634b4c1 100644
--- a/java_generate/templates/class.template.html
+++ b/java_generate/templates/class.template.html
@@ -1,7 +1,7 @@
- <!-- classname --> \ Language (API) \ Processing 2+
+ <!-- classname --> \ Language (API) \ Processing 3+
@@ -23,11 +23,13 @@
-
+
- Processing Foundation
@@ -36,12 +38,19 @@
+
@@ -80,37 +89,8 @@
- 
+ 
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
-
@@ -122,8 +102,7 @@
© Info
-
-
+
diff --git a/java_generate/templates/generic.template.html b/java_generate/templates/generic.template.html
index 9ab25b7df..d8858a537 100644
--- a/java_generate/templates/generic.template.html
+++ b/java_generate/templates/generic.template.html
@@ -1,7 +1,7 @@
- <!-- require:classname --><!-- classname -->::<!-- end --><!-- name --> \ Language (API) \ Processing 2+
+ <!-- require:classname --><!-- classname -->::<!-- end --><!-- name --> \ Language (API) \ Processing 3+
@@ -23,12 +23,13 @@
-
- Processing Foundation
@@ -37,12 +38,18 @@
+
@@ -81,37 +88,8 @@
-
+
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
-
diff --git a/java_generate/templates/index.alphabetical.template.html b/java_generate/templates/index.alphabetical.template.html
index a5bc41b10..1c52fca5c 100644
--- a/java_generate/templates/index.alphabetical.template.html
+++ b/java_generate/templates/index.alphabetical.template.html
@@ -1,7 +1,7 @@
- Alphabetical Language Reference (API) \ Processing 2+
+ Alphabetical Language Reference (API) \ Processing 3+
@@ -27,6 +27,8 @@
Processing
p5.js
Processing.py
+ Processing for Android
+ Processing for Pi
- Processing Foundation
@@ -41,6 +43,12 @@
+
diff --git a/java_generate/templates/index.template.html b/java_generate/templates/index.template.html
index 87b810bcb..12b460548 100644
--- a/java_generate/templates/index.template.html
+++ b/java_generate/templates/index.template.html
@@ -1,7 +1,7 @@
- Language Reference (API) \ Processing 2+
+ Language Reference (API) \ Processing 3+
@@ -26,12 +26,12 @@
- Processing
- p5.js
- Processing.py
+ - Processing for Android
+ - Processing for Pi
-
@@ -42,6 +42,12 @@
+
diff --git a/java_generate/templates/library.index.template.html b/java_generate/templates/library.index.template.html
index b148fd2a5..98c01d64e 100644
--- a/java_generate/templates/library.index.template.html
+++ b/java_generate/templates/library.index.template.html
@@ -1,7 +1,7 @@
- Video \ Libraries \ Processing 2+
+ Video \ Libraries \ Processing 3+
@@ -23,11 +23,13 @@
-
+
- Processing Foundation
@@ -82,7 +84,7 @@ Events
© Info
-
+
diff --git a/java_generate/templates/nav.web.template.html b/java_generate/templates/nav.web.template.html
index 010aeb9d9..43f41939c 100644
--- a/java_generate/templates/nav.web.template.html
+++ b/java_generate/templates/nav.web.template.html
@@ -1,32 +1,33 @@
\ No newline at end of file
diff --git a/javascript/p5.dom.min.js b/javascript/p5.dom.min.js
new file mode 100644
index 000000000..d68c04f58
--- /dev/null
+++ b/javascript/p5.dom.min.js
@@ -0,0 +1 @@
+(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.prototype.select=function(e,p){var res=null;var container=getContainer(p);if(e[0]==="."){e=e.slice(1);res=container.getElementsByClassName(e);if(res.length){res=res[0]}else{res=null}}else if(e[0]==="#"){e=e.slice(1);res=container.getElementById(e)}else{res=container.getElementsByTagName(e);if(res.length){res=res[0]}else{res=null}}if(res){return wrapElement(res)}else{return null}};p5.prototype.selectAll=function(e,p){var arr=[];var res;var container=getContainer(p);if(e[0]==="."){e=e.slice(1);res=container.getElementsByClassName(e)}else{res=container.getElementsByTagName(e)}if(res){for(var j=0;j1&&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()}};elt.src=args[0];if(args.length>1&&typeof args[1]==="string"){elt.alt=args[1]}elt.onload=function(){setAttrs()};self=addElement(elt,this);return self};p5.prototype.createA=function(href,html,target){var elt=document.createElement("a");elt.href=href;elt.innerHTML=html;if(target)elt.target=target;return addElement(elt,this)};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(typeof value==="number")elt.value=value;return addElement(elt,this)};p5.prototype.createButton=function(label,value){var elt=document.createElement("button");elt.innerHTML=label;elt.value=value;if(value)elt.value=value;return addElement(elt,this)};p5.prototype.createCheckbox=function(){var elt=document.createElement("input");elt.type="checkbox";var self=addElement(elt,this);self.checked=function(){if(arguments.length===0){return self.elt.checked}else if(arguments[0]){self.elt.checked=true}else{self.elt.checked=false}return self};this.value=function(val){self.value=val;return this};if(arguments[0]){var ran=Math.random().toString(36).slice(2);var label=document.createElement("label");elt.setAttribute("id",ran);label.htmlFor=ran;self.value(arguments[0]);label.appendChild(document.createTextNode(arguments[0]));addElement(label,this)}if(arguments[1]){elt.checked=true}return self};p5.prototype.createSelect=function(mult){var elt=document.createElement("select");if(mult){elt.setAttribute("multiple","true")}var self=addElement(elt,this);self.option=function(name,value){var opt=document.createElement("option");opt.innerHTML=name;if(arguments.length>1)opt.value=value;else opt.value=name;elt.appendChild(opt)};self.selected=function(value){var arr=[];if(arguments.length>0){for(var i=0;i1){console.log(radios,radios[0].name);var length=radios.length;var prev=radios[0].name;var current=radios[1].name;count=1;for(var i=1;i1)opt.value=value;else opt.value=name;opt.setAttribute("name","defaultradio"+count);elt.appendChild(opt);if(name){times++;var ran=Math.random().toString(36).slice(2);var label=document.createElement("label");opt.setAttribute("id","defaultradio"+count+"-"+times);label.htmlFor="defaultradio"+count+"-"+times;label.appendChild(document.createTextNode(name));elt.appendChild(label)}return opt};self.selected=function(){var length=this.elt.childNodes.length;if(arguments[0]){for(var i=0;i-1){reader.readAsText(f)}else{reader.readAsDataURL(f)}}}elt.addEventListener("change",handleFileSelect,false);return addElement(elt,this)}else{console.log("The File APIs are not fully supported in this browser. Cannot create element.")}};function createMedia(pInst,type,src,callback){var elt=document.createElement(type);var src=src||"";if(typeof src==="string"){src=[src]}for(var i=0;i0){this.elt.value=arguments[0];return this}else{if(this.elt.type==="range"){return parseFloat(this.elt.value)}else return this.elt.value}};p5.Element.prototype.show=function(){this.elt.style.display="block";return this};p5.Element.prototype.hide=function(){this.elt.style.display="none";return this};p5.Element.prototype.size=function(w,h){if(arguments.length===0){return{width:this.elt.offsetWidth,height:this.elt.offsetHeight}}else{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}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; height:"+aH+"px");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";this.elt.style.height=aH+"px";this.elt.width=aW;this.elt.height=aH;this.width=aW;this.height=aH}this.width=this.elt.offsetWidth;this.height=this.elt.offsetHeight;if(this._pInst){if(this._pInst._curElement.elt===this.elt){this._pInst._setProperty("width",this.elt.offsetWidth);this._pInst._setProperty("height",this.elt.offsetHeight)}}}return this}};p5.Element.prototype.remove=function(){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=function(elt,pInst){p5.Element.call(this,elt,pInst);var self=this;this.elt.crossOrigin="anonymous";this._prevTime=0;this._cueIDCounter=0;this._cues=[];this._pixelDensity=1;Object.defineProperty(self,"src",{get:function(){var firstChildSrc=self.elt.children[0].src;var srcVal=self.elt.src===window.location.href?"":self.elt.src;var ret=firstChildSrc===window.location.href?srcVal:firstChildSrc;return ret},set:function(newValue){for(var i=0;i1){this.elt.play()}else{this.elt.load();this.elt.play()}return this};p5.MediaElement.prototype.stop=function(){this.elt.pause();this.elt.currentTime=0;return this};p5.MediaElement.prototype.pause=function(){this.elt.pause();return this};p5.MediaElement.prototype.loop=function(){this.elt.setAttribute("loop",true);this.play();return this};p5.MediaElement.prototype.noLoop=function(){this.elt.setAttribute("loop",false);return this};p5.MediaElement.prototype.autoplay=function(val){this.elt.setAttribute("autoplay",val);return this};p5.MediaElement.prototype.volume=function(val){if(typeof val==="undefined"){return this.elt.volume}else{this.elt.volume=val}};p5.MediaElement.prototype.time=function(val){if(typeof val==="undefined"){return this.elt.currentTime}else{this.elt.currentTime=val}};p5.MediaElement.prototype.duration=function(){return this.elt.duration};p5.MediaElement.prototype.pixels=[];p5.MediaElement.prototype.loadPixels=function(){if(!this.canvas){this.canvas=document.createElement("canvas");this.drawingContext=this.canvas.getContext("2d")}if(this.loadedmetadata){if(this.canvas.width!==this.elt.width){this.canvas.width=this.elt.width;this.canvas.height=this.elt.height;this.width=this.canvas.width;this.height=this.canvas.height}this.drawingContext.drawImage(this.elt,0,0,this.canvas.width,this.canvas.height);p5.Renderer2D.prototype.loadPixels.call(this)}return this};p5.MediaElement.prototype.updatePixels=function(x,y,w,h){if(this.loadedmetadata){p5.Renderer2D.prototype.updatePixels.call(this,x,y,w,h)}return this};p5.MediaElement.prototype.get=function(x,y,w,h){if(this.loadedmetadata){return p5.Renderer2D.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){p5.Renderer2D.prototype.set.call(this,x,y,imgOrCol)}};p5.MediaElement.prototype.onended=function(callback){this._onended=callback;return this};p5.MediaElement.prototype.connect=function(obj){var audioContext,masterOutput;if(typeof p5.prototype.getAudioContext==="function"){audioContext=p5.prototype.getAudioContext();masterOutput=p5.soundOut.input}else{try{audioContext=obj.context;masterOutput=audioContext.destination}catch(e){throw"connect() is meant to be used with Web Audio API or p5.sound.js"}}if(!this.audioSourceNode){this.audioSourceNode=audioContext.createMediaElementSource(this.elt);this.audioSourceNode.connect(masterOutput)}if(obj){if(obj.input){this.audioSourceNode.connect(obj.input)}else{this.audioSourceNode.connect(obj)}}else{this.audioSourceNode.connect(masterOutput)}};p5.MediaElement.prototype.disconnect=function(){if(this.audioSourceNode){this.audioSourceNode.disconnect()}else{throw"nothing to disconnect"}};p5.MediaElement.prototype.showControls=function(){this.elt.style["text-align"]="inherit";this.elt.controls=true};p5.MediaElement.prototype.hideControls=function(){this.elt.controls=false};p5.MediaElement.prototype.addCue=function(time,callback,val){var id=this._cueIDCounter++;var cue=new Cue(callback,time,id,val);this._cues.push(cue);if(!this.elt.ontimeupdate){this.elt.ontimeupdate=this._onTimeUpdate.bind(this)}return id};p5.MediaElement.prototype.removeCue=function(id){for(var i=0;i0,"No "+b+" specified.")}var c=[],d=this;b("familyName"),b("weightName"),b("manufacturer"),b("copyright"),b("version"),a(this.unitsPerEm>0,"No unitsPerEm specified.")},d.prototype.toTables=function(){return f.fontToTable(this)},d.prototype.toBuffer=function(){for(var a=this.toTables(),b=a.encode(),c=new ArrayBuffer(b.length),d=new Uint8Array(c),e=0;eD;D+=1){var E=l.getTag(m,C),F=l.getULong(m,C+8);switch(E){case"cmap":k.tables.cmap=n.parse(m,F),k.encoding=new i.CmapEncoding(k.tables.cmap),k.encoding||(k.supported=!1);break;case"head":k.tables.head=r.parse(m,F),k.unitsPerEm=k.tables.head.unitsPerEm,b=k.tables.head.indexToLocFormat;break;case"hhea":k.tables.hhea=s.parse(m,F),k.ascender=k.tables.hhea.ascender,k.descender=k.tables.hhea.descender,k.numberOfHMetrics=k.tables.hhea.numberOfHMetrics;break;case"hmtx":c=F;break;case"maxp":k.tables.maxp=w.parse(m,F),k.numGlyphs=k.tables.maxp.numGlyphs;break;case"name":k.tables.name=x.parse(m,F),k.familyName=k.tables.name.fontFamily,k.styleName=k.tables.name.fontSubfamily;break;case"OS/2":k.tables.os2=y.parse(m,F);break;case"post":k.tables.post=z.parse(m,F),k.glyphNames=new i.GlyphNames(k.tables.post);break;case"glyf":d=F;break;case"loca":e=F;break;case"CFF ":f=F;break;case"kern":g=F;break;case"GPOS":h=F}C+=16}if(d&&e){var G=0===b,H=v.parse(m,e,k.numGlyphs,G);k.glyphs=p.parse(m,d,H,k),t.parse(m,c,k.numberOfHMetrics,k.numGlyphs,k.glyphs),i.addGlyphNames(k)}else f?(o.parse(m,f,k),i.addGlyphNames(k)):k.supported=!1;return k.supported&&(g?k.kerningPairs=u.parse(m,g):k.kerningPairs={},h&&q.parse(m,h,k)),k}function h(a,b){var c="undefined"==typeof window,d=c?e:f;d(a,function(a,c){if(a)return b(a);var d=g(c);return d.supported?b(null,d):b("Font is not supported (is this a Postscript font?)")})}var i=a("./encoding"),j=a("./font"),k=a("./glyph"),l=a("./parse"),m=a("./path"),n=a("./tables/cmap"),o=a("./tables/cff"),p=a("./tables/glyf"),q=a("./tables/gpos"),r=a("./tables/head"),s=a("./tables/hhea"),t=a("./tables/hmtx"),u=a("./tables/kern"),v=a("./tables/loca"),w=a("./tables/maxp"),x=a("./tables/name"),y=a("./tables/os2"),z=a("./tables/post");c._parse=l,c.Font=j.Font,c.Glyph=k.Glyph,c.Path=m.Path,c.parse=g,c.load=h},{"./encoding":4,"./font":5,"./glyph":6,"./parse":9,"./path":10,"./tables/cff":12,"./tables/cmap":13,"./tables/glyf":14,"./tables/gpos":15,"./tables/head":16,"./tables/hhea":17,"./tables/hmtx":18,"./tables/kern":19,"./tables/loca":20,"./tables/maxp":21,"./tables/name":22,"./tables/os2":23,"./tables/post":24,fs:1}],9:[function(a,b,c){"use strict";function d(a,b){this.data=a,this.offset=b,this.relativeOffset=0}c.getByte=function(a,b){return a.getUint8(b)},c.getCard8=c.getByte,c.getUShort=function(a,b){return a.getUint16(b,!1)},c.getCard16=c.getUShort,c.getShort=function(a,b){return a.getInt16(b,!1)},c.getULong=function(a,b){return a.getUint32(b,!1)},c.getFixed=function(a,b){var c=a.getInt16(b,!1),d=a.getUint16(b+2,!1);return c+d/65535},c.getTag=function(a,b){for(var c="",d=b;b+4>d;d+=1)c+=String.fromCharCode(a.getInt8(d));return c},c.getOffset=function(a,b,c){for(var d=0,e=0;c>e;e+=1)d<<=8,d+=a.getUint8(b+e);return d},c.getBytes=function(a,b,c){for(var d=[],e=b;c>e;e+=1)d.push(a.getUint8(e));return d},c.bytesToString=function(a){for(var b="",c=0;cf;f++)b[f]=c.getUShort(d,e),e+=2;return this.relativeOffset+=2*a,b},d.prototype.parseString=function(a){var b=this.data,c=this.offset+this.relativeOffset,d="";this.relativeOffset+=a;for(var e=0;a>e;e++)d+=String.fromCharCode(b.getUint8(c+e));return d},d.prototype.parseTag=function(){return this.parseString(4)},d.prototype.parseLongDateTime=function(){var a=c.getULong(this.data,this.offset+this.relativeOffset+4);return this.relativeOffset+=8,a},d.prototype.parseFixed=function(){var a=c.getULong(this.data,this.offset+this.relativeOffset);return this.relativeOffset+=4,a/65536},d.prototype.parseVersion=function(){var a=c.getUShort(this.data,this.offset+this.relativeOffset),b=c.getUShort(this.data,this.offset+this.relativeOffset+2);return this.relativeOffset+=4,a+b/4096/10},d.prototype.skip=function(a,b){void 0===b&&(b=1),this.relativeOffset+=e[a]*b},c.Parser=d},{}],10:[function(a,b,c){"use strict";function d(){this.commands=[],this.fill="black",this.stroke=null,this.strokeWidth=1}d.prototype.moveTo=function(a,b){this.commands.push({type:"M",x:a,y:b})},d.prototype.lineTo=function(a,b){this.commands.push({type:"L",x:a,y:b})},d.prototype.curveTo=d.prototype.bezierCurveTo=function(a,b,c,d,e,f){this.commands.push({type:"C",x1:a,y1:b,x2:c,y2:d,x:e,y:f})},d.prototype.quadTo=d.prototype.quadraticCurveTo=function(a,b,c,d){this.commands.push({type:"Q",x1:a,y1:b,x:c,y:d})},d.prototype.close=d.prototype.closePath=function(){this.commands.push({type:"Z"})},d.prototype.extend=function(a){a.commands&&(a=a.commands),Array.prototype.push.apply(this.commands,a)},d.prototype.draw=function(a){a.beginPath();for(var b=0;b=0&&c>0&&(a+=" "),a+=b(d)}return a}a=void 0!==a?a:2;for(var d="",e=0;ed;d+=1)g.push(J.getOffset(a,k,j)),k+=j;f=e+g[i]}else f=b+2;for(d=0;d>4,g=15&e;if(f===c)break;if(b+=d[f],g===c)break;b+=d[g]}return parseFloat(b)}function g(a,b){var c,d,e,g;if(28===b)return c=a.parseByte(),d=a.parseByte(),c<<8|d;if(29===b)return c=a.parseByte(),d=a.parseByte(),e=a.parseByte(),g=a.parseByte(),c<<24|d<<16|e<<8|g;if(30===b)return f(a);if(b>=32&&246>=b)return b-139;if(b>=247&&250>=b)return c=a.parseByte(),256*(b-247)+c+108;if(b>=251&&254>=b)return c=a.parseByte(),256*-(b-251)-c-108;throw new Error("Invalid b0 "+b)}function h(a){for(var b={},c=0;c=i?(12===i&&(i=1200+d.parseByte()),e.push([i,f]),f=[]):f.push(g(d,i))}return h(e)}function j(a,b){return b=390>=b?H.cffStandardStrings[b]:a[b-391]}function k(a,b,c){for(var d={},e=0;ee;e+=1)f=h.parseSID(),i.push(j(d,f));else if(1===k)for(;i.length<=c;)for(f=h.parseSID(),g=h.parseCard8(),e=0;g>=e;e+=1)i.push(j(d,f)),f+=1;else{if(2!==k)throw new Error("Unknown charset format "+k);for(;i.length<=c;)for(f=h.parseSID(),g=h.parseCard16(),e=0;g>=e;e+=1)i.push(j(d,f)),f+=1}return i}function p(a,b,c){var d,e,f={},g=new J.Parser(a,b),h=g.parseCard8();if(0===h){var i=g.parseCard8();for(d=0;i>d;d+=1)e=g.parseCard8(),f[e]=d}else{if(1!==h)throw new Error("Unknown encoding format "+h);var j=g.parseCard8();for(e=1,d=0;j>d;d+=1)for(var k=g.parseCard8(),l=g.parseCard8(),m=k;k+l>=m;m+=1)f[m]=e,e+=1}return new H.CffEncoding(f,c)}function q(a,b,c){function d(a,b){p&&k.closePath(),k.moveTo(a,b),p=!0}function e(){
+var b;b=l.length%2!==0,b&&!n&&(o=l.shift()+a.nominalWidthX),m+=l.length>>1,l.length=0,n=!0}function f(c){for(var s,t,u,v,w,x,y,z,A,B,C,D,E=0;E1&&!n&&(o=l.shift()+a.nominalWidthX,n=!0),r+=l.pop(),d(q,r);break;case 5:for(;l.length>0;)q+=l.shift(),r+=l.shift(),k.lineTo(q,r);break;case 6:for(;l.length>0&&(q+=l.shift(),k.lineTo(q,r),0!==l.length);)r+=l.shift(),k.lineTo(q,r);break;case 7:for(;l.length>0&&(r+=l.shift(),k.lineTo(q,r),0!==l.length);)q+=l.shift(),k.lineTo(q,r);break;case 8:for(;l.length>0;)g=q+l.shift(),h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),q=i+l.shift(),r=j+l.shift(),k.curveTo(g,h,i,j,q,r);break;case 10:w=l.pop()+a.subrsBias,x=a.subrs[w],x&&f(x);break;case 11:return;case 12:switch(F=c[E],E+=1,F){case 35:g=q+l.shift(),h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),y=i+l.shift(),z=j+l.shift(),A=y+l.shift(),B=z+l.shift(),C=A+l.shift(),D=B+l.shift(),q=C+l.shift(),r=D+l.shift(),l.shift(),k.curveTo(g,h,i,j,y,z),k.curveTo(A,B,C,D,q,r);break;case 34:g=q+l.shift(),h=r,i=g+l.shift(),j=h+l.shift(),y=i+l.shift(),z=j,A=y+l.shift(),B=j,C=A+l.shift(),D=r,q=C+l.shift(),k.curveTo(g,h,i,j,y,z),k.curveTo(A,B,C,D,q,r);break;case 36:g=q+l.shift(),h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),y=i+l.shift(),z=j,A=y+l.shift(),B=j,C=A+l.shift(),D=B+l.shift(),q=C+l.shift(),k.curveTo(g,h,i,j,y,z),k.curveTo(A,B,C,D,q,r);break;case 37:g=q+l.shift(),h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),y=i+l.shift(),z=j+l.shift(),A=y+l.shift(),B=z+l.shift(),C=A+l.shift(),D=B+l.shift(),Math.abs(C-q)>Math.abs(D-r)?q=C+l.shift():r=D+l.shift(),k.curveTo(g,h,i,j,y,z),k.curveTo(A,B,C,D,q,r);break;default:console.log("Glyph "+b.index+": unknown operator 1200"+F),l.length=0}break;case 14:l.length>0&&!n&&(o=l.shift()+a.nominalWidthX,n=!0),p&&(k.closePath(),p=!1);break;case 18:e();break;case 19:case 20:e(),E+=m+7>>3;break;case 21:l.length>2&&!n&&(o=l.shift()+a.nominalWidthX,n=!0),r+=l.pop(),q+=l.pop(),d(q,r);break;case 22:l.length>1&&!n&&(o=l.shift()+a.nominalWidthX,n=!0),q+=l.pop(),d(q,r);break;case 23:e();break;case 24:for(;l.length>2;)g=q+l.shift(),h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),q=i+l.shift(),r=j+l.shift(),k.curveTo(g,h,i,j,q,r);q+=l.shift(),r+=l.shift(),k.lineTo(q,r);break;case 25:for(;l.length>6;)q+=l.shift(),r+=l.shift(),k.lineTo(q,r);g=q+l.shift(),h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),q=i+l.shift(),r=j+l.shift(),k.curveTo(g,h,i,j,q,r);break;case 26:for(l.length%2&&(q+=l.shift());l.length>0;)g=q,h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),q=i,r=j+l.shift(),k.curveTo(g,h,i,j,q,r);break;case 27:for(l.length%2&&(r+=l.shift());l.length>0;)g=q+l.shift(),h=r,i=g+l.shift(),j=h+l.shift(),q=i+l.shift(),r=j,k.curveTo(g,h,i,j,q,r);break;case 28:s=c[E],t=c[E+1],l.push((s<<24|t<<16)>>16),E+=2;break;case 29:w=l.pop()+a.gsubrsBias,x=a.gsubrs[w],x&&f(x);break;case 30:for(;l.length>0&&(g=q,h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),q=i+l.shift(),r=j+(1===l.length?l.shift():0),k.curveTo(g,h,i,j,q,r),0!==l.length);)g=q+l.shift(),h=r,i=g+l.shift(),j=h+l.shift(),r=j+l.shift(),q=i+(1===l.length?l.shift():0),k.curveTo(g,h,i,j,q,r);break;case 31:for(;l.length>0&&(g=q+l.shift(),h=r,i=g+l.shift(),j=h+l.shift(),r=j+l.shift(),q=i+(1===l.length?l.shift():0),k.curveTo(g,h,i,j,q,r),0!==l.length);)g=q,h=r+l.shift(),i=g+l.shift(),j=h+l.shift(),q=i+l.shift(),r=j+(1===l.length?l.shift():0),k.curveTo(g,h,i,j,q,r);break;default:32>F?console.log("Glyph "+b.index+": unknown operator "+F):247>F?l.push(F-139):251>F?(s=c[E],E+=1,l.push(256*(F-247)+s+108)):255>F?(s=c[E],E+=1,l.push(256*-(F-251)-s-108)):(s=c[E],t=c[E+1],u=c[E+2],v=c[E+3],E+=4,l.push((s<<24|t<<16|u<<8|v)/65536))}}}var g,h,i,j,k=new K.Path,l=[],m=0,n=!1,o=a.defaultWidthX,p=!1,q=0,r=0;return f(c),b.advanceWidth=o,k}function r(a){var b;return b=a.length<1240?107:a.length<33900?1131:32768}function s(a,b,c){c.tables.cff={};var d=l(a,b),f=e(a,d.endOffset,J.bytesToString),g=e(a,f.endOffset),h=e(a,g.endOffset,J.bytesToString),i=e(a,h.endOffset);c.gsubrs=i.objects,c.gsubrsBias=r(c.gsubrs);var j=new DataView(new Uint8Array(g.objects[0]).buffer),k=m(j,h.objects);c.tables.cff.topDict=k;var s=b+k["private"][1],t=n(a,s,k["private"][0],h.objects);if(c.defaultWidthX=t.defaultWidthX,c.nominalWidthX=t.nominalWidthX,0!==t.subrs){var u=s+t.subrs,v=e(a,u);c.subrs=v.objects,c.subrsBias=r(c.subrs)}else c.subrs=[],c.subrsBias=0;var w=e(a,b+k.charStrings);c.nGlyphs=w.objects.length;var x=o(a,b+k.charset,c.nGlyphs,h.objects);0===k.encoding?c.cffEncoding=new H.CffEncoding(H.cffStandardEncoding,x):1===k.encoding?c.cffEncoding=new H.CffEncoding(H.cffExpertEncoding,x):c.cffEncoding=p(a,b+k.encoding,x),c.encoding=c.encoding||c.cffEncoding,c.glyphs=new I.GlyphSet(c);for(var y=0;y=0&&(c=d),d=b.indexOf(a),d>=0?c=d+H.cffStandardStrings.length:(c=H.cffStandardStrings.length+b.length,b.push(a)),c}function u(){return new L.Table("Header",[{name:"major",type:"Card8",value:1},{name:"minor",type:"Card8",value:0},{name:"hdrSize",type:"Card8",value:4},{name:"major",type:"Card8",value:1}])}function v(a){var b=new L.Table("Name INDEX",[{name:"names",type:"INDEX",value:[]}]);b.names=[];for(var c=0;c>1,j.skip("uShort",3),d.glyphIndexMap={};var l=new i.Parser(a,b+e+14),m=new i.Parser(a,b+e+16+2*k),n=new i.Parser(a,b+e+16+4*k),o=new i.Parser(a,b+e+16+6*k),p=b+e+16+8*k;for(c=0;k-1>c;c+=1)for(var q,r=l.parseUShort(),s=m.parseUShort(),t=n.parseShort(),u=o.parseUShort(),v=s;r>=v;v+=1)0!==u?(p=o.offset+o.relativeOffset-2,p+=u,p+=2*(v-s),q=i.getUShort(a,p),0!==q&&(q=q+t&65535)):q=v+t&65535,d.glyphIndexMap[v]=q;return d}function e(a,b,c){a.segments.push({end:b,start:b,delta:-(b-c),offset:0})}function f(a){a.segments.push({end:65535,start:65535,delta:1,offset:0})}function g(a){var b,c=new j.Table("cmap",[{name:"version",type:"USHORT",value:0},{name:"numTables",type:"USHORT",value:1},{name:"platformID",type:"USHORT",value:3},{name:"encodingID",type:"USHORT",value:1},{name:"offset",type:"ULONG",value:12},{name:"format",type:"USHORT",value:4},{name:"length",type:"USHORT",value:0},{name:"language",type:"USHORT",value:0},{name:"segCountX2",type:"USHORT",value:0},{name:"searchRange",type:"USHORT",value:0},{name:"entrySelector",type:"USHORT",value:0},{name:"rangeShift",type:"USHORT",value:0}]);for(c.segments=[],b=0;bb;b+=1){var o=c.segments[b];i=i.concat({name:"end_"+b,type:"USHORT",value:o.end}),k=k.concat({name:"start_"+b,type:"USHORT",value:o.start}),l=l.concat({name:"idDelta_"+b,type:"SHORT",value:o.delta}),m=m.concat({name:"idRangeOffset_"+b,type:"USHORT",value:o.offset}),void 0!==o.glyphId&&(n=n.concat({name:"glyph_"+b,type:"USHORT",value:o.glyphId}))}return c.fields=c.fields.concat(i),c.fields.push({name:"reservedPad",type:"USHORT",value:0}),c.fields=c.fields.concat(k),c.fields=c.fields.concat(l),c.fields=c.fields.concat(m),c.fields=c.fields.concat(n),c.length=14+2*i.length+2+2*k.length+2*l.length+2*m.length+2*n.length,c}var h=a("../check"),i=a("../parse"),j=a("../table");c.parse=d,c.make=g},{"../check":2,"../parse":9,"../table":11}],14:[function(a,b,c){"use strict";function d(a,b,c,d,e){var f;return(b&d)>0?(f=a.parseByte(),0===(b&e)&&(f=-f),f=c+f):f=(b&e)>0?c:c+a.parseShort(),f}function e(a,b,c){var e=new m.Parser(b,c);a.numberOfContours=e.parseShort(),a.xMin=e.parseShort(),a.yMin=e.parseShort(),a.xMax=e.parseShort(),a.yMax=e.parseShort();var f,g;if(a.numberOfContours>0){var h,i=a.endPointIndices=[];for(h=0;hh;h+=1)if(g=e.parseByte(),f.push(g),(8&g)>0)for(var l=e.parseByte(),n=0;l>n;n+=1)f.push(g),h+=1;if(k.argument(f.length===j,"Bad flags."),i.length>0){var o,p=[];if(j>0){for(h=0;j>h;h+=1)g=f[h],o={},o.onCurve=!!(1&g),o.lastPointOfContour=i.indexOf(h)>=0,p.push(o);var q=0;for(h=0;j>h;h+=1)g=f[h],o=p[h],o.x=d(e,g,q,2,16),q=o.x;var r=0;for(h=0;j>h;h+=1)g=f[h],o=p[h],o.y=d(e,g,r,4,32),r=o.y}a.points=p}else a.points=[]}else if(0===a.numberOfContours)a.points=[];else{a.isComposite=!0,a.points=[],a.components=[];for(var s=!0;s;){f=e.parseUShort();var t={glyphIndex:e.parseUShort(),xScale:1,scale01:0,scale10:0,yScale:1,dx:0,dy:0};(1&f)>0?(t.dx=e.parseShort(),t.dy=e.parseShort()):(t.dx=e.parseChar(),t.dy=e.parseChar()),(8&f)>0?t.xScale=t.yScale=e.parseF2Dot14():(64&f)>0?(t.xScale=e.parseF2Dot14(),t.yScale=e.parseF2Dot14()):(128&f)>0&&(t.xScale=e.parseF2Dot14(),t.scale01=e.parseF2Dot14(),t.scale10=e.parseF2Dot14(),t.yScale=e.parseF2Dot14()),a.components.push(t),s=!!(32&f)}}}function f(a,b){for(var c=[],d=0;df;f++)e[c.parseTag()]={offset:c.parseUShort()};return e}function e(a,b){var c=new k.Parser(a,b),d=c.parseUShort(),e=c.parseUShort();if(1===d)return c.parseUShortList(e);if(2===d){for(var f=[];e--;)for(var g=c.parseUShort(),h=c.parseUShort(),i=c.parseUShort(),j=g;h>=j;j++)f[i++]=j;return f}}function f(a,b){var c=new k.Parser(a,b),d=c.parseUShort();if(1===d){var e=c.parseUShort(),f=c.parseUShort(),g=c.parseUShortList(f);return function(a){return g[a-e]||0}}if(2===d){for(var h=c.parseUShort(),i=[],j=[],l=[],m=0;h>m;m++)i[m]=c.parseUShort(),j[m]=c.parseUShort(),l[m]=c.parseUShort();return function(a){for(var b=0,c=i.length-1;c>b;){var d=b+c+1>>1;ar;r++){var s=q[r],t=n[s];if(!t){t={},g.relativeOffset=s;for(var u=g.parseUShort();u--;){var v=g.parseUShort();l&&(c=g.parseShort()),m&&(d=g.parseShort()),t[v]=c}}p[j[r]]=t}return function(a,b){var c=p[a];return c?c[b]:void 0}}if(2===h){for(var w=g.parseUShort(),x=g.parseUShort(),y=g.parseUShort(),z=g.parseUShort(),A=f(a,b+w),B=f(a,b+x),C=[],D=0;y>D;D++)for(var E=C[D]=[],F=0;z>F;F++)l&&(c=g.parseShort()),m&&(d=g.parseShort()),E[F]=c;var G={};for(D=0;Dm;m++)l.push(g(a,b+i[m]));j.getKerningValue=function(a,b){for(var c=l.length;c--;){var d=l[c](a,b);if(void 0!==d)return d}return 0}}return j}function i(a,b,c){var e=new k.Parser(a,b),f=e.parseFixed();j.argument(1===f,"Unsupported GPOS table version."),d(a,b+e.parseUShort()),d(a,b+e.parseUShort());var g=e.parseUShort();e.relativeOffset=g;for(var i=e.parseUShort(),l=e.parseOffset16List(i),m=b+g,n=0;i>n;n++){var o=h(a,m+l[n]);2!==o.lookupType||c.getGposKerningValue||(c.getGposKerningValue=o.getKerningValue)}}var j=a("../check"),k=a("../parse");c.parse=i},{"../check":2,"../parse":9}],16:[function(a,b,c){"use strict";function d(a,b){var c={},d=new g.Parser(a,b);return c.version=d.parseVersion(),c.fontRevision=Math.round(1e3*d.parseFixed())/1e3,c.checkSumAdjustment=d.parseULong(),c.magicNumber=d.parseULong(),f.argument(1594834165===c.magicNumber,"Font header has wrong magic number."),c.flags=d.parseUShort(),c.unitsPerEm=d.parseUShort(),c.created=d.parseLongDateTime(),c.modified=d.parseLongDateTime(),c.xMin=d.parseShort(),c.yMin=d.parseShort(),c.xMax=d.parseShort(),c.yMax=d.parseShort(),c.macStyle=d.parseUShort(),c.lowestRecPPEM=d.parseUShort(),c.fontDirectionHint=d.parseShort(),c.indexToLocFormat=d.parseShort(),c.glyphDataFormat=d.parseShort(),c}function e(a){return new h.Table("head",[{name:"version",type:"FIXED",value:65536},{name:"fontRevision",type:"FIXED",value:65536},{name:"checkSumAdjustment",type:"ULONG",value:0},{name:"magicNumber",type:"ULONG",value:1594834165},{name:"flags",type:"USHORT",value:0},{name:"unitsPerEm",type:"USHORT",value:1e3},{name:"created",type:"LONGDATETIME",value:0},{name:"modified",type:"LONGDATETIME",value:0},{name:"xMin",type:"SHORT",value:0},{name:"yMin",type:"SHORT",value:0},{name:"xMax",type:"SHORT",value:0},{name:"yMax",type:"SHORT",value:0},{name:"macStyle",type:"USHORT",value:0},{name:"lowestRecPPEM",type:"USHORT",value:0},{name:"fontDirectionHint",type:"SHORT",value:2},{name:"indexToLocFormat",type:"SHORT",value:0},{name:"glyphDataFormat",type:"SHORT",value:0}],a)}var f=a("../check"),g=a("../parse"),h=a("../table");c.parse=d,c.make=e},{"../check":2,"../parse":9,"../table":11}],17:[function(a,b,c){"use strict";function d(a,b){var c={},d=new f.Parser(a,b);return c.version=d.parseVersion(),c.ascender=d.parseShort(),c.descender=d.parseShort(),c.lineGap=d.parseShort(),c.advanceWidthMax=d.parseUShort(),c.minLeftSideBearing=d.parseShort(),c.minRightSideBearing=d.parseShort(),c.xMaxExtent=d.parseShort(),c.caretSlopeRise=d.parseShort(),c.caretSlopeRun=d.parseShort(),c.caretOffset=d.parseShort(),d.relativeOffset+=8,c.metricDataFormat=d.parseShort(),c.numberOfHMetrics=d.parseUShort(),c}function e(a){return new g.Table("hhea",[{name:"version",type:"FIXED",value:65536},{name:"ascender",type:"FWORD",value:0},{name:"descender",type:"FWORD",value:0},{name:"lineGap",type:"FWORD",value:0},{name:"advanceWidthMax",type:"UFWORD",value:0},{name:"minLeftSideBearing",type:"FWORD",value:0},{name:"minRightSideBearing",type:"FWORD",value:0},{name:"xMaxExtent",type:"FWORD",value:0},{name:"caretSlopeRise",type:"SHORT",value:1},{name:"caretSlopeRun",type:"SHORT",value:0},{name:"caretOffset",type:"SHORT",value:0},{name:"reserved1",type:"SHORT",value:0},{name:"reserved2",type:"SHORT",value:0},{name:"reserved3",type:"SHORT",value:0},{name:"reserved4",type:"SHORT",value:0},{name:"metricDataFormat",type:"SHORT",value:0},{name:"numberOfHMetrics",type:"USHORT",value:0}],a)}var f=a("../parse"),g=a("../table");c.parse=d,c.make=e},{"../parse":9,"../table":11}],18:[function(a,b,c){"use strict";function d(a,b,c,d,e){for(var g,h,i=new f.Parser(a,b),j=0;d>j;j+=1){c>j&&(g=i.parseUShort(),h=i.parseShort());var k=e.get(j);k.advanceWidth=g,k.leftSideBearing=h}}function e(a){for(var b=new g.Table("hmtx",[]),c=0;cj;j+=1){var k=d.parseUShort(),l=d.parseUShort(),m=d.parseShort();c[k+","+l]=m}return c}var e=a("../check"),f=a("../parse");c.parse=d},{"../check":2,"../parse":9}],20:[function(a,b,c){"use strict";function d(a,b,c,d){for(var f=new e.Parser(a,b),g=d?f.parseUShort:f.parseULong,h=[],i=0;c+1>i;i+=1){var j=g.call(f);d&&(j*=2),h.push(j)}return h}var e=a("../parse");c.parse=d},{"../parse":9}],21:[function(a,b,c){"use strict";function d(a,b){var c={},d=new f.Parser(a,b);return c.version=d.parseVersion(),c.numGlyphs=d.parseUShort(),1===c.version&&(c.maxPoints=d.parseUShort(),c.maxContours=d.parseUShort(),c.maxCompositePoints=d.parseUShort(),c.maxCompositeContours=d.parseUShort(),c.maxZones=d.parseUShort(),c.maxTwilightPoints=d.parseUShort(),c.maxStorage=d.parseUShort(),c.maxFunctionDefs=d.parseUShort(),c.maxInstructionDefs=d.parseUShort(),c.maxStackElements=d.parseUShort(),c.maxSizeOfInstructions=d.parseUShort(),c.maxComponentElements=d.parseUShort(),c.maxComponentDepth=d.parseUShort()),c}function e(a){return new g.Table("maxp",[{name:"version",type:"FIXED",value:20480},{name:"numGlyphs",type:"USHORT",value:a}])}var f=a("../parse"),g=a("../table");c.parse=d,c.make=e},{"../parse":9,"../table":11}],22:[function(a,b,c){"use strict";function d(a,b){var c={},d=new j.Parser(a,b);c.format=d.parseUShort();for(var e=d.parseUShort(),f=d.offset+d.parseUShort(),g=0,h=0;e>h;h++){var i=d.parseUShort(),k=d.parseUShort(),m=d.parseUShort(),n=d.parseUShort(),o=l[n],p=d.parseUShort(),q=d.parseUShort();if(3===i&&1===k&&1033===m){for(var r=[],s=p/2,t=0;s>t;t++,q+=2)r[t]=j.getShort(a,f+q);var u=String.fromCharCode.apply(null,r);o?c[o]=u:(g++,c["unknown"+g]=u)}}return 1===c.format&&(c.langTagCount=d.parseUShort()),c}function e(a,b,c,d,e,f){return new k.Table("NameRecord",[{name:"platformID",type:"USHORT",value:a},{name:"encodingID",type:"USHORT",value:b},{name:"languageID",type:"USHORT",value:c},{name:"nameID",type:"USHORT",value:d},{name:"length",type:"USHORT",value:e},{name:"offset",type:"USHORT",value:f}])}function f(a,b,c,d){var f=i.STRING(c);return a.records.push(e(1,0,0,b,f.length,d)),a.strings.push(f),d+=f.length}function g(a,b,c,d){var f=i.UTF16(c);return a.records.push(e(3,1,1033,b,f.length,d)),a.strings.push(f),d+=f.length}function h(a){var b=new k.Table("name",[{name:"format",type:"USHORT",value:0},{name:"count",type:"USHORT",value:0},{name:"stringOffset",type:"USHORT",value:0}]);b.records=[],b.strings=[];var c,d,e=0;for(c=0;c=c.begin&&ae;e++)c.panose[e]=d.parseByte();return c.ulUnicodeRange1=d.parseULong(),c.ulUnicodeRange2=d.parseULong(),c.ulUnicodeRange3=d.parseULong(),c.ulUnicodeRange4=d.parseULong(),c.achVendID=String.fromCharCode(d.parseByte(),d.parseByte(),d.parseByte(),d.parseByte()),c.fsSelection=d.parseUShort(),c.usFirstCharIndex=d.parseUShort(),c.usLastCharIndex=d.parseUShort(),c.sTypoAscender=d.parseShort(),c.sTypoDescender=d.parseShort(),c.sTypoLineGap=d.parseShort(),c.usWinAscent=d.parseUShort(),c.usWinDescent=d.parseUShort(),c.version>=1&&(c.ulCodePageRange1=d.parseULong(),c.ulCodePageRange2=d.parseULong()),c.version>=2&&(c.sxHeight=d.parseShort(),c.sCapHeight=d.parseShort(),c.usDefaultChar=d.parseUShort(),c.usBreakChar=d.parseUShort(),c.usMaxContent=d.parseUShort()),c}function f(a){return new h.Table("OS/2",[{name:"version",type:"USHORT",value:3},{name:"xAvgCharWidth",type:"SHORT",value:0},{name:"usWeightClass",type:"USHORT",value:0},{name:"usWidthClass",type:"USHORT",value:0},{name:"fsType",type:"USHORT",value:0},{name:"ySubscriptXSize",type:"SHORT",value:650},{name:"ySubscriptYSize",type:"SHORT",value:699},{name:"ySubscriptXOffset",type:"SHORT",value:0},{name:"ySubscriptYOffset",type:"SHORT",value:140},{name:"ySuperscriptXSize",type:"SHORT",value:650},{name:"ySuperscriptYSize",type:"SHORT",value:699},{name:"ySuperscriptXOffset",type:"SHORT",value:0},{name:"ySuperscriptYOffset",type:"SHORT",value:479},{name:"yStrikeoutSize",type:"SHORT",value:49},{name:"yStrikeoutPosition",type:"SHORT",value:258},{name:"sFamilyClass",type:"SHORT",value:0},{name:"bFamilyType",type:"BYTE",value:0},{name:"bSerifStyle",type:"BYTE",value:0},{name:"bWeight",type:"BYTE",value:0},{name:"bProportion",type:"BYTE",value:0},{name:"bContrast",type:"BYTE",value:0},{name:"bStrokeVariation",type:"BYTE",value:0},{name:"bArmStyle",type:"BYTE",value:0},{name:"bLetterform",type:"BYTE",value:0},{name:"bMidline",type:"BYTE",value:0},{name:"bXHeight",type:"BYTE",value:0},{name:"ulUnicodeRange1",type:"ULONG",value:0},{name:"ulUnicodeRange2",type:"ULONG",value:0},{name:"ulUnicodeRange3",type:"ULONG",value:0},{name:"ulUnicodeRange4",type:"ULONG",value:0},{name:"achVendID",type:"CHARARRAY",value:"XXXX"},{name:"fsSelection",type:"USHORT",value:0},{name:"usFirstCharIndex",type:"USHORT",value:0},{name:"usLastCharIndex",type:"USHORT",value:0},{name:"sTypoAscender",type:"SHORT",value:0},{name:"sTypoDescender",type:"SHORT",value:0},{name:"sTypoLineGap",type:"SHORT",value:0},{name:"usWinAscent",type:"USHORT",value:0},{name:"usWinDescent",type:"USHORT",value:0},{name:"ulCodePageRange1",type:"ULONG",value:0},{name:"ulCodePageRange2",type:"ULONG",value:0},{name:"sxHeight",type:"SHORT",value:0},{name:"sCapHeight",type:"SHORT",value:0},{name:"usDefaultChar",type:"USHORT",value:0},{name:"usBreakChar",type:"USHORT",value:0},{name:"usMaxContext",type:"USHORT",value:0}],a)}var g=a("../parse"),h=a("../table"),i=[{begin:0,end:127},{begin:128,end:255},{begin:256,end:383},{begin:384,end:591},{begin:592,end:687},{begin:688,end:767},{begin:768,end:879},{begin:880,end:1023},{begin:11392,end:11519},{begin:1024,end:1279},{begin:1328,end:1423},{begin:1424,end:1535},{begin:42240,end:42559},{begin:1536,end:1791},{begin:1984,end:2047},{begin:2304,end:2431},{begin:2432,end:2559},{begin:2560,end:2687},{begin:2688,end:2815},{begin:2816,end:2943},{begin:2944,end:3071},{begin:3072,end:3199},{begin:3200,end:3327},{begin:3328,end:3455},{begin:3584,end:3711},{begin:3712,end:3839},{begin:4256,end:4351},{begin:6912,end:7039},{begin:4352,end:4607},{begin:7680,end:7935},{begin:7936,end:8191},{begin:8192,end:8303},{begin:8304,end:8351},{begin:8352,end:8399},{begin:8400,end:8447},{begin:8448,end:8527},{begin:8528,end:8591},{begin:8592,end:8703},{begin:8704,end:8959},{begin:8960,end:9215},{begin:9216,end:9279},{begin:9280,end:9311},{begin:9312,end:9471},{begin:9472,end:9599},{begin:9600,end:9631},{begin:9632,end:9727},{begin:9728,end:9983},{begin:9984,end:10175},{begin:12288,end:12351},{begin:12352,end:12447},{begin:12448,end:12543},{begin:12544,end:12591},{begin:12592,end:12687},{begin:43072,end:43135},{begin:12800,end:13055},{begin:13056,end:13311},{begin:44032,end:55215},{begin:55296,end:57343},{begin:67840,end:67871},{begin:19968,end:40959},{begin:57344,end:63743},{begin:12736,end:12783},{begin:64256,end:64335},{begin:64336,end:65023},{begin:65056,end:65071},{begin:65040,end:65055},{begin:65104,end:65135},{begin:65136,end:65279},{begin:65280,end:65519},{begin:65520,end:65535},{begin:3840,end:4095},{begin:1792,end:1871},{begin:1920,end:1983},{begin:3456,end:3583},{begin:4096,end:4255},{begin:4608,end:4991},{begin:5024,end:5119},{begin:5120,end:5759},{begin:5760,end:5791},{begin:5792,end:5887},{begin:6016,end:6143},{begin:6144,end:6319},{begin:10240,end:10495},{begin:40960,end:42127},{begin:5888,end:5919},{begin:66304,end:66351},{begin:66352,end:66383},{begin:66560,end:66639},{begin:118784,end:119039},{begin:119808,end:120831},{begin:1044480,end:1048573},{begin:65024,end:65039},{begin:917504,end:917631},{begin:6400,end:6479},{begin:6480,end:6527},{begin:6528,end:6623},{begin:6656,end:6687},{begin:11264,end:11359},{begin:11568,end:11647},{begin:19904,end:19967},{begin:43008,end:43055},{begin:65536,end:65663},{begin:65856,end:65935},{begin:66432,end:66463},{begin:66464,end:66527},{begin:66640,end:66687},{begin:66688,end:66735},{begin:67584,
+end:67647},{begin:68096,end:68191},{begin:119552,end:119647},{begin:73728,end:74751},{begin:119648,end:119679},{begin:7040,end:7103},{begin:7168,end:7247},{begin:7248,end:7295},{begin:43136,end:43231},{begin:43264,end:43311},{begin:43312,end:43359},{begin:43520,end:43615},{begin:65936,end:65999},{begin:66e3,end:66047},{begin:66208,end:66271},{begin:127024,end:127135}];c.unicodeRanges=i,c.getUnicodeRange=d,c.parse=e,c.make=f},{"../parse":9,"../table":11}],24:[function(a,b,c){"use strict";function d(a,b){var c,d={},e=new g.Parser(a,b);switch(d.version=e.parseVersion(),d.italicAngle=e.parseFixed(),d.underlinePosition=e.parseShort(),d.underlineThickness=e.parseShort(),d.isFixedPitch=e.parseULong(),d.minMemType42=e.parseULong(),d.maxMemType42=e.parseULong(),d.minMemType1=e.parseULong(),d.maxMemType1=e.parseULong(),d.version){case 1:d.names=f.standardNames.slice();break;case 2:for(d.numberOfGlyphs=e.parseUShort(),d.glyphNameIndex=new Array(d.numberOfGlyphs),c=0;c=f.standardNames.length){var h=e.parseChar();d.names.push(e.parseString(h))}break;case 2.5:for(d.numberOfGlyphs=e.parseUShort(),d.offset=new Array(d.numberOfGlyphs),c=0;cb.value.tag?1:-1}),b.fields=b.fields.concat(g),b.fields=b.fields.concat(h),b}function h(a,b,c){for(var d=0;d0){var f=a.glyphs.get(e);return f.getMetrics()}}return c}function i(a){for(var b=0,c=0;cD||null===b)&&(b=D),D>w&&(w=D);var E=t.getUnicodeRange(D);if(32>E)x|=1<E)y|=1<E)z|=1<E))throw new Error("Unicode ranges bits > 123 are reserved for internal usage");A|=1<=0&&255>=a,"Byte value should be between 0 and 255."),[a]},j.BYTE=d(1),i.CHAR=function(a){return[a.charCodeAt(0)]},j.BYTE=d(1),i.CHARARRAY=function(a){for(var b=[],c=0;c>8&255,255&a]},j.USHORT=d(2),i.SHORT=function(a){return a>=f&&(a=-(2*f-a)),[a>>8&255,255&a]},j.SHORT=d(2),i.UINT24=function(a){return[a>>16&255,a>>8&255,255&a]},j.UINT24=d(3),i.ULONG=function(a){return[a>>24&255,a>>16&255,a>>8&255,255&a]},j.ULONG=d(4),i.LONG=function(a){return a>=g&&(a=-(2*g-a)),[a>>24&255,a>>16&255,a>>8&255,255&a]},j.LONG=d(4),i.FIXED=i.ULONG,j.FIXED=j.ULONG,i.FWORD=i.SHORT,j.FWORD=j.SHORT,i.UFWORD=i.USHORT,j.UFWORD=j.USHORT,i.LONGDATETIME=function(){return[0,0,0,0,0,0,0,0]},j.LONGDATETIME=d(8),i.TAG=function(a){return e.argument(4===a.length,"Tag should be exactly 4 ASCII characters."),[a.charCodeAt(0),a.charCodeAt(1),a.charCodeAt(2),a.charCodeAt(3)]},j.TAG=d(4),i.Card8=i.BYTE,j.Card8=j.BYTE,i.Card16=i.USHORT,j.Card16=j.USHORT,i.OffSize=i.BYTE,j.OffSize=j.BYTE,i.SID=i.USHORT,j.SID=j.USHORT,i.NUMBER=function(a){return a>=-107&&107>=a?[a+139]:a>=108&&1131>=a?(a-=108,[(a>>8)+247,255&a]):a>=-1131&&-108>=a?(a=-a-108,[(a>>8)+251,255&a]):a>=-32768&&32767>=a?i.NUMBER16(a):i.NUMBER32(a)},j.NUMBER=function(a){return i.NUMBER(a).length},i.NUMBER16=function(a){return[28,a>>8&255,255&a]},j.NUMBER16=d(2),i.NUMBER32=function(a){return[29,a>>24&255,a>>16&255,a>>8&255,255&a]},j.NUMBER32=d(4),i.REAL=function(a){var b=a.toString(),c=/\.(\d*?)(?:9{5,20}|0{5,20})\d{0,2}(?:e(.+)|$)/.exec(b);if(c){var d=parseFloat("1e"+((c[2]?+c[2]:0)+c[1].length));b=(Math.round(a*d)/d).toString()}var e,f,g="";for(e=0,f=b.length;f>e;e+=1){var h=b[e];g+="e"===h?"-"===b[++e]?"c":"b":"."===h?"a":"-"===h?"e":h}g+=1&g.length?"f":"ff";var i=[30];for(e=0,f=g.length;f>e;e+=2)i.push(parseInt(g.substr(e,2),16));return i},j.REAL=function(a){return i.REAL(a).length},i.NAME=i.CHARARRAY,j.NAME=j.CHARARRAY,i.STRING=i.CHARARRAY,j.STRING=j.CHARARRAY,i.UTF16=function(a){for(var b=[],c=0;ce;e+=1){var f=parseInt(c[e],0),g=a[f];b=b.concat(i.OPERAND(g.value,g.type)),b=b.concat(i.OPERATOR(f))}return b},j.DICT=function(a){return i.DICT(a).length},i.OPERATOR=function(a){return 1200>a?[a]:[12,a-1200]},i.OPERAND=function(a,b){var c=[];if(Array.isArray(b))for(var d=0;dd;d+=1){var e=a[d];b=b.concat(i[e.type](e.value))}return k&&k.set(a,b),b},j.CHARSTRING=function(a){return i.CHARSTRING(a).length},i.OBJECT=function(a){var b=i[a.type];return e.argument(void 0!==b,"No encoding function for type "+a.type),b(a.value)},i.TABLE=function(a){for(var b=[],c=a.fields.length,d=0;c>d;d+=1){var f=a.fields[d],g=i[f.type];e.argument(void 0!==g,"No encoding function for field type "+f.type);var h=a[f.name];void 0===h&&(h=f.value);var j=g(h);b=b.concat(j)}return b},i.LITERAL=function(a){return a},j.LITERAL=function(a){return a.length},c.decode=h,c.encode=i,c.sizeOf=j},{"./check":2}],27:[function(_dereq_,module,exports){!function(a,b,c){"undefined"!=typeof module&&module.exports?module.exports=c():"function"==typeof define&&define.amd?define(c):b[a]=c()}("reqwest",this,function(){function succeed(a){var b=protocolRe.exec(a.url);return b=b&&b[1]||window.location.protocol,httpsRe.test(b)?twoHundo.test(a.request.status):!!a.request.response}function handleReadyState(a,b,c){return function(){return a._aborted?c(a.request):a._timedOut?c(a.request,"Request is aborted: timeout"):void(a.request&&4==a.request[readyState]&&(a.request.onreadystatechange=noop,succeed(a)?b(a.request):c(a.request)))}}function setHeaders(a,b){var c,d=b.headers||{};d.Accept=d.Accept||defaultHeaders.accept[b.type]||defaultHeaders.accept["*"];var e="function"==typeof FormData&&b.data instanceof FormData;b.crossOrigin||d[requestedWith]||(d[requestedWith]=defaultHeaders.requestedWith),d[contentType]||e||(d[contentType]=b.contentType||defaultHeaders.contentType);for(c in d)d.hasOwnProperty(c)&&"setRequestHeader"in a&&a.setRequestHeader(c,d[c])}function setCredentials(a,b){"undefined"!=typeof b.withCredentials&&"undefined"!=typeof a.withCredentials&&(a.withCredentials=!!b.withCredentials)}function generalCallback(a){lastValue=a}function urlappend(a,b){return a+(/\?/.test(a)?"&":"?")+b}function handleJsonp(a,b,c,d){var e=uniqid++,f=a.jsonpCallback||"callback",g=a.jsonpCallbackName||reqwest.getcallbackPrefix(e),h=new RegExp("((^|\\?|&)"+f+")=([^&]+)"),i=d.match(h),j=doc.createElement("script"),k=0,l=-1!==navigator.userAgent.indexOf("MSIE 10.0");return i?"?"===i[3]?d=d.replace(h,"$1="+g):g=i[3]:d=urlappend(d,f+"="+g),win[g]=generalCallback,j.type="text/javascript",j.src=d,j.async=!0,"undefined"==typeof j.onreadystatechange||l||(j.htmlFor=j.id="_reqwest_"+e),j.onload=j.onreadystatechange=function(){return j[readyState]&&"complete"!==j[readyState]&&"loaded"!==j[readyState]||k?!1:(j.onload=j.onreadystatechange=null,j.onclick&&j.onclick(),b(lastValue),lastValue=void 0,head.removeChild(j),void(k=1))},head.appendChild(j),{abort:function(){j.onload=j.onreadystatechange=null,c({},"Request is aborted: timeout",{}),lastValue=void 0,head.removeChild(j),k=1}}}function getRequest(a,b){var c,d=this.o,e=(d.method||"GET").toUpperCase(),f="string"==typeof d?d:d.url,g=d.processData!==!1&&d.data&&"string"!=typeof d.data?reqwest.toQueryString(d.data):d.data||null,h=!1;return"jsonp"!=d.type&&"GET"!=e||!g||(f=urlappend(f,g),g=null),"jsonp"==d.type?handleJsonp(d,a,b,f):(c=d.xhr&&d.xhr(d)||xhr(d),c.open(e,f,d.async===!1?!1:!0),setHeaders(c,d),setCredentials(c,d),win[xDomainRequest]&&c instanceof win[xDomainRequest]?(c.onload=a,c.onerror=b,c.onprogress=function(){},h=!0):c.onreadystatechange=handleReadyState(this,a,b),d.before&&d.before(c),h?setTimeout(function(){c.send(g)},200):c.send(g),c)}function Reqwest(a,b){this.o=a,this.fn=b,init.apply(this,arguments)}function setType(a){return a.match("json")?"json":a.match("javascript")?"js":a.match("text")?"html":a.match("xml")?"xml":void 0}function init(o,fn){function complete(a){for(o.timeout&&clearTimeout(self.timeout),self.timeout=null;self._completeHandlers.length>0;)self._completeHandlers.shift()(a)}function success(resp){var type=o.type||resp&&setType(resp.getResponseHeader("Content-Type"));resp="jsonp"!==type?self.request:resp;var filteredResponse=globalSetupOptions.dataFilter(resp.responseText,type),r=filteredResponse;try{resp.responseText=r}catch(e){}if(r)switch(type){case"json":try{resp=win.JSON?win.JSON.parse(r):eval("("+r+")")}catch(err){return error(resp,"Could not parse JSON in response",err)}break;case"js":resp=eval(r);break;case"html":resp=r;break;case"xml":resp=resp.responseXML&&resp.responseXML.parseError&&resp.responseXML.parseError.errorCode&&resp.responseXML.parseError.reason?null:resp.responseXML}for(self._responseArgs.resp=resp,self._fulfilled=!0,fn(resp),self._successHandler(resp);self._fulfillmentHandlers.length>0;)resp=self._fulfillmentHandlers.shift()(resp);complete(resp)}function timedOut(){self._timedOut=!0,self.request.abort()}function error(a,b,c){for(a=self.request,self._responseArgs.resp=a,self._responseArgs.msg=b,self._responseArgs.t=c,self._erred=!0;self._errorHandlers.length>0;)self._errorHandlers.shift()(a,b,c);complete(a)}this.url="string"==typeof o?o:o.url,this.timeout=null,this._fulfilled=!1,this._successHandler=function(){},this._fulfillmentHandlers=[],this._errorHandlers=[],this._completeHandlers=[],this._erred=!1,this._responseArgs={};var self=this;fn=fn||function(){},o.timeout&&(this.timeout=setTimeout(function(){timedOut()},o.timeout)),o.success&&(this._successHandler=function(){o.success.apply(o,arguments)}),o.error&&this._errorHandlers.push(function(){o.error.apply(o,arguments)}),o.complete&&this._completeHandlers.push(function(){o.complete.apply(o,arguments)}),this.request=getRequest.call(this,success,error)}function reqwest(a,b){return new Reqwest(a,b)}function normalize(a){return a?a.replace(/\r?\n/g,"\r\n"):""}function serial(a,b){var c,d,e,f,g=a.name,h=a.tagName.toLowerCase(),i=function(a){a&&!a.disabled&&b(g,normalize(a.attributes.value&&a.attributes.value.specified?a.value:a.text))};if(!a.disabled&&g)switch(h){case"input":/reset|button|image|file/i.test(a.type)||(c=/checkbox/i.test(a.type),d=/radio/i.test(a.type),e=a.value,(!(c||d)||a.checked)&&b(g,normalize(c&&""===e?"on":e)));break;case"textarea":b(g,normalize(a.value));break;case"select":if("select-one"===a.type.toLowerCase())i(a.selectedIndex>=0?a.options[a.selectedIndex]:null);else for(f=0;a.length&&f=e;e++)for(i=e/c,f=0;b>=f;f++)h=f/b,g=a(h,i),this.vertices.push(g);var k,l,m,n,o,p,q,r;for(e=0;c>e;e++)for(f=0;b>f;f++)k=e*j+f+d,l=e*j+f+1+d,m=(e+1)*j+f+1+d,n=(e+1)*j+f+d,o=[f/b,e/c],p=[(f+1)/b,e/c],q=[(f+1)/b,(e+1)/c],r=[f/b,(e+1)/c],this.faces.push([k,l,n]),this.uvs.push([o,p,r]),this.faces.push([l,m,n]),this.uvs.push([p,q,r])},f.Geometry3D.prototype.computeFaceNormals=function(){for(var a=new f.Vector,b=new f.Vector,c=0;cthis.vertices.length-1-this.detailX;b--)a.add(this.vertexNormals[b]);for(a=f.Vector.div(a,this.detailX),b=this.vertices.length-1;b>this.vertices.length-1-this.detailX;b--)this.vertexNormals[b]=a},f.Geometry3D.prototype.generateUV=function(a,b){a=d(a),b=d(b);var c=[];return a.forEach(function(a,d){c[a]=b[d]}),d(c)},f.Geometry3D.prototype.generateObj=function(a,b){this.computeFaceNormals(),this.computeVertexNormals(),a&&this.averageNormals(),b&&this.averagePoleNormals();var c={vertices:e(this.vertices),vertexNormals:e(this.vertexNormals),uvs:this.generateUV(this.faces,this.uvs),faces:d(this.faces),len:3*this.faces.length};return c},b.exports=f.Geometry3D},{"../core/core":48}],35:[function(a,b,c){"use strict";var d=a("../core/core"),e=a("../math/polargeometry"),f=a("../core/constants"),g="undefined"!=typeof Float32Array?Float32Array:Array;d.Matrix=function(){return arguments[0]instanceof d?(this.p5=arguments[0],this.mat4=arguments[1]||new g([1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1])):this.mat4=arguments[0]||new g([1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]),this},d.Matrix.prototype.set=function(a){return a instanceof d.Matrix?(this.mat4=a.mat4,this):a instanceof g?(this.mat4=a,this):this},d.Matrix.prototype.get=function(){return new d.Matrix(this.mat4)},d.Matrix.prototype.copy=function(){var a=new d.Matrix;return a.mat4[0]=this.mat4[0],a.mat4[1]=this.mat4[1],a.mat4[2]=this.mat4[2],a.mat4[3]=this.mat4[3],a.mat4[4]=this.mat4[4],a.mat4[5]=this.mat4[5],a.mat4[6]=this.mat4[6],a.mat4[7]=this.mat4[7],a.mat4[8]=this.mat4[8],a.mat4[9]=this.mat4[9],a.mat4[10]=this.mat4[10],a.mat4[11]=this.mat4[11],a.mat4[12]=this.mat4[12],a.mat4[13]=this.mat4[13],a.mat4[14]=this.mat4[14],a.mat4[15]=this.mat4[15],a},d.Matrix.identity=function(){return new d.Matrix},d.Matrix.prototype.transpose=function(a){var b,c,e,f,h,i;return a instanceof d.Matrix?(b=a.mat4[1],c=a.mat4[2],e=a.mat4[3],f=a.mat4[6],h=a.mat4[7],i=a.mat4[11],this.mat4[0]=a.mat4[0],this.mat4[1]=a.mat4[4],this.mat4[2]=a.mat4[8],this.mat4[3]=a.mat4[12],this.mat4[4]=b,this.mat4[5]=a.mat4[5],this.mat4[6]=a.mat4[9],this.mat4[7]=a.mat4[13],this.mat4[8]=c,this.mat4[9]=f,this.mat4[10]=a.mat4[10],this.mat4[11]=a.mat4[14],this.mat4[12]=e,this.mat4[13]=h,this.mat4[14]=i,this.mat4[15]=a.mat4[15]):a instanceof g&&(b=a[1],c=a[2],e=a[3],f=a[6],h=a[7],i=a[11],this.mat4[0]=a[0],this.mat4[1]=a[4],this.mat4[2]=a[8],this.mat4[3]=a[12],this.mat4[4]=b,this.mat4[5]=a[5],this.mat4[6]=a[9],this.mat4[7]=a[13],this.mat4[8]=c,this.mat4[9]=f,this.mat4[10]=a[10],this.mat4[11]=a[14],this.mat4[12]=e,this.mat4[13]=h,this.mat4[14]=i,this.mat4[15]=a[15]),this},d.Matrix.prototype.invert=function(a){var b,c,e,f,h,i,j,k,l,m,n,o,p,q,r,s;a instanceof d.Matrix?(b=a.mat4[0],c=a.mat4[1],e=a.mat4[2],f=a.mat4[3],h=a.mat4[4],i=a.mat4[5],j=a.mat4[6],k=a.mat4[7],l=a.mat4[8],m=a.mat4[9],n=a.mat4[10],o=a.mat4[11],p=a.mat4[12],q=a.mat4[13],r=a.mat4[14],s=a.mat4[15]):a instanceof g&&(b=a[0],c=a[1],e=a[2],f=a[3],h=a[4],i=a[5],j=a[6],k=a[7],l=a[8],m=a[9],n=a[10],o=a[11],p=a[12],q=a[13],r=a[14],s=a[15]);var t=b*i-c*h,u=b*j-e*h,v=b*k-f*h,w=c*j-e*i,x=c*k-f*i,y=e*k-f*j,z=l*q-m*p,A=l*r-n*p,B=l*s-o*p,C=m*r-n*q,D=m*s-o*q,E=n*s-o*r,F=t*E-u*D+v*C+w*B-x*A+y*z;return F?(F=1/F,this.mat4[0]=(i*E-j*D+k*C)*F,this.mat4[1]=(e*D-c*E-f*C)*F,this.mat4[2]=(q*y-r*x+s*w)*F,this.mat4[3]=(n*x-m*y-o*w)*F,this.mat4[4]=(j*B-h*E-k*A)*F,this.mat4[5]=(b*E-e*B+f*A)*F,this.mat4[6]=(r*v-p*y-s*u)*F,this.mat4[7]=(l*y-n*v+o*u)*F,this.mat4[8]=(h*D-i*B+k*z)*F,this.mat4[9]=(c*B-b*D-f*z)*F,this.mat4[10]=(p*x-q*v+s*t)*F,this.mat4[11]=(m*v-l*x-o*t)*F,this.mat4[12]=(i*A-h*C-j*z)*F,this.mat4[13]=(b*C-c*A+e*z)*F,this.mat4[14]=(q*u-p*w-r*t)*F,this.mat4[15]=(l*w-m*u+n*t)*F,this):null},d.Matrix.prototype.determinant=function(){var a=this.mat4[0]*this.mat4[5]-this.mat4[1]*this.mat4[4],b=this.mat4[0]*this.mat4[6]-this.mat4[2]*this.mat4[4],c=this.mat4[0]*this.mat4[7]-this.mat4[3]*this.mat4[4],d=this.mat4[1]*this.mat4[6]-this.mat4[2]*this.mat4[5],e=this.mat4[1]*this.mat4[7]-this.mat4[3]*this.mat4[5],f=this.mat4[2]*this.mat4[7]-this.mat4[3]*this.mat4[6],g=this.mat4[8]*this.mat4[13]-this.mat4[9]*this.mat4[12],h=this.mat4[8]*this.mat4[14]-this.mat4[10]*this.mat4[12],i=this.mat4[8]*this.mat4[15]-this.mat4[11]*this.mat4[12],j=this.mat4[9]*this.mat4[14]-this.mat4[10]*this.mat4[13],k=this.mat4[9]*this.mat4[15]-this.mat4[11]*this.mat4[13],l=this.mat4[10]*this.mat4[15]-this.mat4[11]*this.mat4[14];return a*l-b*k+c*j+d*i-e*h+f*g},d.Matrix.prototype.mult=function(a){var b=new g(16),c=new g(16);a instanceof d.Matrix?c=a.mat4:a instanceof g&&(c=a);var e=this.mat4[0],f=this.mat4[1],h=this.mat4[2],i=this.mat4[3];return b[0]=e*c[0]+f*c[4]+h*c[8]+i*c[12],b[1]=e*c[1]+f*c[5]+h*c[9]+i*c[13],b[2]=e*c[2]+f*c[6]+h*c[10]+i*c[14],b[3]=e*c[3]+f*c[7]+h*c[11]+i*c[15],e=this.mat4[4],f=this.mat4[5],h=this.mat4[6],i=this.mat4[7],b[4]=e*c[0]+f*c[4]+h*c[8]+i*c[12],b[5]=e*c[1]+f*c[5]+h*c[9]+i*c[13],b[6]=e*c[2]+f*c[6]+h*c[10]+i*c[14],b[7]=e*c[3]+f*c[7]+h*c[11]+i*c[15],e=this.mat4[8],f=this.mat4[9],h=this.mat4[10],i=this.mat4[11],b[8]=e*c[0]+f*c[4]+h*c[8]+i*c[12],b[9]=e*c[1]+f*c[5]+h*c[9]+i*c[13],b[10]=e*c[2]+f*c[6]+h*c[10]+i*c[14],b[11]=e*c[3]+f*c[7]+h*c[11]+i*c[15],e=this.mat4[12],f=this.mat4[13],h=this.mat4[14],i=this.mat4[15],b[12]=e*c[0]+f*c[4]+h*c[8]+i*c[12],b[13]=e*c[1]+f*c[5]+h*c[9]+i*c[13],b[14]=e*c[2]+f*c[6]+h*c[10]+i*c[14],b[15]=e*c[3]+f*c[7]+h*c[11]+i*c[15],this.mat4=b,this},d.Matrix.prototype.scale=function(){for(var a,b,c,e=new Array(arguments.length),f=0;f1e3){var c=Object.keys(this.gHash)[0];delete this.gHash[c],e--}var d=this.GL;this.gHash[a]={},this.gHash[a].len=[],this.gHash[a].vertexBuffer=[],this.gHash[a].normalBuffer=[],this.gHash[a].uvBuffer=[],this.gHash[a].indexBuffer=[],b.forEach(function(b){this.gHash[a].len.push(b.len),this.gHash[a].vertexBuffer.push(d.createBuffer()),this.gHash[a].normalBuffer.push(d.createBuffer()),this.gHash[a].uvBuffer.push(d.createBuffer()),this.gHash[a].indexBuffer.push(d.createBuffer())}.bind(this))},d.Renderer3D.prototype.initBuffer=function(a,b){this._setDefaultCamera();var c=this.GL;this.createBuffer(a,b);var d=this.mHash[this._getCurShaderId()];b.forEach(function(b,e){c.bindBuffer(c.ARRAY_BUFFER,this.gHash[a].vertexBuffer[e]),c.bufferData(c.ARRAY_BUFFER,new Float32Array(b.vertices),c.STATIC_DRAW),c.vertexAttribPointer(d.vertexPositionAttribute,3,c.FLOAT,!1,0,0),c.bindBuffer(c.ARRAY_BUFFER,this.gHash[a].normalBuffer[e]),c.bufferData(c.ARRAY_BUFFER,new Float32Array(b.vertexNormals),c.STATIC_DRAW),c.vertexAttribPointer(d.vertexNormalAttribute,3,c.FLOAT,!1,0,0),c.bindBuffer(c.ARRAY_BUFFER,this.gHash[a].uvBuffer[e]),c.bufferData(c.ARRAY_BUFFER,new Float32Array(b.uvs),c.STATIC_DRAW),c.vertexAttribPointer(d.textureCoordAttribute,2,c.FLOAT,!1,0,0),c.bindBuffer(c.ELEMENT_ARRAY_BUFFER,this.gHash[a].indexBuffer[e]),c.bufferData(c.ELEMENT_ARRAY_BUFFER,new Uint16Array(b.faces),c.STATIC_DRAW)}.bind(this))},d.Renderer3D.prototype.drawBuffer=function(a){this._setDefaultCamera();var b=this.GL,c=this._getCurShaderId(),d=this.mHash[c];this.gHash[a].len.forEach(function(e,f){b.bindBuffer(b.ARRAY_BUFFER,this.gHash[a].vertexBuffer[f]),b.vertexAttribPointer(d.vertexPositionAttribute,3,b.FLOAT,!1,0,0),b.bindBuffer(b.ARRAY_BUFFER,this.gHash[a].normalBuffer[f]),b.vertexAttribPointer(d.vertexNormalAttribute,3,b.FLOAT,!1,0,0),b.bindBuffer(b.ARRAY_BUFFER,this.gHash[a].uvBuffer[f]),b.vertexAttribPointer(d.textureCoordAttribute,2,b.FLOAT,!1,0,0),b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,this.gHash[a].indexBuffer[f]),this.setMatrixUniforms(c),b.drawElements(b.TRIANGLES,this.gHash[a].len[f],b.UNSIGNED_SHORT,0)}.bind(this))},b.exports=d.Renderer3D},{"../core/core":48}],38:[function(a,b,c){b.exports={vertexColorVert:"attribute vec3 aPosition;\nattribute vec4 aVertexColor;\n\nuniform mat4 uModelViewMatrix;\nuniform mat4 uProjectionMatrix;\nuniform float uResolution;\n\nvarying vec4 vColor;\n\nvoid main(void) {\n vec4 positionVec4 = vec4(aPosition / uResolution * vec3(1.0, -1.0, 1.0), 1.0);\n gl_Position = uProjectionMatrix * uModelViewMatrix * positionVec4;\n vColor = aVertexColor;\n}",vertexColorFrag:"precision mediump float;\nvarying vec4 vColor;\nvoid main(void) {\n gl_FragColor = vColor;\n}",normalVert:"attribute vec3 aPosition;\nattribute vec3 aNormal;\nattribute vec2 aTexCoord;\n\nuniform mat4 uModelViewMatrix;\nuniform mat4 uProjectionMatrix;\nuniform mat4 uNormalMatrix;\nuniform float uResolution;\n\nvarying vec3 vVertexNormal;\nvarying highp vec2 vVertTexCoord;\n\nvoid main(void) {\n vec4 positionVec4 = vec4(aPosition / uResolution, 1.0);\n gl_Position = uProjectionMatrix * uModelViewMatrix * positionVec4;\n vVertexNormal = vec3( uNormalMatrix * vec4( aNormal, 1.0 ) );\n vVertTexCoord = aTexCoord;\n}",normalFrag:"precision mediump float;\nvarying vec3 vVertexNormal;\nvoid main(void) {\n gl_FragColor = vec4(vVertexNormal, 1.0);\n}",basicFrag:"precision mediump float;\nvarying vec3 vVertexNormal;\nuniform vec4 uMaterialColor;\nvoid main(void) {\n gl_FragColor = uMaterialColor;\n}",lightVert:"attribute vec3 aPosition;\nattribute vec3 aNormal;\nattribute vec2 aTexCoord;\n\nuniform mat4 uModelViewMatrix;\nuniform mat4 uProjectionMatrix;\nuniform mat4 uNormalMatrix;\nuniform float uResolution;\nuniform int uAmbientLightCount;\nuniform int uDirectionalLightCount;\nuniform int uPointLightCount;\n\nuniform vec3 uAmbientColor[8];\nuniform vec3 uLightingDirection[8];\nuniform vec3 uDirectionalColor[8];\nuniform vec3 uPointLightLocation[8];\nuniform vec3 uPointLightColor[8];\nuniform bool uSpecular;\n\nvarying vec3 vVertexNormal;\nvarying vec2 vVertTexCoord;\nvarying vec3 vLightWeighting;\n\nvec3 ambientLightFactor = vec3(0.0, 0.0, 0.0);\nvec3 directionalLightFactor = vec3(0.0, 0.0, 0.0);\nvec3 pointLightFactor = vec3(0.0, 0.0, 0.0);\nvec3 pointLightFactor2 = vec3(0.0, 0.0, 0.0);\n\nvoid main(void){\n\n vec4 positionVec4 = vec4(aPosition / uResolution, 1.0);\n gl_Position = uProjectionMatrix * uModelViewMatrix * positionVec4;\n\n vec3 vertexNormal = vec3( uNormalMatrix * vec4( aNormal, 1.0 ) );\n vVertexNormal = vertexNormal;\n vVertTexCoord = aTexCoord;\n\n vec4 mvPosition = uModelViewMatrix * vec4(aPosition / uResolution, 1.0);\n vec3 eyeDirection = normalize(-mvPosition.xyz);\n\n float shininess = 32.0;\n float specularFactor = 2.0;\n float diffuseFactor = 0.3;\n\n for(int i = 0; i < 8; i++){\n if(uAmbientLightCount == i) break;\n ambientLightFactor += uAmbientColor[i];\n }\n\n for(int j = 0; j < 8; j++){\n if(uDirectionalLightCount == j) break;\n vec3 dir = uLightingDirection[j];\n float directionalLightWeighting = max(dot(vertexNormal, dir), 0.0);\n directionalLightFactor += uDirectionalColor[j] * directionalLightWeighting;\n }\n\n for(int k = 0; k < 8; k++){\n if(uPointLightCount == k) break;\n vec3 loc = uPointLightLocation[k];\n //loc = loc / uResolution;\n vec3 lightDirection = normalize(loc - mvPosition.xyz);\n\n float directionalLightWeighting = max(dot(vertexNormal, lightDirection), 0.0);\n pointLightFactor += uPointLightColor[k] * directionalLightWeighting;\n\n //factor2 for specular\n vec3 reflectionDirection = reflect(-lightDirection, vertexNormal);\n float specularLightWeighting = pow(max(dot(reflectionDirection, eyeDirection), 0.0), shininess);\n\n pointLightFactor2 += uPointLightColor[k] * (specularFactor * specularLightWeighting\n + directionalLightWeighting * diffuseFactor);\n }\n \n if(!uSpecular){\n vLightWeighting = ambientLightFactor + directionalLightFactor + pointLightFactor;\n }else{\n vLightWeighting = ambientLightFactor + directionalLightFactor + pointLightFactor2;\n }\n\n}",lightTextureFrag:"precision mediump float;\n\nuniform vec4 uMaterialColor;\nuniform sampler2D uSampler;\nuniform bool isTexture;\n\nvarying vec3 vLightWeighting;\nvarying highp vec2 vVertTexCoord;\n\nvoid main(void) {\n if(!isTexture){\n gl_FragColor = vec4(vec3(uMaterialColor.rgb * vLightWeighting), uMaterialColor.a);\n }else{\n vec4 textureColor = texture2D(uSampler, vVertTexCoord);\n if(vLightWeighting == vec3(0., 0., 0.)){\n gl_FragColor = textureColor;\n }else{\n gl_FragColor = vec4(vec3(textureColor.rgb * vLightWeighting), textureColor.a); \n }\n }\n}"}},{}],39:[function(a,b,c){"use strict";var d=a("./core/core");a("./color/p5.Color"),a("./core/p5.Element"),a("./typography/p5.Font"),a("./core/p5.Graphics"),a("./core/p5.Renderer2D"),a("./image/p5.Image"),a("./math/p5.Vector"),a("./io/p5.TableRow"),a("./io/p5.Table"),a("./color/creating_reading"),a("./color/setting"),a("./core/constants"),a("./utilities/conversion"),a("./utilities/array_functions"),a("./utilities/string_functions"),a("./core/environment"),a("./image/image"),a("./image/loading_displaying"),a("./image/pixels"),a("./io/files"),a("./events/keyboard"),a("./events/acceleration"),a("./events/mouse"),a("./utilities/time_date"),a("./events/touch"),a("./math/math"),a("./math/calculation"),a("./math/random"),a("./math/noise"),a("./math/trigonometry"),a("./core/rendering"),a("./core/2d_primitives"),a("./core/attributes"),a("./core/curves"),a("./core/vertex"),a("./core/structure"),a("./core/transform"),a("./typography/attributes"),a("./typography/loading_displaying"),a("./3d/p5.Renderer3D"),a("./3d/p5.Geometry3D"),a("./3d/retainedMode3D"),a("./3d/immediateMode3D"),a("./3d/3d_primitives"),a("./3d/p5.Matrix"),a("./3d/material"),a("./3d/light"),a("./3d/shader"),a("./3d/camera"),a("./3d/interaction");var e=function(){window.PHANTOMJS||window.mocha||(window.setup&&"function"==typeof window.setup||window.draw&&"function"==typeof window.draw)&&new d};"complete"===document.readyState?e():window.addEventListener("load",e,!1),b.exports=d},{"./3d/3d_primitives":28,"./3d/camera":29,"./3d/immediateMode3D":30,"./3d/interaction":31,"./3d/light":32,"./3d/material":33,"./3d/p5.Geometry3D":34,"./3d/p5.Matrix":35,"./3d/p5.Renderer3D":36,"./3d/retainedMode3D":37,"./3d/shader":38,"./color/creating_reading":41,"./color/p5.Color":42,"./color/setting":43,"./core/2d_primitives":44,"./core/attributes":45,"./core/constants":47,"./core/core":48,"./core/curves":49,"./core/environment":50,"./core/p5.Element":52,"./core/p5.Graphics":53,"./core/p5.Renderer2D":55,"./core/rendering":56,"./core/structure":58,"./core/transform":59,"./core/vertex":60,"./events/acceleration":61,"./events/keyboard":62,"./events/mouse":63,"./events/touch":64,"./image/image":66,"./image/loading_displaying":67,"./image/p5.Image":68,"./image/pixels":69,"./io/files":70,"./io/p5.Table":71,"./io/p5.TableRow":72,"./math/calculation":73,"./math/math":74,"./math/noise":75,"./math/p5.Vector":76,"./math/random":78,"./math/trigonometry":79,"./typography/attributes":80,"./typography/loading_displaying":81,"./typography/p5.Font":82,"./utilities/array_functions":83,"./utilities/conversion":84,"./utilities/string_functions":85,"./utilities/time_date":86}],40:[function(a,b,c){"use strict";var d=a("../core/core");d.ColorConversion={},d.ColorConversion._hsbaToHSLA=function(a){var b=a[0],c=a[1],d=a[2],e=(2-c)*d/2;return 0!==e&&(1===e?c=0:.5>e?c/=2-c:c=c*d/(2-2*e)),[b,c,e,a[3]]},d.ColorConversion._hsbaToRGBA=function(a){var b=6*a[0],c=a[1],d=a[2],e=[];if(0===c)e=[d,d,d,a[3]];else{var f,g,h,i=Math.floor(b),j=d*(1-c),k=d*(1-c*(b-i)),l=d*(1-c*(1+i-b));0===i?(f=d,g=l,h=j):1===i?(f=k,g=d,h=j):2===i?(f=j,g=d,h=l):3===i?(f=j,g=k,h=d):4===i?(f=l,g=j,h=d):(f=d,g=j,h=k),e=[f,g,h,a[3]]}return e},d.ColorConversion._hslaToHSBA=function(a){var b,c=a[0],d=a[1],e=a[2];return b=.5>e?(1+d)*e:e+d-e*d,d=2*(b-e)/b,[c,d,b,a[3]]},d.ColorConversion._hslaToRGBA=function(a){var b=6*a[0],c=a[1],d=a[2],e=[];if(0===c)e=[d,d,d,a[3]];else{var f;f=.5>d?(1+c)*d:d+c-d*c;var g=2*d-f,h=function(a,b,c){return 0>a?a+=6:a>=6&&(a-=6),1>a?b+(c-b)*a:3>a?c:4>a?b+(c-b)*(4-a):b};e=[h(b+2,g,f),h(b,g,f),h(b-2,g,f),a[3]]}return e},d.ColorConversion._rgbaToHSBA=function(a){var b,c,d=a[0],e=a[1],f=a[2],g=Math.max(d,e,f),h=g-Math.min(d,e,f);return 0===h?(b=0,c=0):(c=h/g,d===g?b=(e-f)/h:e===g?b=2+(f-d)/h:f===g&&(b=4+(d-e)/h),0>b?b+=6:b>=6&&(b-=6)),[b/6,c,g,a[3]]},d.ColorConversion._rgbaToHSLA=function(a){var b,c,d=a[0],e=a[1],f=a[2],g=Math.max(d,e,f),h=Math.min(d,e,f),i=g+h,j=g-h;return 0===j?(b=0,c=0):(c=1>i?j/i:j/(2-j),d===g?b=(e-f)/j:e===g?b=2+(f-d)/j:f===g&&(b=4+(d-e)/j),0>b?b+=6:b>=6&&(b-=6)),[b/6,c,i/2,a[3]]},b.exports=d.ColorConversion},{"../core/core":48}],41:[function(a,b,c){"use strict";var d=a("../core/core"),e=a("../core/constants");a("./p5.Color"),d.prototype.alpha=function(a){if(a instanceof d.Color||a instanceof Array)return this.color(a)._getAlpha();throw new Error("Needs p5.Color or pixel array as argument.")},d.prototype.blue=function(a){if(a instanceof d.Color||a instanceof Array)return this.color(a)._getBlue();throw new Error("Needs p5.Color or pixel array as argument.")},d.prototype.brightness=function(a){if(a instanceof d.Color||a instanceof Array)return this.color(a)._getBrightness();throw new Error("Needs p5.Color or pixel array as argument.")},d.prototype.color=function(){return arguments[0]instanceof d.Color?arguments[0]:arguments[0]instanceof Array?new d.Color(this,arguments[0]):new d.Color(this,arguments)},d.prototype.green=function(a){if(a instanceof d.Color||a instanceof Array)return this.color(a)._getGreen();throw new Error("Needs p5.Color or pixel array as argument.")},d.prototype.hue=function(a){if(a instanceof d.Color||a instanceof Array)return this.color(a)._getHue();throw new Error("Needs p5.Color or pixel array as argument.")},d.prototype.lerpColor=function(a,b,c){var d,f,g,h,i,j,k=this._renderer._colorMode,l=this._renderer._colorMaxes;if(k===e.RGB)i=a.levels.map(function(a){return a/255}),j=b.levels.map(function(a){return a/255});else if(k===e.HSB)a._getBrightness(),b._getBrightness(),i=a.hsba,j=b.hsba;else{if(k!==e.HSL)throw new Error(k+"cannot be used for interpolation.");a._getLightness(),b._getLightness(),i=a.hsla,j=b.hsla}return c=Math.max(Math.min(c,1),0),d=this.lerp(i[0],j[0],c),f=this.lerp(i[1],j[1],c),g=this.lerp(i[2],j[2],c),h=this.lerp(i[3],j[3],c),d*=l[k][0],f*=l[k][1],g*=l[k][2],h*=l[k][3],this.color(d,f,g,h)},d.prototype.lightness=function(a){if(a instanceof d.Color||a instanceof Array)return this.color(a)._getLightness();throw new Error("Needs p5.Color or pixel array as argument.")},d.prototype.red=function(a){if(a instanceof d.Color||a instanceof Array)return this.color(a)._getRed();throw new Error("Needs p5.Color or pixel array as argument.")},d.prototype.saturation=function(a){if(a instanceof d.Color||a instanceof Array)return this.color(a)._getSaturation();throw new Error("Needs p5.Color or pixel array as argument.")},b.exports=d},{"../core/constants":47,"../core/core":48,"./p5.Color":42}],42:[function(a,b,c){var d=a("../core/core"),e=a("../core/constants"),f=a("./color_conversion");d.Color=function(a,b){if(this.mode=a._renderer._colorMode,this.maxes=a._renderer._colorMaxes,this.mode!==e.RGB&&this.mode!==e.HSL&&this.mode!==e.HSB)throw new Error(this.mode+" is an invalid colorMode.");return this._array=d.Color._parseInputs.apply(a,b),
+this.levels=this._array.map(function(a){return Math.round(255*a)}),this},d.Color.prototype.toString=function(){var a=this.levels;return a[3]=this._array[3],"rgba("+a[0]+","+a[1]+","+a[2]+","+a[3]+")"},d.Color.prototype._getAlpha=function(){return this._array[3]*this.maxes[this.mode][3]},d.Color.prototype._getBlue=function(){return this._array[2]*this.maxes[e.RGB][2]},d.Color.prototype._getBrightness=function(){return this.hsba||(this.hsba=f._rgbaToHSBA(this._array)),this.hsba[2]*this.maxes[e.HSB][2]},d.Color.prototype._getGreen=function(){return this._array[1]*this.maxes[e.RGB][1]},d.Color.prototype._getHue=function(){return this.mode===e.HSB?(this.hsba||(this.hsba=f._rgbaToHSBA(this._array)),this.hsba[0]*this.maxes[e.HSB][0]):(this.hsla||(this.hsla=f._rgbaToHSLA(this._array)),this.hsla[0]*this.maxes[e.HSL][0])},d.Color.prototype._getLightness=function(){return this.hsla||(this.hsla=f._rgbaToHSLA(this._array)),this.hsla[2]*this.maxes[e.HSL][2]},d.Color.prototype._getRed=function(){return this._array[0]*this.maxes[e.RGB][0]},d.Color.prototype._getSaturation=function(){return this.mode===e.HSB?(this.hsba||(this.hsba=f._rgbaToHSBA(this._array)),this.hsba[1]*this.maxes[e.HSB][1]):(this.hsla||(this.hsla=f._rgbaToHSLA(this._array)),this.hsla[1]*this.maxes[e.HSL][1])};var g={aliceblue:"#f0f8ff",antiquewhite:"#faebd7",aqua:"#00ffff",aquamarine:"#7fffd4",azure:"#f0ffff",beige:"#f5f5dc",bisque:"#ffe4c4",black:"#000000",blanchedalmond:"#ffebcd",blue:"#0000ff",blueviolet:"#8a2be2",brown:"#a52a2a",burlywood:"#deb887",cadetblue:"#5f9ea0",chartreuse:"#7fff00",chocolate:"#d2691e",coral:"#ff7f50",cornflowerblue:"#6495ed",cornsilk:"#fff8dc",crimson:"#dc143c",cyan:"#00ffff",darkblue:"#00008b",darkcyan:"#008b8b",darkgoldenrod:"#b8860b",darkgray:"#a9a9a9",darkgreen:"#006400",darkgrey:"#a9a9a9",darkkhaki:"#bdb76b",darkmagenta:"#8b008b",darkolivegreen:"#556b2f",darkorange:"#ff8c00",darkorchid:"#9932cc",darkred:"#8b0000",darksalmon:"#e9967a",darkseagreen:"#8fbc8f",darkslateblue:"#483d8b",darkslategray:"#2f4f4f",darkslategrey:"#2f4f4f",darkturquoise:"#00ced1",darkviolet:"#9400d3",deeppink:"#ff1493",deepskyblue:"#00bfff",dimgray:"#696969",dimgrey:"#696969",dodgerblue:"#1e90ff",firebrick:"#b22222",floralwhite:"#fffaf0",forestgreen:"#228b22",fuchsia:"#ff00ff",gainsboro:"#dcdcdc",ghostwhite:"#f8f8ff",gold:"#ffd700",goldenrod:"#daa520",gray:"#808080",green:"#008000",greenyellow:"#adff2f",grey:"#808080",honeydew:"#f0fff0",hotpink:"#ff69b4",indianred:"#cd5c5c",indigo:"#4b0082",ivory:"#fffff0",khaki:"#f0e68c",lavender:"#e6e6fa",lavenderblush:"#fff0f5",lawngreen:"#7cfc00",lemonchiffon:"#fffacd",lightblue:"#add8e6",lightcoral:"#f08080",lightcyan:"#e0ffff",lightgoldenrodyellow:"#fafad2",lightgray:"#d3d3d3",lightgreen:"#90ee90",lightgrey:"#d3d3d3",lightpink:"#ffb6c1",lightsalmon:"#ffa07a",lightseagreen:"#20b2aa",lightskyblue:"#87cefa",lightslategray:"#778899",lightslategrey:"#778899",lightsteelblue:"#b0c4de",lightyellow:"#ffffe0",lime:"#00ff00",limegreen:"#32cd32",linen:"#faf0e6",magenta:"#ff00ff",maroon:"#800000",mediumaquamarine:"#66cdaa",mediumblue:"#0000cd",mediumorchid:"#ba55d3",mediumpurple:"#9370db",mediumseagreen:"#3cb371",mediumslateblue:"#7b68ee",mediumspringgreen:"#00fa9a",mediumturquoise:"#48d1cc",mediumvioletred:"#c71585",midnightblue:"#191970",mintcream:"#f5fffa",mistyrose:"#ffe4e1",moccasin:"#ffe4b5",navajowhite:"#ffdead",navy:"#000080",oldlace:"#fdf5e6",olive:"#808000",olivedrab:"#6b8e23",orange:"#ffa500",orangered:"#ff4500",orchid:"#da70d6",palegoldenrod:"#eee8aa",palegreen:"#98fb98",paleturquoise:"#afeeee",palevioletred:"#db7093",papayawhip:"#ffefd5",peachpuff:"#ffdab9",peru:"#cd853f",pink:"#ffc0cb",plum:"#dda0dd",powderblue:"#b0e0e6",purple:"#800080",red:"#ff0000",rosybrown:"#bc8f8f",royalblue:"#4169e1",saddlebrown:"#8b4513",salmon:"#fa8072",sandybrown:"#f4a460",seagreen:"#2e8b57",seashell:"#fff5ee",sienna:"#a0522d",silver:"#c0c0c0",skyblue:"#87ceeb",slateblue:"#6a5acd",slategray:"#708090",slategrey:"#708090",snow:"#fffafa",springgreen:"#00ff7f",steelblue:"#4682b4",tan:"#d2b48c",teal:"#008080",thistle:"#d8bfd8",tomato:"#ff6347",turquoise:"#40e0d0",violet:"#ee82ee",wheat:"#f5deb3",white:"#ffffff",whitesmoke:"#f5f5f5",yellow:"#ffff00",yellowgreen:"#9acd32"},h=/\s*/,i=/(\d{1,3})/,j=/((?:\d+(?:\.\d+)?)|(?:\.\d+))/,k=new RegExp(j.source+"%"),l={HEX3:/^#([a-f0-9])([a-f0-9])([a-f0-9])$/i,HEX6:/^#([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})$/i,RGB:new RegExp(["^rgb\\(",i.source,",",i.source,",",i.source,"\\)$"].join(h.source),"i"),RGB_PERCENT:new RegExp(["^rgb\\(",k.source,",",k.source,",",k.source,"\\)$"].join(h.source),"i"),RGBA:new RegExp(["^rgba\\(",i.source,",",i.source,",",i.source,",",j.source,"\\)$"].join(h.source),"i"),RGBA_PERCENT:new RegExp(["^rgba\\(",k.source,",",k.source,",",k.source,",",j.source,"\\)$"].join(h.source),"i"),HSL:new RegExp(["^hsl\\(",i.source,",",k.source,",",k.source,"\\)$"].join(h.source),"i"),HSLA:new RegExp(["^hsla\\(",i.source,",",k.source,",",k.source,",",j.source,"\\)$"].join(h.source),"i"),HSB:new RegExp(["^hsb\\(",i.source,",",k.source,",",k.source,"\\)$"].join(h.source),"i"),HSBA:new RegExp(["^hsba\\(",i.source,",",k.source,",",k.source,",",j.source,"\\)$"].join(h.source),"i")};d.Color._parseInputs=function(){var a=arguments.length,b=this._renderer._colorMode,c=this._renderer._colorMaxes,h=[];if(a>=3)return h[0]=arguments[0]/c[b][0],h[1]=arguments[1]/c[b][1],h[2]=arguments[2]/c[b][2],"number"==typeof arguments[3]?h[3]=arguments[3]/c[b][3]:h[3]=1,h=h.map(function(a){return Math.max(Math.min(a,1),0)}),b===e.HSL?f._hslaToRGBA(h):b===e.HSB?f._hsbaToRGBA(h):h;if(1===a&&"string"==typeof arguments[0]){var i=arguments[0].trim().toLowerCase();if(g[i])return d.Color._parseInputs.apply(this,[g[i]]);if(l.HEX3.test(i))return h=l.HEX3.exec(i).slice(1).map(function(a){return parseInt(a+a,16)/255}),h[3]=1,h;if(l.HEX6.test(i))return h=l.HEX6.exec(i).slice(1).map(function(a){return parseInt(a,16)/255}),h[3]=1,h;if(l.RGB.test(i))return h=l.RGB.exec(i).slice(1).map(function(a){return a/255}),h[3]=1,h;if(l.RGB_PERCENT.test(i))return h=l.RGB_PERCENT.exec(i).slice(1).map(function(a){return parseFloat(a)/100}),h[3]=1,h;if(l.RGBA.test(i))return h=l.RGBA.exec(i).slice(1).map(function(a,b){return 3===b?parseFloat(a):a/255});if(l.RGBA_PERCENT.test(i))return h=l.RGBA_PERCENT.exec(i).slice(1).map(function(a,b){return 3===b?parseFloat(a):parseFloat(a)/100});if(l.HSL.test(i)?(h=l.HSL.exec(i).slice(1).map(function(a,b){return 0===b?parseInt(a,10)/360:parseInt(a,10)/100}),h[3]=1):l.HSLA.test(i)&&(h=l.HSLA.exec(i).slice(1).map(function(a,b){return 0===b?parseInt(a,10)/360:3===b?parseFloat(a):parseInt(a,10)/100})),h.length)return f._hslaToRGBA(h);if(l.HSB.test(i)?(h=l.HSB.exec(i).slice(1).map(function(a,b){return 0===b?parseInt(a,10)/360:parseInt(a,10)/100}),h[3]=1):l.HSBA.test(i)&&(h=l.HSBA.exec(i).slice(1).map(function(a,b){return 0===b?parseInt(a,10)/360:3===b?parseFloat(a):parseInt(a,10)/100})),h.length)return f._hsbaToRGBA(h);h=[1,1,1,1]}else{if(1!==a&&2!==a||"number"!=typeof arguments[0])throw new Error(arguments+"is not a valid color representation.");h[0]=arguments[0]/c[b][2],h[1]=arguments[0]/c[b][2],h[2]=arguments[0]/c[b][2],"number"==typeof arguments[1]?h[3]=arguments[1]/c[b][3]:h[3]=1,h=h.map(function(a){return Math.max(Math.min(a,1),0)})}return h},b.exports=d.Color},{"../core/constants":47,"../core/core":48,"./color_conversion":40}],43:[function(a,b,c){"use strict";var d=a("../core/core"),e=a("../core/constants");a("./p5.Color"),d.prototype.background=function(){return arguments[0]instanceof d.Image?this.image(arguments[0],0,0,this.width,this.height):this._renderer.background.apply(this._renderer,arguments),this},d.prototype.clear=function(){return this._renderer.clear(),this},d.prototype.colorMode=function(){if(arguments[0]===e.RGB||arguments[0]===e.HSB||arguments[0]===e.HSL){this._renderer._colorMode=arguments[0];var a=this._renderer._colorMaxes[this._renderer._colorMode];2===arguments.length?(a[0]=arguments[1],a[1]=arguments[1],a[2]=arguments[1],a[3]=arguments[1]):4===arguments.length?(a[0]=arguments[1],a[1]=arguments[2],a[2]=arguments[3]):5===arguments.length&&(a[0]=arguments[1],a[1]=arguments[2],a[2]=arguments[3],a[3]=arguments[4])}return this},d.prototype.fill=function(){return this._renderer._setProperty("_fillSet",!0),this._renderer._setProperty("_doFill",!0),this._renderer.fill.apply(this._renderer,arguments),this},d.prototype.noFill=function(){return this._renderer._setProperty("_doFill",!1),this},d.prototype.noStroke=function(){return this._renderer._setProperty("_doStroke",!1),this},d.prototype.stroke=function(){return this._renderer._setProperty("_strokeSet",!0),this._renderer._setProperty("_doStroke",!0),this._renderer.stroke.apply(this._renderer,arguments),this},b.exports=d},{"../core/constants":47,"../core/core":48,"./p5.Color":42}],44:[function(a,b,c){"use strict";var d=a("./core"),e=a("./constants");a("./error_helpers"),d.prototype.arc=function(a,b,c,d,f,g,h){for(var i=new Array(arguments.length),j=0;jf;)f+=e.TWO_PI;for(;0>g;)g+=e.TWO_PI;return f%=e.TWO_PI,g%=e.TWO_PI,f=f<=e.HALF_PI?Math.atan(c/d*Math.tan(f)):f>e.HALF_PI&&f<=3*e.HALF_PI?Math.atan(c/d*Math.tan(f))+e.PI:Math.atan(c/d*Math.tan(f))+e.TWO_PI,g=g<=e.HALF_PI?Math.atan(c/d*Math.tan(g)):g>e.HALF_PI&&g<=3*e.HALF_PI?Math.atan(c/d*Math.tan(g))+e.PI:Math.atan(c/d*Math.tan(g))+e.TWO_PI,f>g&&(g+=e.TWO_PI),c=Math.abs(c),d=Math.abs(d),this._renderer.arc(a,b,c,d,f,g,h),this},d.prototype.ellipse=function(a,b,c,d){for(var e=new Array(arguments.length),f=0;f=c-d)&&(this._renderer.isP3D&&this._renderer._update(),this._setProperty("frameCount",this.frameCount+1),this._updateMouseCoords(),this._updateTouchCoords(),this.redraw(),this._frameRate=1e3/(a-this._lastFrameTime),this._lastFrameTime=a),this._loop&&(this._requestAnimId=window.requestAnimationFrame(this._draw))}.bind(this),this._runFrames=function(){this._updateInterval&&clearInterval(this._updateInterval)}.bind(this),this._setProperty=function(a,b){this[a]=b,this._isGlobal&&(window[a]=b)}.bind(this),this.remove=function(){if(this._curElement){this._loop=!1,this._requestAnimId&&window.cancelAnimationFrame(this._requestAnimId);for(var a in this._events)window.removeEventListener(a,this._events[a]);for(var b=0;b-1)d=a;else if("string"==typeof a){var f="";b&&c&&"number"==typeof b&&"number"==typeof c&&(f=b+" "+c),d="http://"!==a.substring(0,6)?"url("+a+") "+f+", auto":/\.(cur|jpg|jpeg|gif|png|CUR|JPG|JPEG|GIF|PNG)$/.test(a)?"url("+a+") "+f+", auto":a}e.style.cursor=d},f.prototype.frameRate=function(a){return"number"!=typeof a||0>=a?this._frameRate:(this._setProperty("_targetFrameRate",a),this._runFrames(),this)},f.prototype.getFrameRate=function(){return this.frameRate()},f.prototype.setFrameRate=function(a){return this.frameRate(a)},f.prototype.noCursor=function(){this._curElement.elt.style.cursor="none"},f.prototype.displayWidth=screen.width,f.prototype.displayHeight=screen.height,f.prototype.windowWidth=window.innerWidth,f.prototype.windowHeight=window.innerHeight,f.prototype._onresize=function(a){this._setProperty("windowWidth",window.innerWidth),this._setProperty("windowHeight",window.innerHeight);var b,c=this._isGlobal?window:this;"function"==typeof c.windowResized&&(b=c.windowResized(a),void 0===b||b||a.preventDefault())},f.prototype.width=0,f.prototype.height=0,f.prototype.fullScreen=function(a){return"undefined"==typeof a?document.fullscreenElement||document.webkitFullscreenElement||document.mozFullScreenElement||document.msFullscreenElement:void(a?d(document.documentElement):e())},f.prototype.pixelDensity=function(a){return"number"!=typeof a?this._pixelDensity:(this._pixelDensity=a,void this.resizeCanvas(this.width,this.height,!0))},f.prototype.displayDensity=function(){return window.devicePixelRatio},f.prototype.getURL=function(){return location.href},f.prototype.getURLPath=function(){return location.pathname.split("/").filter(function(a){return""!==a})},f.prototype.getURLParams=function(){for(var a,b=/[?&]([^&=]+)(?:[&=])([^&=]+)/gim,c={};null!=(a=b.exec(location.search));)a.index===b.lastIndex&&b.lastIndex++,c[a[1]]=a[2];return c},b.exports=f},{"./constants":47,"./core":48}],51:[function(a,b,c){"use strict";function d(a,b,c){if(a.match(/^p5\./)){var d=a.split(".");return c instanceof h[d[1]]}return"Boolean"===a||a.toLowerCase()===b||q.indexOf(a)>-1&&p(c)}function e(a,b,c){i&&(f(),i=!1),"undefined"===n(c)?c="#B40033":"number"===n(c)&&(c=v[c])}function f(){var a="transparent",b="#ED225D",c="#ED225D",d="white";console.log("%c _ \n /\\| |/\\ \n \\ ` ' / \n / , . \\ \n \\/|_|\\/ \n\n%c> p5.js says: Welcome! This is your friendly debugger. To turn me off switch to using “p5.min.js”.","background-color:"+a+";color:"+b+";","background-color:"+c+";color:"+d+";")}function g(a){x.forEach(function(b){a.message&&-1!==a.message.indexOf(b)&&console.log("%c Did you just try to use p5.js's '"+b+"' function or variable? If so, you may want to move it into your sketch's setup() function.","color: #B40033")})}for(var h=a("./core"),i=!1,j={},k=j.toString,l=["Boolean","Number","String","Function","Array","Date","RegExp","Object","Error"],m=0;m=0},q=["Number","Integer","Number/Constant"],r=0,s=1,t=2,u=3,v=["#2D7BB6","#EE9900","#4DB200","#C83C00"];h.prototype._validateParameters=function(a,b,c){o(c[0])||(c=[c]);for(var f,g=Math.abs(b.length-c[0].length),h=0,i=1,j=c.length;j>i;i++){var k=Math.abs(b.length-c[i].length);g>=k&&(h=i,g=k)}var l="X";g>0&&(f="You wrote "+a+"(",b.length>0&&(f+=l+Array(b.length).join(","+l)),f+="). "+a+" was expecting "+c[h].length+" parameters. Try "+a+"(",c[h].length>0&&(f+=l+Array(c[h].length).join(","+l)),f+=").",c.length>1&&(f+=" "+a+" takes different numbers of parameters depending on what you want to do. Click this link to learn more: "),e(f,a,r));for(var m=0;m1&&(f+=" "+a+" takes different numbers of parameters depending on what you want to do. Click this link to learn more:"),e(f,a,t))}},h.prototype._validateParameters=function(){return!0};var w={0:{fileType:"image",method:"loadImage",message:" hosting the image online,"},1:{fileType:"XML file",method:"loadXML"},2:{fileType:"table file",method:"loadTable"},3:{fileType:"text file",method:"loadStrings"}};h._friendlyFileLoadError=function(a,b){var c=w[a],d="It looks like there was a problem loading your "+c.fileType+". Try checking if the file path%c ["+b+"] %cis correct,"+(c.message||"")+" or running a local server.";e(d,c.method,u)};var x=["color","random"];"complete"!==document.readyState&&(window.addEventListener("error",g,!1),window.addEventListener("load",function(){window.removeEventListener("error",g,!1)})),b.exports=h},{"./core":48}],52:[function(a,b,c){function d(a,b,c){var d=b.bind(c);c.elt.addEventListener(a,d,!1),c._events[a]=d}var e=a("./core");e.Element=function(a,b){this.elt=a,this._pInst=b,this._events={},this.width=this.elt.offsetWidth,this.height=this.elt.offsetHeight},e.Element.prototype.parent=function(a){return 0===arguments.length?this.elt.parentNode:("string"==typeof a?("#"===a[0]&&(a=a.substring(1)),a=document.getElementById(a)):a instanceof e.Element&&(a=a.elt),a.appendChild(this.elt),this)},e.Element.prototype.id=function(a){return 0===arguments.length?this.elt.id:(this.elt.id=a,this.width=this.elt.offsetWidth,this.height=this.elt.offsetHeight,this)},e.Element.prototype["class"]=function(a){return 0===arguments.length?this.elt.className:(this.elt.className=a,this.width=this.elt.offsetWidth,this.height=this.elt.offsetHeight,this)},e.Element.prototype.mousePressed=function(a){return d("mousedown",a,this),d("touchstart",a,this),this},e.Element.prototype.mouseWheel=function(a){return d("wheel",a,this),this},e.Element.prototype.mouseReleased=function(a){return d("mouseup",a,this),d("touchend",a,this),this},e.Element.prototype.mouseClicked=function(a){return d("click",a,this),this},e.Element.prototype.mouseMoved=function(a){return d("mousemove",a,this),d("touchmove",a,this),this},e.Element.prototype.mouseOver=function(a){return d("mouseover",a,this),this},e.Element.prototype.changed=function(a){return d("change",a,this),this},e.Element.prototype.input=function(a){return d("input",a,this),this},e.Element.prototype.mouseOut=function(a){return d("mouseout",a,this),this},e.Element.prototype.touchStarted=function(a){return d("touchstart",a,this),d("mousedown",a,this),this},e.Element.prototype.touchMoved=function(a){return d("touchmove",a,this),d("mousemove",a,this),this},e.Element.prototype.touchEnded=function(a){return d("touchend",a,this),d("mouseup",a,this),this},e.Element.prototype.dragOver=function(a){return d("dragover",a,this),this},e.Element.prototype.dragLeave=function(a){return d("dragleave",a,this),this},e.Element.prototype.drop=function(a,b){function c(b){var c=new e.File(b);return function(b){c.data=b.target.result,a(c)}}return window.File&&window.FileReader&&window.FileList&&window.Blob?(d("dragover",function(a){a.stopPropagation(),a.preventDefault()},this),d("dragleave",function(a){a.stopPropagation(),a.preventDefault()},this),arguments.length>1&&d("drop",b,this),d("drop",function(a){a.stopPropagation(),a.preventDefault();for(var b=a.dataTransfer.files,d=0;d-1?f.readAsText(e):f.readAsDataURL(e)}},this)):console.log("The File APIs are not fully supported in this browser."),this},e.Element.prototype._setProperty=function(a,b){this[a]=b},b.exports=e.Element},{"./core":48}],53:[function(a,b,c){var d=a("./core"),e=a("./constants");d.Graphics=function(a,b,c,f){var g=c||e.P2D,h=document.createElement("canvas"),i=this._userNode||document.body;i.appendChild(h),d.Element.call(this,h,f,!1),this._styles=[],this.width=a,this.height=b,this._pixelDensity=f._pixelDensity,g===e.WEBGL?this._renderer=new d.Renderer3D(h,f,!1):this._renderer=new d.Renderer2D(h,f,!1),this._renderer.resize(a,b),this._renderer._applyDefaults(),f._elements.push(this);for(var j in d.prototype)this[j]||("function"==typeof d.prototype[j]?this[j]=d.prototype[j].bind(this):this[j]=d.prototype[j]);
+return this},d.Graphics.prototype=Object.create(d.Element.prototype),b.exports=d.Graphics},{"./constants":47,"./core":48}],54:[function(a,b,c){function d(a){var b=0,c=0;if(a.offsetParent){do b+=a.offsetLeft,c+=a.offsetTop;while(a=a.offsetParent)}else b+=a.offsetLeft,c+=a.offsetTop;return[b,c]}var e=a("./core"),f=a("../core/constants");e.Renderer=function(a,b,c){e.Element.call(this,a,b),this.canvas=a,this._pInst=b,c?(this._isMainCanvas=!0,this._pInst._setProperty("_curElement",this),this._pInst._setProperty("canvas",this.canvas),this._pInst._setProperty("width",this.width),this._pInst._setProperty("height",this.height)):(this.canvas.style.display="none",this._styles=[]),this._textSize=12,this._textLeading=15,this._textFont="sans-serif",this._textStyle=f.NORMAL,this._textAscent=null,this._textDescent=null,this._rectMode=f.CORNER,this._ellipseMode=f.CENTER,this._curveTightness=0,this._imageMode=f.CORNER,this._tint=null,this._doStroke=!0,this._doFill=!0,this._strokeSet=!1,this._fillSet=!1,this._colorMode=f.RGB,this._colorMaxes={rgb:[255,255,255,255],hsb:[360,100,100,1],hsl:[360,100,100,1]}},e.Renderer.prototype=Object.create(e.Element.prototype),e.Renderer.prototype.resize=function(a,b){this.width=a,this.height=b,this.elt.width=a*this._pInst._pixelDensity,this.elt.height=b*this._pInst._pixelDensity,this.elt.style.width=a+"px",this.elt.style.height=b+"px",this._isMainCanvas&&(this._pInst._setProperty("width",this.width),this._pInst._setProperty("height",this.height))},e.Renderer.prototype.textLeading=function(a){return arguments.length&&arguments[0]?(this._setProperty("_textLeading",a),this):this._textLeading},e.Renderer.prototype.textSize=function(a){return arguments.length&&arguments[0]?(this._setProperty("_textSize",a),this._setProperty("_textLeading",a*f._DEFAULT_LEADMULT),this._applyTextProperties()):this._textSize},e.Renderer.prototype.textStyle=function(a){return arguments.length&&arguments[0]?((a===f.NORMAL||a===f.ITALIC||a===f.BOLD)&&this._setProperty("_textStyle",a),this._applyTextProperties()):this._textStyle},e.Renderer.prototype.textAscent=function(){return null===this._textAscent&&this._updateTextMetrics(),this._textAscent},e.Renderer.prototype.textDescent=function(){return null===this._textDescent&&this._updateTextMetrics(),this._textDescent},e.Renderer.prototype._isOpenType=function(a){return a=a||this._textFont,"object"==typeof a&&a.font&&a.font.supported},e.Renderer.prototype._updateTextMetrics=function(){if(this._isOpenType())return this._setProperty("_textAscent",this._textFont._textAscent()),this._setProperty("_textDescent",this._textFont._textDescent()),this;var a=document.createElement("span");a.style.fontFamily=this._textFont,a.style.fontSize=this._textSize+"px",a.innerHTML="ABCjgq|";var b=document.createElement("div");b.style.display="inline-block",b.style.width="1px",b.style.height="0px";var c=document.createElement("div");c.appendChild(a),c.appendChild(b),c.style.height="0px",c.style.overflow="hidden",document.body.appendChild(c),b.style.verticalAlign="baseline";var e=d(b),f=d(a),g=e[1]-f[1];b.style.verticalAlign="bottom",e=d(b),f=d(a);var h=e[1]-f[1],i=h-g;return document.body.removeChild(c),this._setProperty("_textAscent",g),this._setProperty("_textDescent",i),this},b.exports=e.Renderer},{"../core/constants":47,"./core":48}],55:[function(a,b,c){var d=a("./core"),e=a("./canvas"),f=a("./constants"),g=a("../image/filters");a("./p5.Renderer");var h="rgba(0,0,0,0)";d.Renderer2D=function(a,b,c){return d.Renderer.call(this,a,b,c),this.drawingContext=this.canvas.getContext("2d"),this._pInst._setProperty("drawingContext",this.drawingContext),this},d.Renderer2D.prototype=Object.create(d.Renderer.prototype),d.Renderer2D.prototype._applyDefaults=function(){this.drawingContext.fillStyle=f._DEFAULT_FILL,this.drawingContext.strokeStyle=f._DEFAULT_STROKE,this.drawingContext.lineCap=f.ROUND,this.drawingContext.font="normal 12px sans-serif"},d.Renderer2D.prototype.resize=function(a,b){d.Renderer.prototype.resize.call(this,a,b),this.drawingContext.scale(this._pInst._pixelDensity,this._pInst._pixelDensity)},d.Renderer2D.prototype.background=function(){if(this.drawingContext.save(),this.drawingContext.setTransform(1,0,0,1,0,0),this.drawingContext.scale(this._pInst._pixelDensity,this._pInst._pixelDensity),arguments[0]instanceof d.Image)this._pInst.image(arguments[0],0,0,this.width,this.height);else{var a=this.drawingContext.fillStyle,b=this._pInst.color.apply(this._pInst,arguments),c=b.toString();this.drawingContext.fillStyle=c,this.drawingContext.fillRect(0,0,this.width,this.height),this.drawingContext.fillStyle=a}this.drawingContext.restore()},d.Renderer2D.prototype.clear=function(){this.drawingContext.clearRect(0,0,this.width,this.height)},d.Renderer2D.prototype.fill=function(){var a=this.drawingContext,b=this._pInst.color.apply(this._pInst,arguments);a.fillStyle=b.toString()},d.Renderer2D.prototype.stroke=function(){var a=this.drawingContext,b=this._pInst.color.apply(this._pInst,arguments);a.strokeStyle=b.toString()},d.Renderer2D.prototype.image=function(a,b,c,e,f,g,h,i,j){var k;try{this._tint&&(d.MediaElement&&a instanceof d.MediaElement&&a.loadPixels(),a.canvas&&(k=this._getTintedImageCanvas(a))),k||(k=a.canvas||a.elt),this.drawingContext.drawImage(k,b,c,e,f,g,h,i,j)}catch(l){if("NS_ERROR_NOT_AVAILABLE"!==l.name)throw l}},d.Renderer2D.prototype._getTintedImageCanvas=function(a){if(!a.canvas)return a;var b=g._toPixels(a.canvas),c=document.createElement("canvas");c.width=a.canvas.width,c.height=a.canvas.height;for(var d=c.getContext("2d"),e=d.createImageData(a.canvas.width,a.canvas.height),f=e.data,h=0;ha+c||0>b+e||a>this.width||b>this.height)return[0,0,0,255];var f=this._pInst||this,g=f._pixelDensity;if(this.loadPixels.call(f),a=Math.floor(a),b=Math.floor(b),1===c&&1===e)return[f.pixels[4*g*(b*this.width+a)],f.pixels[g*(4*(b*this.width+a)+1)],f.pixels[g*(4*(b*this.width+a)+2)],f.pixels[g*(4*(b*this.width+a)+3)]];var h=a*g,i=b*g,j=Math.min(c,f.width),k=Math.min(e,f.height),l=j*g,m=k*g,n=new d.Image(j,k);return n.canvas.getContext("2d").drawImage(this.canvas,h,i,l,m,0,0,j,k),n},d.Renderer2D.prototype.loadPixels=function(){var a=this._pixelDensity||this._pInst._pixelDensity,b=this.width*a,c=this.height*a,d=this.drawingContext.getImageData(0,0,b,c);this._pInst?(this._pInst._setProperty("imageData",d),this._pInst._setProperty("pixels",d.data)):(this._setProperty("imageData",d),this._setProperty("pixels",d.data))},d.Renderer2D.prototype.set=function(a,b,c){if(a=Math.floor(a),b=Math.floor(b),c instanceof d.Image)this.drawingContext.save(),this.drawingContext.setTransform(1,0,0,1,0,0),this.drawingContext.scale(this._pInst._pixelDensity,this._pInst._pixelDensity),this.drawingContext.drawImage(c.canvas,a,b),this.loadPixels.call(this._pInst),this.drawingContext.restore();else{var e=this._pInst||this,f=0,g=0,h=0,i=0,j=4*(b*e._pixelDensity*this.width*e._pixelDensity+a*e._pixelDensity);if(e.imageData||e.loadPixels.call(e),"number"==typeof c)jn;)o=Math.min(h-g,f.HALF_PI),p.push(this._acuteArcToBezier(g,o)),g+=o;return this._doFill&&(j.beginPath(),p.forEach(function(a,b){0===b&&j.moveTo(k.x+a.ax*l,k.y+a.ay*m),j.bezierCurveTo(k.x+a.bx*l,k.y+a.by*m,k.x+a.cx*l,k.y+a.cy*m,k.x+a.dx*l,k.y+a.dy*m)}),(i===f.PIE||null==i)&&j.lineTo(k.x,k.y),j.closePath(),j.fill()),this._doStroke&&(j.beginPath(),p.forEach(function(a,b){0===b&&j.moveTo(k.x+a.ax*l,k.y+a.ay*m),j.bezierCurveTo(k.x+a.bx*l,k.y+a.by*m,k.x+a.cx*l,k.y+a.cy*m,k.x+a.dx*l,k.y+a.dy*m)}),i===f.PIE?(j.lineTo(k.x,k.y),j.closePath()):i===f.CHORD&&j.closePath(),j.stroke()),this},d.Renderer2D.prototype.ellipse=function(a,b,c,d){var f=this.drawingContext,g=this._doFill,i=this._doStroke;if(g&&!i){if(f.fillStyle===h)return this}else if(!g&&i&&f.strokeStyle===h)return this;var j=e.modeAdjust(a,b,c,d,this._ellipseMode),k=.5522847498,l=j.w/2*k,m=j.h/2*k,n=j.x+j.w,o=j.y+j.h,p=j.x+j.w/2,q=j.y+j.h/2;f.beginPath(),f.moveTo(j.x,q),f.bezierCurveTo(j.x,q-m,p-l,j.y,p,j.y),f.bezierCurveTo(p+l,j.y,n,q-m,n,q),f.bezierCurveTo(n,q+m,p+l,o,p,o),f.bezierCurveTo(p-l,o,j.x,q+m,j.x,q),f.closePath(),g&&f.fill(),i&&f.stroke()},d.Renderer2D.prototype.line=function(a,b,c,d){var e=this.drawingContext;return this._doStroke?e.strokeStyle===h?this:(e.lineWidth%2===1&&e.translate(.5,.5),e.beginPath(),e.moveTo(a,b),e.lineTo(c,d),e.stroke(),e.lineWidth%2===1&&e.translate(-.5,-.5),this):this},d.Renderer2D.prototype.point=function(a,b){var c=this.drawingContext,d=c.strokeStyle,e=c.fillStyle;return this._doStroke?c.strokeStyle===h?this:(a=Math.round(a),b=Math.round(b),c.fillStyle=d,c.lineWidth>1?(c.beginPath(),c.arc(a,b,c.lineWidth/2,0,f.TWO_PI,!1),c.fill()):c.fillRect(a,b,1,1),void(c.fillStyle=e)):this},d.Renderer2D.prototype.quad=function(a,b,c,d,e,f,g,i){var j=this.drawingContext,k=this._doFill,l=this._doStroke;if(k&&!l){if(j.fillStyle===h)return this}else if(!k&&l&&j.strokeStyle===h)return this;return j.beginPath(),j.moveTo(a,b),j.lineTo(c,d),j.lineTo(e,f),j.lineTo(g,i),j.closePath(),k&&j.fill(),l&&j.stroke(),this},d.Renderer2D.prototype.rect=function(a,b,c,d,f,g,i,j){var k=this.drawingContext,l=this._doFill,m=this._doStroke;if(l&&!m){if(k.fillStyle===h)return this}else if(!l&&m&&k.strokeStyle===h)return this;var n=e.modeAdjust(a,b,c,d,this._rectMode);if(this._doStroke&&k.lineWidth%2===1&&k.translate(.5,.5),k.beginPath(),"undefined"==typeof f)k.rect(n.x,n.y,n.w,n.h);else{"undefined"==typeof g&&(g=f),"undefined"==typeof i&&(i=g),"undefined"==typeof j&&(j=i);var o=n.x,p=n.y,q=n.w,r=n.h,s=q/2,t=r/2;2*f>q&&(f=s),2*f>r&&(f=t),2*g>q&&(g=s),2*g>r&&(g=t),2*i>q&&(i=s),2*i>r&&(i=t),2*j>q&&(j=s),2*j>r&&(j=t),k.beginPath(),k.moveTo(o+f,p),k.arcTo(o+q,p,o+q,p+r,g),k.arcTo(o+q,p+r,o,p+r,i),k.arcTo(o,p+r,o,p,j),k.arcTo(o,p,o+q,p,f),k.closePath()}return this._doFill&&k.fill(),this._doStroke&&k.stroke(),this._doStroke&&k.lineWidth%2===1&&k.translate(-.5,-.5),this},d.Renderer2D.prototype.triangle=function(a,b,c,d,e,f){var g=this.drawingContext,i=this._doFill,j=this._doStroke;if(i&&!j){if(g.fillStyle===h)return this}else if(!i&&j&&g.strokeStyle===h)return this;g.beginPath(),g.moveTo(a,b),g.lineTo(c,d),g.lineTo(e,f),g.closePath(),i&&g.fill(),j&&g.stroke()},d.Renderer2D.prototype.endShape=function(a,b,c,d,e,g,h){if(0===b.length)return this;if(!this._doStroke&&!this._doFill)return this;var i,j=a===f.CLOSE;j&&!g&&b.push(b[0]);var k,l,m=b.length;if(!c||h!==f.POLYGON&&null!==h)if(!d||h!==f.POLYGON&&null!==h)if(!e||h!==f.POLYGON&&null!==h)if(h===f.POINTS)for(k=0;m>k;k++)i=b[k],this._doStroke&&this._pInst.stroke(i[6]),this._pInst.point(i[0],i[1]);else if(h===f.LINES)for(k=0;m>k+1;k+=2)i=b[k],this._doStroke&&this._pInst.stroke(b[k+1][6]),this._pInst.line(i[0],i[1],b[k+1][0],b[k+1][1]);else if(h===f.TRIANGLES)for(k=0;m>k+2;k+=3)i=b[k],this.drawingContext.beginPath(),this.drawingContext.moveTo(i[0],i[1]),this.drawingContext.lineTo(b[k+1][0],b[k+1][1]),this.drawingContext.lineTo(b[k+2][0],b[k+2][1]),this.drawingContext.lineTo(i[0],i[1]),this._doFill&&(this._pInst.fill(b[k+2][5]),this.drawingContext.fill()),this._doStroke&&(this._pInst.stroke(b[k+2][6]),this.drawingContext.stroke()),this.drawingContext.closePath();else if(h===f.TRIANGLE_STRIP)for(k=0;m>k+1;k++)i=b[k],this.drawingContext.beginPath(),this.drawingContext.moveTo(b[k+1][0],b[k+1][1]),this.drawingContext.lineTo(i[0],i[1]),this._doStroke&&this._pInst.stroke(b[k+1][6]),this._doFill&&this._pInst.fill(b[k+1][5]),m>k+2&&(this.drawingContext.lineTo(b[k+2][0],b[k+2][1]),this._doStroke&&this._pInst.stroke(b[k+2][6]),this._doFill&&this._pInst.fill(b[k+2][5])),this._doFillStrokeClose();else if(h===f.TRIANGLE_FAN){if(m>2)for(this.drawingContext.beginPath(),this.drawingContext.moveTo(b[0][0],b[0][1]),this.drawingContext.lineTo(b[1][0],b[1][1]),this.drawingContext.lineTo(b[2][0],b[2][1]),this._doFill&&this._pInst.fill(b[2][5]),this._doStroke&&this._pInst.stroke(b[2][6]),this._doFillStrokeClose(),k=3;m>k;k++)i=b[k],this.drawingContext.beginPath(),this.drawingContext.moveTo(b[0][0],b[0][1]),this.drawingContext.lineTo(b[k-1][0],b[k-1][1]),this.drawingContext.lineTo(i[0],i[1]),this._doFill&&this._pInst.fill(i[5]),this._doStroke&&this._pInst.stroke(i[6]),this._doFillStrokeClose()}else if(h===f.QUADS)for(k=0;m>k+3;k+=4){for(i=b[k],this.drawingContext.beginPath(),this.drawingContext.moveTo(i[0],i[1]),l=1;4>l;l++)this.drawingContext.lineTo(b[k+l][0],b[k+l][1]);this.drawingContext.lineTo(i[0],i[1]),this._doFill&&this._pInst.fill(b[k+3][5]),this._doStroke&&this._pInst.stroke(b[k+3][6]),this._doFillStrokeClose()}else if(h===f.QUAD_STRIP){if(m>3)for(k=0;m>k+1;k+=2)i=b[k],this.drawingContext.beginPath(),m>k+3?(this.drawingContext.moveTo(b[k+2][0],b[k+2][1]),this.drawingContext.lineTo(i[0],i[1]),this.drawingContext.lineTo(b[k+1][0],b[k+1][1]),this.drawingContext.lineTo(b[k+3][0],b[k+3][1]),this._doFill&&this._pInst.fill(b[k+3][5]),this._doStroke&&this._pInst.stroke(b[k+3][6])):(this.drawingContext.moveTo(i[0],i[1]),this.drawingContext.lineTo(b[k+1][0],b[k+1][1])),this._doFillStrokeClose()}else{for(this.drawingContext.beginPath(),this.drawingContext.moveTo(b[0][0],b[0][1]),k=1;m>k;k++)i=b[k],i.isVert&&(i.moveTo?this.drawingContext.moveTo(i[0],i[1]):this.drawingContext.lineTo(i[0],i[1]));this._doFillStrokeClose()}else{for(this.drawingContext.beginPath(),k=0;m>k;k++)b[k].isVert?b[k].moveTo?this.drawingContext.moveTo([0],b[k][1]):this.drawingContext.lineTo(b[k][0],b[k][1]):this.drawingContext.quadraticCurveTo(b[k][0],b[k][1],b[k][2],b[k][3]);this._doFillStrokeClose()}else{for(this.drawingContext.beginPath(),k=0;m>k;k++)b[k].isVert?b[k].moveTo?this.drawingContext.moveTo(b[k][0],b[k][1]):this.drawingContext.lineTo(b[k][0],b[k][1]):this.drawingContext.bezierCurveTo(b[k][0],b[k][1],b[k][2],b[k][3],b[k][4],b[k][5]);this._doFillStrokeClose()}else if(m>3){var n=[],o=1-this._curveTightness;for(this.drawingContext.beginPath(),this.drawingContext.moveTo(b[1][0],b[1][1]),k=1;m>k+2;k++)i=b[k],n[0]=[i[0],i[1]],n[1]=[i[0]+(o*b[k+1][0]-o*b[k-1][0])/6,i[1]+(o*b[k+1][1]-o*b[k-1][1])/6],n[2]=[b[k+1][0]+(o*b[k][0]-o*b[k+2][0])/6,b[k+1][1]+(o*b[k][1]-o*b[k+2][1])/6],n[3]=[b[k+1][0],b[k+1][1]],this.drawingContext.bezierCurveTo(n[1][0],n[1][1],n[2][0],n[2][1],n[3][0],n[3][1]);j&&this.drawingContext.lineTo(b[k+1][0],b[k+1][1]),this._doFillStrokeClose()}return c=!1,d=!1,e=!1,g=!1,j&&b.pop(),this},d.Renderer2D.prototype.noSmooth=function(){return"imageSmoothingEnabled"in this.drawingContext?this.drawingContext.imageSmoothingEnabled=!1:"mozImageSmoothingEnabled"in this.drawingContext?this.drawingContext.mozImageSmoothingEnabled=!1:"webkitImageSmoothingEnabled"in this.drawingContext?this.drawingContext.webkitImageSmoothingEnabled=!1:"msImageSmoothingEnabled"in this.drawingContext&&(this.drawingContext.msImageSmoothingEnabled=!1),this},d.Renderer2D.prototype.smooth=function(){return"imageSmoothingEnabled"in this.drawingContext?this.drawingContext.imageSmoothingEnabled=!0:"mozImageSmoothingEnabled"in this.drawingContext?this.drawingContext.mozImageSmoothingEnabled=!0:"webkitImageSmoothingEnabled"in this.drawingContext?this.drawingContext.webkitImageSmoothingEnabled=!0:"msImageSmoothingEnabled"in this.drawingContext&&(this.drawingContext.msImageSmoothingEnabled=!0),this},d.Renderer2D.prototype.strokeCap=function(a){return(a===f.ROUND||a===f.SQUARE||a===f.PROJECT)&&(this.drawingContext.lineCap=a),this},d.Renderer2D.prototype.strokeJoin=function(a){return(a===f.ROUND||a===f.BEVEL||a===f.MITER)&&(this.drawingContext.lineJoin=a),this},d.Renderer2D.prototype.strokeWeight=function(a){return"undefined"==typeof a||0===a?this.drawingContext.lineWidth=1e-4:this.drawingContext.lineWidth=a,this},d.Renderer2D.prototype._getFill=function(){return this.drawingContext.fillStyle},d.Renderer2D.prototype._getStroke=function(){return this.drawingContext.strokeStyle},d.Renderer2D.prototype.bezier=function(a,b,c,d,e,f,g,h){return this._pInst.beginShape(),this._pInst.vertex(a,b),this._pInst.bezierVertex(c,d,e,f,g,h),this._pInst.endShape(),this},d.Renderer2D.prototype.curve=function(a,b,c,d,e,f,g,h){return this._pInst.beginShape(),this._pInst.curveVertex(a,b),this._pInst.curveVertex(c,d),this._pInst.curveVertex(e,f),this._pInst.curveVertex(g,h),this._pInst.endShape(),this},d.Renderer2D.prototype._doFillStrokeClose=function(){this._doFill&&this.drawingContext.fill(),this._doStroke&&this.drawingContext.stroke(),this.drawingContext.closePath()},d.Renderer2D.prototype.applyMatrix=function(a,b,c,d,e,f){this.drawingContext.transform(a,b,c,d,e,f)},d.Renderer2D.prototype.resetMatrix=function(){return this.drawingContext.setTransform(1,0,0,1,0,0),this.drawingContext.scale(this._pInst._pixelDensity,this._pInst._pixelDensity),this},d.Renderer2D.prototype.rotate=function(a){this.drawingContext.rotate(a)},d.Renderer2D.prototype.scale=function(a,b){return this.drawingContext.scale(a,b),this},d.Renderer2D.prototype.shearX=function(a){return this._pInst._angleMode===f.DEGREES&&(a=this._pInst.radians(a)),this.drawingContext.transform(1,0,this._pInst.tan(a),1,0,0),this},d.Renderer2D.prototype.shearY=function(a){return this._pInst._angleMode===f.DEGREES&&(a=this._pInst.radians(a)),this.drawingContext.transform(1,this._pInst.tan(a),0,1,0,0),this},d.Renderer2D.prototype.translate=function(a,b){return this.drawingContext.translate(a,b),this},d.Renderer2D.prototype.text=function(a,b,c,d,e){var g,h,i,j,k,l,m,n,o,p,q=this._pInst,r=Number.MAX_VALUE;if(this._doFill||this._doStroke){if("string"!=typeof a&&(a=a.toString()),a=a.replace(/(\t)/g," "),g=a.split("\n"),"undefined"!=typeof d){for(o=0,i=0;id?(k=n[h]+" ",o+=q.textLeading()):k=l;switch(this._rectMode===f.CENTER&&(b-=d/2,c-=e/2),this.drawingContext.textAlign){case f.CENTER:b+=d/2;break;case f.RIGHT:b+=d}if("undefined"!=typeof e){switch(this.drawingContext.textBaseline){case f.BOTTOM:c+=e-o;break;case f._CTX_MIDDLE:c+=(e-o)/2;break;case f.BASELINE:p=!0,this.drawingContext.textBaseline=f.TOP}r=c+e-q.textAscent()}for(i=0;id&&k.length>0?(this._renderText(q,k,b,c,r),k=n[h]+" ",c+=q.textLeading()):k=l;this._renderText(q,k,b,c,r),c+=q.textLeading()}}else for(j=0;j=e?void 0:(a.push(),this._isOpenType()?this._textFont._renderPath(b,c,d,{renderer:this}):(this._doStroke&&this._strokeSet&&this.drawingContext.strokeText(b,c,d),this._doFill&&(this.drawingContext.fillStyle=this._fillSet?this.drawingContext.fillStyle:f._DEFAULT_TEXT_FILL,this.drawingContext.fillText(b,c,d))),a.pop(),a)},d.Renderer2D.prototype.textWidth=function(a){return this._isOpenType()?this._textFont._textWidth(a):this.drawingContext.measureText(a).width},d.Renderer2D.prototype.textAlign=function(a,b){if(arguments.length)return(a===f.LEFT||a===f.RIGHT||a===f.CENTER)&&(this.drawingContext.textAlign=a),(b===f.TOP||b===f.BOTTOM||b===f.CENTER||b===f.BASELINE)&&(b===f.CENTER?this.drawingContext.textBaseline=f._CTX_MIDDLE:this.drawingContext.textBaseline=b),this._pInst;var c=this.drawingContext.textBaseline;return c===f._CTX_MIDDLE&&(c=f.CENTER),{horizontal:this.drawingContext.textAlign,vertical:c}},d.Renderer2D.prototype._applyTextProperties=function(){var a,b=this._pInst;return this._setProperty("_textAscent",null),this._setProperty("_textDescent",null),a=this._textFont,this._isOpenType()&&(a=this._textFont.font.familyName,this._setProperty("_textStyle",this._textFont.font.styleName)),this.drawingContext.font=this._textStyle+" "+this._textSize+"px "+a,b},d.Renderer2D.prototype.push=function(){this.drawingContext.save()},d.Renderer2D.prototype.pop=function(){this.drawingContext.restore()},b.exports=d.Renderer2D},{"../image/filters":65,"./canvas":46,"./constants":47,"./core":48,"./p5.Renderer":54}],56:[function(a,b,c){var d=a("./core"),e=a("./constants");a("./p5.Graphics"),a("./p5.Renderer2D"),a("../3d/p5.Renderer3D");var f="defaultCanvas0";d.prototype.createCanvas=function(a,b,c){var g,h,i=c||e.P2D;if(arguments[3]&&(g="boolean"==typeof arguments[3]?arguments[3]:!1),i===e.WEBGL)h=document.getElementById(f),h&&h.parentNode.removeChild(h),h=document.createElement("canvas"),h.id=f;else if(g){h=document.createElement("canvas");for(var j=0;document.getElementById("defaultCanvas"+j);)j++;f="defaultCanvas"+j,h.id=f}else h=this.canvas;return this._setupDone||(h.className+=" p5_hidden",h.style.visibility="hidden"),this._userNode?this._userNode.appendChild(h):document.body.appendChild(h),i===e.WEBGL?(this._setProperty("_renderer",new d.Renderer3D(h,this,!0)),this._isdefaultGraphics=!0):this._isdefaultGraphics||(this._setProperty("_renderer",new d.Renderer2D(h,this,!0)),this._isdefaultGraphics=!0),this._renderer.resize(a,b),this._renderer._applyDefaults(),g&&this._elements.push(this._renderer),this._renderer},d.prototype.resizeCanvas=function(a,b,c){if(this._renderer){var d={};for(var e in this.drawingContext){var f=this.drawingContext[e];"object"!=typeof f&&"function"!=typeof f&&(d[e]=f)}this._renderer.resize(a,b);for(var g in d)this.drawingContext[g]=d[g];c||this.redraw()}},d.prototype.noCanvas=function(){this.canvas&&this.canvas.parentNode.removeChild(this.canvas)},d.prototype.createGraphics=function(a,b,c){return new d.Graphics(a,b,c,this)},d.prototype.blendMode=function(a){if(a!==e.BLEND&&a!==e.DARKEST&&a!==e.LIGHTEST&&a!==e.DIFFERENCE&&a!==e.MULTIPLY&&a!==e.EXCLUSION&&a!==e.SCREEN&&a!==e.REPLACE&&a!==e.OVERLAY&&a!==e.HARD_LIGHT&&a!==e.SOFT_LIGHT&&a!==e.DODGE&&a!==e.BURN&&a!==e.ADD&&a!==e.NORMAL)throw new Error("Mode "+a+" not recognized.");this._renderer.blendMode(a)},b.exports=d},{"../3d/p5.Renderer3D":36,"./constants":47,"./core":48,"./p5.Graphics":53,"./p5.Renderer2D":55}],57:[function(a,b,c){window.requestAnimationFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(a,b){window.setTimeout(a,1e3/60)}}(),window.performance=window.performance||{},window.performance.now=function(){var a=Date.now();return window.performance.now||window.performance.mozNow||window.performance.msNow||window.performance.oNow||window.performance.webkitNow||function(){return Date.now()-a}}(),function(){"use strict";"undefined"!=typeof Uint8ClampedArray&&(Uint8ClampedArray.prototype.slice=Array.prototype.slice)}()},{}],58:[function(a,b,c){"use strict";var d=a("./core");d.prototype.exit=function(){throw"exit() not implemented, see remove()"},d.prototype.noLoop=function(){this._loop=!1},d.prototype.loop=function(){this._loop=!0,this._draw()},d.prototype.push=function(){this._renderer.push(),this._styles.push({_doStroke:this._renderer._doStroke,_doFill:this._renderer._doFill,_tint:this._renderer._tint,_imageMode:this._renderer._imageMode,_rectMode:this._renderer._rectMode,_ellipseMode:this._renderer._ellipseMode,_colorMode:this._renderer._colorMode,_textFont:this._renderer._textFont,_textLeading:this._renderer._textLeading,_textSize:this._renderer._textSize,_textStyle:this._renderer._textStyle})},d.prototype.pop=function(){this._renderer.pop();var a=this._styles.pop();for(var b in a)this._renderer[b]=a[b]},d.prototype.pushStyle=function(){throw new Error("pushStyle() not used, see push()")},d.prototype.popStyle=function(){throw new Error("popStyle() not used, see pop()")},d.prototype.redraw=function(){var a=this.setup||window.setup,b=this.draw||window.draw;if("function"==typeof b){this.push(),"undefined"==typeof a&&this.scale(this._pixelDensity,this._pixelDensity);var c=this;this._registeredMethods.pre.forEach(function(a){a.call(c)}),b(),this._registeredMethods.post.forEach(function(a){a.call(c)}),this.pop()}},d.prototype.size=function(){var a="size() is not a valid p5 function, to set the size of the ";throw a+="drawing canvas, please use createCanvas() instead"},b.exports=d},{"./core":48}],59:[function(a,b,c){"use strict";var d=a("./core"),e=a("./constants");d.prototype.applyMatrix=function(a,b,c,d,e,f){return this._renderer.applyMatrix(a,b,c,d,e,f),this},d.prototype.popMatrix=function(){throw new Error("popMatrix() not used, see pop()")},d.prototype.printMatrix=function(){throw new Error("printMatrix() not implemented")},d.prototype.pushMatrix=function(){throw new Error("pushMatrix() not used, see push()")},d.prototype.resetMatrix=function(){return this._renderer.resetMatrix(),this},d.prototype.rotate=function(){var a=arguments[0];return this._angleMode===e.DEGREES&&(a=this.radians(a)),arguments.length>1?this._renderer.rotate(a,arguments[1]):this._renderer.rotate(a),this},d.prototype.rotateX=function(a){for(var b=new Array(arguments.length),c=0;c0))throw"vertex() must be used once before calling quadraticVertex()";k=!0;for(var i=[],j=0;jn||Math.abs(this.accelerationY-this.pAccelerationY)>n||Math.abs(this.accelerationZ-this.pAccelerationZ)>n)&&a();var b=this.deviceTurned||window.deviceTurned;if("function"==typeof b){var c=this.rotationX+180,d=this.pRotationX+180,p=h+180;c-d>0&&270>c-d||-270>c-d?k="clockwise":(0>c-d||c-d>270)&&(k="counter-clockwise"),k!==e&&(p=c),Math.abs(c-p)>90&&Math.abs(c-p)<270&&(p=c,this._setProperty("turnAxis","X"),b()),e=k,h=p-180;var q=this.rotationY+180,r=this.pRotationY+180,s=i+180;q-r>0&&270>q-r||-270>q-r?l="clockwise":(0>q-r||q-this.pRotationY>270)&&(l="counter-clockwise"),l!==f&&(s=q),Math.abs(q-s)>90&&Math.abs(q-s)<270&&(s=q,this._setProperty("turnAxis","Y"),b()),f=l,i=s-180,this.rotationZ-this.pRotationZ>0&&this.rotationZ-this.pRotationZ<270||this.rotationZ-this.pRotationZ<-270?m="clockwise":(this.rotationZ-this.pRotationZ<0||this.rotationZ-this.pRotationZ>270)&&(m="counter-clockwise"),m!==g&&(j=this.rotationZ),Math.abs(this.rotationZ-j)>90&&Math.abs(this.rotationZ-j)<270&&(j=this.rotationZ,this._setProperty("turnAxis","Z"),b()),g=m,this._setProperty("turnAxis",void 0)}var t=this.deviceShaken||window.deviceShaken;if("function"==typeof t){var u,v;null!==this.pAccelerationX&&(u=Math.abs(this.accelerationX-this.pAccelerationX),v=Math.abs(this.accelerationY-this.pAccelerationY)),u+v>o&&t()}},b.exports=d},{"../core/core":48}],62:[function(a,b,c){"use strict";var d=a("../core/core"),e={};d.prototype.isKeyPressed=!1,d.prototype.keyIsPressed=!1,d.prototype.key="",d.prototype.keyCode=0,d.prototype._onkeydown=function(a){if(!e[a.which]){this._setProperty("isKeyPressed",!0),this._setProperty("keyIsPressed",!0),this._setProperty("keyCode",a.which),e[a.which]=!0;var b=String.fromCharCode(a.which);b||(b=a.which),this._setProperty("key",b);var c=this.keyPressed||window.keyPressed;if("function"==typeof c&&!a.charCode){var d=c(a);d===!1&&a.preventDefault()}}},d.prototype._onkeyup=function(a){var b=this.keyReleased||window.keyReleased;this._setProperty("isKeyPressed",!1),this._setProperty("keyIsPressed",!1),this._setProperty("_lastKeyCodeTyped",null),e[a.which]=!1;var c=String.fromCharCode(a.which);if(c||(c=a.which),this._setProperty("key",c),this._setProperty("keyCode",a.which),"function"==typeof b){var d=b(a);d===!1&&a.preventDefault()}},d.prototype._onkeypress=function(a){if(a.which!==this._lastKeyCodeTyped){this._setProperty("keyCode",a.which),this._setProperty("_lastKeyCodeTyped",a.which),this._setProperty("key",String.fromCharCode(a.which));var b=this.keyTyped||window.keyTyped;if("function"==typeof b){var c=b(a);c===!1&&a.preventDefault()}}},d.prototype._onblur=function(a){e={}},d.prototype.keyIsDown=function(a){return e[a]},b.exports=d},{"../core/core":48}],63:[function(a,b,c){"use strict";function d(a,b){var c=a.getBoundingClientRect();return{x:b.clientX-c.left,y:b.clientY-c.top}}var e=a("../core/core"),f=a("../core/constants");e.prototype._nextMouseX=0,e.prototype._nextMouseY=0,e.prototype.mouseX=0,e.prototype.mouseY=0,e.prototype.pmouseX=0,e.prototype.pmouseY=0,e.prototype.winMouseX=0,e.prototype.winMouseY=0,e.prototype.pwinMouseX=0,e.prototype.pwinMouseY=0,e.prototype.mouseButton=0,e.prototype.mouseIsPressed=!1,e.prototype.isMousePressed=!1,e.prototype._updateNextMouseCoords=function(a){if("touchstart"===a.type||"touchmove"===a.type||"touchend"===a.type)this._setProperty("_nextMouseX",this._nextTouchX),this._setProperty("_nextMouseY",this._nextTouchY);else if(null!==this._curElement){var b=d(this._curElement.elt,a);this._setProperty("_nextMouseX",b.x),this._setProperty("_nextMouseY",b.y)}this._setProperty("winMouseX",a.pageX),this._setProperty("winMouseY",a.pageY)},e.prototype._updateMouseCoords=function(){this._setProperty("pmouseX",this.mouseX),this._setProperty("pmouseY",this.mouseY),this._setProperty("mouseX",this._nextMouseX),this._setProperty("mouseY",this._nextMouseY),this._setProperty("pwinMouseX",this.winMouseX),this._setProperty("pwinMouseY",this.winMouseY)},e.prototype._setMouseButton=function(a){1===a.button?this._setProperty("mouseButton",f.CENTER):2===a.button?this._setProperty("mouseButton",f.RIGHT):this._setProperty("mouseButton",f.LEFT)},e.prototype._onmousemove=function(a){var b,c=this._isGlobal?window:this;this._updateNextMouseCoords(a),this._updateNextTouchCoords(a),this.isMousePressed?"function"==typeof c.mouseDragged?(b=c.mouseDragged(a),b===!1&&a.preventDefault()):"function"==typeof c.touchMoved&&(b=c.touchMoved(a),b===!1&&a.preventDefault()):"function"==typeof c.mouseMoved&&(b=c.mouseMoved(a),b===!1&&a.preventDefault())},e.prototype._onmousedown=function(a){var b,c=this._isGlobal?window:this;this._setProperty("isMousePressed",!0),this._setProperty("mouseIsPressed",!0),this._setMouseButton(a),this._updateNextMouseCoords(a),this._updateNextTouchCoords(a),"function"==typeof c.mousePressed?(b=c.mousePressed(a),b===!1&&a.preventDefault()):"function"==typeof c.touchStarted&&(b=c.touchStarted(a),b===!1&&a.preventDefault())},e.prototype._onmouseup=function(a){var b,c=this._isGlobal?window:this;this._setProperty("isMousePressed",!1),this._setProperty("mouseIsPressed",!1),"function"==typeof c.mouseReleased?(b=c.mouseReleased(a),b===!1&&a.preventDefault()):"function"==typeof c.touchEnded&&(b=c.touchEnded(a),b===!1&&a.preventDefault())},e.prototype._ondragend=e.prototype._onmouseup,e.prototype._ondragover=e.prototype._onmousemove,e.prototype._onclick=function(a){var b=this._isGlobal?window:this;if("function"==typeof b.mouseClicked){var c=b.mouseClicked(a);c===!1&&a.preventDefault()}},e.prototype._onwheel=function(a){var b=this._isGlobal?window:this;if("function"==typeof b.mouseWheel){a.delta=a.deltaY;var c=b.mouseWheel(a);c===!1&&a.preventDefault()}},b.exports=e},{"../core/constants":47,"../core/core":48}],64:[function(a,b,c){"use strict";function d(a,b,c){c=c||0;var d=a.getBoundingClientRect(),e=b.touches[c]||b.changedTouches[c];return{x:e.clientX-d.left,y:e.clientY-d.top,id:e.identifier}}var e=a("../core/core");e.prototype._nextTouchX=0,e.prototype._nextTouchY=0,e.prototype.touchX=0,e.prototype.touchY=0,e.prototype.ptouchX=0,e.prototype.ptouchY=0,e.prototype.touches=[],e.prototype.touchIsDown=!1,e.prototype._updateNextTouchCoords=function(a){if("mousedown"===a.type||"mousemove"===a.type||"mouseup"===a.type)this._setProperty("_nextTouchX",this._nextMouseX),this._setProperty("_nextTouchY",this._nextMouseY);else if(null!==this._curElement){var b=d(this._curElement.elt,a,0);this._setProperty("_nextTouchX",b.x),this._setProperty("_nextTouchY",b.y);for(var c=[],e=0;eb?1:248>b?b:248,g!==b){g=b,h=1+g<<1,i=new Int32Array(h),j=new Array(h);for(var c=0;h>c;c++)j[c]=new Int32Array(256);for(var d,e,f,k,l=1,m=b-1;b>l;l++){i[b+l]=i[m]=e=m*m,f=j[b+l],k=j[m--];for(var n=0;256>n;n++)f[n]=k[n]=e*n}d=i[b]=b*b,f=j[b];for(var o=0;256>o;o++)f[o]=d*o}}function e(a,b){for(var c=f._toPixels(a),e=a.width,k=a.height,l=e*k,m=new Int32Array(l),n=0;l>n;n++)m[n]=f._getARGB(c,n);var o,p,q,r,s,t,u,v,w,x,y=new Int32Array(l),z=new Int32Array(l),A=new Int32Array(l),B=new Int32Array(l),C=0;d(b);var D,E,F,G;for(E=0;k>E;E++){for(D=0;e>D;D++){if(r=q=p=s=o=0,t=D-g,0>t)x=-t,t=0;else{if(t>=e)break;x=0}for(F=x;h>F&&!(t>=e);F++){var H=m[t+C];G=j[F],s+=G[(-16777216&H)>>>24],p+=G[(16711680&H)>>16],q+=G[(65280&H)>>8],r+=G[255&H],o+=i[F],t++}u=C+D,y[u]=s/o,z[u]=p/o,A[u]=q/o,B[u]=r/o}C+=e}for(C=0,v=-g,w=v*e,E=0;k>E;E++){for(D=0;e>D;D++){if(r=q=p=s=o=0,0>v)x=u=-v,t=D;else{if(v>=k)break;x=0,u=v,t=D+w}for(F=x;h>F&&!(u>=k);F++)G=j[F],s+=G[y[t]],p+=G[z[t]],q+=G[A[t]],r+=G[B[t]],o+=i[F],u++,t+=e;m[D+C]=s/o<<24|p/o<<16|q/o<<8|r/o}C+=e,w+=e,v++}f._setPixels(c,m)}var f={};f._toPixels=function(a){return a instanceof ImageData?a.data:a.getContext("2d").getImageData(0,0,a.width,a.height).data},f._getARGB=function(a,b){var c=4*b;return a[c+3]<<24&4278190080|a[c]<<16&16711680|a[c+1]<<8&65280|255&a[c+2]},f._setPixels=function(a,b){for(var c=0,d=0,e=a.length;e>d;d++)c=4*d,a[c+0]=(16711680&b[d])>>>16,a[c+1]=(65280&b[d])>>>8,a[c+2]=255&b[d],a[c+3]=(4278190080&b[d])>>>24},f._toImageData=function(a){return a instanceof ImageData?a:a.getContext("2d").getImageData(0,0,a.width,a.height)},f._createImageData=function(a,b){return f._tmpCanvas=document.createElement("canvas"),f._tmpCtx=f._tmpCanvas.getContext("2d"),this._tmpCtx.createImageData(a,b)},f.apply=function(a,b,c){var d=a.getContext("2d"),e=d.getImageData(0,0,a.width,a.height),f=b(e,c);f instanceof ImageData?d.putImageData(f,0,0,0,0,a.width,a.height):d.putImageData(e,0,0,0,0,a.width,a.height)},f.threshold=function(a,b){var c=f._toPixels(a);void 0===b&&(b=.5);for(var d=Math.floor(255*b),e=0;e=d?255:0,c[e]=c[e+1]=c[e+2]=g}},f.gray=function(a){for(var b=f._toPixels(a),c=0;cb||b>255)throw new Error("Level must be greater than 2 and less than 255 for posterize");for(var d=b-1,e=0;e>8)/d,c[e+1]=255*(h*b>>8)/d,c[e+2]=255*(i*b>>8)/d}},f.dilate=function(a){for(var b,c,d,e,g,h,i,j,k,l,m,n,o,p,q,r,s,t=f._toPixels(a),u=0,v=t.length?t.length/4:0,w=new Int32Array(v);v>u;)for(b=u,c=u+a.width;c>u;)d=e=f._getARGB(t,u),i=u-1,h=u+1,j=u-a.width,k=u+a.width,b>i&&(i=u),h>=c&&(h=u),0>j&&(j=0),k>=v&&(k=u),n=f._getARGB(t,j),m=f._getARGB(t,i),o=f._getARGB(t,k),l=f._getARGB(t,h),g=77*(d>>16&255)+151*(d>>8&255)+28*(255&d),q=77*(m>>16&255)+151*(m>>8&255)+28*(255&m),p=77*(l>>16&255)+151*(l>>8&255)+28*(255&l),r=77*(n>>16&255)+151*(n>>8&255)+28*(255&n),s=77*(o>>16&255)+151*(o>>8&255)+28*(255&o),q>g&&(e=m,g=q),p>g&&(e=l,g=p),r>g&&(e=n,g=r),s>g&&(e=o,g=s),w[u++]=e;f._setPixels(t,w)},f.erode=function(a){for(var b,c,d,e,g,h,i,j,k,l,m,n,o,p,q,r,s,t=f._toPixels(a),u=0,v=t.length?t.length/4:0,w=new Int32Array(v);v>u;)for(b=u,c=u+a.width;c>u;)d=e=f._getARGB(t,u),i=u-1,h=u+1,j=u-a.width,k=u+a.width,b>i&&(i=u),h>=c&&(h=u),0>j&&(j=0),k>=v&&(k=u),n=f._getARGB(t,j),m=f._getARGB(t,i),o=f._getARGB(t,k),l=f._getARGB(t,h),g=77*(d>>16&255)+151*(d>>8&255)+28*(255&d),q=77*(m>>16&255)+151*(m>>8&255)+28*(255&m),p=77*(l>>16&255)+151*(l>>8&255)+28*(255&l),r=77*(n>>16&255)+151*(n>>8&255)+28*(255&n),s=77*(o>>16&255)+151*(o>>8&255)+28*(255&o),g>q&&(e=m,g=q),g>p&&(e=l,g=p),g>r&&(e=n,g=r),g>s&&(e=o,g=s),w[u++]=e;f._setPixels(t,w)};var g,h,i,j;f.blur=function(a,b){e(a,b)},b.exports=f},{}],66:[function(a,b,c){"use strict";var d=a("../core/core"),e=[];d.prototype.createImage=function(a,b){return new d.Image(a,b)},d.prototype.saveCanvas=function(){var a,b,c;if(3===arguments.length?(a=arguments[0],b=arguments[1],c=arguments[2]):2===arguments.length?"object"==typeof arguments[0]?(a=arguments[0],b=arguments[1]):(b=arguments[0],c=arguments[1]):1===arguments.length&&("object"==typeof arguments[0]?a=arguments[0]:b=arguments[0]),a instanceof d.Element&&(a=a.elt),a instanceof HTMLCanvasElement||(a=null),c||(c=d.prototype._checkFileExtension(b,c)[1],""===c&&(c="png")),a||this._curElement&&this._curElement.elt&&(a=this._curElement.elt),d.prototype._isSafari()){var e="Hello, Safari user!\n";e+="Now capturing a screenshot...\n",e+="To save this image,\n",e+="go to File --> Save As.\n",alert(e),window.location.href=a.toDataURL()}else{var f;if("undefined"==typeof c)c="png",f="image/png";else switch(c){case"png":f="image/png";break;case"jpeg":f="image/jpeg";break;case"jpg":f="image/jpeg";break;default:f="image/png"}var g="image/octet-stream",h=a.toDataURL(f);h=h.replace(f,g),d.prototype.downloadFile(h,b,c)}},d.prototype.saveFrames=function(a,b,c,f,g){var h=c||3;h=d.prototype.constrain(h,0,15),h=1e3*h;var i=f||15;i=d.prototype.constrain(i,0,22);var j=0,k=d.prototype._makeFrame,l=this._curElement.elt,m=setInterval(function(){k(a+j,b,l),j++},1e3/i);setTimeout(function(){if(clearInterval(m),g)g(e);else for(var a=0;a0&&b>a?a:b}var e=a("../core/core"),f=a("./filters"),g=a("../core/canvas"),h=a("../core/constants");a("../core/error_helpers"),e.prototype.loadImage=function(a,b,c){var d=new Image,f=new e.Image(1,1,this),g=e._getDecrementPreload.apply(this,arguments);return d.onload=function(){f.width=f.canvas.width=d.width,f.height=f.canvas.height=d.height,f.drawingContext.drawImage(d,0,0),"function"==typeof b&&b(f),g&&b!==g&&g()},d.onerror=function(a){e._friendlyFileLoadError(0,d.src),"function"==typeof c&&c!==g&&c(a)},0!==a.indexOf("data:image/")&&(d.crossOrigin="Anonymous"),d.src=a,f},e.prototype.image=function(a,b,c,e,f,h,i,j,k){if(arguments.length<=5)if(h=b||0,i=c||0,b=0,c=0,a.elt&&a.elt.videoWidth&&!a.canvas){var l=a.elt.videoWidth,m=a.elt.videoHeight;j=e||a.width,k=f||a.width*m/l,e=l,f=m}else j=e||a.width,k=f||a.height,e=a.width,f=a.height;else{if(9!==arguments.length)throw"Wrong number of arguments to image()";b=b||0,c=c||0,e=d(e,a.width),f=d(f,a.height),h=h||0,i=i||0,j=j||a.width,k=k||a.height}var n=g.modeAdjust(h,i,j,k,this._renderer._imageMode);this._renderer.image(a,b,c,e,f,n.x,n.y,n.w,n.h)},e.prototype.tint=function(){var a=this.color.apply(this,arguments);this._renderer._tint=a.levels},e.prototype.noTint=function(){this._renderer._tint=null},e.prototype._getTintedImageCanvas=function(a){if(!a.canvas)return a;var b=f._toPixels(a.canvas),c=document.createElement("canvas");c.width=a.canvas.width,c.height=a.canvas.height;for(var d=c.getContext("2d"),e=d.createImageData(a.canvas.width,a.canvas.height),g=e.data,h=0;h0&&this.loadPixels()},d.Image.prototype.copy=function(){d.prototype.copy.apply(this,arguments)},d.Image.prototype.mask=function(a){void 0===a&&(a=this);var b=this.drawingContext.globalCompositeOperation,c=1;a instanceof d.Renderer&&(c=a._pInst._pixelDensity);var e=[a,0,0,c*a.width,c*a.height,0,0,this.width,this.height];this.drawingContext.globalCompositeOperation="destination-in",this.copy.apply(this,e),this.drawingContext.globalCompositeOperation=b},d.Image.prototype.filter=function(a,b){e.apply(this.canvas,e[a.toLowerCase()],b)},d.Image.prototype.blend=function(){d.prototype.blend.apply(this,arguments)},d.Image.prototype.save=function(a,b){var c;if(b)switch(b.toLowerCase()){case"png":c="image/png";break;case"jpeg":c="image/jpeg";break;case"jpg":c="image/jpeg";break;default:c="image/png"}else b="png",c="image/png";var e="image/octet-stream",f=this.canvas.toDataURL(c);f=f.replace(c,e),d.prototype.downloadFile(f,a,b)},d.Image.prototype.createTexture=function(a){return this},b.exports=d.Image},{"../core/core":48,"./filters":65}],69:[function(a,b,c){"use strict";var d=a("../core/core"),e=a("./filters");a("../color/p5.Color"),d.prototype.pixels=[],d.prototype.blend=function(){this._renderer.blend.apply(this._renderer,arguments)},d.prototype.copy=function(){d.Renderer2D._copyHelper.apply(this,arguments)},d.prototype.filter=function(a,b){e.apply(this.canvas,e[a.toLowerCase()],b)},d.prototype.get=function(a,b,c,d){return this._renderer.get(a,b,c,d)},d.prototype.loadPixels=function(){this._renderer.loadPixels()},d.prototype.set=function(a,b,c){this._renderer.set(a,b,c)},d.prototype.updatePixels=function(a,b,c,d){0!==this.pixels.length&&this._renderer.updatePixels(a,b,c,d)},b.exports=d},{"../color/p5.Color":42,"../core/core":48,"./filters":65}],70:[function(a,b,c){"use strict";function d(a,b){var c={};if(b=b||[],"undefined"==typeof b)for(var d=0;d"),d.println("");var k=' "),d.println(""),d.println(" "),"0"!==f[0]){d.println(" ");for(var l=0;l"+m),d.println(" ")}d.println(" ")}for(var n=0;n");for(var o=0;o"+q),d.println(" ")}d.println(" ")}d.println("
"),d.println(""),d.print("")}d.close(),d.flush()},h.prototype.writeFile=function(a,b,c){var d="application/octet-stream";h.prototype._isSafari()&&(d="text/plain");var e=new Blob(a,{type:d}),f=window.URL.createObjectURL(e);h.prototype.downloadFile(f,b,c)},h.prototype.downloadFile=function(a,b,c){var d=f(b,c),e=d[0],i=d[1],j=document.createElement("a");if(j.href=a,j.download=e,j.onclick=g,j.style.display="none",document.body.appendChild(j),h.prototype._isSafari()){var k="Hello, Safari user! To download this file...\n";k+="1. Go to File --> Save As.\n",k+='2. Choose "Page Source" as the Format.\n',k+='3. Name it with this extension: ."'+i+'"',alert(k)}j.click(),a=null},h.prototype._checkFileExtension=f,h.prototype._isSafari=function(){var a=Object.prototype.toString.call(window.HTMLElement);return a.indexOf("Constructor")>0},b.exports=h},{"../core/core":48,"../core/error_helpers":51,"opentype.js":8,reqwest:27}],71:[function(a,b,c){"use strict";var d=a("../core/core");d.Table=function(a){this.columns=[],this.rows=[]},d.Table.prototype.addRow=function(a){var b=a||new d.TableRow;if("undefined"==typeof b.arr||"undefined"==typeof b.obj)throw"invalid TableRow: "+b;return b.table=this,this.rows.push(b),b},d.Table.prototype.removeRow=function(a){this.rows[a].table=null;var b=this.rows.splice(a+1,this.rows.length);this.rows.pop(),this.rows=this.rows.concat(b)},d.Table.prototype.getRow=function(a){return this.rows[a]},d.Table.prototype.getRows=function(){return this.rows},d.Table.prototype.findRow=function(a,b){if("string"==typeof b){for(var c=0;c=0))throw'This table has no column named "'+a+'"';d=b[a],e[d]=b}else e[f]=this.rows[f].obj;return e},d.Table.prototype.getArray=function(){for(var a=[],b=0;b=0))throw'This table has no column named "'+a+'"';this.obj[a]=b,this.arr[c]=b}else{if(!(ae;e++)d[e]=Math.random()}0>a&&(a=-a),0>b&&(b=-b),0>c&&(c=-c);for(var n,o,p,q,r,s=Math.floor(a),t=Math.floor(b),u=Math.floor(c),v=a-s,w=b-t,x=c-u,y=0,z=.5,A=0;k>A;A++){var B=s+(t<=1&&(s++,v--),w>=1&&(t++,w--),x>=1&&(u++,x--)}return y},e.prototype.noiseDetail=function(a,b){a>0&&(k=a),b>0&&(l=b)},e.prototype.noiseSeed=function(a){var b=function(){var a,b,c=4294967296,d=1664525,e=1013904223;return{setSeed:function(d){b=a=(null==d?Math.random()*c:d)>>>0},getSeed:function(){return a},rand:function(){return b=(d*b+e)%c,b/c}}}();b.setSeed(a),d=new Array(j+1);for(var c=0;j+1>c;c++)d[c]=b.rand()},b.exports=e},{"../core/core":48}],76:[function(a,b,c){"use strict";var d=a("../core/core"),e=a("./polargeometry"),f=a("../core/constants");d.Vector=function(){var a,b,c;arguments[0]instanceof d?(this.p5=arguments[0],a=arguments[1][0]||0,b=arguments[1][1]||0,c=arguments[1][2]||0):(a=arguments[0]||0,b=arguments[1]||0,c=arguments[2]||0),this.x=a,this.y=b,this.z=c},d.Vector.prototype.toString=function(){return"p5.Vector Object : ["+this.x+", "+this.y+", "+this.z+"]"},d.Vector.prototype.set=function(a,b,c){return a instanceof d.Vector?(this.x=a.x||0,this.y=a.y||0,this.z=a.z||0,this):a instanceof Array?(this.x=a[0]||0,this.y=a[1]||0,this.z=a[2]||0,this):(this.x=a||0,this.y=b||0,this.z=c||0,this)},d.Vector.prototype.copy=function(){return this.p5?new d.Vector(this.p5,[this.x,this.y,this.z]):new d.Vector(this.x,this.y,this.z)},d.Vector.prototype.add=function(a,b,c){return a instanceof d.Vector?(this.x+=a.x||0,this.y+=a.y||0,this.z+=a.z||0,this):a instanceof Array?(this.x+=a[0]||0,this.y+=a[1]||0,this.z+=a[2]||0,this):(this.x+=a||0,this.y+=b||0,this.z+=c||0,this)},d.Vector.prototype.sub=function(a,b,c){return a instanceof d.Vector?(this.x-=a.x||0,this.y-=a.y||0,this.z-=a.z||0,this):a instanceof Array?(this.x-=a[0]||0,this.y-=a[1]||0,this.z-=a[2]||0,this):(this.x-=a||0,this.y-=b||0,this.z-=c||0,this)},d.Vector.prototype.mult=function(a){return this.x*=a||0,this.y*=a||0,this.z*=a||0,this},d.Vector.prototype.div=function(a){return this.x/=a,this.y/=a,this.z/=a,this},d.Vector.prototype.mag=function(){return Math.sqrt(this.magSq())},d.Vector.prototype.magSq=function(){var a=this.x,b=this.y,c=this.z;return a*a+b*b+c*c},d.Vector.prototype.dot=function(a,b,c){return a instanceof d.Vector?this.dot(a.x,a.y,a.z):this.x*(a||0)+this.y*(b||0)+this.z*(c||0)},d.Vector.prototype.cross=function(a){var b=this.y*a.z-this.z*a.y,c=this.z*a.x-this.x*a.z,e=this.x*a.y-this.y*a.x;return this.p5?new d.Vector(this.p5,[b,c,e]):new d.Vector(b,c,e)},d.Vector.prototype.dist=function(a){var b=a.copy().sub(this);return b.mag()},d.Vector.prototype.normalize=function(){return this.div(this.mag())},d.Vector.prototype.limit=function(a){var b=this.magSq();return b>a*a&&(this.div(Math.sqrt(b)),this.mult(a)),this},d.Vector.prototype.setMag=function(a){return this.normalize().mult(a)},d.Vector.prototype.heading=function(){var a=Math.atan2(this.y,this.x);return this.p5?this.p5._angleMode===f.RADIANS?a:e.radiansToDegrees(a):a},d.Vector.prototype.rotate=function(a){this.p5&&this.p5._angleMode===f.DEGREES&&(a=e.degreesToRadians(a));var b=this.heading()+a,c=this.mag();return this.x=Math.cos(b)*c,this.y=Math.sin(b)*c,this},d.Vector.prototype.lerp=function(a,b,c,e){return a instanceof d.Vector?this.lerp(a.x,a.y,a.z,b):(this.x+=(a-this.x)*e||0,this.y+=(b-this.y)*e||0,this.z+=(c-this.z)*e||0,this)},d.Vector.prototype.array=function(){return[this.x||0,this.y||0,this.z||0]},d.Vector.prototype.equals=function(a,b,c){var e,f,g;return a instanceof d.Vector?(e=a.x||0,f=a.y||0,g=a.z||0):a instanceof Array?(e=a[0]||0,f=a[1]||0,g=a[2]||0):(e=a||0,f=b||0,g=c||0),this.x===e&&this.y===f&&this.z===g},d.Vector.fromAngle=function(a){return this.p5&&this.p5._angleMode===f.DEGREES&&(a=e.degreesToRadians(a)),this.p5?new d.Vector(this.p5,[Math.cos(a),Math.sin(a),0]):new d.Vector(Math.cos(a),Math.sin(a),0)},d.Vector.random2D=function(){var a;return a=this.p5?this.p5._angleMode===f.DEGREES?this.p5.random(360):this.p5.random(f.TWO_PI):Math.random()*Math.PI*2,this.fromAngle(a)},d.Vector.random3D=function(){var a,b;this.p5?(a=this.p5.random(0,f.TWO_PI),b=this.p5.random(-1,1)):(a=Math.random()*Math.PI*2,b=2*Math.random()-1);var c=Math.sqrt(1-b*b)*Math.cos(a),e=Math.sqrt(1-b*b)*Math.sin(a);return this.p5?new d.Vector(this.p5,[c,e,b]):new d.Vector(c,e,b)},d.Vector.add=function(a,b,c){return c?c.set(a):c=a.copy(),c.add(b),c},d.Vector.sub=function(a,b,c){return c?c.set(a):c=a.copy(),c.sub(b),c},d.Vector.mult=function(a,b,c){return c?c.set(a):c=a.copy(),c.mult(b),c},d.Vector.div=function(a,b,c){return c?c.set(a):c=a.copy(),c.div(b),c},d.Vector.dot=function(a,b){return a.dot(b)},d.Vector.cross=function(a,b){return a.cross(b)},d.Vector.dist=function(a,b){return a.dist(b)},d.Vector.lerp=function(a,b,c,d){return d?d.set(a):d=a.copy(),d.lerp(b,c),d},d.Vector.angleBetween=function(a,b){var c=Math.acos(a.dot(b)/(a.mag()*b.mag()));return this.p5&&this.p5._angleMode===f.DEGREES&&(c=e.radiansToDegrees(c)),c},b.exports=d.Vector},{"../core/constants":47,"../core/core":48,"./polargeometry":77}],77:[function(a,b,c){b.exports={degreesToRadians:function(a){return 2*Math.PI*a/360},radiansToDegrees:function(a){return 360*a/(2*Math.PI)}}},{}],78:[function(a,b,c){"use strict";var d=a("../core/core"),e=!1,f=function(){var a,b,c=4294967296,d=1664525,e=1013904223;return{setSeed:function(d){b=a=(null==d?Math.random()*c:d)>>>0},getSeed:function(){return a},rand:function(){return b=(d*b+e)%c,b/c}}}();d.prototype.randomSeed=function(a){f.setSeed(a),e=!0},d.prototype.random=function(a,b){var c;if(c=e?f.rand():Math.random(),0===arguments.length)return c;if(1===arguments.length)return c*a;if(a>b){var d=a;a=b,b=d}return c*(b-a)+a};var g,h=!1;d.prototype.randomGaussian=function(a,b){var c,d,e,f;if(h)c=g,h=!1;else{do d=this.random(2)-1,e=this.random(2)-1,f=d*d+e*e;while(f>=1);f=Math.sqrt(-2*Math.log(f)/f),c=d*f,g=e*f,h=!0}var i=a||0,j=b||1;return c*j+i},b.exports=d},{"../core/core":48}],79:[function(a,b,c){"use strict";var d=a("../core/core"),e=a("./polargeometry"),f=a("../core/constants");d.prototype._angleMode=f.RADIANS,d.prototype.acos=function(a){return this._angleMode===f.RADIANS?Math.acos(a):e.radiansToDegrees(Math.acos(a))},d.prototype.asin=function(a){return this._angleMode===f.RADIANS?Math.asin(a):e.radiansToDegrees(Math.asin(a))},d.prototype.atan=function(a){return this._angleMode===f.RADIANS?Math.atan(a):e.radiansToDegrees(Math.atan(a))},d.prototype.atan2=function(a,b){return this._angleMode===f.RADIANS?Math.atan2(a,b):e.radiansToDegrees(Math.atan2(a,b))},d.prototype.cos=function(a){return this._angleMode===f.RADIANS?Math.cos(a):Math.cos(this.radians(a))},d.prototype.sin=function(a){return this._angleMode===f.RADIANS?Math.sin(a):Math.sin(this.radians(a))},d.prototype.tan=function(a){return this._angleMode===f.RADIANS?Math.tan(a):Math.tan(this.radians(a))},d.prototype.degrees=function(a){return e.radiansToDegrees(a)},d.prototype.radians=function(a){return e.degreesToRadians(a)},d.prototype.angleMode=function(a){(a===f.DEGREES||a===f.RADIANS)&&(this._angleMode=a)},b.exports=d},{"../core/constants":47,"../core/core":48,"./polargeometry":77}],80:[function(a,b,c){"use strict";var d=a("../core/core");d.prototype.textAlign=function(a,b){return this._renderer.textAlign.apply(this._renderer,arguments)},d.prototype.textLeading=function(a){return this._renderer.textLeading.apply(this._renderer,arguments)},d.prototype.textSize=function(a){return this._renderer.textSize.apply(this._renderer,arguments)},d.prototype.textStyle=function(a){return this._renderer.textStyle.apply(this._renderer,arguments)},d.prototype.textWidth=function(a){return this._renderer.textWidth.apply(this._renderer,arguments)},d.prototype.textAscent=function(){return this._renderer.textAscent()},d.prototype.textDescent=function(){return this._renderer.textDescent()},d.prototype._updateTextMetrics=function(){return this._renderer._updateTextMetrics()},b.exports=d},{"../core/core":48}],81:[function(a,b,c){"use strict";var d=a("../core/core"),e=a("../core/constants");a("../core/error_helpers"),d.prototype.text=function(a,b,c,d,e){for(var f=new Array(arguments.length),g=0;gi;i+=f)g.push(n(a,i));return c.simplifyThreshold&&e(g,c.simplifyThreshold),g}function e(a,b){b="undefined"==typeof b?0:b;for(var c=0,d=a.length-1;a.length>3&&d>=0;--d)j(i(a,d-1),i(a,d),i(a,d+1),b)&&(a.splice(d%a.length,1),c++);return c}function f(a){for(var b,c=[],d=0;db?b%c+c:b%c]}function j(a,b,c,d){if(!d)return 0===k(a,b,c);"undefined"==typeof j.tmpPoint1&&(j.tmpPoint1=[],j.tmpPoint2=[]);var e=j.tmpPoint1,f=j.tmpPoint2;e.x=b.x-a.x,e.y=b.y-a.y,f.x=c.x-b.x,f.y=c.y-b.y;var g=e.x*f.x+e.y*f.y,h=Math.sqrt(e.x*e.x+e.y*e.y),i=Math.sqrt(f.x*f.x+f.y*f.y),l=Math.acos(g/(h*i));return d>l}function k(a,b,c){return(b[0]-a[0])*(c[1]-a[1])-(c[0]-a[0])*(b[1]-a[1])}function l(a,b,c,d,e,f,g,h,i){var j=1-i,k=Math.pow(j,3),l=Math.pow(j,2),m=i*i,n=m*i,o=k*a+3*l*i*c+3*j*i*i*e+n*g,p=k*b+3*l*i*d+3*j*i*i*f+n*h,q=a+2*i*(c-a)+m*(e-2*c+a),r=b+2*i*(d-b)+m*(f-2*d+b),s=c+2*i*(e-c)+m*(g-2*e+c),t=d+2*i*(f-d)+m*(h-2*f+d),u=j*a+i*c,v=j*b+i*d,w=j*e+i*g,x=j*f+i*h,y=90-180*Math.atan2(q-s,r-t)/Math.PI;return(q>s||t>r)&&(y+=180),{x:o,y:p,m:{x:q,y:r},n:{x:s,y:t},start:{x:u,y:v},end:{x:w,y:x},alpha:y}}function m(a,b,c,d,e,f,g,h,i){return null==i?u(a,b,c,d,e,f,g,h):l(a,b,c,d,e,f,g,h,v(a,b,c,d,e,f,g,h,i))}function n(a,b,c){a=p(a);for(var d,e,f,g,h,i="",j={},k=0,n=0,o=a.length;o>n;n++){if(f=a[n],"M"===f[0])d=+f[1],e=+f[2];else{if(g=m(d,e,f[1],f[2],f[3],f[4],f[5],f[6]),k+g>b&&!c)return h=m(d,e,f[1],f[2],f[3],f[4],f[5],f[6],b-k),{x:h.x,y:h.y,alpha:h.alpha};k+=g,d=+f[5],e=+f[6]}i+=f.shift()+f}return j.end=i,h=c?k:l(d,e,f[0],f[1],f[2],f[3],f[4],f[5],1),h.alpha&&(h={x:h.x,y:h.y,alpha:h.alpha}),h}function o(a){var b=[],c=0,d=0,e=0,f=0,g=0;"M"===a[0][0]&&(c=+a[0][1],d=+a[0][2],e=c,f=d,g++,b[0]=["M",c,d]);for(var h,i,j,k=3===a.length&&"M"===a[0][0]&&"R"===a[1][0].toUpperCase()&&"Z"===a[2][0].toUpperCase(),l=g,m=a.length;m>l;l++){if(b.push(i=[]),j=a[l],j[0]!==String.prototype.toUpperCase.call(j[0]))switch(i[0]=String.prototype.toUpperCase.call(j[0]),i[0]){case"A":i[1]=j[1],i[2]=j[2],i[3]=j[3],i[4]=j[4],i[5]=j[5],i[6]=+(j[6]+c),i[7]=+(j[7]+d);break;case"V":i[1]=+j[1]+d;break;case"H":i[1]=+j[1]+c;break;case"R":h=[c,d].concat(j.slice(1));for(var n=2,o=h.length;o>n;n++)h[n]=+h[n]+c,h[++n]=+h[n]+d;b.pop(),b=b.concat(r(h,k));break;case"M":e=+j[1]+c,f=+j[2]+d;break;default:for(n=1,o=j.length;o>n;n++)i[n]=+j[n]+(n%2?c:d)}else if("R"===j[0])h=[c,d].concat(j.slice(1)),b.pop(),b=b.concat(r(h,k)),i=["R"].concat(j.slice(-2));else for(var p=0,q=j.length;q>p;p++)i[p]=j[p];switch(i[0]){case"Z":c=e,d=f;break;case"H":c=i[1];break;case"V":d=i[1];break;case"M":e=i[i.length-2],f=i[i.length-1];break;default:c=i[i.length-2],d=i[i.length-1]}}return b}function p(a,b){for(var c=o(a),d=b&&o(b),e={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},f={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},g=(function(a,b,c){var d,e,f={T:1,Q:1};if(!a)return["C",b.x,b.y,b.x,b.y,b.x,b.y];switch(a[0]in f||(b.qx=b.qy=null),a[0]){case"M":b.X=a[1],b.Y=a[2];break;case"A":a=["C"].concat(q.apply(0,[b.x,b.y].concat(a.slice(1))));break;case"S":"C"===c||"S"===c?(d=2*b.x-b.bx,e=2*b.y-b.by):(d=b.x,e=b.y),a=["C",d,e].concat(a.slice(1));break;case"T":"Q"===c||"T"===c?(b.qx=2*b.x-b.qx,b.qy=2*b.y-b.qy):(b.qx=b.x,b.qy=b.y),a=["C"].concat(t(b.x,b.y,b.qx,b.qy,a[1],a[2]));break;case"Q":b.qx=a[1],b.qy=a[2],a=["C"].concat(t(b.x,b.y,a[1],a[2],a[3],a[4]));break;case"L":a=["C"].concat(s(b.x,b.y,a[1],a[2]));break;case"H":a=["C"].concat(s(b.x,b.y,a[1],b.y));break;case"V":a=["C"].concat(s(b.x,b.y,b.x,a[1]));break;case"Z":a=["C"].concat(s(b.x,b.y,b.X,b.Y))}return a}),h=function(a,b){if(a[b].length>7){a[b].shift();for(var e=a[b];e.length;)j[b]="A",d&&(k[b]="A"),a.splice(b++,0,["C"].concat(e.splice(0,6)));a.splice(b,1),p=Math.max(c.length,d&&d.length||0)}},i=function(a,b,e,f,g){a&&b&&"M"===a[g][0]&&"M"!==b[g][0]&&(b.splice(g,0,["M",f.x,f.y]),e.bx=0,e.by=0,e.x=a[g][1],e.y=a[g][2],p=Math.max(c.length,d&&d.length||0))},j=[],k=[],l="",m="",n=0,p=Math.max(c.length,d&&d.length||0);p>n;n++){c[n]&&(l=c[n][0]),"C"!==l&&(j[n]=l,n&&(m=j[n-1])),c[n]=g(c[n],e,m),"A"!==j[n]&&"C"===l&&(j[n]="C"),h(c,n),d&&(d[n]&&(l=d[n][0]),"C"!==l&&(k[n]=l,n&&(m=k[n-1])),d[n]=g(d[n],f,m),"A"!==k[n]&&"C"===l&&(k[n]="C"),h(d,n)),i(c,d,e,f,n),i(d,c,f,e,n);var r=c[n],u=d&&d[n],v=r.length,w=d&&u.length;e.x=r[v-2],e.y=r[v-1],e.bx=parseFloat(r[v-4])||e.x,e.by=parseFloat(r[v-3])||e.y,f.bx=d&&(parseFloat(u[w-4])||f.x),f.by=d&&(parseFloat(u[w-3])||f.y),f.x=d&&u[w-2],f.y=d&&u[w-1]}return d?[c,d]:c}function q(a,b,c,d,e,f,g,h,i,j){var k,l,m,n,o,p=Math.PI,r=120*p/180,s=p/180*(+e||0),t=[],u=function(a,b,c){var d=a*Math.cos(c)-b*Math.sin(c),e=a*Math.sin(c)+b*Math.cos(c);return{x:d,y:e}};if(j)k=j[0],l=j[1],m=j[2],n=j[3];else{o=u(a,b,-s),a=o.x,b=o.y,o=u(h,i,-s),h=o.x,i=o.y;var v=(a-h)/2,w=(b-i)/2,x=v*v/(c*c)+w*w/(d*d);x>1&&(x=Math.sqrt(x),c=x*c,d=x*d);var y=c*c,z=d*d,A=(f===g?-1:1)*Math.sqrt(Math.abs((y*z-y*w*w-z*v*v)/(y*w*w+z*v*v)));m=A*c*w/d+(a+h)/2,n=A*-d*v/c+(b+i)/2,k=Math.asin(((b-n)/d).toFixed(9)),l=Math.asin(((i-n)/d).toFixed(9)),k=m>a?p-k:k,l=m>h?p-l:l,0>k&&(k=2*p+k),0>l&&(l=2*p+l),g&&k>l&&(k-=2*p),!g&&l>k&&(l-=2*p)}var B=l-k;if(Math.abs(B)>r){var C=l,D=h,E=i;l=k+r*(g&&l>k?1:-1),h=m+c*Math.cos(l),i=n+d*Math.sin(l),t=q(h,i,c,d,e,0,g,D,E,[l,C,m,n])}B=l-k;var F=Math.cos(k),G=Math.sin(k),H=Math.cos(l),I=Math.sin(l),J=Math.tan(B/4),K=4/3*c*J,L=4/3*d*J,M=[a,b],N=[a+K*G,b-L*F],O=[h+K*I,i-L*H],P=[h,i];if(N[0]=2*M[0]-N[0],N[1]=2*M[1]-N[1],j)return[N,O,P].concat(t);t=[N,O,P].concat(t).join().split(",");for(var Q=[],R=0,S=t.length;S>R;R++)Q[R]=R%2?u(t[R-1],t[R],s).y:u(t[R],t[R+1],s).x;return Q}function r(a,b){for(var c=[],d=0,e=a.length;e-2*!b>d;d+=2){var f=[{x:+a[d-2],y:+a[d-1]},{x:+a[d],y:+a[d+1]},{x:+a[d+2],y:+a[d+3]},{x:+a[d+4],y:+a[d+5]}];b?d?e-4===d?f[3]={x:+a[0],y:+a[1]}:e-2===d&&(f[2]={x:+a[0],y:+a[1]},f[3]={x:+a[2],y:+a[3]}):f[0]={x:+a[e-2],y:+a[e-1]}:e-4===d?f[3]=f[2]:d||(f[0]={x:+a[d],y:+a[d+1]}),c.push(["C",(-f[0].x+6*f[1].x+f[2].x)/6,(-f[0].y+6*f[1].y+f[2].y)/6,(f[1].x+6*f[2].x-f[3].x)/6,(f[1].y+6*f[2].y-f[3].y)/6,f[2].x,f[2].y])}return c}function s(a,b,c,d){return[a,b,c,d,c,d]}function t(a,b,c,d,e,f){var g=1/3,h=2/3;return[g*a+h*c,g*b+h*d,g*e+h*c,g*f+h*d,e,f]}function u(a,b,c,d,e,f,g,h,i){null==i&&(i=1),i=i>1?1:0>i?0:i;for(var j=i/2,k=12,l=[-.1252,.1252,-.3678,.3678,-.5873,.5873,-.7699,.7699,-.9041,.9041,-.9816,.9816],m=0,n=[.2491,.2491,.2335,.2335,.2032,.2032,.1601,.1601,.1069,.1069,.0472,.0472],o=0;k>o;o++){var p=j*l[o]+j,q=w(p,a,c,e,g),r=w(p,b,d,f,h),s=q*q+r*r;m+=n[o]*Math.sqrt(s)}return j*m}function v(a,b,c,d,e,f,g,h,i){if(!(0>i||u(a,b,c,d,e,f,g,h)n;)l/=2,m+=(i>j?1:-1)*l,j=u(a,b,c,d,e,f,g,h,m);return m}}function w(a,b,c,d,e){var f=-3*b+9*c-9*d+3*e,g=a*f+6*b-12*c+6*d;return a*g-3*b+3*c}function x(){for(var a=new Array(arguments.length),b=0;b2?a=this._getPath(a,b,c,d):"object"==typeof b&&(d=b),d&&"number"==typeof d.decimals&&(e=d.decimals),a.toPathData(e)},y.Font.prototype._getSVG=function(a,b,c,d){var e=3;return"string"==typeof a&&arguments.length>2?a=this._getPath(a,b,c,d):"object"==typeof b&&(d=b),d&&("number"==typeof d.decimals&&(e=d.decimals),"number"==typeof d.strokeWidth&&(a.strokeWidth=d.strokeWidth),"undefined"!=typeof d.fill&&(a.fill=d.fill),"undefined"!=typeof d.stroke&&(a.stroke=d.stroke)),a.toSVG(e)},y.Font.prototype._renderPath=function(a,b,c,d){var e,f=d&&d.renderer||this.parent._renderer,g=f.drawingContext;e="object"==typeof a&&a.commands?a.commands:this._getPath(a,b,c,f._textSize,d).commands,g.beginPath();for(var h=0;h1;)d=Math.random()*f|0,e=a[--f],a[f]=a[d],a[d]=e;return a},d.prototype.sort=function(a,b){var c=b?a.slice(0,Math.min(b,a.length)):a,d=b?a.slice(Math.min(b,a.length)):[];return c="string"==typeof c[0]?c.sort():c.sort(function(a,b){return a-b}),c.concat(d)},d.prototype.splice=function(a,b,c){return Array.prototype.splice.apply(a,[c,0].concat(b)),a},d.prototype.subset=function(a,b,c){return"undefined"!=typeof c?a.slice(b,b+c):a.slice(b,a.length)},b.exports=d},{"../core/core":48}],84:[function(a,b,c){"use strict";var d=a("../core/core");d.prototype["float"]=function(a){return parseFloat(a)},d.prototype["int"]=function(a,b){return"string"==typeof a?(b=b||10,parseInt(a,b)):"number"==typeof a?0|a:"boolean"==typeof a?a?1:0:a instanceof Array?a.map(function(a){return d.prototype["int"](a,b)}):void 0},d.prototype.str=function(a){return a instanceof Array?a.map(d.prototype.str):String(a)},d.prototype["boolean"]=function(a){return"number"==typeof a?0!==a:"string"==typeof a?"true"===a.toLowerCase():"boolean"==typeof a?a:a instanceof Array?a.map(d.prototype["boolean"]):void 0},d.prototype["byte"]=function(a){var b=d.prototype["int"](a,10);return"number"==typeof b?(b+128)%256-128:b instanceof Array?b.map(d.prototype["byte"]):void 0},d.prototype["char"]=function(a){return"number"!=typeof a||isNaN(a)?a instanceof Array?a.map(d.prototype["char"]):"string"==typeof a?d.prototype["char"](parseInt(a,10)):void 0:String.fromCharCode(a)},d.prototype.unchar=function(a){return"string"==typeof a&&1===a.length?a.charCodeAt(0):a instanceof Array?a.map(d.prototype.unchar):void 0},d.prototype.hex=function(a,b){if(b=void 0===b||null===b?b=8:b,a instanceof Array)return a.map(function(a){return d.prototype.hex(a,b)});if("number"==typeof a){0>a&&(a=4294967295+a+1);for(var c=Number(a).toString(16).toUpperCase();c.length=b&&(c=c.substring(c.length-b,c.length)),c}},d.prototype.unhex=function(a){return a instanceof Array?a.map(d.prototype.unhex):parseInt("0x"+a,16)},b.exports=d},{"../core/core":48}],85:[function(a,b,c){"use strict";function d(){var a=arguments[0],b=0>a,c=b?a.toString().substring(1):a.toString(),d=c.indexOf("."),e=-1!==d?c.substring(0,d):c,f=-1!==d?c.substring(d+1):"",g=b?"-":"";if(3===arguments.length){var h="";(-1!==d||arguments[2]-f.length>0)&&(h="."),f.length>arguments[2]&&(f=f.substring(0,arguments[2]));for(var i=0;ic.length){c+=-1===b?".":"";for(var e=arguments[1]-c.length+1,f=0;e>f;f++)c+="0"}else c=c.substring(0,arguments[1]+1);return d+c}function f(){return parseFloat(arguments[0])>0?"+"+arguments[0].toString():arguments[0].toString()}function g(){return parseFloat(arguments[0])>0?" "+arguments[0].toString():arguments[0].toString()}var h=a("../core/core");h.prototype.join=function(a,b){return a.join(b)},h.prototype.match=function(a,b){return a.match(b)},h.prototype.matchAll=function(a,b){for(var c=new RegExp(b,"g"),d=c.exec(a),e=[];null!==d;)e.push(d),d=c.exec(a);return e},h.prototype.nf=function(){if(arguments[0]instanceof Array){var a=arguments[1],b=arguments[2];return arguments[0].map(function(c){return d(c,a,b)})}var c=Object.prototype.toString.call(arguments[0]);return"[object Arguments]"===c?3===arguments[0].length?this.nf(arguments[0][0],arguments[0][1],arguments[0][2]):2===arguments[0].length?this.nf(arguments[0][0],arguments[0][1]):this.nf(arguments[0][0]):d.apply(this,arguments)},h.prototype.nfc=function(){if(arguments[0]instanceof Array){var a=arguments[1];return arguments[0].map(function(b){return e(b,a)})}return e.apply(this,arguments)},h.prototype.nfp=function(){var a=this.nf.apply(this,arguments);return a instanceof Array?a.map(f):f(a)},h.prototype.nfs=function(){var a=this.nf.apply(this,arguments);return a instanceof Array?a.map(g):g(a)},h.prototype.split=function(a,b){return a.split(b)},h.prototype.splitTokens=function(){var a,b,c,d;return d=arguments[1],arguments.length>1?(c=/\]/g.exec(d),b=/\[/g.exec(d),b&&c?(d=d.slice(0,c.index)+d.slice(c.index+1),b=/\[/g.exec(d),d=d.slice(0,b.index)+d.slice(b.index+1),a=new RegExp("[\\["+d+"\\]]","g")):c?(d=d.slice(0,c.index)+d.slice(c.index+1),a=new RegExp("["+d+"\\]]","g")):b?(d=d.slice(0,b.index)+d.slice(b.index+1),a=new RegExp("["+d+"\\[]","g")):a=new RegExp("["+d+"]","g")):a=/\s/g,arguments[0].split(a).filter(function(a){return a})},h.prototype.trim=function(a){return a instanceof Array?a.map(this.trim):a.trim()},b.exports=h},{"../core/core":48}],86:[function(a,b,c){"use strict";var d=a("../core/core");d.prototype.day=function(){return(new Date).getDate()},d.prototype.hour=function(){return(new Date).getHours()},d.prototype.minute=function(){return(new Date).getMinutes()},d.prototype.millis=function(){return window.performance.now()},d.prototype.month=function(){return(new Date).getMonth()+1},d.prototype.second=function(){return(new Date).getSeconds()},d.prototype.year=function(){return(new Date).getFullYear()},b.exports=d},{"../core/core":48}]},{},[39])(39)});p5.prototype._validateParameters = function() {};p5.prototype._friendlyFileLoadError = function() {};
\ No newline at end of file
diff --git a/javascript/site.js b/javascript/site.js
index 7fe7e2493..48c2f805a 100644
--- a/javascript/site.js
+++ b/javascript/site.js
@@ -1,5 +1,13 @@
$(function(){
+ // redirect download to support
+ $('.download [href*="download.processing.org"]').on('click', function (e) {
+ e.preventDefault()
+ window.open($(this).attr('href'))
+ window.location = '/download/support.html'
+ window.focus()
+ })
+
// sticky scroll
if(!Modernizr.touch){
$(window).scroll(function(){
@@ -97,3 +105,5 @@ function format_relative_time(time_ago) {
if ( time_ago.seconds > 1 ) return ' ' + time_ago.seconds + ' seconds ago';
return 'just now';
}
+
+
diff --git a/subscribe/index.php b/subscribe/index.php
index 09b856f39..a684a7fc8 100755
--- a/subscribe/index.php
+++ b/subscribe/index.php
@@ -94,9 +94,9 @@
Shop
»Forum
»GitHub
- »Issues
- »Wiki
- »FAQ
+ »Issues
+ »Wiki
+ »FAQ
»Twitter
»Facebook
diff --git a/templates/foundation-template.html b/templates/foundation-template.html
deleted file mode 100644
index 34d7c86e6..000000000
--- a/templates/foundation-template.html
+++ /dev/null
@@ -1,81 +0,0 @@
-
-
-
- <!--*-->title<!--*-->
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - Processing
- - p5.js
- - Processing.py
-
-
-
-
-
- header
-
-
-
-
-
- navigation
-
-
-
-
- content_for_layout
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/templates/foundation-template.local.html b/templates/foundation-template.local.html
deleted file mode 100644
index 5a5f3167e..000000000
--- a/templates/foundation-template.local.html
+++ /dev/null
@@ -1,58 +0,0 @@
-
-
-
- <!--*-->title<!--*-->
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/templates/foundation-template.nav.php b/templates/foundation-template.nav.php
deleted file mode 100644
index 24b967859..000000000
--- a/templates/foundation-template.nav.php
+++ /dev/null
@@ -1,65 +0,0 @@
- array('/', 0),
-
- 'Mission' => array('/mission/', 1),
-
- 'Projects' => array('/projects/', 2),
- 'People' => array('/people/', 3),
- 'Fellowships' => array('/fellowships/', 4),
- 'Reports' => array('/reports/', 5),
- 'Patrons' => array('/patrons/', 6),
- //'Donate' => array('/donate/', 7),
-
- //'Download' => array('/download/', 0),
-
- );
-
-
-function navigation($section = '')
-{
- global $lang;
- global $translation;
- //$tr = $translation->navigation; // Removed 22 Sep 2011 --CR
-
- // $abo = array('About', 'Overview', 'People', 'Foundation');
- //$ref = array('Reference', 'Language', 'A-Z', 'Libraries', 'Tools', 'Environment');
- //$learn = array('Learning', 'Tutorials', 'Basics', 'Topics', '3D', 'Library', 'Books');
- //$found = array('Overview', 'Mission', 'Projects', 'People', 'Fellowships', 'Reports', 'Patrons', 'Donate');
- $found = array('Overview', 'Mission', 'Projects', 'People', 'Fellowships', 'Reports', 'Patrons');
-
- $html = "\t\t\t".'\n";
-}
-
-function l($s, $c)
-{
- global $pages;
- return "$s";
- return "$s";
-}
-
-?>
diff --git a/templates/foundation-template.php b/templates/foundation-template.php
deleted file mode 100644
index f71cd33e1..000000000
--- a/templates/foundation-template.php
+++ /dev/null
@@ -1,290 +0,0 @@
-');
-define('REL_HEADER', '');
-define('HEADER_LINK', '');
-
-class Page
-{
- var $xhtml;
- var $lang;
- var $subtemplate = false;
- var $section;
-
- function Page($title = '', $section = '', $bodyid = '', $rel_path = '/')
- {
- $this->xhtml = new xhtml_page(TEMPLATEDIR.'foundation-template.html');
- $this->set('relpath', $rel_path);
- if (strcmp($rel_path, '/')) {
- $this->xhtml->set('header', REL_HEADER);
- } else {
- $this->xhtml->set('header', $section == 'Cover' ? HEADER : HEADER_LINK);
- $this->xhtml->set('header', $section == 'Overview2' ? HEADER : HEADER_LINK);
- }
- $this->section = $section;
- $this->xhtml->set('bodyid', ($bodyid == '') ? $section : $bodyid);
- $title = ($title == '') ? 'Processing Foundation' : $title . ' \ Processing Foundation';
- $this->xhtml->set('title', $title);
- $this->xhtml->set('navigation', navigation($section));
- }
-
- function set($key, $value)
- {
- $this->xhtml->set($key, $value);
- }
-
- function set_array($array)
- {
- foreach ($array as $key => $value) {
- $this->xhtml->set($key, $value);
- }
- }
-
- function subtemplate($file)
- {
- $piece = new xhtml_piece(TEMPLATEDIR.$file);
- $this->xhtml->set('content_for_layout', $piece->out());
- $this->subtemplate = true;
- }
-
- function content($content)
- {
- if (!$this->subtemplate) {
- $this->xhtml->set('content_for_layout', $content);
- } else {
- $this->xhtml->set('content', $content);
- }
- }
-
- function language($lang)
- {
- global $LANGUAGES;
- $this->lang = $lang;
- $this->xhtml->set('charset', $LANGUAGES[$lang][1]);
- $this->xhtml->set('lang', $lang);
- if ($lang != 'en') {
- #$this->xhtml->set('navigation', navigation_tr($this->section));
- $this->xhtml->set('navigation', navigation($this->section));
- }
- }
-
- function out()
- {
- if (!$this->lang) { $this->language('en'); }
- return $this->xhtml->out();
- }
-
- function set_rel_path($path = '')
- {
- $this->xhtml->set('relpath', $path);
- }
-}
-
-class ReferencePage
-{
- var $xhtml;
- var $lang;
- var $filepath;
-
- function ReferencePage(&$ref, $translation, $lang = 'en')
- {
- global $LANGUAGES;
-
- $this->filepath = 'reference/' . ($lang == 'en' ? '' : "$lang/") . $ref->name();
- $title = $ref->title() . ($lang == 'en' ? '' : " \ {$LANGUAGES[$lang][0]}") .' \ Language (API) \ Processing 2+';
-
- $xhtml = new xhtml_page(TEMPLATEDIR.'foundation-template.translation.html');
- $xhtml->set('header', HEADER_LINK);
- $xhtml->set('title', $title);
- $xhtml->set('bodyid', 'Langauge-'.$lang);
-
- $xhtml->set('navigation', ($lang == 'en') ? navigation('Language') : navigation('Language'));
-
- $piece = new xhtml_piece(TEMPLATEDIR.'foundation-template.reference.item.html');
- $xhtml->set('content_for_layout', $piece->out());
-
- $xhtml->set('reference_nav', reference_nav());
- $xhtml->set('language_nav', language_nav($lang));
-
- $xhtml->set('content', $ref->display());
- foreach ($translation->attributes as $key => $value) {
- $xhtml->set($key, $value);
- }
-
- foreach ($translation->meta as $key => $value) {
- $xhtml->set($key, $value);
- }
-
- $xhtml->set('updated', date('F d, Y h:i:sa T', filemtime(CONTENTDIR.'/'.$ref->filepath)));
-
- $this->xhtml = $xhtml;
- $this->language($lang);
- }
-
- function language($lang)
- {
- global $LANGUAGES;
- $this->lang = $lang;
- $this->xhtml->set('charset', $LANGUAGES[$lang][1]);
- $this->xhtml->set('lang', $lang);
- }
-
- function out()
- {
- return $this->xhtml->out();
- }
-
- function write()
- {
- writeFile($this->filepath, $this->xhtml->out());
- }
-}
-
-class LibReferencePage extends ReferencePage
-{
- function LibReferencePage(&$ref, $lib, $translation, $lang = 'en')
- {
- global $LANGUAGES;
-
- $this->langdir = 'reference/' . ($lang == 'en' ? '' : "$lang");
- $this->libsdir = $this->langdir . '/libraries';
- $this->libdir = $this->libsdir . "/$lib";
- $this->filepath = $this->libdir . '/' . $ref->name();
-
- $title = $ref->title() . ($lang == 'en' ? '' : " \ {$LANGUAGES[$lang][0]}") .' \ Language (API) \ Processing 2+';
-
- $xhtml = new xhtml_page(TEMPLATEDIR.'foundation-template.translation.html');
- $xhtml->set('header', HEADER_LINK);
- $xhtml->set('title', $title);
- $xhtml->set('bodyid', 'Library-ref');
- if ($lang == 'en') {
- $xhtml->set('navigation', navigation('Libraries'));
- } else {
- $xhtml->set('navigation', navigation_tr('Libraries'));
- }
-
- $piece = new xhtml_piece(TEMPLATEDIR.'foundation-template.reference.item.html');
- $xhtml->set('content_for_layout', $piece->out());
-
- $xhtml->set('reference_nav', library_nav($lib));
- $xhtml->set('language_nav', language_nav($lang));
-
- $xhtml->set('content', $ref->display());
-
- foreach ($translation->attributes as $key => $value) {
- $xhtml->set($key, $value);
- }
-
- foreach ($translation->meta as $key => $value) {
- $xhtml->set($key, $value);
- }
-
- //$xhtml->set('updated', date('F d, Y h:i:sa T', filemtime(CONTENTDIR.'/'.$ref->filepath)));
-
- $this->xhtml = $xhtml;
- $this->language($lang);
- }
-}
-
-class LocalPage extends Page
-{
- var $xhtml;
- var $lang = 'en';
- var $subtemplate = false;
-
- function LocalPage($title = '', $section = '', $bodyid = '', $rel_path = '')
- {
- $this->xhtml = new xhtml_page(TEMPLATEDIR.'foundation-template.local.html');
- $this->xhtml->set('header', '');
- $title = ($title == '') ? 'Processing 2+' : $title . ' \ Processing 2+';
- $this->xhtml->set('title', $title);
- $this->xhtml->set('navigation', local_nav($section, $rel_path));
- $this->set('relpath', $rel_path);
- $this->language('en');
- $this->xhtml->set('bodyid', ($bodyid == '') ? $section : $bodyid);
- }
-}
-
-class LocalReferencePage extends ReferencePage
-{
- var $xhtml;
- var $lang = 'en';
- var $filepath;
-
- function LocalReferencePage(&$ref, $translation, $lang = 'en', $rel_path = '')
- {
- $this->filepath = 'distribution/' . $ref->name();
- $title = $ref->title() .' \ Language (API) \ Processing 2+';
-
- $xhtml = new xhtml_page(TEMPLATEDIR.'foundation-template.local.html');
- $xhtml->set('header', '');
- $xhtml->set('title', $title);
- $xhtml->set('bodyid', 'Langauge');
- $xhtml->set('navigation', local_nav('Language'));
-
- $piece = new xhtml_piece(TEMPLATEDIR.'foundation-template.reference.item.html');
- $xhtml->set('content_for_layout', $piece->out());
-
- $xhtml->set('reference_nav', reference_nav());
- $xhtml->set('language_nav', language_nav($lang));
-
- $xhtml->set('content', $ref->display());
- foreach ($translation->attributes as $key => $value) {
- $xhtml->set($key, $value);
- }
-
- foreach ($translation->meta as $key => $value) {
- $xhtml->set($key, $value);
- }
-
- $xhtml->set('relpath', $rel_path);
- $xhtml->set('updated', date('F d, Y h:i:sa T', filemtime(CONTENTDIR.'/'.$ref->filepath)));
-
- $this->xhtml = $xhtml;
- $this->language($lang);
- }
-}
-
-class LocalLibReferencePage extends ReferencePage
-{
- function LocalLibReferencePage(&$ref, $lib, $translation, $rel_path = '../../')
- {
- global $LANGUAGES;
- $lang = 'en';
-
- $this->filepath = "distribution/libraries/$lib/" . $ref->name();
-
- $title = $ref->title() . "\\ $lib \\ Language (API) \\ Processing 2+";
-
- $xhtml = new xhtml_page(TEMPLATEDIR.'foundation-template.local.html');
- $xhtml->set('header', '');
- $xhtml->set('title', $title);
- $xhtml->set('bodyid', 'Library-ref');
-
- $xhtml->set('navigation', local_nav('Libraries', $rel_path));
-
- $piece = new xhtml_piece(TEMPLATEDIR.'foundation-template.reference.item.html');
- $xhtml->set('content_for_layout', $piece->out());
-
- $xhtml->set('reference_nav', library_nav($lib));
- $xhtml->set('language_nav', language_nav($lang));
-
- foreach ($translation->attributes as $key => $value) {
- $xhtml->set($key, $value);
- }
-
- foreach ($translation->meta as $key => $value) {
- $xhtml->set($key, $value);
- }
-
- $xhtml->set('content', $ref->display());
-
- $xhtml->set('updated', date('F d, Y h:i:sa T', filemtime(CONTENTDIR.'/'.$ref->filepath)));
- $xhtml->set('relpath', $rel_path);
- $this->xhtml = $xhtml;
- }
-}
-
-?>
diff --git a/templates/foundation-template.reference.item.html b/templates/foundation-template.reference.item.html
deleted file mode 100644
index 63f94d9f5..000000000
--- a/templates/foundation-template.reference.item.html
+++ /dev/null
@@ -1,43 +0,0 @@
-disclaimer contact
-
-content
-
-Updated on updated
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/templates/foundation-template.translation.html b/templates/foundation-template.translation.html
deleted file mode 100644
index 1bef912c5..000000000
--- a/templates/foundation-template.translation.html
+++ /dev/null
@@ -1,60 +0,0 @@
-
-
-
- <!--*-->title<!--*-->
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/templates/template.cover.html b/templates/template.cover.html
index 84ce4be2c..4e776eb87 100755
--- a/templates/template.cover.html
+++ b/templates/template.cover.html
@@ -7,53 +7,34 @@
Download Processing
Browse Tutorials
Visit the Reference
-
-
-
- Processing is a flexible software sketchbook and a language for learning how to code within the context of the visual arts. Since 2001, Processing has promoted software literacy within the visual arts and visual literacy within technology. There are tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning and prototyping.
-
-
- - » Free to download and open source
- - » Interactive programs with 2D, 3D or PDF output
- - » OpenGL integration for accelerated 2D and 3D
- - » For GNU/Linux, Mac OS X, and Windows
- - » Over 100 libraries extend the core software
- - » Well documented, with many books available
-
-
-
+
+
+ Processing is a flexible software sketchbook and a language for learning how to code within the context of the visual arts. Since 2001, Processing has promoted software literacy within the visual arts and visual literacy within technology. There are tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning and prototyping.
+
+ - » Free to download and open source
+ - » Interactive programs with 2D, 3D, PDF, or SVG output
+ - » OpenGL integration for accelerated 2D and 3D
+ - » For GNU/Linux, Mac OS X, Windows, Android, and ARM
+ - » Over 100 libraries extend the core software
+ - » Well documented, with many books available
+
+
-
-
- New Books!
-
- The 2nd edition of Getting Started with Processing is here and it's updated for Processing 3. It's now in full color and there's a new chapter on working with data. The 2nd edition of the Processing Handbook is here too. Every chapter has been revised, and new chapters introduce more ways to work with data and geometry. New “synthesis” chapters offer discussion and worked examples of such topics as sketching with code, modularity, and algorithms.
-
- 
-
-
-
-
-
-
+
+
+
+
-
-
+
-
- Exhibition
- exhibition
+
+ PCD 2020
+
+ The Processing Community Day (PCD) initiative is evolving. For 2020, we will offer a mentorship program for PCD Worldwide Organizers who are interested in learning from past community organizers and mentors. The goal is to help a diverse group of organizers launch a PCD in their local communities. Check out the PCD @ Worldwide site to learn more about starting or attending an event in 2020!
+
-
- To see more of what people are doing with Processing, check out these sites:
-
- » CreativeApplications.Net
- » For Your Processing
- » Processing Subreddit
- » OpenProcessing
- » Vimeo
-
- » Studio Sketchpad
+
+ To see more of what people are doing with Processing, check out these sites:
+ » CreativeApplications.Net
+ » OpenProcessing
+ » For Your Processing
+ » Processing Subreddit
+ » Vimeo
+ » Studio Sketchpad
-
- To contribute to the development, please visit
+
+ To contribute to Processing development, please visit
Processing on GitHub to read
instructions for downloading the code,
building from the source,
- reporting and tracking bugs, and
+ reporting and tracking bugs, and
creating libraries and tools.
-
-
Partners
- » Fathom
- » UCLA Arts Software Studio
- » NYU ITP
+ Partners
+ » Fathom
+ » NYU ITP
+ » UCLA Design Media Arts
-
- Mailing List
-
- If you are interested in receiving updates about Processing, submit your email through this form. Your email will only be used to send infrequent updates about Processing. It will not be sold or shared.
-
-
Contact
foundation@processing.org
diff --git a/templates/template.example.html b/templates/template.example.html
index aaa93cb04..d045acdb7 100644
--- a/templates/template.example.html
+++ b/templates/template.example.html
@@ -3,5 +3,7 @@
This example is for Processing 3+. If you have a previous version, use the examples included with your software. If you see any errors or have suggestions, please let us know.
+
+
content
diff --git a/templates/template.examples-basics.html b/templates/template.examples-basics.html
deleted file mode 100644
index e2075f25e..000000000
--- a/templates/template.examples-basics.html
+++ /dev/null
@@ -1,7 +0,0 @@
-Basic Examples. Short prototypical programs exploring the basics of programming with Processing.
-
-
- These examples are running online through Processing.js using HTML5 Canvas and WebGL for rendering. There are many more examples included with the Processing application; please look there if you don't find what you're looking for here.
-
-
-content
diff --git a/templates/template.examples-main.html b/templates/template.examples-main.html
deleted file mode 100644
index 430686080..000000000
--- a/templates/template.examples-main.html
+++ /dev/null
@@ -1,7 +0,0 @@
-Examples. Short, prototypical programs exploring the basics of programming with Processing.
-
-
- These examples are running online through Processing.js using HTML5 Canvas and WebGL for rendering. There are many more examples included with the Processing application; please look there if you don't find what you're looking for here.
-
-
-content
\ No newline at end of file
diff --git a/templates/template.examples-topics.html b/templates/template.examples-topics.html
deleted file mode 100644
index 8f4b71314..000000000
--- a/templates/template.examples-topics.html
+++ /dev/null
@@ -1,7 +0,0 @@
-Topic Examples. Short programs related to animation, drawing, interaction, motion, simulation, and more...
-
-
- These examples are running online through Processing.js using HTML5 Canvas and WebGL for rendering. There are many more examples included with the Processing application; please look there if you don't find what you're looking for here.
-
-
-content
\ No newline at end of file
diff --git a/templates/template.examples.html b/templates/template.examples.html
new file mode 100644
index 000000000..5973e8366
--- /dev/null
+++ b/templates/template.examples.html
@@ -0,0 +1,7 @@
+Examples. Short, prototypical programs exploring the basics of programming with Processing.
+
+
+ These examples are running online through p5.js using HTML Canvas for rendering. There are many more examples included with the Processing application; please look there if you don't find what you're looking for here.
+
+
+content
\ No newline at end of file
diff --git a/templates/template.html b/templates/template.html
index 91400ed36..b3836287a 100755
--- a/templates/template.html
+++ b/templates/template.html
@@ -26,6 +26,8 @@
Processing
p5.js
Processing.py
+ Processing for Android
+ Processing for Pi
- Processing Foundation
@@ -41,6 +43,13 @@
+
+
@@ -66,9 +75,7 @@
-
-