Moodle in English: Prevent mp3 files opening in new tab

Prevent mp3 files opening in new tab

by Susanna Wesson - Friday, June 7, 2013, 11:01 PM

Hi,

Coincidentally or not, following a Moodle upgrade by my institution's administrator, mp3 files now open in a web player in a new tab instead of using the computer's own media player. Hotpot exercises containing wma files continue to open as before.

In addition, the css facelift add-on no longer applies.

My aim is for the students to view the Hotpot exercise and operate the audio simultaneously, which becomes difficult when the two are in different tabs. The same applies to mp4 files.

I believe we are still using Moodle 2.4.

Is there a means to prevent this happening (and to restore the css facelift) or have I missed the point of this new mode?

Thank you,
Susanna

Re: Prevent mp3 files opening in new tab

by Gordon Bateson - Saturday, June 8, 2013, 3:47 PM

Hi Susanna,
do you mean you upgraded from one version of Moodle 2.4 to another version of Moodle 2.4? Seems odd that a minor upgrade would break the media players in the way you describe.

Could you attach a sample HotPot quiz file to your next post to this forum?

Stan may be able to help with the "css facelift" issue. Are you there Stan?

regards
Gordon

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Susanna Wesson - Monday, June 10, 2013, 9:55 PM

Hi,

We upgraded to 2.4.4.

To prevent a flashplayer opening, my administrator unchecked ('plugins off') every option she could find on Moodle, including the Hotpot administration and Course administration filters and:

Site administration/Appearance/Media embedding/MP3 audio core media enable MP3 default.

This made no difference.

I would rather not have to embed mp3 files in the Hotpot exercise itself mainly for reasons of reliability (but also because I haven't worked out how to do it: 'insert media object' in the Hot Potatoes exercise does not seem to have any effect).

I have attached a Hotpot exercise. The audio file is obviously not the appropriate one because it was not the right size to upload.

Many thanks,

Susanna.

dawn-chorus.mp3

taxi_app.jqz

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Tuesday, June 11, 2013, 4:55 AM

Hi,

One further question, how did you put the css3_Facelift before the upgrade? Maybe during the upgrade the facelift file has been replaced by the default css during the new install?

Re: mp3

This is what you have in the jqz data file

a style="cursor: pointer; text-decoration: underline;" onclick="window.open('dawn-chorus.mp3');return false;

so it performs accordingly using the moodle routine/filters to use whatever the default player is. I'd suggest using the object tag or the square bracket notation.

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Friday, June 14, 2013, 12:12 AM

Hi Susanna,

I thought of a different solution.

Why don't you take advantage of the new HTML5 capabilities of the browsers? You'll not be dependent on any particular flash player or media filters.

If you put the below code in the exercises in the place where you want the audio, it will display natively in the browser. To do this, you have to convert the mp3 file to two other formats: one .m4a and one .ogg format.

<audio controls="controls" preload="metadata"><source src="dawn-chorus.m4a" type='audio/mp4; codecs="avc1.42E01E, mp4a.40.2"' /><source src="dawn-chorus.ogg" type='audio/ogg; codecs="vorbis"' />No HTML5 audio playback capabilities. No Flash fallback either!</audio>

Generate the exercise with the css3_Facelift and upload the .htm file through HotPot as usual. Also upload the two audio files: .m4a and .ogg.

Set the .htm file as main file and view the exercise. It works for me on our Uni. Moodle and should work for you too.

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Susanna Wesson - Friday, June 14, 2013, 2:03 AM

Hi Stan,

It definitely works (except in Internet Explorer, where I see 'source not valid') via Moodle. I'm going to test further (and now I have your book HHP I can spend all summer testing - many thanks: that was a great idea for holiday reading!)

As for my previous css3_Facelift problem, you were right: my administrator has made the necessary adjustments.

Many thanks,

Susanna.

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Friday, June 14, 2013, 3:13 AM

Hi Susanna,

Thanks for the feedback.

Strange. The code works in IE9 and IE10, but not in versions before 9. What is your version? Could you provide the URL to this exercise so I can 'diagnose the patient'?

Enjoy the book! BTW, how did you hear about it? I haven't yet mentioned it here on the HotPot forum (though I was planning to do so)

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Glenys Hanson - Friday, June 14, 2013, 3:53 AM

Hi everybody,

Stan is a bit shy about blowing his own whistle, so I'll do it for him. But I have to admit that as his "editor" I'm maybe a little biassed.

The book Susanna referred to is Hacking Hot Potatoes: The Cookbook.

Yep, you have to pay for the book but the e-versions are not very expensive.

Now, maybe Stan will curse me for pointing this out, but for those of you who are really strapped for cash, actually all the info about his neat "hacks" is actually available for free on his site: http://www.ewbooks.info/hotpot/tutorials

Cheers,

Glenys

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Friday, June 14, 2013, 5:19 AM

Thank you, Glenys.

The book has most of the tutorials improved, better organized and presented, plus certain new things. Basically, tweaking the interface, properly embedding multimedia and thinking from a pedagogical perspective. All in one place with lots of screenshots and live examples/demos on the support site.

I must thank Glenys for her hard work editing it!

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Susanna Wesson - Friday, June 14, 2013, 5:00 AM

As Glenys pointed out, I noticed the book on your website. (All cooks need one basic book they go back to again and again, so it's worth having!)

Re IE, I am using version 10 (although I stopped using it in class because the Javascript alerts I used for vocabulary definitions now make the student leave the exercise). I'm not sure how to give you the URL because my institution's website does not allow guests: is there another way? (I'm not an expert, which is why the book is a great help.)

Susanna.

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Friday, June 14, 2013, 5:33 AM

Hi Susanna,

Seems like IE can't find the file. Is your audio .mp4 or .m4a? Is there a dummy account for testers? We have a few such for our Uni. Moodle.

An alternative is to attach the file(s) to your next post.

Could you confirm it's working in Chrome, Firefox and Opera?

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Susanna Wesson - Friday, June 14, 2013, 4:18 PM

Hi,

I included .m4a and .ogg, as instructed.

We have no dummy account, so I have attached the Hotpot exercise and the .ogg file (but no .m4a because of the size restriction).

The audio works with Firefox (although the volume control doesn't work), Chrome and Opera.

Thank you for your help,

Susanna

dawn-chorus.ogg

taxi_app.jqz

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Friday, June 14, 2013, 5:01 PM

Hi Susanna,

Chrome and Firefox can play mp4 and ogg, Opera can play ogg files. IE can play only mp4/m4a. So if it's working in the other browsers, but not in IE, the problem must be something with the mp4/m4a file. (We're so used to IE bugs that we are immediately ready to dump it, but I think this is not the case here)

Do you see the exercise and the player and this message in IE: Error: Unsupported audio type or invalid file path. What do you actually see? Can you attach a screenshot of the exercise in IE?

Another possible reason may be that the server doesn't know how to play m4a. Try converting the m4a to mp4 and change the file extension in the code in the exercise. Then upload again the three files - the exercise plus the two audio files (see the attached screenshot of your exercise on our Moodle)

And the exercise working in IE10 on our Uni Moodle.

HTML5 is still new, unexplored grounds - I have explained the basics in the book pp.64-68.

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Friday, June 14, 2013, 7:47 PM

Hi there,

I have tried the player and it definitely shows in firefox and chrome but I can't actually make it play the files. When embedded into exercise subtitile and instruction section of hotpot it will only show in Chrome. Firefox will produce the player -which is cool, I have to say, when attached next to the exercise text, but won't play it anyway. Also tried it with mp4, but nothing happens.

I'm enclosing my .jqz files

Thanks for the code!

Joan Ripoll

goingtolisten_mp4.jqz

goingtolisten.jqz

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Friday, June 14, 2013, 11:45 PM

Hi Joan,

Is there a way you can check your MIME types or ask your SysAdmin/host provider specifically for the MIME types of mp4, m4a, m4v, ogg, oga, ogv (and webm)

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Saturday, June 15, 2013, 1:45 AM

I'll go into that now, thanks for answer.

Joan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Susanna Wesson - Friday, June 14, 2013, 8:14 PM

Hi,

I can confirm IE now works with an mp4 file (although I had trouble converting!) on condition I use the .htm file and not the .jqz file as the source. I attach a screenshot (in French) to show what happens when I use an .mpa file.

Susanna.

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Friday, June 14, 2013, 11:32 PM

Hi Susanna,

So it's pretty much possible that the server has no MIME type for m4a and you have to use mp4. Also, the .htm vs. the .jqz

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Friday, June 14, 2013, 11:51 PM

Do you need a specific moodle version to make it work? It won't work for me on moodle 2.2.10.

Thanks.

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Saturday, June 15, 2013, 12:21 AM

I don't think it has to do with moodle - it is either a browser issue (less likely) or a server MIME type (most probably). This approach is not dependent on moodle as long as you have all three files uploaded. It is entirely reliant on the most modern browsers capabilities. It also has no dependency on a particular third-party player or plugin (flash or anything) - the player is provided by the browser.

Can you provide a URL where I can see the exercise in context?

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Saturday, June 15, 2013, 1:55 AM

url: 22moodle.tiorafadagres.com

course : asir-dam 1

hotpot: 5. 'going to' listening quiz audio required at the end of TOPIC 4.

Guess you might want to create an account.

Please, tell me if you would like special privileges.

Thanks again.

Joan.

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Saturday, June 15, 2013, 2:11 AM

Hi Joan,

I created an account (user: stanbogdanov) but I can't enrol in the course. Could you enrol me and give me teacher editing access in this course? Temporarily.

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Saturday, June 15, 2013, 3:16 AM

Hello,

now you a have a teacher account with your username and pword

*********

I forgot to add self - enrolment method to course, sorry.

Thanks

Joan

(Edited by Mary Cooch to remove password- original submission Friday, 14 June 2013, 8:16 PM)

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Saturday, June 15, 2013, 3:18 AM

I also checked Mime types on server and they are both listed.

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Saturday, June 15, 2013, 5:39 AM

Hi Joan

Your audio files (both m4a and mp4) are corrupt probably due to the conversion routine or the software you convert the audio with. I couldn't open them with any (of my many) players on my computer locally.

The ogg file was ok, so I used your ogg file and Audacity to convert and create my version of the audio and uploaded your exercise here.

Stans-goingto-listening-m4a-working

The audio displays ok both in the question text and in the Subtitles field.

I also tested your exercise with different files and it's working (in section 7) in Chrome, IE10, Opera and Firefox (all latest versions)

Stans exercise

Check them in all your browsers and write back.

What do you use to convert audio? As I mentioned, I use Audacity - free and opensource.

(I can't help but mention my book again where I explain a bit about HTML5 audio and video, potential pitfalls, audo-video conversion software and other goodies

If you're happy with that and consider the problem solved, you can safely remove my account from your Moodle now. But for the future, you may create a dummy account in case you need somebody to come in and inspect a potential problem.

By the way, don't send passwords through the forum, use the messaging feature, or to a private email.

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Sunday, June 16, 2013, 12:12 AM

Sorry about password display, I removed account. Thanks again. I got everything working now with my listening quizzes which look much cooler now: my audio files were corrupt and moved to audacity from ff multiconverter I had been using.

How do I create a dummy account in my moodle ?

Joan.

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Sunday, June 16, 2013, 12:58 AM

Hi Joan,

I'm glad we fixed it.

As I mentioned, HTML5 audio and video are not dependent on Moodle or HotPot (although there are small differences in the approach, but rely on the modern browsers ability to play html5 audio and video natively) I've tested this and it's working even in Moodle 1.9.4 (Build: 20090128) and HotPot version 2007101511) Ancient, isn't it Gordon?

You can use this approach to provide audio and video all around Moodle - in blocks, resources and activities. Just a small implementation can be: audio instructions in Assignments, Forums, Quiz, you name it. Students can attach audio if allowed.

Audio and video have never been easier!

Re: dummy account

Simply create an account with teacher editing rights, for example Teacher-X or TesterZ or something and a password which you will be sending privately, if you need someone to debug.

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Sunday, June 16, 2013, 5:25 PM

PROBLEM SOLVED! EVERYTHING WORKING WITH MY MOODLE AUDIO FILES NOW! It will come in handy with dozens of audio-embedded hotpots I wasn't able to update in my 2.0+ versions.

I do appreciate it and think you are doing a really great job for thousands of teachers and educators. I'll try and go into video now. Do I try with the mp4 version of the file? Well, I 'm looking forward to getting the book anyway.

Cheers, paella awaits you!

Joan ripoll

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by Stan Bogdanov - Monday, June 17, 2013, 10:24 PM

Hi Joan,

If you want to do html5 video, here's the code. Again, you'll need two files - mp4 and ogv. Adjust the width and height. (A good place for the video is the Reading text box)

The converter I use is Miro Video Converter (Mac, Win and Linux; free and opensource).

Write back to share your success or ask questions if you run into problems

Cheers

Stan

Average of ratings: -

Re: Prevent mp3 files opening in new tab

by joan ripoll - Friday, June 21, 2013, 5:18 PM

Hello,

Thanks for your help! Video embedding is working perfectly now.! I had some 'Mime type' problems last week, but everything is working sleek now. Thank you.

Joan Ripoll

Average of ratings: -

Hotpot (plugin)

Prevent mp3 files opening in new tab