This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
murmure_des_arbres [2023/06/26 15:54] – [Pour le démarrage automatique du node] tech | murmure_des_arbres [2023/06/27 12:16] (current) – [Processing et android app] tech | ||
---|---|---|---|
Line 1: | Line 1: | ||
+ | ====== Le murmure des arbres ====== | ||
+ | |||
+ | |||
+ | ===== projet ===== | ||
+ | |||
+ | Depuis plusieurs années, les artistes sonores et compositeurs de l’association Apo33 cherchent à percer le langage des arbres. Ils ont enregistré des arbres sur plusieurs continents et ont constitué une librairie avec laquelle ils mêlent des sons gutturaux qu’ils réalisent avec leur voix. Sur une base de borborygmes et de sons de gorge inspirés du son des arbres enregistrés, | ||
+ | Le noyau, la structure interne de ces arbres anciens amplifiés devient sonorités craquantes à travers leur fragile bout des doigts sur lesquels nous attachons des micro-contacts. Quand on écoute ces arbres, nous avons l' | ||
+ | |||
+ | Dans le cadre de cette nouvelle composition nous souhaitons continuer une des recherches que nous menons sur ces relations entre écoute, nature, environnement et compositions musicales. Il s'agit plus précisément de nos recherches sur le langage des arbres et le mystère qui entoure un des organismes vivants le plus important de notre planète. Pour cela nous avons mis en place une installation sonore permanente en ligne qui permet de mixer et de transformer en temps-réel les sons enregistrés via une interface web et une application pour smartphone. | ||
+ | Nous invitons le public à venir participer à une composition musicale participative où chacun peut créer sa propre musique et sa propre écoute tout en partageant avec le public à travers le monde. | ||
+ | |||
+ | |||
+ | __les différentes étapes du projet :__ | ||
+ | |||
+ | |||
+ | ===== installer un VNC sur ubuntu 20.04 ===== | ||
+ | |||
+ | ===== installation de TigerVNC pour le contrôle à distance ===== | ||
+ | source https:// | ||
+ | |||
+ | ouvrir un terminal et entrer les commandes suivantes : | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - Sélectionnez n' | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - vous serez invité à taper 2 fois le mot de passe nécessaire qui servira pour la connection à TigerVNC | ||
+ | |||
+ | - pour la ligne Would you like to enter a view-only password (y/ | ||
+ | |||
+ | - entrer N, c'est un mot de passe en lecture seul | ||
+ | |||
+ | - cette commande '' | ||
+ | |||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - contenu du fichier | ||
+ | |||
+ | < | ||
+ | # | ||
+ | |||
+ | # Start up the standard system desktop | ||
+ | unset SESSION_MANAGER | ||
+ | unset DBUS_SESSION_BUS_ADDRESS | ||
+ | |||
+ | / | ||
+ | |||
+ | [ -x / | ||
+ | [ -r $HOME/ | ||
+ | x-window-manager & | ||
+ | </ | ||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - à ce stade on peut ce connecter à l'aide d'un vncviewer avec l'ip de la machine ou l'ip du routeur avec redirection de port configurer | ||
+ | |||
+ | - le port utilisé par TigerVNC est le '' | ||
+ | |||
+ | =====Pour le démarrage automatique de TigerVNC===== | ||
+ | |||
+ | Dans un terminal entrer les commandes suivantes: | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - contenu du fichier, dans le fichier crée définir l' | ||
+ | < | ||
+ | [Unit] | ||
+ | Description=Remote desktop service (VNC) | ||
+ | After=syslog.target network.target | ||
+ | |||
+ | [Service] | ||
+ | Type=forking | ||
+ | User=l' | ||
+ | WorkingDirectory=/ | ||
+ | ExecStartPre=-/ | ||
+ | ExecStart=/ | ||
+ | ExecStop=/ | ||
+ | |||
+ | [Install] | ||
+ | WantedBy=multi-user.target | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | cette ligne corrige le problème '' | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | ====== Serveur web et Apache2 sur ubuntu 20.04 ====== | ||
+ | |||
+ | ===== installation de apache2 ===== | ||
+ | |||
+ | source https:// | ||
+ | |||
+ | ouvrez un terminal et entrer les commandes suivantes : | ||
+ | |||
+ | < | ||
+ | sudo apt install apache2 mariadb-server php-mysql libapache2-mod-php php-gd php-json php-curl php-mbstring php-intl php-imagick php-xml php-zip | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | remplacé ''< | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - remplacé la ligne '' | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | ==== pour vérifier que apache2 écouter bien le port souhaiter==== | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | ====== | ||
+ | |||
+ | ===== installation de nodejs sous ubuntu ===== | ||
+ | |||
+ | < | ||
+ | < | ||
+ | |||
+ | |||
+ | ===== installation de osc-js ===== | ||
+ | lien https:// | ||
+ | |||
+ | faire cette commande dans le même dossier que la où voulez crée le bridge.js/ | ||
+ | |||
+ | < | ||
+ | |||
+ | ===== création du bridge.js ===== | ||
+ | |||
+ | lien de la doc sur lequel le code est basé https:// | ||
+ | |||
+ | < | ||
+ | |||
+ | contenu du fichier, à noté qu'il faut remplacer certaine valeur en fonction de la configuration souhaité | ||
+ | |||
+ | < | ||
+ | const ws_host = " | ||
+ | const ws_port = port_ecouter_par_le_serveur; | ||
+ | |||
+ | const udp_host = " | ||
+ | const udp_port = port_ecouter_par_puredata; | ||
+ | |||
+ | const OSC = require(' | ||
+ | |||
+ | const config = { udpClient: {host :udp_host, port: udp_port}, //bridge setup | ||
+ | | ||
+ | } | ||
+ | const osc = new OSC( | ||
+ | { plugin: new OSC.BridgePlugin(config)}, | ||
+ | ); | ||
+ | osc.open() //bridge start | ||
+ | </ | ||
+ | |||
+ | ===== Pour le démarrage automatique du node ===== | ||
+ | |||
+ | ouvrir un terminal et entrer : | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - changer le chemin en fonction de où ce trouve le ficher bridge.js | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - puis faire la entrer la commande retourné | ||
+ | |||
+ | - une fois tout setup voici les commandes utile en cas de crash : | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | |||
+ | ===== création de la page web ===== | ||
+ | |||
+ | refaire la commande '' | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | - le contenu du fichier | ||
+ | |||
+ | < | ||
+ | .slider-wrapper input { | ||
+ | width: 20em; | ||
+ | height: 3em; | ||
+ | margin: 0; | ||
+ | transform-origin: | ||
+ | transform: rotate(-90deg); | ||
+ | } | ||
+ | .slider-wrapper { | ||
+ | display: inline-block; | ||
+ | width: 2em; | ||
+ | height: 18em; | ||
+ | padding: 0; | ||
+ | } | ||
+ | .increase { | ||
+ | width:3em; | ||
+ | height:3em; | ||
+ | } | ||
+ | .bang{ | ||
+ | width: 3em ; | ||
+ | height: 3em; | ||
+ | border-radius: | ||
+ | background-color: | ||
+ | } | ||
+ | bouton{ | ||
+ | color:# | ||
+ | } | ||
+ | body{ | ||
+ | background-color:# | ||
+ | } | ||
+ | p{ | ||
+ | color:# | ||
+ | } | ||
+ | h1{ | ||
+ | color:# | ||
+ | font-size: | ||
+ | } | ||
+ | |||
+ | h2{ | ||
+ | color:# | ||
+ | font-size: | ||
+ | } | ||
+ | |||
+ | h3{ | ||
+ | color:# | ||
+ | font-size: | ||
+ | } | ||
+ | li{ | ||
+ | color:# | ||
+ | } | ||
+ | a{ | ||
+ | text-decoration: | ||
+ | color:# | ||
+ | } | ||
+ | |||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | - le contenu du fichier | ||
+ | |||
+ | < | ||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | <meta http-equiv=" | ||
+ | |||
+ | <link charset=" | ||
+ | |||
+ | < | ||
+ | |||
+ | </ | ||
+ | |||
+ | |||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | < | ||
+ | |||
+ | </ | ||
+ | |||
+ | </ | ||
+ | |||
+ | |||
+ | |||
+ | </ | ||
+ | |||
+ | </ | ||
+ | |||
+ | </ | ||
+ | </ | ||
+ | < | ||
+ | |||
+ | - le contenu du fichier | ||
+ | |||
+ | < | ||
+ | .slider { | ||
+ | -webkit-appearance: | ||
+ | | ||
+ | | ||
+ | to right, | ||
+ | #22841a 30%, #81c124 45%, #c2f288 99%); | ||
+ | outline: none; | ||
+ | opacity: 0.7; | ||
+ | -webkit-transition: | ||
+ | transition: opacity .2s; | ||
+ | |||
+ | } | ||
+ | |||
+ | .slider:: | ||
+ | -webkit-appearance: | ||
+ | appearance: none; | ||
+ | width: 25px; | ||
+ | height: 25px; | ||
+ | background: #81c124; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | .slider:: | ||
+ | width: 15px; | ||
+ | height: 35px; | ||
+ | background: #000; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | |||
+ | .slider-wrapper { | ||
+ | display: inline-block; | ||
+ | width: 2em; | ||
+ | height: 18em; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | |||
+ | .slider-wrapper input { | ||
+ | width: 20em; | ||
+ | height: 0.5em; | ||
+ | margin: 1.5em; | ||
+ | transform-origin: | ||
+ | transform: rotate(-90deg); | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Hide the default checkbox */ | ||
+ | .increase { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | /* Create a circular shape for the checkbox */ | ||
+ | .custom-checkbox { | ||
+ | position: relative; | ||
+ | width: 25px; | ||
+ | height: 25px; | ||
+ | border-radius: | ||
+ | border: 2px solid #ccc; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | |||
+ | /* Add a checkmark icon inside the checkbox when it's checked */ | ||
+ | .custom-checkbox: | ||
+ | content: ""; | ||
+ | position: absolute; | ||
+ | top: 50%; | ||
+ | left: 50%; | ||
+ | transform: translate(-50%, | ||
+ | width: 10px; | ||
+ | height: 10px; | ||
+ | background-color: | ||
+ | border-radius: | ||
+ | opacity: 0; | ||
+ | transition: opacity 0.2s; | ||
+ | } | ||
+ | |||
+ | /* Show the checkmark icon when the checkbox is checked */ | ||
+ | .increase: | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | /* Style the label element */ | ||
+ | .custom-checkbox-label { | ||
+ | display: inline-block; | ||
+ | vertical-align: | ||
+ | cursor: pointer; | ||
+ | font-size: 14px; | ||
+ | } | ||
+ | |||
+ | /* Align the checkbox and label vertically */ | ||
+ | .custom-checkbox-label span { | ||
+ | display: inline-block; | ||
+ | vertical-align: | ||
+ | } | ||
+ | |||
+ | .bang{ | ||
+ | width: 3em ; | ||
+ | height: 3em; | ||
+ | border-radius: | ||
+ | background-color: | ||
+ | | ||
+ | } | ||
+ | .logo_apo33{ | ||
+ | width: 10em ; | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | .more_info{ | ||
+ | color:# | ||
+ | font-size: | ||
+ | } | ||
+ | body{ | ||
+ | background-color:# | ||
+ | } | ||
+ | p{ | ||
+ | color:# | ||
+ | } | ||
+ | h1{ | ||
+ | color:# | ||
+ | font-size: | ||
+ | } | ||
+ | |||
+ | h2{ | ||
+ | color:# | ||
+ | font-size: | ||
+ | } | ||
+ | |||
+ | h3{ | ||
+ | color:# | ||
+ | font-size: | ||
+ | |||
+ | li{ | ||
+ | color:# | ||
+ | } | ||
+ | a{ | ||
+ | text-decoration: | ||
+ | color:# | ||
+ | } | ||
+ | |||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | - le contenu du fichier | ||
+ | |||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <link charset=" | ||
+ | < | ||
+ | </ | ||
+ | < | ||
+ | <!-- | ||
+ | < | ||
+ | <td> | ||
+ | <label for=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <input type=" | ||
+ | | ||
+ | </td> | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | <table border=" | ||
+ | <td> | ||
+ | <label for=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <input type=" | ||
+ | | ||
+ | </td> | ||
+ | <tr> | ||
+ | <td> | ||
+ | |||
+ | </td> | ||
+ | <td> | ||
+ | <button id=" | ||
+ | </td> | ||
+ | </tr> | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | --> | ||
+ | <table border=" | ||
+ | <tr> | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | < | ||
+ | <img class =" | ||
+ | </ | ||
+ | </ | ||
+ | </ | ||
+ | < | ||
+ | <tr> | ||
+ | <td> | ||
+ | < | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input class=" | ||
+ | </ | ||
+ | </td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | < | ||
+ | < | ||
+ | </td> | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <span class=" | ||
+ | </ | ||
+ | </tr> | ||
+ | |||
+ | <tr> | ||
+ | <td> | ||
+ | < | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <button class=" | ||
+ | </td> | ||
+ | | ||
+ | </tr> | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | <audio controls=" | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <p> | ||
+ | <a class=" | ||
+ | </p> | ||
+ | </div | ||
+ | |||
+ | </ | ||
+ | |||
+ | <script type=" | ||
+ | < | ||
+ | <script type=" | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | - le contenu du fichier, des valeurs son à changer en fonction du serveur | ||
+ | |||
+ | < | ||
+ | const ws_host = " | ||
+ | const ws_port = port_ecouter_par_le_serveur;// | ||
+ | |||
+ | //const ws_port = 8080; | ||
+ | var osc = new OSC( | ||
+ | {plugin: new OSC.WebsocketClientPlugin({host: | ||
+ | ); | ||
+ | | ||
+ | |||
+ | /** | ||
+ | | ||
+ | var str_road =""; | ||
+ | var msg = document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | **/ | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | document.getElementById(' | ||
+ | var str_road =""; | ||
+ | str_road = str_road +'/ | ||
+ | str_road = str_road.trim()+'/ | ||
+ | var bang = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str_road, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | |||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | - le contenu du fichier | ||
+ | |||
+ | < | ||
+ | < | ||
+ | < | ||
+ | <meta http-equiv=" | ||
+ | <link charset=" | ||
+ | < | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | <td> | ||
+ | <label for=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <input type=" | ||
+ | | ||
+ | </td> | ||
+ | </ | ||
+ | < | ||
+ | | ||
+ | <table border=" | ||
+ | <tr> | ||
+ | < | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td> | ||
+ | <label for=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <input type=" | ||
+ | minlength=" | ||
+ | </td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td> | ||
+ | <label for=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <input type=" | ||
+ | minlength=" | ||
+ | </td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td> | ||
+ | <label for=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <input type=" | ||
+ | minlength=" | ||
+ | </td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td> | ||
+ | <button id=" | ||
+ | </td> | ||
+ | </tr> | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | <tr> | ||
+ | <td> | ||
+ | <button id=" | ||
+ | </td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td> | ||
+ | <input type=" | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input type=" | ||
+ | </ | ||
+ | </td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td> | ||
+ | <input type=" | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | </td> | ||
+ | <td> | ||
+ | <div class=" | ||
+ | <input type=" | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | </ | ||
+ | </td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td> | ||
+ | <input class=" | ||
+ | </td> | ||
+ | </tr> | ||
+ | </ | ||
+ | |||
+ | </ | ||
+ | <script type=" | ||
+ | <script type=" | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | - le contenu du fichier, des valeurs son à changer en fonction du serveur | ||
+ | |||
+ | < | ||
+ | const ws_host = " | ||
+ | const ws_port = port_ecouter_par_le_serveur; | ||
+ | |||
+ | var osc = new OSC( | ||
+ | {plugin: new OSC.WebsocketClientPlugin({host: | ||
+ | ); | ||
+ | | ||
+ | |||
+ | | ||
+ | var str = document.getElementById(" | ||
+ | var n1 = Number(document.getElementById(" | ||
+ | var n2 = Number(document.getElementById(" | ||
+ | var n3 = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str, | ||
+ | osc.send(message); | ||
+ | }); | ||
+ | |||
+ | | ||
+ | var message = new OSC.Message('/ | ||
+ | | ||
+ | |||
+ | }); | ||
+ | |||
+ | | ||
+ | var str = document.getElementById(" | ||
+ | var send_slider_h = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str, | ||
+ | osc.send(message); | ||
+ | |||
+ | }); | ||
+ | |||
+ | | ||
+ | var str = document.getElementById(" | ||
+ | var send_slider_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str, | ||
+ | osc.send(message); | ||
+ | |||
+ | }); | ||
+ | | ||
+ | var str = document.getElementById(" | ||
+ | var send_selector_h = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str, | ||
+ | osc.send(message); | ||
+ | |||
+ | }); | ||
+ | | ||
+ | var str = document.getElementById(" | ||
+ | var send_selector_v = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str, | ||
+ | osc.send(message); | ||
+ | |||
+ | }); | ||
+ | |||
+ | | ||
+ | var str = document.getElementById(" | ||
+ | var send_checkbox = Number(document.getElementById(" | ||
+ | var message = new OSC.Message(str, | ||
+ | osc.send(message); | ||
+ | |||
+ | }); | ||
+ | </ | ||
+ | |||
+ | ===== Installation processing sous windows et des librairies nécessaire ===== | ||
+ | |||
+ | source du code processing https:// | ||
+ | |||
+ | Tout d' | ||
+ | |||
+ | - allez dans le dossier téléchargement puis clique droit extraire ici | ||
+ | |||
+ | - puis cliquer sur le dossier et exécuter processing.exe | ||
+ | |||
+ | Ouvrez le programme. En haut à droite on peut voir un onglet écrit **Java**. | ||
+ | Cliquez dessus et sélectionnez **ajouter un mode**. Une deuxième fenêtre s' | ||
+ | installer « Android mode » : vous pouvez maintenant alterner entre les modes « Java » et « Android ». | ||
+ | |||
+ | ==== Sur votre téléphone Android ==== | ||
+ | |||
+ | vous devez effectuez le « debugging usb ». Attention, depuis la version 4.2 d’Android, | ||
+ | le menu Options de développement n’apparaît plus par défaut dans les options de paramétrage, | ||
+ | |||
+ | Ouvrez les paramètres | ||
+ | |||
+ | Système | ||
+ | |||
+ | « About phone » | ||
+ | |||
+ | Appuyez 7 fois sur « Build number » : vous êtes maintenant développeur | ||
+ | |||
+ | Revenez à la page précédente et sélectionnez « Développer options » | ||
+ | |||
+ | Activez « Usb debugging » | ||
+ | |||
+ | |||
+ | |||
+ | Ensuite branchez votre appareil en USB sur l' | ||
+ | vous devriez le voir apparaître dans Processing, dans l' | ||
+ | |||
+ | Toujours dans processing, allez sur l' | ||
+ | dans celle-ci cliquez sur sur le champ de saisie, c'est ici que vous allez ajouter les éléments nécessaire à faire fonctionner le code : | ||
+ | |||
+ | - OSCP5 : librairie permettant d' | ||
+ | logiciels/ | ||
+ | |||
+ | - controlP5 : permet la création de fader, bouton, potard ,... | ||
+ | |||
+ | |||
+ | Entrez le code suivant dans processing : | ||
+ | |||
+ | < | ||
+ | import android.os.StrictMode; | ||
+ | import oscP5.*; | ||
+ | import netP5.*; | ||
+ | import controlP5.*; | ||
+ | ControlP5 controlP5; | ||
+ | OscP5 oscP5; | ||
+ | NetAddress myRemoteLocation; | ||
+ | |||
+ | boolean overButton = false; | ||
+ | int y_mixing_1 = 140; | ||
+ | int y_Pitch_1 = y_mixing_1 + 500 + 60; | ||
+ | int y_Sound_1 = y_Pitch_1 + 150 + 60; | ||
+ | |||
+ | int y_mixing_2 = y_Sound_1 + 150 + 60; | ||
+ | int y_Pitch_2 = y_mixing_2 + 500 + 60; | ||
+ | int y_Sound_2 = y_Pitch_2 + 150 + 60; | ||
+ | |||
+ | int colonne_1 = 20 ; | ||
+ | int colonne_2 = 190 ; | ||
+ | int colonne_3 = 360 ; | ||
+ | int colonne_4 = 530 ; | ||
+ | int colonne_5 = 700 ; | ||
+ | int colonne_6 = 870 ; | ||
+ | int colonne_7 = colonne_6 + 150 ; | ||
+ | |||
+ | color couleur_active = color(138, 176, 92); | ||
+ | color couleur_premier_plan = color(39, | ||
+ | |||
+ | color couleur_de_fond_slider = color(189, 255, 0); | ||
+ | |||
+ | color couleur_active_pitch = color(76, 187, 23); | ||
+ | color couleur_premier_plan_pitch = color(39, | ||
+ | color couleur_de_fond_pitch = color(128, | ||
+ | |||
+ | color couleur_active_sound = color(151, 186, 112); | ||
+ | boolean slider_n = false; | ||
+ | |||
+ | //void setup est la partie où nous initialisons notre code avant de le faire tourner | ||
+ | void setup() { | ||
+ | fullScreen(); | ||
+ | orientation(PORTRAIT); | ||
+ | smooth(); | ||
+ | frameRate(60); | ||
+ | //création d'une nouvelle instance oscP5, c'est ce qui va nous permettre de communiquer avec pd | ||
+ | oscP5 = new OscP5(this, 10000 ); //le port 12000 est celui sur lequel le routeur écoute | ||
+ | myRemoteLocation = new NetAddress(" | ||
+ | // | ||
+ | | ||
+ | controlP5 = new ControlP5(this); | ||
+ | |||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | |||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | |||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | |||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | controlP5.addSlider(" | ||
+ | | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | controlP5.addToggle(" | ||
+ | | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | controlP5.addBang(" | ||
+ | |||
+ | } | ||
+ | |||
+ | void controlEvent(ControlEvent theEvent) { | ||
+ | StrictMode.ThreadPolicy policy = new StrictMode.ThreadPolicy.Builder().permitAll().build(); | ||
+ | StrictMode.setThreadPolicy(policy); | ||
+ | | ||
+ | | ||
+ | | ||
+ | |||
+ | | ||
+ | | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n == true){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | if(slider_n){ | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | slider_n = true; | ||
+ | } | ||
+ | | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | if(theEvent.getController().getName()==" | ||
+ | OscMessage myMessage = new OscMessage("/ | ||
+ | myMessage.add(int (theEvent.getController().getValue())); | ||
+ | oscP5.send(myMessage, | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | |||
+ | void draw() { | ||
+ | background(34, | ||
+ | text(); | ||
+ | if (overButton == true) { | ||
+ | fill(255); | ||
+ | } else { | ||
+ | noFill(); | ||
+ | } | ||
+ | rect(colonne_1, | ||
+ | line(colonne_2, | ||
+ | line(colonne_3 - 50, y_Sound_2 + 150 + 30 + 50 + 20, colonne_3, y_Sound_2 + 150 + 30 + 50 + 20); | ||
+ | line(colonne_3, | ||
+ | } | ||
+ | void mousePressed() { | ||
+ | if (overButton) { | ||
+ | link(" | ||
+ | } | ||
+ | } | ||
+ | |||
+ | void mouseMoved() { | ||
+ | checkButtons(); | ||
+ | } | ||
+ | | ||
+ | void mouseDragged() { | ||
+ | checkButtons(); | ||
+ | } | ||
+ | |||
+ | void checkButtons() { | ||
+ | if (mouseX > colonne_1 && mouseX < colonne_1 + 450 && mouseY > y_Sound_2 + 150 + 30 + 50 && mouseY < y_Sound_2 + 150 + 30 + 50 + 120) { | ||
+ | overButton = true; | ||
+ | } else { | ||
+ | overButton = false; | ||
+ | } | ||
+ | } | ||
+ | void text(){ | ||
+ | | ||
+ | textSize(75); | ||
+ | text(" | ||
+ | textSize(80); | ||
+ | text(" | ||
+ | textSize(40); | ||
+ | text(" | ||
+ | | ||
+ | textSize(40); | ||
+ | text(" | ||
+ | line(colonne_2, | ||
+ | text(" | ||
+ | line(colonne_2, | ||
+ | text(" | ||
+ | line(colonne_2, | ||
+ | text(" | ||
+ | line(colonne_2, | ||
+ | text(" | ||
+ | line(colonne_2, | ||
+ | text(" | ||
+ | line(colonne_2, | ||
+ | line(colonne_1, | ||
+ | |||
+ | textSize(35); | ||
+ | text(" | ||
+ | | ||
+ | textSize(32); | ||
+ | text(" | ||
+ | colonne_4 | ||
+ | // | ||
+ | line(colonne_4 - 20, y_Sound_2 + 150 + 30 , colonne_4 - 20, y_Sound_2 + 150 + 180 + 30); | ||
+ | text(" | ||
+ | |||
+ | } | ||
+ | </ | ||
+ | |||
+ | |||
+ | Pour les premiers tests, il est préférable que le téléphone soit connecté au même wifi que l' | ||
+ | |||
+ | Dans Processing, allez dans “sketche permission” se trouvant dans l’onglet “Android”, | ||
+ | |||
+ | Après avoir copié le code dans Processing, vous devez appuyer sur le bouton Play en haut à gauche. | ||
+ | |||
+ | Sur le téléphone, | ||
+ | |||
+ | Pour trouver le fichier .APK il faut aller voir dans la console de Processing où il est écrit qu'un nouveau dossier à été créé ===> Build folder : emplacement du dossier | ||
+ | Ensuite allez dans “App”, puis “Build”, | ||
+ | Le fichier .APK servira ensuite à télécharger l’appli sur un autre appareil Android. Il faut bien penser à donner l’autorisation pour le téléchargement car le téléphone se méfie si l’appli ne provient pas du store android. | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||