Add Chaplin application. #319

Merged
merged 1 commit into from Dec 12, 2012

Conversation

Projects
None yet
4 participants
Contributor

paulmillr commented Nov 12, 2012

Finally.

Sorry for the delay, bros. Will need to fix shit up to make it conform to the spec a bit but it works. Just give me two days.

paulmillr referenced this pull request Nov 12, 2012

Closed

Chaplin app #292

Owner

addyosmani commented Nov 12, 2012

Thanks for getting this completed @paulmillr! We'll review :)

@sindresorhus sindresorhus and 1 other commented on an outdated diff Nov 13, 2012

labs/dependency-examples/chaplin_brunch/.gitignore
+*.sass-cache
+
+# OS or Editor folders
+.DS_Store
+.cache
+.project
+.settings
+.tmproj
+nbproject
+Thumbs.db
+
+# NPM packages folder.
+node_modules/
+
+# Brunch folder for temporary files.
+tmp/
@sindresorhus

sindresorhus Nov 13, 2012

Owner

remove this file. should be in your global gitignore.

@paulmillr

paulmillr Nov 13, 2012

Contributor

Sure.

BTW, node_modules needs to be ignored, because it’s what brunch creates for plugins. If any other user will try to build the app, he will see the dir in git repo too.

@sindresorhus

sindresorhus Nov 14, 2012

Owner

I agree, just remove everything non-project specific

@sindresorhus sindresorhus commented on an outdated diff Nov 13, 2012

