We are looking for a code that plays music only on one topic

Page 2 of 2 Previous  1, 2

Go down

Solved We are looking for a code that plays music only on one topic

Post by Lusuce on September 4th 2019, 7:13 pm

First topic message reminder :

Hello everyone. before describing my problem and everything, I just want to make clear that english isn’t my native language, so, sometimes, it can be difficult to understand what I mean. So sorry in advance!

Now, back to the main issue: I’m one of two secondary GM’s (the creator of the forum being the main guy) in a RPG forum (forumactif, french version), and, we wanted to know if it is possible to play a certain music in a certain topic (all the pages of the topic, that’d be handy).

Right now, the best we came with (and it’s pretty bad lmao) is someting that just plays a youtube video. The video pops in the top left corner, and, you just click play, and music plays. But, there are issues with this, and that’s why we come here.

Firstly, we’d like not to have a big square hiding the background of the forum, just a little ”play/pause” button in a corner would do the trick.
Secondly, if the code that plays the music included a fixture that made it able to play the music in all the pages, not just one.

If I was unclear, or you need more info, please ask, I’ll respond when I have time. Thanks in advance, and, I hope someone can find a solution for us.

Thx for reading, and have good day! Smile


Last edited by Lusuce on September 9th 2019, 8:49 pm; edited 1 time in total
Lusuce
Lusuce
New Member

Posts : 4
Reputation : 1
Language : French/English

http://jean-charles.1fr1.net

Back to top Go down


Solved Re: We are looking for a code that plays music only on one topic

Post by Occultist on September 7th 2019, 12:53 pm

I suppose that you have too many characters in your css file and that the bottom gets removed because of that. Unminified, you have 8208 lines, of which 34 are added by default by forumotion, and never used...

Anyway, I think I managed to get a custom player working. First remove all the javascript and css codes related to this issue that you added.

