Optional style sheet switcher using JavaScript

xolox · Jan 14, 2011 · 980899f · 980899f
1 parent ffb8aae
commit 980899f
Show file tree

Hide file tree

Showing 9 changed files with 49 additions and 6 deletions.
diff --git a/etc/demo.lua b/etc/demo.lua
@@ -17,11 +17,10 @@ html, body { margin: 0; padding: 0; }
 pre { margin: 0; padding: 1em; }
 </style>
 ]],
-lxsh.includestyles(colors),
-[[</head>
-<body>]]))
+lxsh.includestyles(colors, true),
+'\n</head>\n<body>\n'))
   assert(handle:write(data))
-  assert(handle:write '</body></html>')
+  assert(handle:write '\n</body>\n</html>\n')
   local nbytes = handle:seek()
   assert(handle:close())
   return nbytes

diff --git a/etc/styleswitcher.js b/etc/styleswitcher.js
@@ -0,0 +1,35 @@
+function LXSH_GetStyles() {
+  var elements = document.getElementsByTagName('link');
+  var selected = new Array();
+  for (var i = elements.length - 1; i >= 0; i--)
+    if (elements[i].getAttribute('rel').indexOf('stylesheet') >= 0) {
+      var href = elements[i].getAttribute('href');
+      if (href && href.indexOf('http://peterodding.com/code/lua/lxsh/styles/') == 0)
+        selected.push(elements[i]);
+    }
+  return selected;
+}
+
+function LXSH_ChangeStyle(newstyle) {
+  var head = document.getElementsByTagName('head')[0];
+  var elements = LXSH_GetStyles();
+  for (var i = elements.length - 1; i >= 0; i--)
+    elements[i].disabled = (elements[i].getAttribute('title') != newstyle);
+}
+
+window.onload = function() {
+  var styles = LXSH_GetStyles();
+  var elements = document.getElementsByTagName('pre');
+  for (var i = elements.length - 1; i >= 0; i--)
+    if (elements[i].getAttribute('class').indexOf('sourcecode') >= 0)
+      for (var j = styles.length - 1; j >= 0; j--) {
+        var name = styles[j].getAttribute('title');
+        var link = document.createElement('a');
+        link.style.padding = '3px';
+        link.style.cssFloat = 'right';
+        link.innerHTML = name;
+        link.title = 'Switch to the ' + name + ' color scheme';
+        link.href = 'javascript:LXSH_ChangeStyle("' + name + '");';
+        elements[i].insertBefore(link, elements[i].firstChild);
+      }
+}
diff --git a/examples/earendel/apr.lua.html b/examples/earendel/apr.lua.html
@@ -7,6 +7,7 @@
 <link rel="stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/earendel.css" title="Earendel">
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/slate.css" title="Slate">
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/wiki.css" title="Wiki">
+<script type="text/javascript" src="http://peterodding.com/code/lua/lxsh/styleswitcher.js"></script>
 </head>
 <body>
 <pre class="sourcecode lua"><span class="comment">--[[

diff --git a/examples/earendel/lua_apr.c.html b/examples/earendel/lua_apr.c.html
@@ -7,6 +7,7 @@
 <link rel="stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/earendel.css" title="Earendel">
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/slate.css" title="Slate">
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/wiki.css" title="Wiki">
+<script type="text/javascript" src="http://peterodding.com/code/lua/lxsh/styleswitcher.js"></script>
 </head>
 <body>
 <pre class="sourcecode c"><span class="comment">/* Miscellaneous functions module for the Lua/APR binding.

diff --git a/examples/slate/apr.lua.html b/examples/slate/apr.lua.html
@@ -7,6 +7,7 @@
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/earendel.css" title="Earendel">
 <link rel="stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/slate.css" title="Slate">
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/wiki.css" title="Wiki">
+<script type="text/javascript" src="http://peterodding.com/code/lua/lxsh/styleswitcher.js"></script>
 </head>
 <body>
 <pre class="sourcecode lua"><span class="comment">--[[

diff --git a/examples/slate/lua_apr.c.html b/examples/slate/lua_apr.c.html
@@ -7,6 +7,7 @@
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/earendel.css" title="Earendel">
 <link rel="stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/slate.css" title="Slate">
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/wiki.css" title="Wiki">
+<script type="text/javascript" src="http://peterodding.com/code/lua/lxsh/styleswitcher.js"></script>
 </head>
 <body>
 <pre class="sourcecode c"><span class="comment">/* Miscellaneous functions module for the Lua/APR binding.

diff --git a/examples/wiki/apr.lua.html b/examples/wiki/apr.lua.html
@@ -7,6 +7,7 @@
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/earendel.css" title="Earendel">
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/slate.css" title="Slate">
 <link rel="stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/wiki.css" title="Wiki">
+<script type="text/javascript" src="http://peterodding.com/code/lua/lxsh/styleswitcher.js"></script>
 </head>
 <body>
 <pre class="sourcecode lua"><span class="comment">--[[

diff --git a/examples/wiki/lua_apr.c.html b/examples/wiki/lua_apr.c.html
@@ -7,6 +7,7 @@
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/earendel.css" title="Earendel">
 <link rel="alternate stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/slate.css" title="Slate">
 <link rel="stylesheet" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/wiki.css" title="Wiki">
+<script type="text/javascript" src="http://peterodding.com/code/lua/lxsh/styleswitcher.js"></script>
 </head>
 <body>
 <pre class="sourcecode c"><span class="comment">/* Miscellaneous functions module for the Lua/APR binding.

diff --git a/src/init.lua b/src/init.lua
@@ -9,7 +9,7 @@
 
 ]]
 
-local lxsh = { _VERSION = '0.6' }
+local lxsh = { _VERSION = '0.6.1' }
 local lpeg = require 'lpeg'
 
 -- Lexing. {{{1
@@ -193,13 +193,16 @@ end
 
 -- Style sheet generator. {{{2
 
-function lxsh.includestyles(default)
+function lxsh.includestyles(default, includeswitcher)
   local template = '<link rel="%s" type="text/css" href="http://peterodding.com/code/lua/lxsh/styles/%s.css" title="%s">'
   local output = {}
   for _, style in ipairs { 'earendel', 'slate', 'wiki' } do
     local rel = style == default and 'stylesheet' or 'alternate stylesheet'
     output[#output + 1] = template:format(rel, style, style:gsub('^%w', string.upper))
   end
+  if includeswitcher then
+    output[#output + 1] = '<script type="text/javascript" src="http://peterodding.com/code/lua/lxsh/styleswitcher.js"></script>'
+  end
   return table.concat(output, '\n')
 end