fixed up styleswitching, may still have to tweak file change (aka 304 http status codes) for alt css files

15 files changed, 302 insertions, 168 deletions

diff --git a/bn_django/templates/base.html b/bn_django/templates/base.html
index 95be2a4..b71af07 100644
--- a/bn_django/templates/base.html
+++ b/bn_django/templates/base.html
@@ -7,17 +7,21 @@
 <link rel="stylesheet" type="text/css" href="/static/style/default.css" />
 <link rel="stylesheet" type="text/css" href="/static/style/commentary.css" />
 <link rel="alternate stylesheet" type="text/css" 
-    href="/static/style/site-sane.css" title="site-sane" />
+    href="/static/style/fixed-sane-sans.css" title="fixed-sane-sans" />
 <link rel="alternate stylesheet" type="text/css" 
-    href="/static/style/site-nuts.css" title="site-nuts" />
+    href="/static/style/fixed-sane-serif.css" title="fixed-sane-serif" />
 <link rel="alternate stylesheet" type="text/css" 
-    href="/static/style/font-sans.css" title="font-sans" />
+    href="/static/style/fixed-nuts-sans.css" title="fixed-nuts-sans" />
 <link rel="alternate stylesheet" type="text/css" 
-    href="/static/style/font-serif.css" title="font-serif"  />
+    href="/static/style/fixed-nuts-serif.css" title="fixed-nuts-serif" />
 <link rel="alternate stylesheet" type="text/css" 
-    href="/static/style/width-fixed.css" title="width-fixed" />
+    href="/static/style/flexy-sane-sans.css" title="flexy-sane-sans" />
 <link rel="alternate stylesheet" type="text/css" 
-    href="/static/style/width-flexy.css" title="width-flexy" />
+    href="/static/style/flexy-sane-serif.css" title="flexy-sane-serif" />
+<link rel="alternate stylesheet" type="text/css" 
+    href="/static/style/flexy-nuts-sans.css" title="flexy-nuts-sans" />
+<link rel="alternate stylesheet" type="text/css" 
+    href="/static/style/flexy-nuts-serif.css" title="flexy-nuts-serif" />
 {% endblock %}
 {% block externaljs %} {% endblock %}
 <title>{% block windowtitle %}bryannewbold.com{% endblock %}</title>
diff --git a/static/style/fixed-nuts-sans.css b/static/style/fixed-nuts-sans.css
new file mode 100644
index 0000000..3ee7c8d
--- /dev/null
+++ b/static/style/fixed-nuts-sans.css
@@ -0,0 +1,36 @@
+.content {
+    margin-left: 4%;
+    width: 680px;
+    margin-top: 0px;
+    margin-right: 0px;
+    margin-bottom: 0px;
+    padding-left: 5px;
+    padding-right: 5px;
+    padding-bottom: 5px; }
+.content_footer {
+    margin-left: 4%;
+    width: 680px;
+    margin-bottom: 5px;
+    margin-right: 0px;
+    margin-top: 0px;
+    border-top: 2px solid #000000;
+    padding-top: 6px;
+    padding-left: 5px;
+    padding-right: 5px; }
+body { 
+    background-image: url("/static/style/fractal.gif"); 
+    background-color: green; }
+
+a { color: magenta; }
+a:visited { color: orange; }
+a:hover { color: yellow; }
+
+.content { background-color: purple; }
+
+#top_bar { background-color: #FF00FF; }
+
+#top_bar_content {
+    background-color: #FF00FF;
+    border-right: 200px solid #FF00FF;
+}
+body { font-family: sans; }
diff --git a/static/style/fixed-nuts-serif.css b/static/style/fixed-nuts-serif.css
new file mode 100644
index 0000000..11142d7
--- /dev/null
+++ b/static/style/fixed-nuts-serif.css
@@ -0,0 +1,35 @@
+.content {
+    margin-left: 4%;
+    width: 680px;
+    margin-top: 0px;
+    margin-right: 0px;
+    margin-bottom: 0px;
+    padding-left: 5px;
+    padding-right: 5px;
+    padding-bottom: 5px; }
+.content_footer {
+    margin-left: 4%;
+    width: 680px;
+    margin-bottom: 5px;
+    margin-right: 0px;
+    margin-top: 0px;
+    border-top: 2px solid #000000;
+    padding-top: 6px;
+    padding-left: 5px;
+    padding-right: 5px; }
+body { 
+    background-image: url("/static/style/fractal.gif"); 
+    background-color: green; }
+
+a { color: magenta; }
+a:visited { color: orange; }
+a:hover { color: yellow; }
+
+.content { background-color: purple; }
+
+#top_bar { background-color: #FF00FF; }
+
+#top_bar_content {
+    background-color: #FF00FF;
+    border-right: 200px solid #FF00FF;
+}
diff --git a/static/style/fixed-sane-sans.css b/static/style/fixed-sane-sans.css
new file mode 100644
index 0000000..52d7a65
--- /dev/null
+++ b/static/style/fixed-sane-sans.css
@@ -0,0 +1,48 @@
+.content {
+    margin-left: 4%;
+    width: 680px;
+    margin-top: 0px;
+    margin-right: 0px;
+    margin-bottom: 0px;
+    padding-left: 5px;
+    padding-right: 5px;
+    padding-bottom: 5px; }
+.content_footer {
+    margin-left: 4%;
+    width: 680px;
+    margin-bottom: 5px;
+    margin-right: 0px;
+    margin-top: 0px;
+    border-top: 2px solid #000000;
+    padding-top: 6px;
+    padding-left: 5px;
+    padding-right: 5px; }
+body { 
+    background-image: none;
+    background-color: #E3E3E3; }
+
+a { color: blue; }
+a:visited { color: blue; }
+a:hover { color: blue; }
+
+.content { background-color: #FFFFFF; }
+
+#top_bar { background-color: #993333; }
+#top_bar_content {
+    background-color: #993333;
+    border-right: 200px solid #993333; }
+body { 
+    background-image: none;
+    background-color: #E3E3E3; }
+
+a { color: blue; }
+a:visited { color: blue; }
+a:hover { color: blue; }
+
+.content { background-color: #FFFFFF; }
+
+#top_bar { background-color: #993333; }
+#top_bar_content {
+    background-color: #993333;
+    border-right: 200px solid #993333; }
+body { font-family: sans; }
diff --git a/static/style/width-full.css b/static/style/fixed-sane-serif.css
index d6f11cb..757afff 100644
--- a/static/style/width-full.css
+++ b/static/style/fixed-sane-serif.css
@@ -2,7 +2,7 @@
     margin-left: 4%;
     width: 680px;
     margin-top: 0px;
-    margin-right: none;
+    margin-right: 0px;
     margin-bottom: 0px;
     padding-left: 5px;
     padding-right: 5px;
@@ -11,7 +11,7 @@
     margin-left: 4%;
     width: 680px;
     margin-bottom: 5px;
-    margin-right: none;
+    margin-right: 0px;
     margin-top: 0px;
     border-top: 2px solid #000000;
     padding-top: 6px;
diff --git a/static/style/flexy-nuts-sans.css b/static/style/flexy-nuts-sans.css
new file mode 100644
index 0000000..fbf189a
--- /dev/null
+++ b/static/style/flexy-nuts-sans.css
@@ -0,0 +1,38 @@
+.content {
+    margin-left: 0px;
+    width: 75%;
+    margin-top: 0px;
+    margin-bottom: 0px;
+    margin-right: 250px;
+    padding-left: 15px;
+    padding-right: 5px;
+    padding-bottom: 5px; }
+.content_footer {
+    margin-left: 0px;
+    width: 75%;
+    margin-bottom: 5px;
+    margin-right: 250px;
+    margin-top: 0px;
+    border-top: 2px solid #000000;
+    padding-top: 6px;
+    padding-left: 15px;
+    padding-right: 5px; }
+
+body { 
+    background-image: url("/static/style/fractal.gif"); 
+    background-color: green; }
+
+a { color: magenta; }
+a:visited { color: orange; }
+a:hover { color: yellow; }
+
+.content { background-color: purple; }
+
+#top_bar { background-color: #FF00FF; }
+
+#top_bar_content {
+    background-color: #FF00FF;
+    border-right: 200px solid #FF00FF;
+}
+body { font-family: sans; }
+body { font-family: sans; }
diff --git a/static/style/flexy-nuts-serif.css b/static/style/flexy-nuts-serif.css
new file mode 100644
index 0000000..2dbe9b0
--- /dev/null
+++ b/static/style/flexy-nuts-serif.css
@@ -0,0 +1,36 @@
+.content {
+    margin-left: 0px;
+    width: 75%;
+    margin-top: 0px;
+    margin-bottom: 0px;
+    margin-right: 250px;
+    padding-left: 15px;
+    padding-right: 5px;
+    padding-bottom: 5px; }
+.content_footer {
+    margin-left: 0px;
+    width: 75%;
+    margin-bottom: 5px;
+    margin-right: 250px;
+    margin-top: 0px;
+    border-top: 2px solid #000000;
+    padding-top: 6px;
+    padding-left: 15px;
+    padding-right: 5px; }
+
+body { 
+    background-image: url("/static/style/fractal.gif"); 
+    background-color: green; }
+
+a { color: magenta; }
+a:visited { color: orange; }
+a:hover { color: yellow; }
+
+.content { background-color: purple; }
+
+#top_bar { background-color: #FF00FF; }
+
+#top_bar_content {
+    background-color: #FF00FF;
+    border-right: 200px solid #FF00FF;
+}
diff --git a/static/style/flexy-sane-sans.css b/static/style/flexy-sane-sans.css
new file mode 100644
index 0000000..10d188e
--- /dev/null
+++ b/static/style/flexy-sane-sans.css
@@ -0,0 +1,35 @@
+.content {
+    margin-left: 0px;
+    width: 75%;
+    margin-top: 0px;
+    margin-bottom: 0px;
+    margin-right: 250px;
+    padding-left: 15px;
+    padding-right: 5px;
+    padding-bottom: 5px; }
+.content_footer {
+    margin-left: 0px;
+    width: 75%;
+    margin-bottom: 5px;
+    margin-right: 250px;
+    margin-top: 0px;
+    border-top: 2px solid #000000;
+    padding-top: 6px;
+    padding-left: 15px;
+    padding-right: 5px; }
+
+body { 
+    background-image: none;
+    background-color: #E3E3E3; }
+
+a { color: blue; }
+a:visited { color: blue; }
+a:hover { color: blue; }
+
+.content { background-color: #FFFFFF; }
+
+#top_bar { background-color: #993333; }
+#top_bar_content {
+    background-color: #993333;
+    border-right: 200px solid #993333; }
+body { font-family: sans; }
diff --git a/static/style/width-flexy.css b/static/style/flexy-sane-serif.css
index 84d1a59..eec5837 100644
--- a/static/style/width-flexy.css
+++ b/static/style/flexy-sane-serif.css
@@ -1,5 +1,5 @@
 .content {
-    margin-left: none;
+    margin-left: 0px;
     width: 75%;
     margin-top: 0px;
     margin-bottom: 0px;
@@ -8,7 +8,7 @@
     padding-right: 5px;
     padding-bottom: 5px; }
 .content_footer {
-    margin-left: none;
+    margin-left: 0px;
     width: 75%;
     margin-bottom: 5px;
     margin-right: 250px;
@@ -18,3 +18,17 @@
     padding-left: 15px;
     padding-right: 5px; }
 
+body { 
+    background-image: none;
+    background-color: #E3E3E3; }
+
+a { color: blue; }
+a:visited { color: blue; }
+a:hover { color: blue; }
+
+.content { background-color: #FFFFFF; }
+
+#top_bar { background-color: #993333; }
+#top_bar_content {
+    background-color: #993333;
+    border-right: 200px solid #993333; }
diff --git a/static/style/font-sans.css b/static/style/font-sans.css
deleted file mode 100644
index 171e507..0000000
--- a/static/style/font-sans.css
+++ /dev/null
@@ -1 +0,0 @@
-body { font-family: sans; }
diff --git a/static/style/font-serif.css b/static/style/font-serif.css
deleted file mode 100644
index dd3e369..0000000
--- a/static/style/font-serif.css
+++ /dev/null
@@ -1 +0,0 @@
-body { font-family: serif; }
diff --git a/static/style/fractal.gif b/static/style/fractal.gif
new file mode 100644
index 0000000..b008702
--- /dev/null
+++ b/static/style/fractal.gif
diff --git a/static/style/site-nuts.css b/static/style/site-nuts.css
deleted file mode 100644
index 330a234..0000000
--- a/static/style/site-nuts.css
+++ /dev/null
@@ -1,16 +0,0 @@
-body { 
-    background-image: url("/static/style/fractal.gif"); 
-    background-color: green; }
-
-a { color: magenta; }
-a:visited { color: orange; }
-a:hover { color: yellow; }
-
-.content { background-color: purple; }
-
-#top_bar { background-color: #FF00FF; }
-
-#top_bar_content {
-    background-color: #FF00FF;
-    border-right: 200px solid #FF00FF;
-}
diff --git a/static/style/site-sane.css b/static/style/site-sane.css
deleted file mode 100644
index 053b06d..0000000
--- a/static/style/site-sane.css
+++ /dev/null
@@ -1,14 +0,0 @@
-body { 
-    background-image: none;
-    background-color: #E3E3E3; }
-
-a { color: blue; }
-a:visited { color: blue; }
-a:hover { color: blue; }
-
-.content { background-color: #FFFFFF; }
-
-#top_bar { background-color: #993333; }
-#top_bar_content {
-    background-color: #993333;
-    border-right: 200px solid #993333; }
diff --git a/static/style/styleswitcher.js b/static/style/styleswitcher.js
index 981a6ca..ddc2846 100644
--- a/static/style/styleswitcher.js
+++ b/static/style/styleswitcher.js
@@ -1,85 +1,36 @@
-function setActiveSiteStyleSheet(title) {
-  var i, a, main;
-  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
-      if(a.getAttribute("title").indexOf("site") != 1) a.disabled = true;
-      if(a.getAttribute("title") == title) a.disabled = false;
-    }
-  }
-}
-function setActiveWidthStyleSheet(title) {
-  var i, a, main;
-  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
-      if(a.getAttribute("title").indexOf("width") != 1) a.disabled = true;
-      if(a.getAttribute("title") == title) a.disabled = false;
-    }
-  }
-}
-function setActiveFontStyleSheet(title) {
-  var i, a, main;
-  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
-      if(a.getAttribute("title").indexOf("font") != 1) a.disabled = true;
-      if(a.getAttribute("title") == title) a.disabled = false;
-    }
-  }
-}
+var fontStyle = 'serif';
+var siteStyle = 'sane';
+var widthStyle = 'fixed';
 
-function getActiveSiteStyleSheet() {
-  var i, a;
-  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled && a.getAttribute("title").indexOf("site") != -1) return a.getAttribute("title");
-  }
-  return null;
-}
-function getActiveFontStyleSheet() {
+function setStyleSheet() {
   var i, a;
+  var styleName = '' + widthStyle + '-' + siteStyle + '-' + fontStyle
   for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled && a.getAttribute("title").indexOf("font") != -1) return a.getAttribute("title");
-  }
-  return null;
-}
-function getActiveWidthStyleSheet() {
-  var i, a;
-  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled && a.getAttribute("title").indexOf("width") != -1) return a.getAttribute("title");
+    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title"))
+    {
+      if(a.getAttribute("title").indexOf(styleName) != -1) a.disabled = false;
+      else a.disabled = true;
+    }
   }