After that, add this javascript code:
Code:
;function query(e){
return document.querySelector(e);
};
function _query(e){
return document.querySelectorAll(e);
};
function listen(elem, event, cback){
elem.addEventListener(event, function(e){
cback(e);
});
};
window.player=window.player || {
config:{
tid:563,
file:"http://soundbible.com/grab.php?id=2079&type=mp3",
struct:"<div class='player-state'></div><div class='player-volume'><span class='player-mute'></span><input type='range' min='0' max='100' value='50'/></div>",
svg_sound:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.52,5.367c-1.332,0-2.422,1.09-2.422,2.422v2.422c0,1.332,1.09,2.422,2.422,2.422h1.516l4.102,3.633 V1.735L5.035,5.367H3.52z M12.059,9c0-0.727-0.484-1.211-1.211-1.211v2.422C11.574,10.211,12.059,9.727,12.059,9z M14.48,9 c0-1.695-1.211-3.148-2.785-3.512l-0.363,1.09C12.422,6.82,13.27,7.789,13.27,9c0,1.211-0.848,2.18-1.938,2.422l0.484,1.09 C13.27,12.148,14.48,10.695,14.48,9z M12.543,3.188l-0.484,1.09C14.238,4.883,15.691,6.82,15.691,9c0,2.18-1.453,4.117-3.512,4.601 l0.484,1.09c2.422-0.605,4.238-2.906,4.238-5.691C16.902,6.215,15.086,3.914,12.543,3.188z'/></svg>",
svg_muted:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.52,5.367c-1.332,0-2.422,1.09-2.422,2.422v2.422c0,1.332,1.09,2.422,2.422,2.422h1.516l4.102,3.633V1.735L5.035,5.367H3.52z'/><path fill='context-fill' fill-rule='evenodd' d='M12.155,12.066l-1.138-1.138l4.872-4.872l1.138,1.138 L12.155,12.066z'/><path fill='context-fill' fill-rule='evenodd' d='M10.998,7.204l1.138-1.138l4.872,4.872l-1.138,1.138L10.998,7.204z'/></svg>",
sv:1,
playing:0,

play:"<svg height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.243,15.155c0,0.845,0.593,1.157,1.317,0.707l9.659-6.041c0.727-0.453,0.722-1.193,0-1.645L4.556,2.137 C3.827,1.682,3.237,2.014,3.237,2.844v12.312H3.243z'/></svg>",
pause:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M6.002,1.953C5.172,1.953,4.5,2.626,4.5,3.455v11.08 c0,0.83,0.672,1.502,1.502,1.502c0.829,0,1.502-0.672,1.502-1.502V3.455C7.504,2.626,6.831,1.953,6.002,1.953z M12,1.953 c-0.828,0-1.5,0.672-1.5,1.5v11.094c0,0.828,0.672,1.5,1.5,1.5s1.5-0.672,1.5-1.5V3.453C13.5,2.625,12.828,1.953,12,1.953z'/></svg>",
_vol:50,
muted:0,
css:".player-con{background:#000;display:inline-flex;color:#fff;box-shadow:0 3px 6px rgba(0,0,0,.16);position:fixed;top:40px;z-index:999;}.player-volume input{-webkit-appearance:none;background:0 0;width:100px}.player-volume input::-moz-range-thumb{border:none;background:#fff;cursor:pointer}.player-volume input::-webkit-slider-thumb{-webkit-appearance:none!important;border:none;background:#fff;cursor:pointer;width:12px;height:12px;border-radius:100%;margin-top:-4px}.player-volume input::-moz-range-track{background:#4f4f4f}.player-volume input::-webkit-slider-runnable-track{background:#4f4f4f;height:4px;position:relative;top:-5px}.player-volume input:focus{outline:0}.player-volume input::-moz-range-progress{background:#fff}.player-con>div{padding:10px}.player-state{padding-right:0!important}.player-con path{fill:#fff!important}.player-mute{position:relative;top:2px;margin-right:5px}.player-state svg{margin-top:2px}",
},

elems:{

},

check:function(){
if(location.pathname.indexOf("t"+player.config.tid)===-1) return false;
return true;
},

build:function(){
var that=player;
that.elems.body=query("body");

/*the css*/
var css=document.createElement("style");
css.innerHTML=that.config.css;
that.elems.body.appendChild(css);

/*the fake player*/
var con=document.createElement("div");
con.classList.add("player-con");
con.innerHTML=that.config.struct;
that.elems.body.appendChild(con);

that.elems.state=query(".player-state");
that.elems.state.innerHTML=player.config.play;
that.elems.mute=query(".player-mute");
that.elems.mute.innerHTML=player.config.svg_sound;
that.elems.range=query(".player-volume>input");

/*actual player*/
var audio=document.createElement("audio");
audio.classList.add("fake-audio");
audio.setAttribute("src", that.config.file);
that.elems.body.appendChild(audio);
that.elems.audio=audio;

/*the volume*/
listen(player.elems.range, "input", function(){
var vol=player.elems.range.value/100;
if(vol!==0 && player.config.muted){
player.config.muted=0;
player.elems.mute.innerHTML=player.config.svg_sound;
}
player.elems.audio.volume=vol;
if(vol===0){
player.elems.mute.innerHTML=player.config.svg_muted;
player.config.sv=0;
}
if(vol!==0 && player.config.sv===0){
player.elems.mute.innerHTML=player.config.svg_sound;
player.config.sv=1;
}
});

//play-pause
listen(player.elems.state, "click", function(){
if(player.config.playing){
player.config.playing=0;
player.elems.audio.pause();
player.elems.state.innerHTML=player.config.play;
} else {
player.config.playing=1;
player.elems.audio.play();
player.elems.state.innerHTML=player.config.pause;
}
});

//the mute button
listen(player.elems.mute, "click", function(){
if(player.config.muted===0){
player.config.muted=1;
player.config.vol=player.elems.range.value;
player.elems.range.value=0;
player.elems.audio.volume=0;
player.elems.mute.innerHTML=player.config.svg_muted;
} else {
player.config.muted=0;
player.elems.range.value=player.config.vol;
player.elems.audio.volume=player.config.vol/100;
player.elems.mute.innerHTML=player.config.svg_sound;
}
});

},

init:function(){
if(!this.check()) return;
listen(document, "DOMContentLoaded", this.build);
}
};
player.init();

The CSS code is embedded in the javascript, so no need to worry about that. The placement should be the topics.
Lines 13 and 14 can be modified just like in the previous code. The player can currently play the sound, has volume controls and a mute button. Basically it is the same as the default player, except that you can't skip. Let me know if you need any other feature. The design can be modified however you like.
Occultist
Occultist
Forumember

Posts : 181
Reputation : 48
Language : English and couple others

https://idonthaveaforum.forumotion.com

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Gurufissu on September 8th 2019, 1:55 pm

