Skip to content

Instantly share code, notes, and snippets.

@e00dan
Last active July 18, 2017 18:20
Show Gist options
  • Save e00dan/f7756fe0198f7275ac41a6a786947aaa to your computer and use it in GitHub Desktop.
Save e00dan/f7756fe0198f7275ac41a6a786947aaa to your computer and use it in GitHub Desktop.
PromiseObjectIsPendingTemplate
import Ember from 'ember';
export default function () {
window.server = this;
this.timing = 3000;
this.get('/categories');
this.get('/categories/:id');
this.get('/posts');
this.get('/posts/:id');
this.get('/words');
this.get('/words/:id');
}
import { Factory, faker } from 'ember-cli-mirage';
export default Factory.extend({
name(i) {
return `Category ${i+1}`;
},
description: 'This is the description',
afterCreate(category, server) {
server.createList('post', 5, { category });
}
});
import { Factory, association } from 'ember-cli-mirage';
export default Factory.extend({
name(i) {
return `Post ${i+1}`;
},
afterCreate(post, server) {
let qty = Math.floor(Math.random() * 10) + 3 ;
server.createList('word', qty, { post });
}
});
import { Factory, faker, association } from 'ember-cli-mirage';
export default Factory.extend({
text(i) {
return faker.random.word();
}
});
import { Model, hasMany } from 'ember-cli-mirage';
export default Model.extend({
posts: hasMany()
});
import { Model, hasMany, belongsTo } from 'ember-cli-mirage';
export default Model.extend({
category: belongsTo(),
words: hasMany()
});
import { Model, belongsTo } from 'ember-cli-mirage';
export default Model.extend({
post: belongsTo()
});
export default function(server) {
//let category = server.create('category');
//server.createList('post', 10, { category });
server.createList('category', 5);
//server.createList('post', 4);
//server.createList('word', 10);
};
import DS from 'ember-data';
export default DS.Model.extend({
name: DS.attr('string'),
description: DS.attr('string'),
posts: DS.hasMany('post'),
urgentPosts: Ember.computed.filterBy('posts', 'isUrgent'),
postsLoading: Ember.computed.filterBy('posts', 'isLoading'),
isUrgent: Ember.computed.gt('urgentPosts.length', 0)
});
import DS from 'ember-data';
export default DS.Model.extend({
name: DS.attr('string'),
category: DS.belongsTo('category'),
words: DS.hasMany('word'),
status: 'notUrgent',
//status: 'urgent',
isUrgent: Ember.computed.equal('status', 'urgent')
});
import DS from 'ember-data';
export default DS.Model.extend({
post: DS.belongsTo('post'),
text: DS.attr('string')
});
import Ember from 'ember';
import config from './config/environment';
const Router = Ember.Router.extend({
location: 'none',
rootURL: config.rootURL
});
Router.map(function() {
this.route('home', {path: '/'});
this.route('categories', {path: 'categories'});
this.route('category', {path: 'category/:id'});
this.route('posts', {path: 'posts'});
this.route('post', {path: 'post/:id'});
});
export default Router;
import Ember from 'ember';
export default Ember.Route.extend({
beforeModel() {
this.transitionTo('/category/1');
}
});
import Ember from 'ember';
export default Ember.Route.extend({
model() {
return this.store.findAll('category');
}
});
import Ember from 'ember';
export default Ember.Route.extend({
model(params) {
return this.store.findRecord('category', params.id);
}
});
import Ember from 'ember';
export default Ember.Route.extend({
model(params) {
return this.store.findRecord('post', params.id);
}
});
import Ember from 'ember';
export default Ember.Route.extend({
model() {
return this.store.findAll('post');
}
});
<h1>Welcome!</h1>
{{nav-bar}}
{{outlet}}
<h1>Categories!</h1>
{{#if model.isPending}}
<div style="background-color:green; padding:50px">Loading...</div>
{{else}}
{{#each model as |category|}}
<div>Category {{category.id}}: {{#link-to 'category' category.id}}{{category.name}}{{/link-to}}</div>
{{else}}
<div style="background-color:red; padding:50px">No Categories.</div>
{{/each}}
{{/if}}
<h1>{{model.name}}:</h1>
Description: <b>{{model.description}}</b><br><br>
isUrgent.content: <b>{{model.isUrgent.content}}</b><br><br>
isUrgent.isPending: <b>{{model.isUrgent.isPending}}</b><br><br>
<button disabled={{if model.postsLoading true model.isUrgent}}>Is Not Urgent (Disabled from beginning and during loading is correct)</button><br><br>
{{#if model.posts.isPending}}
<div style="background-color:green; padding:50px">Loading...</div>
{{else}}
{{#each model.posts as |post|}}
<div>Post {{post.id}}: {{#link-to 'post' post.id}}{{post.name}}{{/link-to}} ({{post.words.length}} words)</div>
{{else}}
<div style="background-color:red; padding:50px">No posts in this category.</div>
{{/each}}
{{/if}}
{{link-to 'Home' "home"}} | {{link-to 'Categories' "categories"}} | {{link-to 'Posts' "posts"}}
<hr>
<h1>{{model.name}}:</h1>
id: <b>{{model.id}}</b><br>
name: <b>{{model.name}}</b><br>
tempNumber: <b>{{model.tempNumber}}</b>
<h1>Posts!</h1>
{{#if model.isPending}}
<div style="background-color:green; padding:50px">Loading...</div>
{{else}}
{{#each model as |post|}}
<div>Post {{post.id}}: {{#link-to 'post' post.id}}{{post.name}}{{/link-to}} ({{post.words.length}} words)</div>
{{else}}
<div style="background-color:red; padding:50px">No Posts.</div>
{{/each}}
{{/if}}
{
"version": "0.12.1",
"ENV": {
"ember-cli-mirage": {
"enabled": true
}
},
"EmberENV": {
"FEATURES": {}
},
"options": {
"use_pods": false,
"enable-testing": false
},
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js",
"ember": "2.12.0",
"ember-template-compiler": "2.12.0",
"ember-testing": "2.12.0"
},
"addons": {
"ember-data": "2.13.2",
"ember-cli-mirage": "0.3.3"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment