音楽を流す

音楽を流す基本形

maybe produced by sakagamisakagami


記事に音楽を流す基本形です。この形式では曲が最後まで流れ切るとそれ以降音楽は流れません。

[[html]]
<audio autoplay>
<source src="http://shitake-crude-production.wikidot.com/local--files/audioplay/Chopin-Poronase-Heroic.mp3 "type="audio/mpeg">
</audio>
[[/html]]

音楽を流す ループ処理

Produced by C-takeC-take


ループ処理をおこなった形式です。この構文の場合、曲が最後まで流れ切ると再び曲の始まりから音楽が流れ始めます。

[[html]]
<script type="text/javascript">
document.addEventListener( 'DOMContentLoaded',function() {
//↓流したい曲をここに設置
var music = "http://shitake-crude-production.wikidot.com/local--files/audioplay/Chopin-Poronase-Heroic.mp3";

var audioPlay = new Audio("");
audioPlay.src = music;
audioPlay.addEventListener("canplaythrough",function(){
audioPlay.loop = true;
audioPlay.play();
});
audioPlay.load();
});
</script>
[[/html]]

財団標準MP3プレイヤー

財団に標準に搭載されているMP3プレイヤーです。ただし、誤解がないように言うとWikidotの標準プレイヤーではありません。これは最終的にはローカルコードとして生成されたhtmファイルをiframeで読み込んでいる形になります。

基本構文:

[[include component:audio-player
|URL=mp3-url
]]

URLに流したい曲のURLを入れてください

autoplay構文(ページ読み込み時自動再生):

[[include component:audio-player
|URL=mp3-url
|autoplay=true
]]

※現在この機能は死んでいます。適用できるようにする為には下記のページで書いたコードを適用する必要があります。
財団標準オーディオの不備について

サンプル:
これは財団標準のMP3プレイヤーそのものではなく、このサイトで実験する為に作った模造品です。その為実験用の機能として、読み込んでいる音楽ファイルのURLが表示されています。

音楽を流す 新標準コントローラー

[[include :snippets:mp3
|URL=http://scp-jp-sandbox2.wikidot.com/local--files/c-take/Chopin-Poronase-Heroic.mp3
]]

サンプル:

音楽を流す 偽装コントローラー付き

Created by C-takeC-take


手作りコントローラーです。MP3以外にも流す事はできますが、流せるファイル形式はもろブラウザ依存です(MP3流しとけば問題ない)。
autoplay、loop機能といった標準コントローラーには無いもしくは非推奨の機能を使用する事ができます。
新標準コントローラーには無い音量調整も可能。

基本構文:
※SCP財団及びサンドボックス共通

[[include :shitake-crude-production:javascript:pseudomusicplayer |
music = http://shitake-crude-production.wikidot.com/local--files/audioplay/Chopin-Poronase-Heroic.mp3 ]]

"music = "の箇所に流したい曲のURLを入れてください。

autoplay(ページ読み込み時自動再生):

[[include :shitake-crude-production:javascript:pseudomusicplayer |
music = http://shitake-crude-production.wikidot.com/local--files/audioplay/Chopin-Poronase-Heroic.mp3
|autoplay=true ]]

loop(最初からループがONになっている。autoplayと併用可):

[[include :shitake-crude-production:javascript:pseudomusicplayer |
music = http://shitake-crude-production.wikidot.com/local--files/audioplay/Chopin-Poronase-Heroic.mp3
|loop=true ]]

volume(音量の初期設定。デフォルトは100):

[[include :shitake-crude-production:javascript:pseudomusicplayer |
music = http://shitake-crude-production.wikidot.com/local--files/audioplay/Chopin-Poronase-Heroic.mp3
|volume=50 ]]

折り畳みに入れると間延びする時の対策(現在発生していないが念の為の機能):

[[include :shitake-crude-production:javascript:pseudomusicplayer |
music = http://shitake-crude-production.wikidot.com/local--files/audioplay/Chopin-Poronase-Heroic.mp3
|collapsible=true ]]

サンプル:
使用楽曲:ショパン:ポロネーズ第6番 変イ長調 Op.53 「英雄」
ショパン:ポロネーズ第6番 変イ長調 Op.53 「英雄」: クラシック名曲サウンドライブラリー
※ loop=true volume=50でのインクルード

乱数生成放送

Produced by Nanimono DemonaiNanimono Demonai



javascriptの仕様上徐々に音声を下げる機能は実装できません。(数字を扱う変数の種類が関係あります)
[[html]]
<script type="text/javascript">
var voiceTimeLimitMin = 5;//音声読み上げ終了時間(分)
var voiceSpan = 2;//音声を読み上げる間隔(秒)
var voiceLang = "ru";//言語 日本は"ja-JP" 英語は"en-US"等 "ru"はロシア語
var randomPitch = true;//音声の高さがランダムで変わるかの設定 true=on false=off
var randomRate = false;//読み上げ速度がランダムで変わるかの設定 true=on false=off
 
/*ここからいじるな*/
voiceSpan *= 3000;
 
var voiceMuteGradient;
if(voiceTimeLimitMin > 0){
    voiceTimeLimitMin *= (1000 * 60);
}
var voiceOldTime = new Date();
voiceOldTime = voiceOldTime.getTime();
var voiceSpanCount = 0;
var voicePrevTime = voiceOldTime;
 
var numbers = [];
var i = 0;
var speech = window.speechSynthesis;
 
function numberStation(){
    var newTime = new Date();
    newTime = newTime.getTime();
    voiceSpanCount += newTime - voicePrevTime;
    voicePrevTime = newTime;
 
    var Limit = newTime - voiceOldTime;
 
    if((voiceSpanCount >= voiceSpan) || (i > 0 && (voiceSpanCount >= (voiceSpan/5)))){
if(i == 0){
for(let n = 0; n < 6; n++){
numbers[n] = (numberFill());
}
}
        var utter = new SpeechSynthesisUtterance(numbers[i]);
        utter.lang= voiceLang;
        if(randomPitch)utter.pitch = Math.random() * 1.5;//ランダムピッチ
        if(randomRate)utter.rate = Math.random() * 1.5;//ランダムレート(速さ)
 
        speech.speak(utter);
        i++;
        if(i >= numbers.length){
            i=0;
        }
        voiceSpanCount = 0;
    }
 
    if((Limit < voiceTimeLimitMin) || (voiceTimeLimitMin == 0))setTimeout(numberStation,100);
}
    function numberFill(){
    return Math.floor(Math.random() * 100) + 1;
}
 
numberStation();
 
</script>
 
[[/html]]

ノイズ生成

Produced by Nanimono DemonaiNanimono Demonai



ノイズを発生させます。
ホワイトノイズ
[[html]]
<script type="text/javascript">
/*一定時間経過でノイズが切れる*/
var timelimitMin = 0.5;//ノイズが流れる時間(分)
var valume = 0.2;//音量調整
var gradientStop = 30;//ノイズの音量が徐々に小さくなり始める残り時間(秒)
 
/*ここから触るな*/
var MuteGradient;
if(timelimitMin > 0){
if(gradientStop > 0){
gradientStop *= 10;
MuteGradient = valume / gradientStop;
gradientStop *= 100;
}
timelimitMin *= (1000 * 60);
}
var oldTime = new Date();
oldTime = oldTime.getTime();
var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioContext = new AudioContext;
 
var bufferSize = 2 * audioContext.sampleRate,
noiseBuffer = audioContext.createBuffer(1, bufferSize, audioContext.sampleRate),
    output = noiseBuffer.getChannelData(0);
for (var i = 0; i < bufferSize; i++) {
    output[i] = Math.random() * valume - ((valume!=0)?1:0);
}
 
var whiteNoise = audioContext.createBufferSource();
whiteNoise.buffer = noiseBuffer;
whiteNoise.loop = true;
whiteNoise.start(0);
whiteNoise.connect(audioContext.destination);
if(timelimitMin != 0){
stopNoise();
}
function stopNoise(){
var newTime = new Date();
newTime = newTime.getTime();
 
if((newTime - oldTime > (timelimitMin-gradientStop )) && (gradientStop!=0)){
valume -= MuteGradient;
if(valume < 0)valume = 0;
for (var i = 0; i < bufferSize; i++) {
    output[i] = Math.random() * valume - ((valume!=0)?1:0);//音量調整(掛けている数字を調整)
}
}
 
if(newTime - oldTime < (timelimitMin)){
setTimeout(stopNoise,100);
}else{
whiteNoise.loop = false;
valume = 0;
for (var i = 0; i < bufferSize; i++) {
    output[i] = Math.random() * valume - ((valume!=0)?1:0);//音量調整(掛けている数字を調整)
}
}
}
</script>
[[/html]]

ピンクノイズ
[[html]]
<script type="text/javascript">
/*一定時間経過でノイズが切れる*/
var timelimitMin = 1;//ノイズが流れる時間(分)
var valume = 0.05;//音量調整
var gradientStop = 20;//ノイズの音量が徐々に小さくなり始める残り時間(秒)
 
/*ここから触るな*/
var MuteGradient;
if(timelimitMin > 0){
if(gradientStop > 0){
gradientStop *= 10;
MuteGradient = valume / gradientStop;
gradientStop *= 100;
}
timelimitMin *= (1000 * 60);
}
 
var oldTime = new Date();
oldTime = oldTime.getTime();
 
var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioContext = new AudioContext;
var bufferSize = 4096;
var pinkNoise = (function() {
    var b0, b1, b2, b3, b4, b5, b6;
    b0 = b1 = b2 = b3 = b4 = b5 = b6 = 0.0;
    var node = audioContext.createScriptProcessor(bufferSize, 1, 1);
    node.onaudioprocess = function(e) {
        var output = e.outputBuffer.getChannelData(0);
        for (var i = 0; i < bufferSize; i++) {
            var white = Math.random() * 2 - 1;
            b0 = 0.99886 * b0 + white * 0.0555179;
            b1 = 0.99332 * b1 + white * 0.0750759;
            b2 = 0.96900 * b2 + white * 0.1538520;
            b3 = 0.86650 * b3 + white * 0.3104856;
            b4 = 0.55000 * b4 + white * 0.5329522;
            b5 = -0.7616 * b5 - white * 0.0168980;
            output[i] = b0 + b1 + b2 + b3 + b4 + b5 + b6 + white * 0.5362;
            output[i] *= valume; // 音量調整
            b6 = white * 0.115926;
        }
    }
    return node;
})();
pinkNoise.connect(audioContext.destination);
if(timelimitMin != 0){
stopNoise();
}
function stopNoise(){
var newTime = new Date();
newTime = newTime.getTime();
 
if((newTime - oldTime > (timelimitMin-gradientStop )) && (gradientStop!=0)){
valume -= MuteGradient;
pinkNoise.connect(audioContext.destination);
}
 
if(newTime - oldTime < (timelimitMin)){
setTimeout(stopNoise,100);
}else{
valume = 0;
pinkNoise.connect(audioContext.destination);
}
}
</script>
[[/html]]

ブラウニアンノイズ
[[html]]
<script type="text/javascript">
/*一定時間経過でノイズが切れる*/
var timelimitMin = 1;//ノイズが流れる時間(分)
var valume = 1.5;//音量調整
var gradientStop = 20;//ノイズの音量が徐々に小さくなり始める残り時間(秒)
 
/*ここから触るな*/
var MuteGradient;
if(timelimitMin > 0){
if(gradientStop > 0){
gradientStop *= 10;
MuteGradient = valume / gradientStop;
gradientStop *= 100;
}
timelimitMin *= (1000 * 60);
}
 
var oldTime = new Date();
oldTime = oldTime.getTime();
 
var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioContext = new AudioContext;
var bufferSize = 4096;
var brownNoise = (function() {
    var lastOut = 0.0;
    var node = audioContext.createScriptProcessor(bufferSize, 1, 1);
    node.onaudioprocess = function(e) {
        var output = e.outputBuffer.getChannelData(0);
        for (var i = 0; i < bufferSize; i++) {
            var white = Math.random() * 2 - 1;
            output[i] = (lastOut + (0.02 * white)) / 1.02;
            lastOut = output[i];
            output[i] *= valume; // 音量調整
        }
    }
    return node;
})();
 
brownNoise.connect(audioContext.destination);
if(timelimitMin > 0)stopNoise();
function stopNoise(){
var newTime = new Date();
newTime = newTime.getTime();
 
if((newTime - oldTime > (timelimitMin-gradientStop )) && (gradientStop!=0)){
valume -= MuteGradient;
brownNoise.connect(audioContext.destination);
}
 
if(newTime - oldTime < (timelimitMin)){
setTimeout(stopNoise,100);
}else{
valume = 0;
brownNoise.connect(audioContext.destination);
}
}
</script>
 
[[/html]]
特に指定がない限り、このサイトのコンテンツには次のライセンスが適用されます: Creative Commons Attribution-ShareAlike 3.0 License