From 82506638f804deadecea823437a69cc5bdde07c1 Mon Sep 17 00:00:00 2001
From: Jeff Parsons <jeff@pcjs.org>
Date: Tue, 3 Jan 2017 15:39:14 -0800
Subject: [PATCH] Made sticky machine support adjustable through CSS instead of
 hard-coded

---
 modules/shared/lib/sticky.js            | 14 ++++----------
 modules/shared/templates/components.css | 14 +++++++++++++-
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/modules/shared/lib/sticky.js b/modules/shared/lib/sticky.js
index 270523448..baf393d2b 100644
--- a/modules/shared/lib/sticky.js
+++ b/modules/shared/lib/sticky.js
@@ -53,18 +53,12 @@ function addStickyMachine(idMachine)
                 if (topMachine < 0) {
                     topMachine = findTop(machine);
                 }
+                machine.className = machine.className.replace(/pcjs-machine-(floating|sticky) /g, '');
                 if (window.pageYOffset <= topMachine) {
-                    machine.style.position = 'relative';
-                    machine.style.zIndex = 'auto';
-                    machine.style.backgroundColor = '';
-                    machine.style.paddingRight = 0;
+                    machine.className = 'pcjs-machine-floating ' + machine.className;
                     if (machineSibling) machineSibling.style.paddingTop = 0;
                 } else {
-                    machine.style.position = 'fixed';
-                    machine.style.zIndex = 1;
-                    machine.style.backgroundColor = '#404040';
-                    machine.style.paddingRight = '16px';
-                    machine.style.top = 0;
+                    machine.className = 'pcjs-machine-sticky ' + machine.className;
                     if (machineSibling) machineSibling.style.paddingTop = machine.offsetHeight + 'px';
                 }
                 if (prevOnScroll) prevOnScroll();
@@ -83,7 +77,7 @@ function addStickyMachine(idMachine)
  */
 function commandMachine(idMachine, typeComponent, sCommand, sValue)
 {
-
+    console.log("commandMachine('" + idMachine + "','" + typeComponent + "','" + sCommand + "','" + sValue + "')");
 }
 
 /**
diff --git a/modules/shared/templates/components.css b/modules/shared/templates/components.css
index 409d32848..ec888e4c9 100644
--- a/modules/shared/templates/components.css
+++ b/modules/shared/templates/components.css
@@ -228,7 +228,19 @@
 .pcjs-copyright a {
     text-decoration: none;
 }
-
+.pcjs-machine-floating {
+    position: relative;
+    z-index: auto;
+    background-color: transparent;
+    padding-right: 0;
+}
+.pcjs-machine-sticky {
+    position: fixed !important;
+    z-index: 1 !important;
+    background-color: #404040 !important;
+    padding-right: 16px !important;
+    top: 0 !important;
+}
 @media screen and (max-width: 800px) {
     .pcjs-textarea {
         width: 100% !important;