# Repres HyperText 超文本资源表现引擎 [![License](https://img.shields.io/badge/license-MIT-green.svg)](http://opensource.org/licenses/MIT) [![Gem Version](https://badge.fury.io/rb/repres-hyper_text.svg)](https://badge.fury.io/rb/repres-hyper_text) [![Dependency Status](https://gemnasium.com/badges/github.com/topbitdu/repres-hyper_text.svg)](https://gemnasium.com/github.com/topbitdu/repres-hyper_text) Repres (REsource PRESentation) is a series of resource presentation engines. The Hyper Text resource presentation engine includes HyperText-based resource presentation templates & snippets. Repres (资源表现)是一系列的资源表现引擎。超文本资源表现引擎包括基于超文本的资源表现模版和片段。 ## Recent Update Check out the [Road Map](ROADMAP.md) to find out what's the next. Check out the [Change Log](CHANGELOG.md) to find out what's new. ## Usage in Gemfile ```ruby gem 'repres-hyper_text' ``` ## Include the Helper in your Application Controller before Render the Style or Script ```ruby helper Repres::HyperText::ApplicationHelper ``` ## Render the Pre-defined Partials ```erb
<%= render partial: 'repres/hyper_text/meta' %> <%= hyper_text_meta %> <%= render partial: 'repres/hyper_text/icon' %> <%= hyper_text_icon %> <%= render partial: 'repres/hyper_text/style', locals: { options: { 'font-awesome' => true } } %> <%= hyper_text_style 'font-awesome' => true %> <%= render partial: 'repres/hyper_text/script', locals: { options: { jquery: true } } %> <%= hyper_text_script jquery: true %> ``` ### Render the Meta The Meta partial includes the HTML meta tags for HTML 5. ```erb <%= render partial: 'repres/hyper_text/meta' %> <%= hyper_text_meta %> ``` The source codes of the Meta partial: ```html ``` ### Render the Favorite Icon The Icon partial includes the HTML link tags for Favorite Icons. ```erb <%= render partial: 'repres/hyper_text/icon', locals: { options: { safari_mask_icon_color: '#5bbad5', microsoft_application_title_color: '#da532c', theme_color: '#ffffff' } } %> <%= hyper_text_icon safari_mask_icon_color: '#5bbad5', microsoft_application_title_color: '#da532c', theme_color: '#ffffff' %> ``` ### Render the Script The Script partial includes the HTML script tags. The [Boot CDN](http://cdn.bootcss.com/) server is supported by default. However, the :cdn option could be passed in to support other CDN servers. The CDN servers must syncrhonize with [cdnjs](https://github.com/cdnjs/cdnjs). The following code snippet does not load any JavaScript library. ```erb <%= render partial: 'repres/hyper_text/script' %> <%= hyper_text_script %> ``` The following code snippet loads the latest jQuery. ```erb <%= render partial: 'repres/hyper_text/script', locals: { options: { jquery: true } } %> <%= hyper_text_script jquery: true %> ``` The following code snippet loads the jQuery with the given version. ```erb <%= render partial: 'repres/hyper_text/script', locals: { options: { jquery: { version: '2.2.0', cdn: 'cdn.server.com' } } } %> <%= hyper_text_script jquery: { version: '2.2.0', cdn: 'cdn.server.com' } %> ``` The following JavaScript libraries are switchable, and the version can be configurable: - :modernizr - :jquery - :buttons ### Render the Style The Style partial includes the HTML style tags. The [Boot CDN](http://cdn.bootcss.com/) server is supported by default. However, the :cdn option could be passed in to support other CDN servers. The CDN servers must syncrhonize with [cdnjs](https://github.com/cdnjs/cdnjs). The following code snippet does not load any CSS library. ```erb <%= render partial: 'repres/hyper_text/style' %> <%= hyper_text_style %> ``` The following code snippet loads the latest Font Awesome. ```erb <%= render partial: 'repres/hyper_text/script', locals: { options: { :'font-awesome' => true } } %> <%= hyper_text_style :'font-awesome' => true %> ``` The following code snippet loads the Font Awesome with the given version. ```erb <%= render partial: 'repres/hyper_text/style', locals: { options: { :'font-awesome' => { version: '4.4.0', cdn: 'cdn.server.com' } } } %> <%= hyper_text_style :'font-awesome' => { version: '4.4.0', cdn: 'cdn.server.com' } %> ``` The following CSS libraries are switchable, and the version can be configurable: - :'font-awesome' - :buttons - :'animate.css'