It works perfectly fine ! Thank you Occultist, and for Sarkz reply, I'll check if they got a player adapted to our theme ! Talking of which, where can I modify the design of the current player you coded ?
Gurufissu
Gurufissu
Forumember

Posts : 84
Reputation : 2
Language : French

http://continentem.forumactif.com/

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Occultist on September 8th 2019, 2:52 pm

The css is currently embedded in the js. Replace the js with this one:
Code:
;function query(e){
return document.querySelector(e);
};
function _query(e){
return document.querySelectorAll(e);
};
function listen(elem, event, cback){
elem.addEventListener(event, function(e){
cback(e);
});
};
window.player=window.player || {
config:{
tid:563,
file:"http://soundbible.com/grab.php?id=2079&type=mp3",
struct:"<div class='player-state'></div><div class='player-volume'><span class='player-mute'></span><input type='range' min='0' max='100' value='50'/></div>",
svg_sound:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.52,5.367c-1.332,0-2.422,1.09-2.422,2.422v2.422c0,1.332,1.09,2.422,2.422,2.422h1.516l4.102,3.633 V1.735L5.035,5.367H3.52z M12.059,9c0-0.727-0.484-1.211-1.211-1.211v2.422C11.574,10.211,12.059,9.727,12.059,9z M14.48,9 c0-1.695-1.211-3.148-2.785-3.512l-0.363,1.09C12.422,6.82,13.27,7.789,13.27,9c0,1.211-0.848,2.18-1.938,2.422l0.484,1.09 C13.27,12.148,14.48,10.695,14.48,9z M12.543,3.188l-0.484,1.09C14.238,4.883,15.691,6.82,15.691,9c0,2.18-1.453,4.117-3.512,4.601 l0.484,1.09c2.422-0.605,4.238-2.906,4.238-5.691C16.902,6.215,15.086,3.914,12.543,3.188z'/></svg>",
svg_muted:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.52,5.367c-1.332,0-2.422,1.09-2.422,2.422v2.422c0,1.332,1.09,2.422,2.422,2.422h1.516l4.102,3.633V1.735L5.035,5.367H3.52z'/><path fill='context-fill' fill-rule='evenodd' d='M12.155,12.066l-1.138-1.138l4.872-4.872l1.138,1.138 L12.155,12.066z'/><path fill='context-fill' fill-rule='evenodd' d='M10.998,7.204l1.138-1.138l4.872,4.872l-1.138,1.138L10.998,7.204z'/></svg>",
sv:1,
playing:0,

play:"<svg height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.243,15.155c0,0.845,0.593,1.157,1.317,0.707l9.659-6.041c0.727-0.453,0.722-1.193,0-1.645L4.556,2.137 C3.827,1.682,3.237,2.014,3.237,2.844v12.312H3.243z'/></svg>",
pause:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M6.002,1.953C5.172,1.953,4.5,2.626,4.5,3.455v11.08 c0,0.83,0.672,1.502,1.502,1.502c0.829,0,1.502-0.672,1.502-1.502V3.455C7.504,2.626,6.831,1.953,6.002,1.953z M12,1.953 c-0.828,0-1.5,0.672-1.5,1.5v11.094c0,0.828,0.672,1.5,1.5,1.5s1.5-0.672,1.5-1.5V3.453C13.5,2.625,12.828,1.953,12,1.953z'/></svg>",
_vol:50,
muted:0,
},

elems:{

},

check:function(){
if(location.pathname.indexOf("t"+player.config.tid)===-1) return false;
return true;
},

build:function(){
var that=player;
that.elems.body=query("body");

/*the fake player*/
var con=document.createElement("div");
con.classList.add("player-con");
con.innerHTML=that.config.struct;
that.elems.body.appendChild(con);

that.elems.state=query(".player-state");
that.elems.state.innerHTML=player.config.play;
that.elems.mute=query(".player-mute");
that.elems.mute.innerHTML=player.config.svg_sound;
that.elems.range=query(".player-volume>input");

/*actual player*/
var audio=document.createElement("audio");
audio.classList.add("fake-audio");
audio.setAttribute("src", that.config.file);
that.elems.body.appendChild(audio);
that.elems.audio=audio;

/*the volume*/
listen(player.elems.range, "input", function(){
var vol=player.elems.range.value/100;
if(vol!==0 && player.config.muted){
player.config.muted=0;
player.elems.mute.innerHTML=player.config.svg_sound;
}
player.elems.audio.volume=vol;
if(vol===0){
player.elems.mute.innerHTML=player.config.svg_muted;
player.config.sv=0;
}
if(vol!==0 && player.config.sv===0){
player.elems.mute.innerHTML=player.config.svg_sound;
player.config.sv=1;
}
});

//play-pause
listen(player.elems.state, "click", function(){
if(player.config.playing){
player.config.playing=0;
player.elems.audio.pause();
player.elems.state.innerHTML=player.config.play;
} else {
player.config.playing=1;
player.elems.audio.play();
player.elems.state.innerHTML=player.config.pause;
}
});

//the mute button
listen(player.elems.mute, "click", function(){
if(player.config.muted===0){
player.config.muted=1;
player.config.vol=player.elems.range.value;
player.elems.range.value=0;
player.elems.audio.volume=0;
player.elems.mute.innerHTML=player.config.svg_muted;
} else {
player.config.muted=0;
player.elems.range.value=player.config.vol;
player.elems.audio.volume=player.config.vol/100;
player.elems.mute.innerHTML=player.config.svg_sound;
}
});

},

init:function(){
if(!this.check()) return;
listen(document, "DOMContentLoaded", this.build);
}
};
player.init();
Then add this code to your CSS:
Code:
.player-con {
   background: #000;
   display: inline-flex;
   color: #fff;
   box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
   position: fixed;
   top: 40px;
   z-index: 999;
}

