6,211
edits
Changes
→Libraries
[[File:P5*js-logo.png|200px|right]] == Setup == * Online-Editor: [https://alpha.editor.p5js.org/ https://alpha.editor.p5js.org/]
* P5*JS Setup mit dem Texteditor: "Sublime Text" auf der lokalen Festplatte mit Safarie - [[P5*JS Sublime Setup]]
<br>
== Code ==
* '''DIY Button''' — Einfaches Button Interfaces mit der einer eigenen Funktion — [[p5Button]]
* '''DIY Questionnaire''' — Einfaches Questionnaire Interfaces mit der einer eigenen Funktion — [[qFunction]]
* '''date''' — Kalender Datum mit Wochentagen setzen - [[p5js-calendar-weekday]]
* '''switch case''' — Konditionsabfrage mit mehreren Optionen — [[switch case]]
* '''Go to Webpage''' — Öffne einen Link zu einer anderen Seite mit — [[p5js open URL]]
* '''Get URL Parameters''' — Daten via URL Anhang übertargen — [[p5js URL Parameters]]
* '''Copy to Clipboard''' - Kopiere den Inhalt einer Variable als String in die Zwischenablage — [[p5js Copy Text to Clipboard]]
* '''Get Battery Level''' — Lese den aktuellen Batteriestatus aus — [[p5js get Battery Level]]
* '''Vibrations''' — Funktioniert nur mit Handys — [[p5js trigger Phone Vibrations]]
<br>
== Libraries ==
* '''DOM Button''' — Designoptionen innerhalb der DOM Library - [[p5js-DOM-Button]]
* '''Textbox''' — Dom multi line Text input box - [[p5js-Dom-Textarea]]
* '''P5.GUI''' — Interfaces mit der [[p5.gui Librarie]]
* '''Pubnub Server''' — P5js Example für Real-Time Datenaustausch mit Server - [http://coursescript.com/notes/interactivecomputing/pubnub/ Pointillism with Pubnub]
* '''OpenType.js''' — Fonts in Vektoren zerlegen — [[p5js and opentype.js]]
* '''FaceTracking''' — Erkennung von Augen, Mund und Nase — [[FaceTracking with clmtrackr and P5JS]]
<br>
== p5js & Blynk ==
<pre>
// Get pin value from Blynk-Board with p5js
// Read Sensor Data via Internet from a Blynk Borad in p5*js
// !Dosen't work in the p5js-Online-Editor!
var myTorken = 'YourBlynkToken';
var myPin = 'D8' // can any digital, analog or virtual pin (A0, V1 ...)
var myURL;
var i = 0; // inputValue
var r; // rect size
function getValues(){
myURL = 'http://blynk-cloud.com/' + myTorken + '/get/' + myPin;
httpGet(myURL, 'text', false, function(response){
i = response.replace(/[^a-zA-Z0-9]/g, '');
});
}
function setup() {
createCanvas(200, 200);
getValues()
}
function draw() {
background(220);
text('klick to update', 20, 150);
text(i, 20, 20);
r = map(i, 0, 1024, 1, 160);
rect(20, 50, r, 20);
}
function mousePressed(){
getValues()
}
</pre>
<br>
== Publish WebApp ==
* [[P5JS look like an mobil app|Make your P5JS sketches look like an app on mobile devices]]
* Add a App-Icon to a p5js sketch - [[p5js-App-Icon]]
* Button mit der DOM Library - Desktop and mobile a simple compromise solution — [[p5js-DOMdesktop-and-Buttonmobile]]* Interfaces mit der [[p5.gui Librarie]]<br> == Publish App (Google Play Store) == * Einfaches DIY Button Interfaces Wandele deine WebApp mit der Android-Studio zu einer eigenen Funktion App um - [[p5ButtonBuild App with Android-Studio]]* Einfaches DIY Questionnaire Interfaces Wandele deine WebApp mit der PhoneGap zu einer eigenen Funktion App um - [[qFunctionBuild App with PhoneGap]] <br> == Andere p5js Plattformen == * Kalender Datum mit Wochentagen setzen - [[p5js-calendar-weekday]https://www.openprocessing.org/ OpenProcessing.org]* [[FaceTracking with clmtrackr and P5JS]https://p5stamper.com/ p5Stamper] <br> == Andere Tuturials == * P5js Example für Real-Time Datenaustausch mit Pubnub Server - [httphttps://coursescriptsites.google.com/notesview/interactivecomputingcreative-coding-for-kids/pubnub/ Pointillism with Pubnubcreative-coding-for-kids] <br>
