Skip to content

Instantly share code, notes, and snippets.

@deepflame
Last active August 29, 2015 14:04
Show Gist options
  • Save deepflame/ab9d40b95bd6ed55d81c to your computer and use it in GitHub Desktop.
Save deepflame/ab9d40b95bd6ed55d81c to your computer and use it in GitHub Desktop.
EmberJS: inserting an app template / layout without changing the url
body {
padding-top: 75px;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script type="text/x-handlebars" data-template-name="welcome">
Welcome!!
{{link-to "Goto App" 'app'}}
</script>
<script type="text/x-handlebars" data-template-name="app">
<div class="navbar navbar-default navbar-fixed-top">
{{link-to 'Home' 'app'}}
{{link-to 'About' 'app.about'}}
</div>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="app/index">
HOME
</script>
<script type="text/x-handlebars" data-template-name="app/about">
ABOUT
</script>
<script src="http://emberjs.com.s3.amazonaws.com/getting-started/jquery.min.js"></script>
<script src="http://emberjs.com.s3.amazonaws.com/getting-started/handlebars.js"></script>
<script src="http://builds.emberjs.com/tags/v1.6.1/ember.prod.js"></script>
</body>
</html>
window.App = Ember.Application.create();
App.Router.map(function () {
this.route('welcome');
this.resource('app', { path: '/' }, function () {
this.route('about');
});
});
// change this to go directly into the app
var userFirstTime = true;
App.ApplicationRoute = Ember.Route.extend({
beforeModel: function () {
if (userFirstTime) {
this.transitionTo('welcome');
}
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment