bootstrap_md_editor 0.1.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: e116fc797a462bdf122a3538ac5a9987fd1336be
+  data.tar.gz: b2945b3c536ea69c48347c469e96fee2cd86a17b
+SHA512:
+  metadata.gz: 42826e4453696850a19c510436e0f5916642d87aae29ab7bdefa1c40a0e8bf12db259fac76df1ec1169813f067feab9d5ce515d363f2b8bf3b49950340332293
+  data.tar.gz: e9c63d2e67089f904a02b8c978e2a796dbe6e344565fa6bd589a1d3ad23bdcf6d80e16068b042c0b1ce386bf111313d06544dd8c351c4e76f8e8eddb182057c0

data/MIT-LICENSE

@@ -0,0 +1,20 @@
+Copyright 2017 Dieter Lunn
+
+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/README.md

@@ -0,0 +1,28 @@
+# BootstrapMdEditor
+Short description and motivation.
+
+## Usage
+How to use my plugin.
+
+## Installation
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'bootstrap_md_editor'
+```
+
+And then execute:
+```bash
+$ bundle
+```
+
+Or install it yourself as:
+```bash
+$ gem install bootstrap_md_editor
+```
+
+## Contributing
+Contribution directions go here.
+
+## License
+The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,36 @@
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+require 'rdoc/task'
+
+RDoc::Task.new(:rdoc) do |rdoc|
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title    = 'BootstrapMdEditor'
+  rdoc.options << '--line-numbers'
+  rdoc.rdoc_files.include('README.md')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end
+
+APP_RAKEFILE = File.expand_path("../test/dummy/Rakefile", __FILE__)
+load 'rails/tasks/engine.rake'
+
+
+load 'rails/tasks/statistics.rake'
+
+
+
+require 'bundler/gem_tasks'
+
+require 'rake/testtask'
+
+Rake::TestTask.new(:test) do |t|
+  t.libs << 'test'
+  t.pattern = 'test/**/*_test.rb'
+  t.verbose = false
+end
+
+
+task default: :test

data/app/assets/javascripts/bootstrap_md_editor.coffee

@@ -0,0 +1,123 @@
+$ ->
+  $('[data-toggle="tooltip"]').tooltip()
+  return
+
+$ ->
+  $('[data-editor="h1"]').click ->
+    insertAtCaret('#md-editor textarea', '# Your title')
+    return
+
+$ ->
+  $('[data-editor="h2"]').click ->
+    insertAtCaret('#md-editor textarea', '## Your title')
+    return
+
+$ ->
+  $('[data-editor="h3"]').click ->
+    insertAtCaret('#md-editor textarea', '### Your title')
+    return
+
+$ ->
+  $('[data-editor="h4"]').click ->
+    insertAtCaret('#md-editor textarea', '#### Your title')
+    return
+
+$ ->
+  $('[data-editor="h5"]').click ->
+    insertAtCaret('#md-editor textarea', '##### Your title')
+    return
+
+$ ->
+  $('[data-editor="italic"]').click ->
+    insertAtCaret('#md-editor textarea', '*Italic text*')
+    return
+
+$ ->
+  $('[data-editor="bold"]').click ->
+    insertAtCaret('#md-editor textarea', '__Bold text__')
+    return
+
+$ ->
+  $('[data-editor="ol"]').click ->
+    insertAtCaret('#md-editor textarea', "\n\n1. Item 1\n2. Item 2\n3. Item 3 \n\n")
+    return
+
+$ ->
+  $('[data-editor="ul"]').click ->
+    insertAtCaret('#md-editor textarea', "\n\n* Item 1\n* Item 2\n* Item 3 \n\n")
+    return
+
+$ ->
+  $('[data-editor="underline"]').click ->
+    insertAtCaret('#md-editor textarea', '_Underlined text_')
+    return
+
+$ ->
+  $('[data-editor="table"]').click ->
+    insertAtCaret('#md-editor textarea', "\n|Header|Header|Header|\n|:------|:-------:|------:|\n|Left alignment|Centered|Right alignment|\n\n")
+    return
+
+$ ->
+  $('[data-editor="link"]').click ->
+    insertAtCaret('#md-editor textarea', "\n[This is a link](http://google.com)\n")
+    return
+
+$ ->
+  $('[data-editor="image"]').click ->
+    insertAtCaret('#md-editor textarea', "\n![Alt](https://www.google.com.co/images/srpr/logo11w.png)\n")
+    return
+
+$ ->
+  $('[data-editor="preview"]').click ->
+    preview()
+    return
+
+insertAtCaret = (areaId, text) ->
+  txtarea = $(areaId)[0]
+  if !txtarea
+    return
+  scrollPos = txtarea.scrollTop
+  strPos = 0
+  br = if txtarea.selectionStart or txtarea.selectionStart == '0' then 'ff' else if document.selection then 'ie' else false
+  if br is 'ie'
+    txtarea.focus()
+    range = document.selection.createRange()
+    range.moveStart 'character', -txtarea.value.length
+    strPos = range.text.length
+  else if br is 'ff'
+    strPos = txtarea.selectionStart
+  front = txtarea.value.substring(0, strPos)
+  back = txtarea.value.substring(strPos, txtarea.value.length)
+  txtarea.value = front + text + back
+  strPos = strPos + text.length
+  if br is 'ie'
+    txtarea.focus()
+    ieRange = document.selection.createRange()
+    ieRange.moveStart 'character', -txtarea.value.length
+    ieRange.moveStart 'character', strPos
+    ieRange.moveEnd 'character', 0
+    ieRange.select()
+  else if br is 'ff'
+    txtarea.selectionStart = strPos
+    txtarea.selectionEnd = strPos
+    txtarea.focus()
+  txtarea.scrollTop = scrollPos
+  return
+
+preview = ->
+  if $('#md-editor').prop('hidden')
+    $('#md-preview').text('Preview')
+    $('#md-editor').removeAttr('hidden')
+    $('#md-preview-card').attr('hidden', 'true')
+    false
+  else
+    $.post(
+      '/editor/preview',
+      {md: $('#md-editor textarea').val()},
+      (data) ->
+        $('#md-preview').text('Editor')
+        $('#md-editor').attr('hidden', 'true')
+        $('#md-preview-card').removeAttr('hidden')
+        $('#md-preview-card .card-body').html(data)
+    )
+  return

data/app/controllers/editor_controller.rb

@@ -0,0 +1,7 @@
+class EditorController < ApplicationController
+  def preview
+    options = {autolink: true, tables: true, hard_wrap: true, no_intra_emphasis: true, fenced_code:true, gh_blockcode: true, underline: true}
+    html = Redcarpet::Markdown.new(Redcarpet::Render::HTML, options).render(params['md']).html_safe
+    render html: html
+  end
+end

data/app/helpers/bootstrap_md_editor/view_helpers.rb

@@ -0,0 +1,7 @@
+module BootstrapMdEditor
+  module ViewHelpers
+    def bootstrap_md_editor(form, field)
+      render 'bootstrap_md_editor/editor', form: form, field: field
+    end
+  end
+end

data/app/views/bootstrap_md_editor/_editor.html.erb

@@ -0,0 +1,12 @@
+<div class="row mb-2">
+  <div class="col d-flex justify-content-center">
+    <%= render 'bootstrap_md_editor/toolbar' %>
+  </div>
+</div>
+
+<div class="row">
+  <div  class="col">
+    <%= render 'bootstrap_md_editor/text_area', form: form, field: field %>
+    <%= render 'bootstrap_md_editor/preview' %>
+  </div>
+</div>

data/app/views/bootstrap_md_editor/_preview.html.erb

@@ -0,0 +1,4 @@
+<div id="md-preview-card" class="card border-success mb-2" hidden="hidden">
+  <div class="card-body">
+  </div>
+</div>

data/app/views/bootstrap_md_editor/_text_area.html.erb

@@ -0,0 +1,5 @@
+<div class="form-group">
+  <span id="md-editor">
+    <%= form.text_area field, class: 'form-control' %>
+  </span>
+</div>

data/app/views/bootstrap_md_editor/_toolbar.html.erb

@@ -0,0 +1,51 @@
+<div class="btn-toolbar" role="toolbar">
+  <div class="dropdown mr-2">
+    <button id="headerMenuButton" class="btn btn-primary btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+      Headers
+    </button>
+    <div class="dropdown-menu" aria-labelledby="headerMenuButton">
+      <button class="dropdown-item" data-editor="h1">H1</button>
+      <button class="dropdown-item" data-editor="h2">H2</button>
+      <button class="dropdown-item" data-editor="h3">H3</button>
+      <button class="dropdown-item" data-editor="h4">H4</button>
+      <button class="dropdown-item" data-editor="h5">H5</button>
+    </div>
+  </div>
+
+  <div class="btn-group mr-2" role="group">
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" title="Italic" data-placement="top" data-editor="italic">
+      <%= icon('italic') %>
+    </button>
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" title="Bold" data-placement="top" data-editor="bold">
+      <%= icon('bold') %>
+    </button>
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" data-placement="top" title="Unordered list" data-editor="ul">
+      <%= icon('list-ul') %>
+    </button>
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" data-placement="top" title="Ordered list" data-editor="ol">
+      <%= icon('list-ol') %>
+    </button>
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" data-placement="top" title="Indent">
+      <%= icon('indent') %>
+    </button>
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" data-placement="top" title="Underline" data-editor="underline">
+      <%= icon('underline') %>
+    </button>
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" data-placement="top" title="Table" data-editor="table">
+      <%= icon('table') %>
+    </button>
+  </div>
+
+  <div class="btn-group mr-2" role="group">
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" data-placement="top" title="Link" data-editor="link">
+      <%= icon('link') %>
+    </button>
+    <button class="btn btn-light btn-sm" data-toggle="tooltip" data-placement="top" title="Image" data-editor="image">
+      <%= icon('image') %>
+    </button>
+  </div>
+
+  <button id="md-preview" class="btn btn-info btn-sm" data-editor="preview">
+    Preview
+  </button>
+</div>

data/config/routes.rb

@@ -0,0 +1,3 @@
+Rails.application.routes.draw do
+  post 'editor/preview'
+end

data/lib/bootstrap_md_editor.rb

@@ -0,0 +1,6 @@
+require "bootstrap_md_editor/engine"
+require 'bootstrap_md_editor/railtie'
+
+module BootstrapMdEditor
+
+end

data/lib/bootstrap_md_editor/engine.rb

@@ -0,0 +1,5 @@
+module BootstrapMdEditor
+  class Engine < ::Rails::Engine
+    isolate_namespace BootstrapMdEditor
+  end
+end

data/lib/bootstrap_md_editor/railtie.rb

@@ -0,0 +1,7 @@
+module BootstrapMdEditor
+  class Railtie < ::Rails::Railtie
+    initializer 'bootstrap_md_editor/view_helpers' do
+      ActionView::Base.send :include, ViewHelpers
+    end
+  end
+end

data/lib/bootstrap_md_editor/version.rb

@@ -0,0 +1,3 @@
+module BootstrapMdEditor
+  VERSION = '0.1.1'
+end

metadata

@@ -0,0 +1,93 @@
+--- !ruby/object:Gem::Specification
+name: bootstrap_md_editor
+version: !ruby/object:Gem::Version
+  version: 0.1.1
+platform: ruby
+authors:
+- Dieter Lunn
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2017-09-21 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: rails
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '5.1'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 5.1.4
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '5.1'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 5.1.4
+- !ruby/object:Gem::Dependency
+  name: bootstrap-sass
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 4.0.0.beta
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 4.0.0.beta
+description: Simple Markdown editor styled with Bootstrap
+email:
+- coder2000@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- MIT-LICENSE
+- README.md
+- Rakefile
+- app/assets/javascripts/bootstrap_md_editor.coffee
+- app/controllers/editor_controller.rb
+- app/helpers/bootstrap_md_editor/view_helpers.rb
+- app/views/bootstrap_md_editor/_editor.html.erb
+- app/views/bootstrap_md_editor/_preview.html.erb
+- app/views/bootstrap_md_editor/_text_area.html.erb
+- app/views/bootstrap_md_editor/_toolbar.html.erb
+- config/routes.rb
+- lib/bootstrap_md_editor.rb
+- lib/bootstrap_md_editor/engine.rb
+- lib/bootstrap_md_editor/railtie.rb
+- lib/bootstrap_md_editor/version.rb
+homepage: http://github.com/coder2000/bootstrap_md_editor
+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.6.13
+signing_key: 
+specification_version: 4
+summary: Markdown editor with Bootstrap 4
+test_files: []