Web Interface - Fancier - UPDATED 24/5/2017 : Transitions disable button, fixes.

[White Tie]

Update 24th May 2017

• Option button to enable / disable transitions. Defaults to off for iOS devices (hopefully).
• Track sends now also show hardware sends.
• Click time display to type in position or go to marker/region.
• Other fixes to cure some 'this is all horribly broken' errors.

Update 2nd May 2017

• Animated frames now rendered as individual tiles on GPU blahblahblah iOS users does this solve the frame rate problems?

Update 26th April 2017



Toolbar (use the hamburger menu) with undo / redo / metronome / snap / clear clip indicators.

I'm using a different method for doing the opening/closing animation, could those experiencing low frame rate on track open/close (iOS and elderly Android users) please test and report back if the toolbar performs better? Cheers!

Update 14th April 2017

• Simple graphic representation of previous / current / next time position of markers and region, for informed next/previous button based navigation.
• If current time position is neither a marker nor region border you can tap to drop a marker.
• Time display moved to top, shows units.

File is attached below as usual, please test! Thanks.

Update 1st March 2017

• Sends! If the destination track has a custom colour, it will be used. I forgot to do hardware sends from non-master tracks, so that is To Do.
• Play button surround arc is now drawn using a different method (not that you should care.)
• Fixes for all the awful iOS problems, and Safari compatibility, by none other than our glorious leader himself.
• Fixes for other stuff.

If you've tested before and it went badly, I'd be enormously grateful if you'd give it another go, the latest file is attached to this post as before. Thanks!



-------------------------------------------------------------------------------------

Here is a WIP on a fancier web interface. There is a single 80kB file with no images (they're all inline SVGs) so just unzip and stick it in the usual place.

It does phone style:



and tablet style:



It has tap-to-expand faders for each track, and marker navigation:



In an effort to improve navigation in arbitrary amounts, I found FFWD/RWD buttons to be a bit hopeless because of the lag inherent in this method of control. So... I've done a jogger wheel thing. Drag forwards or backwards to build up a skip distance, drag further to go faster. When you release it will send that offset to Reaper. I'd really appreciate some feedback on the subjective feel of this, its a classic judgement call with no right answer. Thanks!



Its been tested on Chrome (Windows & Android) but that's all. I know nothing about browser compatibility, and I'm not very interested in learning (pfft), so I will be handing this over to a web type when the time comes. He said to pass on that this will never work on older browsers because of the methods I've used, and will probably never work on Safari because he'd rather smash himself in the face than deal with all that. FYI

The far from exhaustive To Do list:

• track cloning
• sends
• FX
• panning
• not having the jog readout covered by your finger when you're jogging, derp.
• rebuild all the remaining bits that don't line up or look quite right.
• browser compatibility yawn. hopefully...
• a way to reset clip indicators
• Metronome on/off
• Snap on/off
• a way to zero faders I don't see a great need for this. Talk me into it...
• Snap jogger output to nearest beat, not previous beat. No, that's nonsense, right?
• Hardware sends from non-master tracks.
• Undo / redo.
• Peak meter readout on armed tracks.

I've never done any programming before, so shoddiness may abound, which will no doubt need fixing as well.

[Stevie]

wow, looks great

[X-Raym]

Track colors !

Awesome new style Looks very modern and fancy. There is a lot of clever details like the number of tracks armed, and region names.
Congrats !
ALso having faders below track... cool :P

It is not on your todo list but may I suggest having track hidden if they are hidden in TCP ? Track visibility support would be great.

[G-Sun]

Really looking forward to trying this

Edit: Working an looking great

Jog wheel is well thought out.
Number of tracks armed is very helpful!


I'm not getting any response on that middle field that has text "chorus1" in you image. What's intended?
Missing:
- a way to set faders at 0db
- goto > type in beat/time
- Snap jog (beat/measure)

Beat/measure number seems of by 1 measure

Android 5,5" Chrome

[planetnine]

Originally Posted by G-Sun

...

I'm not getting any response on that middle field that has text "chorus1" in you image. What's intended?
Missing:
- a way to set faders at 0db
- goto > type in beat/time
- Snap jog (beat/measure)

Beat/measure number seems of by 1 measure

Android 5,5" Chrome

I think the "chorus" is the last marker or present region that the edit/play cursor is in. Fwd/back arrows are to next/prev marker/region.

Just a guess, might be wrong

Looking forward to trying this when I get to the laptop, anyone "taken it for a spin" yet?




>

[White Tie]

Thanks for trying it out, much appreciated.

Originally Posted by X-Raym

may I suggest having track hidden if they are hidden in TCP ?

You may, and yes that would indeed seem correct. Er... I've no clue how to get track hidden status - are you going to make me dive into the API, you bad man? 8|

Originally Posted by G-Sun

I'm not getting any response on that middle field that has text "chorus1" in you image. What's intended?

That's the marker you are AT. I was thinking you could set up your recording session with markers at the bits you might want to be recording, and navigate between them.

Originally Posted by G-Sun

- a way to set faders at 0db

Roger that, added to To Do.

Originally Posted by G-Sun

Snap jog (beat/measure)

I looked at displaying the jog offset in beat/measure, and I suppose snapping to them would be a part of all that... if it weren't, I'm afraid, waaaaay beyond my pay grade

Originally Posted by G-Sun

Beat/measure number seems of by 1 measure

Hmm it doesn't here, can you explain further please?

[CraigD]

Looking and working good on LG-V20, Android 7, Chrome

[G-Sun]

Originally Posted by White Tie

That's the marker you are AT. I was thinking you could set up your recording session with markers at the bits you might want to be recording, and navigate between them.

Ok, so it's only for play-cursor on that excaxt place.
For some odd reason it doesn't work on M2 here:

Seems to be when marker is offbeat.

Works on the other markers.

Roger that, added to To Do.

Thank you!

I looked at displaying the jog offset in beat/measure, and I suppose snapping to them would be a part of all that... if it weren't, I'm afraid, waaaaay beyond my pay grade

Understandable

Hmm it doesn't here, can you explain further please?

For M3 above it displays:
51.1.00
4/4 - 0/50

It should be 0/51, or 1/51
shouldn't it?

[vdubreeze]

Originally Posted by White Tie

Its been tested on Chrome (Windows & Android) but that's all. I know nothing about browser compatibility, and I'm not very interested in learning (pfft), so I will be handing this over to a web type when the time comes. He said to pass on that this will never work on older browsers because of the methods I've used, and will probably never work on Safari because he'd rather smash himself in the face than deal with all that. FYI

Ha ha, love it! I'm in!

[X-Raym]

@White Tie
Hehehe, I feel your pain, I also tried to implement it ^^

Thing is that state is not return by the main TRACKS call.

That's why I wrote this Feature Request:
Web Browser Interface - Track infos

Meanwhile, you can actually get the TCP visibility for indivisual tracks this way:
GET/TRACK/1/B_SHOWINTCP
The returned string will be:
GET/TRACK/1/B_SHOWINTCP\t <index>

It has to be put in a request loop, and then results have to be parsed. Possible, but not very handy... That's why I made the FR referenced above.

Also, I format the Web Browser doc, this can help you while moding, a bit more readable than mode.js :P
https://github.com/ReaTeam/ReaScript...face_moding.md

[G-Sun]

Originally Posted by White Tie

Update 1st March 2017

• Sends! If the destination track has a custom colour, it will be used. I forgot to do hardware sends from non-master tracks, so that is To Do.
• Play button surround arc is now drawn using a different method (not that you should care.)
• Fixes for all the awful iOS problems, and Safari compatibility, by none other than our glorious leader himself.
• Fixes for other stuff.

Looking awesome !

[Jae.Thomas]

for some reason, I just cannot get this one to work.

On my laptop, or at home, my iphone will simply not control anything. Now the jog wheel isn't working either.

No idea why, but happy to test any future builds.

Thank you for your work!

[Sexan]

Could not connect on this one anymore,before I've had to change ports back and forward and now it simply does not want to connect. Other interfaces work perfectly.
I cant even connect to it locally (computer browser)

Android

[Justin]

Originally Posted by Sexan

Could not connect on this one anymore,before I've had to change ports back and forward and now it simply does not want to connect. Other interfaces work without.
I cant even connect to it locally (computer browser)

Android

Edit: nm, WT is fixing

[esosotericmetal]

Originally Posted by Jason Brian Merrill

for some reason, I just cannot get this one to work.

On my laptop, or at home, my iphone will simply not control anything. Now the jog wheel isn't working either.

No idea why, but happy to test any future builds.

Thank you for your work!

I can't get this to work at all either. Tried on my ipad as well as desktop.

[White Tie]

Ooops, looks like I did a bad thing, sorry

1/03/17b now in the first post.

[Jae.Thomas]

Originally Posted by White Tie

Ooops, looks like I did a bad thing, sorry

1/03/17b now in the first post.

seems to be working. It always gives me the warning message about no tracks being armed, though.

[hitmaker88]

Originally Posted by Jason Brian Merrill

for some reason, I just cannot get this one to work.

On my laptop, or at home, my iphone will simply not control anything. Now the jog wheel isn't working either.

No idea why, but happy to test any future builds.

Thank you for your work!

I'm having the same issues on both safari and chrome. I have the same (latest) iOS on my two iPads and my iPhone and I get different errors on all three devices. On my studio iPad I don't see any tracks and none of the buttons or jog wheel is working. The graphics are not right either, the text is shown over the top buttons.
On my iPhone, I cannot set markers, and on my second iPad the markers and jog wheel is not working. The index web interface is fully working on all three devices.

[G-Sun]

Seems like markers don't line up correct here:

PC:


Android > Chrome:

[White Tie]

Originally Posted by mb945

I just tried with the newest 14_4_17b and still no luck. Tried reloading the page several times.
See licecaps:
Not working with fancier:

Edit : no, that's not it. Thinking.

Originally Posted by G-Sun

Android > Chrome:

I can't replicate that, lets get the easy answer out of the way: could you please confirm that you're absolutely at the marker, that you got there by hitting next or previous?.

[G-Sun]

Originally Posted by White Tie

I can't replicate that, lets get the easy answer out of the way: could you please confirm that you're absolutely at the marker, that you got there by hitting next or previous?.

98% sure. I'll check again

[henge1]

Haven't read the whole thread...is this available now? If so how is it installed?

[White Tie]

Originally Posted by henge1

Haven't read the whole thread...is this available now?

Right there in the first post.

Installation is the same as any other reaper_www : show REAPER resource path > reaper_www_root. Unzip the html file into there. Then its preferences > Control/OSC/web > Web browser interface > blah blah blah.

[henge1]

Originally Posted by White Tie

Right there in the first post.

Installation is the same as any other reaper_www : show REAPER resource path > reaper_www_root. Unzip the html file into there. Then its preferences > Control/OSC/web > Web browser interface > blah blah blah.

Doh! Thanks WT. Gorgeous work as usual!

[G-Sun]

Marker-issues:

[White Tie]

Thanks for that, but there's still a straw I'm grasping at : you could be at the same displayed ruler-unit time position as a marker and still not be on the marker if you're not exactly at the marker position as measured to Reaper's internal accuracy. The best way to be sure of that is to navigate to the marker using next or previous; did you do that?

...please say no...

[G-Sun]

Originally Posted by White Tie

Thanks for that, but there's still a straw I'm grasping at : you could be at the same displayed ruler-unit time position as a marker and still not be on the marker if you're not exactly at the marker position as measured to Reaper's internal accuracy. The best way to be sure of that is to navigate to the marker using next or previous; did you do that?

...please say no...

Well, I did navigate by next/prev marker..

Notice the missing markers as well

[G-Sun]

btw, you and Cockos has done greate work with the web-interface!
It changed my workflow, as now I'm monitoring through Reaper
for easy tweaking of volumes from web-interface.

A few things I miss:
- Peak value/meter for armed track
(I'm setting my levels in the booth, and it would be so helpful to be able to set gain without needing to look at my pc-monitor)
- Peak value reset all tracks
- A way to quickly access/look at armed track(s) from main navigation

[White Tie]

Originally Posted by G-Sun

Well, I did navigate by next/prev marker..

Notice the missing markers as well

Oh balls. Well, I'm out of ideas on why that would be. Does it always do this? If you start a blank project and drop in one marker does it do it?

Originally Posted by G-Sun

- Peak value/meter for armed track

Roger that, adding to the to-do.

Originally Posted by G-Sun

- Peak value reset all tracks

Yes that's planned.

Originally Posted by G-Sun

- A way to quickly access/look at armed track(s) from main navigation

I did mess about with having a click on the 'tracks are armed' indicator do precisely that, but it broke stuff. I may revisit it if I find hitherto unknown reserves of talent.

[White Tie]

G-Sun - I can now replicate what looks like your marker problem, by changing the ruler time unit, so I'll get onto fixing that. Hopefully that'll be that

Originally Posted by Robert Randolph

an undo button would be immensely useful.

Originally Posted by G-Sun

- Peak value reset all tracks

These are now both in; please see post #1 for the latest update.

[G-Sun]

Originally Posted by White Tie

Update 30th April 2017

• Fixed bug(?) - as described by G-Sun.
• Fixed bug - Markers not appearing if dropped while the transport was stopped.

Thank you!
Sorry, been off DAW

Clear clip: Working fine.
However, clip-indicator did not work here. Peaked red on pc, but not on web-interface.
I see no markers/regions at all now.
Jog-wheel is behaving strange.
Navigate next/prev marker is working fine.

Note: Why do you give snap on/off priority?
I can't think of a situation I'd need it from the interface.

[hopi]

clip indicators... basically working OK here in iPhone remote and PC reaper

I get the indication on the track but have to clear only from the hamburger menu...

can't clear from the track itself... I guess that is just how it works, eh?

would not mind seeing the clip indicators in both locations be a brighter red color... on the track it's sort of OK as long as the track color is not near the red of the clip indicator... but on the top menu... I would wish it would really light up when there is a clip and then go back to darker when there is not clip active...

[G-Sun]

Originally Posted by hopi

would not mind seeing the clip indicators in both locations be a brighter red color... on the track it's sort of OK as long as the track color is not near the red of the clip indicator... but on the top menu... I would wish it would really light up when there is a clip and then go back to darker when there is not clip active...

Good idea. Navigation is where I spend 95% of the time.

And/or, maybe a "show all tracks(s)/only armed track(s)" toggle?
to have it close by

[White Tie]

Please grab latest version from post #1 which has bug fixes and, more importantly, maybe maybe MAYBE will have solved the iOS frame rate troubles. Fingers crossed!

Originally Posted by G-Sun

Why do you give snap on/off priority?

Have you ever made a feature request without giving a clear reason why you need it? Well, this is what happens if that request is filled : I just ¯\_(ツ)_/¯ and we both wonder why

Originally Posted by hopi

can't clear from the track itself... I guess that is just how it works, eh?

would not mind seeing the clip indicators in both locations be a brighter red color.

Yeah, I don't want to start putting tiny click zones on the track panels, so that's going to just be a toolbar job.

I'll look at adding some redness-aware intelligence to the colouring.

[hopi]

Thanks WT... IMO you are doing a fantastic job!

[TeaBone]

Hey there!
First off, I have to say: This web-interface is a godsend! Years ago I tried to get that kind of functionality & workflow with TouchOSC, but that was far from the beautiful thing White Tie working on!

But I have some strange behaviour on my iPhone 6s (Safari, iOS 10.3.1): While each new version you uploaded was recognized by Safari and rendered correctly, only the version of March 1st is communicating with REAPER (I kept all versions since that one for troubleshooting). The following versions neither show the song position, nor does REAPER receive any commands. Every other layout (the built-in pages) works fine though (or at least as intended).

Does anyone else experience that behaviour? Any suggestions?

Nevertheless I very much enjoy and appreciate your work, White Tie!

Cheers
Christian

[javiramallo]

WT, thanks for this amazing tool. In my environment is helping me a lot.

Javier.

[Tommykry]

Hello, I've searched and could not find an answer anywhere.
This is the "Fancier" Web interface template.
It's the button on the top far right that has red arrows pointing up and green arrows pointing down (right next to the clear peaks button)
I even opened the html file to try and look to see what they do, but was not able to figure it out.
Even asked on one of Johns Reaperblog livestreams, he even took a look and wasn't sure either.
I just want to see if its something useful i will use.
Thanks everybody!

[GenSeck]

Hello!
Can you help me find what's wrong?

I run web-interface Fancier to drive my band's sound. I use regions as tracks for playlist in project, but there is no regions are show in Fancier?

What am I doing wrong?

I attached screenshots to show how it is in my project