You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
2.4 KiB
63 lines
2.4 KiB
<!doctype html> |
|
<html class="no-js" lang="en"> |
|
<head> |
|
<meta charset="utf-8"> |
|
<meta http-equiv="x-ua-compatible" content="ie=edge"> |
|
<title>Ghetto Blastr</title> |
|
<meta name="description" content="A sound board"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
|
|
<link rel="manifest" href="site.webmanifest"> |
|
<!-- <link rel="apple-touch-icon" href="icon.png"> --> |
|
|
|
<link rel="stylesheet" href="css/normalize.css"> |
|
<link rel="stylesheet" href="css/main.css"> |
|
<link rel="stylesheet" href="css/style.css"> |
|
<link rel="stylesheet" href="css/spinner.css"> |
|
</head> |
|
|
|
<body> |
|
<!--[if lte IE 9]> |
|
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://mozilla.org/firefox/">upgrade your browser</a> to improve your experience and security.</p> |
|
<![endif]--> |
|
<div id="soundboard"> |
|
<header> |
|
<template> |
|
<h1>{{ title }} Ghetto Blastr</h1> |
|
</template> |
|
</header> |
|
|
|
<section class="loading" v-if="!ready"> |
|
<div class="spinner"> |
|
<div class="rect1"></div> |
|
<div class="rect2"></div> |
|
<div class="rect3"></div> |
|
<div class="rect4"></div> |
|
<div class="rect5"></div> |
|
</div> |
|
</section> |
|
|
|
<section class="sounds" v-else> |
|
<template v-for="asset in assets"> |
|
<ghetto-sound |
|
v-bind:asset="asset" |
|
v-on:ghetto-playsound="stopAllPlayingSounds" |
|
ref="sound" |
|
></ghetto-sound> |
|
</template> |
|
</section> |
|
</div> |
|
|
|
<script> |
|
// https://github.com/typicode/pegasus |
|
//0.3.5 |
|
function pegasus(a,b,c){return c=new XMLHttpRequest,c.open("GET",a),a=[],pegasus.timeout&&(c.timeout=pegasus.timeout),c.ontimeout=function(a){b=a},c.onreadystatechange=c.then=function(d,e,f,g){if(d&&d.call&&(a=[,d,e]),b&&a[2]&&a[2](b,c),4==c.readyState&&(f=a[0|c.status/200])){try{g=JSON.parse(c.responseText)}catch(a){g=null}f(g,c)}},c.send(),c} |
|
</script> |
|
<script> |
|
var GHETTO_SOURCE_REQUEST = pegasus('ghettoblastr.json'); |
|
</script> |
|
|
|
<script src="lib/vue.min.js"></script> |
|
<script src="js/main.js"></script> |
|
</body> |
|
</html>
|
|
|