PhotoEditor SDK for HTML5 Ruby/Rails Gem Demonstration

Rails Gem for easily integrating PhotoEditor SDK for HTML5 in Ruby on Rails.

Note

The PhotoEditor SDK is a product of 9Elements GmBH. Please order a license. Please see LICENSE.md for licensing details.

PhotoEditor SDK for HTML5.

The PhotoEditor SDK for HTML5 is a fully customizable photo editor which you can integrate into your Rails app within minutes.

Setup the Rails asset pipeline

Reference Gem in your bundlers Gemfile. Open your Gemfile and insert

...
gem 'pesdk-html5-rails', :git => 'https://github.com/imgly/pesdk-ruby-gem-demo.git'
...

Register javascript with the Rails asset pipeline. Open /assets/javascripts/application.js and insert the following lines

...
//= require react
//= require react-dom
//= require PhotoEditorSDK
//= require PhotoEditorSDK.UI.ReactUI
...

Register stylesheets with the Rails asset pipeline. Open /assets/stylesheets/application.css and insert the following lines

...
*= require PhotoEditorSDK.UI.ReactUI
...
*/

Important: Insert the code snipped before the */

Create a custom javascript file or modify your application.js to initialize the PhotoEditor UI on window load as follows

...

window.onload = function () {
  var license = 'license-string' // <- replace this with the content of your license file. The JSON-object needs to be in string format

  var container = document.getElementById('pesdk')  
  var editor = new PhotoEditorSDK.UI.ReactUI({
    container: container,
    license: license,
    assets: {
        baseUrl: '/assets', 
        resolver: function (path) { return path }
    }
  })
}
...

Now, put a <div/> element in the view

...
<div id="pesdk"  style="width: 1024px; height: 768px;">
...

Switch between React- and DesktopUI

In order to use the DesktopUI instead of the ReactUI, you need to make some changes to your setup. Replace in point ...

//= require PhotoEditorSDK.UI.ReactUI with //= require PhotoEditorSDK.UI.DesktopUI
*= require PhotoEditorSDK.UI.ReactUI with *= require PhotoEditorSDK.UI.DesktopUI
var editor = new PhotoEditorSDK.UI.ReactUI with var editor = new PhotoEditorSDK.UI.DesktopUI in home.js

License

Please see LICENSE for licensing details.

Authors and Contributors

Made 2013-2017 by @9elements

Support or Contact

Use our service desk for bug reports or support requests. To request a commercial license, please use the license request form on our website.

Toniha93/pesdk-ruby-gem-demo

PhotoEditor SDK for HTML5 Ruby/Rails Gem Demonstration

Note