February 16, 2019 at 9:48 am #417866
Carl, you’re missing it please take another look. It is in both files I uploaded. Keep in mind that in the exported sample, External-Player.zip you will find the correct index.html in the extern\webwin40 folder. You seem to be looking in the wrong place. Do not mess with the Lectora stuff.
Also, in the second zip (CustomizedPlayer) look in, or better yet, do a search in the index.html file. The preload attribute it is certainly there in the video tag.
What I posted is exactly what you indicated you needed for that project. I wouldn’t mess to much with it. It is a concise as possible and simply reusable, even for a novice.
If you are planning on adding an entire copy of the MediaElement.js source files keep in mind that without knowing which files to include/remove it will be way heavier than necessary. That’s why I stripped out everything that was not needed. Why not just work with Lectora’s, it’s the same thing. If you want to work with Lectora’s you’ll just have to figure out how to traverse the dom to get at it.February 19, 2019 at 3:53 pm #418039
What I wasn’t getting was that you specifically mean the index.html inside the Web Window object. Yes, that worked. I was also able to add a “progress” attribute to it to display the progress bar.
The one thing I still can’t do is the equivalent of the “OnDonePlaying” action in Lectora. I’m sure it is possible, but it isn’t obvious to me how without a lot of research. I can’t find any documentation in several searches on exactly what events the mediaelement.js player generates (and specifically what they’re named), and also it’s not clear to me how to have Lectora catch them. I know that’s documented somewhere.
I’m also going to have to re-encode all the video to fit on the page since the web window doesn’t like being resized, but that’s trivial.
Thanks.February 19, 2019 at 4:40 pm #418044
One more thing I noticed: if I place the HTML output on a specific (internal) IIS server, all the player controls except the skipback you wrote for me (thank you!) are not shown? It works fine locally and on SCORM Cloud. Some IIS setting?
Question: is there any way to turn autoplay on? I hate to keep bothering you but I don’t see any clear docs on the mediaelement object. Can you point me to some? I suppose I could try to decode the normal Lectora code ….February 20, 2019 at 9:34 am #418121
There’s a lot there so I will work on trying to answer it all. Most of it is doable (Auto play, onEnd action). Not too sure about the issue on your server, I don’t think the information services should be an issue. Keep in mind that returning the progress bar will give the participant the ability to skip ahead. I can’t take the credit for the skip back script as it was lifted directly from the demo, however, you’re welcome for any help I have provided. What is happening when you resize the web window? I did not have an issue. Remember, you’ll need to change the video size (in the web window html.index) to match the height and width of your video. From there, you should be able to make the web window size in Lectora match that height and width.
I’ll work on the auto-play and having the MediaElement player send an onEnd action to Lectora’s action system. I’m a little busy right at this moment so it might take a bit to get back, keep checking.February 20, 2019 at 10:11 am #418124
Darrel, while I really appreciate your volunteering to do all that, I was really asking for a link to the mediaelements.js documentation so I could do it myself. I like learning this stuff.
When I resized the window in testing, the video within did not resize, and the controls were not reachable because the window clipped the video (and thus the controls were were outside the frame of the webwindow, off the bottom).
Edit: I can put the progress bar in, but then cover it with an invisible rectangle, right?
February 20, 2019 at 10:58 am #418130
- This reply was modified 5 months, 4 weeks ago by CarlFink . Reason: Left something out
Continuing to add: I just used your modified mediaelements code on another course. I had encoded the DVD video down to 480×360. If I make the web window that exact size, it works (although of course the video quality itself is quite low). If I increase the size of the web window without changing the script, the web window resizes, but the video within it remains 480×360 and leaves a huge gap. That’s what I was referring to when I wrote about it not wanting to resize–the video itself does not scale, only the div (?) it’s enclosed in. (Obviously, I haven’t looked into how Lectora implements web windows.)February 20, 2019 at 11:31 am #418132
Hmm, not sure what is going on with your resizing issue. As long as the actual video file height and width match those in the web window html.index. <video> tag and the size of web window in Lectora there should be no issue. Just make sure the actual video is the size you want the web window in Lectora to be. Boy, that sounds confusing, I hope I explained it sufficiently.
By the way, the Auto play property will work just fine once it’s uploaded to your server. It wont work locally. If you do a lot of custom work I strongly suggest you set up a local server, such as WAMP on your authoring computer so you can see exactly how your work will function on a real server. Okay, I’m going off on a tangent. Time to refocus.
In the sample I attached, because I was not attaching the action to anything, I added a group and put the action in the group. I could have called the action directly (action299 in my sample) however, I decided to call the group (og290 in my sample) instead. I could have placed any number of actions in that group. By the way, the Lectora awt is in the zip as well.
Good luck and I hope this helps.
Attachments:February 20, 2019 at 12:44 pm #418167
OK, my participation here is now the forum equivalent of a run-on sentence. I just can’t stop adding stuff.
Where would you like bug reports? Because I just found one, and I don’t see any mention of it being fixed in V18. (Not a video bug, a responsive design bug.)
I had found that site, actually, but the docs involved are very … let’s say, as a technical writer who has written and edited many manuals over some decades now, I would not be proud of that documentation. I think I’ll look into buying a book. I have a credit sitting around somewhere for a free computer ebook.
I’ll try your file this afternoon. Thank you, again.February 21, 2019 at 4:45 pm #418356
Interesting behavior. The fullscreen button on the player works fine when published as HTML, or when I preview the page in the browser. However, when I publish to AICC it works neither in SCORM Cloud nor in Success Factors LMS. In those settings (in the exact same browser) the fullscreen button does nothing except change its own appearance when clicked.
Annoying.February 21, 2019 at 5:32 pm #418370
Solved the resizing issue, at least partly.
If you swap “auto” to “responsive” then resizing the Web Window also resizes the video. Otherwise, not.
One incompatibility: if you put scrollbars on “Auto” it causes an ugly white border around the bottom and right of the edges of the video. If you leave that off it just letterboxes (black borders) whenever the Web Window aspect ratio is not identical to the video’s.February 21, 2019 at 9:01 pm #418372
Odd behavior in the LMS. I don’t think that should be happening. What you describe is the feature triggering (hence the change in the icon) but it is not going full screen, correct? Until I can test, the only thing I can think of is that your LMS is set to open a course in a new window and maybe that is somehow effecting the full screen feature from working properly? Interesting.
You can accomplish most, if not all, of these things by manipulating the built in mediaelement player, however, the folks at Trivantis/StoneCalibre have made it ridiculously difficult by the way they implement it (don’t get me started..). It is, therefore, MUCH easier to just pop in your own version of the player when needed to give yourself simple and complete control over all it’s features.February 21, 2019 at 9:16 pm #418374
Oh, I forgot to mention. It is not good practice to change anything inside a third party library (i.e. mediaelement.min.js). The “stretching” parameter should be added inside the <video> tag like autoplay, height, width, etc. For example stretching = “responsive”.
One other thing I left out above is that stretching can also be set to “none”.February 22, 2019 at 10:44 am #418383
I should clarify: my intent with “Responsive” was both to allow resizing the video by dragging the resize handles on the Web Window, and also to allow programmatic size changes to emulate fullscreen by just setting the window to fill the browser. I’d also have to handle the window resizing event for the browser window itself, of course, to make the video continue to fit.
Obviously I haven’t done that yet, but that’s where my head was going.March 18, 2019 at 8:41 pm #420462
I think I’ll look into buying a book.
You must be logged in to reply to this topic.