Table of Contents
|
音楽を流す基本形
maybe produced by sakagami
記事に音楽を流す基本形です。この形式では曲が最後まで流れ切るとそれ以降音楽は流れません。
[[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-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
]]
サンプル:
Flash Player is no longer supported! Use https://snippets.wikidot.com/code:html5player instead.
音楽を流す 偽装コントローラー付き
Created by C-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 Demonai
Created by TehMerow
https://codepen.io/TehMerow/pen/xqwGOo
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 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]]