Giter VIP home page Giter VIP logo

summernote-rails's Introduction

Summernote

Super simple WYSIWYG Editor.

Build Status npm version Coverage Status

Summernote

Summernote is a JavaScript library that helps you create WYSIWYG editors online.

Home page: https://summernote.org

Why Summernote?

Summernote has a few special features:

  • Paste images from clipboard
  • Saves images directly in the content of the field using base64 encoding, so you don't need to implement image handling at all
  • Simple UI
  • Interactive WYSIWYG editing
  • Handy integration with server
  • Supports Bootstrap 3, 4 and 5 integrations
  • Lots of plugins and connectors provided together

Installation and dependencies

Summernote is built on jQuery.

1. Include JS/CSS

Include the following code in the <head> tag of your HTML:

<!-- include libraries(jQuery, bootstrap) -->
<script type="text/javascript" src="//code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" />
<script type="text/javascript" src="cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>

<!-- include summernote css/js-->
<link href="summernote-bs5.css" rel="stylesheet">
<script src="summernote-bs5.js"></script>

2. Target a element

Then place a div tag somewhere in the body tag. This element will be replaced with the summernote editor.

<div id="summernote">Hello Summernote</div>

3. Summernote it!

Finally, run this script after the DOM is ready:

$(document).ready(function() {
  $('#summernote').summernote();
});

For more examples, please visit to homepage.

API

code - get the HTML source code underlying the text in the editor:

var html = $('#summernote').summernote('code');

For more detail about API, please refer to document.

Warning - code injection

The code view allows the user to enter script contents. Make sure to filter/sanitize the HTML on the server. Otherwise, an attacker can inject arbitrary JavaScript code into clients.

For contributing

https://github.com/summernote/summernote/blob/develop/.github/CONTRIBUTING.md

Contacts

Testing powered by


BrowserStack Open-Source Program

License

Summernote may be freely distributed under the MIT license.

summernote-rails's People

Contributors

addagger avatar cheeseweasel avatar felixtriller avatar hackerwins avatar luciuschoi avatar nerian avatar piton4eg avatar pofmagicfingers avatar riseshia avatar rorlab avatar rsamoilov avatar samrayner avatar samuraraujo avatar seapy avatar sebouchu avatar vansickle avatar wakematta avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

summernote-rails's Issues

How can i get a watermark text

watermar-sumernote

I need a watermark (transparent) text along with the content pasted into the editor. How can i achieve this? Is this provided with deep drive of summer note? or can do use customize code ?
attached the example snippet ?

content of the summernote is not posted to the controller

Did you test if the controller can get the user input of the summernote?

On my end, my application controller cannot get the value of the summernote.

Here is my view.html.erb

                <%= simple_form_for :question, url: { action: 'submit' } do |f| %>
                    <%= f.hidden_field :course_id, value: @current_course %>
                    <div class="form-group">
                      <%= f.label :question_title, "Question Title" %>
                      <%= f.text_field :question_title, autofocus: true, class: "form-control placeholder-no-fix", placeholder: "What's you questions? Be specific" %>
                    </div>
                    <div class="form-group">
                      <label for="description">Description</label>
                      <%= f.input :question_content, input_html: { class: 'summernote' } %>
                    </div>
                    <div class="text-right">
                      <%= f.submit "Save", class: "btn btn-primary" %>
                    </div>
                <% end %>

but the value of :question_content is not be post back.

ActionController::Parameters (3 elements)
'course_id' = "12"
'question_title' = "sdfsdfs"

'question_content' = ""

The version of summernote i am using is v0.6.10.0.

Using summernote within a modal is broken

If you're using summernote within a modal and you press a button on the toolbar that opens a modal (add link, add image, etc), summernote adds the modal within the current modal, and closing the second modal also closes the first.

"summernote is not a function" TypeError

Hello,

I'm trying to use this gem, and I believe I followed the instructions correctly, but it seems like the summernote.js file is not being loaded? I keep getting the "summernote is not a function" TypeError.

I downloaded the files and put them in my app/assets/javascripts folder.

My application.js file looks like this:
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap
//= require summernote
//= require_tree .

And I copied and pasted the script into my view:

Hello Summernote
<script type="text/javascript">
  $(document).ready(function() {
    $('#summernote').summernote();
  });
</script>

But I keep getting an error. Can you help me?

screen shot 2015-05-28 at 3 02 46 pm

TypeError: t is null in Firefox

Hello ๐Ÿ‘‹, I've the problem with summernote gem: TypeError: t is null This issue appears only in Firefox 49.0(and other versions apparently) after assets compilation but in development environment all works fine.
In project I use Rails 4.2.7., coffee and sass. Some files below:

Gemfile

gem 'summernote-rails'
gem 'bootstrap-sass'

application.coffee

#= require summernote
#= require summernote/locales/ru-RU

admin.sass

@import "bootstrap-sprockets"
@import "bootstrap"
@import "summernote"

The place of error in firefox.