labs/dependency-examples/chaplin_brunch/README.md
@@ -0,0 +1,11 @@
+# Brunch with Chaplin TODOMVC
+Brunch with Chaplin is a skeleton (boilerplate) for [Brunch](http://brunch.io)
+based on [Chaplin](https://github.com/chaplinjs/chaplin) framework.
+
+The application is based on the skeleton.
+
+## Getting started
+To build the app, you will need to execute `brunch build` in the root directory. That’s all.
@sindresorhus

sindresorhus Nov 13, 2012

Owner

Add in that the user has to do npm install and install brunch first.

@sindresorhus

sindresorhus Nov 14, 2012

Owner

Also how to run the server and test.

@sindresorhus sindresorhus commented on an outdated diff Nov 13, 2012

...endency-examples/chaplin_brunch/app/assets/index.html
@@ -0,0 +1,44 @@
+<!doctype html>
+<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
+<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
+<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
+<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
@sindresorhus

sindresorhus Nov 13, 2012

Owner

remove these, we only support IE9+

@sindresorhus sindresorhus and 1 other commented on an outdated diff Nov 13, 2012

...endency-examples/chaplin_brunch/app/assets/index.html
+ by brunch and you need just to import `vendor.js` -->
+ <script src="../../../../assets/base.js"></script>
+ <script src="../../../../assets/jquery.min.js"></script>
+ <script src="../../../../assets/lodash.min.js"></script>
+ <script src="../../../../assets/handlebars.min.js"></script>
+
+ <script src="javascripts/vendor.js"></script>
+ <script src="javascripts/app.js"></script>
+ <script>require('initialize');</script>
+</head>
+<body>
+ <section id="todoapp">
+ <header id="header"></header>
+ <!-- This section should be hidden by default and shown when there are todos -->
+ <section id="main"></section>
+ <!-- This footer should hidden by default and shown when there are todos -->
@sindresorhus

sindresorhus Nov 13, 2012

Owner

remove default html comments

@paulmillr

paulmillr Nov 14, 2012

Contributor

my bad, forgot about them

@sindresorhus sindresorhus commented on an outdated diff Nov 13, 2012

...endency-examples/chaplin_brunch/app/assets/index.html
+ <script src="javascripts/vendor.js"></script>
+ <script src="javascripts/app.js"></script>
+ <script>require('initialize');</script>
+</head>
+<body>
+ <section id="todoapp">
+ <header id="header"></header>
+ <!-- This section should be hidden by default and shown when there are todos -->
+ <section id="main"></section>
+ <!-- This footer should hidden by default and shown when there are todos -->
+ <footer id="footer"></footer>
+ </section>
+ <footer id="info">
+ <p>Double-click to edit a todo</p>
+ <!-- Remove the below line ↓ -->
+ <p>Template by <a href="http://github.com/sindresorhus">Sindre Sorhus</a></p>

@sindresorhus sindresorhus commented on an outdated diff Nov 13, 2012

...endency-examples/chaplin_brunch/app/initialize.coffee
@@ -0,0 +1,6 @@
+Application = require 'application'
+
+# Initialize the application on DOM ready event.
+$(document).on 'ready', ->
@sindresorhus

sindresorhus Nov 13, 2012

Owner

$ -> is enough

@sindresorhus sindresorhus commented on an outdated diff Nov 14, 2012

labs/dependency-examples/chaplin_brunch/.editorconfig
@@ -0,0 +1,3 @@
+[*.coffee]
@sindresorhus

sindresorhus Nov 14, 2012

Owner

Needs a root prop, and add in the comment from the top level editorconfig file

@sindresorhus sindresorhus and 1 other commented on an outdated diff Nov 14, 2012

labs/dependency-examples/chaplin_brunch/package.json
@@ -0,0 +1,35 @@
+{
+ "author": "Your Name",
+ "name": "package-name",
+ "description": "Package description",
+ "version": "0.0.1",
+ "homepage": "",
+ "repository": {
+ "type": "git",
+ "url": ""
+ },
@sindresorhus

sindresorhus Nov 14, 2012

Owner

Can you fill out the missing props and remove unused ones?

@paulmillr

paulmillr Nov 14, 2012

Contributor

done.

This file usually exists just because it’s needed for simple npm install of brunch plugins.

@sindresorhus sindresorhus and 1 other commented on an outdated diff Nov 14, 2012

labs/dependency-examples/chaplin_brunch/package.json
@@ -0,0 +1,35 @@
+{
+ "author": "Your Name",
+ "name": "package-name",
+ "description": "Package description",
+ "version": "0.0.1",
+ "homepage": "",
+ "repository": {
+ "type": "git",
+ "url": ""
+ },
+ "engines": {
+ "node": "~0.6.10 || 0.8 || 0.9"
@paulmillr

paulmillr Nov 14, 2012

Contributor

not a fan of lack of max node ver. a lot of packages had been breaking for me in the past just because they used >= 0.2 in engine req while I had node 0.6. how about 0.8 || 0.9?

@sindresorhus sindresorhus and 1 other commented on an outdated diff Nov 14, 2012

labs/dependency-examples/chaplin_brunch/package.json
+ },
+ "scripts": {
+ "start": "brunch watch --server",
+ "test": "brunch test"
+ },
+ "dependencies": {
+ "javascript-brunch": ">= 1.0 < 1.5",
+ "coffee-script-brunch": ">= 1.0 < 1.5",
+
+ "css-brunch": ">= 1.0 < 1.5",
+ "stylus-brunch": ">= 1.0 < 1.5",
+
+ "handlebars-brunch": ">= 1.0 < 1.5",
+
+ "uglify-js-brunch": ">= 1.0 < 1.5",
+ "clean-css-brunch": ">= 1.0 < 1.5"
@sindresorhus

sindresorhus Nov 14, 2012

Owner

Uhm ~1.3.0? Why less than 1.5?

@paulmillr

paulmillr Nov 14, 2012

Contributor

Brunch 1.4 apps are compatible with brunch plugins 1.0, 1.1, 1.2, 1.3, 1.4. That’s just a convention, like in rails. Plugins aren’t upgraded as often as brunch etc.

@sindresorhus

sindresorhus Nov 14, 2012

Owner

ok, goes a bit against semver though, but sure, if that's the brunch convention.

@sindresorhus sindresorhus commented on an outdated diff Nov 14, 2012

labs/dependency-examples/chaplin_brunch/package.json
+ "dependencies": {
+ "javascript-brunch": ">= 1.0 < 1.5",
+ "coffee-script-brunch": ">= 1.0 < 1.5",
+
+ "css-brunch": ">= 1.0 < 1.5",
+ "stylus-brunch": ">= 1.0 < 1.5",
+
+ "handlebars-brunch": ">= 1.0 < 1.5",
+
+ "uglify-js-brunch": ">= 1.0 < 1.5",
+ "clean-css-brunch": ">= 1.0 < 1.5"
+ },
+ "devDependencies": {
+ "chai": "1.2.0",
+ "sinon": "1.4.2",
+ "sinon-chai": "2.1.2"
@sindresorhus

sindresorhus Nov 14, 2012

Owner

~2.1.2 on all

@sindresorhus sindresorhus and 1 other commented on an outdated diff Nov 14, 2012

...-examples/chaplin_brunch/app/views/footer_view.coffee
+ @delegate 'click', '#clear-completed', @clearCompleted
+
+ render: =>
+ super
+ @renderCounter()
+
+ updateFilterer: (filterer) =>
+ @$('#filters a')
+ .removeClass('selected')
+ .filter("[href='#/#{filterer}']")
+ .addClass('selected')
+
+ renderCounter: =>
+ @$('#todo-count > strong').html @collection.getActive().length
+ method = if @collection.length is 0 then 'hide' else 'show'
+ @$el[method]()
@sindresorhus

sindresorhus Nov 14, 2012

Owner

@$el.toggle(if @collection.length is not 0) or something

@paulmillr

paulmillr Nov 14, 2012

Contributor

nice, somehow I was not aware of this for years.

@sindresorhus sindresorhus commented on an outdated diff Nov 14, 2012

...mples/chaplin_brunch/app/views/styles/application.css
@@ -0,0 +1,5 @@
+#todoapp.filter-active #todo-list .completed {
+ display: none; }
+
+#todoapp.filter-completed #todo-list .active {
+ display: none; }
@sindresorhus

sindresorhus Nov 14, 2012

Owner

Routing:

When the route changes the todo list should be filtered on a model level

@sindresorhus sindresorhus commented on an outdated diff Nov 14, 2012

...-examples/chaplin_brunch/app/views/templates/home.hbs
@@ -0,0 +1,3 @@
+<a href="http://brunch.io/">
+ <img src="http://brunch.io/images/brunch.png" alt="Brunch" />
@sindresorhus

sindresorhus Nov 14, 2012

Owner

alt="Brunch">

@sindresorhus sindresorhus and 1 other commented on an outdated diff Nov 14, 2012

...-examples/chaplin_brunch/app/views/templates/todo.hbs
@@ -0,0 +1,6 @@
+<div class="view">
+ <input class="toggle" type="checkbox"{{#if completed}} checked{{/if}} />
@sindresorhus

sindresorhus Nov 14, 2012

Owner

checked{{/if}}>

and all other instances of unnecessary selfclosing

@paulmillr

paulmillr Nov 14, 2012

Contributor

done.

also I prefer self-closing because it’s easier to distinguish closed elems:

<input>
<strong>a</strong>
<input />
<div></div>
Contributor

paulmillr commented Nov 14, 2012

thanks for review; I fixed everything.

edit: github is buggy, 66e8ecf ain’t showing somehow

Owner

addyosmani commented Nov 15, 2012

Thanks for working on updating the pull request :) We'll review again.

Contributor

paulmillr commented Nov 15, 2012

@sindresorhus that’s because brunch runs webserver on public directory (public/ by default) and lodash etc assets are located higher in fs.

Owner

sindresorhus commented Nov 15, 2012

So how do I get it to work? Can we symlink in the assets into public?

Contributor

paulmillr commented Nov 15, 2012

we can, but i’m just running http server on root directory of todomvc and brunch w (w/o --server) on app directory. works fine

Owner

sindresorhus commented Nov 15, 2012

Ok, sure, let go with the first one, but can you add instruction in the readme on how to do it?

Some comments:

  • New todo:

Make sure to .trim() the input and then check that it's not empty before creating a new todo.

  • Editing:

When editing mode is activated it will hide the other controls and bring forward an input that contains the todo title, which should be focused (.focus()). The edit should be saved on both blur and enter, and the editing class should be removed. Make sure to .trim() the input and then check that it's not empty. If it's empty the todo should instead be destroyed.

  • Counter:

Also make sure to pluralize the item word correctly: 0 items, 1 item, 2 items. Example: 2 items left

  • All filter is not bold on pageload, when no filters are selected
  • Clear completed:

Displays the number of completed todos, and when clicked, removes them. Should be hidden when there are no completed todos.

Owner

addyosmani commented Nov 18, 2012

@paulmillr Thanks once again for working on some of the comments we had! As Sindre mentioned if you could cover any steps needed to get the user up and running with the app (e.g the server) that would save them time trying to figure it out themselves :)

Owner

sindresorhus commented Dec 5, 2012

@paulmillr ping

Owner

addyosmani commented Dec 6, 2012

It would be awesome to get this finished in time for the next release. Fingers crossed Paul will have some bandwidth :)

Contributor

paulmillr commented Dec 9, 2012

All done, please review.

I’d want to squash all commits before merge.

Owner

sindresorhus commented Dec 10, 2012

Also make sure to pluralize the item word correctly: 0 items, 1 item, 2 items. Example: 2 items left

Doesn't seem to have taken. I can see your fix in the commit, but it's not visible when I open index.html.

And #main should be hidden when there are no todos.

Otherwise this looks good to me :)

Contributor

paulmillr commented Dec 11, 2012

@sindresorhus mhm, pluralizing works fine for me. 1 item, 2 items etc (0 items ain’t showing because footer is hidden with 0 items). pushed #main change.

just one detail: can I name the subdirectory as chaplin-brunch instead of chaplin_brunch or there is underscore convention?

Owner

sindresorhus commented Dec 11, 2012

@paulmillr Ah, now I get it. The counter should be updated when a todo is checked/unchecked and not when it's removed.

Dash is fine

Contributor

paulmillr commented Dec 12, 2012

ah, typo. fixed!

@sindresorhus sindresorhus added a commit that referenced this pull request Dec 12, 2012

@sindresorhus sindresorhus Merge pull request #319 from paulmillr/topics/chaplin
Add Chaplin application.
07898f7

@sindresorhus sindresorhus merged commit 07898f7 into tastejs:gh-pages Dec 12, 2012

Owner

sindresorhus commented Dec 12, 2012

Landed. Awesome stuff 🍔

Owner

addyosmani commented Dec 12, 2012

Thank you so much, Paul! You rock!

Contributor

paulmillr commented Dec 12, 2012

thanks guys. we should work on tastejs!

Owner

sindresorhus commented Dec 12, 2012

Yeah, not possible yet for me though, Yeoman finish-up this week, then 2 weeks Mexico. But after that I'm ready to drive it full on!

Owner

addyosmani commented Dec 12, 2012

We'll setup a TasteJS thread or group to engage with framework authors over the next few weeks. I think Taste won't realistically launch until end of Jan at the earliest, but we can definitely discuss :)

Owner

sindresorhus commented Dec 12, 2012

👍

reubano commented Apr 27, 2013

@paulmillr I want to make a stand-alone version of this to run with brunch so I copied this example to its own directory and copied the assets over as well. brunch w plus opening the index.html file works. However brunch w -s doesn't. it gives the following error

events.js:66
        throw arguments[1]; // Unhandled 'error' event
                       ^
Error: listen EADDRINUSE
    at errnoException (net.js:769:11)
    at Server._listen2 (net.js:909:14)
    at listen (net.js:936:10)
    at Server.listen (net.js:985:5)
    at Function.app.listen (/opt/local/lib/node_modules/brunch/node_modules/express/lib/application.js:532:24)
    at startDefaultServer (/opt/local/lib/node_modules/brunch/lib/helpers.js:190:12)
    at Object.exports.startServer (/opt/local/lib/node_modules/brunch/lib/helpers.js:213:14)
    at initialize (/opt/local/lib/node_modules/brunch/lib/commands/watch.js:187:26)
    at Object.exports.loadPackages (/opt/local/lib/node_modules/brunch/lib/helpers.js:539:12)
    at initialize (/opt/local/lib/node_modules/brunch/lib/commands/watch.js:161:20)
    at new BrunchWatcher (/opt/local/lib/node_modules/brunch/lib/commands/watch.js:247:7)
    at module.exports.watch (/opt/local/lib/node_modules/brunch/lib/commands/watch.js:282:12)
    at ArgumentParser.parse (/opt/local/lib/node_modules/brunch/node_modules/argumentum/lib/argumentum.js:407:27)
    at Object.exports.run (/opt/local/lib/node_modules/brunch/lib/cli.js:196:47)
    at Object.<anonymous> (/opt/local/lib/node_modules/brunch/bin/brunch:7:32)
    at Module._compile (module.js:449:26)
    at Object.Module._extensions..js (module.js:467:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:312:12)
    at Module.runMain (module.js:492:10)
    at process.startup.processNextTick.process._tickCallback (node.js:244:9)

mac osx 10.7.5
brunch 1.5.3
npm 1.1.61

any suggestions??

Contributor

paulmillr commented Apr 27, 2013

@reubano it means your 3333 port is taken by other application. try changing port, like brunch w -s -p 3335

reubano commented Apr 27, 2013

@paulmillr thanks! that was it. works like a charm now.

@gustaff-weldon gustaff-weldon pushed a commit to gustaff-weldon/todomvc that referenced this pull request Dec 23, 2013

@sindresorhus sindresorhus Merge pull request #319 from paulmillr/topics/chaplin
Add Chaplin application.
0705033
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment