r-k-b/_bc-theme-switcher.md

## _bc-theme-switcher.md

      
    Raw
  

              _bc-theme-switcher.md
            
          
    Ignore the .twig extensions, that's just for the code highlighting. These files are just html + BC-flavoured Liquid Markup.
This code is currently built to switch themes based on time. Only minor changes would allow changing themes by other factors, such as
which domain the page is being served from.
template-boilerplate

This snippet must go at the top of each Page Template. Although it must be repeated in each, it should be far less likely to change
than the information in theme-data.json.
theme-data.json

An example of configuration for two themes. There's no hard limit on how many themes can be present.
template-example

An example of a full template, using some dynamic theme settings.

  
## template-boilerplate.twig
{% assign jsonpath = "/_System/Apps/site-assets/public/theme-data.json" -%}

{module_json, json="{{ jsonpath }}"  template=""}

{% comment -%}
    BC fails to provide a predictably named key to access the json above, so we gotta iterate...
{% endcomment -%}

{% for keyval in this -%}
    {% if keyval[1]['moduleDescriptor']['parameters'] contains jsonpath -%}
        {% assign themeJson = keyval[1] -%}
    {% endif -%}
{% endfor -%}

{% assign timeNow = globals.site.dateNow | convert: "date" -%}
{% assign nextThemeSwitchover = themeJson.nextThemeSwitchoverDatetime | convert: "date" -%}

{% if timeNow <= nextThemeSwitchover -%}
    {% assign themeKey = globals.get.themeKey | default: themeJson.themeKeyOld -%}
{% else -%}
    {% assign themeKey = globals.get.themeKey | default: themeJson.themeKeyNew -%}
{% endif -%}

{% assign themedata = themeJson.themes[themeKey] -%}

## template-example.twig
<!DOCTYPE html>

{% assign jsonpath = "/_System/Apps/site-assets/public/theme-data.json" -%}

{module_json, json="{{ jsonpath }}"  template=""}

{% comment -%}
    BC fails to provide a predictably named key to access the json above, so we gotta iterate...
{% endcomment -%}

{% for keyval in this -%}
    {% if keyval[1]['moduleDescriptor']['parameters'] contains jsonpath -%}
        {% assign themeJson = keyval[1] -%}
    {% endif -%}
{% endfor -%}

{% assign timeNow = globals.site.dateNow | convert: "date" -%}
{% assign nextThemeSwitchover = themeJson.nextThemeSwitchoverDatetime | convert: "date" -%}

{% if timeNow <= nextThemeSwitchover -%}
    {% assign themeKey = globals.get.themeKey | default: themeJson.themeKeyOld -%}
{% else -%}
    {% assign themeKey = globals.get.themeKey | default: themeJson.themeKeyNew -%}
{% endif -%}

{% assign themedata = themeJson.themes[themeKey] -%}

<html xmlns="http://www.w3.org/1999/xhtml" data-template="Templates/DynamicTheme - Followon.html" data-theme-identifier="{{ themedata.fileIdentifier }}">
<head>
    <title></title>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
    {module_contentholder,name="[Technical] Head Declarations - Ubiquitous"}
    {module_contentholder,name="{{ themedata.fileIdentifier }} Common Header Elements"}
</head>
<body class="halvedbg__parent">
{module_contentholder,name="[Technical] Google Tag Manager"}

{module_contentholder,name="[Technical] Halved Background"}

<div id="wrapper" class="halvedbg__coverer">
    <div id="header">
        <div id="logo"><a href="/index.html"><span id="logo-area">Dubbo Regional Theater Convention Centre</span></a>
        </div>
        <div id="search">{module_contentholder,name="Search and Social Media {{ themedata.fileIdentifier }}"}</div>
        <div id="nav">

            {module_menu menuID="{{ themedata.mainNavMenuID }}" version="2" moduleTemplateGroup="{{ themedata.mainNavTemplateGroup }}"}

        </div>
    </div>
    <div id="banner">{module_adrotator,9714}</div>
    <div id="content">
        <div id="breadcrumbs">
            <div class="breadcrumbs">{module_breadcrumbs}</div>
            <div class="likes">
                <div class="facebook">{module_facebooklike, moduleTemplateGroup="", language="en_US", url="", layout="button_count", showFaces="false", width="5", verb="like", font="", colorScheme=""}
                </div>
                <div class="tweet">{module_twittertweet}</div>
            </div>
        </div>
        <div id="innerContent">
            <h1>{module_pagename}</h1>
            {tag_pagecontent}
        </div>
        {module_contentholder,name="Event Type Indicator Strip"}
    </div>
    <div id="content-trailer">
        <div id="sponsors">{module_contentholder,name="[Technical] {{ themedata.fileIdentifier }} Sponsor Logos"}</div>
    </div>
    <div id="base"></div>
    <div id="footer">
        <div class="seo">{module_contentholder,name="SEO Links {{ themedata.fileIdentifier }}"}</div>
        <div class="siteinfo">{module_contentholder,name="Site Information"}</div>
    </div>
</div>
<script src="/plugins/calendar/calendar.js"></script>
<script src="/plugins/calendar-list-view-clone.js"></script>
{module_contentholder,name="[Technical] Footer Scripts {{ themedata.fileIdentifier }}"}
</body>
</html>

## theme-data.json
{
  "nextThemeSwitchoverDatetime": "2016-11-27T15:00:00",
  "themeKeyOld": "2015",
  "themeKeyNew": "2017",
  "themes": {
    "2015": {
      "fileIdentifier": "2015",
      "mainNavMenuID": "1420135",
      "mainNavTemplateGroup": "2015v2",
      "sliderWebappTagParameters": "19894,a",
      "innerBannerCHolderName": "[Template] - Home Page Inner Banner"
    },
    "2017": {
      "fileIdentifier": "2017",
      "mainNavMenuID": "1420135",
      "mainNavTemplateGroup": "2015v2",
      "sliderWebappTagParameters": "19894,a",
      "innerBannerCHolderName": "[Template] - Home Page Inner Banner"
    }
  }
}
	{% assign jsonpath = "/_System/Apps/site-assets/public/theme-data.json" -%}

	{module_json, json="{{ jsonpath }}" template=""}

	{% comment -%}
	BC fails to provide a predictably named key to access the json above, so we gotta iterate...
	{% endcomment -%}

	{% for keyval in this -%}
	{% if keyval[1]['moduleDescriptor']['parameters'] contains jsonpath -%}
	{% assign themeJson = keyval[1] -%}
	{% endif -%}
	{% endfor -%}

	{% assign timeNow = globals.site.dateNow \| convert: "date" -%}
	{% assign nextThemeSwitchover = themeJson.nextThemeSwitchoverDatetime \| convert: "date" -%}

	{% if timeNow <= nextThemeSwitchover -%}
	{% assign themeKey = globals.get.themeKey \| default: themeJson.themeKeyOld -%}
	{% else -%}
	{% assign themeKey = globals.get.themeKey \| default: themeJson.themeKeyNew -%}
	{% endif -%}

	{% assign themedata = themeJson.themes[themeKey] -%}
	<!DOCTYPE html>

	{% assign jsonpath = "/_System/Apps/site-assets/public/theme-data.json" -%}

	{module_json, json="{{ jsonpath }}" template=""}

	{% comment -%}
	BC fails to provide a predictably named key to access the json above, so we gotta iterate...
	{% endcomment -%}

	{% for keyval in this -%}
	{% if keyval[1]['moduleDescriptor']['parameters'] contains jsonpath -%}
	{% assign themeJson = keyval[1] -%}
	{% endif -%}
	{% endfor -%}

	{% assign timeNow = globals.site.dateNow \| convert: "date" -%}
	{% assign nextThemeSwitchover = themeJson.nextThemeSwitchoverDatetime \| convert: "date" -%}

	{% if timeNow <= nextThemeSwitchover -%}
	{% assign themeKey = globals.get.themeKey \| default: themeJson.themeKeyOld -%}
	{% else -%}
	{% assign themeKey = globals.get.themeKey \| default: themeJson.themeKeyNew -%}
	{% endif -%}

	{% assign themedata = themeJson.themes[themeKey] -%}

	<html xmlns="http://www.w3.org/1999/xhtml" data-template="Templates/DynamicTheme - Followon.html" data-theme-identifier="{{ themedata.fileIdentifier }}">
	<head>
	<title></title>
	<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
	{module_contentholder,name="[Technical] Head Declarations - Ubiquitous"}
	{module_contentholder,name="{{ themedata.fileIdentifier }} Common Header Elements"}
	</head>
	<body class="halvedbg__parent">
	{module_contentholder,name="[Technical] Google Tag Manager"}

	{module_contentholder,name="[Technical] Halved Background"}

	<div id="wrapper" class="halvedbg__coverer">
	<div id="header">
	<div id="logo"><a href="/index.html"><span id="logo-area">Dubbo Regional Theater Convention Centre</span></a>
	</div>
	<div id="search">{module_contentholder,name="Search and Social Media {{ themedata.fileIdentifier }}"}</div>
	<div id="nav">

	{module_menu menuID="{{ themedata.mainNavMenuID }}" version="2" moduleTemplateGroup="{{ themedata.mainNavTemplateGroup }}"}

	</div>
	</div>
	<div id="banner">{module_adrotator,9714}</div>
	<div id="content">
	<div id="breadcrumbs">
	<div class="breadcrumbs">{module_breadcrumbs}</div>
	<div class="likes">
	<div class="facebook">{module_facebooklike, moduleTemplateGroup="", language="en_US", url="", layout="button_count", showFaces="false", width="5", verb="like", font="", colorScheme=""}
	</div>
	<div class="tweet">{module_twittertweet}</div>
	</div>
	</div>
	<div id="innerContent">
	<h1>{module_pagename}</h1>
	{tag_pagecontent}
	</div>
	{module_contentholder,name="Event Type Indicator Strip"}
	</div>
	<div id="content-trailer">
	<div id="sponsors">{module_contentholder,name="[Technical] {{ themedata.fileIdentifier }} Sponsor Logos"}</div>
	</div>
	<div id="base"></div>
	<div id="footer">
	<div class="seo">{module_contentholder,name="SEO Links {{ themedata.fileIdentifier }}"}</div>
	<div class="siteinfo">{module_contentholder,name="Site Information"}</div>
	</div>
	</div>
	<script src="/plugins/calendar/calendar.js"></script>
	<script src="/plugins/calendar-list-view-clone.js"></script>
	{module_contentholder,name="[Technical] Footer Scripts {{ themedata.fileIdentifier }}"}
	</body>
	</html>
	{
	"nextThemeSwitchoverDatetime": "2016-11-27T15:00:00",
	"themeKeyOld": "2015",
	"themeKeyNew": "2017",
	"themes": {
	"2015": {
	"fileIdentifier": "2015",
	"mainNavMenuID": "1420135",
	"mainNavTemplateGroup": "2015v2",
	"sliderWebappTagParameters": "19894,a",
	"innerBannerCHolderName": "[Template] - Home Page Inner Banner"
	},
	"2017": {
	"fileIdentifier": "2017",
	"mainNavMenuID": "1420135",
	"mainNavTemplateGroup": "2015v2",
	"sliderWebappTagParameters": "19894,a",
	"innerBannerCHolderName": "[Template] - Home Page Inner Banner"
	}
	}
	}