-  return null;
+  createCookie("style", styleName, 100);
 }
 
-function getPreferredSiteStyleSheet() {
-  var i, a;
-  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1
-       && a.getAttribute("rel").indexOf("alt") == -1
-       && a.getAttribute("title")
-       && a.getAttribute("title").indexOf("site") != -1
-       ) return a.getAttribute("title");
-  }
-  return null;
-}
-function getPreferredFontStyleSheet() {
-  var i, a;
-  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1
-       && a.getAttribute("rel").indexOf("alt") == -1
-       && a.getAttribute("title")
-       && a.getAttribute("title").indexOf("font") != -1
-       ) return a.getAttribute("title");
-  }
-  return null;
-}
-function getPreferredWidthStyleSheet() {
-  var i, a;
-  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
-    if(a.getAttribute("rel").indexOf("style") != -1
-       && a.getAttribute("rel").indexOf("alt") == -1
-       && a.getAttribute("title")
-       && a.getAttribute("title").indexOf("width") != -1
-       ) return a.getAttribute("title");
-  }
-  return null;
+function parseStyleCookie(cookie) {
+    names = cookie.split('-')
+    widthStyle = names[0]
+    if(widthStyle == 'flexy') {
+        document.getElementById('style_width').innerHTML = 'flexy'
+    }
+    siteStyle = names[1]
+    if(siteStyle == 'nuts') {
+        document.getElementById('style_site').innerHTML = 'nuts'
+    }
+    fontStyle = names[2]
+    if(fontStyle == 'sans') {
+        document.getElementById('style_font_first').innerHTML = 'A'
+        document.getElementById('style_font_second').innerHTML = 'a'
+    }
+    setStyleSheet()
 }
 
 function createCookie(name,value,days) {
@@ -104,81 +55,50 @@ function readCookie(name) {
 }
 
 window.onload = function(e) {
-  var cookie = readCookie("sitestyle");
-  var title = cookie ? cookie : getPreferredSiteStyleSheet();
-  setActiveSiteStyleSheet(title);
-  if(title.indexOf('nuts') != -1) {
-    document.getElementById('style_site').innerHTML = 'nuts'
-  }
-  var cookie = readCookie("fontstyle");
-  var title = cookie ? cookie : getPreferredFontStyleSheet();
-  setActiveFontStyleSheet(title);
-  if(title.indexOf('sans') != -1) {
-    document.getElementById('style_font_first').innerHTML = 'A'
-    document.getElementById('style_font_second').innerHTML = 'a'
-  }
-  var cookie = readCookie("widthstyle");
-  var title = cookie ? cookie : getPreferredWidthStyleSheet();
-  setActiveWidthStyleSheet(title);
-  if(title.indexOf('flexy') != -1) {
-    document.getElementById('style_width').innerHTML = 'flexy'
-  }
-}
-
-window.onunload = function(e) {
-  if (stuffset == true) {
-    var title = getActiveSiteStyleSheet();
-    createCookie("sitestyle", title, 365);
-    title = getActiveFontStyleSheet();
-    createCookie("fontstyle", title, 365);
-    title = getActiveWidthStyleSheet();
-    createCookie("widthstyle", title, 365);
-  }
+    var cookie = readCookie("style");
+    if(cookie) parseStyleCookie(cookie);
 }
 
-var stuffset = false
-var cookie = readCookie("sitestyle");
-var title = cookie ? cookie : getPreferredSiteStyleSheet();
-setActiveSiteStyleSheet(title);
-var cookie = readCookie("fontstyle");
-var title = cookie ? cookie : getPreferredFontStyleSheet();
-setActiveFontStyleSheet(title);
-var cookie = readCookie("widthstyle");
-var title = cookie ? cookie : getPreferredFontStyleSheet();
-setActiveFontStyleSheet(title);
+/* var cookie = readCookie("style"); */
+/* parseStyleCookie(cookie) */
 
 function swapstyle(thing) {
   stuffset = true;
   switch(thing){
     case 'font':
-      if(document.getElementById('style_font_first').innerHTML == 'a'){
+      if(document.getElementById('style_font_first').innerHTML.indexOf('a') != -1){
         document.getElementById('style_font_first').innerHTML = 'A'
         document.getElementById('style_font_second').innerHTML = 'a'
-        setActiveFontStyleSheet('font-sans')
+        fontStyle = 'sans'
+        setStyleSheet()
       } else {
         document.getElementById('style_font_first').innerHTML = 'a'
         document.getElementById('style_font_second').innerHTML = 'A'
-        setActiveFontStyleSheet('font-serif')
+        fontStyle = 'serif'
+        setStyleSheet()
       }
       break;
     case 'site':
-      if(document.getElementById('style_site').innerHTML == 'sane'){
+      if(document.getElementById('style_site').innerHTML.indexOf('sane') != -1){
         document.getElementById('style_site').innerHTML = 'nuts'
-        setActiveSiteStyleSheet('site-nuts')
+        siteStyle = 'nuts'
+        setStyleSheet()
       } else {
         document.getElementById('style_site').innerHTML = 'sane'
-        setActiveSiteStyleSheet('site-sane')
+        siteStyle = 'sane'
+        setStyleSheet()
       } 
       break;
     case 'width':
-      if(document.getElementById('style_width').innerHTML == 'fixed'){
+      if(document.getElementById('style_width').innerHTML.indexOf('fixed') != -1){
         document.getElementById('style_width').innerHTML = 'flexy'
-        setActiveWidthStyleSheet('width-flexy')
+        widthStyle = 'flexy'
+        setStyleSheet()
       } else {
         document.getElementById('style_width').innerHTML = 'fixed'
-        setActiveWidthStyleSheet('width-fixed')
+        widthStyle = 'fixed'
+        setStyleSheet()
       } 
       break;
-    
   }
 }