r="function"==typeof define&&define.amd,o=function(e)
{var n="Comic Sans MS"===e?"Courier New":"Comic Sans MS",i=t("<div>").css({position:"absolute",left:"-9999px",top:"-9999px",fontSize:"200px"})
.text("mmmmmmmmmwwwwwww").appendTo

์˜ˆ์ œ coffee script์—.. ๋งˆ์ง€๋ง‰ ์ค„ [0] ์ œ๊ฑฐ

ํ•œ๋ฒˆ ๊น”์•„๋ณด๋ ค๊ณ  ํ…Œ์ŠคํŠธ๋Š”ํ•˜๋Š”๋ฐ, ์•ˆ๋˜์„œ ์›์ธ์„ ๋ชฐ๋ผ ์—ฌ๊ธฐ ์ €๊ธฐ ๋ง‰ ๋’ค์กŒ๋Š”๋ฐ..
์„ค๋ช…์˜ coffee script์˜ ๋งˆ์ง€๋ง‰ ๋ถ€๋ถ„์—
[0]์„ ๋นผ์ค˜์•ผ ๋˜๋„ค์š”...;;

summer_note.closest('form').submit ->
# alert $('#post_content').code()[0]
summer_note.val summer_note.code()[0]
true

==>

summer_note.closest('form').submit ->
# alert $('#post_content').code()[0]
summer_note.val summer_note.code()
true

html_safe and escaping javascript

Obviously using .html_safe or raw() on the content is not a good idea if the saved data is not escaped from javascript. Inserting <script>alert('hacked');</script> when in html-mode will pop open an alert box when the user views the post.

Any ideas on how to properly escape javascript from the content that is being saved?
Using this gem is probably an option: https://github.com/rgrove/sanitize
But I wanted to make sure that I am not doing this the wrong way - adding an additional gem just to sanitize malicious input.

Without Bootstrap?

I'm not using bootstrap and I don't use it on a lot of projects. Does the editor break without it? Because I wouldn't want to load an entire framework I don't need just for a component

Upgrade to v0.8.0

@seapy Any plan to release a new version with summernote v0.8.0? This new version contains some bug fixes that I need.

I'm happy to submit PR but need some guides on how to add fonts properly into the gem, as v0.8.0 has replaced font-awesome with own font.

unable to load summernote editor

Hellow.,

I am unable to load summernote editor...please correct and please guide me where am doing wrong., please see the details below

My environment details:-
1) OS : Ubuntu 14.04
2) Ruby 1.9.3
3) Rails 3.2.21
4) Browser : firefox 37

In my Gemfile:

gem 'summernote-rails', '~> 0.6.5.0'
gem 'font-awesome', '~> 4.2.0.0'
gem 'bootstrap-sass', '3.1.1.1' 

In my application.js file

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require summernote
//= require_tree .

In my application.css.scss

*= require_self
*= require_bootstrap
*= require font-awesome
*= require summernote
*= require_tree .

In my simple_form_for form

<%= f.input :error_detail, label: " Please explain with full details", class: :summernote %>

after all doing this, it displays plain text box am attaching screen shot for verification please find the attachment
summernote

In my firefox browser getting error like

<textarea class="text required form-control" cols="40" id="event_error_detail" multipart="true" name="event[error_detail]" rows="20"></textarea>

Please let me know if any information needed from me.. Thanks.

Empty toolbar buttons

I'm using rails 4.2.9 and I've upgraded summernote-rails to 0.8.2.0 but now the toolbar buttons are empty. I'm requiring summernote in application.js and importing it in the application.scss file. What am I missing?

empty toolbar buttons

Content of summernote not sent to controller

The content of summer note is not sent to the controller. As you can see in the log below, content => "" is empty. I have set my strong parameters:

params.require(:info_page).permit(:organizer_id, :name, :content)

Using:

  • Rails 4.2.7.1
  • Ruby 2.2.5
  • Summernote 0.8.2

Code:

<%= bootstrap_form_for @info_page, layout: :horizontal, label_col: 'col-sm-2', control_col: 'col-sm-4' do |f| %>

    <%= f.alert_message "Please fix the errors below." %>

    <%= f.text_field :name, autofocus: true %>

    <%= f.text_field_without_bootstrap :content, :label => 'Page', 'data-provider' => 'summernote' %>

    <%= f.form_group do %>
        <% if controller.action_name == 'new' %>
            <%= f.submit 'Save',  data: { disable_with: 'Please wait...' } %>
        <% else %>
            <%= f.submit 'Update',  data: { disable_with: 'Please wait...' } %>
        <% end %>
    <% end %>

<% end %>

Resulting HTML Source:

<form role="form" class="form-horizontal" id="new_info_page" action="/info_pages" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="rNe6182rbHF/4O8lyOwSEd7xnJ0oP6yD2Vj/cWsCHkyQjb/wvSTAC2vvxnu0q1AGH0264vNTOWNuIthoEpNYow==" />

<div class="form-group">
<label class="control-label col-sm-2 required" for="info_page_name">Name</label>
<div class="col-sm-4">
<input autofocus="autofocus" class="form-control" type="text" name="info_page[name]" id="info_page_name" />
</div>
</div>

<input label="Page" data-provider="summernote" type="text" name="info_page[content]" id="info_page_content" />

<div class="form-group">
<div class="col-sm-4 col-sm-offset-2">
<input type="submit" name="commit" value="Save" data-disable-with="Please wait..." class="btn btn-default" />
</div>
</div>

</form>

Resulting markup:

summernote

Log:

Started POST "/info_pages" for 127.0.0.1 at 2017-01-03 17:57:00 -0500
Processing by InfoPagesController#create as HTML
Parameters: {"utf8"=>"โœ“", "authenticity_token"=>"rNe6182rbHF/4O8lyOwSEd7xnJ0oP6yD2Vj/cWsCHkyQjb/wvSTAC2vvxnu0q1AGH0264vNTOWNuIthoEpNYow==", "info_page"=>{"name"=>"Test", "content"=>""}, "files"=>"", "commit"=>"Save"}
User Load (0.3ms) SELECT "users".* FROM "users" WHERE "users"."id" = $1 ORDER BY "users"."id" ASC LIMIT 1 [["id", 105]]
Organizer Load (0.2ms) SELECT "organizers".* FROM "organizers" WHERE "organizers"."user_id" = $1 LIMIT 1 [["user_id", 105]]
(0.1ms) BEGIN
SQL (0.2ms) INSERT INTO "info_pages" ("name", "content", "organizer_id", "created_at", "updated_at") VALUES ($1, $2, $3, $4, $5) RETURNING "id" [["name", "Test"], ["content", ""], ["organizer_id", 3], ["created_at", "2017-01-03 22:57:00.958472"], ["updated_at", "2017-01-03 22:57:00.958472"]]
(0.2ms) COMMIT
(0.1ms) BEGIN
(0.1ms) COMMIT
Redirected to http://0.0.0.0:5000/info_pages/2
Completed 302 Found in 10ms (ActiveRecord: 1.3ms)

Image size restriction

Hi,

Is there any way to restrict the size of the image, so the people can't allow themselves to upload the image more than 1 mb in size, something like this.. AND

Is there any way to upload the images in to Amazon S3..??? please help me...

Thanking you,
SBR

insert video get error

I am trying to use summernote in my project, but I got a strange error.
this error happened both with and without using summernote-rails gem in rails 4. And only with chrome and safari (webkit?). Everything under IE and firefox is ok!

I also tried the summernote-test
All situation are the same.

When I create or update a post with video, they come successfully except the wrong redirect_to.

the url become data:, , the page become blank. the log did not display any bug code.
this made me so feel strange.

So , did u try to insert video, and is everything is ok?
image

Precompilation error

I have a LESS-based rails application.
Trying to add summernote I added these lines:

Gemfile:

gem 'font-awesome-rails'
gem 'summernote-rails'
gem 'bootstrap-sass'

application.css:

*= require font-awesome
*= require summernote

In local everything works fine.
When I commit the application to heroku I get the following error:

Sass::SyntaxError: Undefined variable: "$alert-padding".
   (in /tmp/build_xxx/vendor/bundle/ruby/2.1.0/gems/bootstrap-sass-3.3.1.0/assets/stylesheets/bootstrap/_alerts.scss:10)

I guess I miss the SASS variables, but have no idea how to add them without create any conflict with the LESS code.

Summernote-rails not working

Hi, am new to rails, am using summernote for my app, I have followed the whole document and did as per the documentation. but, the editor is not dispalying in my text_area. means it just shows a blank text area box with out any buttons, the details are below.

In my gem file:

  gem 'simple_form', '2.1.1'
  gem 'summernote-rails', '0.4.0'
  gem 'bootstrap-sass', '3.1.1.1'
  gem 'bootstrap-will_paginate', '0.0.10'
  gem 'font-awesome-sass-rails', '3.0.2.2'

In app/assets/javascripts/application.js

  //= require jquery
  //= require jquery_ujs
  //= require bootstrap
  //= require summernote.min
  //= require_tree .

in app/assets/stylesheets/application.css,
*= require_self
*= require_bootstrap
*= require_font-awesome
*= require_summernote
*= require_tree .
In my events/_form.html.erb
<%= f.input :error_detail, label:'Summary', class:'summernote', input_html:{class:'form-control'} %>
in my app/assets/javascripts/events.js.coffee
$ ->

  # to set summernote object
  # You should change '#event_error_detail' to your textarea input id
  summer_note = $('#event_error_detail')
  # to call summernote editor
  summer_note.summernote
  # to set options
  height:300
  lang: 'en'
  # toolbar: [
            # ['insert', ['picture', 'link']], // no insert buttons
            # ["table", ["table"]],
            # ["style", ["style"]],
            # ["fontsize", ["fontsize"]],
            # ["color", ["color"]],
            # ["style", ["bold", "italic", "underline", "clear"]],
            # ["para", ["ul", "ol", "paragraph"]],
            # ["height", ["height"]],
            # ["help", ["help"]]
         #]
  # to set code for summernote
  summer_note.code summer_note.val()
  # to get code for summernote
  summer_note.closest('form').submit ->
  # alert $('#event_error_detail').code()
  summer_note.val summer_note.code()
  true

The error am getting in my firefox browser's error console:

  TypeError: summer_note.summernote is not a function

MY ENVIRONMENT DETAILS: Ruby 1.9.3 and Rails 3.2.8 Ubuntu 12.4

Please help me where am i doing wrong.., Please I need help.

Adding html tag <br> more than once

Hi,
While copy paste the text continually 10 times, the html tag <br> adding to itself 10 times at the end of the paragraph, I have also tested with your sample app "example", here is the sample what I got in my app,

<p>testing comment text editing tool box testing comment text editing tool box testing comment text editing tool box testing comment text editing tool box testing comment text editing tool box testing comment text editing tool box testing comment text editing tool box testing comment text editing tool box testing comment text editing tool box testing comment text editing tool box <br><br><br><br><br><br><br><br><br><br><br></p>

After save wysiwyg showing html markup

Hi!
This is bothering me for a few hours now... Every thing worked fine before, and I haven't worked on anything that is related to summernote. But when i tried editing the content today, I got this problem.

When I am creating new content, summer note works as expected, but when I try to edit the saved content i get HTML markup in WYSIWYG mode in summer note.

Any one has any idea? Thanks for help.

Similar problem is described here: https://stackoverflow.com/questions/34486460/summernote-showing-html-markup

Add imageSize75

Is it possible to add option imageSize75?

I try to use this summernote-image-attributes.js but it does not work

RORLAB DID AWESOME JOB

Congratulations... RORLAB and to me (for using auspicious, amazing, awesome gem), I really so so happy to use this gem, finally you came with BOMBASTIC version, actually i was trying to get some image upload gem from past 4 months, i tried each and every gem which is available in rubygems.org but none satisfied me except this beautiful gem(0.5.10.2) did to me, each and everything working FANTASTIC, I really greatfully Thankfull to you for making this gem available for everybody and to make it free, HATSOFF.. :) ๐Ÿ‘

Documentation or options list?

Hello!

Nice plugin!

Just wondering if there is any options docs or just a list of options we can skim to customize which buttons are used and which aren't?

Would be nice to not to have to read through the source to find the specific options I need.

Summernote duplicating fields on edit form

Hello,

The summernote fields on my edit form aren't loading right. When I load the edit form (editing an existing object in the database), it populates all of the fields on the page with the actual database value from the first field. In my app, I have various fields...the first one is called description. The summernote fields are all populated with the value of the description field.

I verified that the database still holds the correct values of the fields. In fact, when I view the page source of the loaded edit form, the html shows that the values are all being properly loaded. The javascript seems to be overwriting them. It must be an issue with my meds.coffee script. Can you please help me fix this issue? How do I properly load multiple fields in the coffee script file?

My repo is here:
https://github.com/jtansley/explainmymedicine/

Thanks!

EDIT:

To clarify, I'm experiencing the issue on this edit form:
https://github.com/jtansley/explainmymedicine/blob/master/app/views/meds/edit.html.erb/

Any ideas to enable locale?

Summernote-rails just loads all of the locale js files yet locale still doesn't work.
Did I miss something?