.player-volume input {
   -webkit-appearance: none;
   background: 0 0;
   width: 100px
}

.player-volume input::-moz-range-thumb {
   border: none;
   background: #fff;
   cursor: pointer
}

.player-volume input::-webkit-slider-thumb {
   -webkit-appearance: none!important;
   border: none;
   background: #fff;
   cursor: pointer;
   width: 12px;
   height: 12px;
   border-radius: 100%;
   margin-top: -4px
}

.player-volume input::-moz-range-track {
   background: #4f4f4f
}

.player-volume input::-webkit-slider-runnable-track {
   background: #4f4f4f;
   height: 4px;
   position: relative;
   top: -5px
}

.player-volume input:focus {
   outline: 0
}

.player-volume input::-moz-range-progress {
   background: #fff
}

.player-con>div {
   padding: 10px
}

.player-state {
   padding-right: 0!important
}

.player-con path {
   fill: #fff!important
}

.player-mute {
   position: relative;
   top: 2px;
   margin-right: 5px
}

.player-state svg {
   margin-top: 2px
}
You can modify this as you want.
Occultist
Occultist
Forumember

Posts : 181
Reputation : 48
Language : English and couple others

https://idonthaveaforum.forumotion.com

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Gurufissu on September 8th 2019, 3:04 pm

Ok everything fine ! Is there a css code I can add, to have a given picture, as the player ? I mean, like to have this display for example : https://7img.net/users/3715/71/63/56/avatars/1-36.png ?
Gurufissu
Gurufissu
Forumember

Posts : 84
Reputation : 2
Language : French

http://continentem.forumactif.com/

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Occultist on September 8th 2019, 3:40 pm

Replace the CSS code with this one:
Code:
.player-con {
   background: url("https://7img.net/users/3715/71/63/56/avatars/1-36.png");
   display: inline-flex;
   color: #fff;
   box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
   position: fixed;
   top: 40px;
   z-index: 999;
   background-attachment: fixed;
}

.player-volume input {
   -webkit-appearance: none;
   background: 0 0;
   width: 100px
}

.player-volume input::-moz-range-thumb {
   border: none;
   background: #fff;
   cursor: pointer
}

.player-volume input::-webkit-slider-thumb {
   -webkit-appearance: none!important;
   border: none;
   background: #fff;
   cursor: pointer;
   width: 12px;
   height: 12px;
   border-radius: 100%;
   margin-top: -4px
}

.player-volume input::-moz-range-track {
   background: #4f4f4f
}

.player-volume input::-webkit-slider-runnable-track {
   background: #4f4f4f;
   height: 4px;
   position: relative;
   top: -5px
}

.player-volume input:focus {
   outline: 0
}

.player-volume input::-moz-range-progress {
   background: #fff
}

.player-con>div {
   padding: 10px
}

.player-con path {
   fill: #fff!important
}

.player-state {
   background: black;
   opacity: 0.9;
   cursor: pointer;
}

.player-mute {
   position: relative;
   top: 2px;
   margin-right: 5px
}

.player-state svg {
   margin-top: 2px;
}

