summernote-ext-image-attributes-rails 0.8.10.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 5fcc624819c46827d5f2bdea6b143762f11dd37afc739fca248cde4ecb166425
+  data.tar.gz: dce76ae8612365fd654320cbe76bc79edd1e07a5593a2f0edc3dff1a543e06d1
+SHA512:
+  metadata.gz: d8f6c3781905a1cd3f45876c8277441e0df3b613c9446946331e085ae29c2fdecf3e648caadf0f0a9a3266160495cc2f464ce779c7f93c021ba1497fdbe47fa3
+  data.tar.gz: 0fd3ab1fff62a52ff755d34cfa1398d6f7177345376bd825209a4da35c7c2f8198b81d8eb1973a745d0606f1997b8332a939dfb0568341974e6a3602a963fbcc

data/.gitignore

@@ -0,0 +1,44 @@
+*.rbc
+capybara-*.html
+.rspec
+/log
+/tmp
+/db/*.sqlite3
+/db/*.sqlite3-journal
+/public/system
+/coverage/
+/spec/tmp
+*.orig
+rerun.txt
+pickle-email-*.html
+
+# TODO Comment out this rule if you are OK with secrets being uploaded to the repo
+config/initializers/secret_token.rb
+
+# Only include if you have production secrets in this file, which is no longer a Rails default
+# config/secrets.yml
+
+# dotenv
+# TODO Comment out this rule if environment variables can be committed
+.env
+
+## Environment normalization:
+/.bundle
+/vendor/bundle
+
+# these should all be checked in to normalize the environment:
+# Gemfile.lock, .ruby-version, .ruby-gemset
+
+# unless supporting rvm < 1.11.0 or doing something fancy, ignore this:
+.rvmrc
+
+# if using bower-rails ignore default bower_components path bower.json files
+/vendor/assets/bower_components
+*.bowerrc
+bower.json
+
+# Ignore pow environment settings
+.powenv
+
+# Ignore Byebug command history file.
+.byebug_history

data/CHANGELOG.md

@@ -0,0 +1,7 @@
+CHANGELOG
+=========
+
+0.8.10.0 (2018-05-09)
+---------------------
+
+Initial stable release.

data/CODE_OF_CONDUCT.md

@@ -0,0 +1,74 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to making participation in our project and
+our community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, gender identity and expression, level of experience,
+nationality, personal appearance, race, religion, or sexual identity and
+orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+* Using welcoming and inclusive language
+* Being respectful of differing viewpoints and experiences
+* Gracefully accepting constructive criticism
+* Focusing on what is best for the community
+* Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+* The use of sexualized language or imagery and unwelcome sexual attention or
+advances
+* Trolling, insulting/derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community. Examples of
+representing a project or community include using an official project e-mail
+address, posting via an official social media account, or acting as an appointed
+representative at an online or offline event. Representation of a project may be
+further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting the project team at wakematta@gmail.com. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an incident.
+Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
+available at [http://contributor-covenant.org/version/1/4][version]
+
+[homepage]: http://contributor-covenant.org
+[version]: http://contributor-covenant.org/version/1/4/

data/Gemfile

@@ -0,0 +1,4 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in ssummernote-ext-image-attributes-rails.gemspec
+gemspec

data/Gemfile.lock

@@ -0,0 +1,73 @@
+PATH
+  remote: .
+  specs:
+    summernote-ext-image-attributes-rails (0.8.10.0)
+      railties (>= 3.1)
+
+GEM
+  remote: https://rubygems.org/
+  specs:
+    actionpack (5.2.0)
+      actionview (= 5.2.0)
+      activesupport (= 5.2.0)
+      rack (~> 2.0)
+      rack-test (>= 0.6.3)
+      rails-dom-testing (~> 2.0)
+      rails-html-sanitizer (~> 1.0, >= 1.0.2)
+    actionview (5.2.0)
+      activesupport (= 5.2.0)
+      builder (~> 3.1)
+      erubi (~> 1.4)
+      rails-dom-testing (~> 2.0)
+      rails-html-sanitizer (~> 1.0, >= 1.0.3)
+    activesupport (5.2.0)
+      concurrent-ruby (~> 1.0, >= 1.0.2)
+      i18n (>= 0.7, < 2)
+      minitest (~> 5.1)
+      tzinfo (~> 1.1)
+    builder (3.2.3)
+    concurrent-ruby (1.0.5)
+    crass (1.0.4)
+    erubi (1.7.1)
+    gem-release (1.0.0)
+    i18n (1.0.1)
+      concurrent-ruby (~> 1.0)
+    loofah (2.2.2)
+      crass (~> 1.0.2)
+      nokogiri (>= 1.5.9)
+    method_source (0.9.0)
+    mini_portile2 (2.3.0)
+    minitest (5.11.3)
+    nokogiri (1.8.2)
+      mini_portile2 (~> 2.3.0)
+    rack (2.0.5)
+    rack-test (1.0.0)
+      rack (>= 1.0, < 3)
+    rails-dom-testing (2.0.3)
+      activesupport (>= 4.2.0)
+      nokogiri (>= 1.6)
+    rails-html-sanitizer (1.0.4)
+      loofah (~> 2.2, >= 2.2.2)
+    railties (5.2.0)
+      actionpack (= 5.2.0)
+      activesupport (= 5.2.0)
+      method_source
+      rake (>= 0.8.7)
+      thor (>= 0.18.1, < 2.0)
+    rake (12.3.1)
+    thor (0.20.0)
+    thread_safe (0.3.6)
+    tzinfo (1.2.5)
+      thread_safe (~> 0.1)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  bundler (~> 1.3)
+  gem-release
+  rake
+  summernote-ext-image-attributes-rails!
+
+BUNDLED WITH
+   1.16.1

data/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Mohamed Ziata
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

data/MAINTAIN.md

@@ -0,0 +1,30 @@
+## Publish new version
+
+### 1. Update summernote assets
+
+```bash
+bundle exec rake update
+```
+// TODO : automation using rake
+
+### 2. Update gem version number
+
+Edit `lib/summernote-ext-image-attributes-rails/version.rb`
+
+```ruby
+module SummernoteExtImageAttributesRails
+  module Rails
+    VERSION = x.y.z.0
+  end
+end
+```
+
+### 3. Publish
+
+Publish on rubygems
+
+```bash
+gem-release --push
+```
+
+this command git tagging and publish

data/README.md

@@ -0,0 +1,96 @@
+# summernote-ext-image-attributes-rails
+
+The gemification of the summernote extension [summernote-image-attributes][summernote-image-attributes]
+for Rails >= 3.1.
+
+<p align="center">
+  <img src="https://user-images.githubusercontent.com/3450257/39814132-682c4820-5393-11e8-9245-c356d4fa749e.png" />
+</p>
+
+## Demo
+
+Also, we have a [**live demo**][summernote-image-attributes-demo] (press the image inside of the editor).
+
+## Installation
+
+Add the following gems to your application's `Gemfile`:
+
+```ruby
+gem 'bootstrap-sass'   # required
+gem 'summernote-rails' # required
+gem 'summernote-ext-image-attributes-rails', '~> 0.8.10'
+```
+
+And then execute on the terminal:
+
+```bash
+bundle install
+```
+
+## Usage
+
+### JavaScript
+
+In `app/assets/javascripts/application.js`, you should add in this order:
+
+```js
+//= require bootstrap
+//= require summernote
+//= require summernote-ext-image-attributes
+```
+
+### CoffeeScript
+
+In `app/assets/javascripts/application.coffee`, you should add in this order:
+
+```coffeescript
+#= require bootstrap
+#= require summernote
+#= require summernote-ext-image-attributes
+```
+
+## Customization
+
+```js
+$('[data-provider="summernote"]').summernote({
+  popover: {
+    image: [
+      ['custom', ['imageAttributes']],
+      ['imagesize', ['imageSize100', 'imageSize50', 'imageSize25']],
+      ['float', ['floatLeft', 'floatRight', 'floatNone']],
+      ['remove', ['removeMedia']]
+    ],
+  },
+  lang: 'en-US', // Change to your chosen language
+  imageAttributes: {
+    icon: '<i class="note-icon-pencil"/>',
+    removeEmpty: false, // true = remove attributes | false = leave empty if present
+    disableUpload: false // true = don't display Upload Options | Display Upload Options
+	}
+});
+```
+
+More information [**here**][summernote-image-attributes-wiki].
+
+## Versioning
+
+|  Major  |  Minor  |  Patch  |  Current  |
+|:-------:|:-------:|:-------:|:---------:|
+| is the major of [summernote][summernote] | is the minor of [summernote][summernote] | is the patch of [summernote][summernote] | is the vesion of this extension |
+
+*Example:*
+
+The compatible versions of this gem with [summernote][summernote] `v0.8.10` are:
+
+- `summernote-ext-image-attributes-rails v0.8.10.X`
+
+## License
+
+[MIT][license]
+
+
+[summernote]: https://github.com/summernote/summernote
+[summernote-image-attributes]: https://github.com/DiemenDesign/summernote-image-attributes
+[summernote-image-attributes-wiki]: https://github.com/DiemenDesign/summernote-image-attributes
+[summernote-image-attributes-demo]: https://jsfiddle.net/wakematta/w76hmwaj/1/
+[license]: ./LICENSE

data/Rakefile

@@ -0,0 +1,6 @@
+require 'bundler/gem_tasks'
+require 'rspec/core/rake_task'
+
+RSpec::Core::RakeTask.new(:spec)
+
+task :default => :spec

data/bin/console

@@ -0,0 +1,14 @@
+#!/usr/bin/env ruby
+
+require 'bundler/setup'
+require 'summernote-ext-image-attributes-rails'
+
+# You can add fixtures and/or initialization code here to make experimenting
+# with your gem easier. You can also use a different console, if you like.
+
+# (If you use this, don't forget to add pry to your Gemfile!)
+# require "pry"
+# Pry.start
+
+require 'irb'
+IRB.start

data/bin/setup

@@ -0,0 +1,8 @@
+#!/usr/bin/env bash
+set -euo pipefail
+IFS=$'\n\t'
+set -vx
+
+bundle install
+
+# Do any other automated setup that you need to do here

data/lib/summernote-ext-image-attributes-rails.rb

@@ -0,0 +1,14 @@
+require 'rails'
+require 'summernote-ext-image-attributes-rails/version'
+
+module SummernoteExtImageAttributesRails
+  module Rails
+    # Rails >= 3.1
+    if (::Rails::VERSION::MAJOR > 3) ||
+       (::Rails::VERSION::MAJOR == 3 && ::Rails::VERSION::MINOR >= 1)
+       require 'summernote-ext-image-attributes-rails/engine'
+    else
+      require 'summernote-ext-image-attributes-rails/railtie'
+    end
+  end
+end

data/lib/summernote-ext-image-attributes-rails/engine.rb

@@ -0,0 +1,15 @@
+module SummernoteExtImageAttributesRails
+  module Rails
+    class Engine < ::Rails::Engine
+      initializer 'summernote-ext-image-attributess-rails.assets.precompile' do |app|
+        if defined? Sprockets::Rails
+          # sprockets-rails 3 tracks down the calls to `font_path` and `image_path`
+          # and automatically precompiles the referenced assets.
+          unless Sprockets::Rails::VERSION.starts_with?('3')
+            app.config.assets.precompile << /\.(?:eot|woff|ttf)$/
+          end
+        end
+      end
+    end
+  end
+end

data/lib/summernote-ext-image-attributes-rails/railtie.rb

@@ -0,0 +1,5 @@
+module SummernoteExtImageAttributesRails
+  module Rails
+    class Railtie < ::Rails::Railtie; end
+  end
+end

data/lib/summernote-ext-image-attributes-rails/version.rb

@@ -0,0 +1,5 @@
+module SummernoteExtImageAttributesRails
+  module Rails
+    VERSION = '0.8.10.0'
+  end
+end

data/summernote-ext-addclass-rails.gemspec

@@ -0,0 +1,28 @@
+# coding: utf-8
+require File.expand_path('../lib/summernote-ext-image-attributes-rails/version', __FILE__)
+
+Gem::Specification.new do |spec|
+  spec.name          = 'summernote-ext-image-attributes-rails'
+  spec.version       = SummernoteExtImageAttributesRails::Rails::VERSION
+  spec.authors       = ['Dennis Suitters', 'Mohamed Ziata']
+  spec.summary       = %q{
+    Gemify the summernote extension called "summernote-image-attributes" for Rails >= 3.1
+  }
+  spec.description   = %q{
+    This gem packages the extencion summernote-ext-image-attributes of Summernote editor
+    for Rails' assets pipeline
+  }
+  spec.homepage      = 'https://github.com/WaKeMaTTa/summernote-ext-image-attributes-rails'
+  spec.license       = 'MIT'
+
+  spec.files         = `git ls-files -z`.split("\x0").reject do |f|
+    f.match(%r{^(test|spec|features)/})
+  end
+  spec.require_paths = ['lib']
+
+  spec.add_dependency 'railties', '>= 3.1'
+
+  spec.add_development_dependency 'bundler', '~> 1.3'
+  spec.add_development_dependency 'rake'
+  spec.add_development_dependency 'gem-release'
+end

data/vendor/assets/javascripts/summernote-ext-image-attributes/index.js

@@ -0,0 +1 @@
+//= require ./summernote-ext-image-attributes

data/vendor/assets/javascripts/summernote-ext-image-attributes/summernote-ext-image-attributes.js

@@ -0,0 +1,367 @@
+/* https://github.com/DiemenDesign/summernote-image-attributes */
+(function (factory) {
+  if (typeof define === 'function' && define.amd) {
+    define(['jquery'], factory);
+  } else if (typeof module === 'object' && module.exports) {
+    module.exports = factory(require('jquery'));
+  } else {
+    factory(window.jQuery);
+  }
+}(function ($) {
+  var readFileAsDataURL = function (file) {
+    return $.Deferred( function (deferred) {
+      $.extend(new FileReader(),{
+        onload: function (e) {
+          var sDataURL = e.target.result;
+          deferred.resolve(sDataURL);
+        },
+        onerror: function () {
+          deferred.reject(this);
+        }
+      }).readAsDataURL(file);
+    }).promise();
+  };
+  $.extend(true,$.summernote.lang, {
+    'en-US': { /* US English(Default Language) */
+      imageAttributes: {
+        dialogTitle: 'Image Attributes',
+        tooltip: 'Image Attributes',
+        tabImage: 'Image',
+          src: 'Source',
+          browse: 'Browse',
+          title: 'Title',
+          alt: 'Alt Text',
+          dimensions: 'Dimensions',
+        tabAttributes: 'Attributes',
+          class: 'Class',
+          style: 'Style',
+          role: 'Role',
+        tabLink: 'Link',
+          linkHref: 'URL',
+          linkTarget: 'Target',
+          linkTargetInfo: 'Options: _self, _blank, _top, _parent',
+          linkClass: 'Class',
+          linkStyle: 'Style',
+          linkRel: 'Rel',
+          linkRelInfo: 'Options: alternate, author, bookmark, help, license, next, nofollow, noreferrer, prefetch, prev, search, tag',
+          linkRole: 'Role',
+        tabUpload: 'Upload',
+          upload: 'Upload',
+        tabBrowse: 'Browse',
+        editBtn: 'OK'
+      }
+    }
+  });
+  $.extend($.summernote.options, {
+    imageAttributes: {
+      icon: '<i class="note-icon-pencil"/>',
+      removeEmpty: true,
+      disableUpload: false,
+      imageFolder: ''
+    }
+  });
+  $.extend($.summernote.plugins, {
+    'imageAttributes': function (context) {
+      var self      = this,
+          ui        = $.summernote.ui,
+          $note     = context.layoutInfo.note,
+          $editor   = context.layoutInfo.editor,
+          $editable = context.layoutInfo.editable,
+          options   = context.options,
+          lang      = options.langInfo,
+          imageAttributesLimitation = '';
+      if (options.maximumImageFileSize) {
+        var unit = Math.floor(Math.log(options.maximumImageFileSize) / Math.log(1024));
+        var readableSize = (options.maximumImageFileSize/Math.pow(1024,unit)).toFixed(2) * 1 + ' ' + ' KMGTP'[unit] + 'B';
+        imageAttributesLimitation = '<small class="help-block note-help-block">' + lang.image.maximumFileSize + ' : ' + readableSize+'</small>';
+      }
+      context.memo('button.imageAttributes', function() {
+        var button = ui.button({
+          contents: options.imageAttributes.icon,
+          tooltip:  lang.imageAttributes.tooltip,
+          click: function () {
+            context.invoke('imageAttributes.show');
+          }
+        });
+        return button.render();
+      });
+      this.initialize = function () {
+        var $container = options.dialogsInBody ? $(document.body) : $editor;
+        var timestamp = Date.now();
+        var body = '<ul class="nav note-nav nav-tabs note-nav-tabs">' +
+                   '  <li class="active"><a href="#note-imageAttributes' + timestamp + '" data-toggle="tab">' + lang.imageAttributes.tabImage + '</a></li>' +
+                   '  <li><a href="#note-imageAttributes-attributes' + timestamp + '" data-toggle="tab">' + lang.imageAttributes.tabAttributes + '</a></li>' +
+                   '  <li><a href="#note-imageAttributes-link' + timestamp + '" data-toggle="tab">' + lang.imageAttributes.tabLink + '</a></li>';
+        if (options.imageAttributes.disableUpload == false) {
+           body += '  <li><a href="#note-imageAttributes-upload' + timestamp + '" data-toggle="tab">' + lang.imageAttributes.tabUpload + '</a></li>';
+        }
+        body +=    '</ul>' +
+                   '<div class="tab-content note-tab-content">' +
+                   // Tab 2
+                   '  <div class="tab-pane note-tab-pane" id="note-imageAttributes-attributes' + timestamp + '">' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-class">' +
+                   '      <label class="control-label note-form-label col-sm-3">' + lang.imageAttributes.class + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-class form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-style">' +
+                   '      <label class="control-label note-form-label col-sm-3">' + lang.imageAttributes.style + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-style form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-role">' +
+                   '      <label class="control-label note-form-label col-sm-3">' + lang.imageAttributes.role + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-role form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '    </div>' +
+                   '  </div>' +
+                   // Tab 3
+                   '  <div class="tab-pane note-tab-pane" id="note-imageAttributes-link' + timestamp + '">' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-link-href">' +
+                   '      <label class="control-label note-form-label col-xs-3">' + lang.imageAttributes.linkHref + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-link-href form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-link-target">' +
+                   '      <label class="control-label note-form-label col-xs-3">' + lang.imageAttributes.linkTarget + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-link-target form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '      <small class="help-block note-help-block text-right">' + lang.imageAttributes.linkTargetInfo + '</small>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-link-class">' +
+                   '      <label class="control-label note-form-label col-xs-3">' + lang.imageAttributes.linkClass + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-link-class form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-link-style">' +
+                   '      <label class="control-label note-form-label col-xs-3">' + lang.imageAttributes.linkStyle + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-link-style form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-link-rel">' +
+                   '      <label class="control-label note-form-label col-xs-3">' + lang.imageAttributes.linkRel + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-link-rel form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '      <small class="help-block note-help-block text-right">' + lang.imageAttributes.linkRelInfo + '</small>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-link-role">' +
+                   '      <label class="control-label note-form-label col-xs-3">' + lang.imageAttributes.linkRole + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-link-role form-control note-form-control note-input" type="text">' +
+                   '      </div>' +
+                   '    </div>' +
+                   '  </div>';
+      if (options.imageAttributes.disableUpload == false) {
+                   // Tab 4
+        body +=    '  <div class="tab-pane note-tab-pane" id="note-imageAttributes-upload' + timestamp + '">' +
+                   '   <label class="control-label note-form-label col-xs-3">' + lang.imageAttributes.upload + '</label>' +
+                   '   <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '     <input class="note-imageAttributes-input form-control note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple" />' +
+                         imageAttributesLimitation +
+                   '    </div>' +
+                   '  </div>';
+        }
+        // Tab 1
+        body +=    '  <div class="tab-pane note-tab-pane fade in active" id="note-imageAttributes' + timestamp + '">' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-url">' +
+                   '      <label class="control-label note-form-label col-sm-3">' + lang.imageAttributes.src + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-src form-control note-form-control note-input" type="text" />' +
+//                   '        <span class="input-group-btn">' +
+//                   '          <button class="btn btn-default class="note-imageAttributes-browse">' + lang.imageAttributes.browse + '</button>' +
+//                   '        </span>' +
+                   '      </div>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-title">' +
+                   '      <label class="control-label note-form-label col-sm-3">' + lang.imageAttributes.title + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-title form-control note-form-control note-input" type="text" />' +
+                   '      </div>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-alt">' +
+                   '      <label class="control-label note-form-label col-sm-3">' + lang.imageAttributes.alt + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-alt form-control note-form-control note-input" type="text" />' +
+                   '      </div>' +
+                   '    </div>' +
+                   '    <div class="note-form-group form-group note-group-imageAttributes-dimensions">' +
+                   '      <label class="control-label note-form-label col-sm-3">' + lang.imageAttributes.dimensions + '</label>' +
+                   '      <div class="input-group note-input-group col-xs-12 col-sm-9">' +
+                   '        <input class="note-imageAttributes-width form-control note-form-control note-input" type="text" />' +
+                   '        <span class="input-group-addon note-input-group-addon">x</span>' +
+                   '        <input class="note-imageAttributes-height form-control note-form-control note-input" type="text" />' +
+                   '      </div>' +
+                   '    </div>' +
+                   '  </div>' +
+                   '</div>';
+        this.$dialog=ui.dialog({
+          title:  lang.imageAttributes.dialogTitle,
+          body:   body,
+          footer: '<button href="#" class="btn btn-primary note-btn note-btn-primary note-imageAttributes-btn">' + lang.imageAttributes.editBtn + '</button>'
+        }).render().appendTo($container);
+      };
+      this.destroy = function () {
+        ui.hideDialog(this.$dialog);
+        this.$dialog.remove();
+      };
+      this.bindEnterKey = function ($input,$btn) {
+        $input.on('keypress', function (e) {
+          if (e.keyCode === 13) $btn.trigger('click');
+        });
+      };
+      this.bindLabels = function () {
+        self.$dialog.find('.form-control:first').focus().select();
+        self.$dialog.find('label').on('click', function () {
+          $(this).parent().find('.form-control:first').focus();
+        });
+      };
+      this.show = function () {
+        var $img    = $($editable.data('target'));
+        var imgInfo = {
+          imgDom:  $img,
+          title:   $img.attr('title'),
+          src:     $img.attr('src'),
+          alt:     $img.attr('alt'),
+          width:   $img.attr('width'),
+          height:  $img.attr('height'),
+          role:    $img.attr('role'),
+          class:   $img.attr('class'),
+          style:   $img.attr('style'),
+          imgLink: $($img).parent().is("a") ? $($img).parent() : null
+        };
+        this.showImageAttributesDialog(imgInfo).then( function (imgInfo) {
+          ui.hideDialog(self.$dialog);
+          var $img = imgInfo.imgDom;
+          if (options.imageAttributes.removeEmpty) {
+            if (imgInfo.alt)    $img.attr('alt',   imgInfo.alt);    else $img.removeAttr('alt');
+            if (imgInfo.width)  $img.attr('width', imgInfo.width);  else $img.removeAttr('width');
+            if (imgInfo.height) $img.attr('height',imgInfo.height); else $img.removeAttr('height');
+            if (imgInfo.title)  $img.attr('title', imgInfo.title);  else $img.removeAttr('title');
+            if (imgInfo.src)    $img.attr('src',   imgInfo.src);    else $img.attr('src', '#');
+            if (imgInfo.class)  $img.attr('class', imgInfo.class);  else $img.removeAttr('class');
+            if (imgInfo.style)  $img.attr('style', imgInfo.style);  else $img.removeAttr('style');
+            if (imgInfo.role)   $img.attr('role',  imgInfo.role);   else $img.removeAttr('role');
+          } else {
+            if (imgInfo.src)    $img.attr('src',   imgInfo.src);    else $img.attr('src', '#');
+            $img.attr('alt',    imgInfo.alt);
+            $img.attr('width',  imgInfo.width);
+            $img.attr('height', imgInfo.height);
+            $img.attr('title',  imgInfo.title);
+            $img.attr('class',  imgInfo.class);
+            $img.attr('style',  imgInfo.style);
+            $img.attr('role',   imgInfo.role);
+          }
+          if($img.parent().is("a")) $img.unwrap();
+          if (imgInfo.linkHref) {
+            var linkBody = '<a';
+            if (imgInfo.linkClass) linkBody += ' class="' + imgInfo.linkClass + '"';
+            if (imgInfo.linkStyle) linkBody += ' style="' + imgInfo.linkStyle + '"';
+            linkBody += ' href="' + imgInfo.linkHref + '" target="' + imgInfo.linkTarget + '"';
+            if (imgInfo.linkRel) linkBody += ' rel="' + imgInfo.linkRel + '"';
+            if (imgInfo.linkRole) linkBody += ' role="' + imgInfo.linkRole + '"';
+            linkBody += '></a>';
+            $img.wrap(linkBody);
+          }
+          $note.val(context.invoke('code'));
+          $note.change();
+        });
+      };
+      this.showImageAttributesDialog = function (imgInfo) {
+        return $.Deferred( function (deferred) {
+          var $imageTitle  = self.$dialog.find('.note-imageAttributes-title'),
+              $imageInput  = self.$dialog.find('.note-imageAttributes-input'),
+              $imageSrc    = self.$dialog.find('.note-imageAttributes-src'),
+              $imageAlt    = self.$dialog.find('.note-imageAttributes-alt'),
+              $imageWidth  = self.$dialog.find('.note-imageAttributes-width'),
+              $imageHeight = self.$dialog.find('.note-imageAttributes-height'),
+              $imageClass  = self.$dialog.find('.note-imageAttributes-class'),
+              $imageStyle  = self.$dialog.find('.note-imageAttributes-style'),
+              $imageRole   = self.$dialog.find('.note-imageAttributes-role'),
+              $linkHref    = self.$dialog.find('.note-imageAttributes-link-href'),
+              $linkTarget  = self.$dialog.find('.note-imageAttributes-link-target'),
+              $linkClass   = self.$dialog.find('.note-imageAttributes-link-class'),
+              $linkStyle   = self.$dialog.find('.note-imageAttributes-link-style'),
+              $linkRel     = self.$dialog.find('.note-imageAttributes-link-rel'),
+              $linkRole    = self.$dialog.find('.note-imageAttributes-link-role'),
+              $editBtn     = self.$dialog.find('.note-imageAttributes-btn');
+          $linkHref.val();
+          $linkClass.val();
+          $linkStyle.val();
+          $linkRole.val();
+          $linkTarget.val();
+          $linkRel.val();
+          if (imgInfo.imgLink) {
+            $linkHref.val(imgInfo.imgLink.attr('href'));
+            $linkClass.val(imgInfo.imgLink.attr('class'));
+            $linkStyle.val(imgInfo.imgLink.attr('style'));
+            $linkRole.val(imgInfo.imgLink.attr('role'));
+            $linkTarget.val(imgInfo.imgLink.attr('target'));
+            $linkRel.val(imgInfo.imgLink.attr('rel'));
+          }
+          ui.onDialogShown(self.$dialog, function () {
+            context.triggerEvent('dialog.shown');
+            $imageInput.replaceWith(
+              $imageInput.clone().on('change', function () {
+                var callbacks = options.callbacks;
+                if (callbacks.onImageUpload) {
+                  context.triggerEvent('image.upload',this.files[0]);
+                } else {
+                  readFileAsDataURL(this.files[0]).then( function (dataURL) {
+                    $imageSrc.val(dataURL);
+                  }).fail( function () {
+                    context.triggerEvent('image.upload.error');
+                  });
+                }
+              }).val('')
+            );
+            $editBtn.click( function (e) {
+              e.preventDefault();
+              deferred.resolve({
+                imgDom:     imgInfo.imgDom,
+                title:      $imageTitle.val(),
+                src:        $imageSrc.val(),
+                alt:        $imageAlt.val(),
+                width:      $imageWidth.val(),
+                height:     $imageHeight.val(),
+                class:      $imageClass.val(),
+                style:      $imageStyle.val(),
+                role:       $imageRole.val(),
+                linkHref:   $linkHref.val(),
+                linkTarget: $linkTarget.val(),
+                linkClass:  $linkClass.val(),
+                linkStyle:  $linkStyle.val(),
+                linkRel:    $linkRel.val(),
+                linkRole:   $linkRole.val()
+              }).then(function (img) {
+                context.triggerEvent('change', $editable.html());
+              });
+            });
+            $imageTitle.val(imgInfo.title);
+            $imageSrc.val(imgInfo.src);
+            $imageAlt.val(imgInfo.alt);
+            $imageWidth.val(imgInfo.width);
+            $imageHeight.val(imgInfo.height);
+            $imageClass.val(imgInfo.class);
+            $imageStyle.val(imgInfo.style);
+            $imageRole.val(imgInfo.role);
+            self.bindEnterKey($editBtn);
+            self.bindLabels();
+          });
+          ui.onDialogHidden(self.$dialog, function () {
+            $editBtn.off('click');
+            if (deferred.state() === 'pending') deferred.reject();
+          });
+          ui.showDialog(self.$dialog);
+        });
+      };
+    }
+  });
+}));

metadata

@@ -0,0 +1,120 @@
+--- !ruby/object:Gem::Specification
+name: summernote-ext-image-attributes-rails
+version: !ruby/object:Gem::Version
+  version: 0.8.10.0
+platform: ruby
+authors:
+- Dennis Suitters
+- Mohamed Ziata
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2018-05-09 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: railties
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '3.1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '3.1'
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.3'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.3'
+- !ruby/object:Gem::Dependency
+  name: rake
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: gem-release
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+description: "\n    This gem packages the extencion summernote-ext-image-attributes
+  of Summernote editor\n    for Rails' assets pipeline\n  "
+email: 
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".gitignore"
+- CHANGELOG.md
+- CODE_OF_CONDUCT.md
+- Gemfile
+- Gemfile.lock
+- LICENSE
+- MAINTAIN.md
+- README.md
+- Rakefile
+- bin/console
+- bin/setup
+- lib/summernote-ext-image-attributes-rails.rb
+- lib/summernote-ext-image-attributes-rails/engine.rb
+- lib/summernote-ext-image-attributes-rails/railtie.rb
+- lib/summernote-ext-image-attributes-rails/version.rb
+- summernote-ext-addclass-rails.gemspec
+- vendor/assets/javascripts/summernote-ext-image-attributes/index.js
+- vendor/assets/javascripts/summernote-ext-image-attributes/summernote-ext-image-attributes.js
+homepage: https://github.com/WaKeMaTTa/summernote-ext-image-attributes-rails
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.7.6
+signing_key: 
+specification_version: 4
+summary: Gemify the summernote extension called "summernote-image-attributes" for
+  Rails >= 3.1
+test_files: []