<script src="/assets/summernote/summernote-7f29c6b5faeaff0ff786857dc8684fa7.js?body=1"></script>
<script src="/assets/summernote/locales/ar-AR-b0921e556445be4b97e73629947b27d6.js?body=1"></script>
<script src="/assets/summernote/locales/ca-ES-8de85423d79cca5e7c1fd50f95fb4c81.js?body=1"></script>
<script src="/assets/summernote/locales/cs-CZ-4ce22fccffd75d1ad78963e4b3490cf5.js?body=1"></script>
<script src="/assets/summernote/locales/da-DK-c200c6fc2f563188606026710830ac4b.js?body=1"></script>
<script src="/assets/summernote/locales/de-DE-db19fb8327765983b91d96989be358d5.js?body=1"></script>
<script src="/assets/summernote/locales/es-ES-4cf00577e0dc288b96ee6f891389f721.js?body=1"></script>
<script src="/assets/summernote/locales/es-EU-17491071278eb31012f9818b6db47663.js?body=1"></script>
<script src="/assets/summernote/locales/fa-IR-e3aac164e9751fb6f29d442e880bcc65.js?body=1"></script>
<script src="/assets/summernote/locales/fi-FI-77790f9982a023fe632d8c8dd2772ec5.js?body=1"></script>
<script src="/assets/summernote/locales/fr-FR-7c6cdd959b34d5304bbf0280f79d49b2.js?body=1"></script>
<script src="/assets/summernote/locales/he-IL-3ce6ebd0261ffbbce97cc7b9b09be376.js?body=1"></script>
<script src="/assets/summernote/locales/hu-HU-8e59e212c7d994839a3241a3ab15474f.js?body=1"></script>
<script src="/assets/summernote/locales/id-ID-893745adfda7bb0de725e386ae890633.js?body=1"></script>
<script src="/assets/summernote/locales/it-IT-c4e79cb48688cf734191bfc8cefd0816.js?body=1"></script>
<script src="/assets/summernote/locales/ja-JP-0b329314fce4244f9d56917a8326502f.js?body=1"></script>
<script src="/assets/summernote/locales/ko-KR-bac5b8c7e91ce3a6ccfbe809d6cd0ff6.js?body=1"></script>
<script src="/assets/summernote/locales/nb-NO-5ab6bb0049aaa9549a2f6e544cd21a14.js?body=1"></script>
<script src="/assets/summernote/locales/nl-NL-0583f977617338ca055ea505a521c07f.js?body=1"></script>
<script src="/assets/summernote/locales/pl-PL-90447a3b91b4e2e21b9c0de6503b35db.js?body=1"></script>
<script src="/assets/summernote/locales/pt-BR-9eef73a4e5b6606e0a3cf4d4cb39da14.js?body=1"></script>
<script src="/assets/summernote/locales/ro-RO-c520aa1b974224d748663a13e20547ab.js?body=1"></script>
<script src="/assets/summernote/locales/ru-RU-b58c000b05237206759680567c85be93.js?body=1"></script>
<script src="/assets/summernote/locales/sk-SK-bf6c5d803dfb883b4b17bab60c0ce566.js?body=1"></script>
<script src="/assets/summernote/locales/sl-SI-d199efa4dcf6c977c91c41285e949325.js?body=1"></script>
<script src="/assets/summernote/locales/sr-RS-Latin-0ea267e37ef31b54bd5d6e066d3fd39d.js?body=1"></script>
<script src="/assets/summernote/locales/sr-RS-2caca320f780cfb03cd47604e07cb89c.js?body=1"></script>
<script src="/assets/summernote/locales/sv-SE-423ad238324b74cfbaa14c3f563f7091.js?body=1"></script>
<script src="/assets/summernote/locales/th-TH-e008697fe6717b8561ee55a7d31f81ab.js?body=1"></script>
<script src="/assets/summernote/locales/tr-TR-2ebfeafef6e4078362a72506d4a23b57.js?body=1"></script>
<script src="/assets/summernote/locales/uk-UA-f5ae2e5a867bc422201b1db420895c96.js?body=1"></script>
<script src="/assets/summernote/locales/vi-VN-e1b6a3ad43ec763111e4820a408a7e28.js?body=1"></script>
<script src="/assets/summernote/locales/zh-CN-1cdc3cb8579e8b4192bb78449bef2d79.js?body=1"></script>
<script src="/assets/summernote/locales/zh-TW-ecec2a5cb60fec66b6c93fd0952d0660.js?body=1"></script>
<script src="/assets/summernote/locales/index-effa6f426213facfb6974a512f839e5e.js?body=1"></script>

textarea disabled ..... but still BEING EDITTED!

Am using summernote with simple_form with some success. However there are times when I want to show a form with some/ all fields disabled (for input). Summernote textareas do not seem to play ball with this. Can anyone suggest a syntax that actually works or is there a summernote problem?

My effort so far is:

  = f.input :body, as: :summernote, \ 
           placeholder: 'Textual body content', \
           input_html: { maxlength: 4096, rows: 10, style: "width: 100%" }, \
           disabled: showmode
  1. I use the slim templating engine so there is less distracting syntax.
  2. Have tried putting the disabled parameter into the input_html block without success.

summernote-rails 0.8.1.1 breaks test environment with error: undefined method `[]' for nil:NilClass

Hi, I just upgraded from summernote-rails 0.7.1.0 to 0.8.1.1 and my capybara tests are now all failing. I am just digging into this now and will try to build a more concise failure case, but perhaps someone watching these issues has encountered the same problem and has some ideas?

Here is the error:

ActionView::Template::Error: undefined method `[]' for nil:NilClass
sprockets-3.5.2/lib/sprockets/sass_processor.rb:278:in `sprockets_context'

Removing //= require summernote from my application.css.scss fixes the problem. Downgrading to summernote-rails 0.7.1.0 also fixes it.

The failing code in sprockets-3.5.2/lib/sprockets/sass_processor.rb is:

def sprockets_context
  options[:sprockets][:context] # Fails here
end

Using pry I discovered that options has no key named :sprockets, and so options[:sprockets] is nil, leading to the error.

I am using Rails 4.2.5.1, sprockets 3.5.2, sprockets-rails 3.0.2, and summernote-rails 0.8.1.1.

Here is a more complete backtrace:

sprockets-3.5.2/lib/sprockets/sass_processor.rb:280:in `sprockets_context'
sprockets-3.5.2/lib/sprockets/sass_processor.rb:124:in `asset_path'
sprockets-3.5.2/lib/sprockets/sass_processor.rb:200:in `font_path'
sass-3.4.21/lib/sass/script/tree/funcall.rb:140:in `_perform'
sass-3.4.21/lib/sass/script/tree/node.rb:50:in `perform'
sass-3.4.21/lib/sass/script/tree/funcall.rb:170:in `perform_arg'
sass-3.4.21/lib/sass/script/tree/funcall.rb:124:in `block in _perform'
sass-3.4.21/lib/sass/script/tree/funcall.rb:124:in `each'
sass-3.4.21/lib/sass/script/tree/funcall.rb:124:in `each_with_index'
sass-3.4.21/lib/sass/script/tree/funcall.rb:124:in `each'
sass-3.4.21/lib/sass/script/tree/funcall.rb:124:in `map'
sass-3.4.21/lib/sass/script/tree/funcall.rb:124:in `_perform'
sass-3.4.21/lib/sass/script/tree/node.rb:50:in `perform'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:395:in `visit_prop'
sass-3.4.21/lib/sass/tree/visitors/base.rb:36:in `visit'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:158:in `block in visit'
sass-3.4.21/lib/sass/stack.rb:79:in `block in with_base'
sass-3.4.21/lib/sass/stack.rb:115:in `with_frame'
sass-3.4.21/lib/sass/stack.rb:79:in `with_base'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:158:in `visit'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:502:in `block (2 levels) in visit_directive'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:502:in `map'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:502:in `block in visit_directive'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:179:in `with_environment'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:501:in `visit_directive'
sass-3.4.21/lib/sass/tree/visitors/base.rb:36:in `visit'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:158:in `block in visit'
sass-3.4.21/lib/sass/stack.rb:79:in `block in with_base'
sass-3.4.21/lib/sass/stack.rb:115:in `with_frame'
sass-3.4.21/lib/sass/stack.rb:79:in `with_base'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:158:in `visit'
sass-3.4.21/lib/sass/tree/visitors/base.rb:52:in `block in visit_children'
sass-3.4.21/lib/sass/tree/visitors/base.rb:52:in `map'
sass-3.4.21/lib/sass/tree/visitors/base.rb:52:in `visit_children'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:167:in `block in visit_children'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:179:in `with_environment'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:166:in `visit_children'
sass-3.4.21/lib/sass/tree/visitors/base.rb:36:in `block in visit'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:186:in `visit_root'
sass-3.4.21/lib/sass/tree/visitors/base.rb:36:in `visit'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:157:in `visit'
sass-3.4.21/lib/sass/tree/visitors/perform.rb:8:in `visit'
sass-3.4.21/lib/sass/tree/root_node.rb:36:in `css_tree'
sass-3.4.21/lib/sass/tree/root_node.rb:20:in `render'
sass-3.4.21/lib/sass/engine.rb:278:in `render'
sprockets-3.5.2/lib/sprockets/sass_compressor.rb:48:in `call'
sprockets-3.5.2/lib/sprockets/sass_compressor.rb:28:in `call'
sprockets-3.5.2/lib/sprockets/processor_utils.rb:75:in `call_processor'
sprockets-3.5.2/lib/sprockets/processor_utils.rb:57:in `block in call_processors'
sprockets-3.5.2/lib/sprockets/processor_utils.rb:56:in `reverse_each'
sprockets-3.5.2/lib/sprockets/processor_utils.rb:56:in `call_processors'
sprockets-3.5.2/lib/sprockets/loader.rb:134:in `load_from_unloaded'
sprockets-3.5.2/lib/sprockets/loader.rb:60:in `block in load'
sprockets-3.5.2/lib/sprockets/loader.rb:318:in `fetch_asset_from_dependency_cache'
sprockets-3.5.2/lib/sprockets/loader.rb:44:in `load'
sprockets-3.5.2/lib/sprockets/cached_environment.rb:20:in `block in initialize'
sprockets-3.5.2/lib/sprockets/cached_environment.rb:47:in `load'
sprockets-3.5.2/lib/sprockets/base.rb:66:in `find_asset'
sprockets-3.5.2/lib/sprockets/base.rb:73:in `find_all_linked_assets'
sprockets-3.5.2/lib/sprockets/manifest.rb:142:in `block in find'
sprockets-3.5.2/lib/sprockets/legacy.rb:114:in `block (2 levels) in logical_paths'
sprockets-3.5.2/lib/sprockets/path_utils.rb:225:in `block in stat_tree'
sprockets-3.5.2/lib/sprockets/path_utils.rb:209:in `block in stat_directory'
sprockets-3.5.2/lib/sprockets/path_utils.rb:206:in `each'
sprockets-3.5.2/lib/sprockets/path_utils.rb:206:in `stat_directory'
sprockets-3.5.2/lib/sprockets/path_utils.rb:224:in `stat_tree'
sprockets-3.5.2/lib/sprockets/legacy.rb:105:in `each'
sprockets-3.5.2/lib/sprockets/legacy.rb:105:in `block in logical_paths'
sprockets-3.5.2/lib/sprockets/legacy.rb:104:in `each'
sprockets-3.5.2/lib/sprockets/legacy.rb:104:in `logical_paths'
sprockets-3.5.2/lib/sprockets/manifest.rb:140:in `find'
sprockets-rails-3.0.2/lib/sprockets/railtie.rb:41:in `each'
sprockets-rails-3.0.2/lib/sprockets/railtie.rb:41:in `map'
sprockets-rails-3.0.2/lib/sprockets/railtie.rb:41:in `precompiled_assets'
sprockets-rails-3.0.2/lib/sprockets/railtie.rb:34:in `asset_precompiled?'
sprockets-rails-3.0.2/lib/sprockets/railtie.rb:205:in `block (3 levels) in <class:Railtie>'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:346:in `precompiled?'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:350:in `raise_unless_precompiled_asset'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:324:in `digest_path'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:312:in `asset_path'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:90:in `block in resolve_asset_path'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:230:in `block in resolve_asset'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:229:in `each'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:229:in `detect'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:229:in `resolve_asset'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:89:in `resolve_asset_path'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:79:in `compute_asset_path'
actionview-4.2.5.1/lib/action_view/helpers/asset_url_helper.rb:135:in `asset_path'
actionview-4.2.5.1/lib/action_view/helpers/asset_url_helper.rb:267:in `stylesheet_path'
actionview-4.2.5.1/lib/action_view/helpers/asset_tag_helper.rb:100:in `block in stylesheet_link_tag'
actionview-4.2.5.1/lib/action_view/helpers/asset_tag_helper.rb:96:in `map'
actionview-4.2.5.1/lib/action_view/helpers/asset_tag_helper.rb:96:in `stylesheet_link_tag'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:173:in `block in stylesheet_link_tag'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:171:in `map'
sprockets-rails-3.0.2/lib/sprockets/rails/helper.rb:171:in `stylesheet_link_tag'

Multi-user support

collaborative support with different user's cursors blinking on the document would be nice. Something similar to what quill.js has but implemented in rails

try to save but did'nt saved

can someone help me, I try to save text but did'nt save, this is my form.

`


