react_on_rails 13.4.0 → 14.0.0

data/docs/guides/rails-webpacker-react-integration-options.md

@@ -1,213 +0,0 @@
-# Shakapacker (Rails/Webpacker) React Integration Options
-
-You only _need_ props hydration if you need SSR. However, there's no good reason to
-have your app make a second round trip to the Rails server to get initialization props.
-
-**Server-Side Rendering (SSR)** results in Rails rendering HTML for your React components. The main reasons to use SSR are better SEO and pages display more quickly.
-
-These gems provide advanced integration of React with [shakacode/shakapacker](https://github.com/shakacode/shakapacker):
-
-| Gem | Props Hydration | Server-Side-Rendering (SSR) | SSR with HMR | SSR with React-Router | SSR with Code Splitting | Node SSR |
-| --- | --------------- | --- | --------------------- | ----------------------| ------------------------|----|
-| [shakacode/react_on_rails](https://github.com/shakacode/react_on_rails) | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
-| [react-rails](https://github.com/reactjs/react-rails)  | ✅ | ✅ |  | | | | |
-| [webpacker-react](https://github.com/renchap/webpacker-react) | ✅ | | | | | | |
-
-Note, Node SSR for React on Rails requires [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro/).
-
----
-
-As mentioned, you don't _need_ to use a gem to integrate Rails with React.
-
-If you're not concerned with view helpers to pass props or server rendering, you can do it yourself:
-
-```erb
-<%# views/layouts/application.html.erb %>
-
-<%= content_tag :div,
-  id: "hello-react",
-  data: {
-    message: 'Hello!',
-    name: 'David'
-}.to_json do %>
-<% end %>
-```
-
-```js
-// app/javascript/packs/hello_react.js
-
-const Hello = props => (
-  <div className='react-app-wrapper'>
-    <img src={clockIcon} alt="clock" />
-    <h5 className='hello-react'>
-      {props.message} {props.name}!
-    </h5>
-  </div>
-)
-
-// Render component with data
-document.addEventListener('DOMContentLoaded', () => {
-  const node = document.getElementById('hello-react')
-  const data = JSON.parse(node.getAttribute('data'))
-
-  ReactDOM.render(<Hello {...data} />, node)
-})
-```
-
-----
-
-## Suppress warning related to Can't resolve 'react-dom/client' in React < 18
-
-You may see a warning like this when building a Webpack bundle using any version of React below 18:
-
-```
-Module not found: Error: Can't resolve 'react-dom/client' in ....
-```
-
-It can be safely [suppressed](https://webpack.js.org/configuration/other-options/#ignorewarnings) in your Webpack configuration. The following is an example of this suppression in `config/webpack/commonWebpackConfig.js`:
-
-```js
-const { webpackConfig: baseClientWebpackConfig, merge } = require('shakapacker');
-
-const commonOptions = {
-  resolve: {
-    extensions: ['.css', '.ts', '.tsx'],
-  },
-};
-
-const ignoreWarningsConfig = {
-  ignoreWarnings: [/Module not found: Error: Can't resolve 'react-dom\/client'/],
-};
-
-const commonWebpackConfig = () => merge({}, baseClientWebpackConfig, commonOptions, ignoreWarningsConfig);
-
-module.exports = commonWebpackConfig;
-```
-
-----
-
-## HMR and React Hot Reloading
-
-Before turning HMR on, consider upgrading to the latest stable gems and packages:
-https://github.com/shakacode/shakapacker#upgrading
-
-Configure `config/shakapacker.yml` file:
-
-```yaml
-development:
-  extract_css: false
-  dev_server:
-    hmr: true
-    inline: true
-```
-
-This basic configuration alone will have HMR working with the default Shakapacker setup. However, a code save will trigger a full page refresh each time you save a file.
-
-Webpack's HMR allows the replacement of modules for React in-place without reloading the browser. To do this, you have two options:
-
-1. Steps below for the [github.com/pmmmwh/react-refresh-webpack-plugin](https://github.com/pmmmwh/react-refresh-webpack-plugin).
-1. Deprecated steps below for using the [github.com/gaearon/react-hot-loader](https://github.com/gaearon/react-hot-loader).
-
-### React Refresh Webpack Plugin
-[github.com/pmmmwh/react-refresh-webpack-plugin](https://github.com/pmmmwh/react-refresh-webpack-plugin)
-
-You can see an example commit of adding this [here](https://github.com/shakacode/react_on_rails_demo_ssr_hmr/commit/7e53803fce7034f5ecff335db1f400a5743a87e7).
-
-1. Add react refresh packages:
-   `yarn add @pmmmwh/react-refresh-webpack-plugin react-refresh -D`
-2. Update `babel.config.js` adding
-   ```js
-   plugins: [
-     process.env.WEBPACK_DEV_SERVER && 'react-refresh/babel',
-     // other plugins
-   ```
-3. Update `config/webpack/development.js`, only including the plugin if running the WEBPACK_DEV_SERVER
-   ```js
-   const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
-   const environment = require('./environment')
-
-   const isWebpackDevServer = process.env.WEBPACK_DEV_SERVER;
-
-   //plugins
-   if (isWebpackDevServer) {
-       environment.plugins.append(
-           'ReactRefreshWebpackPlugin',
-           new ReactRefreshWebpackPlugin({
-               overlay: {
-                   sockPort: 3035
-               }
-           })
-       );
-   }
-   ```
-
----
-
-### React Hot Loader (Deprecated)
-
-1. Add the `react-hot-loader` and ` @hot-loader/react-dom` npm packages.
-  ```sh
-  yarn add --dev react-hot-loader @hot-loader/react-dom
-  ```
-
-2. Update your babel config, `babel.config.js`. Add the plugin `react-hot-loader/babel`
-with option `"safetyNet": false`:
-
-```
-{
-    "plugins": [
-        [
-            "react-hot-loader/babel",
-            {
-            "safetyNet": false
-            }
-        ]
-    ]
-}
-```
-
-3. Add changes like this to your entry points:
-
-```diff
-// app/javascript/app.jsx
-
-import React from 'react';
-+ import { hot } from 'react-hot-loader/root';
-
-const App = () => <SomeComponent(s) />
-
-- export default App;
-+ export default hot(App);
-```
-
-4. Adjust your webpack configuration for development so that `sourceMapContents` option for the sass
-loader is `false`:
-
-```diff
-// config/webpack/development.js
-
-process.env.NODE_ENV = process.env.NODE_ENV || 'development'
-
-const environment = require('./environment')
-
-// allows for editing sass/scss files directly in browser
-+ if (!module.hot) {
-+   environment.loaders.get('sass').use.find(item => item.loader === 'sass-loader').options.sourceMapContents = false
-+ }
-+
-module.exports = environment.toWebpackConfig()
-```
-
-5. Adjust your `config/webpack/environment.js` for a
-
-```diff
-// config/webpack/environment.js
-
-// ...
-
-// Fixes: React-Hot-Loader: react-🔥-dom patch is not detected. React 16.6+ features may not work.
-// https://github.com/gaearon/react-hot-loader/issues/1227#issuecomment-482139583
-+ environment.config.merge({ resolve: { alias: { 'react-dom': '@hot-loader/react-dom' } } });
-
-module.exports = environment;
-```

data/docs/guides/react-on-rails-overview.md

@@ -1,29 +0,0 @@
-# React on Rails
-
-React on Rails integrates Rails with (server rendering of) Facebook's [React](https://github.com/facebook/react) front-end framework.
-
----
-
-# Project Objective
-
-To provide a high performance framework for integrating Ruby on Rails with React via the [**Shakapacker**](https://github.com/shakacode/shakapacker) gem especially in regards to React Server-Side Rendering for better SEO and improved performance.
-
-# Features and Why React on Rails?
-
-1. Easy passing of props directly from your Rails view to your React components rather than having your Rails view load and then make a separate request to your API.
-1. Tight integration with [shakacode/shakapacker](https://github.com/shakacode/shakapacker).
-1. Server-Side Rendering (SSR), often used for SEO crawler indexing and UX performance, is not offered by `shakacode/shakapacker`.
-1. Support for HMR for a great developer experience.
-1. Supports latest versions of React with hooks.
-1. [Redux](https://github.com/reactjs/redux) and [React Router](https://github.com/ReactTraining/react-router#readme) integration including server-side-rendering.
-1. [Internationalization (I18n) and (localization)](https://www.shakacode.com/react-on-rails/docs/guides/i18n/)
-1. A supportive community. This [web search shows how live public sites are using React on Rails](https://publicwww.com/websites/%22react-on-rails%22++-undeveloped.com+depth%3Aall/).
-1. [ReScript (Reason ML) Support](https://github.com/shakacode/reason-react-on-rails-example).
-
-See the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial) for an example of a live implementation and code.
-
-----
-
-## Prerequisites
-- Ruby on Rails >=5
-- Shakapacker 6.5.1+.

data/docs/guides/react-server-rendering.md

@@ -1,32 +0,0 @@
-# React Server Rendering
-
-See also [Client vs. Server Rendering](https://www.shakacode.com/react-on-rails/docs/guides/client-vs-server-rendering/).
-
-## What is the easiest way to setup a webpack configuration for server-side-rendering?
-See the example webpack setup here: [github.com/shakacode/react_on_rails_demo_ssr_hmr](https://github.com/shakacode/react_on_rails_demo_ssr_hmr).
-
-## What is Server Rendering?
-
-Here's a [decent article to introduce you to server rendering](https://medium.freecodecamp.org/server-side-rendering-your-react-app-in-three-simple-steps-7a82b95db82e). Note, React on Rails takes care of calling the methods in [ReactDOMServer](https://reactjs.org/docs/react-dom-server.html).
-
-During the Rails rendering of HTML per a browser request, the Rails server will execute some JavaScript to create a string of HTML used for React server rendering. This resulting HTML is placed with in your Rails view's output.
-
-The default JavaScript interpretter is [ExecJS](https://github.com/rails/execjs). If you want to maximize the perfomance of your server rendering, then you want to use React on Rails Pro which uses NodeJS to do the server rendering. See the [docs for React on Rails Pro](https://github.com/shakacode/react_on_rails/wiki).
-
-See [this note](https://www.shakacode.com/react-on-rails/docs/guides/client-vs-server-rendering/).
-
-## How do you do Server Rendering with React on Rails?
-1. The `react_component` view helper method provides the `prerender:` option to switch on or off server rendering.
-1. Configure your Webpack setup to create a different server bundle per your needs. While you may reuse the same bundle as for client rendering, this is not common in larger apps for many reasons, such as code splitting, handling CSS and images, different code paths for React Router on the server vs. client, etc.
-1. You need to configure `config.server_bundle_js_file = "server-bundle.js"` in your `config/initializers/react_on_rails.rb`
-1. You should ***not*** put a hash on the server-bundle so that you can easily use the webpack-dev-server for client bundles and have the server bundle generated by a watch process.
-
-## Do you need server rendering?
-
-Server rendering is used for either SEO or performance reasons.
-
-## Considerations for what code can run on in server rendering
-
-1. Never access `window`. Animations, globals on window, etc. just don't make sense when you're trying to run some JavaScript code to output a string of HTML.
-2. JavaScript calls to `setTimeout`, `setInterval`, and `clearInterval` similarly don't make sense when server rendering.
-3. Promises and file system access don't work when server rendering with ExecJS. Instead, you can use the Node renderer or [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro/).

data/docs/guides/render-functions-and-railscontext.md

@@ -1,205 +0,0 @@
-# Render-Functions and the Rails Context 
-
-## Render-Functions
-
-When you use a render-function to create react components (or renderedHtml on the server), or you
-used shared redux stores, you get two params passed to your function that creates a React component:
-
-1. `props`: Props that you pass in the view helper of either `react_component` or `redux_store`
-2. `railsContext`: Rails contextual information, such as the current pathname. You can customize
-   this in your config file. **Note**: The `railsContext` is not related to the concept of a
-   ["context" for React components](https://facebook.github.io/react/docs/context.html#how-to-use-context).
-
-These parameters (`props` and `railsContext`) will be the same regardless of either client or server
-side rendering, except for the key `serverSide` based on whether or not you are server rendering.
-
-While you could manually configure your Rails code to pass the "`railsContext` information" with
-the rest of your "props", the `railsContext` is a convenience because it's passed consistently to
-all invocations of Render-Functions.
-
-For example, suppose you create a "render-function" called MyAppComponent.
-
-```js
-import React from 'react';
-const MyAppComponent = (props, railsContext) => (
-  // NOTE: need to wrap in a function so this is proper React function component that can use
-  // hooks
- 
-  // the props get passed again, but we ignore since we use a closure
-  // or should we
-  () =>
-      <div>
-        <p>props are: {JSON.stringify(props)}</p>
-        <p>railsContext is: {JSON.stringify(railsContext)}
-        </p>
-      </div>
-);
-export default MyAppComponent;
-```
-
-------------------------------
-
-_This would be alternate API where you have to call React.createElement and the React on Rails code doesn't do that._
-
-```js
-import React from 'react';
-const MyAppComponent = (props, railsContext) => (
-  // NOTE: need to wrap in a function so this is proper React function component that can use
-  // hooks
-  React.createElement(
-    () =>
-      <div>
-        <p>props are: {JSON.stringify(props)}</p>
-        <p>railsContext is: {JSON.stringify(railsContext)}
-        </p>
-      </div>,
-  props)
-);
-export default MyAppComponent;
-```
-
-------------------------------------
-
-*Note: you will get a React browser console warning if you try to serverRender this since the value of `serverSide` will be different for server rendering.*
-
-So if you register your render-function `MyAppComponent`, it will get called like:
-
-```js
-reactComponent = MyAppComponent(props, railsContext);
-```
-
-and, similarly, any redux store is always initialized with 2 parameters:
-
-```js
-reduxStore = MyReduxStore(props, railsContext);
-```
-
-Note: you never make these calls. React on Rails makes these calls when it does either client or server rendering. You will define functions that take these 2 params and return a React component or a Redux Store. Naturally, you do not have to use second parameter of the railsContext if you do not need it. If you don't take a second parameter, then you're probably defining a React function component and you will simply return a React Element, often just JSX.
-
-(Note: see below [section](#multiple-react-components-on-a-page-with-one-store) on how to setup redux stores that allow multiple components to talk to the same store.)
-
-The `railsContext` has: (see implementation in file [ReactOnRails::Helper](https://github.com/shakacode/react_on_rails/tree/master/lib/react_on_rails/helper.rb), method `rails_context` for the definitive list).
-
-```ruby
-  {
-    railsEnv: Rails.env
-    inMailer: in_mailer?,
-    # Locale settings
-    i18nLocale: I18n.locale,
-    i18nDefaultLocale: I18n.default_locale,
-    rorVersion: ReactOnRails::VERSION,
-    rorPro: ReactOnRails::Utils.react_on_rails_pro?
-    
-    # URL settings
-    href: request.original_url,
-    location: "#{uri.path}#{uri.query.present? ? "?#{uri.query}": ""}",
-    scheme: uri.scheme, # http
-    host: uri.host, # foo.com
-    port: uri.port,
-    pathname: uri.path, # /posts
-    search: uri.query, # id=30&limit=5
-    httpAcceptLanguage: request.env["HTTP_ACCEPT_LANGUAGE"]
-
-    # Other
-    serverSide: boolean # Are we being called on the server or client? Note: if you conditionally
-     # render something different on the server than the client, then React will only show the
-     # server version!
-  }
-```
-
-Plus, you can add your customizations to this. See "rendering extension" below.
-
-## Rails Context
-
-The `railsContext` is a second param passed to your render-functions for React components. This is in addition to the props that are passed from the `react_component` Rails helper. For example:
-
-ERB view file: 
-
-```ruby
-  # Rails View
-  <%= react_component("HelloWorld", props: { name: "Stranger" }) %>
-```
-
-This is what your HelloWorld.js file might contain. The railsContext is always available for any parameters that you _always_ want available for your React components. It has _nothing_ to do with the concept of the [React Context](https://reactjs.org/docs/context.html).
-
-```js
-import React from 'react';
-
-export default (props, railsContext) => {
-  // Note, wrap in a function so this is React function component
-  return () => (
-    <div>
-      Your locale is {railsContext.i18nLocale}.<br/>
-      Hello, {props.name}!
-    </div>
-  );
-};
-``` 
-
-## Why is the railsContext only passed to render-functions?
-
-There's no reason that the railsContext would ever get passed to your React component unless the value is explicitly put into the props used for rendering. If you create a react component, rather than a render-function, for use by React on Rails, then you get whatever props are passed in from the view helper, which **does not include the Rails Context**. It's trivial to wrap your component in a "render-function" to return a new component that takes both:
-
-```js
-import React from 'react';
-import AppComponent from './AppComponent';
-const AppComponentWithRailsContext = (props, railsContext) => (
-  // Create a React Function Component so you can
-  // use the React Hooks API in this React Function Component
-  () => <AppComponent {...{...props, railsContext}}/>
-)
-export default AppComponentWithRailsContext;
-```
-
-Consider this line in depth:
-
-```js
-  <AppComponent {...{ ...props, railsContext }}/>
-```
-
-The outer `{...` is for the [JSX spread operator for attributes](https://facebook.github.io/react/docs/jsx-in-depth.html#spread-attributes) and the innner `{...` is for the [Spread in object literals](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator#Spread_in_object_literals).
-
-## Use Cases
-
-### Heroku Preboot Considerations
-
-[Heroku Preboot](https://devcenter.heroku.com/articles/preboot) is a feature on Heroku that allows for faster deploy times. When you promote your staging app to production, Preboot simply switches the production server to point at the staging app's container. This means it can deploy much faster since it doesn't have to rebuild anything. However, this means that if you use the [Define Plugin](https://github.com/webpack/docs/wiki/list-of-plugins#defineplugin) to provide the rails environment to your client code as a variable, that variable will erroneously still have a value of `Staging` instead of `Production`. The `Rails.env` provided at runtime in the railsContext is, however, accurate.
-
-### Needing the current URL path for server rendering
-
-Suppose you want to display a nav bar with the current navigation link highlighted by the URL. When you server-render the code, your code will need to know the current URL/path. The new `railsContext` has this information. Your application will apply something like an "active" class on the server rendering.
-
-### Configuring different code for server side rendering
-
-Suppose you want to turn off animation when doing server side rendering. The `serverSide` value is just what you need.
-
-## Customization of the rails_context
-
-You can customize the values passed in the `railsContext` in your `config/initializers/react_on_rails.rb`. Here's how.
-
-Set the config value for the `rendering_extension`:
-
-```ruby
-  config.rendering_extension = RenderingExtension
-```
-
-Implement it like this above in the same file. Create a class method on the module called `custom_context` that takes the `view_context` for a param.
-
-See [spec/dummy/config/initializers/react_on_rails.rb](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/initializers/react_on_rails.rb) for a detailed example.
-
-```ruby
-module RenderingExtension
-
-  # Return a Hash that contains custom values from the view context that will get merged with
-  # the standard rails_context values and passed to all calls to render-functions used by the
-  # react_component and redux_store view helpers
-  def self.custom_context(view_context)
-    {
-     somethingUseful: view_context.session[:something_useful]
-    }
-  end
-end
-```
-
-In this case, a prop and value for `somethingUseful` will go into the railsContext passed to all react_component and redux_store calls. You may set any values available in the view rendering context.
-

data/docs/guides/rspec-configuration.md

@@ -1,73 +0,0 @@
-# RSpec Configuration
-_Click [here for minitest](https://www.shakacode.com/react-on-rails/docs/guides/minitest-configuration/)_
-
-# If your webpack configurations correspond to Shakapacker's default setup
-If you're able to configure your webpack configuration to be run by having your webpack configuration
-returned by the files in `/config/webpack`, then you have 2 options to ensure that your files are
-compiled by webpack before running tests and during production deployment:
-
-1. **Use Shakapacker's compile option**: Configure your `config/shakapacker.yml` so that `compile: true` is for `test` and `production`
-   environments. Ensure that your `source_path` is correct, or else `Shakapacker` won't correctly
-   detect changes.
-2. **Use the react_on_rails settings and helpers**. Use the settings in `config/initializers/react_on_rails.rb`. Refer to [docs/configuration](https://www.shakacode.com/react-on-rails/docs/guides/configuration/).
-
-```yml
-  config.build_test_command = "NODE_ENV=test RAILS_ENV=test bin/shakapacker"
-```
-
-Which should you use? If you're already using the `Shakapacker` way to configure webpack, then
-you can keep things simple and use the `Shakapacker` options.
-
-# Checking for stale assets using React on Rails
-
-Because you will probably want to run RSpec tests that rely on compiled webpack assets (typically, your integration/feature specs where `js: true`), you will want to ensure you don't accidentally run tests on missing or stale webpack assets. If you did use stale Webpack assets, you will get invalid test results as your tests do not use the very latest JavaScript code.
-
-As mentioned above, you can configure `compile: true` in `config/shakapacker.yml` _if_ you've got configuration for
-your webpack in the standard `Shakapacker` spot of `config/webpack/<NODE_ENV>.js`
-
-ReactOnRails also provides a helper method called `ReactOnRails::TestHelper.configure_rspec_to_compile_assets`. Call this method from inside of the `RSpec.configure` block in your `spec/rails_helper.rb` file, passing the config as an argument. See file [lib/react_on_rails/test_helper.rb](https://github.com/shakacode/react_on_rails/tree/master/lib/react_on_rails/test_helper.rb) for more details. You can customize this to your particular needs by replacing any of the default components used by `ReactOnRails::TestHelper.configure_rspec_to_compile_assets`.
-
-```ruby
-RSpec.configure do |config|
-  ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config)
-```
-
-You can pass one or more RSpec metatags as an optional second parameter to this helper method if you want this helper to run on examples other than where `:js`, `:server_rendering`, or `:controller` (those are the defaults). The helper will compile webpack files at most once per test run. The helper will not compile the webpack files unless they are out of date (stale). The helper is configurable in terms of what command is used to prepare the files. If you don't specify these metatags for your relevant JavaScript tests, then you'll need to do the following.
-
-If you are using Webpack to build CSS assets, you should do something like this to ensure that you assets are built for any specs under `specs/requests` or `specs/features`:
-
-```ruby
-  ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config, :requires_webpack_assets)
-  config.define_derived_metadata(file_path: %r{spec/(features|requests)}) do |metadata|
-    metadata[:requires_webpack_assets] = true
-  end
-```
-
-Please take note of the following:
-- If you are using Shakapacker, be **SURE** to configure the `source_path` in your `config/shakapacker.yml` unless you are using the defaults for Shakapacker.
-
-- This utility uses your `build_test_command` to build the static generated files. This command **must not** include the `--watch` option. If you have different server and client bundle files, this command **must** create all the bundles. If you are using Shakapacker, the default value will come from the `config/shakapacker.yml` value for the `public_output_path` and the `source_path`
-
-- If you add an older file to your source files, that is already older than the produced output files, no new recompilation is done. The solution to this issue is to clear out your directory of webpack generated files when adding new source files that may have older dates.
-
-- By default, the webpack processes look in the webpack generated files folder, configured via the `config/shakapacker.yml` config values of `public_root_path` and `public_output_path`. If the webpack generated files folder is missing, is empty, or contains files in the `config.webpack_generated_files` list with `mtime`s older than any of the files in your `client` folder, the helper will recompile your assets.
-
-The following `config/react_on_rails.rb` settings **must** match your setup:
-```ruby
-  # Define the files we need to check for webpack compilation when running tests.
-  config.webpack_generated_files = %w( manifest.json )
-
-  # OR if you're not hashing the server-bundle.js, then you should include your server-bundle.js in the list.
-  # config.webpack_generated_files = %w( server-bundle.js manifest.json )
-
-  # If you are using the ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config)
-  # with rspec then this controls what yarn command is run
-  # to automatically refresh your webpack assets on every test run.
-  config.build_test_command = "yarn run build:test"
-```
-
-If you want to speed up the re-compiling process so you don't wait to run your tests to build the files, you can run your test compilation with the "watch" flags. For example, `yarn run build:test --watch`
-
-![2016-01-27_02-36-43](https://cloud.githubusercontent.com/assets/1118459/12611951/7c56d070-c4a4-11e5-8a80-9615f99960d9.png)
-
-![2016-01-27_03-18-05](https://cloud.githubusercontent.com/assets/1118459/12611975/a8011654-c4a4-11e5-84f9-1baca4835b4b.png)