lazy_modal 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +7 -0
- data/MIT-LICENSE +20 -0
- data/README.md +60 -0
- data/Rakefile +36 -0
- data/app/assets/javascripts/lazy_modal/application.coffee +76 -0
- data/app/assets/stylesheets/lazy_modal/application.scss +18 -0
- data/app/controllers/lazy_modal/lazy_modals_controller.rb +18 -0
- data/app/views/lazy_modal/modals/demo.erb +18 -0
- data/config/routes.rb +3 -0
- data/lib/generators/lazy_modal/install_generator.rb +34 -0
- data/lib/lazy_modal/engine.rb +7 -0
- data/lib/lazy_modal/version.rb +3 -0
- data/lib/lazy_modal.rb +5 -0
- metadata +127 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: 3bd9635b880dff28e3703aa326dce4f9fa026812
|
4
|
+
data.tar.gz: c594673c0f7512f1379c66e0f5c129a54baf58ad
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 6a291dd52e6525d3b392d0f7fe6e124c7d312d51901765f8fe3dcfc6be5075a4bf837cdcbc2737b1e4da9819e4cbdeb016c78489252f5f676b8b6a4a8dfd41b1
|
7
|
+
data.tar.gz: eb691f947004141aba6513cacf872050049d3c6c21b265570937ecdd1bdbdf83c38f8de167b5e72b4e10ca408012eba685fde9c2ac701d18027d1db90ec5060e
|
data/MIT-LICENSE
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright 2017 LiBo
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,60 @@
|
|
1
|
+
# lazy-modal
|
2
|
+
|
3
|
+
show **bootstrap** modal with lazy load. sometimes we have too many modals in html body. and u know always some modal not need rendered. the best pratice to show modal i think is lazy load modal. **bootstrap** modal plugin provide remote away the load modal content when needed.
|
4
|
+
this gem provide way load **bootstrap** modal from remote server. so that we can load the modal when needed it. it's start!
|
5
|
+
|
6
|
+
## Usage
|
7
|
+
|
8
|
+
How to **lazy-modal** it's too simplest!
|
9
|
+
|
10
|
+
Add this line to your rails application's Gemfile:
|
11
|
+
|
12
|
+
```ruby
|
13
|
+
gem 'lazy_modal'
|
14
|
+
```
|
15
|
+
|
16
|
+
And then execute:
|
17
|
+
|
18
|
+
```bash
|
19
|
+
$ bundle
|
20
|
+
```
|
21
|
+
|
22
|
+
Auto init lazy_modal required file
|
23
|
+
|
24
|
+
```
|
25
|
+
$ rails generate lazy_modal:install
|
26
|
+
```
|
27
|
+
|
28
|
+
That's all!
|
29
|
+
|
30
|
+
Now test if `lazy-modal` installed?
|
31
|
+
|
32
|
+
Start server
|
33
|
+
|
34
|
+
```bash
|
35
|
+
$ rails s
|
36
|
+
```
|
37
|
+
|
38
|
+
open below url in any browse [http://localhost:3000/lazy_modal/demo](http://localhost:3000/lazy_modal/demo), u will see a break style modal demo
|
39
|
+
|
40
|
+
##Options
|
41
|
+
|
42
|
+
You can trigger `lazy_modal` below way:
|
43
|
+
|
44
|
+
```
|
45
|
+
<%= link_to 'demo', '#demo', data: {lazy_modal: true, modal_options:{dir: 'custom_modals', title: 'loading', size: 'modal-sm', target: 'demo', id: 'demo'}} %>
|
46
|
+
```
|
47
|
+
|
48
|
+
You must set `a` tag with **data-lazy-modal=true** and use **modal_options** to custom modal
|
49
|
+
|
50
|
+
ModalOptions | Type | Remark
|
51
|
+
------------- | ------------- | -----------
|
52
|
+
id/target/href | string | **required**, modal id like: `#charge_modal`
|
53
|
+
dir | string | **optional**,u should set u modal view dir name like: `users` mean's find modal in `app/views/users/modal_id`
|
54
|
+
title | string | **optional**,before load remote modal, u will see simple load modal with placeholder, so the options set the modal title
|
55
|
+
size | string | **optional**,before load remote modal, u will see simple load modal with placeholder, so the options set the modal-content with custom class like: `modal-sm|modal-lg`
|
56
|
+
|
57
|
+
|
58
|
+
|
59
|
+
## License
|
60
|
+
The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
|
data/Rakefile
ADDED
@@ -0,0 +1,36 @@
|
|
1
|
+
begin
|
2
|
+
require 'bundler/setup'
|
3
|
+
rescue LoadError
|
4
|
+
puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
|
5
|
+
end
|
6
|
+
|
7
|
+
require 'rdoc/task'
|
8
|
+
|
9
|
+
RDoc::Task.new(:rdoc) do |rdoc|
|
10
|
+
rdoc.rdoc_dir = 'rdoc'
|
11
|
+
rdoc.title = 'LM'
|
12
|
+
rdoc.options << '--line-numbers'
|
13
|
+
rdoc.rdoc_files.include('README.md')
|
14
|
+
rdoc.rdoc_files.include('lib/**/*.rb')
|
15
|
+
end
|
16
|
+
|
17
|
+
APP_RAKEFILE = File.expand_path("../test/dummy/Rakefile", __FILE__)
|
18
|
+
load 'rails/tasks/engine.rake'
|
19
|
+
|
20
|
+
|
21
|
+
load 'rails/tasks/statistics.rake'
|
22
|
+
|
23
|
+
|
24
|
+
|
25
|
+
require 'bundler/gem_tasks'
|
26
|
+
|
27
|
+
require 'rake/testtask'
|
28
|
+
|
29
|
+
Rake::TestTask.new(:test) do |t|
|
30
|
+
t.libs << 'test'
|
31
|
+
t.pattern = 'test/**/*_test.rb'
|
32
|
+
t.verbose = false
|
33
|
+
end
|
34
|
+
|
35
|
+
|
36
|
+
task default: :test
|
@@ -0,0 +1,76 @@
|
|
1
|
+
#= require jquery
|
2
|
+
#= require bootstrap/modal
|
3
|
+
|
4
|
+
window.LM ||= {}
|
5
|
+
|
6
|
+
LM.loadRemoteModalByID = (modalID, modalOptions) ->
|
7
|
+
new LazyModalModal(modalID, modalOptions).show()
|
8
|
+
|
9
|
+
LM.triggerLoadRemoteModal = (event) ->
|
10
|
+
event.preventDefault()
|
11
|
+
$target = $(event.currentTarget)
|
12
|
+
modalOptions = $target.data('modal-options')
|
13
|
+
modalID = modalOptions.target || modalOptions.id || $target.attr('href')
|
14
|
+
LM.loadRemoteModalByID modalID, modalOptions
|
15
|
+
|
16
|
+
class LazyModalModal
|
17
|
+
constructor: (@originModalID, @modalOptions) ->
|
18
|
+
@modalTitle = @modalOptions?.default_modal?.title || ''
|
19
|
+
alert('u must set modal ID with data-target or href attrs') unless @originModalID
|
20
|
+
if @originModalID.indexOf('#') !=-1
|
21
|
+
@modalID = @originModalID?.split("#").pop()
|
22
|
+
else
|
23
|
+
@modalID = @originModalID
|
24
|
+
@originModalID = "##{@originModalID}"
|
25
|
+
|
26
|
+
show: ->
|
27
|
+
return unless @modalID
|
28
|
+
@_findOrCreateModal()
|
29
|
+
@_showModal()
|
30
|
+
|
31
|
+
_findOrCreateModal: ->
|
32
|
+
if $(@originModalID).length
|
33
|
+
@modal = $(@originModalID)
|
34
|
+
else
|
35
|
+
modalDom = @_createModalDom()
|
36
|
+
@modal = $(modalDom)
|
37
|
+
@_addModalEventListener()
|
38
|
+
|
39
|
+
_showModal: ->
|
40
|
+
@modal?.modal 'show' unless @modal?.isShown
|
41
|
+
|
42
|
+
_createModalDom: ->
|
43
|
+
"""
|
44
|
+
<div class="modal light dialog in" tabindex="-1" role="dialog" aria-hidden="true">
|
45
|
+
<div class="modal-dialog #{@modalOptions?.default_modal?.size || ''}">
|
46
|
+
<div class="modal-content">
|
47
|
+
<div class="modal-header">
|
48
|
+
<button type="button" class="close" data-dismiss="modal"><span>×</span></button>
|
49
|
+
<h4 class="modal-title">#{@modalTitle || ''}</h4>
|
50
|
+
</div>
|
51
|
+
<div class="modal-body clearfix">
|
52
|
+
<h5 class="text-center">loading...</h5>
|
53
|
+
</div>
|
54
|
+
</div>
|
55
|
+
</div>
|
56
|
+
</div>
|
57
|
+
"""
|
58
|
+
|
59
|
+
_addModalEventListener: ->
|
60
|
+
@modal.on 'shown.bs.modal', =>
|
61
|
+
return if $("##{@modalID}").length
|
62
|
+
data = {modal_dir: @modalOptions?.dir}
|
63
|
+
console.log @modalID, @modalOptions
|
64
|
+
$.get("/lazy_modals/#{@modalID}", data)
|
65
|
+
.done (response) => @_loadRemoteModalSuccessed response
|
66
|
+
.fail (response, xhr, status) =>
|
67
|
+
@modal.find('.modal-body').html response.responseText
|
68
|
+
|
69
|
+
_loadRemoteModalSuccessed: (response)->
|
70
|
+
@modal?.modal 'hide'
|
71
|
+
@modal = $(response)
|
72
|
+
$('body').append @modal
|
73
|
+
@modal.trigger 'LM.modal.content.loaded', @modalOptions
|
74
|
+
@show()
|
75
|
+
|
76
|
+
$(document).on 'click', '[data-lazy-modal="true"]', LM.triggerLoadRemoteModal
|
@@ -0,0 +1,18 @@
|
|
1
|
+
// Core variables and mixins
|
2
|
+
@import "bootstrap/variables";
|
3
|
+
@import "bootstrap/mixins";
|
4
|
+
|
5
|
+
// Core CSS
|
6
|
+
@import "bootstrap/buttons";
|
7
|
+
@import "bootstrap/type";
|
8
|
+
|
9
|
+
// Components
|
10
|
+
@import "bootstrap/component-animations";
|
11
|
+
@import "bootstrap/close";
|
12
|
+
|
13
|
+
// Components w/ JavaScript
|
14
|
+
@import "bootstrap/modals";
|
15
|
+
|
16
|
+
// Utility classes
|
17
|
+
@import "bootstrap/utilities";
|
18
|
+
@import "bootstrap/responsive-utilities";
|
@@ -0,0 +1,18 @@
|
|
1
|
+
module LazyModal
|
2
|
+
class LazyModalsController < ActionController::Base
|
3
|
+
protect_from_forgery with: :exception
|
4
|
+
|
5
|
+
rescue_from ActionView::MissingTemplate do
|
6
|
+
render plain: 'modal missing', status: :not_found
|
7
|
+
end
|
8
|
+
|
9
|
+
def show
|
10
|
+
tmpl = if params[:modal_dir]
|
11
|
+
"#{params[:modal_dir]}/#{params[:id]}"
|
12
|
+
else
|
13
|
+
"/lazy_modal/modals/#{params[:id]}"
|
14
|
+
end
|
15
|
+
render tmpl, layout: nil
|
16
|
+
end
|
17
|
+
end
|
18
|
+
end
|
@@ -0,0 +1,18 @@
|
|
1
|
+
<div class="modal fade" id="lazy_modal_demo">
|
2
|
+
<div class="modal-dialog">
|
3
|
+
<div class="modal-content">
|
4
|
+
<div class="modal-header">
|
5
|
+
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
6
|
+
<span aria-hidden="true">×</span></button>
|
7
|
+
<h4 class="modal-title">Demo</h4>
|
8
|
+
</div>
|
9
|
+
<div class="modal-body">
|
10
|
+
<p>This is Lazy Modal Demo, you can custom the modal by <%= link_to 'Readme', '#' %></p>
|
11
|
+
</div>
|
12
|
+
<div class="modal-footer">
|
13
|
+
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
14
|
+
<button type="button" class="btn btn-primary">OK I Got It!</button>
|
15
|
+
</div>
|
16
|
+
</div>
|
17
|
+
</div>
|
18
|
+
</div>
|
data/config/routes.rb
ADDED
@@ -0,0 +1,34 @@
|
|
1
|
+
module LazyModal
|
2
|
+
class InstallGenerator < Rails::Generators::Base
|
3
|
+
|
4
|
+
desc 'install lazy modal'
|
5
|
+
def install
|
6
|
+
route("mount LazyModal::Engine => '/'")
|
7
|
+
end
|
8
|
+
|
9
|
+
def inject_js_asset_file
|
10
|
+
%w(js coffee).each do |ext|
|
11
|
+
dest_file_path = "app/assets/javascripts/application.#{ext}"
|
12
|
+
if File.exist? "#{destination_root}/#{dest_file_path}"
|
13
|
+
insert_into_file dest_file_path, :before => "//= require_tree" do
|
14
|
+
"//= require lazy_modal/application\n"
|
15
|
+
end
|
16
|
+
break
|
17
|
+
end
|
18
|
+
end
|
19
|
+
end
|
20
|
+
|
21
|
+
def inject_css_asset_file
|
22
|
+
%w(css scss sass).each do |ext|
|
23
|
+
dest_file_path = "app/assets/stylesheets/application.#{ext}"
|
24
|
+
if File.exist? "#{destination_root}/#{dest_file_path}"
|
25
|
+
insert_into_file dest_file_path, :before => "*= require_self" do
|
26
|
+
"*= require lazy_modal/application\n"
|
27
|
+
end
|
28
|
+
break
|
29
|
+
end
|
30
|
+
end
|
31
|
+
end
|
32
|
+
|
33
|
+
end
|
34
|
+
end
|
data/lib/lazy_modal.rb
ADDED
metadata
ADDED
@@ -0,0 +1,127 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: lazy_modal
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.1.0
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- MixBo
|
8
|
+
autorequire:
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2017-09-18 00:00:00.000000000 Z
|
12
|
+
dependencies:
|
13
|
+
- !ruby/object:Gem::Dependency
|
14
|
+
name: rails
|
15
|
+
requirement: !ruby/object:Gem::Requirement
|
16
|
+
requirements:
|
17
|
+
- - "~>"
|
18
|
+
- !ruby/object:Gem::Version
|
19
|
+
version: 5.1.4
|
20
|
+
type: :runtime
|
21
|
+
prerelease: false
|
22
|
+
version_requirements: !ruby/object:Gem::Requirement
|
23
|
+
requirements:
|
24
|
+
- - "~>"
|
25
|
+
- !ruby/object:Gem::Version
|
26
|
+
version: 5.1.4
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: jquery-rails
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - '='
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: 4.3.1
|
34
|
+
type: :runtime
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - '='
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: 4.3.1
|
41
|
+
- !ruby/object:Gem::Dependency
|
42
|
+
name: coffee-rails
|
43
|
+
requirement: !ruby/object:Gem::Requirement
|
44
|
+
requirements:
|
45
|
+
- - '='
|
46
|
+
- !ruby/object:Gem::Version
|
47
|
+
version: 4.2.2
|
48
|
+
type: :runtime
|
49
|
+
prerelease: false
|
50
|
+
version_requirements: !ruby/object:Gem::Requirement
|
51
|
+
requirements:
|
52
|
+
- - '='
|
53
|
+
- !ruby/object:Gem::Version
|
54
|
+
version: 4.2.2
|
55
|
+
- !ruby/object:Gem::Dependency
|
56
|
+
name: bootstrap-sass
|
57
|
+
requirement: !ruby/object:Gem::Requirement
|
58
|
+
requirements:
|
59
|
+
- - '='
|
60
|
+
- !ruby/object:Gem::Version
|
61
|
+
version: 3.3.7
|
62
|
+
type: :runtime
|
63
|
+
prerelease: false
|
64
|
+
version_requirements: !ruby/object:Gem::Requirement
|
65
|
+
requirements:
|
66
|
+
- - '='
|
67
|
+
- !ruby/object:Gem::Version
|
68
|
+
version: 3.3.7
|
69
|
+
- !ruby/object:Gem::Dependency
|
70
|
+
name: sass-rails
|
71
|
+
requirement: !ruby/object:Gem::Requirement
|
72
|
+
requirements:
|
73
|
+
- - "~>"
|
74
|
+
- !ruby/object:Gem::Version
|
75
|
+
version: '5.0'
|
76
|
+
type: :runtime
|
77
|
+
prerelease: false
|
78
|
+
version_requirements: !ruby/object:Gem::Requirement
|
79
|
+
requirements:
|
80
|
+
- - "~>"
|
81
|
+
- !ruby/object:Gem::Version
|
82
|
+
version: '5.0'
|
83
|
+
description: lazy load bootstrap modal when u needed!
|
84
|
+
email:
|
85
|
+
- lb563@foxmail.com
|
86
|
+
executables: []
|
87
|
+
extensions: []
|
88
|
+
extra_rdoc_files: []
|
89
|
+
files:
|
90
|
+
- MIT-LICENSE
|
91
|
+
- README.md
|
92
|
+
- Rakefile
|
93
|
+
- app/assets/javascripts/lazy_modal/application.coffee
|
94
|
+
- app/assets/stylesheets/lazy_modal/application.scss
|
95
|
+
- app/controllers/lazy_modal/lazy_modals_controller.rb
|
96
|
+
- app/views/lazy_modal/modals/demo.erb
|
97
|
+
- config/routes.rb
|
98
|
+
- lib/generators/lazy_modal/install_generator.rb
|
99
|
+
- lib/lazy_modal.rb
|
100
|
+
- lib/lazy_modal/engine.rb
|
101
|
+
- lib/lazy_modal/version.rb
|
102
|
+
homepage: https://github.com/lihlio/lazy_modal
|
103
|
+
licenses:
|
104
|
+
- MIT
|
105
|
+
metadata: {}
|
106
|
+
post_install_message:
|
107
|
+
rdoc_options: []
|
108
|
+
require_paths:
|
109
|
+
- lib
|
110
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
111
|
+
requirements:
|
112
|
+
- - ">="
|
113
|
+
- !ruby/object:Gem::Version
|
114
|
+
version: '0'
|
115
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
116
|
+
requirements:
|
117
|
+
- - ">="
|
118
|
+
- !ruby/object:Gem::Version
|
119
|
+
version: '0'
|
120
|
+
requirements: []
|
121
|
+
rubyforge_project:
|
122
|
+
rubygems_version: 2.5.2
|
123
|
+
signing_key:
|
124
|
+
specification_version: 4
|
125
|
+
summary: lazy load bootstrap modals
|
126
|
+
test_files: []
|
127
|
+
has_rdoc:
|