parent
65edb120d4
commit
8f061b4f06
13 changed files with 2786 additions and 98 deletions
@ -0,0 +1,116 @@ |
||||
const express = require('express') |
||||
const http = require('http') |
||||
const WebSocket = require('ws') |
||||
|
||||
const osc = require('osc') |
||||
|
||||
const port = 6676 |
||||
// Vzemi iz argumenta |
||||
const tty = process.argv[2] |
||||
|
||||
const include_files = [ |
||||
'/anim.js', |
||||
'/control.js', |
||||
'/test.js', |
||||
'/node_modules/three/build/three.min.js', |
||||
'/node_modules/nouislider/distribute/nouislider.min.js', |
||||
'/node_modules/nouislider/distribute/nouislider.min.css', |
||||
'/node_modules/osc/dist/osc-browser.js' |
||||
]; |
||||
|
||||
const app = express(); |
||||
const server = http.Server(app); |
||||
|
||||
// Odprti serijski OSC link |
||||
const scon = new osc.SerialPort({ |
||||
devicePath: tty, |
||||
bitrate: 115200 |
||||
}) |
||||
scon.on('error', e => { |
||||
console.log('tty error', e) |
||||
}) |
||||
scon.open() |
||||
|
||||
app.get('/', (req, res) => { |
||||
res.sendFile(__dirname + '/index.html'); |
||||
}); |
||||
|
||||
app.get('/ctl', (req, res) => { |
||||
res.sendFile(__dirname + '/control.html'); |
||||
}); |
||||
|
||||
app.get('/test', (req, res) => { |
||||
res.sendFile(__dirname + '/test.html'); |
||||
}); |
||||
|
||||
let settings = {}; |
||||
app.get('/settings', function(req, res) { |
||||
res.send(settings); |
||||
}); |
||||
|
||||
include_files.map(function(file) { |
||||
app.get(file, function(req, res){ |
||||
res.sendFile(__dirname + file); |
||||
}); |
||||
}); |
||||
|
||||
server.listen(port, () => console.log('listening on *:' + port)) |
||||
|
||||
// Websocket init |
||||
const wss = new WebSocket.Server({ server }) |
||||
|
||||
const sendAll = (msg, wss, ws = null) => { |
||||
wss.clients.forEach( client => { |
||||
if (client != ws) { |
||||
client.send(msg) |
||||
} |
||||
}) |
||||
} |
||||
|
||||
// Debug osc |
||||
/* |
||||
scon.on('osc', msg => { |
||||
console.log('tty osc', msg.address, ...msg.args.map(val => Math.round(val * 1000) / 1000)) |
||||
}) |
||||
*/ |
||||
|
||||
wss.on('connection', function (ws) { |
||||
const oscWS = new osc.WebSocketPort({ |
||||
socket: ws, |
||||
metadata: true |
||||
}); |
||||
|
||||
// Arduino OSC gre v web |
||||
scon.on('osc', msg => { |
||||
switch(msg.address) { |
||||
case '/gyro/': |
||||
const [gx, gy, gz] = msg.args |
||||
sendAll('adjust:rotx:' + gx, wss) |
||||
sendAll('adjust:roty:' + gy, wss) |
||||
sendAll('adjust:rotz:' + gz, wss) |
||||
break; |
||||
case '/quaternion/': |
||||
const [qw, qx, qy, qz] = msg.args |
||||
sendAll('adjust:quaternion:' + [qw, qx, qy, qz].join(':'), wss) |
||||
break; |
||||
case '/accel/': |
||||
const [ax, ay, az] = msg.args |
||||
sendAll('adjust:posx:' + ax, wss) |
||||
sendAll('adjust:posy:' + ay, wss) |
||||
sendAll('adjust:posz:' + az, wss) |
||||
break; |
||||
} |
||||
}) |
||||
|
||||
ws.on('message', (msg) => { |
||||
//console.log('got msg', msg) |
||||
const parts = msg.split(":") |
||||
const cmd = parts[0] |
||||
|
||||
// Broadcast adjust msg |
||||
switch (cmd) { |
||||
case 'adjust': |
||||
sendAll(msg, wss, ws) |
||||
} |
||||
}) |
||||
}) |
||||
@ -0,0 +1,24 @@ |
||||
<html > |
||||
<head> |
||||
<meta charset="UTF-8"> |
||||
<title>cancerainbow test</title> |
||||
<style type="text/css"> |
||||
body { |
||||
margin: 0 |
||||
} |
||||
|
||||
.noUi-target { |
||||
width: 500px; |
||||
} |
||||
|
||||
table tr td { |
||||
padding-top: 1rem; |
||||
} |
||||
</style> |
||||
</head> |
||||
<body> |
||||
<h1>TEST</h1> |
||||
<script src="control.js"></script> |
||||
<script src="test.js"></script> |
||||
</body> |
||||
</html> |
||||
@ -0,0 +1 @@ |
||||
g1smo@dbn.20170:1628540355 |
||||
@ -0,0 +1,24 @@ |
||||
var oscPort = new osc.WebSocketPort({ |
||||
url: location.origin.replace(/https?/, 'ws'), |
||||
metadata: true |
||||
}); |
||||
|
||||
oscPort.open(); |
||||
|
||||
oscPort.on("ready", function () { |
||||
// Example send
|
||||
/* |
||||
oscPort.send({ |
||||
address: "/carrier/frequency", |
||||
args: [ |
||||
{ |
||||
type: "f", |
||||
value: 440 |
||||
} |
||||
] |
||||
}); |
||||
*/ |
||||
oscPort.on("message", function (msg) { |
||||
console.log("OSC message", msg); |
||||
}); |
||||
}); |
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,19 @@ |
||||
<html > |
||||
<head> |
||||
<meta charset="UTF-8"> |
||||
<title>wavey wind test</title> |
||||
<style type="text/css"> |
||||
body { |
||||
margin: 0 |
||||
} |
||||
|
||||
</style> |
||||
</head> |
||||
<body> |
||||
<div id="anim-container"></div> |
||||
|
||||
<script src="node_modules/three/build/three.min.js"></script> |
||||
<script src="test.js"></script> |
||||
<script src="control.js"></script> |
||||
</body> |
||||
</html> |
||||
@ -0,0 +1,140 @@ |
||||
console.log("Hello, Sky!"); |
||||
|
||||
/**** ☭☭☭☭☭☭☭☭☭☭☭☭ ****** |
||||
/☭☭☭☭ Parametri razni ☭☭☭☭ * |
||||
******☭☭☭☭☭☭☭☭☭☭☭☭******/ |
||||
|
||||
// Odmik kamere
|
||||
var odmik_kamere = 100; |
||||
|
||||
// Rotacija kamere
|
||||
var cam_rot_offset = 1; |
||||
|
||||
// Vidni kot
|
||||
var FOV = 140; |
||||
|
||||
// Sirina in visina test objekta
|
||||
var width = 25; |
||||
var height = 150; |
||||
var depth = 50; |
||||
|
||||
// Stevec, za razno animiranje
|
||||
var stevec = 0; |
||||
|
||||
// Parametri animacije
|
||||
var rotacijaX = 0.000; |
||||
var rotacijaY = 0.000; |
||||
var rotacijaZ = 0.000; |
||||
|
||||
// Pozicija
|
||||
var posX = 0; |
||||
var posY = 0; |
||||
var posZ = 0; |
||||
|
||||
// Zamik pri novem objektu
|
||||
var barva = 0.333; |
||||
var saturacija = 1; |
||||
var svetlost = 0.4; |
||||
|
||||
// Drugi parametri
|
||||
var wDiff = 0.5; |
||||
|
||||
// Scena, kamera in render
|
||||
scene = new THREE.Scene; |
||||
|
||||
camera = new THREE.PerspectiveCamera(FOV, window.innerWidth / window.innerHeight, 0.1, 2000); |
||||
camera.position.z = odmik_kamere; |
||||
|
||||
renderer = new THREE.WebGLRenderer({ |
||||
alpha: true |
||||
}); |
||||
renderer.setSize(window.innerWidth, window.innerHeight); |
||||
|
||||
// Belo ozadje
|
||||
renderer.setClearColor(0xFFFFFF, 1); |
||||
// Črno ozadje
|
||||
//renderer.setClearColor(0x000000, 1);
|
||||
|
||||
// Dodaj test skatlo
|
||||
var geo = new THREE.BoxGeometry(width, height, depth); |
||||
var mat = new THREE.MeshBasicMaterial({ |
||||
color: 0xff00ff, |
||||
wireframe: true |
||||
}); |
||||
var cube = new THREE.Mesh(geo, mat); |
||||
scene.add(cube); //
|
||||
|
||||
var objekti = [cube]; |
||||
|
||||
function render () { |
||||
requestAnimationFrame(render); |
||||
|
||||
stevec += 1; |
||||
renderer.render(scene, camera); |
||||
|
||||
objAnim(); |
||||
//camRotate();
|
||||
}; |
||||
|
||||
// Funkcija za animacijo objektov
|
||||
function objAnim() { |
||||
objekti.map(function (obj) { |
||||
obj.setRotationFromEuler(new THREE.Euler(rotacijaX, rotacijaY, rotacijaZ, 'XYZ')); |
||||
|
||||
/* |
||||
obj.rotation.y = -rotacijaX; |
||||
obj.rotation.x = rotacijaY; |
||||
obj.rotation.z = rotacijaZ; |
||||
*/ |
||||
|
||||
/* |
||||
const cor = 0.8; |
||||
obj.position.x += posX / 1000; |
||||
obj.position.x *= cor; |
||||
obj.position.y += posY / 1000; |
||||
obj.position.y *= cor; |
||||
obj.position.z += posZ / 1000; |
||||
obj.position.z *= cor; |
||||
*/ |
||||
}); |
||||
}; |
||||
|
||||
|
||||
var xAksa = new THREE.Vector3(0, 1, 0); |
||||
function camRotate () { |
||||
// rotiraj po z osi
|
||||
camera.translateX(cam_rot_offset); |
||||
camera.translateZ(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(cam_rot_offset, 2))); |
||||
|
||||
/* |
||||
camera.translateY(cam_rot_offset); |
||||
camera.translateX(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(cam_rot_offset, 2))); |
||||
|
||||
camera.translateY(cam_rot_offset); |
||||
camera.translateX(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(cam_rot_offset, 2))); |
||||
|
||||
|
||||
|
||||
camera.position.x = Math.sin((stevec % 10) / 10) * cam_rot_offset; |
||||
camera.position.y = Math.cos((stevec % 10) / 10) * cam_rot_offset; |
||||
*/ |
||||
|
||||
camera.lookAt(scene.position); |
||||
}; |
||||
|
||||
// Inicializiraj
|
||||
document.onreadystatechange = function () { |
||||
if (document.readyState === 'complete') { |
||||
document.getElementById("anim-container").appendChild(renderer.domElement); |
||||
|
||||
render(); |
||||
} |
||||
}; |
||||
|
||||
// Lep risajz
|
||||
function onWindowResize() { |
||||
camera.aspect = window.innerWidth / window.innerHeight; |
||||
camera.updateProjectionMatrix(); |
||||
renderer.setSize(window.innerWidth, window.innerHeight); |
||||
} |
||||
window.addEventListener('resize', onWindowResize, false); |
||||
Loading…
Reference in new issue