Skip to content

Instantly share code, notes, and snippets.

@arcatdmz
Created January 9, 2019 02:36
Show Gist options
  • Save arcatdmz/00a06935a7647d36ab0e8541440ab410 to your computer and use it in GitHub Desktop.
Save arcatdmz/00a06935a7647d36ab0e8541440ab410 to your computer and use it in GitHub Desktop.
Songle Sync Tutorial Step.3 (undefined)
<html><head><script src="//api.songle.jp/v2/api.js"></script><script>
function onSongleWidgetAPIReady(SongleWidget) {
// 音楽プレーヤーを初期化する
var player = new SongleWidget.Player({
accessToken: 'foo' // アクセストークン
});
player.addPlugin(new SongleWidget.Plugin.SongleSync());
// 再生時刻を定期的に更新する
var span = document.querySelector('span.time');
setInterval(function () {
while (span.childNodes.length > 0) span.removeChild(span.childNodes[0]);
var textNode = document.createTextNode(parseInt(player.position));
span.appendChild(textNode);
}, 100);
}
</script><style type="text/css">
body {
margin: 1em;
font-family: 'Hiragino Kaku Gothic Pro','游ゴシック体','Yu Gothic',YuGothic,Meiryo,HelveticaNeue,'Helvetica Neue',Helvetica,Arial,sans-serif;
}
h1 {
font-size: 1.6em;
border: solid #000;
border-width: 0 0 1px 0;
}
iframe {
max-width: 100%;
overflow-x: scroll-x;
}
p>span {
font-weight: bold;
}
</style></head><body><h1>slave test</h1>
<div class="media"></div>
<p>再生時刻: <span class="time">-</span>[ms]</p></body></html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment