Reorganizing files

Basic/template/CasparCG.js

@@ -0,0 +1,88 @@
+/*
+*   Data sent from CasparCG Client as templateData
+*   is pushed into corresponding HTML id element
+*
+*   Usage:
+*   insert a script reference in the HTML template header.
+*   ex: <script type="text/javascript" src="CasparCG.js"></script>
+*   Make sure that the id that you refer to is the innermost tag.
+*   Everything within that tag id will be replaced by the value sent from CasparCG
+*
+*   put together by Tomas Linden
+*   modified by Øjvind Søgaard Andersen
+*
+   Structure of data sent from CasparCG:
+   <templateData>
+      <componentData id="#idCaspar#">
+         <data id="text" value="#valCaspar#" />
+      </componentData>
+      :
+      :
+      <componentData id="#idCaspar#">
+         <data id="text" value="#valCaspar#" />
+      </componentData>
+   </templateData>
+*/
+// Global variable for data from CasparCG
+var dataCaspar = {};
+
+// Replace characters that could become a problem if left as is
+function escapeHtml(unsafe) {
+  return unsafe.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+}
+
+// Parse templateData into an XML object
+function parseCaspar(str) {
+  var xmlDoc;
+  if (window.DOMParser) {
+    parser = new DOMParser();
+    xmlDoc = parser.parseFromString(str, "text/xml");
+  }
+  dataCaspar = XML2JSON(xmlDoc.documentElement.childNodes);
+}
+
+
+// Make the XML templateData message into a more simple key:value object
+function XML2JSON(node) {
+  var data = {}; // resulting object
+  for (k = 0; k < node.length; k++) {
+    var idCaspar = node[k].getAttribute("id");
+    var valCaspar = node[k].childNodes[0].getAttribute("value");
+    if (idCaspar != undefined && valCaspar != undefined) {
+      data[idCaspar] = valCaspar;
+    };
+  }
+  return data;
+}
+
+// Main function to insert data
+function dataInsert(dataCaspar) {
+  for (var idCaspar in dataCaspar) {
+    var idTemplate = document.getElementById(idCaspar);
+    if (idTemplate != undefined) {
+      idTemplate.innerHTML = escapeHtml(dataCaspar[idCaspar]);
+    }
+  }
+}
+
+// Call for a update of data from CasparCG client
+function update(str) {
+  parseCaspar(str); // Parse templateData into an XML object
+  dataInsert(dataCaspar); // Insert data
+}
+
+// insert data from CasparCg client when activated
+function play(str) {
+  parseCaspar(str); // Parse templateData into an XML object
+  dataInsert(dataCaspar); // Insert data
+}
+
+// Call for a next from CasparCG client
+function next() {
+  gwd.actions.timeline.play('document.body');
+}
+
+// Call for a stop from CasparCG client
+function stop() {
+  gwd.actions.timeline.gotoAndPlay('document.body', 'stop');
+}

Basic/template/gwd-events-support.1.0.js

@@ -0,0 +1 @@
+var gwd=gwd||{};gwd.actions=gwd.actions||{};gwd.actions.events=gwd.actions.events||{};gwd.actions.events.getElementById=function(id){var element=document.getElementById(id);if(!element){var pageDeck=document.querySelector("gwd-pagedeck")||document.querySelector("[is=gwd-pagedeck]");if(pageDeck){if(typeof pageDeck.getElementById==="function"){element=pageDeck.getElementById(id)}}}if(!element){switch(id){case"document.body":element=document.body;break;case"document":element=document;break;case"window":element=window;break;default:break}}return element};gwd.actions.events.addHandler=function(eventTarget,eventName,eventHandler,useCapture){var targetElement=gwd.actions.events.getElementById(eventTarget);if(targetElement){targetElement.addEventListener(eventName,eventHandler,useCapture)}};gwd.actions.events.removeHandler=function(eventTarget,eventName,eventHandler,useCapture){var targetElement=gwd.actions.events.getElementById(eventTarget);if(targetElement){targetElement.removeEventListener(eventName,eventHandler,useCapture)}};gwd.actions.events.setInlineStyle=function(id,styles){var element=gwd.actions.events.getElementById(id);if(!element||!styles){return}var transitionProperty=element.style.transition!==undefined?"transition":"-webkit-transition";var prevTransition=element.style[transitionProperty];var splitStyles=styles.split(/\s*;\s*/);var nameValue;splitStyles.forEach(function(splitStyle){if(splitStyle){var regex=new RegExp("[:](?![/]{2})");nameValue=splitStyle.split(regex);nameValue[1]=nameValue[1]?nameValue[1].trim():null;if(!(nameValue[0]&&nameValue[1])){return}element.style.setProperty(nameValue[0],nameValue[1])}});function restoreTransition(event){var el=event.target;el.style.transition=prevTransition;el.removeEventListener(event.type,restoreTransition,false)}element.addEventListener("transitionend",restoreTransition,false);element.addEventListener("webkitTransitionEnd",restoreTransition,false)};gwd.actions.timeline=gwd.actions.timeline||{};gwd.actions.timeline.dispatchTimedEvent=function(event){var customEventTarget=event.target;if(customEventTarget){var customEventName=customEventTarget.getAttribute("data-event-name");if(customEventName){event.stopPropagation();var event=document.createEvent("CustomEvent");event.initCustomEvent(customEventName,true,true,null);customEventTarget.dispatchEvent(event)}}};gwd.actions.timeline.captureAnimationEnd=function(element){if(!element){return}var animationEndEvents=["animationend","webkitAnimationEnd"];for(var i=0;i<animationEndEvents.length;i++){element.addEventListener(animationEndEvents[i],gwd.actions.timeline.dispatchTimedEvent,true)}};gwd.actions.timeline.releaseAnimationEnd=function(element){if(!element){return}var animationEndEvents=["animationend","webkitAnimationEnd"];for(var i=0;i<animationEndEvents.length;i++){element.removeEventListener(animationEndEvents[i],gwd.actions.timeline.dispatchTimedEvent,true)}};gwd.actions.timeline.pauseAnimationClassName="gwd-pause-animation";gwd.actions.timeline.CURRENT_LABEL_ANIMATION="data-gwd-current-label";gwd.actions.timeline.reflow=function(el){el.offsetWidth=el.offsetWidth};gwd.actions.timeline.pause=function(id){var el=gwd.actions.events.getElementById(id);el&&el.classList&&el.classList.add(gwd.actions.timeline.pauseAnimationClassName)};gwd.actions.timeline.play=function(id){var el=gwd.actions.events.getElementById(id);el&&el.classList&&el.classList.remove(gwd.actions.timeline.pauseAnimationClassName)};gwd.actions.timeline.togglePlay=function(id){var el=gwd.actions.events.getElementById(id);el&&el.classList&&el.classList.toggle(gwd.actions.timeline.pauseAnimationClassName)};gwd.actions.timeline.gotoAndPlay=function(id,animClass){var el=gwd.actions.events.getElementById(id);if(!(el&&el.classList&&id&&animClass)){return false}var currentLabelAnimClass=el.getAttribute(gwd.actions.timeline.CURRENT_LABEL_ANIMATION);if(currentLabelAnimClass){el.classList.remove(currentLabelAnimClass);el.removeAttribute(gwd.actions.timeline.CURRENT_LABEL_ANIMATION)}gwd.actions.timeline.play(id);if(currentLabelAnimClass==animClass){gwd.actions.timeline.reflow(el)}el.classList.add(animClass);el.setAttribute(gwd.actions.timeline.CURRENT_LABEL_ANIMATION,animClass);return true};gwd.actions.timeline.gotoAndPause=function(id,animClass){var el=gwd.actions.events.getElementById(id);if(!(el&&el.classList)){return false}if(gwd.actions.timeline.gotoAndPlay(id,animClass)){var timeoutId=window.setTimeout(function(){el.classList.add(gwd.actions.timeline.pauseAnimationClassName)},40)}return!!timeoutId};gwd.actions.timeline.gotoAndPlayNTimes=function(id,animClass,count,eventName){var el=gwd.actions.events.getElementById(id);el.gwdGotoCounters=el.gwdGotoCounters||{};var counters=el.gwdGotoCounters;var counterName=eventName+"_"+animClass+"_counter";if(typeof counters[counterName]=="undefined"){counters[counterName]=0}if(counters[counterName]<count){gwd.actions.timeline.gotoAndPlay(id,animClass)}counters[counterName]++}