-
-
Notifications
You must be signed in to change notification settings - Fork 30
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
Add Seeking With Slider For tvOS #49
Comments
Hello @esegebart 🙈 I'm so sorry but I didn't really have time to work on any tvOS support even though I promised so 🥺 Here are are the steps I do to contribute to the project:
In order to test them:
Please let me know if you stumble on anything so I can improve those instructions! Thank you very much and once again I am so sorry! |
Hey @criszz77 can you add this contributing info in Readme file |
@criszz77 It is totally okay! This will be a good chance for me to contribute! So do I need to have a separate example project to see the changes run? And that is the yarn path-to-fork? Ok I think I understand now. |
@esegebart I updated my original post, I hope it's better now and didn't add to any confusion. Let me know how it goes! I will answer you ASAP. |
@criszz77 Thank you! That makes more sense now! Going to try some changes and see how it goes! So these are a couple things I was thinking about:
If these things sound ok to you, I will be happy to try working on them. :) |
To conclude, we also need to make it work with or without https://github.com/criszz77/react-native-media-console/blob/master/src/OSSupport/PlatformSupport.tsx |
Ah yeah, that's what I am hoping I don't do is mess up support for anything else. But it will be able to be tested. :)
I saw the overlay and have the latest version, but the overlay is like a gradient color - where the dark is on the edges a lot but not the whole screen. When I look at YouTube they have a very dark solid overlay, whereas this is like a gradient/vignette style and isn't dark enough if there are white areas on the screen (like a large screen) which I had encountered). On smaller screens, it is ok. I was looking at that Overlay component so that's super exciting it's
already there!
So I will try and get something working! And if it will work with both that would be sweet, if it doesn't we can figure out where to go from there.
Silly question, but what is POC?
…On Mon, Feb 6, 2023, 11:53 AM Ovidiu Cristescu ***@***.***> wrote:
@esegebart <https://github.com/esegebart>
1.
That actually sounds good! Any tvOS support is welcomed, unfortunately
I don't have the time to invest too much time in this, but I can give a
helping hand if you have something in mind and actually manage to come up
with a POC or something. Funny but I really don't use TV at all? So I also
don't have a great idea of how user experience should be.
2.
There was also this PR: #43
<#43>
It aimed to solve the issue of buttons on white background. Should be
available with the newest version. Isn't this good enough? Do you have a
better suggestion?
1. Hmm, I noticed a bunch of work at react-native-tvOS regarding the
focus.
I'm pretty much not familiar with tvOS but we also need to make it work
with or without tvOS, so importing useTVEventHandler in plain react-native
projects might crash the app. I guess we can look into it to improve it
once we have something working
—
Reply to this email directly, view it on GitHub
<#49 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AIVRSFF6XRGUGTRS7X367HTWWE3CHANCNFSM6AAAAAAUPGYEPM>
.
You are receiving this because you were mentioned.Message ID:
***@***.***>
|
Of course, don't worry. Give it a try, see what you're able to do and if you got something working I'll step in and help you finish. Oh POC just stands for Proof Of Concept :D |
Okay, great! I will see what I can do. :) |
Awesome! I will see what I can do :)
…On Mon, Feb 6, 2023 at 2:57 PM Ovidiu Cristescu ***@***.***> wrote:
Of course, don't worry. Give it a try, see what you're able to do and if
you got something working I'll step in and help you finish.
Oh POC just stands for Proof Of Concept :D
—
Reply to this email directly, view it on GitHub
<#49 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AIVRSFD7NQGLPKZEUZZKZHLWWFQTLANCNFSM6AAAAAAUPGYEPM>
.
You are receiving this because you were mentioned.Message ID:
***@***.***>
|
@criszz77 Okay so I followed these steps - ran yarn prepare in react-native-media-console, deleted the node_modules from the react-native-media-console project and then ran yarn [path-to-esegebart/react-native-media-console] on my local machine. And I get an error that the project is not found. I tried the absolute path and the relative path. Is there something I am doing wrong? I do use yarn. |
I'm sorry, I guess it's |
Okay perfect! :) I will try that now. |
@criszz77 Ahh! I test my first changes! This is soooo exciting! |
@esegebart So happy to hear that! Let me know if I can help you with anything else! Hope you'll have fun |
@criszz77 Okay I have the small change for the opacity being darker on the overlay. I sent over a pull request to you. |
@criszz77 I have the idea sorted out kind of for this feature. The only thing I can't really figure out is how to get it to continuously skip at that seeking interval until the user either pushes the button again to go faster, or pushes play to stop where they are. And also still need to update the button to have 2x, 3x, 4x on the arrow button. Right now I have it skipping at the proper intervals.. for example, I press it once and it does the default rewindTime. I push it twice and it calculates a percentage of the video (1%) and subtracts from current time. 3rd press is 3% of the video. 4th press is 5% of the video. Could you maybe check it out and tell me what I might need to do to get it to repeat the skipping interval until either the user presses play or hits the button again and tell me which way to go? NOTE: This only works for rewind time button currently, so you have move the slider to the middle and then start pushing the rewind button. I added in some console logs to show the time and the calculations too to see what it is doing * |
@esegebart Yeah, sure, I was planning to spend some time on this module this weekend and/or the next one. Have you got a fork prepared? |
@criszz77 I have it committed to my branch! Do I have to do anything special? It's also not cleaned up yet, just trying to get it working |
@esegebart Open a pull request. Thank you so much for your time! I really appreciate it! |
@criszz77 Woohoo! :) Yes absolutely, this was a very interesting problem and I thank you for letting me be a part of it! |
@criszz77 By the way, the updated react native tvos has long presses for the arrow keys but I couldn't figure out how to get them to register. I updated to the new version that has them - but just another option to look at if you need it. I think the button presses will be just fine. :) |
@esegebart Ohh, all right. I'll have to catch up with the tvOS environment, as I don't have any experience, but sure it will be fun! Anything else I should know before you go off on the weekend? |
@criszz77 All I'm trying to accomplish is for them to push the button one time to skip 15 sec, push it twice and it will keep skipping at 1% of video length, push a third time and it will skip 3%, push it 4 times and it skips 5%. When they push it a 5th time it just goes back to playing. I thought maybe having 2x, 3x and 4x on the buttons will be a nice indicator of what's happening. And if they push play it will stop the skipping. Here's the link to where I asked Doug about the long presses: react-native-tvos/react-native-tvos#409 And then here is where it was added: react-native-tvos/react-native-tvos@1f1f338 Pressing and holding right or left arrow key on the rewind/FF button for it to keep skipping would be great if it progressively speeds up after like 2sec of it being held it kicks into 2x after 5sec it kicks into 3x and 7sec kicks into 4x speed. That would be more familiar for user, but the button pressing is also good. I just don't think there is a way to focus the seekbar with tvos so using the rewind and fast forward buttons is good. But you are much better at React Native than I so there may be is a way but I couldn't solve it 😎 Thank you so much!!! |
@criszz77 Hi! Just wondering if you had a chance to look at this and can maybe give me some direction to continue working on it, or if you had worked on it yourself? :) |
Hey @esegebart Is this linked to #59 ? I am so sorry but I was so busy lately 🙈 I was hoping I could take a look this weekend, but the odds are against me. 🥺 |
Hey @esegebart I just tried it out and the problems seems to be the same :( I will try again, maybe it's an issue on my side. |
@LunatiqueCoder Oh no, that is a bummer to hear. |
@LunatiqueCoder Did you find out if it is still on the react native tvos side? |
Hey @esegebart, I'm sorry I'm moving so hard but I also got involved with other projects 🙈 I'll try again this weekend hopefully. :) 🙏 |
@LunatiqueCoder Okay! I was just checking in with you, I appreciate all of your help with this. I know you are a busy person!! :) |
@LunatiqueCoder I saw this comment a few days ago react-native-tvos/react-native-tvos#409 (comment) Saying it was continuing to spawn the same event and didn't know when the key was being released. And Doug said this in the comment below him: could this be what we needed?? |
Hey @esegebart That could be something :) I'm finally finishing with one of my projects so I will have more time starting this week. I really hope to release a new version this weekend if everything goes well. 🙏 Thanks for the patience! |
So exciting! I just wanted to try and stay involved and keep track of what was happening with the tvOS repo. :) Congrats on your project! I look forward to seeing if this helps for the slider! ❤️ |
@esegebart I had a look and indeed, it gets better, but it's still not perfect. We still need to handle Source: https://reactnative.dev/docs/pressable#how-it-works However, with a few workarounds, I think you can achieve this without changing |
@LunatiqueCoder Then that's what I will have to do! You are so awesome 😎 And thank you so much for the diagram and resources. You have been so great to work with and I cannot thank you enough for teaching me open source! I'll be back to contribute more! |
@LunatiqueCoder So the longRight is now firing before the button is released, I am circling back to this and am going to finish it up. I just wanted to ask you again so I can refresh my memory, will the onPressOut handling code be inside react-native-media-console? I am thinking about longRight/longLeft - I will start seeking at 1x, after 2 second increase to 2x, after 2 seconds increase to 4x. And then I handle the onPressOut to resume playing. Is that where I would put this code is in PlayPause? Since I will be using the rewind and fast forward buttons? Thanks! |
Hello @esegebart Yeah I can see they improved it. 🤔 I'll take a look sometime this weekend and come back with a response. |
@esegebart Ok! I am going to keep working on it in the meantime. I am using the 0.68.8-0 and tested the longRight and it fires promptly, and not after the button is released! Woohoo! |
@LunatiqueCoder OMGSH I JUST ABOUT HAVE IT. I am skipping forward when the right arrow is pressed, it updates the current time, and now I just need it to stop at the spot when I push play again bc it is currently going back to the original spot. EDIT: I GOT IT!!!!! It is skipping forward in progressive speed with the button presses! :) :) |
@esegebart Really? I'm so happy for you haha! Did you make any changes to |
@LunatiqueCoder I wrote the logic inside |
@esegebart Yeah I would like to see that. I think that we can pass props to each button if you want by changing the project so you would just pass |
@LunatiqueCoder Awesome, let me try and finish working out a doing the rewind also and I'll send it to you. I have a useEffect and a function that do stuff when the button is pressed. Trying to get it to just do 15s on the first press and then start the skipping forward on the second press. Will let you know when I get it finished :)
|
@LunatiqueCoder OKAY sooo I had another great idea! I saw you have a prop to disable seek bar controls. Do you think I could read the remote events on my video player end and add my own slider that pops open when the overlay pops open? Idk just spitballing here as a plan B.
|
I believe you shouldnbe able to do it, yes. |
@LunatiqueCoder Nice, okay. Well I am pretty happy with how things look with what I've been working on. I will get with you tomorrow and should have something ready then. :) Thanks Ovidiu! |
Oh don’t worry, take your time. No pressure, this is open source 👌 |
@LunatiqueCoder Okay, I pushed my changes to my |
@LunatiqueCoder Scratch that - I made it even better. I added skip buttons in addition to rewind / fastforward so one can skip only 15 seconds like you previously had it but using diff icons and then the rewind fast forward icons move the seek bar continously. It is pushed to my branch so check it out when you have time! And this worked on Android too so this could def benefit everyone! :) Here is a clip, let me know what you think!!! 😄 screen-capture.6.webm |
@LunatiqueCoder I forgot to add white to the icons and remove an error I had in the local repo! I just pushed those changes, but I just want to pull request the last commit I just did. Is that possible? |
@LunatiqueCoder I think I might have been looking at an old one from February ! Lol. |
@esegebart I believe if you are familiar with rebasing, yes, that should be possible. But it can be tricky if it's the first time. I can do it for you, but here are some relevant links: https://www.w3docs.com/snippets/git/how-to-combine-multiple-commits-into-one-with-3-steps.html |
@LunatiqueCoder Thanks! I actually think I was mistaken and looking at an old pull request. I am closed that one and am sending over a new one so you can test out my new stuff. :) |
@LunatiqueCoder Woohoo, I was also seeing the commits in reverse order so I thought I was missing my commits. Nope! Just me, looking at it wrong 🤦 😆 I made a new pull request so phew! What a good day :) Excited to hear your thoughts. The white on the icons is fixed now. |
Hello!
I wanted to add a suggestion to be able to seek using the slider bar with tvOS and remote. I didn't see it in the latest releases.
Could this be added in the future?
*Also - can you tell me how to grab this project and how to PR? I would like to try and do the seekbar thing, not sure if I can figure it out, but I can try!
Thank you!
The text was updated successfully, but these errors were encountered: