regenerate: false
{% capture cache %}
{% comment %}
# ----------------------------------------------------------------------------- # ~/assets/data/banner.html # Liquid procedure to generate HTML (data) for all BANNER configured for # (fragmented) AJAX load # # Product/Info: # https://jekyll-one.com # # Copyright (C) 2019 Juergen Adams # # J1 Template is licensed under the MIT License. # See: https://github.com/jekyll-one/j1_template_mde/blob/master/LICENSE # # ----------------------------------------------------------------------------- # Test data: # {{ variable | debug }} # # -----------------------------------------------------------------------------
{% endcomment %}
{% comment %} Liquid procedures ——————————————————————————– {% endcomment %} {% capture select_color %}themes/{{site.template.name}}/procedures/global/select_color.proc{% endcapture %} {% capture select_icon_size %}themes/{{site.template.name}}/procedures/global/select_icon_size.proc{% endcapture %} {% capture create_bs_button %}themes/{{site.template.name}}/procedures/global/create_bs_button.proc{% endcapture %} {% capture news_box %}themes/{{site.template.name}}/modules/footers/boxes/news_box.proc{% endcapture %}
{% comment %} Liquid var initialization ——————————————————————————– {% endcomment %} {% assign banner_config = site.data.modules.j1_banner.banners %} {% capture banner_config_file %}~/_data/modules/j1_banner.yml{% endcapture %}
{% comment %} Main ——————————————————————————– {% endcomment %} {% for items in banner_config %}
{% for banners in items %} {% for banner in banners %} {% for item in banner %} {% assign key = item[0] %} {% assign value = item[1] %} {% if key == 'id' %} {% assign id = value %} {% endif %} {% if key == 'enabled' %} {% assign enabled = value %} {% endif %} {% if key == 'type' %} {% assign type = value %} {% endif %} {% if key == 'icon_family' %} {% assign icon_family = value | downcase %} {% endif %} {% if key == 'style' %} {% assign style = value %} {% endif %} {% if key == 'raised' %} {% assign raised = value %} {% endif %} {% if key == 'lane_span' %} {% assign lane_span = value %} {% endif %} {% if key == 'buttons' %} {% assign buttons = value %} {% endif %} {% if key == 'boxes' %} {% assign boxes = value %} {% endif %} {% endfor %} {% endfor %} {% if raised %} {% capture box_raised %}raised-z{{raised}}{% endcapture %} {% else %} {% assign box_raised = 'raised-z3' %} {% endif %} {% if icon_family == 'fontawesome' %} {% assign icon_family = 'fa' %} {% elsif icon_family == 'mdi'%} {% assign icon_family = 'mdi' %} {% elsif icon_family == 'zmdi'%} {% assign icon_family = 'zmdi' %} {% endif %} {% include {{select_icon_size}} family=icon_family size=icon_size %} {% assign icon_size = size %} {% if lane_span == 'fixed' %} {% assign container_class = 'container' %} {% elsif lane_span == 'fluid' %} {% assign container_class = 'container-fluid' %} {% else %} {% assign container_class = 'container' %} {% endif %} <!-- BANNER {{id}} --> <!-- +++++++++++++++++++++++++ --> {% if enabled %} <div id="{{id}}"> {% case type %} {% comment %} Collect DIVIDER banner -------------------------------------------------------------------------- {% endcomment %} {% when 'divider_banner' %} <div class="row banner-divider"></div> {% comment %} Collect TEASER banner -------------------------------------------------------------------------- {% endcomment %} {% when 'teaser_banner' %} <div class="banner-teaser {{id}}-background"> <div class="{{container_class}} j1-banner-block"> {% assign box_items = boxes | size %} {% for box in boxes %} {% for items in box %} {% for item in items[1] %} {% assign key = item[0] %} {% assign value = item[1] %} {% if key == 'enabled' %} {% assign box_enabled = value %} {% endif %} {% if key == 'width' %} {% assign box_width = value %} {% endif %} {% if key == 'type' %} {% assign box_type = value %} {% endif %} {% if key == 'icon' %} {% assign icon = value %} {% endif %} {% if key == 'icon_size' %} {% assign icon_size = value %} {% endif %} {% if key == 'icon_color' %} {% assign icon_color = value %} {% endif %} {% if key == 'image_path' %} {% assign box_image_path = value %} {% endif %} {% if key == 'animate' %} {% assign box_animate = value %} {% endif %} {% if key == 'title' %} {% assign box_title = value | strip_newlines%} {% endif %} {% if key == 'description' %} {% assign box_description = value | strip_newlines%} {% endif %} {% if key == 'tagline' %} {% assign box_tagline = value | strip_newlines%} {% endif %} {% if key == 'text' %} {% assign box_text = value | strip_newlines %} {% endif %} {% if key == 'buttons' %} {% assign box_buttons = value %} {% endif %} {% endfor %} {% if box_enabled == false %} {% assign box_items = box_items | minus:1 %} {% endif %} {% endfor %} {% if box_icon_color %} {% include {{select_color}} color=box_icon_color fallback="#fff" %} {% assign box_icon_color = color %} {% capture box_icon_color %}style="color:{{box_icon_color}}" %}{% endcapture %} {% else %} {% assign box_icon_color = '' %} {% endif %} {% include {{select_icon_size}} family=icon_family size=icon_size %} {% assign icon_size = size %} {% if box_width %} {% assign box_enabled = true %} {% assign box_width_md = box_width %} {% else %} {% assign box_width_md = 12 | divided_by: box_items %} {% endif %} {% if box_animate %} {% assign box_animate = box_animate %} {% else %} {% assign box_animate = '' %} {% endif %} {% assign patreon_enabled = true %} {% assign patreon_home = 'https://www.patreon.com' %} {% assign pledge_url = 'join' %} {% assign vanity = 'jekyll_one' %} {% assign pledge_button_text = 'Become a Patron' %} {% capture payment_url %}{{patreon_home}}/{{pledge_url}}/{{vanity}}{% endcapture %} {% if box_type == 'text' and box_enabled %} {% if box_animate %} {% capture animate %}animated {{box_animate}}{% endcapture %} {% endif %} <div class="row"> <div class="col-md-{{box_width_md}} col-md-offset-1 col-sm-{{box_width_md}} col-sm-offset-1 col-xs-{{box_width_md}} col-xs-offset-1 {{animate}}"> <h3 class="title">{{box_title}}</h3> <p class="description">{{box_description}}</p> <p class="tagline mt-4">{{box_tagline}}</p> <div class="row btn-row mt-4"> <div class="col-md-{{box_width_md}} col-md-offset-1 col-sm-{{box_width_md}} col-sm-offset-1 col-xs-{{box_width_md | plus:2}}"> {% for button_hash in box_buttons %} {% include {{create_bs_button}} button_data=button_hash button_type="link" %} {{bs_button_html}} {% endfor %} </div> </div> </div> </div> {% endif %} {% endfor %} {% comment %} END boxes ---------------------------------------------------------------------- {% endcomment %} </div> </div> {% comment %} Reset element variables -------------------------------------------------------------------------- {% endcomment %} {% assign box_enabled = nil %} {% assign box_width = nil %} {% assign box_type = nil %} {% assign box_icon = nil %} {% assign box_icon_color = nil %} {% assign box_icon_size = nil %} {% assign box_image_path = nil %} {% assign box_animate = nil %} {% assign box_title = nil %} {% assign box_tagline = nil %} {% assign box_text = nil %} {% assign box_buttons = nil %} {% assign box_width_md = nil %} {% comment %} END TEASER banner -------------------------------------------------------------------------- {% endcomment %} {% comment %} Collect IMAGE banner -------------------------------------------------------------------------- {% endcomment %} {% when 'image_banner' %} {% for box in boxes %} {% for items in box %} {% for item in items[1] %} {% assign key = item[0] %} {% assign value = item[1] %} {% if key == 'enabled' %} {% assign enabled = value %} {% endif %} {% if key == 'gridify' %} {% assign gridify = value %} {% endif %} {% if key == 'gridifier' %} {% assign gridifier = value %} {% endif %} {% if key == 'darken' %} {% assign darken = value %} {% endif %} {% if key == 'size_y' %} {% assign size_y = value %} {% endif %} {% if key == 'background_image' %} {% assign background_image = value %} {% endif %} {% endfor %} {% endfor %} {% if enabled %} {% capture darken %}0.{{darken}}{% endcapture %} {% comment %} Set STYLE tags -------------------------------------------------------------------- {% endcomment %} $('head').append( "<style> .{{id}}-image{background:url("{{background_image}}"); min-height: {{size_y}}px; background-position: center; background-repeat: no-repeat; background-size: cover; } /* .{{id}}-image:before{top:0;left:0;width:100%;height:100%;content:" ";position:absolute;{% if gridify == true %}background: url("{{gridifier}}") repeat;{% endif %}} */ /* .{{id}}-image:after{top:0;left:0;width:100%;height:100%;content:" ";position:absolute;background:rgba(0,0,0,{{darken}})} */ </style>" ); <div class="panel-fluid"> <div class="row no-gutters {{id}}-image"></div> </div> {% endif %} {% endfor %} {% comment %} END boxes ------------------------------------------------------------------------ {% endcomment %} {% comment %} Reset element variables ------------------------------------------------------------------------ {% endcomment %} {% assign box_enabled = nil %} {% assign box_width = nil %} {% assign box_type = nil %} {% assign box_icon = nil %} {% assign box_icon_color = nil %} {% assign box_icon_size = nil %} {% assign box_image_path = nil %} {% assign box_animate = nil %} {% assign box_title = nil %} {% assign box_tagline = nil %} {% assign box_text = nil %} {% assign box_buttons = nil %} {% assign box_width_md = nil %} {% assign box_cite = nil %} {% assign box_gridifye = nil %} {% assign box_darken = nil %} {% assign box_background_size = nil %} {% assign box_background_image = nil %} {% comment %} END IMAGE banner ------------------------------------------------------------------------ {% endcomment %} {% comment %} Collect PARALLAX banner -------------------------------------------------------------------------- {% endcomment %} {% when 'parallax_banner' %} {% for box in boxes %} {% for items in box %} {% for item in items[1] %} {% assign key = item[0] %} {% assign value = item[1] %} {% if key == 'enabled' %} {% assign box_enabled = value %} {% endif %} {% if key == 'type' %} {% assign box_type = value %} {% endif %} {% if key == 'cite_text' %} {% assign box_text = value | strip_newlines %} {% endif %} {% if key == 'cite' %} {% assign box_cite = value | strip_newlines %} {% endif %} {% if key == 'text_color' %} {% assign box_text_color = value %} {% endif %} {% if key == 'cite_color' %} {% assign box_cite_color = value %} {% endif %} {% if key == 'gridify' %} {% assign box_gridify = value %} {% endif %} {% if key == 'gridifier' %} {% assign box_gridifier = value %} {% endif %} {% if key == 'darken' %} {% assign box_darken = value %} {% endif %} {% if key == 'size_y' %} {% assign box_background_size = value %} {% endif %} {% if key == 'background_image' %} {% assign box_background_image = value %} {% endif %} {% endfor %} {% endfor %} {% if box_type == 'quote' and box_enabled %} {% comment %} Set banner DEFAULTS -------------------------------------------------------------------- {% endcomment %} {% assign parallax_defaults = site.data.modules.j1_parallax.parallax_quote %} {% assign background_image = parallax_defaults.background %} {% assign gridify = parallax_defaults.gridify %} {% assign gridifier = parallax_defaults.gridifier %} {% assign text_color = parallax_defaults.text_color %} {% assign cite_color = parallax_defaults.cite_color %} {% assign darken = parallax_defaults.darken %} {% comment %} Set banner VALUES -------------------------------------------------------------------- {% endcomment %} {% if box_gridify %} {% assign gridify = box_gridify %} {% endif %} {% if box_gridifier %} {% assign gridifier = box_gridifier %} {% endif %} {% if box_darken %} {% assign darken = box_darken %} {% endif %} {% if box_text_color %} {% assign text_color = box_text_color %} {% endif %} {% if box_cite_color %} {% assign cite_color = box_cite_color %} {% endif %} {% if box_background_size %} {% assign size_y = box_background_size %} {% endif %} {% if box_background_image %} {% assign background_image = box_background_image %} {% endif %} {% capture darken %}0.{{darken}}{% endcapture %} {% include {{select_color}} color=text_color fallback="#FAFAFA" %} {% assign text_color = color %} {% include {{select_color}} color=cite_color fallback="#FAFAFA" %} {% assign cite_color = color %} {% comment %} Set individual STYLE tags ----------------------------------------------------- {% endcomment %} $('head').append( "<style> .{{id}}-parallaxBg{background:url("{{background_image}}"); min-height: {{size_y}}px; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } .{{id}}-parallax-quote{color:#fff;padding:100px 0;position:relative;text-align:center} .{{id}}-parallax-quote:before{top:0;left:0;width:100%;height:100%;content:" ";position:absolute;{% if gridify == true %}background: url("{{gridifier}}") repeat;{% endif %}} .{{id}}-parallax-quote:after{top:0;left:0;width:100%;height:100%;content:" ";position:absolute;background:rgba(0,0,0,{{darken}})} .{{id}}-parallax-quote-in{z-index: 2;position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; padding: 20px; text-align: center; } .{{id}}-parallax-quote-in p{color:{{text_color}};font-size:200%;text-transform:uppercase;} {% if box_text %} .{{id}}-parallax-quote-in p:after,.{{id}}-parallax-quote-in p:before{content:' " ';} {% endif %} .{{id}}-parallax-quote-in small{color:{{cite_color}};font-size:100%;font-weight:600;} .{{id}}-parallax-quote:after{background: rgba(0,0,0,{{darken}})} </style>" ); <!-- div class="{{container_class}} j1-banner-block" --> <div class="panel-fluid"> <div class="row no-gutters {{id}}-parallax-quote {{id}}-parallaxBg"> <div class="col-md-12 col-xs-12 {{id}}-parallax-quote-in"> {% if box_text %} <p>{{box_text}}</p>{% endif %} {% if box_text %}<i>{{box_cite}}</i>{% endif %} </div> </div> </div> {% endif %} {% endfor %} {% comment %} END boxes ------------------------------------------------------------------------ {% endcomment %} {% comment %} Reset element variables ------------------------------------------------------------------------ {% endcomment %} {% assign box_enabled = nil %} {% assign box_width = nil %} {% assign box_type = nil %} {% assign box_icon = nil %} {% assign box_icon_color = nil %} {% assign box_icon_size = nil %} {% assign box_image_path = nil %} {% assign box_animate = nil %} {% assign box_title = nil %} {% assign box_tagline = nil %} {% assign box_text = nil %} {% assign box_buttons = nil %} {% assign box_width_md = nil %} {% assign box_cite = nil %} {% assign box_gridifye = nil %} {% assign box_darken = nil %} {% assign box_background_size = nil %} {% assign box_background_image = nil %} {% comment %} END PARALLAX banner ------------------------------------------------------------------------ {% endcomment %} {% comment %} Collect EXEPTION banner: given type NOT found ------------------------------------------------------------------------ {% endcomment %} {% else %} <div class="row"> <div class="col-md-6 col-md-offset-3"> <div class="box raised-z10 mt-5"> <div class="content content-danger"> <h4 class="notoc"> <i class="zmdi zmdi-alert-triangle zmdi-hc-3x pl-3"></i> Banner <i>{{type}}</i> not found </h4> <h4 class="notoc box-title">Check your configuration</h4> <div class="box-description"> Don't worry about this. May you've a typo in the banner's configuration. Check the banner config file for the unknown type. A line contains something wrong like: <div class="mt-2 mb-2"> <b>id: {{id}}</b><br /> <b>type: {{type}}</b> </div> Have a look at: <div class="mb-5"> <h5 class="notoc">{{banner_config_file}}</h5> </div> </div> </div> </div> </div> {% comment %} END EXEPTION banner ------------------------------------------------------------------------ {% endcomment %} {% endcase %} </div> <!-- End banner {{ id }} --> {% endif %} {% comment %} endif enabled {% endcomment %} {% endfor %}
{% endfor %}
{% endcapture %}
{{ cache | strip_empty_lines }} {% assign cache = nil %}