Patch #22112

add html5 audio controls if attachment is mp3

Added by nicola mondinelli over 5 years ago. Updated about 3 years ago.

Status:ClosedStart date:
Priority:NormalDue date:
Assignee:-% Done:

0%

Category:Attachments
Target version:-

Description

I added a simple line on bottom of application.js to create a HTML5 control if the attachment is an mp3.

i share it with you.

$(document).ready(function(){
  $(".attachments p:has(a[href$='.mp3'])").after(function () {
    return "<audio controls><source src=\"" +
      $(this).find(" a[href$='.mp3'] ").attr("href")+"\" type=\"audio/mpeg\"</audio>" 
  });
});

2016-02-25 15_23_38-Supporto 1° Livello #11833_ NUOVA RICHIESTA TELEFONICA - SUPPORT 1° LIVELLO - Sc.png - result (27.5 KB) nicola mondinelli, 2016-02-25 15:25

application.zip - both video .mp4 and audio .mp3 support for HTML5 (5.89 KB) diamond2nv GitHub, 2017-02-03 17:24

Related issues

Related to Redmine - Feature #10138: Video Player Closed
Related to Redmine - Patch #27336: Render previews for audio and video files Closed

History

#1 Updated by Toshi MARUYAMA over 5 years ago

  • Description updated (diff)

#2 Updated by Toshi MARUYAMA over 5 years ago

  • Description updated (diff)

#3 Updated by diamond2nv GitHub over 4 years ago

Thank for Toshi MARUYAMA having added a simple line on bottom of application.js to create a HTML5 control if the attachment is an mp3.

Add little change for both <video>(.mp4) and <audio>(.mp3) support, just refresh your browser and see after the new js!


$(document).ready(function(){
  $(".attachments p:has(a[href$='.mp3'])").after(function () {
    return "<audio controls><source src=\"" +
      $(this).find(" a[href$='.mp3'] ").attr("href")+"\" type=\"audio/mp3\"</audio>" 
  });
});

$(document).ready(function(){
  $(".attachments p:has(a[href$='.mp4'])").after(function () {
    return "<video width=\"600\" height=\"400\" controls><source src=\"" +
      $(this).find(" a[href$='.mp4'] ").attr("href")+"\" type=\"video/mp4\"</video>" 
  });
});

#4 Updated by diamond2nv GitHub over 4 years ago

return "<video width=\"600\" height=\"400\" controls><source src=\"" +

640*360?

Not fit for android browser

#5 Updated by Toshi MARUYAMA over 4 years ago

#6 Updated by Go MAEDA almost 4 years ago

  • Related to Patch #27336: Render previews for audio and video files added

#7 Updated by Go MAEDA about 3 years ago

  • Status changed from New to Closed

The upcoming Redmine 4.0 will have audio/video control on the preview page. Please refer to #27336 for details.

Also available in: Atom PDF