htmlVideoLoader htmlVideoControl

[John Robin Dove]

Hi Clifton,

My users should be able to choose whether to exploit a whole video, YouTube or otherwise, or just use part of it. They need to be able to redefine the start and end timecodes. For example start 15 seconds after the start and end twenty seconds before the end. My VB version does this successfully. When the user first clicks on play the video jumps to the desired start position and when the video gets to the desired end position it stops playing.

I have been trying to achieve this in theTB/Powerpac version. I have tried to use your Range Slider system but if I call htmlVideoControl("screen", "setValueSlider", "6000,18000") for example I get this message TypeError: this.rs is undefined (line number 1) . If the video is already playing there is no error message but there seems to be no effect. Maybe I have misunderstood something.

I have also tried to make my own system. The start position works but stopping the video before the end is more problematical. If I use pause or stop, the player doesn't seem to like it and becomes unstable. I cannot just use seek and pause to return it to the start position. I don't know why. I thought I had cracked it by unloading and reloading the video. Not ideal but good enough maybe. Strangely this does not work if the video is unloaded before it reaches the original end. It will not play again unless the page is reloaded. If it is allowed to go the end, unloading and reloading is not a problem.

I have also wasted a lot of time on a new Chrome problem today. I made various test apps to try to understand what was happening. Chrome will no longer allow the htmlVideoControl("screen", "play") to function with a YouTube video the first time the user clicks. You must use the official YouTube arrow button to start. Thereafter there is no problem and htmlVideoControl("screen", "play") functions normally. On one of my test apps all my buttons play, pause and stop were disabled. I discovered that in the Chrome cache there was something like Confidentiality Error displayed beside the address! I deleted this from the history and the page became normal again, except that the play button could not be used to start the video after loading. I think I can modify my program to incorporate this restriction. It only applies to YouTube videos. Other uploaded videos can be started normally. Just as well because they don't have an arrow button!

Two unrelated other things;



If I click on LearnToType.Today I cannot access my account. If I click on the link there is no problem. The word OR seems to imply that I have a choice but maybe not? I used Firefox to view your encryptions in session storage by the way. Actually my system is very similar. I use a new password key for every session.



When I upload a TB/Powerpac to my site,using FileZilla, I often see messages like this. They are always about cursors but not always the same one. It is absolutely not a problem but I wonder how it can happen.

John

[Clifton]

Hi John,
First off, it looks like the range-slider has a couple of bugs with respect to the appearance of the time tags which appear during operation. I've got a patch for this.

Here is an overview of how the range-slider is supposed to work:

1. Requires that a video be loaded before attempting to initialize a range. This insures that we have a reported duration value from the video. Generally, you should not attempt to initialize a "playBetween" immediately after calling htmlVideoLoader(). It is best to a have a small delay between loading and initializing the "playBetween". While you don't always have to a delay when using htmlVideoControl(), when using ranges, it is important. The delay only has to be about 500ms.
2. You play a range using htmlVideoControl( [videoName], "playBetween", "[start], [end]" );
   Example:
   

   Comment: To play "myVideoPlayer" from 5 to 15 seconds
   htmlVideoControl( "myVideoPlayer", "playBetween", "5000, 15000" );

3. To get the current slider values:
   

   htmlVideoControl( "myVideoPlayer", "getValueSlider" ); store return value in myResult;

4. To set the range slider positions:
   You can drag them with the mouse.
   OR:
   

   Comment: To set the range from 20 to 28 seconds.
   NOTE: This doesn't move the playhead; only the range positions. 
         To play use "playBetween" with no values.
   htmlVideoControl( "myVideoPlayer", "setValueSlider", "20000, 28000" );

WORKING EXAMPLE:

[Clifton]

Regarding the FileZilla dialogs:
It is good practice to always delete files in a destination BEFORE copying new ones. Otherwise, FileZilla will ask you what to do (overwrite, etc.). I usually zip all the files I want to upload in a particular file tree; then upload the zip file and extract it on the server. This is much faster than copying files onzee twzee to the server. Small uploads are okay that way, but larger clusters of files would be better uploaded as zip archives.

Just my two cents as to what is going on with the FTP stuff.
 

[John Robin Dove]

Thanks for your reply.

I read it and tried the working example on my tablet without problems. However now that I am on the pc I'm getting this error message Uncaught TypeError: Cannot read property 'options' of undefined (line number 1) when I click on Set Ranges Only.