<%= simple_form_for @Forum do |f| %>
<%= f.input_field :title %>
<%= f.input_field :description %>
<%= f.input_field :content, as: :summernote %>
<%= f.submit "Buat artikel", class: "mini ui button olive" %>
<%= link_to "Cancel", :back, class: "mini ui button orange" %>
<% end %>

`

thanks

Can't set content of summernote textarea with capybara

I just updated from 0.6.16.0 to 0.8.1.0 and now I can't figure out how to set content of a summernote textarea in order to test its integration with my rails app.

With 0.6.16.0, this worked:

it "allows admins to add text blocks to events", js: true, focus: true do
    click_on "Add text block"
    expect(page).to have_content "Text block content"
    all("div[contenteditable]").last.set("Dummy text")
    click_on "Publish now"
    expect(page).to have_content "Event created successfully"
    expect(Event.last.text_blocks.last.text_attachment.content).to eq "Dummy text"
end

Now, it doesn't get set:

  1) events feature event creation adding content blocks allows admins to add text blocks to events
     Failure/Error: expect(Event.last.text_blocks.last.text_attachment.content).to eq "Dummy text"

       expected: "Dummy text"
            got: ""

       (compared using ==)

And unfortunately I need the 0.8.1.0 version for it's callbacks features.

Active Storage example

Hi,

Is there an example of using summernote-rails with Active Storage? In the example app, it looks like you set up Active Storage (did migration, included activestorage in application.js), but ended up using carrier wave.

Global override of .hidden-xs in bs3.css seems problematic

/* line 5866, /Users/vincent/.rbenv/versions/2.1.0/lib/ruby/gems/2.1.0/gems/summernote-rails-0.6.1/vendor/assets/stylesheets/summernote/bs3.css */

.hidden-xs {
  display: block !important;
}

This global override of bootstrap class break any element that using .hidden-xs class if it's css attribute display is not block

integration with active admin give messy buttons

[admin.scss]
/*
*= require bootstrap
*= require summernote
*/

[admin.js.coffee]
#= require jquery
#= require bootstrap
#= require summernote

summernote editor

$ ->
$('[data-provider="summernote"]').each ->
$(this).summernote()
height: 280

[post.rb]
form do |f|
f.inputs 'Blog Post' do
f.input :title
f.input :featured_image
f.input :body, input_html: { 'data-provider' => "summernote"}
f.input :user_id, as: :hidden, input_html: {value: current_admin_user.id}
end
f.actions
end

Reset file inputs to be friendly to remote forms in Rails

Suppose you have a summernote editor in a remote form:

= simple_form_for my_thin, remote: true do |sf|
  = sf.input :text, as: :summernote

When you insert an image with the image button in the toolbar, the input[type="file"]' input will not be blank causing jquery-ujs to fail to handle the form submission remotely, instead submitting it as html.

I fixed this with an onImageUpload callback; the key part below is wrapping the file inputs in a form and resetting the form:

      onImageUpload: function(files) {
        var $editor = $(this);
        var data = new FormData();
        data.append('file', files[0]);

        $.ajax({
          url: '/uploads',
          type: 'post',
          data: data,
          processData: false,
          contentType: false,
          success: function(response) {
            var imageUrl = response.url;
            $editor.summernote('insertImage', imageUrl);
            var form = $editor.parents('form');
            // Credit to: http://stackoverflow.com/a/13351234
            var fileInputs = form.find('input[type="file"]');
            fileInputs.wrap('form').closest('form').get(0).reset();
            fileInputs.unwrap();
          }
        });
      }

Content appears as raw HTML after saving

Good work on the lib, guys. Everything seems to be working well, except when loading or initializing a form that has HTML content already in it. For example, I create some markup in the form:

before saving

Save, gets written to the database correctly, but when I reload the form to edit, the HTML is simply raw when I would expect it to be formatted as before:

after saving

Thoughts?

images uploading

Hello guys, wtf with images in this wysiwyg implementation ??? ๐Ÿ‘Ž

There is a bug while deleting image

After upload a image, the uploaded image still existes if deleting it by Backspace directly.
Can you please tell me how to solve this? Thanks very much!

Setup integration test for gem testing

if possible.
we could make it easier to contribute this project XD

Requirement

  • enable to test target rails & ruby version.
  • enable to test some usage scenario.

Font Bold/Underline/Italic not working in V0.8.9.2

To reproduce.

  1. Clone current commit 51cd81d (Version 0.8.9.2)
  2. Build the example project, and navigate to the home page in Firefox 58.0.1 or Edge 41.16299.15.0
  3. Create a New Post, type some text, and attempt to Bold some of it.
  4. Nothing happens, whether by using the keyboard accelerator CTRL-B or by clicking the button
  5. Javascript console does not report any errors when using Firefox.

Other buttons not related to font bold/underline/italic/etc. seem to be working normally.

Current version of summernote (as seen live at summernote.org) does not have this issue.

Summernote not loading

Hello,

I'm having some trouble with the summernote gem. I followed a tutorial but I still can't get it to load. I don't get any errors. My text area still looks the same and just doesn't load the summernote. I'm using the latest version of the gem with Rails 4.2.

new.html.erb

<%= simple_form_for(@med) do |f| %>
    <div class="form-group">
        <%= f.input :description, as: :summernote, :id => 'description' %>
    </div>

meds.coffee

$ ->

  # to set summernote object
  # You should change '#description' to your textarea input id
  summer_note = $('#description')

  # to call summernote editor
  summer_note.summernote
    # to set options
    height:300
    codemirror:
      lineNumbers: true
      tabSize: 2
      theme: "solarized light"

  # to set code for summernote
  summer_note.code summer_note.val()

  # to get code for summernote
  summer_note.closest('form').submit ->
    # alert $('#description').code()
    summer_note.val summer_note.code()
    true

application.css.scss

*= require_tree .
 *= require_self
 */

@import "bootstrap";
@import "font-awesome";
@import "summernote";
@import "codemirror";
@import "codemirror/themes/solarized";
@import url("https://fonts.googleapis.com/css?family=Raleway:400,700");

application.js

//= require jquery
//= require jquery_ujs
//= require summernote
//= require bootstrap
//= require codemirror
//= require codemirror/modes/ruby
//= require codemirror/modes/sass
//= require codemirror/modes/shell
//= require codemirror/modes/sql
//= require codemirror/modes/slim
//= require codemirror/modes/nginx
//= require codemirror/modes/markdown
//= require codemirror/modes/javascript
//= require codemirror/modes/http
//= require codemirror/modes/htmlmixed
//= require codemirror/modes/haml
//= require codemirror/modes/xml
//= require codemirror/modes/css
//= require codemirror/modes/yaml
//= require codemirror/modes/slim
//= require codemirror/modes/php
//= require summernote
//= require_tree .

Gemfile

source 'https://rubygems.org'


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.2.0'
gem 'pg'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.1.0'
# See https://github.com/sstephenson/execjs#readme for more supported runtimes
# gem 'therubyracer', platforms: :ruby

# Use jquery as the JavaScript library
gem 'jquery-rails'
# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks
gem 'turbolinks'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.0'
# bundle exec rake doc:rails generates the API under doc/api.
gem 'sdoc', '~> 0.4.0', group: :doc

gem 'devise'
gem 'bootstrap-sass'
gem 'font-awesome-rails'
gem 'summernote-rails'
gem 'codemirror-rails'
gem 'simple_form'

# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'

# Use Unicorn as the app server
# gem 'unicorn'

# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development

group :development, :test do
  # Call 'byebug' anywhere in the code to stop execution and get a debugger console

  gem 'sqlite3'
  gem 'byebug'

  # Access an IRB console on exception pages or by using <%= console %> in views
  gem 'web-console', '~> 2.0'

  # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
  gem 'spring'

  gem 'better_errors'
  gem 'binding_of_caller'
end

Not sure what I'm doing wrong. Any help would be greatly appreciated. Thanks!!

Image problems on mobile view after rendering summernote text+images

If you use Summernote to create your blog posts like me, you'll notice that your images look very weird on mobile.

So here's a fix using javascript, unless there's a better fix in the summernote documentation:

<script>
if ( $(window).width() < 739) { 
  $(document).ready(function(){
    $('.progressiveMedia-image, .aspectRatioPlaceholder, .progressiveMedia, .progressiveMedia-canvas').css({
      'width': '200px'
    });
    $('.progressiveMedia-image, .aspectRatioPlaceholder, .progressiveMedia, .progressiveMedia-canvas').css({
      'height': 'auto'
    });
    $('.aspectRatioPlaceholder-fill').css({
      'padding-bottom': '100px'
    });
    $('.graf').css({
      'font-size': '15px'
    });
    $('.imageCaption').css({
      'width': '100%'
    });
    $('.progressiveMedia-canvas').css({
      'display': 'none'
    });
    $('.graf-image').css({
      'position' : 'relative'
    });
    $('.progressiveMedia-image').css({
      'position' : 'relative'
    });
    $('.aspectRatioPlaceholder-fill').css({
      'padding-bottom' : '10px'
    });
  })
}
</script>

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.