Occultist
Occultist
Forumember

Posts : 181
Reputation : 48
Language : English and couple others

https://idonthaveaforum.forumotion.com

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Gurufissu on September 8th 2019, 3:50 pm

OK perfect, I got how that works ! Thank you very much again and again, you really are the best ! I love you I love you I love you
Gurufissu
Gurufissu
Forumember

Posts : 84
Reputation : 2
Language : French

http://continentem.forumactif.com/

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by SLGray on September 8th 2019, 6:59 pm

Is this solved?


adding music - We are looking for a code that plays music only on one topic - Page 2 Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 46687
Reputation : 3273
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Gurufissu on September 9th 2019, 6:22 pm

I do have a last question : can we recreate as much as we want of this script, or it has limits, because like it might make the forum have lags or something? Or can we add the different topics directly into this code?
Gurufissu
Gurufissu
Forumember

Posts : 84
Reputation : 2
Language : French

http://continentem.forumactif.com/

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Occultist on September 9th 2019, 7:47 pm

Hello,

Right now the code only supports a single topic. Duplicating a code to work with more topics is a very bad idea since it makes the browser download the same code over and over, making the page slower than it needs to. Making the original code support multiple topics is very easy, though. Just replace it with this one:
Code:
;function query(e){
return document.querySelector(e);
};
function _query(e){
return document.querySelectorAll(e);
};
function listen(elem, event, cback){
elem.addEventListener(event, function(e){
cback(e);
});
};
window.player=window.player || {
config:{
ids:[563, 157911, 1],
files:["http://soundbible.com/grab.php?id=2079&type=mp3", "file2", "file3"],
struct:"<div class='player-state'></div><div class='player-volume'><span class='player-mute'></span><input type='range' min='0' max='100' value='50'/></div>",
svg_sound:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.52,5.367c-1.332,0-2.422,1.09-2.422,2.422v2.422c0,1.332,1.09,2.422,2.422,2.422h1.516l4.102,3.633 V1.735L5.035,5.367H3.52z M12.059,9c0-0.727-0.484-1.211-1.211-1.211v2.422C11.574,10.211,12.059,9.727,12.059,9z M14.48,9 c0-1.695-1.211-3.148-2.785-3.512l-0.363,1.09C12.422,6.82,13.27,7.789,13.27,9c0,1.211-0.848,2.18-1.938,2.422l0.484,1.09 C13.27,12.148,14.48,10.695,14.48,9z M12.543,3.188l-0.484,1.09C14.238,4.883,15.691,6.82,15.691,9c0,2.18-1.453,4.117-3.512,4.601 l0.484,1.09c2.422-0.605,4.238-2.906,4.238-5.691C16.902,6.215,15.086,3.914,12.543,3.188z'/></svg>",
svg_muted:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.52,5.367c-1.332,0-2.422,1.09-2.422,2.422v2.422c0,1.332,1.09,2.422,2.422,2.422h1.516l4.102,3.633V1.735L5.035,5.367H3.52z'/><path fill='context-fill' fill-rule='evenodd' d='M12.155,12.066l-1.138-1.138l4.872-4.872l1.138,1.138 L12.155,12.066z'/><path fill='context-fill' fill-rule='evenodd' d='M10.998,7.204l1.138-1.138l4.872,4.872l-1.138,1.138L10.998,7.204z'/></svg>",
sv:1,
playing:0,

play:"<svg height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M3.243,15.155c0,0.845,0.593,1.157,1.317,0.707l9.659-6.041c0.727-0.453,0.722-1.193,0-1.645L4.556,2.137 C3.827,1.682,3.237,2.014,3.237,2.844v12.312H3.243z'/></svg>",
pause:"<svg width='18px' height='18px' viewBox='0 0 18 18'><path fill='context-fill' d='M6.002,1.953C5.172,1.953,4.5,2.626,4.5,3.455v11.08 c0,0.83,0.672,1.502,1.502,1.502c0.829,0,1.502-0.672,1.502-1.502V3.455C7.504,2.626,6.831,1.953,6.002,1.953z M12,1.953 c-0.828,0-1.5,0.672-1.5,1.5v11.094c0,0.828,0.672,1.5,1.5,1.5s1.5-0.672,1.5-1.5V3.453C13.5,2.625,12.828,1.953,12,1.953z'/></svg>",
_vol:50,
muted:0,
file:null,
},

elems:{

},

check:function(){
if(player.config.ids.length!==player.config.files.length) return false;
if(!/t\d+/.test(location.pathname)) return false;
var tid=parseInt(location.pathname.match(/\d+/g)[0]);
if(player.config.ids.indexOf(tid)===-1) return false;
player.config.file=player.config.files[player.config.ids.indexOf(tid)];
return true;
},

build:function(){
var that=player;
that.elems.body=query("body");

/*the fake player*/
var con=document.createElement("div");
con.classList.add("player-con");
con.innerHTML=that.config.struct;
that.elems.body.appendChild(con);

that.elems.state=query(".player-state");
that.elems.state.innerHTML=player.config.play;
that.elems.mute=query(".player-mute");
that.elems.mute.innerHTML=player.config.svg_sound;
that.elems.range=query(".player-volume>input");

/*actual player*/
var audio=document.createElement("audio");
audio.classList.add("fake-audio");
audio.setAttribute("src", that.config.file);
that.elems.body.appendChild(audio);
that.elems.audio=audio;

/*the volume*/
listen(player.elems.range, "input", function(){
var vol=player.elems.range.value/100;
if(vol!==0 && player.config.muted){
player.config.muted=0;
player.elems.mute.innerHTML=player.config.svg_sound;
}
player.elems.audio.volume=vol;
if(vol===0){
player.elems.mute.innerHTML=player.config.svg_muted;
player.config.sv=0;
}
if(vol!==0 && player.config.sv===0){
player.elems.mute.innerHTML=player.config.svg_sound;
player.config.sv=1;
}
});

//play-pause
listen(player.elems.state, "click", function(){
if(player.config.playing){
player.config.playing=0;
player.elems.audio.pause();
player.elems.state.innerHTML=player.config.play;
} else {
player.config.playing=1;
player.elems.audio.play();
player.elems.state.innerHTML=player.config.pause;
}
});

//the mute button
listen(player.elems.mute, "click", function(){
if(player.config.muted===0){
player.config.muted=1;
player.config.vol=player.elems.range.value;
player.elems.range.value=0;
player.elems.audio.volume=0;
player.elems.mute.innerHTML=player.config.svg_muted;
} else {
player.config.muted=0;
player.elems.range.value=player.config.vol;
player.elems.audio.volume=player.config.vol/100;
player.elems.mute.innerHTML=player.config.svg_sound;
}
});

},

init:function(){
if(!this.check()) return;
listen(document, "DOMContentLoaded", this.build);
}
};
player.init();

