-
Notifications
You must be signed in to change notification settings - Fork 992
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Adding Play-Only-Mode to MusicBlocks #4320
Conversation
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
@pikurasa What do you think? Maybe we want a message explaining that we are in playback only mode and that to enjoy the whole MB experience, you need a larger display? |
I agree. Would this be the usual method, or a more persistent message? Also, do we want all of the buttons at the bottom-right of the screen? Home could be helpful. Perhaps expand and collapse could be helpful. I doubt zoom in and zoom out will be helpful. We may consider:
Thoughts? |
@pikurasa sure that would make sure that the user gets the best of the experience that MusicBlocks can provide and about the expand and collapse i don't think it makes much of a sense to add that for a playback mode feature since its mostly just related to listening how the music works. |
@walterbender @pikurasa Other than this for the dropwdown menu that we talked about you know of changing auxiliary menu with the dropdown one, i guess we can use the same element that has been used for the select language toggle, this would ensure uniformity across the codebase. What are your thoughts on this? |
If I'm following your proposal correctly, yes, I think it would be good to use that. Certainly, we don't want to create any new methods. |
sure then i'll implement that and update this accordingly |
…into play-only-mode
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
I suspect that the recently landed changes to the scaling the toolbars should take care of the white-on-white problem. Maybe do a rebase? |
sure i'll try to rebase and check whether the issue still persists if it does i'll try fixing it in this pr itself |
…into play-only-mode
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
I have removed the buttons for the play only mode that were present on the bottom of the screen on the right hand side the only thing left to work upon is the dropdown menu which i will be working upon soon. |
@walterbender i am still encountering the issue where the auxiliary menu falls down below on the canvas as @pikurasa mentioned even after rebasing. Should i fix the same in this pr itself? |
Other than that i am also encountering another issue that is whenever the width of the device falls below 400px the icons present on the main menu are not visible. I'll also try to fix the same here as this also comes under the scope of play only mode as the resolution in this is less than 768px which is the cutoff width for the play-only-mode to be automatically activated. Untitled.video.-.Made.with.Clipchamp.2.mp4 |
@walterbender I have made the changes to the issue that i have highlighted above where the main menu is not visible under the screen resolution having width below 400px. Please review whether there could be anymore changes that are needed to fixing this issue. Untitled.video.-.Made.with.Clipchamp.3.mp4 |
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
It is very strange that you were still seeing the toolbar problem. I'll investigate. |
i'll test it and update it to you accordingly |
I tested it locally and it seems to work fine on my side. Could you please recheck it once again? Untitled.video.-.Made.with.Clipchamp.4.mp4 |
Just tested again. This time with Chromium. As soon as my browser window < 770 pixels wide, playback-only-mode triggers. |
Yeah 768 pixels is what i have kept as the trigger point for the play only mode to be triggered as most tablets have the lowest screen width of 768 and that's where resolution for phones begin |
So I guess it is working... |
I think that should be sufficient. Some old laptops have a width of 1280, and 768 is well enough above that. I think you are aware of this, but the toolbar is still a little funny, especially in the range where it is transitioning to play only. I didn't try to figure out what the range is, but I could, if you need me to. |
yes i do know about the toolbar i haven't fixed it yet since there will not be an advanced mode in play only mode and there will only be a dropdown menu for that as we discussed so this issue won't be arising anymore. I have just been a bit busy with some Mb-v4 stuff i will be updating and marking this pr as ready very soon |
/me will try to reproduce the toolbar issue. I hadn't been able to. |
@walterbender the issue still persists |
but it won't exist in play only mode as the auxiliary menu won't be present |
@walterbender @pikurasa another doubt i have is should we make horizontal scrolling enabled by default in play only mode as it would be a much more accessible feature to have on a smart phone or on small screens in general while viewing the project? |
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
@pikurasa the range for the auxiliary menu breaking is a screen width of 1171 px whenever it falls below that it breaks |
@justin212407 when this is ready again for review, please let us know. If you have questions, please let us know. In the meantime, it may be nice to create a table of the intended behavior at different screensizes. We can include it somewhere in the MB documentation to help ourselves with future maintenance (by understanding how everything's suppose to work). Here's a sketch to get you started:
|
Sure @pikurasa I will raise another pr which defines all the functions taking place at different screen sizes |
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
❌ Some Jest tests failed. Please check the logs and fix the issues before merging. Failed Tests:
|
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
❌ Some Jest tests failed. Please check the logs and fix the issues before merging. Failed Tests:
|
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
❌ Some Jest tests failed. Please check the logs and fix the issues before merging. Failed Tests:
|
…into play-only-mode
✅ All Jest tests passed! This PR is ready to merge. |
@pikurasa @justin212407 should we merge this PR and raise a separate one for the other enhancements? |
@walterbender just give me a bit more time it is producing some breaking changes recently let me fix that and then we can definitely go ahead and merge it and then i'll raise another pr for the enhancements |
…into play-only-mode
✅ All Jest tests passed! This PR is ready to merge. |
Signed-off-by: Justin Charles <charlesjustin2124@gmail.com>
✅ All Jest tests passed! This PR is ready to merge. |
@walterbender @pikurasa I have fixed all the breaking changes if you want you can go ahead and merge it and i will create another pr for the enhancements. Please review this one and let me know if you would like any more changes to this branch itself. |
So you'll address the toolbar issues in a separate PR? |
which one are you talking about the one where the aux menu was breaking or creating the toolbar in the play only mode ?
|
so should I fix this in play only mode in this pr itself? |
I am still not sure when the regression occurred. But I just wanted to confirm that you were aware of these issues. We can address them in a separate PR. |
sure i will be raising two more prs then one for the play-only-mode enhancements and the other for fixing the breaking of aux menu |
I have made some changes regarding the play-only-mode features, basically now the palette goes away whenever the play-only-mode is triggered. This mode is triggered automatically when the screen size goes below 768px in width or 600px in height. These are the basic changes i have made till now. I'll be adding more features to this to make this a better working feature in the upcoming days after taking inputs on what should be added. For now it looks something like this.
Untitled.video.-.Made.with.Clipchamp.1.mp4
@walterbender @pikurasa I am still not sure on what features should be added to the dropdown menu. Please take a look at this till now and suggest if this looks good.