Skip to content

Commit

Permalink
Updating the example interface. Still needs work to make it look better.
Browse files Browse the repository at this point in the history
  • Loading branch information
@meenie
meenie committed Sep 15, 2013
1 parent 10265ea commit 77c82aa
Show file tree
Hide file tree
Showing 4 changed files with 76 additions and 56 deletions.
5 changes: 5 additions & 0 deletions examples/mario-bros-overworld/css/app.css
View file
@@ -0,0 +1,5 @@
.vertical-range {
-webkit-appearance: slider-vertical;
width: 20px;
height: 100px;
}
13 changes: 9 additions & 4 deletions examples/js/app.js → examples/mario-bros-overworld/js/app.js
View file
Expand Up @@ -472,9 +472,9 @@ app.controller('AppController', function($scope) {

drum.rest('whole');

rightHand.repeatFromBeginning(20);
leftHand.repeatFromBeginning(20);
drum.repeatFromBeginning(20);
rightHand.repeatFromBeginning(2000);
leftHand.repeatFromBeginning(2000);
drum.repeatFromBeginning(2000);

rightHand.finish();
leftHand.finish();
Expand Down Expand Up @@ -559,7 +559,12 @@ app.filter('musicTime', function() {
return function(seconds, showRemaining) {
var duration = moment.duration(parseInt(seconds), 'seconds'),
secs = duration.seconds(),
mins = duration.minutes();
mins = duration.minutes(),
hrs = duration.hours();

if (hrs > 0) {
mins += (hrs * 60);
}

return mins + ':' + pad(secs, 2);
}
Expand Down
62 changes: 62 additions & 0 deletions examples/mario-bros-overworld/mario-bros.html
View file
@@ -0,0 +1,62 @@
<!DOCTYPE html>

<html lang="en" ng-app="app">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Super Mario Bros Overworld</title>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">
<link href="css/app.css" rel="stylesheet">
<script src="http://code.angularjs.org/1.2.0rc1/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.5.0/ui-bootstrap-tpls.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.1.0/moment.min.js"></script>

<!-- Band.JS Files -->
<script src="../../src/band.js"></script>
<script src="../../src/instrument-packs/noises.js"></script>
<script src="../../src/instrument-packs/oscillators.js"></script>
<script src="../../src/rhythm-packs/north-american.js"></script>
<script src="../../src/tuning-packs/equal-temperament.js"></script>

<!-- App Files -->
<script src="js/app.js"></script>
</head>
<body ng-controller="AppController">
<div class="container">
<div class="row">
<div class="col-md-12">
<h4><strong>Only works in latest chrome or safari!</strong></h4>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="row">
<div class="col-md-12">
<h2>{{currentSeconds|musicTime}}</h2>
</div>
</div>
<div class="row">
<div class="col-md-12 text-center">
<div class="btn-group">
<button ng-if="! playing || paused" ng-click="play()" class="btn btn-default"><i class="glyphicon glyphicon-play"></i></button>
<button ng-if="! paused && playing" ng-click="pause()" class="btn btn-default"><i class="glyphicon glyphicon-pause"></i></button>
<button ng-click="stop()" class="btn btn-default"><i class="glyphicon glyphicon-stop"></i></button>
<button class="btn btn-default" ng-model="mute" btn-checkbox><i class="glyphicon glyphicon-volume-off"></i></button>
<button class="btn btn-default" ng-model="loop" btn-checkbox><i class="glyphicon glyphicon-repeat"></i></button>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 text-center">
<input ng-mousedown="movingTime()" ng-mouseup="updateTime()" type="range" max="{{totalSeconds}}" ng-model="currentSeconds">
<span class="total-time">{{totalSeconds|musicTime}}</span>
</div>
</div>
</div>
<div class="col-md-8">
<input ng-disabled="muted" class="vertical-range" type="range" ng-model="volume">
</div>
</div>

</div>
</body>
</html>
52 changes: 0 additions & 52 deletions examples/mario-bros.html
View file

This file was deleted.

0 comments on commit 77c82aa

Please sign in to comment.