cmor_carousels 0.0.32.pre → 0.0.33.pre
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 +4 -4
- data/app/assets/javascripts/cmor/carousels/application/carousel-video.js.coffee +12 -0
- data/app/assets/javascripts/cmor/carousels/application.js +4 -0
- data/app/assets/javascripts/cmor_carousels.js +3 -0
- data/app/assets/stylesheets/cmor/carousels/application/carousel-video.css +29 -0
- data/app/assets/stylesheets/cmor/carousels/application.css +3 -0
- data/app/assets/stylesheets/cmor_carousels.css +1 -0
- data/app/models/cmor/carousels/item_detail.rb +14 -0
- data/app/view_helpers/cmor/carousels/application_view_helper.rb +1 -1
- data/app/views/cmor/carousels/application_view_helper/_render_carousel.html.haml +31 -0
- data/config/initializers/assets.rb +2 -0
- metadata +14 -8
- data/app/views/cmor/carousels/application_view_helper/_render.html.erb +0 -31
- data/app/views/cmor/carousels/application_view_helper/_render.html.haml~ +0 -3
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: d6e9c0e8e5cf22cb9868eccd7d38ab0147010673bd6b057eb919550225ca549a
|
|
4
|
+
data.tar.gz: '0648613c5c03d76b46da3a76a12afec667fd92439d776248ea634af400fe2014'
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 5892b0c5e26cc7684f51ce0c4d47c13aa7a067dee3af1c24eaca6d2f15222d7be1cae44e4e131349e2a6e51834e9022cbd13a7bf58bb9b369c9ff7206b9087d3
|
|
7
|
+
data.tar.gz: 1b13795cf79f494139f1bf9d4a2e3954bc6010da669f337f39ab317ca6391286aacea6991ebdd325eddb9dd108996acffda5162e94a688c833b3b9d68e9e8ff5
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
$(document).ready ->
|
|
2
|
+
$('body').on 'click', '[data-video-control="toggle"]', ->
|
|
3
|
+
video = $($(@).data('video-target'))
|
|
4
|
+
console.log(video)
|
|
5
|
+
if video.prop('paused')
|
|
6
|
+
console.log('paused')
|
|
7
|
+
$(video).trigger('play')
|
|
8
|
+
$(@).html('❚❚');
|
|
9
|
+
else
|
|
10
|
+
console.log('playing')
|
|
11
|
+
$(video).trigger('pause')
|
|
12
|
+
$(@).html('►');
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
.carousel-video {
|
|
2
|
+
position:relative;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.carousel-video video {
|
|
6
|
+
position:relative;
|
|
7
|
+
z-index:0;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.carousel-video .video-overlay {
|
|
11
|
+
width: 100%;
|
|
12
|
+
position: absolute;
|
|
13
|
+
top: 0;
|
|
14
|
+
left: 0;
|
|
15
|
+
z-index: 1;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.carousel-video .video-controls {
|
|
19
|
+
display: none;
|
|
20
|
+
position: absolute;
|
|
21
|
+
bottom: 0;
|
|
22
|
+
right: 0;
|
|
23
|
+
z-index: 1;
|
|
24
|
+
padding: 1.5rem 1rem;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.carousel-video .video-controls:hover {
|
|
28
|
+
cursor: pointer;
|
|
29
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//= require cmor/carousels/application
|
|
@@ -13,6 +13,20 @@ module Cmor
|
|
|
13
13
|
def human
|
|
14
14
|
"#{carousel.class.model_name.human} #{carousel.human} - #{self.class.model_name.human} #{id}"
|
|
15
15
|
end
|
|
16
|
+
|
|
17
|
+
module ContentTypesConcern
|
|
18
|
+
extend ActiveSupport::Concern
|
|
19
|
+
|
|
20
|
+
def video?
|
|
21
|
+
asset.content_type.start_with?('video/')
|
|
22
|
+
end
|
|
23
|
+
|
|
24
|
+
def image?
|
|
25
|
+
asset.content_type.start_with?('image/')
|
|
26
|
+
end
|
|
27
|
+
end
|
|
28
|
+
|
|
29
|
+
include ContentTypesConcern
|
|
16
30
|
end
|
|
17
31
|
end
|
|
18
32
|
end
|
|
@@ -24,7 +24,7 @@ module Cmor
|
|
|
24
24
|
return I18n.t('cmor.carousels.carousel.warnings.not_found', identifier: identifier)
|
|
25
25
|
else
|
|
26
26
|
variant_options = options.delete(:variant_options) || carousel.variant_options
|
|
27
|
-
|
|
27
|
+
render carousel: carousel, options: options, data_attributes: data_attributes, variant_options: variant_options
|
|
28
28
|
end
|
|
29
29
|
end
|
|
30
30
|
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
%div{:class => "carousel #{"carousel-#{carousel.identifier}"} slide", "data-ride" => "carousel", :id => dom_id(carousel) }
|
|
2
|
+
- if options[:indicators]
|
|
3
|
+
%ol.carousel-indicators
|
|
4
|
+
- carousel.item_details.count.times do |i|
|
|
5
|
+
%li{:class => (i == 0) ? "active" : "", "data-slide-to" => i, "data-target" => "##{dom_id(carousel)}"}
|
|
6
|
+
.carousel-inner
|
|
7
|
+
- carousel.item_details.each_with_index do |item_detail, i|
|
|
8
|
+
%div{:class => "carousel-item #{(i == 0) ? "active" : ""}"}
|
|
9
|
+
- if item_detail.image?
|
|
10
|
+
%img.d-block.w-100{:src => main_app.url_for(item_detail.asset.variant(variant_options))}/
|
|
11
|
+
- if item_detail.description.present?
|
|
12
|
+
.carousel-caption.d-none.d-md-block
|
|
13
|
+
= markup_helper(self).to_html(item_detail, :description)
|
|
14
|
+
- elsif item_detail.video?
|
|
15
|
+
.carousel-video
|
|
16
|
+
-# %video#foo.w-100{ autoplay: "", loop: "", muted: ""}
|
|
17
|
+
%video.w-100{ id: "#{dom_id(item_detail)}-video", autoplay: "", muted: ""}
|
|
18
|
+
%source{ src: main_app.url_for(item_detail.asset), type: "video/mp4" }
|
|
19
|
+
.video-overlay.h-100
|
|
20
|
+
.container.content
|
|
21
|
+
-# overlayed content goes here.
|
|
22
|
+
.video-controls.text-white
|
|
23
|
+
%a{ data: { video: { target: "##{dom_id(item_detail)}-video", control: :toggle } } }
|
|
24
|
+
❚❚
|
|
25
|
+
- if options[:controls]
|
|
26
|
+
%a.carousel-control-prev{"data-slide" => "prev", :href => "##{dom_id(carousel)}", :role => "button"}
|
|
27
|
+
%span.carousel-control-prev-icon{"aria-hidden" => "true"}
|
|
28
|
+
%span.sr-only= t('.previous')
|
|
29
|
+
%a.carousel-control-next{"data-slide" => "next", :href => "##{dom_id(carousel)}", :role => "button"}
|
|
30
|
+
%span.carousel-control-next-icon{"aria-hidden" => "true"}
|
|
31
|
+
%span.sr-only= t('.next')
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: cmor_carousels
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.33.pre
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Roberto Vasquez Angel
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2019-08-
|
|
11
|
+
date: 2019-08-04 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: rails
|
|
@@ -30,28 +30,28 @@ dependencies:
|
|
|
30
30
|
requirements:
|
|
31
31
|
- - '='
|
|
32
32
|
- !ruby/object:Gem::Version
|
|
33
|
-
version: 0.0.
|
|
33
|
+
version: 0.0.33.pre
|
|
34
34
|
type: :runtime
|
|
35
35
|
prerelease: false
|
|
36
36
|
version_requirements: !ruby/object:Gem::Requirement
|
|
37
37
|
requirements:
|
|
38
38
|
- - '='
|
|
39
39
|
- !ruby/object:Gem::Version
|
|
40
|
-
version: 0.0.
|
|
40
|
+
version: 0.0.33.pre
|
|
41
41
|
- !ruby/object:Gem::Dependency
|
|
42
42
|
name: cmor_core_frontend
|
|
43
43
|
requirement: !ruby/object:Gem::Requirement
|
|
44
44
|
requirements:
|
|
45
45
|
- - '='
|
|
46
46
|
- !ruby/object:Gem::Version
|
|
47
|
-
version: 0.0.
|
|
47
|
+
version: 0.0.33.pre
|
|
48
48
|
type: :runtime
|
|
49
49
|
prerelease: false
|
|
50
50
|
version_requirements: !ruby/object:Gem::Requirement
|
|
51
51
|
requirements:
|
|
52
52
|
- - '='
|
|
53
53
|
- !ruby/object:Gem::Version
|
|
54
|
-
version: 0.0.
|
|
54
|
+
version: 0.0.33.pre
|
|
55
55
|
- !ruby/object:Gem::Dependency
|
|
56
56
|
name: sqlite3
|
|
57
57
|
requirement: !ruby/object:Gem::Requirement
|
|
@@ -356,12 +356,18 @@ files:
|
|
|
356
356
|
- MIT-LICENSE
|
|
357
357
|
- README.rdoc
|
|
358
358
|
- Rakefile
|
|
359
|
+
- app/assets/javascripts/cmor/carousels/application.js
|
|
360
|
+
- app/assets/javascripts/cmor/carousels/application/carousel-video.js.coffee
|
|
361
|
+
- app/assets/javascripts/cmor_carousels.js
|
|
362
|
+
- app/assets/stylesheets/cmor/carousels/application.css
|
|
363
|
+
- app/assets/stylesheets/cmor/carousels/application/carousel-video.css
|
|
364
|
+
- app/assets/stylesheets/cmor_carousels.css
|
|
359
365
|
- app/models/cmor/carousels/application_record.rb
|
|
360
366
|
- app/models/cmor/carousels/carousel.rb
|
|
361
367
|
- app/models/cmor/carousels/item_detail.rb
|
|
362
368
|
- app/view_helpers/cmor/carousels/application_view_helper.rb
|
|
363
|
-
- app/views/cmor/carousels/application_view_helper/
|
|
364
|
-
-
|
|
369
|
+
- app/views/cmor/carousels/application_view_helper/_render_carousel.html.haml
|
|
370
|
+
- config/initializers/assets.rb
|
|
365
371
|
- config/locales/de.yml
|
|
366
372
|
- config/locales/en.yml
|
|
367
373
|
- config/routes.rb
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
<div id="<%= dom_id(carousel) %>" class="carousel slide" data-ride="carousel">
|
|
2
|
-
<% if options[:indicators] %>
|
|
3
|
-
<ol class="carousel-indicators">
|
|
4
|
-
<% carousel.item_details.count.times do |i| %>
|
|
5
|
-
<li data-target="#<%= dom_id(carousel) %>" data-slide-to="<%= i %>" class="<%= (i == 0) ? "active" : "" %>"></li>
|
|
6
|
-
<% end %>
|
|
7
|
-
</ol>
|
|
8
|
-
<% end %>
|
|
9
|
-
<div class="carousel-inner">
|
|
10
|
-
<% carousel.item_details.each_with_index do |item_detail, i| %>
|
|
11
|
-
<div class="carousel-item <%= (i == 0) ? "active" : "" %>">
|
|
12
|
-
<img class="d-block w-100" src="<%= main_app.url_for(item_detail.asset.variant(variant_options)) %>">
|
|
13
|
-
<% if item_detail.description.present? %>
|
|
14
|
-
<div class="carousel-caption d-none d-md-block">
|
|
15
|
-
<%= markup_helper(self).to_html(item_detail, :description) %>
|
|
16
|
-
</div>
|
|
17
|
-
<% end %>
|
|
18
|
-
</div>
|
|
19
|
-
<% end %>
|
|
20
|
-
</div>
|
|
21
|
-
<% if options[:controls] %>
|
|
22
|
-
<a class="carousel-control-prev" href="#<%= dom_id(carousel) %>" role="button" data-slide="prev">
|
|
23
|
-
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
|
24
|
-
<span class="sr-only"><%= t('.previous') %></span>
|
|
25
|
-
</a>
|
|
26
|
-
<a class="carousel-control-next" href="#<%= dom_id(carousel) %>" role="button" data-slide="next">
|
|
27
|
-
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
|
28
|
-
<span class="sr-only"><%= t('.next') %></span>
|
|
29
|
-
</a>
|
|
30
|
-
<% end %>
|
|
31
|
-
</div>
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
= bootstrap_carousel(autostart: carousel_options[:autostart], interval: (carousel_options[:interval] * 1000), id: dom_id(carousel)) do |c|
|
|
2
|
-
- carousel.item_details.each do |item_detail|
|
|
3
|
-
- c.add_item(image_source: main_app.url_for(item_detail.asset.variant(variant_options)), caption: item_detail.body)(:html)
|