video cms plugin
This commit is contained in:
parent
66d1e4e046
commit
80e08c1b40
8 changed files with 155 additions and 32 deletions
|
@ -5,7 +5,8 @@ from .models import (
|
|||
UngelichContactUsSection, UngelichTextSection, Service, ServiceItem,
|
||||
About, AboutItem, SectionWithImage, UngleichServiceItem, UngleichHeader,
|
||||
UngleichHeaderItem, UngleichProductItem, UngleichProduct, UngleichCustomer,
|
||||
UngleichCustomerItem, UngleichHTMLOnly, UngleichSimpleHeader
|
||||
UngleichCustomerItem, UngleichHTMLOnly, UngleichSimpleHeader,
|
||||
UngleichHeaderItemWithVideo
|
||||
)
|
||||
|
||||
|
||||
|
@ -200,7 +201,10 @@ class UngleichHeaderWithTextAndImageSliderPlugin(CMSPluginBase):
|
|||
render_template = "ungleich_page/ungleich/header_with_slider.html"
|
||||
cache = False
|
||||
allow_children = True
|
||||
child_classes = ['UngleichHeaderItemPlugin']
|
||||
child_classes = [
|
||||
'UngleichHeaderItemPlugin',
|
||||
'UngleichHeaderItemWithVideoPlugin',
|
||||
]
|
||||
|
||||
def render(self, context, instance, placeholder):
|
||||
context['instance'] = instance
|
||||
|
@ -224,6 +228,23 @@ class UngleichHeaderItemPlugin(CMSPluginBase):
|
|||
return context
|
||||
|
||||
|
||||
@plugin_pool.register_plugin
|
||||
class UngleichHeaderItemWithVideoPlugin(CMSPluginBase):
|
||||
name = "ungleich Header Item With Video Plugin"
|
||||
model = UngleichHeaderItemWithVideo
|
||||
render_template = "ungleich_page/ungleich/_header_video_item.html"
|
||||
cache = False
|
||||
require_parent = True
|
||||
parent_classes = ['UngleichHeaderWithTextAndImageSliderPlugin']
|
||||
|
||||
def render(self, context, instance, placeholder):
|
||||
context = super(UngleichHeaderItemWithVideoPlugin, self).render(
|
||||
context, instance, placeholder
|
||||
)
|
||||
context['instance'] = instance
|
||||
return context
|
||||
|
||||
|
||||
@plugin_pool.register_plugin
|
||||
class UngleichProductsPlugin(CMSPluginBase):
|
||||
name = "ungleich Products Plugin"
|
||||
|
|
39
ungleich_page/migrations/0016_auto_20171219_1856.py
Normal file
39
ungleich_page/migrations/0016_auto_20171219_1856.py
Normal file
|
@ -0,0 +1,39 @@
|
|||
# -*- coding: utf-8 -*-
|
||||
# Generated by Django 1.9.4 on 2017-12-19 16:11
|
||||
from __future__ import unicode_literals
|
||||
|
||||
from django.db import migrations, models
|
||||
import django.db.models.deletion
|
||||
import filer.fields.file
|
||||
import filer.fields.image
|
||||
|
||||
|
||||
class Migration(migrations.Migration):
|
||||
|
||||
dependencies = [
|
||||
('ungleich_page', '0015_ungleichsimpleheader'),
|
||||
('cms', '0014_auto_20160404_1908'),
|
||||
('filer', '0005_auto_20171219_1856'),
|
||||
]
|
||||
|
||||
operations = [
|
||||
migrations.CreateModel(
|
||||
name='UngleichHeaderItemWithVideo',
|
||||
fields=[
|
||||
('cmsplugin_ptr', models.OneToOneField(auto_created=True, on_delete=django.db.models.deletion.CASCADE,
|
||||
parent_link=True, primary_key=True, serialize=False, to='cms.CMSPlugin')),
|
||||
('description', models.TextField(blank=True, null=True)),
|
||||
('image', filer.fields.image.FilerImageField(blank=True, null=True,
|
||||
on_delete=django.db.models.deletion.SET_NULL, related_name='ungleich_header_item_poster', to='filer.Image')),
|
||||
('btn_link', models.URLField(blank=True, null=True)),
|
||||
('btn_text', models.CharField(blank=True, max_length=50, null=True)),
|
||||
('heading', models.CharField(blank=True, max_length=100, null=True)),
|
||||
('video', filer.fields.file.FilerFileField(blank=True, null=True,
|
||||
on_delete=django.db.models.deletion.SET_NULL, related_name='ungleich_header_item_video', to='filer.File')),
|
||||
],
|
||||
options={
|
||||
'abstract': False,
|
||||
},
|
||||
bases=('cms.cmsplugin',),
|
||||
),
|
||||
]
|
|
@ -1,7 +1,7 @@
|
|||
from cms.models.pluginmodel import CMSPlugin
|
||||
from django.db import models
|
||||
from djangocms_text_ckeditor.fields import HTMLField
|
||||
from filer.fields.image import FilerImageField
|
||||
from filer.fields.image import FilerImageField, FilerFileField
|
||||
|
||||
|
||||
class UngelichPicture(CMSPlugin):
|
||||
|
@ -134,6 +134,39 @@ class UngleichHeaderItem(CMSPlugin):
|
|||
description = HTMLField()
|
||||
|
||||
|
||||
class UngleichHeaderItemWithVideo(CMSPlugin):
|
||||
image = FilerImageField(
|
||||
null=True,
|
||||
blank=True,
|
||||
related_name="ungleich_header_item_poster",
|
||||
on_delete=models.SET_NULL,
|
||||
help_text='The background image or poster image for video.'
|
||||
)
|
||||
video = FilerFileField(
|
||||
null=True,
|
||||
blank=True,
|
||||
related_name="ungleich_header_item_video",
|
||||
on_delete=models.SET_NULL,
|
||||
help_text='Leavig this blank will make the image as the background.'
|
||||
)
|
||||
heading = models.CharField(
|
||||
blank=True, null=True, max_length=100,
|
||||
help_text='An optional title for this slide.',
|
||||
)
|
||||
description = models.TextField(
|
||||
blank=True, null=True,
|
||||
help_text='An optional description for this slide.'
|
||||
)
|
||||
btn_link = models.URLField(
|
||||
blank=True, null=True,
|
||||
help_text='If this field is left empty, no button would be displayed.'
|
||||
)
|
||||
btn_text = models.CharField(
|
||||
blank=True, null=True, max_length=50,
|
||||
help_text='Text for the button, if a link is provided.'
|
||||
)
|
||||
|
||||
|
||||
class UngleichProductItem(ServiceItem):
|
||||
url = models.URLField(max_length=300, default="", blank=True)
|
||||
|
||||
|
|
|
@ -202,10 +202,11 @@
|
|||
}
|
||||
|
||||
.header_slider .intro-cap {
|
||||
margin: 0;
|
||||
text-align: right;
|
||||
line-height: 1.1;
|
||||
font-size: 23px;
|
||||
margin-bottom: 12px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.header_slider .btn-trans {
|
||||
|
@ -216,9 +217,7 @@
|
|||
|
||||
@media (min-width: 768px) {
|
||||
.header_slider .intro-cap {
|
||||
font-size: 4em;
|
||||
font-weight: 600;
|
||||
margin-bottom: 20px;
|
||||
font-size: 2.5em;
|
||||
}
|
||||
.header_slider .carousel-control {
|
||||
width: 50px;
|
||||
|
@ -237,6 +236,12 @@
|
|||
overflow: auto;
|
||||
padding: 75px 50px;
|
||||
}
|
||||
.header_slider .btn-trans {
|
||||
padding: 8px 15px;
|
||||
min-width: 175px;
|
||||
letter-spacing: 1px;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
|
@ -250,8 +255,8 @@
|
|||
font-size: 1.55em;
|
||||
text-align: right;
|
||||
line-height: 1.4;
|
||||
margin-bottom: 20px;
|
||||
padding: 5px 0;
|
||||
margin-bottom: 0;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
{% load static i18n %}
|
||||
|
||||
<header class="header_slider">
|
||||
<div id="carousel-header-ungleich" class="carousel slide" data-interval="8000">
|
||||
<div id="carousel-header-ungleich" class="carousel slide" data-ride="carousel" data-interval="8000">
|
||||
<!-- Indicators -->
|
||||
<ol class="carousel-indicators">
|
||||
<li data-target="#carousel-header-ungleich" data-slide-to="0" class="active"></li>
|
||||
|
|
|
@ -1,14 +1,8 @@
|
|||
{% if instance.image %}
|
||||
<div class="bg_img" style="background-image:url({{ instance.image.url }})"></div>
|
||||
{% endif %}
|
||||
<div class="container">
|
||||
<div>
|
||||
{% if instance.image %}
|
||||
<img src="{{ instance.image.url }}" alt=""
|
||||
class="logo-image" img-responsive="" width="300"/>
|
||||
<div class="header-vh"></div>
|
||||
{% endif %}
|
||||
<div>
|
||||
<span class="intro-cap-sans-transform">
|
||||
{{ instance.description }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="intro-cap-sans-transform">
|
||||
{{ instance.description }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -0,0 +1,20 @@
|
|||
{% if instance.video %}
|
||||
<div class="bg_vid bg_vid_back">
|
||||
<video autoplay muted loop {% if instance.image %}poster="{{ instance.image.url }}"{% endif %}>
|
||||
<source type="video/mp4" src="{{ instance.video.url }}">
|
||||
</video>
|
||||
</div>
|
||||
{% elif instance.image %}
|
||||
<div class="bg_img" style="background-image:url({{ instance.image.url }})"></div>
|
||||
{% endif %}
|
||||
<div class="container">
|
||||
{% if instance.heading %}
|
||||
<div class="intro-cap">{{ instance.heading }}</div>
|
||||
{% endif %}
|
||||
{% if instance.description %}
|
||||
<p class="intro_lead">{{ instance.description }}</p>
|
||||
{% endif %}
|
||||
{% if instance.btn_link %}
|
||||
<a class="btn btn-trans" href="{{ instance.btn_link }}">{{ instance.btn_text|default:"Learn More" }}</a>
|
||||
{% endif %}
|
||||
</div>
|
|
@ -2,20 +2,31 @@
|
|||
<header class="header_slider" style="background-image: url({{ instance.background_image.url }})">
|
||||
<div id="carousel-header-ungleich" class="carousel slide" data-ride="carousel" data-interval="{{ instance.carousel_data_interval}}">
|
||||
<!-- Indicators -->
|
||||
{% if instance.child_plugin_instances|length > 1 %}
|
||||
<ol class="carousel-indicators">
|
||||
{% for plugin in instance.child_plugin_instances %}
|
||||
<li data-target="#carousel-header-ungleich" data-slide-to="{{forloop.counter0}}" {% if forloop.counter0 == 0 %}class="active" {% endif %}></li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
{% endif %}
|
||||
{% if instance.child_plugin_instances|length > 1 %}
|
||||
<ol class="carousel-indicators">
|
||||
{% for plugin in instance.child_plugin_instances %}
|
||||
<li data-target="#carousel-header-ungleich" data-slide-to="{{forloop.counter0}}" {% if forloop.counter0 == 0 %}class="active"{% endif %}></li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
{% endif %}
|
||||
<!-- Wrapper for slides -->
|
||||
<div class="carousel-inner" role="listbox">
|
||||
{% for plugin in instance.child_plugin_instances %}
|
||||
{% for plugin in instance.child_plugin_instances %}
|
||||
<div class="item {% if forloop.counter0 == 0 %}active{% endif %}">
|
||||
{% render_plugin plugin %}
|
||||
{% render_plugin plugin %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<!-- Control Arrows -->
|
||||
{% if instance.child_plugin_instances|length > 1 %}
|
||||
<a class="left carousel-control" href="#carousel-header-ungleich" role="button" data-slide="prev">
|
||||
<span class="fa fa-angle-left" aria-hidden="true"></span>
|
||||
<span class="sr-only">Previous</span>
|
||||
</a>
|
||||
<a class="right carousel-control" href="#carousel-header-ungleich" role="button" data-slide="next">
|
||||
<span class="fa fa-angle-right" aria-hidden="true"></span>
|
||||
<span class="sr-only">Next</span>
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
Loading…
Reference in a new issue