Actually I am not sure that the Range Slider is what I need but I may be wrong about this. The function playBetween starts playing the video at a predetermined position and stops playing at another, right? What I need is to allow the user to play, pause and move around in the video at will between fixed start and end positions. So the video must always stop playing when it get to the predetermined end position. I do not use the player controls. I have replaced these with my own.

Re. uploading. That's just the point! I always delete a directory before uploading it again. Maybe FileZilla has problems deleting certain files?

[John Robin Dove]

UPDATE

I have once again made a test app but this has revealed yet more anomalies. In my main project jumping to a predetermined start position is not a problem but in the test app it is! The test app behaves as I want it to when it gets to the predetermined end i.e. it pauses and seeks to the start position again. When I try to do this in my main project I have all sorts of problems. As far as I can see the "continuous" return is somehow never switched off and continues to run sending back the last position of the video and refusing to allow this position to be modified.

Here is the test app https://www.mediacours.com/mediaplayer and the 9.01 zip is here https://www.mediacours.com/tb_examples/mediaPlayer.zip

Don't forget that in Chrome the start button (my start button) will not function initially. You have to use the YouTube button.

Thanks for your time.
John

UPDATE 2
On reflection I think that the 'start/positioning problem' in the test app may be to do with the system that displays the first frame of the video immediately after loading because if you play the video without repositioning the start, there is no problem. To reproduce the problem, reload the page, click on 'short = false', which sets short to true, click on the start button and the video almost starts but is then paused. But why is this not a problem in my main project I wonder? Perhaps I should give up trying to find out because 'it ain't broke'. Much better news about stopping before the end: my convoluted code is to blame. The mayhem caused was nothing to do with your media player. I think by tomorrow I'll have it fixed because I now know what was happening. So I may not need to use the Range Slider at all.

[John Robin Dove]

This is more complicated than I thought. I still don't know why I am able to start a video with the timecode set to more than 0 in my main app but not in a test app. It's true that my main app makes things very complicated but I don't know which complication solves the problem.

I think there must be a new rule that stipulates that the first time you play a YouTube video you must start at the beginning. I made a test app that gets around this problem https://www.mediacours.com/mediaplayer2. At least I thought it did but it turns out that it only works on Firefox. On Chrome the app gets 'blacklisted' in the Google Chrome browsing history and thereafter becomes unusable!



Here is the system I used:





I have now made another test app using a video on my site. Strangely the system does not work on this one and the sound is muted! I get the feeling all this is to do with 'confidentiality rules'. I notice your Set Ranges button still produces this error:



Is that part of the same problem?

Is the problem on Firefox related to the problem on Chrome?

[Clifton]

I'll try and look into what may be happening for you.

The error in my example with set ranges only occurs on the 3rd (pink) button and seems to happen in Chrome. And this is because the video has not loaded in such a way as to allow Chrome to load the ranges object. If you click either of the other two buttons first, then you can freely use the 3rd button without error because the video has begun to stream a bit. In reality, the set ranges object is not meant access setValueSlider on an unstreamed. Instead, just always use playBetween at least once and then all the other properties will just work. Users can also drag with the mouse the start and end positions. This may be something you are looking for?

A note about videos is that generally a video will begin playing if the audio is muted initially. The real issue with browser security is stop audio from irritating users unexpectedly. When you load a video, try setting the volume to 0 and you may be surprised at the results. However, the user will have to permit the audio at least the first time. On successive videos, the audio channel can be allowed because the user allowed it at least once. No matter what different browsers allow or not, it is best to realize that the most restrictive browser is where the future is likely to lay.

I generally always use Firefox for development exploration and Chrome for ensuring that everything will actually work in the final draft because Chrome tends to be a trend-setter browser.
 

[John Robin Dove]

Thanks Clifton,

Yes, the pink button does not cause an error on Firefox, only on Chrome.
I also use Firefox for development and I have set it to never store anything. As Chrome is the browser I use for other things, it stores everything. This is a problem for testing because even if I delete pages from the history they are still stored.
The problems starting a YouTube video are common to both Firefox and Chrome as far as I can tell.
I now, three days later, have a system that works on both Firefox and Chrome. I display this message.



Once the user has clicked on the official start button all restrictions appear to be lifted.

[Clifton]

Glad you got something working!