├── .gitignore
├── 404.html
├── README.md
├── books
└── index.php
├── community
└── index.php
├── contribute
└── index.php
├── contributors-conference
├── bocoup.png
├── edp.png
├── index.php
├── itp.png
├── logos.png
├── nea.jpg
├── studio.png
├── theartificial.png
└── theartificial.svg
├── copyright.php
├── css
├── f
│ ├── AvenirNextLTW01-Medium.eot
│ ├── AvenirNextLTW01-Medium.svg
│ ├── AvenirNextLTW01-Medium.ttf
│ ├── AvenirNextLTW01-Medium.woff
│ ├── inconsolata.eot
│ ├── inconsolata.otf
│ ├── inconsolata.svg
│ ├── inconsolata.ttf
│ └── inconsolata.woff
├── main.css
├── normalize.css
└── prism.css
├── download
├── index.php
├── new-release.php
└── release.php
├── end.php
├── examples
├── build_examples
│ ├── all_examples_template.ejs
│ ├── build.js
│ ├── example_template.ejs
│ ├── mobile_example_template.ejs
│ └── package.json
├── demos
│ ├── Hello_P5_Animation.php
│ ├── Hello_P5_Drawing.php
│ ├── Hello_P5_Flocking.php
│ ├── Hello_P5_Interactivity_1.php
│ ├── Hello_P5_Interactivity_2.php
│ ├── Hello_P5_Simple_Shapes.php
│ ├── Hello_P5_Song.php
│ ├── Hello_P5_Weather.php
│ ├── assets
│ │ └── .gitkeep
│ └── example.html
├── demos_src
│ └── 01_Hello_P5
│ │ ├── 01_shapes.js
│ │ ├── 02_interactivity.js
│ │ ├── 03_interactivity.js
│ │ ├── 04_animate.js
│ │ ├── 04_flocking.js
│ │ ├── 05_weather.js
│ │ ├── 06_drawing.js
│ │ └── 07_song.js
├── examples
│ ├── 3D_Geometries.php
│ ├── 3D_Materials.php
│ ├── 3D_Multiple_Lights.php
│ ├── 3D_Orbit_Control.php
│ ├── 3D_Sine_Cosine_in_3D.php
│ ├── 3D_Textures.php
│ ├── Arrays_Array.php
│ ├── Arrays_Array_2D.php
│ ├── Arrays_Array_Objects.php
│ ├── Color_Brightness.php
│ ├── Color_Color_Variables.php
│ ├── Color_Hue.php
│ ├── Color_Lerp_Color.php
│ ├── Color_Linear_Gradient.php
│ ├── Color_Radial_Gradient.php
│ ├── Color_Relativity.php
│ ├── Color_Saturation.php
│ ├── Control_Conditionals_1.php
│ ├── Control_Conditionals_2.php
│ ├── Control_Embedded_Iteration.php
│ ├── Control_Iteration.php
│ ├── Control_Logical_Operators.php
│ ├── Data_True_and_False.php
│ ├── Data_Variable_Scope.php
│ ├── Data_Variables.php
│ ├── Dom_Drop.php
│ ├── Dom_Input_and_Button.php
│ ├── Dom_Modifying_the_DOM.php
│ ├── Dom_Slider.php
│ ├── Dom_Video.php
│ ├── Dom_Video_Canvas.php
│ ├── Dom_Video_Capture.php
│ ├── Dom_Video_Pixels.php
│ ├── Form_3D_Primitives.php
│ ├── Form_Bezier.php
│ ├── Form_Pie_Chart.php
│ ├── Form_Points_and_Lines.php
│ ├── Form_Regular_Polygon.php
│ ├── Form_Shape_Primitives.php
│ ├── Form_Star.php
│ ├── Form_Triangle_Strip.php
│ ├── Image_Alpha_Mask.php
│ ├── Image_Background_Image.php
│ ├── Image_Create_Image.php
│ ├── Image_Load_and_Display_Image.php
│ ├── Image_Pointillism.php
│ ├── Image_Transparency.php
│ ├── Instance_Mode_Instantiation.php
│ ├── Interaction_Follow_1.php
│ ├── Interaction_Follow_2.php
│ ├── Interaction_Follow_3.php
│ ├── Interaction_Reach_1.php
│ ├── Interaction_Reach_2.php
│ ├── Interaction_Reach_3.php
│ ├── Interaction_Tickle.php
│ ├── Lights_Directional.php
│ ├── Lights_Mixture.php
│ ├── Math_Additive_Wave.php
│ ├── Math_Arctangent.php
│ ├── Math_Distance_1D.php
│ ├── Math_Distance_2D.php
│ ├── Math_Double_Random.php
│ ├── Math_Increment_Decrement.php
│ ├── Math_Noise_Wave.php
│ ├── Math_Operator_Precedence_.php
│ ├── Math_PolarToCartesian.php
│ ├── Math_Random.php
│ ├── Math_Sine.php
│ ├── Math_Sine_Cosine.php
│ ├── Math_Sine_Wave.php
│ ├── Math__Noise1D.php
│ ├── Mobile_Acceleration_Ball_Bounce.php
│ ├── Mobile_Acceleration_Color.php
│ ├── Mobile_Shake_Ball_Bounce.php
│ ├── Mobile_Simple_Draw.php
│ ├── Mobile_Tilted_3D_Box.php
│ ├── Objects_Array_of_Objects.php
│ ├── Objects_Multiple_Objects.php
│ ├── Objects_Objects.php
│ ├── Objects_Objects_2.php
│ ├── Simulate_Brownian_Motion.php
│ ├── Simulate_Flocking.php
│ ├── Simulate_Forces.php
│ ├── Simulate_Game_of_Life.php
│ ├── Simulate_L-Systems.php
│ ├── Simulate_Multiple_Particle_Systems.php
│ ├── Simulate_Particle_System.php
│ ├── Simulate_SmokeParticles.php
│ ├── Simulate_Soft_Body.php
│ ├── Simulate_Spirograph.php
│ ├── Simulate_Spring.php
│ ├── Simulate_Wolfram_CA.php
│ ├── Sound_Amplitude_Modulation.php
│ ├── Sound_Frequency_Modulation.php
│ ├── Sound_Frequency_Spectrum.php
│ ├── Sound_Load_and_Play_Sound.php
│ ├── Sound_Mic_Input.php
│ ├── Sound_Mic_Threshold.php
│ ├── Sound_Noise_Drum_Envelope.php
│ ├── Sound_Oscillator_Frequency.php
│ ├── Sound_Pan_Sound.php
│ ├── Sound_Play_Mode.php
│ ├── Sound_Playback_Rate.php
│ ├── Sound_Preload_SoundFile.php
│ ├── Sound_Sound_Effect.php
│ ├── Sound__Convolution_Reverb.php
│ ├── Sound__Delay.php
│ ├── Sound__Filter_BandPass.php
│ ├── Sound__Filter_LowPass.php
│ ├── Sound__Measuring_Amplitude.php
│ ├── Sound__Note_Envelope.php
│ ├── Sound__Record_Save_Audio.php
│ ├── Sound__Reverb.php
│ ├── Sound_soundFormats.php
│ ├── Structure_Coordinates.php
│ ├── Structure_Create_Graphics.php
│ ├── Structure_Functions.php
│ ├── Structure_Loop.php
│ ├── Structure_No_Loop.php
│ ├── Structure_Recursion.php
│ ├── Structure_Redraw.php
│ ├── Structure_Setup_and_Draw.php
│ ├── Structure_Width_and_Height.php
│ ├── assets
│ │ ├── 360video_256crop_v2.mp4
│ │ ├── Damscray_-_Dancing_Tiger_01.mp3
│ │ ├── Damscray_-_Dancing_Tiger_01.ogg
│ │ ├── Damscray_-_Dancing_Tiger_02.mp3
│ │ ├── Damscray_-_Dancing_Tiger_02.ogg
│ │ ├── Damscray_DancingTiger.mp3
│ │ ├── Damscray_DancingTiger.ogg
│ │ ├── LeagueGothic-Regular.otf
│ │ ├── beat.mp3
│ │ ├── beat.ogg
│ │ ├── beatbox.mp3
│ │ ├── beatbox.ogg
│ │ ├── bx-spring.mp3
│ │ ├── bx-spring.ogg
│ │ ├── cat.jpg
│ │ ├── concrete-tunnel.mp3
│ │ ├── concrete-tunnel.ogg
│ │ ├── doorbell.mp3
│ │ ├── doorbell.ogg
│ │ ├── drum.mp3
│ │ ├── drum.ogg
│ │ ├── fingers.mov
│ │ ├── fingers.webm
│ │ ├── large-dark-plate.mp3
│ │ ├── large-dark-plate.ogg
│ │ ├── lucky_dragons_-_power_melody.mp3
│ │ ├── lucky_dragons_-_power_melody.ogg
│ │ ├── mask.png
│ │ ├── moonwalk.jpg
│ │ ├── particle_texture.png
│ │ ├── small-plate.mp3
│ │ └── small-plate.ogg
│ └── example.html
├── examples_src
│ ├── 00_Structure
│ │ ├── 00_Coordinates.js
│ │ ├── 01_Width_and_Height.js
│ │ ├── 02_Setup_and_Draw.js
│ │ ├── 03_No_Loop.js
│ │ ├── 04_Loop.js
│ │ ├── 05_Redraw.js
│ │ ├── 06_Functions.js
│ │ ├── 07_Recursion.js
│ │ └── 08_Create_Graphics.js
│ ├── 01_Form
│ │ ├── 00_Points_and_Lines.js
│ │ ├── 01_Shape_Primitives.js
│ │ ├── 02_Pie_Chart.js
│ │ ├── 03_Regular_Polygon.js
│ │ ├── 04_Star.js
│ │ ├── 05_Triangle_Strip.js
│ │ ├── 06_Bezier.js
│ │ └── 07_3D_Primitives.js
│ ├── 02_Data
│ │ ├── 00_Variables.js
│ │ ├── 01_True_and_False.js
│ │ └── 03_Variable_Scope.js
│ ├── 03_Arrays
│ │ ├── 00_Array.js
│ │ ├── 01_Array_2d.js
│ │ └── 02_Array_Objects.js
│ ├── 04_Control
│ │ ├── 00_Iteration.js
│ │ ├── 01_Embedded_Iteration.js
│ │ ├── 02_Conditionals_1.js
│ │ ├── 03_Conditionals_2.js
│ │ └── 04_Logical_Operators.js
│ ├── 05_Image
│ │ ├── 00_Load_and_Display_Image.js
│ │ ├── 01_Background_Image.js
│ │ ├── 02_Transparency.js
│ │ ├── 03_Alpha_Mask.js
│ │ ├── 04_Create_Image.js
│ │ └── 05_Pointillism.js
│ ├── 07_Color
│ │ ├── 00_Hue.js
│ │ ├── 01_Saturation.js
│ │ ├── 02_Brightness.js
│ │ ├── 03_Color_Variables.js
│ │ ├── 04_Relativity.js
│ │ ├── 05_Linear_Gradient.js
│ │ ├── 06_Radial_Gradient.js
│ │ └── 07_Lerp_Color.js
│ ├── 08_Math
│ │ ├── 00_incrementdecrement.js
│ │ ├── 01_operatorprecedence.js
│ │ ├── 02_distance1d.js
│ │ ├── 03_distance2d.js
│ │ ├── 04_sine.js
│ │ ├── 05_sincosine.js
│ │ ├── 06_sinewave.js
│ │ ├── 07_additivewave.js
│ │ ├── 08_polartocartesian.js
│ │ ├── 11_doubleRandom.js
│ │ ├── 12_random.js
│ │ ├── 13_noise1D.js
│ │ ├── 14_noisewave.js
│ │ └── 15_arctangent.js
│ ├── 09_Simulate
│ │ ├── 01_Forces.js
│ │ ├── 02_ParticleSystem.js
│ │ ├── 03_Flocking.js
│ │ ├── 04_WolframCA.js
│ │ ├── 05_GameOfLife.js
│ │ ├── 06_MultipleParticleSystems.js
│ │ ├── 07_Spirograph.js
│ │ ├── 08_LSystems.js
│ │ ├── 09_Spring.js
│ │ ├── 10_SoftBody.js
│ │ ├── 11_SmokeParticleSystem.js
│ │ └── 12_BrownianMotion.js
│ ├── 10_Interaction
│ │ ├── 10_Tickle.js
│ │ ├── 20_Follow1.js
│ │ ├── 21_Follow2.js
│ │ ├── 22_Follow3.js
│ │ ├── reach1.js
│ │ ├── reach2.js
│ │ └── reach3.js
│ ├── 11_Objects
│ │ ├── 01_Objects.js
│ │ ├── 02_Multiple_Objects.js
│ │ ├── 03_Objects_Array.js
│ │ └── 03_Objects_Optional_Arguments.js
│ ├── 12_Lights
│ │ ├── 02_Directional.js
│ │ └── 05_Mixture.js
│ ├── 15_Instance_Mode
│ │ └── 01_Instantiating.js
│ ├── 16_Dom
│ │ ├── 03_Input_Button.js
│ │ ├── 04_Slider.js
│ │ ├── 07_Modify_DOM.js
│ │ ├── 08_Video.js
│ │ ├── 09_Video_Canvas.js
│ │ ├── 10_Video_Pixels.js
│ │ ├── 11_Capture.js
│ │ └── 12_Drop.js
│ ├── 20_3D
│ │ ├── 00_geometries.js
│ │ ├── 01_sine_cosine_in_3D.js
│ │ ├── 02_multiple_ligthts.js
│ │ ├── 03_materials.js
│ │ ├── 04_textures.js
│ │ └── 07_orbit_control.js
│ ├── 33_Sound
│ │ ├── 00_Load_and_Play_Sound.js
│ │ ├── 01_Preload_Sound.js
│ │ ├── 02_soundFormats.js
│ │ ├── 03_Play_Mode.js
│ │ ├── 04_Pan_SoundFile.js
│ │ ├── 05_Sound_Effect.js
│ │ ├── 06_Manipulate_Sound.js
│ │ ├── 07_Amplitude_Analysis.js
│ │ ├── 08_Noise_Envelope.js
│ │ ├── 09_Note_Envelope.js
│ │ ├── 10_Oscillator_Waveform.js
│ │ ├── 11_Live_Input.js
│ │ ├── 12_FFT_Spectrum.js
│ │ ├── 13_Mic_Threshold.js
│ │ ├── 14_Filter_LowPass.js
│ │ ├── 15_Filter_BandPass.js
│ │ ├── 16_Delay.js
│ │ ├── 17_Reverb.js
│ │ ├── 18_Convolution_Reverb.js
│ │ ├── 19_Record_Save.js
│ │ ├── 21_FreqModulation.js
│ │ └── 22_AmplitudeModulation.js
│ └── 35_Mobile
│ │ ├── 00_acceleration_ballBounce.js
│ │ ├── 01_simpleDraw.js
│ │ ├── 02_accelerationColor.js
│ │ ├── 03_shake_ballBounce.js
│ │ └── 04_tilted_3D_box.js
└── index.php
├── favicon.gif
├── favicon.ico
├── footer.php
├── form
└── index.php
├── functions.php
├── gallery
└── index.php
├── get-started
└── index.php
├── git-pull.php
├── header.php
├── heading.php
├── home
├── collab
│ ├── index.html
│ ├── libraries
│ │ ├── p5.dom.js
│ │ ├── p5.js
│ │ └── p5.sound.js
│ └── rooms
│ │ ├── 1
│ │ ├── index.html
│ │ └── sketch.js
│ │ ├── 2
│ │ ├── index.html
│ │ └── sketch.js
│ │ ├── 3
│ │ ├── chair.jpg
│ │ ├── index.html
│ │ ├── monitor.png
│ │ ├── mytv.jpeg
│ │ └── sketch.js
│ │ ├── 4
│ │ ├── index.html
│ │ ├── sketch.js
│ │ └── sphere.png
│ │ ├── 5
│ │ ├── Garfield_the_Cat.svg.png
│ │ ├── cartoon-cats-7.jpg
│ │ ├── cartoon-tv-4.png
│ │ ├── hover_board_by_timmcfarlin-d4i74ss.png
│ │ ├── index.html
│ │ ├── sketch.js
│ │ ├── small-wood-table-hi.png
│ │ └── summer_hoverboard_by_ask_debbie_starz-d6vexp0.png
│ │ ├── 6
│ │ ├── h.jpg
│ │ ├── index.html
│ │ ├── j.jpg
│ │ └── sketch.js
│ │ ├── 7
│ │ ├── cat.jpg
│ │ ├── index.html
│ │ └── sketch.js
│ │ ├── 8
│ │ ├── 1385136139955.png
│ │ ├── 301A562700000578-3396372-image-a-2_1452635501902.jpg
│ │ ├── NEBRAQJ9jIYYGB_1_a.jpg
│ │ ├── hqdefault.jpg
│ │ ├── index.html
│ │ ├── mothership.jpg
│ │ └── sketch.js
│ │ ├── 9
│ │ ├── index.html
│ │ └── sketch.js
│ │ ├── 10
│ │ ├── index.html
│ │ └── sketch.js
│ │ ├── 11
│ │ ├── index.html
│ │ └── sketch.js
│ │ └── 12
│ │ ├── index.html
│ │ └── sketch.js
├── future_home_sketch
│ ├── index.html
│ ├── libraries
│ │ ├── p5.dom.js
│ │ ├── p5.js
│ │ └── p5.sound.js
│ └── sketch.js
├── imgs
│ ├── ellipse.svg
│ ├── graph.svg
│ ├── line.svg
│ └── rect.svg
├── index.html
└── p5-widget.js
├── img
├── asterisk-01-01.png
├── asterisk-01.png
├── books
│ └── gettingstarted.png
├── cc_88x31.png
├── gallery-images
│ ├── PrismPusher.jpg
│ ├── cell-flight.png
│ ├── emoji-booth.png
│ ├── hardmarubox2D.png
│ ├── hardmaruplanks.png
│ ├── keyboard.png
│ ├── magic-is-real-emoji.png
│ ├── music-viz.png
│ ├── neobrush.png
│ ├── nithi-prasanpanich.png
│ ├── ol-scroll.png
│ ├── organic-motion-sonification.png
│ ├── social-tension.png
│ ├── springs.png
│ └── star-trails.png
├── get-started
│ ├── first-sketch.png
│ ├── first-sketch2.png
│ ├── sublime.png
│ └── sublime2.png
├── learn
│ ├── 3d.jpg
│ ├── dom.jpg
│ ├── lib_placeholder.ai
│ └── lib_placeholder.jpg
├── libraries
│ ├── dom.jpg
│ ├── grafica.jpg
│ ├── p5.bots.jpg
│ ├── p5.geolocation.png
│ ├── p5.gibber.jpg
│ ├── p5.gif.gif
│ ├── p5.particle.png
│ ├── p5.play3.png
│ ├── p5.scribble.png
│ ├── p5.serial.jpg
│ ├── p5.speech.jpg
│ ├── p5collide2d.png
│ ├── rita.png
│ └── sound.jpg
├── p5js-beta.svg
├── p5js.svg
├── search.png
├── test-image-0.jpg
├── test-image-1.jpg
├── thick-asterisk-alone-gray.svg
└── thick-asterisk-alone.svg
├── index.php
├── info
├── imgs
│ ├── first_sketch.png
│ └── getting_started.png
├── index.html
└── style.css
├── js
├── contrib-sketch.js
├── examples.js
├── logo.js
├── main.js
├── plugins.js
├── render.js
├── scroll.js
└── vendor
│ ├── ace-nc
│ ├── ace.js
│ ├── ext-beautify.js
│ ├── ext-chromevox.js
│ ├── ext-elastic_tabstops_lite.js
│ ├── ext-emmet.js
│ ├── ext-error_marker.js
│ ├── ext-keybinding_menu.js
│ ├── ext-language_tools.js
│ ├── ext-linking.js
│ ├── ext-modelist.js
│ ├── ext-old_ie.js
│ ├── ext-searchbox.js
│ ├── ext-settings_menu.js
│ ├── ext-spellcheck.js
│ ├── ext-split.js
│ ├── ext-static_highlight.js
│ ├── ext-statusbar.js
│ ├── ext-textarea.js
│ ├── ext-themelist.js
│ ├── ext-whitespace.js
│ ├── keybinding-emacs.js
│ ├── keybinding-vim.js
│ ├── mode-abap.js
│ ├── mode-actionscript.js
│ ├── mode-ada.js
│ ├── mode-apache_conf.js
│ ├── mode-applescript.js
│ ├── mode-asciidoc.js
│ ├── mode-assembly_x86.js
│ ├── mode-autohotkey.js
│ ├── mode-batchfile.js
│ ├── mode-c9search.js
│ ├── mode-c_cpp.js
│ ├── mode-cirru.js
│ ├── mode-clojure.js
│ ├── mode-cobol.js
│ ├── mode-coffee.js
│ ├── mode-coldfusion.js
│ ├── mode-csharp.js
│ ├── mode-css.js
│ ├── mode-curly.js
│ ├── mode-d.js
│ ├── mode-dart.js
│ ├── mode-diff.js
│ ├── mode-django.js
│ ├── mode-dockerfile.js
│ ├── mode-dot.js
│ ├── mode-ejs.js
│ ├── mode-erlang.js
│ ├── mode-forth.js
│ ├── mode-ftl.js
│ ├── mode-gherkin.js
│ ├── mode-gitignore.js
│ ├── mode-glsl.js
│ ├── mode-golang.js
│ ├── mode-groovy.js
│ ├── mode-haml.js
│ ├── mode-handlebars.js
│ ├── mode-haskell.js
│ ├── mode-haxe.js
│ ├── mode-html.js
│ ├── mode-html_ruby.js
│ ├── mode-ini.js
│ ├── mode-jack.js
│ ├── mode-jade.js
│ ├── mode-java.js
│ ├── mode-javascript.js
│ ├── mode-json.js
│ ├── mode-jsoniq.js
│ ├── mode-jsp.js
│ ├── mode-jsx.js
│ ├── mode-julia.js
│ ├── mode-latex.js
│ ├── mode-less.js
│ ├── mode-liquid.js
│ ├── mode-lisp.js
│ ├── mode-livescript.js
│ ├── mode-logiql.js
│ ├── mode-lsl.js
│ ├── mode-lua.js
│ ├── mode-luapage.js
│ ├── mode-lucene.js
│ ├── mode-makefile.js
│ ├── mode-markdown.js
│ ├── mode-matlab.js
│ ├── mode-mel.js
│ ├── mode-mushcode.js
│ ├── mode-mysql.js
│ ├── mode-nix.js
│ ├── mode-objectivec.js
│ ├── mode-ocaml.js
│ ├── mode-pascal.js
│ ├── mode-perl.js
│ ├── mode-pgsql.js
│ ├── mode-php.js
│ ├── mode-plain_text.js
│ ├── mode-powershell.js
│ ├── mode-prolog.js
│ ├── mode-properties.js
│ ├── mode-protobuf.js
│ ├── mode-python.js
│ ├── mode-r.js
│ ├── mode-rdoc.js
│ ├── mode-rhtml.js
│ ├── mode-ruby.js
│ ├── mode-rust.js
│ ├── mode-sass.js
│ ├── mode-scad.js
│ ├── mode-scala.js
│ ├── mode-scheme.js
│ ├── mode-scss.js
│ ├── mode-sh.js
│ ├── mode-sjs.js
│ ├── mode-smarty.js
│ ├── mode-snippets.js
│ ├── mode-soy_template.js
│ ├── mode-space.js
│ ├── mode-sql.js
│ ├── mode-stylus.js
│ ├── mode-svg.js
│ ├── mode-tcl.js
│ ├── mode-tex.js
│ ├── mode-text.js
│ ├── mode-textile.js
│ ├── mode-toml.js
│ ├── mode-twig.js
│ ├── mode-typescript.js
│ ├── mode-vala.js
│ ├── mode-vbscript.js
│ ├── mode-velocity.js
│ ├── mode-verilog.js
│ ├── mode-vhdl.js
│ ├── mode-xml.js
│ ├── mode-xquery.js
│ ├── mode-yaml.js
│ ├── snippets
│ │ ├── abap.js
│ │ ├── actionscript.js
│ │ ├── ada.js
│ │ ├── apache_conf.js
│ │ ├── applescript.js
│ │ ├── asciidoc.js
│ │ ├── assembly_x86.js
│ │ ├── autohotkey.js
│ │ ├── batchfile.js
│ │ ├── c9search.js
│ │ ├── c_cpp.js
│ │ ├── cirru.js
│ │ ├── clojure.js
│ │ ├── cobol.js
│ │ ├── coffee.js
│ │ ├── coldfusion.js
│ │ ├── csharp.js
│ │ ├── css.js
│ │ ├── curly.js
│ │ ├── d.js
│ │ ├── dart.js
│ │ ├── diff.js
│ │ ├── django.js
│ │ ├── dockerfile.js
│ │ ├── dot.js
│ │ ├── ejs.js
│ │ ├── erlang.js
│ │ ├── forth.js
│ │ ├── ftl.js
│ │ ├── gherkin.js
│ │ ├── gitignore.js
│ │ ├── glsl.js
│ │ ├── golang.js
│ │ ├── groovy.js
│ │ ├── haml.js
│ │ ├── handlebars.js
│ │ ├── haskell.js
│ │ ├── haxe.js
│ │ ├── html.js
│ │ ├── html_ruby.js
│ │ ├── ini.js
│ │ ├── jack.js
│ │ ├── jade.js
│ │ ├── java.js
│ │ ├── javascript.js
│ │ ├── json.js
│ │ ├── jsoniq.js
│ │ ├── jsp.js
│ │ ├── jsx.js
│ │ ├── julia.js
│ │ ├── latex.js
│ │ ├── less.js
│ │ ├── liquid.js
│ │ ├── lisp.js
│ │ ├── livescript.js
│ │ ├── logiql.js
│ │ ├── lsl.js
│ │ ├── lua.js
│ │ ├── luapage.js
│ │ ├── lucene.js
│ │ ├── makefile.js
│ │ ├── markdown.js
│ │ ├── matlab.js
│ │ ├── mel.js
│ │ ├── mushcode.js
│ │ ├── mysql.js
│ │ ├── nix.js
│ │ ├── objectivec.js
│ │ ├── ocaml.js
│ │ ├── pascal.js
│ │ ├── perl.js
│ │ ├── pgsql.js
│ │ ├── php.js
│ │ ├── plain_text.js
│ │ ├── powershell.js
│ │ ├── prolog.js
│ │ ├── properties.js
│ │ ├── protobuf.js
│ │ ├── python.js
│ │ ├── r.js
│ │ ├── rdoc.js
│ │ ├── rhtml.js
│ │ ├── ruby.js
│ │ ├── rust.js
│ │ ├── sass.js
│ │ ├── scad.js
│ │ ├── scala.js
│ │ ├── scheme.js
│ │ ├── scss.js
│ │ ├── sh.js
│ │ ├── sjs.js
│ │ ├── smarty.js
│ │ ├── snippets.js
│ │ ├── soy_template.js
│ │ ├── space.js
│ │ ├── sql.js
│ │ ├── stylus.js
│ │ ├── svg.js
│ │ ├── tcl.js
│ │ ├── tex.js
│ │ ├── text.js
│ │ ├── textile.js
│ │ ├── toml.js
│ │ ├── twig.js
│ │ ├── typescript.js
│ │ ├── vala.js
│ │ ├── vbscript.js
│ │ ├── velocity.js
│ │ ├── verilog.js
│ │ ├── vhdl.js
│ │ ├── xml.js
│ │ ├── xquery.js
│ │ └── yaml.js
│ ├── theme-ambiance.js
│ ├── theme-chaos.js
│ ├── theme-chrome.js
│ ├── theme-clouds.js
│ ├── theme-clouds_midnight.js
│ ├── theme-cobalt.js
│ ├── theme-crimson_editor.js
│ ├── theme-dawn.js
│ ├── theme-dreamweaver.js
│ ├── theme-eclipse.js
│ ├── theme-github.js
│ ├── theme-idle_fingers.js
│ ├── theme-katzenmilch.js
│ ├── theme-kr.js
│ ├── theme-kuroir.js
│ ├── theme-merbivore.js
│ ├── theme-merbivore_soft.js
│ ├── theme-mono_industrial.js
│ ├── theme-monokai.js
│ ├── theme-pastel_on_dark.js
│ ├── theme-solarized_dark.js
│ ├── theme-solarized_light.js
│ ├── theme-terminal.js
│ ├── theme-textmate.js
│ ├── theme-tomorrow.js
│ ├── theme-tomorrow_night.js
│ ├── theme-tomorrow_night_blue.js
│ ├── theme-tomorrow_night_bright.js
│ ├── theme-tomorrow_night_eighties.js
│ ├── theme-twilight.js
│ ├── theme-vibrant_ink.js
│ ├── theme-xcode.js
│ ├── worker-coffee.js
│ ├── worker-css.js
│ ├── worker-html.js
│ ├── worker-javascript.js
│ ├── worker-json.js
│ ├── worker-lua.js
│ ├── worker-php.js
│ └── worker-xquery.js
│ ├── ace
│ ├── ace.js
│ ├── mode-javascript.js
│ └── worker-javascript.js
│ ├── jquery-1.9.1.min.js
│ ├── jquery.columnizer.js
│ ├── modernizr-2.6.2.min.js
│ ├── prism.js
│ └── throbber.min.js
├── libraries
└── index.php
├── offline-reference
├── build-ref.php
└── extra
│ ├── css
│ └── main.css
│ ├── img
│ ├── p5js-beta.svg
│ └── thick-asterisk-alone.svg
│ ├── index.html
│ └── js
│ ├── reference.js
│ └── render.js
├── p5-tests
├── array.json
├── csv.csv
├── object.json
└── sentences.txt
├── p5_featured
├── 15May_AV
│ ├── image
│ │ ├── droplet.png
│ │ └── logo.png
│ ├── index.html
│ ├── samples
│ │ ├── keyReturn.wav
│ │ ├── keySpace.wav
│ │ ├── keyStroke.wav
│ │ ├── rain01.wav
│ │ ├── rain02.wav
│ │ ├── rain03.wav
│ │ ├── rain04.wav
│ │ └── rain05.wav
│ └── src
│ │ ├── Player.js
│ │ ├── Player02.js
│ │ ├── Splash.js
│ │ ├── SplashSystem.js
│ │ ├── Tone.js
│ │ ├── Visualizer.js
│ │ ├── p5.dom.js
│ │ └── p5.js
├── ChirsMill_AuroraII
│ ├── AuroraII-p5front.js
│ └── index.html
├── Christine_Social_June
│ ├── Bob.js
│ ├── BobSystem.js
│ ├── equations.js
│ ├── index.html
│ ├── p5.dom.js
│ ├── p5.min.js
│ └── sketch.js
├── HarverMoon_Perlin
│ ├── index.html
│ ├── p5.js
│ └── sketch.js
├── LeslieRuckman_RainbowPixelGrow
│ ├── index.html
│ ├── libraries
│ │ └── p5.js
│ └── sketch.js
├── Sarah_voronoi
│ ├── index.html
│ ├── lib
│ │ ├── p5.js
│ │ └── p5.min.js
│ └── sgp_background_sketch.js
├── emily_xie_connections
│ ├── index.html
│ ├── p5.js
│ └── sketch.js
├── fengyizhu_points
│ ├── index.html
│ ├── p5.dom.js
│ ├── p5.js
│ ├── p5.sound.js
│ └── sketch.js
├── kevin_3d
│ ├── index.html
│ ├── p5.js
│ └── sketch.js
├── kylemcdonald_magnify
│ ├── index.html
│ └── sketch.js
├── love1
│ ├── index.html
│ ├── p5.js
│ └── sketch.js
├── matthew_kaney_teatime
│ ├── crockery_pot.obj
│ ├── index.html
│ ├── koffie.obj
│ ├── p5.min.js
│ ├── sketch.js
│ └── teapot.obj
└── paom
│ ├── gifs
│ ├── processing01.gif
│ ├── processing02.gif
│ ├── processing03.gif
│ ├── processing04.gif
│ ├── processing05.gif
│ └── processing06.gif
│ ├── index.html
│ ├── p5.dom.js
│ └── p5.min.js
├── reference
├── api.js
├── assets
│ ├── Avenir.otf
│ ├── AvenirNextLTPro-Demi.otf
│ ├── Bold.ttf
│ ├── Damscray_-_Dancing_Tiger_01.mp3
│ ├── Damscray_-_Dancing_Tiger_01.ogg
│ ├── Damscray_-_Dancing_Tiger_02.mp3
│ ├── Damscray_-_Dancing_Tiger_02.ogg
│ ├── Damscray_DancingTiger.mp3
│ ├── Damscray_DancingTiger.ogg
│ ├── Italic.ttf
│ ├── Regular.otf
│ ├── beat.mp3
│ ├── beat.ogg
│ ├── beatbox.mp3
│ ├── beatbox.ogg
│ ├── bricks.jpg
│ ├── bricks_third.jpg
│ ├── bx-spring.mp3
│ ├── bx-spring.ogg
│ ├── concrete-tunnel.mp3
│ ├── concrete-tunnel.ogg
│ ├── css
│ │ ├── external-small.png
│ │ ├── logo.png
│ │ └── main.css
│ ├── doorbell.mp3
│ ├── doorbell.ogg
│ ├── drum.mp3
│ ├── drum.ogg
│ ├── favicon.png
│ ├── fingers.mov
│ ├── img
│ │ └── spinner.gif
│ ├── index.html
│ ├── js
│ │ ├── api-filter.js
│ │ ├── api-list.js
│ │ ├── api-search.js
│ │ ├── apidocs.js
│ │ ├── reference.js
│ │ ├── reference.js.map
│ │ ├── require.min.js
│ │ └── yui-prettify.js
│ ├── laDefense.jpg
│ ├── large-dark-plate.mp3
│ ├── large-dark-plate.ogg
│ ├── lucky_dragons_-_power_melody.mp3
│ ├── lucky_dragons_-_power_melody.ogg
│ ├── mammals.csv
│ ├── mammals.xml
│ ├── mask.png
│ ├── mask2.png
│ ├── moonwalk.jpg
│ ├── reference.css
│ ├── rockies.jpg
│ ├── small-plate.mp3
│ ├── small-plate.ogg
│ ├── studio-b.mp3
│ ├── studio-b.ogg
│ ├── teapot.obj
│ ├── test.txt
│ └── vendor
│ │ └── prettify
│ │ ├── CHANGES.html
│ │ ├── COPYING
│ │ ├── README.html
│ │ ├── prettify-min.css
│ │ └── prettify-min.js
├── classes
│ ├── p5.Amplitude.html
│ ├── p5.AudioIn.html
│ ├── p5.Color.html
│ ├── p5.Convolver.html
│ ├── p5.Delay.html
│ ├── p5.Element.html
│ ├── p5.Env.html
│ ├── p5.FFT.html
│ ├── p5.File.html
│ ├── p5.Filter.html
│ ├── p5.Font.html
│ ├── p5.Gain.html
│ ├── p5.Graphics.html
│ ├── p5.Image.html
│ ├── p5.MediaElement.html
│ ├── p5.Noise.html
│ ├── p5.Oscillator.html
│ ├── p5.Part.html
│ ├── p5.PeakDetect.html
│ ├── p5.Phrase.html
│ ├── p5.Pulse.html
│ ├── p5.Renderer.html
│ ├── p5.RendererGL.html
│ ├── p5.Reverb.html
│ ├── p5.Score.html
│ ├── p5.Signal.html
│ ├── p5.SoundFile.html
│ ├── p5.SoundRecorder.html
│ ├── p5.Table.html
│ ├── p5.TableRow.html
│ ├── p5.Vector.html
│ ├── p5.XML.html
│ ├── p5.dom.html
│ ├── p5.html
│ └── p5.sound.html
├── data.json
├── data.min.json
├── files
│ ├── lib_addons_p5.dom.js.html
│ ├── lib_addons_p5.sound.js.html
│ ├── src_app.js.html
│ ├── src_color_color_conversion.js.html
│ ├── src_color_creating_reading.js.html
│ ├── src_color_p5.Color.js.html
│ ├── src_color_setting.js.html
│ ├── src_core_2d_primitives.js.html
│ ├── src_core_attributes.js.html
│ ├── src_core_canvas.js.html
│ ├── src_core_constants.js.html
│ ├── src_core_core.js.html
│ ├── src_core_curves.js.html
│ ├── src_core_environment.js.html
│ ├── src_core_error_helpers.js.html
│ ├── src_core_p5.Element.js.html
│ ├── src_core_p5.Graphics.js.html
│ ├── src_core_p5.Renderer.js.html
│ ├── src_core_p5.Renderer2D.js.html
│ ├── src_core_rendering.js.html
│ ├── src_core_shim.js.html
│ ├── src_core_structure.js.html
│ ├── src_core_transform.js.html
│ ├── src_core_vertex.js.html
│ ├── src_events_acceleration.js.html
│ ├── src_events_keyboard.js.html
│ ├── src_events_mouse.js.html
│ ├── src_events_touch.js.html
│ ├── src_image_filters.js.html
│ ├── src_image_image.js.html
│ ├── src_image_loading_displaying.js.html
│ ├── src_image_p5.Image.js.html
│ ├── src_image_pixels.js.html
│ ├── src_io_files.js.html
│ ├── src_io_p5.Table.js.html
│ ├── src_io_p5.TableRow.js.html
│ ├── src_io_p5.XML.js.html
│ ├── src_math_calculation.js.html
│ ├── src_math_math.js.html
│ ├── src_math_noise.js.html
│ ├── src_math_p5.Vector.js.html
│ ├── src_math_random.js.html
│ ├── src_math_trigonometry.js.html
│ ├── src_typography_attributes.js.html
│ ├── src_typography_loading_displaying.js.html
│ ├── src_typography_p5.Font.js.html
│ ├── src_utilities_array_functions.js.html
│ ├── src_utilities_conversion.js.html
│ ├── src_utilities_string_functions.js.html
│ ├── src_utilities_time_date.js.html
│ ├── src_webgl_camera.js.html
│ ├── src_webgl_light.js.html
│ ├── src_webgl_loading.js.html
│ ├── src_webgl_material.js.html
│ ├── src_webgl_p5.Geometry.js.html
│ ├── src_webgl_p5.Matrix.js.html
│ ├── src_webgl_p5.RendererGL.Immediate.js.html
│ ├── src_webgl_p5.RendererGL.Retained.js.html
│ ├── src_webgl_p5.RendererGL.js.html
│ └── src_webgl_primitives.js.html
├── index.html
└── modules
│ ├── 2D Primitives.html
│ ├── 3D Models.html
│ ├── 3D Primitives.html
│ ├── Acceleration.html
│ ├── Array Functions.html
│ ├── Attributes.html
│ ├── Calculation.html
│ ├── Camera.html
│ ├── Color.html
│ ├── Constants.html
│ ├── Conversion.html
│ ├── Creating & Reading.html
│ ├── Curves.html
│ ├── DOM.html
│ ├── Data.html
│ ├── Environment.html
│ ├── Events.html
│ ├── Font.html
│ ├── IO.html
│ ├── Input.html
│ ├── Keyboard.html
│ ├── Lights, Camera.html
│ ├── Lights.html
│ ├── Loading & Displaying.html
│ ├── Material.html
│ ├── Math.html
│ ├── Mouse.html
│ ├── Noise.html
│ ├── Output.html
│ ├── Pixels.html
│ ├── Random.html
│ ├── Rendering.html
│ ├── Setting.html
│ ├── String Functions.html
│ ├── Structure.html
│ ├── Table.html
│ ├── Time & Date.html
│ ├── Touch.html
│ ├── Transform.html
│ ├── Trigonometry.html
│ ├── Typography.html
│ ├── Vertex.html
│ ├── XML.html
│ ├── image.html
│ ├── p5.dom.html
│ ├── p5.sound.html
│ └── shape.html
├── setup.sh
├── sidebar-minimal.php
├── sidebar.php
├── test
├── embed.html
└── p5.min.js
├── tutorials
├── debugging
│ ├── assets
│ │ ├── 0-0.jpg
│ │ ├── 0-1.jpg
│ │ ├── 0-2.jpg
│ │ ├── 0-3.jpg
│ │ ├── 0-4.jpg
│ │ ├── 0-5.jpg
│ │ ├── 0-5.png
│ │ ├── 0-6.jpg
│ │ ├── 1-0.jpg
│ │ ├── 1-1.png
│ │ ├── 2-1.png
│ │ ├── 2-2.png
│ │ ├── 2-3.jpg
│ │ ├── 3-1.png
│ │ ├── 3-2.png
│ │ ├── 3-3.jpg
│ │ ├── 3-4.png
│ │ ├── 3-5.jpg
│ │ ├── 4-1.png
│ │ ├── 4-2.png
│ │ ├── 4-3.png
│ │ ├── 5-1.jpg
│ │ ├── 5-2.jpg
│ │ ├── 6-1.png
│ │ ├── 6-2.png
│ │ ├── 6-3.jpg
│ │ ├── 7-1.jpg
│ │ ├── 8-0.jpg
│ │ ├── 9-1.jpg
│ │ └── x-1.jpg
│ └── index.php
├── index.php
├── interactivity
│ ├── assets
│ │ ├── and.js
│ │ ├── coded_keys.js
│ │ ├── corners.js
│ │ ├── cursor_1.js
│ │ ├── cursor_2.js
│ │ ├── cursor_3.js
│ │ ├── draw_t.js
│ │ ├── draw_t_2.js
│ │ ├── event_1.js
│ │ ├── event_2.js
│ │ ├── index.html
│ │ ├── invert_mouse.js
│ │ ├── key_1.js
│ │ ├── key_2.js
│ │ ├── key_code_1.js
│ │ ├── key_code_2.js
│ │ ├── key_eq_a.js
│ │ ├── key_var.js
│ │ ├── mouse_1.js
│ │ ├── mouse_2.js
│ │ ├── mouse_3.js
│ │ ├── mouse_boxes.js
│ │ ├── mouse_pressed.js
│ │ ├── mouse_released.js
│ │ ├── moved_dragged.js
│ │ ├── pressed_1.js
│ │ ├── pressed_2.js
│ │ ├── pressed_3.js
│ │ ├── prev_mouse.js
│ │ ├── region_1.js
│ │ └── region_2.js
│ ├── index.php
│ └── index1.html
├── performance
│ ├── code
│ │ ├── cache-dom-lookups
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ │ ├── cpu-profiler-demo
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ │ ├── distance-squared
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ │ ├── fps-demo
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ │ ├── friendly-error-system
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ │ ├── native-vs-p5
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ │ ├── p5
│ │ │ ├── addons
│ │ │ │ ├── p5.dom.js
│ │ │ │ ├── p5.dom.min.js
│ │ │ │ ├── p5.sound.js
│ │ │ │ └── p5.sound.min.js
│ │ │ ├── p5.js
│ │ │ └── p5.min.js
│ │ ├── platforms-test
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ │ ├── reflow-dom-manipulation
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ │ └── resizing-images
│ │ │ ├── blackberry-original.jpg
│ │ │ ├── blackberry-tiny-sharpened.jpg
│ │ │ ├── floral-original.jpg
│ │ │ ├── floral-tiny-sharpened.jpg
│ │ │ ├── index.html
│ │ │ └── sketch.js
│ └── images
│ │ ├── chrome-cpu-flame.gif
│ │ ├── chrome-cpu-profile.jpg
│ │ ├── chrome-fps.jpg
│ │ ├── chrome-show-fps.gif
│ │ ├── drastic-resizing-comparison.png
│ │ ├── editor-show-fps.gif
│ │ ├── resizing-comparison.png
│ │ └── timeline.png
└── trigonometry
│ ├── assets
│ ├── images
│ │ ├── hypotenuse.jpg
│ │ ├── polar.jpg
│ │ ├── pythagoras.jpg
│ │ ├── pythagoras1.jpg
│ │ ├── screen_coordinates.jpg
│ │ └── sohcahtoa.jpg
│ ├── sincoscurves
│ │ ├── embed.html
│ │ ├── embed1.html
│ │ └── sin_curve.js
│ └── unitCircle
│ │ ├── embed.html
│ │ └── sketch.js
│ └── index.php
└── updated.php
/.gitignore:
--------------------------------------------------------------------------------
1 | *.DS_Store
2 | *node_modules*
3 | npm-debug.log
4 | src/*
5 | download/version.php
6 | js/p5.*
7 | offline-reference/copy/*
8 | offline-reference/*.zip
9 | offline-reference/p5-reference/*
--------------------------------------------------------------------------------
/404.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | p5.dom library
7 | * for this example to work in your own project.
8 | */
9 |
10 | // A HTML range slider
11 | var slider;
12 |
13 | function setup() {
14 | createCanvas(720, 400);
15 | // hue, saturation, and brightness
16 | colorMode(HSB, 255);
17 | // slider has a range between 0 and 255 with a starting value of 127
18 | slider = createSlider(0, 255, 127);
19 | }
20 |
21 | function draw() {
22 | background(127);
23 | strokeWeight(2);
24 |
25 | // Set the hue according to the slider
26 | stroke(slider.value(), 255, 255);
27 | fill(slider.value(), 255, 255, 127);
28 | ellipse(360, 200, 200, 200);
29 | }
--------------------------------------------------------------------------------
/examples/demos_src/01_Hello_P5/04_animate.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Animation
3 | * @description The circle moves.
4 | */
5 | // Where is the circle
6 | var x, y;
7 |
8 | function setup() {
9 | createCanvas(720, 400);
10 | // Starts in the middle
11 | x = width / 2;
12 | y = height;
13 | }
14 |
15 | function draw() {
16 | background(200);
17 |
18 | // Draw a circle
19 | stroke(50);
20 | fill(100);
21 | ellipse(x, y, 24, 24);
22 |
23 | // Jiggling randomly on the horizontal axis
24 | x = x + random(-1, 1);
25 | // Moving up at a constant speed
26 | y = y - 1;
27 |
28 | // Reset to the bottom
29 | if (y < 0) {
30 | y = height;
31 | }
32 | }
33 |
34 |
--------------------------------------------------------------------------------
/examples/examples/assets/360video_256crop_v2.mp4:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/360video_256crop_v2.mp4
--------------------------------------------------------------------------------
/examples/examples/assets/Damscray_-_Dancing_Tiger_01.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/Damscray_-_Dancing_Tiger_01.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/Damscray_-_Dancing_Tiger_01.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/Damscray_-_Dancing_Tiger_01.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/Damscray_-_Dancing_Tiger_02.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/Damscray_-_Dancing_Tiger_02.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/Damscray_-_Dancing_Tiger_02.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/Damscray_-_Dancing_Tiger_02.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/Damscray_DancingTiger.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/Damscray_DancingTiger.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/Damscray_DancingTiger.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/Damscray_DancingTiger.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/LeagueGothic-Regular.otf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/LeagueGothic-Regular.otf
--------------------------------------------------------------------------------
/examples/examples/assets/beat.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/beat.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/beat.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/beat.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/beatbox.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/beatbox.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/beatbox.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/beatbox.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/bx-spring.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/bx-spring.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/bx-spring.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/bx-spring.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/cat.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/cat.jpg
--------------------------------------------------------------------------------
/examples/examples/assets/concrete-tunnel.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/concrete-tunnel.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/concrete-tunnel.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/concrete-tunnel.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/doorbell.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/doorbell.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/doorbell.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/doorbell.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/drum.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/drum.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/drum.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/drum.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/fingers.mov:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/fingers.mov
--------------------------------------------------------------------------------
/examples/examples/assets/fingers.webm:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/fingers.webm
--------------------------------------------------------------------------------
/examples/examples/assets/large-dark-plate.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/large-dark-plate.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/large-dark-plate.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/large-dark-plate.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/lucky_dragons_-_power_melody.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/lucky_dragons_-_power_melody.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/lucky_dragons_-_power_melody.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/lucky_dragons_-_power_melody.ogg
--------------------------------------------------------------------------------
/examples/examples/assets/mask.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/mask.png
--------------------------------------------------------------------------------
/examples/examples/assets/moonwalk.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/moonwalk.jpg
--------------------------------------------------------------------------------
/examples/examples/assets/particle_texture.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/particle_texture.png
--------------------------------------------------------------------------------
/examples/examples/assets/small-plate.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/small-plate.mp3
--------------------------------------------------------------------------------
/examples/examples/assets/small-plate.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/examples/examples/assets/small-plate.ogg
--------------------------------------------------------------------------------
/examples/examples/example.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/examples/examples_src/00_Structure/01_Width_and_Height.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Width and Height
3 | * @description The 'width' and 'height' variables contain the
4 | * width and height of the display window as defined in the createCanvas()
5 | * function.
6 | */
7 | function setup() {
8 | createCanvas(720, 400);
9 | }
10 |
11 | function draw() {
12 | background(127);
13 | noStroke();
14 | for (var i = 0; i < height; i += 20) {
15 | fill(129, 206, 15);
16 | rect(0, i, width, 10);
17 | fill(255);
18 | rect(i, 0, 10, height);
19 | }
20 | }
--------------------------------------------------------------------------------
/examples/examples_src/00_Structure/02_Setup_and_Draw.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Setup and Draw
3 | * @description The code inside the draw() function runs continuously from top
4 | * to bottom until the program is stopped.
5 | */
6 | var y = 100;
7 |
8 | // The statements in the setup() function
9 | // execute once when the program begins
10 | function setup() {
11 | // createCanvas must be the first statement
12 | createCanvas(720, 400);
13 | stroke(255); // Set line drawing color to white
14 | frameRate(30);
15 | }
16 | // The statements in draw() are executed until the
17 | // program is stopped. Each statement is executed in
18 | // sequence and after the last line is read, the first
19 | // line is executed again.
20 | function draw() {
21 | background(0); // Set the background to black
22 | y = y - 1;
23 | if (y < 0) {
24 | y = height;
25 | }
26 | line(0, y, width, y);
27 | }
--------------------------------------------------------------------------------
/examples/examples_src/00_Structure/03_No_Loop.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name No Loop
3 | * @description The noLoop() function causes draw() to only execute once.
4 | * Without calling noLoop(), the code inside draw() is run continually.
5 | */
6 | var y;
7 |
8 | // The statements in the setup() function
9 | // execute once when the program begins
10 | function setup()
11 | {
12 | // createCanvas should be the first statement
13 | createCanvas(720, 400);
14 | stroke(255); // Set line drawing color to white
15 | noLoop();
16 |
17 | y = height * 0.5;
18 | }
19 |
20 | // The statements in draw() are executed until the
21 | // program is stopped. Each statement is executed in
22 | // sequence and after the last line is read, the first
23 | // line is executed again.
24 | function draw()
25 | {
26 | background(0); // Set the background to black
27 | y = y - 1;
28 | if (y < 0) { y = height; }
29 | line(0, y, width, y);
30 | }
31 |
--------------------------------------------------------------------------------
/examples/examples_src/00_Structure/04_Loop.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Loop
3 | * @description The code inside the draw() function runs continuously from top
4 | * to bottom until the program is stopped.
5 | */
6 | var y = 100;
7 |
8 | // The statements in the setup() function
9 | // execute once when the program begins
10 | function setup() {
11 | createCanvas(720, 400); // Size must be the first statement
12 | stroke(255); // Set line drawing color to white
13 | frameRate(30);
14 | }
15 | // The statements in draw() are executed until the
16 | // program is stopped. Each statement is executed in
17 | // sequence and after the last line is read, the first
18 | // line is executed again.
19 | function draw() {
20 | background(0); // Set the background to black
21 | y = y - 1;
22 | if (y < 0) {
23 | y = height;
24 | }
25 | line(0, y, width, y);
26 | }
--------------------------------------------------------------------------------
/examples/examples_src/00_Structure/05_Redraw.js:
--------------------------------------------------------------------------------
1 | /*
2 | *@name Redraw
3 | *@description The redraw() function makes draw() execute once. In this example,
4 | *draw() is executed once every time the mouse is clicked.
5 | */
6 |
7 | var y;
8 |
9 | // The statements in the setup() function
10 | // execute once when the program begins
11 | function setup() {
12 | createCanvas(720, 400);
13 | stroke(255);
14 | noLoop();
15 | y = height * 0.5;
16 | }
17 |
18 | // The statements in draw() are executed until the
19 | // program is stopped. Each statement is executed in
20 | // sequence and after the last line is read, the first
21 | // line is executed again.
22 | function draw() {
23 | background(0);
24 | y = y - 4;
25 | if (y < 0) {
26 | y = height;
27 | }
28 | line(0, y, width, y);
29 | }
30 |
31 | function mousePressed() {
32 | redraw();
33 | }
--------------------------------------------------------------------------------
/examples/examples_src/00_Structure/06_Functions.js:
--------------------------------------------------------------------------------
1 | /*
2 | *@name Functions
3 | *@description The drawTarget() function makes it easy to draw many distinct
4 | *targets. Each call to drawTarget() specifies the position, size, and number of
5 | *rings for each target.
6 | */
7 |
8 | function setup() {
9 | createCanvas(720, 400);
10 | background(51);
11 | noStroke();
12 | noLoop();
13 | }
14 |
15 | function draw() {
16 | drawTarget(width*0.25, height*0.4, 200, 4);
17 | drawTarget(width*0.5, height*0.5, 300, 10);
18 | drawTarget(width*0.75, height*0.3, 120, 6);
19 | }
20 |
21 | function drawTarget(xloc, yloc, size, num) {
22 | grayvalues = 255/num;
23 | steps = size/num;
24 | for (i = 0; i < num; i++) {
25 | fill(i*grayvalues);
26 | ellipse(xloc, yloc, size - i*steps, size - i*steps);
27 | }
28 | }
--------------------------------------------------------------------------------
/examples/examples_src/00_Structure/07_Recursion.js:
--------------------------------------------------------------------------------
1 | /*
2 | *@name Recursion
3 | *@description A demonstration of recursion, which means functions call themselves.
4 | * Notice how the drawCircle() function calls itself at the end of its block.
5 | * It continues to do this until the variable "level" is equal to 1.
6 | */
7 |
8 | function setup() {
9 | createCanvas(720, 400);
10 | noStroke();
11 | noLoop();
12 | }
13 |
14 | function draw() {
15 | drawCircle(width/2, 280, 6);
16 | }
17 |
18 | function drawCircle(x, radius, level) {
19 | var tt = 126 * level/4.0;
20 | fill(tt);
21 | ellipse(x, height/2, radius*2, radius*2);
22 | if(level > 1) {
23 | level = level - 1;
24 | drawCircle(x - radius/2, radius/2, level);
25 | drawCircle(x + radius/2, radius/2, level);
26 | }
27 | }
--------------------------------------------------------------------------------
/examples/examples_src/00_Structure/08_Create_Graphics.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Create Graphics
3 | * @description Creates and returns a new p5.Renderer object. Use this
4 | * class if you need to draw into an off-screen graphics buffer. The two parameters
5 | * define the width and height in pixels.
6 | */
7 |
8 | var pg;
9 |
10 | function setup(){
11 | createCanvas(710, 400);
12 | pg = createGraphics(400, 250);
13 | }
14 |
15 | function draw(){
16 | fill(0, 12);
17 | rect(0, 0, width, height);
18 | fill(255);
19 | noStroke();
20 | ellipse(mouseX, mouseY, 60, 60);
21 |
22 | pg.background(51);
23 | pg.noFill();
24 | pg.stroke(255);
25 | pg.ellipse(mouseX-150, mouseY-75, 60, 60);
26 |
27 | //Draw the offscreen buffer to the screen with image()
28 | image(pg, 150, 75);
29 | }
--------------------------------------------------------------------------------
/examples/examples_src/01_Form/00_Points_and_Lines.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Points and Lines
3 | * @description Points and lines can be used to draw basic geometry.
4 | * Change the value of the variable 'd' to scale the form. The four
5 | * variables set the positions based on the value of 'd'.
6 | */
7 | function setup() {
8 |
9 | var d = 70;
10 | var p1 = d;
11 | var p2 = p1+d;
12 | var p3 = p2+d;
13 | var p4 = p3+d;
14 |
15 | // Sets the screen to be 720 pixels wide and 400 pixels high
16 | createCanvas(720, 400);
17 | background(0);
18 | noSmooth();
19 |
20 | translate(140, 0);
21 |
22 | // Draw gray box
23 | stroke(153);
24 | line(p3, p3, p2, p3);
25 | line(p2, p3, p2, p2);
26 | line(p2, p2, p3, p2);
27 | line(p3, p2, p3, p3);
28 |
29 | // Draw white points
30 | stroke(255);
31 | point(p1, p1);
32 | point(p1, p3);
33 | point(p2, p4);
34 | point(p3, p1);
35 | point(p4, p2);
36 | point(p4, p4);
37 | }
--------------------------------------------------------------------------------
/examples/examples_src/01_Form/01_Shape_Primitives.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Shape Primitives
3 | * @description The basic shape primitive functions are triangle(),
4 | * rect(), quad(), ellipse(), and arc(). Squares are made with rect()
5 | * and circles are made with ellipse(). Each of these functions requires
6 | * a number of parameters to determine the shape's position and size.
7 | */
8 | function setup() {
9 |
10 | // Sets the screen to be 720 pixels wide and 400 pixels high
11 | createCanvas(720, 400);
12 | background(0);
13 | noStroke();
14 |
15 | fill(204);
16 | triangle(18, 18, 18, 360, 81, 360);
17 |
18 | fill(102);
19 | rect(81, 81, 63, 63);
20 |
21 | fill(204);
22 | quad(189, 18, 216, 18, 216, 360, 144, 360);
23 |
24 | fill(255);
25 | ellipse(252, 144, 72, 72);
26 |
27 | fill(204);
28 | triangle(288, 18, 351, 360, 288, 360);
29 |
30 | fill(255);
31 | arc(479, 300, 280, 280, PI, TWO_PI);
32 | }
--------------------------------------------------------------------------------
/examples/examples_src/01_Form/02_Pie_Chart.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Pie Chart
3 | * @description Uses the arc() function to generate a pie chart from the data
4 | * stored in an array.
5 | */
6 | var angles = [ 30, 10, 45, 35, 60, 38, 75, 67 ];
7 |
8 | function setup() {
9 | createCanvas(720, 400);
10 | noStroke();
11 | noLoop(); // Run once and stop
12 | }
13 |
14 | function draw() {
15 | background(100);
16 | pieChart(300, angles);
17 | }
18 |
19 | function pieChart(diameter, data) {
20 | var lastAngle = 0;
21 | for (var i = 0; i < data.length; i++) {
22 | var gray = map(i, 0, data.length, 0, 255);
23 | fill(gray);
24 | arc(width/2, height/2, diameter, diameter, lastAngle, lastAngle+radians(angles[i]));
25 | lastAngle += radians(angles[i]);
26 | }
27 | }
--------------------------------------------------------------------------------
/examples/examples_src/01_Form/06_Bezier.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Bezier
3 | * @description The first two parameters for the bezier() function specify the
4 | * first point in the curve and the last two parameters specify the last point.
5 | * The middle parameters set the control points that define the shape of the
6 | * curve.
7 | */
8 | function setup() {
9 | createCanvas(720, 400);
10 | stroke(255);
11 | noFill();
12 | }
13 |
14 | function draw() {
15 | background(0);
16 | for (var i = 0; i < 200; i += 20) {
17 | bezier(mouseX-(i/2.0), 40+i, 410, 20, 440, 300, 240-(i/16.0), 300+(i/8.0));
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/examples/examples_src/01_Form/07_3D_Primitives.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name 3D Primitives
3 | * @frame 720,400 (optional)
4 | * @description Placing mathematically 3D objects in synthetic space.
5 | * The box() and sphere() functions take at least one parameter to specify their
6 | * size. These shapes are positioned using the translate() function.
7 | */
8 | function setup() {
9 | createCanvas(710, 400, WEBGL);
10 | }
11 |
12 | function draw() {
13 | background(100);
14 | noStroke();
15 |
16 | push();
17 | translate(-300, 200);
18 | rotateY(1.25);
19 | rotateX(-0.9);
20 | box(100);
21 | pop();
22 |
23 | noFill();
24 | stroke(255);
25 | push();
26 | translate(500, height*0.35, -200);
27 | sphere(300);
28 | pop();
29 | }
--------------------------------------------------------------------------------
/examples/examples_src/02_Data/00_Variables.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Variables
3 | * @description Variables are used for storing values. In this example, change
4 | * the values of variables to affect the composition.
5 | */
6 | function setup() {
7 |
8 | createCanvas(720, 400);
9 | background(0);
10 | stroke(153);
11 | strokeWeight(4);
12 | strokeCap(SQUARE);
13 |
14 | var a = 50;
15 | var b = 120;
16 | var c = 180;
17 |
18 | line(a, b, a+c, b);
19 | line(a, b+10, a+c, b+10);
20 | line(a, b+20, a+c, b+20);
21 | line(a, b+30, a+c, b+30);
22 |
23 | a = a + c;
24 | b = height-b;
25 |
26 | line(a, b, a+c, b);
27 | line(a, b+10, a+c, b+10);
28 | line(a, b+20, a+c, b+20);
29 | line(a, b+30, a+c, b+30);
30 |
31 | a = a + c;
32 | b = height-b;
33 |
34 | line(a, b, a+c, b);
35 | line(a, b+10, a+c, b+10);
36 | line(a, b+20, a+c, b+20);
37 | line(a, b+30, a+c, b+30);
38 | }
--------------------------------------------------------------------------------
/examples/examples_src/02_Data/01_True_and_False.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name True and False
3 | * @description A Boolean variable has only two possible values: true or false.
4 | * It is common to use Booleans with control statements to determine the flow
5 | * of a program. In this example, when the boolean value "x" is true, vertical
6 | * black lines are drawn and when the boolean value "x" is false, horizontal
7 | * gray lines are drawn.
8 | */
9 | function setup() {
10 |
11 | createCanvas(720, 400);
12 | background(0);
13 | stroke(255);
14 |
15 | var b = false;
16 | var d = 20;
17 | var middle = width/2;;
18 |
19 | for (var i = d; i <= width; i += d) {
20 |
21 | if (i < middle) {
22 | b = true;
23 | } else {
24 | b = false;
25 | }
26 |
27 | if (b == true) {
28 | // Vertical line
29 | line(i, d, i, height-d);
30 | }
31 |
32 | if (b == false) {
33 | // Horizontal line
34 | line(middle, i - middle + d, width-d, i - middle + d);
35 | }
36 | }
37 | }
--------------------------------------------------------------------------------
/examples/examples_src/04_Control/00_Iteration.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Iteration
3 | * @description Iteration with a "for" structure to construct repetitive forms.
4 | */
5 | var y;
6 | var num = 14;
7 |
8 | function setup() {
9 |
10 | createCanvas(720, 360);
11 | background(102);
12 | noStroke();
13 |
14 | // Draw white bars
15 | fill(255);
16 | y = 60;
17 | for(var i = 0; i < num/3; i++) {
18 | rect(50, y, 475, 10);
19 | y+=20;
20 | }
21 |
22 | // Gray bars
23 | fill(51);
24 | y = 40;
25 | for(var i = 0; i < num; i++) {
26 | rect(405, y, 30, 10);
27 | y += 20;
28 | }
29 | y = 50;
30 | for(var i = 0; i < num; i++) {
31 | rect(425, y, 30, 10);
32 | y += 20;
33 | }
34 |
35 | // Thin lines
36 | y = 45;
37 | fill(0);
38 | for(var i = 0; i < num-1; i++) {
39 | rect(120, y, 40, 1);
40 | y+= 20;
41 | }
42 | }
--------------------------------------------------------------------------------
/examples/examples_src/04_Control/01_Embedded_Iteration.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Embedded Iteration
3 | * @description Embedding "for" structures allows repetition in two dimensions.
4 | */
5 | function setup() {
6 |
7 | createCanvas(720, 360);
8 | background(0);
9 | noStroke();
10 |
11 | var gridSize = 35;
12 |
13 | for (var x = gridSize; x <= width - gridSize; x += gridSize) {
14 | for (var y = gridSize; y <= height - gridSize; y += gridSize) {
15 | noStroke();
16 | fill(255);
17 | rect(x-1, y-1, 3, 3);
18 | stroke(255, 50);
19 | line(x, y, width/2, height/2);
20 | }
21 | }
22 |
23 | }
--------------------------------------------------------------------------------
/examples/examples_src/04_Control/02_Conditionals_1.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Conditionals 1
3 | * @description Conditions are like questions.
4 | * They allow a program to decide to take one action if
5 | * the answer to a question is true or to do another action
6 | * if the answer to the question is false.
7 | * The questions asked within a program are always logical
8 | * or relational statements. For example, if the variable 'i' is
9 | * equal to zero then draw a line.
10 | */
11 | function setup() {
12 |
13 | createCanvas(720, 360);
14 | background(0);
15 |
16 | for(var i = 10; i < width; i += 10) {
17 | // If 'i' divides by 20 with no remainder draw the first line
18 | // else draw the second line
19 | if(i%20 == 0) {
20 | stroke(255);
21 | line(i, 80, i, height/2);
22 | } else {
23 | stroke(153);
24 | line(i, 20, i, 180);
25 | }
26 | }
27 | }
--------------------------------------------------------------------------------
/examples/examples_src/04_Control/03_Conditionals_2.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Conditionals 2
3 | * @description We extend the language of conditionals from the previous
4 | * example by adding the keyword "else". This allows conditionals
5 | * to ask two or more sequential questions, each with a different
6 | * action.
7 | */
8 | function setup() {
9 |
10 | createCanvas(720, 360);
11 | background(0);
12 |
13 | for(var i = 2; i < width-2; i += 4) {
14 | // If 'i' divides by 20 with no remainder
15 | if((i % 20) == 0) {
16 | stroke(255);
17 | line(i, 80, i, height/2);
18 | // If 'i' divides by 10 with no remainder
19 | } else if ((i % 10) == 0) {
20 | stroke(153);
21 | line(i, 20, i, 180);
22 | // If neither of the above two conditions are met
23 | // then draw this line
24 | } else {
25 | stroke(102);
26 | line(i, height/2, i, height-20);
27 | }
28 | }
29 | }
--------------------------------------------------------------------------------
/examples/examples_src/05_Image/00_Load_and_Display_Image.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Load and Display Image
3 | * @description Images can be loaded and displayed to the screen at their
4 | * actual size or any other size.
5 | * To run this example locally, you will need an
6 | * image file, and a running
7 | * local server .
8 |
9 | */
10 | var img; // Declare variable 'img'.
11 |
12 | function setup() {
13 | createCanvas(720, 400);
14 | img = loadImage("assets/moonwalk.jpg"); // Load the image
15 | }
16 |
17 | function draw() {
18 | // Displays the image at its actual size at point (0,0)
19 | image(img, 0, 0);
20 | // Displays the image at point (0, height/2) at half size
21 | image(img, 0, height/2, img.width/2, img.height/2);
22 | }
23 |
--------------------------------------------------------------------------------
/examples/examples_src/05_Image/01_Background_Image.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Background Image
3 | * @description This example presents the fastest way to load a
4 | * background image into Processing. To load an image as the background,
5 | * it must be the same width and height as the program.
6 | * To run this example locally, you will need an
7 | * image file, and a running
8 | * local server .
9 | */
10 | var bg;
11 | var y = 0;
12 |
13 | function setup() {
14 | // The background image must be the same size as the parameters
15 | // into the createCanvas() method. In this program, the size of
16 | // the image is 720x400 pixels.
17 | bg = loadImage("assets/moonwalk.jpg");
18 | createCanvas(720, 400);
19 | }
20 |
21 | function draw() {
22 | background(bg);
23 |
24 | stroke(226, 204, 0);
25 | line(0, y, width, y);
26 |
27 | y++;
28 | if (y > height) {
29 | y = 0;
30 | }
31 | }
32 |
--------------------------------------------------------------------------------
/examples/examples_src/05_Image/02_Transparency.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Transparency
3 | * @description Move the pointer left and right across the image to change its
4 | * position. This program overlays one image over another by modifying the
5 | * alpha value of the image with the tint() function.
6 | * To run this example locally, you will need an
7 | * image file, and a running
8 | * local server .
9 | */
10 | var img;
11 | var offset = 0;
12 | var easing = 0.05;
13 |
14 | function setup() {
15 | createCanvas(720, 400);
16 | img = loadImage("assets/moonwalk.jpg"); // Load an image into the program
17 | }
18 |
19 | function draw() {
20 | image(img, 0, 0); // Display at full opacity
21 | var dx = (mouseX-img.width/2) - offset;
22 | offset += dx * easing;
23 | tint(255, 127); // Display at half opacity
24 | image(img, offset, 0);
25 | }
26 |
--------------------------------------------------------------------------------
/examples/examples_src/05_Image/03_Alpha_Mask.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Alpha Mask
3 | * @description Loads a "mask" for an image to specify the transparency in
4 | * different parts of the image. The two images are blended together using
5 | * the mask() method of p5.Image.
6 | * To run this example locally, you will need two
7 | * image files, and a running
8 | * local server .
9 | */
10 | var img;
11 | var imgMask;
12 |
13 | function preload() {
14 | img = loadImage("assets/moonwalk.jpg");
15 | imgMask = loadImage("assets/mask.png");
16 | }
17 |
18 | function setup() {
19 | createCanvas(720, 400);
20 | img.mask(imgMask);
21 | imageMode(CENTER);
22 | }
23 |
24 | function draw() {
25 | background(0, 102, 153);
26 | image(img, width/2, height/2);
27 | image(img, mouseX, mouseY);
28 | }
29 |
--------------------------------------------------------------------------------
/examples/examples_src/05_Image/04_Create_Image.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Create Image
3 | * @description The createImage() function provides a fresh buffer of pixels to
4 | * play with. This example creates an image gradient.
5 | */
6 | var img; // Declare variable 'img'.
7 |
8 | function setup() {
9 | createCanvas(720, 400);
10 | img = createImage(230, 230);
11 | img.loadPixels();
12 | for(var x = 0; x < img.width; x++) {
13 | for(var y = 0; y < img.height; y++) {
14 | var a = map(y, 0, img.height, 255, 0);
15 | img.set(x, y, [0, 153, 204, a]);
16 | }
17 | }
18 | img.updatePixels();
19 | }
20 |
21 | function draw() {
22 | background(0);
23 | image(img, 90, 80);
24 | image(img, mouseX-img.width/2, mouseY-img.height/2);
25 | }
--------------------------------------------------------------------------------
/examples/examples_src/07_Color/00_Hue.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Hue
3 | * @description Hue is the color reflected from or transmitted through an
4 | * object and is typically referred to as the name of the color (red, blue,
5 | * yellow, etc.) Move the cursor vertically over each bar to alter its hue.
6 | */
7 | var barWidth = 20;
8 | var lastBar = -1;
9 |
10 | function setup() {
11 | createCanvas(720, 400);
12 | colorMode(HSB, height, height, height);
13 | noStroke();
14 | background(0);
15 | }
16 |
17 | function draw() {
18 | var whichBar = mouseX / barWidth;
19 | if (whichBar !== lastBar) {
20 | var barX = whichBar * barWidth;
21 | fill(mouseY, height, height);
22 | rect(barX, 0, barWidth, height);
23 | lastBar = whichBar;
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/examples/examples_src/07_Color/01_Saturation.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Saturation
3 | * @description Saturation is the strength or purity of the color and
4 | * represents the amount of gray in proportion to the hue. A "saturated"
5 | * color is pure and an "unsaturated" color has a large percentage of gray.
6 | * Move the cursor vertically over each bar to alter its saturation.
7 | */
8 | var barWidth = 20;
9 | var lastBar = -1;
10 |
11 | function setup() {
12 | createCanvas(720, 400);
13 | colorMode(HSB, width, height, 100);
14 | noStroke();
15 | }
16 |
17 | function draw() {
18 | var whichBar = mouseX / barWidth;
19 | if (whichBar != lastBar) {
20 | var barX = whichBar * barWidth;
21 | fill(barX, mouseY, 66);
22 | rect(barX, 0, barWidth, height);
23 | lastBar = whichBar;
24 | }
25 | }
--------------------------------------------------------------------------------
/examples/examples_src/07_Color/06_Radial_Gradient.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Radial Gradient
3 | * @description Draws a series of concentric circles to create a gradient
4 | * from one color to another.
5 | */
6 | var dim;
7 |
8 | function setup() {
9 | createCanvas(710, 400);
10 | dim = width/2;
11 | background(0);
12 | colorMode(HSB, 360, 100, 100);
13 | noStroke();
14 | ellipseMode(RADIUS);
15 | frameRate(1);
16 | }
17 |
18 | function draw() {
19 | background(0);
20 | for (var x = 0; x <= width; x+=dim) {
21 | drawGradient(x, height/2);
22 | }
23 | }
24 |
25 | function drawGradient(x, y) {
26 | var radius = dim/2;
27 | var h = random(0, 360);
28 | for (var r = radius; r > 0; --r) {
29 | fill(h, 90, 90);
30 | ellipse(x, y, r, r);
31 | h = (h + 1) % 360;
32 | }
33 | }
--------------------------------------------------------------------------------
/examples/examples_src/08_Math/00_incrementdecrement.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Increment Decrement
3 | * @description Writing "a++" is equivalent to "a = a + 1".
4 | * Writing "a--" is equivalent to "a = a - 1".
5 | */
6 | var a;
7 | var b;
8 | var direction;
9 |
10 | function setup() {
11 | createCanvas(710, 400);
12 | colorMode(RGB, width);
13 | a = 0;
14 | b = width;
15 | direction = true;
16 | frameRate(30);
17 | }
18 |
19 | function draw() {
20 | a++;
21 | if(a > width) {
22 | a = 0;
23 | direction = !direction;
24 | }
25 | if(direction == true){
26 | stroke(a);
27 | } else {
28 | stroke(width-a);
29 | }
30 | line(a, 0, a, height/2);
31 |
32 | b--;
33 | if(b < 0) {
34 | b = width;
35 | }
36 | if(direction == true) {
37 | stroke(width-b);
38 | } else {
39 | stroke(b);
40 | }
41 | line(b, height/2+1, b, height);
42 | }
--------------------------------------------------------------------------------
/examples/examples_src/08_Math/03_distance2d.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Distance 2D
3 | * @description Move the mouse across the image to obscure
4 | * and reveal the matrix. Measures the distance from the mouse
5 | * to each square and sets the size proportionally.
6 | */
7 | var max_distance;
8 |
9 | function setup() {
10 | createCanvas(710, 400);
11 | noStroke();
12 | max_distance = dist(0, 0, width, height);
13 | }
14 |
15 | function draw() {
16 | background(0);
17 |
18 | for(var i = 0; i <= width; i += 20) {
19 | for(var j = 0; j <= height; j += 20) {
20 | var size = dist(mouseX, mouseY, i, j);
21 | size = size/max_distance * 66;
22 | ellipse(i, j, size, size);
23 | }
24 | }
25 | }
--------------------------------------------------------------------------------
/examples/examples_src/08_Math/04_sine.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Sine
3 | * @description Smoothly scaling size with the sin() function.
4 | */
5 | var diameter;
6 | var angle = 0;
7 |
8 | function setup() {
9 | createCanvas(710, 400);
10 | diameter = height - 10;
11 | noStroke();
12 | fill(255, 204, 0);
13 | }
14 |
15 | function draw() {
16 | background(0);
17 |
18 | var d1 = 10 + (sin(angle) * diameter/2) + diameter/2;
19 | var d2 = 10 + (sin(angle + PI/2) * diameter/2) + diameter/2;
20 | var d3 = 10 + (sin(angle + PI) * diameter/2) + diameter/2;
21 |
22 | ellipse(0, height/2, d1, d1);
23 | ellipse(width/2, height/2, d2, d2);
24 | ellipse(width, height/2, d3, d3);
25 |
26 | angle += 0.02;
27 | }
28 |
--------------------------------------------------------------------------------
/examples/examples_src/08_Math/11_doubleRandom.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Double Random
3 | * @frame 720,400 (optional)
4 | * @description Using two random() calls and the point()
5 | * function to create an irregular sawtooth line.
6 | * Original by by Ira Greenberg.
7 | */
8 | var totalPts = 300;
9 | var steps = totalPts + 1;
10 |
11 | function setup() {
12 | createCanvas(710, 400);
13 | stroke(255);
14 | frameRate(1);
15 | }
16 |
17 | function draw() {
18 | background(0);
19 | var rand = 0;
20 | for (var i = 1; i < steps; i++) {
21 | point( (width/steps) * i, (height/2) + random(-rand, rand) );
22 | rand += random(-5, 5);
23 | }
24 | }
--------------------------------------------------------------------------------
/examples/examples_src/08_Math/12_random.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Random
3 | * @description Random numbers create the basis of this image.
4 | * Each time the program is loaded the result is different.
5 | */
6 | function setup() {
7 | createCanvas(710, 400);
8 | background(0);
9 | strokeWeight(20);
10 | frameRate(2);
11 | }
12 |
13 | function draw() {
14 | for (var i = 0; i < width; i++) {
15 | var r = random(255);
16 | stroke(r);
17 | line(i, 0, i, height);
18 | }
19 | }
--------------------------------------------------------------------------------
/examples/examples_src/08_Math/13_noise1D.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Noise1D
3 | * @description Using 1D Perlin Noise to assign location.
4 | */
5 | var xoff = 0.0;
6 | var xincrement = 0.01;
7 |
8 | function setup() {
9 | createCanvas(710, 400);
10 | background(0);
11 | noStroke();
12 | }
13 |
14 | function draw() {
15 | // Create an alpha blended background
16 | fill(0, 10);
17 | rect(0,0,width,height);
18 |
19 | //float n = random(0,width); // Try this line instead of noise
20 |
21 | // Get a noise value based on xoff and scale
22 | // it according to the window's width
23 | var n = noise(xoff)*width;
24 |
25 | // With each cycle, increment xoff
26 | xoff += xincrement;
27 |
28 | // Draw the ellipse at the value produced by perlin noise
29 | fill(200);
30 | ellipse(n,height/2, 64, 64);
31 | }
--------------------------------------------------------------------------------
/examples/examples_src/10_Interaction/20_Follow1.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Follow 1
3 | * @frame 710,400
4 | * @description A line segment is pushed and pulled by the cursor.
5 | * Based on code from Keith Peters.
6 | */
7 | var x = 100,
8 | y = 100,
9 | angle1 = 0.0,
10 | segLength = 50;
11 |
12 |
13 | function setup() {
14 | createCanvas(710, 400);
15 | strokeWeight(20.0);
16 | stroke(255, 100);
17 | }
18 |
19 | function draw() {
20 | background(0);
21 |
22 | dx = mouseX - x;
23 | dy = mouseY - y;
24 | angle1 = atan2(dy, dx);
25 | x = mouseX - (cos(angle1) * segLength);
26 | y = mouseY - (sin(angle1) * segLength);
27 |
28 | segment(x, y, angle1);
29 | ellipse(x, y, 20, 20);
30 | }
31 |
32 | function segment(x, y, a) {
33 | push();
34 | translate(x, y);
35 | rotate(a);
36 | line(0, 0, segLength, 0);
37 | pop();
38 | }
39 |
--------------------------------------------------------------------------------
/examples/examples_src/10_Interaction/21_Follow2.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Follow 2
3 | * @frame 710,400
4 | * @description A two-segmented arm follows the cursor position. The relative
5 | * angle between the segments is calculated with atan2() and the position
6 | * calculated with sin() and cos(). Based on code from Keith Peters.
7 | */
8 | var x = [0,0],
9 | y = [0,0],
10 | segLength = 50;
11 |
12 | function setup() {
13 | createCanvas(710, 400);
14 | strokeWeight(20.0);
15 | stroke(255, 100);
16 | }
17 |
18 | function draw() {
19 | background(0);
20 | dragSegment(0, mouseX, mouseY);
21 | dragSegment(1, x[0], y[0]);
22 | }
23 |
24 | function dragSegment(i, xin, yin) {
25 | var dx = xin - x[i];
26 | var dy = yin - y[i];
27 | var angle = atan2(dy, dx);
28 | x[i] = xin - cos(angle) * segLength;
29 | y[i] = yin - sin(angle) * segLength;
30 | segment(x[i], y[i], angle);
31 | }
32 |
33 | function segment(x, y, a) {
34 | push();
35 | translate(x, y);
36 | rotate(a);
37 | line(0, 0, segLength, 0);
38 | pop();
39 | }
40 |
--------------------------------------------------------------------------------
/examples/examples_src/11_Objects/01_Objects.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Objects
3 | * @description Create a Jitter class, instantiate an object,
4 | * and move it around the screen. Adapted from Getting Started with
5 | * Processing by Casey Reas and Ben Fry.
6 | */
7 | var bug; // Declare object
8 |
9 | function setup() {
10 | createCanvas(710, 400);
11 | // Create object
12 | bug = new Jitter();
13 | }
14 |
15 | function draw() {
16 | background(50, 89, 100);
17 | bug.move();
18 | bug.display();
19 | }
20 |
21 | // Jitter class
22 | function Jitter() {
23 | this.x = random(width);
24 | this.y = random(height);
25 | this.diameter = random(10, 30);
26 | this.speed = 1;
27 |
28 | this.move = function() {
29 | this.x += random(-this.speed, this.speed);
30 | this.y += random(-this.speed, this.speed);
31 | };
32 |
33 | this.display = function() {
34 | ellipse(this.x, this.y, this.diameter, this.diameter);
35 | }
36 | };
37 |
--------------------------------------------------------------------------------
/examples/examples_src/11_Objects/03_Objects_Array.js:
--------------------------------------------------------------------------------
1 | /*
2 | * @name Array of Objects
3 | * @description Create a Jitter class, instantiate an array of objects
4 | * and move them around the screen.
5 | */
6 | var bugs = []; // array of Jitter objects
7 |
8 | function setup() {
9 | createCanvas(710, 400);
10 | // Create objects
11 | for (var i=0; i<50; i++) {
12 | bugs.push(new Jitter());
13 | }
14 | }
15 |
16 | function draw() {
17 | background(50, 89, 100);
18 | for (var i=0; ip5.dom library
5 | * for this example to work in your own project. To run this example locally, you will need the
5 | * p5.dom library
6 | * at least one video file, and a running local server .
To run this example locally, you will need the
5 | * p5.sound library
6 | * a sound file, and a running local server . Visualize the frequency spectrum of live audio input.
4 | * To run this example locally, you will need the
5 | * p5.sound library
6 | * and a running local server .
7 | */
8 | var mic, fft;
9 |
10 | function setup() {
11 | createCanvas(710,400);
12 | noFill();
13 |
14 | mic = new p5.AudioIn();
15 | mic.start();
16 | fft = new p5.FFT();
17 | fft.setInput(mic);
18 | }
19 |
20 | function draw() {
21 | background(200);
22 |
23 | var spectrum = fft.analyze();
24 |
25 | beginShape();
26 | for (i = 0; i
2 | p5.js was created by Lauren McCarthy and is developed by a community of collaborators,
3 | with support from the Processing Foundation
4 | and NYU ITP .
5 | © Info.
6 |
7 |
--------------------------------------------------------------------------------
/functions.php:
--------------------------------------------------------------------------------
1 | 0) {
6 | return getenv('PHP_P5_SITE_ROOT');
7 | }
8 | if (strpos(getenv('HTTP_HOST'), 'localhost') !== FALSE){
9 | return '/p5js.org/';
10 | } else return '/';
11 | }
12 |
13 | ?>
14 |
--------------------------------------------------------------------------------
/git-pull.php:
--------------------------------------------------------------------------------
1 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/1/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/1/sketch.js:
--------------------------------------------------------------------------------
1 |
2 |
3 | function setup() {
4 | createCanvas(264, 264)
5 | scale(0.33)
6 |
7 | }
8 |
9 | function draw() {
10 | strokeWeight(random(255))
11 | fill(0, 0, 0)
12 | fill(random(255), random(255), 0)
13 | background(random(255), random(255), 0)
14 | rect(10, 10, 200, 200)
15 | }
--------------------------------------------------------------------------------
/home/collab/rooms/10/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/10/sketch.js:
--------------------------------------------------------------------------------
1 | // Constants
2 | var Y_AXIS = 1, X_AXIS = 0;
3 | var c1, c2;
4 |
5 | function setup() {
6 | createCanvas(800, 800);
7 |
8 | // Define colors
9 | c2 = color(random(255), random(255), random(255));
10 | c1 = color(random(255), random(255), random(255));
11 |
12 | setGradient(0, 0, width, height, c1, c2, Y_AXIS);
13 |
14 | }
15 |
16 | function setGradient(x, y, w, h, c1, c2, axis) {
17 |
18 | noFill();
19 |
20 | if (axis == Y_AXIS) { // Top to bottom gradient
21 | for (var i = y; i <= y+h; i++) {
22 | var inter = map(i, y, y+h, 0, 1);
23 | var c = lerpColor(c1, c2, inter);
24 | stroke(c);
25 | line(x, i, x+w, i);
26 | }
27 | }
28 | else if (axis == X_AXIS) { // Left to right gradient
29 | for (var i = x; i <= x+w; i++) {
30 | var inter = map(i, x, x+w, 0, 1);
31 | var c = lerpColor(c1, c2, inter);
32 | stroke(c);
33 | line(i, y, i, y+h);
34 | }
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/home/collab/rooms/11/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/11/sketch.js:
--------------------------------------------------------------------------------
1 | // Constants
2 | var Y_AXIS = 1, X_AXIS = 0;
3 | var c1, c2;
4 |
5 | function setup() {
6 | createCanvas(800, 800);
7 |
8 | // Define colors
9 | c2 = color(random(255), random(255), random(255));
10 | c1 = color(random(255), random(255), random(255));
11 |
12 | setGradient(0, 0, width, height, c1, c2, Y_AXIS);
13 |
14 | }
15 |
16 | function setGradient(x, y, w, h, c1, c2, axis) {
17 |
18 | noFill();
19 |
20 | if (axis == Y_AXIS) { // Top to bottom gradient
21 | for (var i = y; i <= y+h; i++) {
22 | var inter = map(i, y, y+h, 0, 1);
23 | var c = lerpColor(c1, c2, inter);
24 | stroke(c);
25 | line(x, i, x+w, i);
26 | }
27 | }
28 | else if (axis == X_AXIS) { // Left to right gradient
29 | for (var i = x; i <= x+w; i++) {
30 | var inter = map(i, x, x+w, 0, 1);
31 | var c = lerpColor(c1, c2, inter);
32 | stroke(c);
33 | line(i, y, i, y+h);
34 | }
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/home/collab/rooms/12/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/12/sketch.js:
--------------------------------------------------------------------------------
1 | // Constants
2 | var Y_AXIS = 1, X_AXIS = 0;
3 | var c1, c2;
4 |
5 | function setup() {
6 | createCanvas(800, 800);
7 |
8 | // Define colors
9 | c2 = color(random(255), random(255), random(255));
10 | c1 = color(random(255), random(255), random(255));
11 |
12 | setGradient(0, 0, width, height, c1, c2, Y_AXIS);
13 |
14 | }
15 |
16 | function setGradient(x, y, w, h, c1, c2, axis) {
17 |
18 | noFill();
19 |
20 | if (axis == Y_AXIS) { // Top to bottom gradient
21 | for (var i = y; i <= y+h; i++) {
22 | var inter = map(i, y, y+h, 0, 1);
23 | var c = lerpColor(c1, c2, inter);
24 | stroke(c);
25 | line(x, i, x+w, i);
26 | }
27 | }
28 | else if (axis == X_AXIS) { // Left to right gradient
29 | for (var i = x; i <= x+w; i++) {
30 | var inter = map(i, x, x+w, 0, 1);
31 | var c = lerpColor(c1, c2, inter);
32 | stroke(c);
33 | line(i, y, i, y+h);
34 | }
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/home/collab/rooms/2/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/2/sketch.js:
--------------------------------------------------------------------------------
1 | function setup() {
2 | createCanvas(264, 264)
3 | scale(0.33)
4 | }
5 |
6 | function draw() {
7 | background(0, 70, (random(255)))
8 | fill(26, 58, 97)
9 | rect(0, 0, 200, 650)
10 | frameRate(60)
11 | fill(0, 30, (random(255)))
12 | strokeWeight(random(30))
13 | rect(0, 0, 100, 150)
14 | frameRate(30)
15 | fill(0, 100, (random(255)))
16 | rect(600, 0, 200, 120)
17 | rect(350, 250, 300, 450)
18 | fill(26, 58, 97)
19 | }
20 |
--------------------------------------------------------------------------------
/home/collab/rooms/3/chair.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/3/chair.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/3/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/3/monitor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/3/monitor.png
--------------------------------------------------------------------------------
/home/collab/rooms/3/mytv.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/3/mytv.jpeg
--------------------------------------------------------------------------------
/home/collab/rooms/4/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/4/sketch.js:
--------------------------------------------------------------------------------
1 | // make the s variable
2 | var s ;
3 | // make g variable
4 | var g ;
5 |
6 | function setup() {
7 | createCanvas(264, 264)
8 | scale(0.33)
9 | //load the s
10 | s = loadImage ( "sphere.png")
11 | //load the g
12 | g = loadImage ( "glow3.png ")
13 |
14 |
15 | }
16 |
17 |
18 | function draw(){
19 |
20 | background(255)
21 | // draw the s
22 | image(s, 5, 100 )
23 | stroke(10, 10 ,10 )
24 | strokeWeight(10)
25 | ellipse(480,500,600,100)
26 |
27 |
28 | }
29 | //draw the g
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/home/collab/rooms/4/sphere.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/4/sphere.png
--------------------------------------------------------------------------------
/home/collab/rooms/5/Garfield_the_Cat.svg.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/5/Garfield_the_Cat.svg.png
--------------------------------------------------------------------------------
/home/collab/rooms/5/cartoon-cats-7.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/5/cartoon-cats-7.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/5/cartoon-tv-4.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/5/cartoon-tv-4.png
--------------------------------------------------------------------------------
/home/collab/rooms/5/hover_board_by_timmcfarlin-d4i74ss.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/5/hover_board_by_timmcfarlin-d4i74ss.png
--------------------------------------------------------------------------------
/home/collab/rooms/5/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/5/sketch.js:
--------------------------------------------------------------------------------
1 | var myImage
2 | var myImage2
3 | var myImage3
4 | var myImage4
5 |
6 | function setup() {
7 |
8 | createCanvas(264, 264)
9 | scale(0.33)
10 | myImage = loadImage("Garfield_the_Cat.svg.png")
11 | myImage2 = loadImage("summer_hoverboard_by_ask_debbie_starz-d6vexp0.png")
12 | myImage3 = loadImage("small-wood-table-hi.png")
13 | myImage4 = loadImage("cartoon-tv-4.png")
14 |
15 | }
16 | function draw() {
17 | background(210,166,139)
18 | ellipse(150, 150, 150, 150)
19 | ellipse(150, 250, 150,150)
20 | ellipse(150,200, 150, 150)
21 | fill(255, 0, 0)
22 | rect(400, 200, 250, 500)
23 | fill(0, 0, 255)
24 | stroke(0, 0, 0)
25 | strokeWeight(10)
26 | rect(400, 200, 200, 500)
27 | fill(0, 255, 255)
28 | rect(450,560, 150, 100)
29 | image(myImage, 450, 350, 150, 150)
30 | image(myImage2, 150, 550, 200, 100)
31 | image(myImage3, 300, 150, 100, 100)
32 | image(myImage4, 300, 60, 100, 100)
33 | }
--------------------------------------------------------------------------------
/home/collab/rooms/5/small-wood-table-hi.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/5/small-wood-table-hi.png
--------------------------------------------------------------------------------
/home/collab/rooms/5/summer_hoverboard_by_ask_debbie_starz-d6vexp0.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/5/summer_hoverboard_by_ask_debbie_starz-d6vexp0.png
--------------------------------------------------------------------------------
/home/collab/rooms/6/h.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/6/h.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/6/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/6/j.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/6/j.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/6/sketch.js:
--------------------------------------------------------------------------------
1 | var myImage
2 | var myImage2
3 |
4 | function setup() {
5 |
6 | createCanvas(264, 264)
7 | scale(0.33)
8 |
9 | myImage = loadImage("h.jpg")
10 | myImage2 = loadImage("j.jpg")
11 | }
12 |
13 | function draw() {
14 | background(255, 12, 89)
15 | ellipse(310, 550, random(100), 500)
16 | ellipse(310, 550, random(1000), 100)
17 | ellipse()
18 |
19 |
20 | fill(0, 0, 0)
21 | stroke(99, 99, 99)
22 |
23 | ellipse(150, 150, 250, 50)
24 |
25 | fill(0, 255, 0)
26 | stroke(123, 99, 99)
27 | ellipse(290, 150, 50, 50)
28 |
29 |
30 | ellipse(740, 550, 100, 100)
31 |
32 | image(myImage, 500, 50, 300, 400)
33 | image(myImage2, random(800), 50, 100, 300)
34 | ellipse(650, 400, 20, random(798))
35 |
36 |
37 |
38 | }
--------------------------------------------------------------------------------
/home/collab/rooms/7/cat.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/7/cat.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/7/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/7/sketch.js:
--------------------------------------------------------------------------------
1 | function setup() {
2 | createCanvas(264, 264)
3 | scale(0.33)
4 | }
5 |
6 | function draw() {
7 | background(0, 0, 0)
8 | fill(250, 0, 0)
9 | rect(150, 200, 300, 300)
10 | fill(150, 200, 300, 300)
11 | rect( 150, 250, 300, 20)
12 | }
--------------------------------------------------------------------------------
/home/collab/rooms/8/1385136139955.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/8/1385136139955.png
--------------------------------------------------------------------------------
/home/collab/rooms/8/301A562700000578-3396372-image-a-2_1452635501902.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/8/301A562700000578-3396372-image-a-2_1452635501902.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/8/NEBRAQJ9jIYYGB_1_a.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/8/NEBRAQJ9jIYYGB_1_a.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/8/hqdefault.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/8/hqdefault.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/8/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/8/mothership.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/home/collab/rooms/8/mothership.jpg
--------------------------------------------------------------------------------
/home/collab/rooms/8/sketch.js:
--------------------------------------------------------------------------------
1 | var myImage
2 | var myImage2
3 | var mothership
4 | function setup() {
5 |
6 |
7 | createCanvas(264, 264)
8 | scale(0.33)
9 | myImage = loadImage("h.jpg")
10 | mothership = loadImage("mothership.jpg")
11 | }
12 |
13 | function draw() {
14 | background(255, 12, 89)
15 | image(mothership, 0, 0, 800, 800)
16 | ellipse(310, 550, random(100), 500)
17 | ellipse(310, 550, random(1000), 100)
18 |
19 |
20 | fill(0, 0, 0)
21 | stroke(99, 99, 99)
22 |
23 | ellipse(150, 150, 250, 50)
24 |
25 | fill(0, 255, 0)
26 | stroke(123, 99, 99)
27 | ellipse(290, 150, 50, 50)
28 |
29 |
30 | ellipse(740, 550, 100, 100)
31 |
32 | image(myImage, 500, 50, 300, 400)
33 | ellipse(650, 400, 20, random(798))
34 | }
--------------------------------------------------------------------------------
/home/collab/rooms/9/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/home/collab/rooms/9/sketch.js:
--------------------------------------------------------------------------------
1 | // Constants
2 | var Y_AXIS = 1, X_AXIS = 0;
3 | var c1, c2;
4 |
5 | function setup() {
6 | createCanvas(800, 800);
7 |
8 | // Define colors
9 | c2 = color(random(255), random(255), random(255));
10 | c1 = color(random(255), random(255), random(255));
11 |
12 | setGradient(0, 0, width, height, c1, c2, Y_AXIS);
13 |
14 | }
15 |
16 | function setGradient(x, y, w, h, c1, c2, axis) {
17 |
18 | noFill();
19 |
20 | if (axis == Y_AXIS) { // Top to bottom gradient
21 | for (var i = y; i <= y+h; i++) {
22 | var inter = map(i, y, y+h, 0, 1);
23 | var c = lerpColor(c1, c2, inter);
24 | stroke(c);
25 | line(x, i, x+w, i);
26 | }
27 | }
28 | else if (axis == X_AXIS) { // Left to right gradient
29 | for (var i = x; i <= x+w; i++) {
30 | var inter = map(i, x, x+w, 0, 1);
31 | var c = lerpColor(c1, c2, inter);
32 | stroke(c);
33 | line(i, y, i, y+h);
34 | }
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/home/future_home_sketch/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | future_home
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/img/asterisk-01-01.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/asterisk-01-01.png
--------------------------------------------------------------------------------
/img/asterisk-01.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/asterisk-01.png
--------------------------------------------------------------------------------
/img/books/gettingstarted.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/books/gettingstarted.png
--------------------------------------------------------------------------------
/img/cc_88x31.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/cc_88x31.png
--------------------------------------------------------------------------------
/img/gallery-images/PrismPusher.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/PrismPusher.jpg
--------------------------------------------------------------------------------
/img/gallery-images/cell-flight.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/cell-flight.png
--------------------------------------------------------------------------------
/img/gallery-images/emoji-booth.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/emoji-booth.png
--------------------------------------------------------------------------------
/img/gallery-images/hardmarubox2D.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/hardmarubox2D.png
--------------------------------------------------------------------------------
/img/gallery-images/hardmaruplanks.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/hardmaruplanks.png
--------------------------------------------------------------------------------
/img/gallery-images/keyboard.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/keyboard.png
--------------------------------------------------------------------------------
/img/gallery-images/magic-is-real-emoji.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/magic-is-real-emoji.png
--------------------------------------------------------------------------------
/img/gallery-images/music-viz.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/music-viz.png
--------------------------------------------------------------------------------
/img/gallery-images/neobrush.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/neobrush.png
--------------------------------------------------------------------------------
/img/gallery-images/nithi-prasanpanich.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/nithi-prasanpanich.png
--------------------------------------------------------------------------------
/img/gallery-images/ol-scroll.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/ol-scroll.png
--------------------------------------------------------------------------------
/img/gallery-images/organic-motion-sonification.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/organic-motion-sonification.png
--------------------------------------------------------------------------------
/img/gallery-images/social-tension.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/social-tension.png
--------------------------------------------------------------------------------
/img/gallery-images/springs.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/springs.png
--------------------------------------------------------------------------------
/img/gallery-images/star-trails.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/gallery-images/star-trails.png
--------------------------------------------------------------------------------
/img/get-started/first-sketch.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/get-started/first-sketch.png
--------------------------------------------------------------------------------
/img/get-started/first-sketch2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/get-started/first-sketch2.png
--------------------------------------------------------------------------------
/img/get-started/sublime.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/get-started/sublime.png
--------------------------------------------------------------------------------
/img/get-started/sublime2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/get-started/sublime2.png
--------------------------------------------------------------------------------
/img/learn/3d.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/learn/3d.jpg
--------------------------------------------------------------------------------
/img/learn/dom.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/learn/dom.jpg
--------------------------------------------------------------------------------
/img/learn/lib_placeholder.ai:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/learn/lib_placeholder.ai
--------------------------------------------------------------------------------
/img/learn/lib_placeholder.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/learn/lib_placeholder.jpg
--------------------------------------------------------------------------------
/img/libraries/dom.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/dom.jpg
--------------------------------------------------------------------------------
/img/libraries/grafica.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/grafica.jpg
--------------------------------------------------------------------------------
/img/libraries/p5.bots.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.bots.jpg
--------------------------------------------------------------------------------
/img/libraries/p5.geolocation.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.geolocation.png
--------------------------------------------------------------------------------
/img/libraries/p5.gibber.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.gibber.jpg
--------------------------------------------------------------------------------
/img/libraries/p5.gif.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.gif.gif
--------------------------------------------------------------------------------
/img/libraries/p5.particle.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.particle.png
--------------------------------------------------------------------------------
/img/libraries/p5.play3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.play3.png
--------------------------------------------------------------------------------
/img/libraries/p5.scribble.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.scribble.png
--------------------------------------------------------------------------------
/img/libraries/p5.serial.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.serial.jpg
--------------------------------------------------------------------------------
/img/libraries/p5.speech.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5.speech.jpg
--------------------------------------------------------------------------------
/img/libraries/p5collide2d.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/p5collide2d.png
--------------------------------------------------------------------------------
/img/libraries/rita.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/rita.png
--------------------------------------------------------------------------------
/img/libraries/sound.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/libraries/sound.jpg
--------------------------------------------------------------------------------
/img/search.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/search.png
--------------------------------------------------------------------------------
/img/test-image-0.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/test-image-0.jpg
--------------------------------------------------------------------------------
/img/test-image-1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/img/test-image-1.jpg
--------------------------------------------------------------------------------
/img/thick-asterisk-alone-gray.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
6 |
10 |
--------------------------------------------------------------------------------
/img/thick-asterisk-alone.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
6 |
--------------------------------------------------------------------------------
/info/imgs/first_sketch.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/info/imgs/first_sketch.png
--------------------------------------------------------------------------------
/info/imgs/getting_started.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/info/imgs/getting_started.png
--------------------------------------------------------------------------------
/js/main.js:
--------------------------------------------------------------------------------
1 | $('#family form').hover(
2 | function() {
3 | $('#search_field').css('visibility', 'visible');
4 | $('#search_field').animate({width: '9.75em'}, 100);
5 | },
6 | function() {
7 | if ($('#search_field').val() === '') {
8 | closeSearch();
9 | }
10 | }
11 | );
12 |
13 | $('#family form').focusout(function() {
14 | closeSearch();
15 | });
16 |
17 | function closeSearch() {
18 | $('#search_field').css('width', '0em');
19 | $('#search_field').css('visibility', 'hidden');
20 | console.log($('#search_field').attr('width'));
21 | }
22 |
23 |
24 | // $('.info').css('display', 'none');
25 |
26 | // var currentId;
27 | // var tag;
28 |
29 | // $('.start-element').click(function() {
30 |
31 | // var currentId = $(this).attr('id').toString();
32 | // tag = '.info#' + currentId;
33 |
34 | // if ($(tag).css('display') =='block') {
35 | // $(tag).css('display', 'none');
36 | // }
37 | // else {
38 | // $(tag).css('display', 'block');
39 | // }
40 | // });
41 |
--------------------------------------------------------------------------------
/js/plugins.js:
--------------------------------------------------------------------------------
1 | // Avoid `console` errors in browsers that lack a console.
2 | (function() {
3 | var method;
4 | var noop = function () {};
5 | var methods = [
6 | 'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
7 | 'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
8 | 'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
9 | 'timeStamp', 'trace', 'warn'
10 | ];
11 | var length = methods.length;
12 | var console = (window.console = window.console || {});
13 |
14 | while (length--) {
15 | method = methods[length];
16 |
17 | // Only stub undefined methods.
18 | if (!console[method]) {
19 | console[method] = noop;
20 | }
21 | }
22 | }());
23 |
24 | // Place any jQuery/helper plugins in here.
25 |
--------------------------------------------------------------------------------
/js/vendor/ace-nc/ext-error_marker.js:
--------------------------------------------------------------------------------
1 | ;
2 | (function() {
3 | ace.require(["ace/ext/error_marker"], function() {});
4 | })();
5 |
--------------------------------------------------------------------------------
/js/vendor/ace-nc/ext-linking.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/ext/linking",["require","exports","module","ace/editor","ace/config"],function(e,t,n){function i(e){var t=e.editor,n=e.getAccelKey();if(n){var t=e.editor,r=e.getDocumentPosition(),i=t.session,s=i.getTokenAt(r.row,r.column);t._emit("linkHover",{position:r,token:s})}}function s(e){var t=e.getAccelKey(),n=e.getButton();if(n==0&&t){var r=e.editor,i=e.getDocumentPosition(),s=r.session,o=s.getTokenAt(i.row,i.column);r._emit("linkClick",{position:i,token:o})}}var r=e("ace/editor").Editor;e("../config").defineOptions(r.prototype,"editor",{enableLinking:{set:function(e){e?(this.on("click",s),this.on("mousemove",i)):(this.off("click",s),this.off("mousemove",i))},value:!1}})});
2 | (function() {
3 | ace.require(["ace/ext/linking"], function() {});
4 | })();
5 |
--------------------------------------------------------------------------------
/js/vendor/ace-nc/mode-gitignore.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/mode/gitignore_highlight_rules",["require","exports","module","ace/lib/oop","ace/mode/text_highlight_rules"],function(e,t,n){"use strict";var r=e("../lib/oop"),i=e("./text_highlight_rules").TextHighlightRules,s=function(){this.$rules={start:[{token:"comment",regex:/^\s*#.*$/},{token:"keyword",regex:/^\s*!.*$/}]},this.normalizeRules()};s.metaData={fileTypes:["gitignore"],name:"Gitignore"},r.inherits(s,i),t.GitignoreHighlightRules=s}),ace.define("ace/mode/gitignore",["require","exports","module","ace/lib/oop","ace/mode/text","ace/mode/gitignore_highlight_rules"],function(e,t,n){"use strict";var r=e("../lib/oop"),i=e("./text").Mode,s=e("./gitignore_highlight_rules").GitignoreHighlightRules,o=function(){this.HighlightRules=s};r.inherits(o,i),function(){this.$id="ace/mode/gitignore"}.call(o.prototype),t.Mode=o})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/mode-plain_text.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/mode/plain_text",["require","exports","module","ace/lib/oop","ace/mode/text","ace/mode/text_highlight_rules","ace/mode/behaviour"],function(e,t,n){"use strict";var r=e("../lib/oop"),i=e("./text").Mode,s=e("./text_highlight_rules").TextHighlightRules,o=e("./behaviour").Behaviour,u=function(){this.HighlightRules=s,this.$behaviour=new o};r.inherits(u,i),function(){this.type="text",this.getNextLineIndent=function(e,t,n){return""},this.$id="ace/mode/plain_text"}.call(u.prototype),t.Mode=u})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/mode-properties.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/mode/properties_highlight_rules",["require","exports","module","ace/lib/oop","ace/mode/text_highlight_rules"],function(e,t,n){"use strict";var r=e("../lib/oop"),i=e("./text_highlight_rules").TextHighlightRules,s=function(){var e=/\\u[0-9a-fA-F]{4}|\\/;this.$rules={start:[{token:"comment",regex:/[!#].*$/},{token:"keyword",regex:/[=:]$/},{token:"keyword",regex:/[=:]/,next:"value"},{token:"constant.language.escape",regex:e},{defaultToken:"variable"}],value:[{regex:/\\$/,token:"string",next:"value"},{regex:/$/,token:"string",next:"start"},{token:"constant.language.escape",regex:e},{defaultToken:"string"}]}};r.inherits(s,i),t.PropertiesHighlightRules=s}),ace.define("ace/mode/properties",["require","exports","module","ace/lib/oop","ace/mode/text","ace/mode/properties_highlight_rules"],function(e,t,n){"use strict";var r=e("../lib/oop"),i=e("./text").Mode,s=e("./properties_highlight_rules").PropertiesHighlightRules,o=function(){this.HighlightRules=s};r.inherits(o,i),function(){this.$id="ace/mode/properties"}.call(o.prototype),t.Mode=o})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/mode-text.js:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/js/vendor/ace-nc/mode-text.js
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/abap.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/abap",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="abap"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/ada.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/ada",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="ada"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/apache_conf.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/apache_conf",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="apache_conf"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/applescript.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/applescript",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="applescript"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/asciidoc.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/asciidoc",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="asciidoc"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/assembly_x86.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/assembly_x86",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="assembly_x86"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/autohotkey.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/autohotkey",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="autohotkey"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/batchfile.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/batchfile",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="batchfile"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/c9search.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/c9search",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="c9search"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/cirru.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/cirru",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="cirru"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/cobol.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/cobol",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="cobol"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/coldfusion.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/coldfusion",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="coldfusion"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/csharp.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/csharp",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="csharp"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/curly.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/curly",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="curly"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/d.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/d",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="d"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/diff.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/diff",["require","exports","module"],function(e,t,n){"use strict";t.snippetText='# DEP-3 (http://dep.debian.net/deps/dep3/) style patch header\nsnippet header DEP-3 style header\n Description: ${1}\n Origin: ${2:vendor|upstream|other}, ${3:url of the original patch}\n Bug: ${4:url in upstream bugtracker}\n Forwarded: ${5:no|not-needed|url}\n Author: ${6:`g:snips_author`}\n Reviewed-by: ${7:name and email}\n Last-Update: ${8:`strftime("%Y-%m-%d")`}\n Applied-Upstream: ${9:upstream version|url|commit}\n\n',t.scope="diff"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/dockerfile.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/dockerfile",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="dockerfile"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/dot.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/dot",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="dot"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/ejs.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/ejs",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="ejs"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/forth.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/forth",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="forth"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/ftl.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/ftl",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="ftl"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/gherkin.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/gherkin",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="gherkin"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/gitignore.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/gitignore",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="gitignore"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/glsl.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/glsl",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="glsl"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/golang.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/golang",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="golang"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/groovy.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/groovy",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="groovy"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/haml.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/haml",["require","exports","module"],function(e,t,n){"use strict";t.snippetText="snippet t\n %table\n %tr\n %th\n ${1:headers}\n %tr\n %td\n ${2:headers}\nsnippet ul\n %ul\n %li\n ${1:item}\n %li\nsnippet =rp\n = render :partial => '${1:partial}'\nsnippet =rpl\n = render :partial => '${1:partial}', :locals => {}\nsnippet =rpc\n = render :partial => '${1:partial}', :collection => @$1\n\n",t.scope="haml"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/handlebars.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/handlebars",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="handlebars"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/haxe.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/haxe",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="haxe"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/html_ruby.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/html_ruby",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="html_ruby"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/ini.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/ini",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="ini"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/jack.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/jack",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="jack"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/jade.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/jade",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="jade"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/json.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/json",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="json"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/jsx.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/jsx",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="jsx"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/julia.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/julia",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="julia"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/latex.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/latex",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="latex"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/less.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/less",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="less"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/liquid.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/liquid",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="liquid"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/lisp.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/lisp",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="lisp"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/livescript.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/livescript",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="livescript"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/logiql.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/logiql",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="logiql"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/lua.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/lua",["require","exports","module"],function(e,t,n){"use strict";t.snippetText="snippet #!\n #!/usr/bin/env lua\n $1\nsnippet local\n local ${1:x} = ${2:1}\nsnippet fun\n function ${1:fname}(${2:...})\n ${3:-- body}\n end\nsnippet for\n for ${1:i}=${2:1},${3:10} do\n ${4:print(i)}\n end\nsnippet forp\n for ${1:i},${2:v} in pairs(${3:table_name}) do\n ${4:-- body}\n end\nsnippet fori\n for ${1:i},${2:v} in ipairs(${3:table_name}) do\n ${4:-- body}\n end\n",t.scope="lua"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/luapage.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/luapage",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="luapage"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/lucene.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/lucene",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="lucene"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/makefile.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/makefile",["require","exports","module"],function(e,t,n){"use strict";t.snippetText="snippet ifeq\n ifeq (${1:cond0},${2:cond1})\n ${3:code}\n endif\n",t.scope="makefile"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/matlab.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/matlab",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="matlab"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/mel.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/mel",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="mel"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/mushcode.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/mushcode",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="mushcode"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/mysql.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/mysql",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="mysql"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/nix.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/nix",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="nix"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/objectivec.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/objectivec",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="objectivec"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/ocaml.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/ocaml",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="ocaml"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/pascal.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/pascal",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="pascal"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/pgsql.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/pgsql",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="pgsql"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/plain_text.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/plain_text",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="plain_text"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/powershell.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/powershell",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="powershell"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/prolog.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/prolog",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="prolog"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/properties.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/properties",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="properties"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/protobuf.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/protobuf",["require","exports","module"],function(e,t,n){"use strict";t.snippetText="",t.scope="protobuf"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/rdoc.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/rdoc",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="rdoc"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/rhtml.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/rhtml",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="rhtml"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/rust.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/rust",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="rust"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/sass.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/sass",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="sass"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/scad.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/scad",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="scad"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/scala.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/scala",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="scala"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/scheme.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/scheme",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="scheme"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/scss.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/scss",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="scss"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/sjs.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/sjs",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="sjs"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/smarty.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/smarty",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="smarty"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/snippets.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/snippets",["require","exports","module"],function(e,t,n){"use strict";t.snippetText="# snippets for making snippets :)\nsnippet snip\n snippet ${1:trigger}\n ${2}\nsnippet msnip\n snippet ${1:trigger} ${2:description}\n ${3}\nsnippet v\n {VISUAL}\n",t.scope="snippets"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/soy_template.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/soy_template",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="soy_template"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/space.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/space",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="space"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/sql.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/sql",["require","exports","module"],function(e,t,n){"use strict";t.snippetText="snippet tbl\n create table ${1:table} (\n ${2:columns}\n );\nsnippet col\n ${1:name} ${2:type} ${3:default ''} ${4:not null}\nsnippet ccol\n ${1:name} varchar2(${2:size}) ${3:default ''} ${4:not null}\nsnippet ncol\n ${1:name} number ${3:default 0} ${4:not null}\nsnippet dcol\n ${1:name} date ${3:default sysdate} ${4:not null}\nsnippet ind\n create index ${3:$1_$2} on ${1:table}(${2:column});\nsnippet uind\n create unique index ${1:name} on ${2:table}(${3:column});\nsnippet tblcom\n comment on table ${1:table} is '${2:comment}';\nsnippet colcom\n comment on column ${1:table}.${2:column} is '${3:comment}';\nsnippet addcol\n alter table ${1:table} add (${2:column} ${3:type});\nsnippet seq\n create sequence ${1:name} start with ${2:1} increment by ${3:1} minvalue ${4:1};\nsnippet s*\n select * from ${1:table}\n",t.scope="sql"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/stylus.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/stylus",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="stylus"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/svg.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/svg",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="svg"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/text.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/text",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="text"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/textile.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/textile",["require","exports","module"],function(e,t,n){"use strict";t.snippetText='# Jekyll post header\nsnippet header\n ---\n title: ${1:title}\n layout: post\n date: ${2:date} ${3:hour:minute:second} -05:00\n ---\n\n# Image\nsnippet img\n !${1:url}(${2:title}):${3:link}!\n\n# Table\nsnippet |\n |${1}|${2}\n\n# Link\nsnippet link\n "${1:link text}":${2:url}\n\n# Acronym\nsnippet (\n (${1:Expand acronym})${2}\n\n# Footnote\nsnippet fn\n [${1:ref number}] ${3}\n\n fn$1. ${2:footnote}\n \n',t.scope="textile"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/toml.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/toml",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="toml"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/twig.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/twig",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="twig"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/typescript.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/typescript",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="typescript"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/vbscript.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/vbscript",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="vbscript"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/velocity.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/velocity",["require","exports","module"],function(e,t,n){"use strict";t.snippetText='# macro\nsnippet #macro\n #macro ( ${1:macroName} ${2:\\$var1, [\\$var2, ...]} )\n ${3:## macro code}\n #end\n# foreach\nsnippet #foreach\n #foreach ( ${1:\\$item} in ${2:\\$collection} )\n ${3:## foreach code}\n #end\n# if\nsnippet #if\n #if ( ${1:true} )\n ${0}\n #end\n# if ... else\nsnippet #ife\n #if ( ${1:true} )\n ${2}\n #else\n ${0}\n #end\n#import\nsnippet #import\n #import ( "${1:path/to/velocity/format}" )\n# set\nsnippet #set\n #set ( $${1:var} = ${0} )\n',t.scope="velocity",t.includeScopes=["html","javascript","css"]})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/verilog.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/verilog",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="verilog"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/vhdl.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/vhdl",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="vhdl"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/xml.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/xml",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="xml"})
--------------------------------------------------------------------------------
/js/vendor/ace-nc/snippets/yaml.js:
--------------------------------------------------------------------------------
1 | ace.define("ace/snippets/yaml",["require","exports","module"],function(e,t,n){"use strict";t.snippetText=undefined,t.scope="yaml"})
--------------------------------------------------------------------------------
/offline-reference/extra/img/thick-asterisk-alone.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
6 |
--------------------------------------------------------------------------------
/p5-tests/array.json:
--------------------------------------------------------------------------------
1 | [
2 | {
3 | "id": 0,
4 | "species": "Capra hircus",
5 | "name": "Goat"
6 | },
7 | {
8 | "id": 1,
9 | "species": "Panthera pardus",
10 | "name": "Leopard"
11 | },
12 | {
13 | "id": 2,
14 | "species": "Equus zebra",
15 | "name": "Zebra"
16 | }
17 | ]
--------------------------------------------------------------------------------
/p5-tests/csv.csv:
--------------------------------------------------------------------------------
1 | name,age,height
2 | David,31,80
3 | "David, Jr.",11,61.5
4 | "David,
5 | Sr. ""the boss""",95,88
--------------------------------------------------------------------------------
/p5-tests/object.json:
--------------------------------------------------------------------------------
1 | {
2 | "id": 0,
3 | "species": "Panthera leo",
4 | "name": "Lion"
5 | }
--------------------------------------------------------------------------------
/p5_featured/15May_AV/image/droplet.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/image/droplet.png
--------------------------------------------------------------------------------
/p5_featured/15May_AV/image/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/image/logo.png
--------------------------------------------------------------------------------
/p5_featured/15May_AV/samples/keyReturn.wav:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/samples/keyReturn.wav
--------------------------------------------------------------------------------
/p5_featured/15May_AV/samples/keySpace.wav:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/samples/keySpace.wav
--------------------------------------------------------------------------------
/p5_featured/15May_AV/samples/keyStroke.wav:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/samples/keyStroke.wav
--------------------------------------------------------------------------------
/p5_featured/15May_AV/samples/rain01.wav:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/samples/rain01.wav
--------------------------------------------------------------------------------
/p5_featured/15May_AV/samples/rain02.wav:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/samples/rain02.wav
--------------------------------------------------------------------------------
/p5_featured/15May_AV/samples/rain03.wav:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/samples/rain03.wav
--------------------------------------------------------------------------------
/p5_featured/15May_AV/samples/rain04.wav:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/samples/rain04.wav
--------------------------------------------------------------------------------
/p5_featured/15May_AV/samples/rain05.wav:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/p5_featured/15May_AV/samples/rain05.wav
--------------------------------------------------------------------------------
/p5_featured/15May_AV/src/SplashSystem.js:
--------------------------------------------------------------------------------
1 | var SplashSystem = function(){
2 | this.mSplashes = [];
3 |
4 | this.randomForce = Math.random() * 2 - 1;
5 |
6 | this.mSplashesNum = 2;
7 | for(var i = 0; i < this.mSplashesNum; i++){
8 | this.mSplashes[i] = new Splash(0, 0, this.randomForce );
9 | }
10 | };
11 |
12 | SplashSystem.prototype.reset = function(_x, _y){
13 | for(var i = 0; i < this.mSplashesNum; i++){
14 | this.randomForce = Math.random() * 2 - 1;
15 | this.mSplashes[i].reset(_x, _y, this.randomForce);
16 | }
17 | };
18 |
19 | SplashSystem.prototype.render = function(){
20 | for(var i = 0; i < this.mSplashesNum; i++){
21 | this.mSplashes[i].render();
22 | }
23 | };
--------------------------------------------------------------------------------
/p5_featured/ChirsMill_AuroraII/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
13 | p5.js Front · Christopher Eugene Mills
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
--------------------------------------------------------------------------------
/p5_featured/Christine_Social_June/BobSystem.js:
--------------------------------------------------------------------------------
1 | //Bob System
2 | function BobSystem(options) {
3 | var bobs = [],
4 | bobAmount = 5;
5 |
6 | this.addBob = function(){
7 | var newBob = new Bob();
8 | bobs.push(newBob);
9 | }
10 |
11 | this.runBobs = function(){
12 | bobs.forEach(this.runBob);
13 | }
14 |
15 | this.runBob = function(bob, index, bobs) {
16 | bob.run(bobs);
17 | }
18 |
19 | for(var i = bobs.length; i < bobAmount; i++){
20 | this.addBob();
21 | }
22 | }
--------------------------------------------------------------------------------
/p5_featured/Christine_Social_June/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
--------------------------------------------------------------------------------
/p5_featured/Christine_Social_June/sketch.js:
--------------------------------------------------------------------------------
1 | var BobsUno, options, sliderValue, sketch, slider,
2 | isActiveBobMode = false;
3 |
4 | function setup() {
5 |
6 | sketch = createCanvas(windowWidth, windowHeight)
7 | sketch.id("p5Canvas");
8 |
9 | colorMode(HSB);
10 | frameRate(30);
11 |
12 | options = {
13 | doRunBobs: true,
14 | doDisplayBob: true,
15 | bobSize: 20,
16 | doRunInterference: true,
17 | fieldPulseRate: 1
18 | };
19 | BobsUno = new BobSystem();
20 | }
21 |
22 | function draw() {
23 | background(255);
24 |
25 | BobsUno.runBobs();
26 | }
27 |
28 | function windowResized() {
29 | resizeCanvas(windowWidth, windowHeight);
30 | }
--------------------------------------------------------------------------------
/p5_featured/HarverMoon_Perlin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/p5_featured/LeslieRuckman_RainbowPixelGrow/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | RainbowPixelGrow
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/p5_featured/Sarah_voronoi/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/p5_featured/emily_xie_connections/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
18 |
19 |
20 |
21 |
--------------------------------------------------------------------------------
/p5_featured/fengyizhu_points/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | points
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/p5_featured/kevin_3d/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/p5_featured/kylemcdonald_magnify/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/p5_featured/love1/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/p5_featured/matthew_kaney_teatime/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | Redirector
5 | Click here to redirect
9 |
10 |
11 |
--------------------------------------------------------------------------------
/reference/assets/js/yui-prettify.js:
--------------------------------------------------------------------------------
1 | YUI().use('node', function(Y) {
2 | var code = Y.all('.prettyprint.linenums');
3 | if (code.size()) {
4 | code.each(function(c) {
5 | var lis = c.all('ol li'),
6 | l = 1;
7 | lis.each(function(n) {
8 | n.prepend('
3 | Goat
4 | Leopard
5 | Zebra
6 |
--------------------------------------------------------------------------------
/reference/assets/mask.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/reference/assets/mask.png
--------------------------------------------------------------------------------
/reference/assets/mask2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/reference/assets/mask2.png
--------------------------------------------------------------------------------
/reference/assets/moonwalk.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/reference/assets/moonwalk.jpg
--------------------------------------------------------------------------------
/reference/assets/reference.css:
--------------------------------------------------------------------------------
1 | /**
2 | * Note: most of the styling for the reference documentation is actually
3 | * contained in the p5.js-website repository:
4 | *
5 | * https://github.com/processing/p5.js-website/blob/master/css/main.css
6 | *
7 | * However, some of it is located here so we can easily iterate on it
8 | * in the same repository.
9 | */
10 |
11 | #reference .params table p {
12 | /* Recently-added support for Markdown means that every parameter
13 | * description is wrapped in a paragraph element. (Previously, they weren't
14 | * wrapped in any kind of element.)
15 | *
16 | * We may eventually want to display paragraphs as blocks, so that we
17 | * can have lengthy descriptions for parameters, but for now we'll
18 | * keep our pre-existing behavior and essentially make paragraphs
19 | * "invisible" by rendering them inline. */
20 | display: inline;
21 |
22 | font-size: inherit;
23 | }
24 |
--------------------------------------------------------------------------------
/reference/assets/rockies.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/reference/assets/rockies.jpg
--------------------------------------------------------------------------------
/reference/assets/small-plate.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/reference/assets/small-plate.mp3
--------------------------------------------------------------------------------
/reference/assets/small-plate.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/reference/assets/small-plate.ogg
--------------------------------------------------------------------------------
/reference/assets/studio-b.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/reference/assets/studio-b.mp3
--------------------------------------------------------------------------------
/reference/assets/studio-b.ogg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/reference/assets/studio-b.ogg
--------------------------------------------------------------------------------
/reference/assets/test.txt:
--------------------------------------------------------------------------------
1 | I am a cat
2 | I like apples
3 | I have three feet
4 | I like my nose
5 | I smell like butter
6 | I talk like an orange
--------------------------------------------------------------------------------
/reference/assets/vendor/prettify/prettify-min.css:
--------------------------------------------------------------------------------
1 | .pln{color:#000}@media screen{.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.pun,.opn,.clo{color:#660}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec,.var{color:#606}.fun{color:red}}@media print,projection{.str{color:#060}.kwd{color:#006;font-weight:bold}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:bold}.lit{color:#044}.pun,.opn,.clo{color:#440}.tag{color:#006;font-weight:bold}.atn{color:#404}.atv{color:#060}}pre.prettyprint{padding:2px;border:1px solid #888}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}
--------------------------------------------------------------------------------
/setup.sh:
--------------------------------------------------------------------------------
1 | ### git-pull.sh needs this
2 | mkdir site
3 |
4 | ### Update the libs and populate download/version.php
5 | cd download
6 | touch version.php
7 |
8 | # Call release.php, which populates the version file
9 | php -r '$_GET["f"] = "update_lib" ; $p5jseditor_version=""; include("release.php");'
10 | php -r '$_GET["f"] = "update_p5jseditor" ; include("release.php");'
11 | echo ""
12 | echo "New version.php looks like this:"
13 | cat version.php
14 | echo ""
15 | echo ""
16 | cd - &>/dev/null
17 |
--------------------------------------------------------------------------------
/test/embed.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | p5 Performance Test
6 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
--------------------------------------------------------------------------------
/tutorials/performance/code/distance-squared/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | p5 Performance Test
6 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/tutorials/performance/code/fps-demo/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | p5 Performance Test
6 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/tutorials/performance/code/fps-demo/sketch.js:
--------------------------------------------------------------------------------
1 | function setup() {
2 | createCanvas(300, 300);
3 | }
4 |
5 | function draw() {
6 | var seconds = millis() / 1000;
7 | var radius = map(sin(3 * seconds), -1, 1, 50, min(width, height));
8 |
9 | background("#191716");
10 | fill("#E6AF2E");
11 | ellipse(width / 2, height / 2, radius, radius);
12 |
13 | // Draw FPS (rounded to 2 decimal places) at the bottom left of the
14 | // screen
15 | // var fps = frameRate();
16 | // fill(255);
17 | // stroke(0);
18 | // text("FPS: " + fps.toFixed(2), 10, height - 10);
19 | }
--------------------------------------------------------------------------------
/tutorials/performance/code/friendly-error-system/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | p5 Performance Test
6 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/tutorials/performance/code/friendly-error-system/sketch.js:
--------------------------------------------------------------------------------
1 | // Results in Chrome:
2 | //
3 | // Friendly Errors Disabled:
4 | // "Random took: 271.43ms."
5 | //
6 | // Friendly Errors Enabled:
7 | // "Random took: 1534.10ms."
8 | //
9 | // Results in p5 Editor:
10 | //
11 | // Friendly Errors Disabled:
12 | // "Random took: 1885.23ms."
13 | //
14 | // Friendly Errors Enabled:
15 | // "Random took: 3147.38ms."
16 |
17 | p5.disableFriendlyErrors = false;
18 |
19 | var iterations = 10000000;
20 |
21 | function setup() {
22 | createCanvas(800, 600);
23 |
24 | var start = millis();
25 | for (var i = 0; i < iterations; i++) {
26 | random();
27 | }
28 | var elapsed = millis() - start;
29 | console.log("Random took: " + elapsed.toFixed(2) + "ms.")
30 | }
--------------------------------------------------------------------------------
/tutorials/performance/code/native-vs-p5/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | p5 Performance Test
6 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/tutorials/performance/code/platforms-test/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | p5 Performance Test
6 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/tutorials/performance/code/reflow-dom-manipulation/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | p5 Performance Test
6 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
--------------------------------------------------------------------------------
/tutorials/performance/code/resizing-images/blackberry-original.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/code/resizing-images/blackberry-original.jpg
--------------------------------------------------------------------------------
/tutorials/performance/code/resizing-images/blackberry-tiny-sharpened.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/code/resizing-images/blackberry-tiny-sharpened.jpg
--------------------------------------------------------------------------------
/tutorials/performance/code/resizing-images/floral-original.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/code/resizing-images/floral-original.jpg
--------------------------------------------------------------------------------
/tutorials/performance/code/resizing-images/floral-tiny-sharpened.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/code/resizing-images/floral-tiny-sharpened.jpg
--------------------------------------------------------------------------------
/tutorials/performance/code/resizing-images/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | p5 Performance Test
6 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/tutorials/performance/images/chrome-cpu-flame.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/images/chrome-cpu-flame.gif
--------------------------------------------------------------------------------
/tutorials/performance/images/chrome-cpu-profile.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/images/chrome-cpu-profile.jpg
--------------------------------------------------------------------------------
/tutorials/performance/images/chrome-fps.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/images/chrome-fps.jpg
--------------------------------------------------------------------------------
/tutorials/performance/images/chrome-show-fps.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/images/chrome-show-fps.gif
--------------------------------------------------------------------------------
/tutorials/performance/images/drastic-resizing-comparison.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/images/drastic-resizing-comparison.png
--------------------------------------------------------------------------------
/tutorials/performance/images/editor-show-fps.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/images/editor-show-fps.gif
--------------------------------------------------------------------------------
/tutorials/performance/images/resizing-comparison.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/images/resizing-comparison.png
--------------------------------------------------------------------------------
/tutorials/performance/images/timeline.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/performance/images/timeline.png
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/images/hypotenuse.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/trigonometry/assets/images/hypotenuse.jpg
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/images/polar.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/trigonometry/assets/images/polar.jpg
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/images/pythagoras.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/trigonometry/assets/images/pythagoras.jpg
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/images/pythagoras1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/trigonometry/assets/images/pythagoras1.jpg
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/images/screen_coordinates.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/trigonometry/assets/images/screen_coordinates.jpg
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/images/sohcahtoa.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/processing/p5.js-website-OLD/7a7cbfe7457030be6c33d4130b3481b00c59e948/tutorials/trigonometry/assets/images/sohcahtoa.jpg
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/sincoscurves/embed.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/sincoscurves/embed1.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/tutorials/trigonometry/assets/unitCircle/embed.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/updated.php:
--------------------------------------------------------------------------------
1 | March 27, 2015
--------------------------------------------------------------------------------