Project Discontinued
I stop this project because I changed my way of working with RAils assets pipeline. A new project will comes later. In the meantime you ca have a look of this post : Javascript initializers to your views with Rails 3.1 and CoffeeScript
WARNING: HTML5S project is dead and will be replaced by https://github.com/damln/Epycea, adding dynamic behaviors and valuable sass mixins. Future release of epyce (0.9.0) will include these changes and will deprecate code in epyce.css (reset.css, screen.css and obile.css)
HTML Epyce is a a rails layout including configurable Skeleton, HTML5S and knockout.js
- skeleton (http://www.getskeleton.com/) support png background for old IE
- part of Damian Le Nouaille HTML5S project (https://github.com/damln/Html5S) which itself take parts of html5 boilerplate (http://html5boilerplate.com)
- depends on haml gem (http://haml-lang.com/)
Provide a application.html.haml layout and some useful files in the public directory such as default icons.
Epyce include libs in debug mode when running in development environment and with minimal version of libs otherwise.
Provided libs are :
- knockout.js (http://knockoutjs.com) Model-View-ViewModel pattern implementation
- head.js (http://headjs.com/) html reset and javascript load/run management
- Underscore.js (http://documentcloud.github.com/underscore) provides a lot of the functional programming
For update Infos, follow http://twitter.com/epyce on twitter
First, make sure the following gems are in your Gemfile
gem "epyce", "~> 0.8.3"
Then run the following
bundle install
rails generate epyce:install
Here's a list of the files generator install in your Rails project:
app/views/layouts/application.html.haml
app/views/layouts/_header.html.haml
app/views/layouts/_header.html.haml
app/views/layouts/_footer.html.haml
app/views/layouts/_flashes.html.haml
public/apple-touch-icon-114x114-precomposed.png
public/apple-touch-icon-57x57-precomposed.png
public/apple-touch-icon-72x72-precomposed.png
public/apple-touch-icon-precomposed.png
public/apple-touch-icon.png
public/favicon.png
public/crossdomain.xml
app/assets/javascripts/epyce-libs-debug.js.coffee
app/assets/javascripts/epyce-libs.js.coffee
app/assets/javascripts/epyce.js.coffee
app/assets/stylesheets/epyce.css.sass
Epyce change the default asset pipeline behavior included in application.html.erb and do not include application.js or application.css.
The layout application.html.haml include thiner grained assets (see epyce.js.coffee and epyce.css.sass) :
-
all files in folders
app/assets/javascripts/applicationapp/assets/stylesheets/application
-
css and javascript common for all views in a controller
app/assets/javascripts/__controller_name__.js[.coffee]app/assets/stylesheets/__controller_name__.js[.sass|.scss]
-
css and javascript for the actual view
app/assets/javascripts/__controller_name__/__action_name__.js[.coffee]app/assets/stylesheets/__controller_name__/__action_name__.js[.sass|.scss]
You can customize what javascript libs are loaded by editing
app/assets/javascripts/epyce-libs-debug.js.coffee
app/assets/javascripts/epyce-libs.js.coffee
You can customize what css are loaded by editing
app/assets/javascripts/epyce.css.sass
You can use Skeleton with dynamic behavior on big screen by changing values in app/assets/stylesheets/epyce.css.sass
$skeleton_global_width: 960px
$skeleton_column_margin_left: 10px
$skeleton_column_margin_right: 10px
$skeleton_row_margin_bottom: 20px
Due to bug https://github.com/nex3/sass/issues/46 in sass I have fixed skeleton to 960px when screen width goes below 1200px.
This mean for example you set $skeleton_global_width: 1350px, skeleton will use autoresponsive width like this :
| screen width | skeleton effective width |
| 1400 | 1350 |
| 1300 | 1350 |
| 1200 | 1350 |
| 1199 | 960 |
| 950 | 768 |
- replace HTML5S with https://github.com/damln/Epycea
- write namespace based pre-compile for production ENV. This way all Assets should be precompiled again in prod with code conflict
- Still need to place the icons in the right location
- create a epyce-knockout gem and depend on it
- Helpers for knockout.js
- create a epyce-backbone gem to integrate backbone.js