Patch #22112: add html5 audio controls if attachment is mp3 - Redmine

Actions

Copy link

Patch #22112

closed

add html5 audio controls if attachment is mp3

Added by nicola mondinelli almost 9 years ago. Updated about 6 years ago.

Status:

Closed

Priority:

Normal

Assignee:

Category:

Attachments

Target version:

Start date:

Due date:

% Done:

Estimated time:

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>" 
  });
});

Files

Download all files

2016-02-25 15_23_38-Supporto 1° Livello #11833_ NUOVA RICHIESTA TELEFONICA - SUPPORT 1° LIVELLO - Sc.png (27.5 KB) 2016-02-25 15_23_38-Supporto 1° Livello #11833_ NUOVA RICHIESTA TELEFONICA - SUPPORT 1° LIVELLO - Sc.png	result	nicola mondinelli, 2016-02-25 15:25
application.zip (5.89 KB) application.zip	both video .mp4 and audio .mp3 support for HTML5	diamond2nv GitHub, 2017-02-03 17:24

Related issues

Actions

Copy link

Updated by Toshi MARUYAMA almost 9 years ago

Description updated (diff)

Actions

Copy link

Updated by Toshi MARUYAMA almost 9 years ago

Description updated (diff)

Actions

Copy link

Updated by diamond2nv GitHub almost 8 years ago

File application.zip application.zip added

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>" 
  });
});