You will need to edit line 14 to add the ids. The ids should be separated by a comma. You can also leave a comma after the last id, but it isn't necessary.
The next line(15) is the list of audio file links. Similar to the ids, they need to be separated by commas. The quotation marks are also compulsory.
In both cases, just follow the example in the code.

The first id will correspond to the first audio file and so on. The code shouldn't cause any lag, but the forum will load slightly slower because it will have to download the extra code for the player(approx 4.2 kb).
Occultist
Occultist
Forumember

Posts : 181
Reputation : 48
Language : English and couple others

https://idonthaveaforum.forumotion.com

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Lusuce on September 9th 2019, 8:49 pm

Alright, we did it, everything seems to work! Thanks to everyone who helped us!
Lusuce
Lusuce
New Member

Posts : 4
Reputation : 1
Language : French/English

http://jean-charles.1fr1.net

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by Gurufissu on September 9th 2019, 10:36 pm

Occultist : you the king.

Merci beaucoup ! I love you
Gurufissu
Gurufissu
Forumember

Posts : 84
Reputation : 2
Language : French

http://continentem.forumactif.com/

Back to top Go down

Solved Re: We are looking for a code that plays music only on one topic

Post by APE on September 10th 2019, 1:11 am

Problem solved & topic archived.
Please read our forum rules: ESF General Rules


adding music - We are looking for a code that plays music only on one topic - Page 2 Left1212adding music - We are looking for a code that plays music only on one topic - Page 2 Center11adding music - We are looking for a code that plays music only on one topic - Page 2 Right112
adding music - We are looking for a code that plays music only on one topic - Page 2 Ape_b110
adding music - We are looking for a code that plays music only on one topic - Page 2 Ape1010
APE
APE
Administrator
Administrator

Male Posts : 14921
Reputation : 1617
Language : fluent in dork / mumbojumbo & English haha

http://chatworld.forumotion.co.uk/

Back to top Go down

Page 2 of 2 Previous  1, 2

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum