MiraWeb v1.2.3 released

Florian Demmer's icon

We are happy to announce a MiraWeb Update (v1.2.3) via the Max Package Manager and additionally released the accompanying xebra.js v1.2.2 via NPM. Please note that MiraWeb v1.2.3 requires Max 7.3.4, which can be downloaded here:
https://cycling74.com/downloads/

Apart from various enhancements and fixes this release noticeably improves and extends the performance and functionality of live.* UI objects and hardens the overall connection stability and communication between Max and MiraWeb clients. Additionally the project has moved to a monolithic repository setup, in order to make the process of contributing, testing and working on MiraWeb and the contained packages way more streamlined and accessible. For a more detailed overview of involved bugfixes and enhancements please refer to the changelog below or visit the GitHub repository (https://github.com/Cycling74/miraweb)

Thanks to everyone who contributed by reporting issues, requesting features and helping us shaping this release. We'd also like to thank @delucis for contributing a more elaborate example on how to utilize tunneling in conjunction with MiraWeb and xebra.js (see https://github.com/Cycling74/miraweb/tree/dev/packages/xebra.js/examples/07-tunneling). Your contributions and support are invaluable in order to improve the Open Source MiraWeb project even further! Thank you!

You can find MiraWeb v1.2.3 in the Max Package Manager.

The repository for MiraWeb and all contained packages is on GitHub: https://github.com/Cycling74/miraweb

Looking for the xebra.js package and documentation?

Xebra.js on NPM - https://www.npmjs.com/package/xebra.js
Xebra.js v1.2.2 Documentation - https://cycling74.github.io/xebra.js/

Enjoy!
-Florian

Change Log

Client Configuration: can delete the first character of client name in settings screen
Client Configuration: Client name persistent between launches and included in connect dialog
Client Configuration: respects viewmode if mira.frame is in a subpatcher
comment: no longer captures touch & click
hidden attribute: respected on patch reload
ignoreclick attribute: works as expected now
live.* UI objects: handle enum parameters
live.* UI objects: now use steps attribute
live.dial: fixes for float/int display
live.grid: implemented matrix mode
live.grid: improved UI interaction in client
live.tab: improved differences between finger drag vs mouse drag
live.text / live.tab: fixed Max hang when reloading patcher
live.text: fixes for the @mode attribute
live.text: pictures update when empty
mira.channel: fixed freeobject errors in Max when sending lists to client
mira.frame help patcher: basic tab appropriately shows in browser
mira.frame: focus message works
mira.motion: misc fixes
mira.status: client name persistence fixes
Miraweb repository: moved to single repo/project setup
multislider: appropriately snaps to integers
number box: properly handle float/int display
number box: supports non-decimal display formats
slider: accommodates relative attribute
umenu: popup text positioning improvements
xebra.js: enhanced tunneling example

Riccardo's icon

Hi!

I have a problem with the new package of MiraWeb 1.2.3. I installed the last update, but when I lunch "mira.frame" I see in Max windows "Mira Initialized, package version: 1.2.1" (the previous version). I tryed to delete and reinstall but it is the same.

Thanks,

Rick

Florian Demmer's icon

Hey Rick,

I can see that this might be a bit confusing in the beginning. While MiraWeb depends on and extends the functionality of Mira the two are distinct packages, each of them with their respective version number. We just released MiraWeb v1.2.3 which requires an installed version of Mira >= 1.2.1.

The console log you're seeing is originating from the Mira package:

Mira Initialized, package version: 1.2.1

This shows that you have the correct version of Mira installed. MiraWeb on the other hand does not post its version to the Max Window and instead only reports the available websocket connection:

websocket connection available at ws://192.168.1.7:8086

So yeah, given that I think you've set up everything correctly, are up to date (with MiraWeb 1.2.3 and Mira 1.2.1) and should be all good to go. Note that you can always check the installed version of all your packages via the Max Package Manager.

Please let us know if you have further questions, feedback or projects to share.

Thanks,
Florian

Riccardo's icon

Ah ok! Thanks so much for the answer Florian! Now is clear.

Thanks a lot,

Rick

Wetterberg's icon

Hi gang. I've been ill for ages, very much out of the loop. So glad to see this update here, will get back into the swing of things with Mira right away.

Florian, if there's anything you'd like to have constructed as a proof-of-concept or to showcase something cool, do let me know here :)

Florian Demmer's icon

@Wetterberg nice. Would be nice to get some feedback if the live.* improvements are smoothing things up for you. I remember you were making heavy use of live.grid so this might be of particular interest. Let us know!

Thanks!

Pedro Louzeiro's icon

Hi! Maybe this isn't the right place to be asking – and I apologise if that's the case – but I wonder: is there a way to prevent the my phone's screen from going to sleep when I'm connected to Miraweb in fullscreen?

I'm using Chrome on a Samsung J3. In the phone's definitions, I can set the screen wake-time to a maximum of 10 minutes. I'll need a bit more time than that.

In a few days, I'll be using Miraweb to convey messages to a musician during a performance which will last for about 15 minutes. The phone will just be sitting on his music stand and he won't be touching it. So, the screen will eventually go to sleep and he won't see any more messages...

And the worst part is: when turning the screen back on, Miraweb will no longer be in fullscreen!

Thanks for any suggestions. P.L.

Pedro Louzeiro's icon

Hello again!

I've found a solution, but I think there should be a simpler (user friendlier) one.

If you have other advices, I'm all ears. P.L.

Florian Demmer's icon

Hey Pedro.

Thanks for the input. AFAICT this has been captured here in company with a rotation lock feature request: https://github.com/Cycling74/miraweb/issues/39

Please feel free to add your use-case and solution there in order to make it more discoverable for other people. Given that this has come up a few times now, I guess it might be worth looking into and checking the x-platform status of the Wake Lock API, possible other solutions for the MiraWeb codebase or at least providing a guide/example on how to achieve this functionality.

Thanks again for your help!

Florian

shreeswifty's icon

Hey is it possible to have mira.frame and mira.channel existing on same page?

Florian Demmer's icon

@shreeswifty
yes they totally do. In fact u need a Mira.frame object to enable Mira in the first place and then mira.channel allows u to use arbitrary messaging through channels on top of that.

Hope that helps?
let me know if u have further questions

shreeswifty's icon

ok, is there an example of them both working on the same page? I just need a simple example of a text field and a slider to wrap my head around it

shreeswifty's icon

If the webpage from Mira.frame is generated on the fly how do i add the mira.channel components to be added to the page each time?

Florian Demmer's icon

@SHREESWIFTY

I guess I should clarify a bit more. mira.channel is not a UI object in that sense that it gets drawn/rendered to the browser as it is done for a toggle, message etc. It is an additional, API exposed communication channel without a visible representation per default.

To be a bit more precise: MiraWeb operates similar to Mira in that sense that supported objects are drawn and synced. Under the hood MiraWeb utilises Xebra.js in order to connect, communicate and make that all happen. We figured that apart from the UI interface synchronisation it might be worthwhile/a good opportunity to expose an API that allows to communicate with Max via channels => mira.channel in order to give access to a more flexible interface for arbitrary messaging. That API is exposed on the xebra.js level but does not have a visual representation in the rendered mira.frame when using the out of the box MiraWeb client/examples.

If you're a looking for an example of the API usage for this kind of stuff please look at the mira.channel help file that utilizes a simple webpage contained in the package (Miraweb/help/mira_channel_example.html)

Does this answer your question? Let me know if there any further questions, or if you feel like providing a clear use-case so we can figure out how to best approach this using the existing MiraWeb package/functionality.

Florian