/openmapper

Video mapper based on three.js

Primary LanguageTypeScriptOtherNOASSERTION

OpenMapper

A Videomapper based on three.js

Runs on any plattform using Chrome or Firefox. See openmapper.ch


Alt text

Find more devs!

If you are good in Three.js, JavaScript, Typescript, Mathematics, contact info at magdesign for work.

Usage

Node.js must be installed on the system.

Install

cd client

$ npm install
cd backend

$ npm install

Start Local Instance

$ cd client
$ npm run start

$ cd backend
$ npm run start:rest

(the start:rest is needed to display all the movies selectable from the folder)

Run Tests

$ npm run test

Build

$ npm run build

Open address in browser: localhost:8080

Next steps (high priority)

  • Fix Cutter!!

  • Add comments in code, so we understand what is going on!

  • Hide menu by default, see here

  • Autoplay videos by default

  • Outlines and cutter hidden by default

  • Add save and load presets 1-9, always load preset 1 when starting first time

  • Make each quad selectable with Raycaster function (Sprites are selectable, Meshes still need work)

  • The selected quad will update the menu content to show the current video, speed etc.

  • Create seperate function for cutter, will open 80% of screen, quads not visible (see video)

  • Add fullsize function, so selected quad can be made fullscreen of browsers current window size, use this as solution

  • Add keycodes to all menu entrys so we can control with keystrokes

  • Add iframe source, see here to add slideshows and webpages

  • Rewind, fast forward (for videos)

  • here is a very good paper describing the mathematical stuff: https://www.inf.ufrgs.br/~oliveira/pubs_files/PG01_Adaptive_subdivision.pdf

Medium priority

  • Remote access on mapper (websockets, remote control mapping from another device)
  • Sync various instances of openmappers
  • Render mapping to file using this or this
  • Layer Up/Down for selected quad (mover spprite is faulty and needs a fix!)

@Jan => can you please explain in a few words how the Websockets thing is ment to work!

Low priority

  • Auto Snatch Draghandles
  • Add resolution slider (5 - 200 quads resolution)

Nice to have

  • Other surfaces triangles, spheres (highly needed together with warp!), hexagons
  • Bezier function check this might be based on this and needs again a shit load of mathematical braining....
  • List in UI to show all connected slaves
  • Grid warp, see this paper
  • Adjust brightness, contrast, rgb of output texture with filters
  • Softedge blending on each surface
  • Audio reactive FX
  • OSC and APi to remotely load other files
  • integrated DMX player (this is easy, take the scripts from PocketVJ)

Openend issues regarding this project