Skip to content

Instantly share code, notes, and snippets.

@jimnanney

jimnanney/index.html

Created November 9, 2014 17:26
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save jimnanney/079aaeb9f18a43212493 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save jimnanney/079aaeb9f18a43212493 to your computer and use it in GitHub Desktop.
Download ZIP
Ember SC Explorer Ember Starter Kit // source http://emberjs.jsbin.com/yadol
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ember SC Explorer</title>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/normalize/2.1.0/normalize.css" />
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootswatch/3.3.0/flatly/bootstrap.min.css" />
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" />
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="http://connect.soundcloud.com/sdk.js"></script>
<script type="text/javascript">
// initialize client with app credentials
SC.initialize({
client_id: '1649972c395d47d9f8b69476f2c25ba8',
redirect_uri: 'http://jimnanney.github.io/emberscexplorer/callback.html'
});
</script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.3.0/handlebars.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/ember.js/1.8.1/ember.js"></script>
<style id="jsbin-css">
/* Put your CSS here */
body {
padding-top: 70px;
}
.results-thumb {
width: 100px;
}
.not-avail {
width: 100px;
height: 100px;
background-repeat: no-repeat;
background-image: url(data:image/jpeg;base64,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);
}
</style>
</head>
<body>
<script type="text/x-handlebars">
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Ember SC Explorer</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="starter-template">
<h2>Search SoundCloud Sounds</h2>
{{outlet}}
</div>
</div>
</script>
<script type="text/x-handlebars" id="index">
<div class="formgroup">
{{input type="search" value=query placeholder="Enter Search Text.."}}
</div>
<hr />
<ul clas="list-unstyled media-list">
{{#each track in results}}
<li class="list-unstyled media">
<a class="media-left" href="#">
{{#if track.artwork_url}}
<img {{bind-attr src=track.artwork_url}} class="results-thumb"/>
{{else}}
<img src="" class="results-thumb not-avail" />
{{/if}}
</a>
<div class="media-body">
<h4 class="media-heading">{{track.title}}</h3>
<p>{{track.user.username}}</p>
{{#if track.streamable}}
<div class="btn-group">
<button type="button" class="btn btn-default" {{action "stop" track}}><i class="fa fa-stop"></i></button>
<button type="button" class="btn btn-default" {{action "pause" track}}><i class="fa fa-pause"></i></button>
<button type="button" class="btn btn-default"><i class="fa fa-play" {{action "play" track}}></i></button>
</div>
{{/if}}
</div>
</li>
{{/each}}
</ul>
</script>
<script type="text/javascript">
App = Ember.Application.create();
App.IndexRoute = Ember.Route.extend({
model: function() {
Em.A();
}
});
App.IndexController = Em.ArrayController.extend({
query: "",
currentStream: null,
results: Em.computed(function() {
var that = this;
var q = this.get('query');
if (q !== null && q.length > 0) {
this.get('model').clear();
SC.get('/tracks', {limit: 25, q: this.get('query')} , function(tracks) {
that.get('model').clear();
that.get('model').pushObjects(tracks);
});
return this.get('model');
}
}).property('query'),
actions: {
play: function(track) {
var that = this;
var s = this.get('currentStream');
if (s !== null) {
s.stop();
}
SC.stream(track.stream_url, function(sound) {
that.set('currentStream', sound);
sound.start();
});
},
stop: function(track) {
var s = this.get('currentStream');
if (s !== null) {
s.stop();
}
},
pause: function(track) {
var s = this.get('currentStream');
if (s !== null) {
s.pause();
}
}
}
});
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ember SC Explorer</title>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/normalize/2.1.0/normalize.css" />
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootswatch/3.3.0/flatly/bootstrap.min.css" />
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" />
<\!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<\!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<\!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"><\/script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"><\/script>
<![endif]-->
<script src="//code.jquery.com/jquery-1.11.1.min.js"><\/script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"><\/script>
<script src="http://connect.soundcloud.com/sdk.js"><\/script>
<script type="text/javascript">
// initialize client with app credentials
SC.initialize({
client_id: '1649972c395d47d9f8b69476f2c25ba8',
redirect_uri: 'http://jimnanney.github.io/emberscexplorer/callback.html'
});
<\/script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.3.0/handlebars.min.js"><\/script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ember.js/1.8.1/ember.js"><\/script>
</head>
<body>
<script type="text/x-handlebars">
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Ember SC Explorer</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="starter-template">
<h2>Search SoundCloud Sounds</h2>
{{outlet}}
</div>
</div>
<\/script>
<script type="text/x-handlebars" id="index">
<div class="formgroup">
{{input type="search" value=query placeholder="Enter Search Text.."}}
</div>
<hr />
<ul clas="list-unstyled media-list">
{{#each track in results}}
<li class="list-unstyled media">
<a class="media-left" href="#">
{{#if track.artwork_url}}
<img {{bind-attr src=track.artwork_url}} class="results-thumb"/>
{{else}}
<img src="" class="results-thumb not-avail" />
{{/if}}
</a>
<div class="media-body">
<h4 class="media-heading">{{track.title}}</h3>
<p>{{track.user.username}}</p>
{{#if track.streamable}}
<div class="btn-group">
<button type="button" class="btn btn-default" {{action "stop" track}}><i class="fa fa-stop"></i></button>
<button type="button" class="btn btn-default" {{action "pause" track}}><i class="fa fa-pause"></i></button>
<button type="button" class="btn btn-default"><i class="fa fa-play" {{action "play" track}}></i></button>
</div>
{{/if}}
</div>
</li>
{{/each}}
</ul>
<\/script>
<script type="text/javascript">
App = Ember.Application.create();
App.IndexRoute = Ember.Route.extend({
model: function() {
Em.A();
}
});
App.IndexController = Em.ArrayController.extend({
query: "",
currentStream: null,
results: Em.computed(function() {
var that = this;
var q = this.get('query');
if (q !== null && q.length > 0) {
this.get('model').clear();
SC.get('/tracks', {limit: 25, q: this.get('query')} , function(tracks) {
that.get('model').clear();
that.get('model').pushObjects(tracks);
});
return this.get('model');
}
}).property('query'),
actions: {
play: function(track) {
var that = this;
var s = this.get('currentStream');
if (s !== null) {
s.stop();
}
SC.stream(track.stream_url, function(sound) {
that.set('currentStream', sound);
sound.start();
});
},
stop: function(track) {
var s = this.get('currentStream');
if (s !== null) {
s.stop();
}
},
pause: function(track) {
var s = this.get('currentStream');
if (s !== null) {
s.pause();
}
}
}
});
<\/script>
</body>
</html>
</script>
<script id="jsbin-source-css" type="text/css">/* Put your CSS here */
body {
padding-top: 70px;
}
.results-thumb {
width: 100px;
}
.not-avail {
width: 100px;
height: 100px;
background-repeat: no-repeat;
background-image: url(data:image/jpeg;base64,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);
}</script>
</body>
</html>
Raw
jsbin.yadol.css
/* Put your CSS here */
body {
padding-top: 70px;
}
.results-thumb {
width: 100px;
}
.not-avail {
width: 100px;
height: 100px;
background-repeat: no-repeat;
background-image: url(data:image/jpeg;base64,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);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment