Selector de CSS

Fix 1

Fix 2

Conchetumadresan

Cleanup

ahorasi

Ajustes en selector y CSS

Ajustes CSS para Selector de estilo

Fix gif background

Arreglos finales

12 files changed, 29 insertions, 25 deletions

diff --git a/cgi/templates/txt_board.en.html b/cgi/templates/txt_board.en.html
index 67a325a..b4f552b 100644
--- a/cgi/templates/txt_board.en.html
+++ b/cgi/templates/txt_board.en.html
@@ -14,8 +14,8 @@
     <form method="get" action="/tools/search.py" id="search"><input type="text" name="q" value="" /><input type="hidden" name="board" value="#{board}" /><input type="submit" value="Search active posts" /><input type="submit" value="Search archives" formaction="/tools/search_kako.py" /></form>
   </div>
   <div class="innerbox links"><a href="/guia.html"><b>C&oacute;mo postear</b></a> | <a href="/faq.html"><b>Preguntas frecuentes</b></a> | <a href="/bai/"><b>Contacto</b></a>
-  <?py if not force_css: ?>| <b>Styles:</b>
-    <?py for title in txt_styles: ?><a href="#" class="ss">#{title}</a> <?py #endfor ?>
+  <?py if not force_css: ?>| <b>Estilo: </b><select id="themeSelector">
+  <?py for title in txt_styles: ?><option value="#{title}">#{title}</option><?py #endfor ?></select>
   <?py #endif ?></div>
 </div>
 <?py if postarea_extra: ?>
diff --git a/cgi/templates/txt_board.html b/cgi/templates/txt_board.html
index 34fff54..ecb13ab 100644
--- a/cgi/templates/txt_board.html
+++ b/cgi/templates/txt_board.html
@@ -14,9 +14,10 @@
     <form method="get" action="/tools/search.py" id="search"><input type="text" name="q" value="" /><input type="hidden" name="board" value="#{board}" /><input type="submit" value="Buscar en mensajes activos" /><input type="submit" value="Buscar en archivo" formaction="/tools/search_kako.py" /></form>
   </div>
   <div class="innerbox links"><b>¿Eres nuevo?</b> <a href="/guia.html"><b>C&oacute;mo postear</b></a> | <a href="/faq.html"><b>Preguntas frecuentes</b></a> | <a href="/bai/"><b>Contacto</b></a>
-  <?py if not force_css: ?>| <b>Estilo:</b>
-    <?py for title in txt_styles: ?><a href="#" class="ss">#{title}</a> <?py #endfor ?>
-  <?py #endif ?></div>
+  <?py if not force_css: ?>| <b>Estilo: </b><select id="themeSelector">
+  <?py for title in txt_styles: ?><option value="#{title}">#{title}</option><?py #endfor ?></select>
+  <?py #endif ?>
+</div>
 </div>
 <?py if postarea_extra: ?>
 <div class="outerbox"><div class="innerbox">#{postarea_extra}</div></div>
diff --git a/cgi/templates/txt_threadlist.html b/cgi/templates/txt_threadlist.html
index bb09df4..24c3297 100644
--- a/cgi/templates/txt_threadlist.html
+++ b/cgi/templates/txt_threadlist.html
@@ -9,7 +9,8 @@
   <div class="innerbox links"><b>¿Eres nuevo?</b> <a href="/guia.html"><b>C&oacute;mo postear</b></a> | <a href="/faq.html"><b>Preguntas frecuentes</b></a> | <a href="/bai/"><b>Contacto</b></a>
   <?py if not force_css: ?>| <b>Apariencia:</b>
     <?py for title in txt_styles: ?><a href="#" class="ss">#{title}</a> <?py #endfor ?>
-  <?py #endif ?></div>
+  <?py #endif ?>
+  </div>
 </div>
 <a name="menu"></a>
 <div id="threadbox" class="outerbox"><div class="innerbox">
diff --git a/static/css/txt/4am.css b/static/css/txt/4am.css
index 723939c..8c538c1 100644
--- a/static/css/txt/4am.css
+++ b/static/css/txt/4am.css
@@ -1,9 +1,9 @@
-body{background:#222 url('/bg2.gif');color:#CED1CF}
+body{background:#222 url('/mantencion_bg.gif');color:#CED1CF}
 body.threadpage{background-image:none}
 a,a .name,#n2{color:#81A2BE;text-decoration:none}
 a:hover,a:focus,#n2:active{color:#4d6172;text-decoration:underline}
 hr{border:1px inset #111}
-input[type="text"],input[type="submit"],input[type="button"],textarea,button{background:#383838;border:1px solid #4B4E55;color:#e8e8e8}
+input[type="text"],input[type="submit"],input[type="button"],textarea,button, #themeSelector{background:#383838;border:1px solid #4B4E55;color:#e8e8e8}
 input[type="submit"],input[type="button"],button{background:#333}
 input[type="submit"]:active,input[type="button"]:active,button:active{background:#232323}
 h1{color:#dc9656;font-size:26px;margin-top:-5px;text-align:center}
diff --git a/static/css/txt/amber.css b/static/css/txt/amber.css
index 62fe9de..3f2902f 100644
--- a/static/css/txt/amber.css
+++ b/static/css/txt/amber.css
@@ -11,7 +11,7 @@ h3 span,#size,.abbrev{color:#f00}
 hr{background:#f9690e;border:0;height:1px;box-shadow:0 0 10px #f9690e}
 .spoil{background:#f9690e;color:#f9690e;text-shadow:none}.spoil:hover{color:#000}
 input,button{font-family:monospace}
-input,input[type="submit"],input[type="button"],input[type="text"],textarea,button{background:#000;border:1px solid #f9690e;color:#f9690e;text-shadow:1px 1px #000}
+input,input[type="submit"],input[type="button"],input[type="text"],textarea,button,#themeSelector{background:#000;border:1px solid #f9690e;color:#f9690e;text-shadow:1px 1px #000}
 input[type="text"]:focus,textarea:focus{background:#3a1903}
 input[type=submit]:active,input[type=button]:active,button:active{background:#f9690e;border-style:solid;color:#000}
 #main_nav{background:#000;box-shadow: 0 0 10px}
diff --git a/static/css/txt/ayashii.css b/static/css/txt/ayashii.css
index de0b8b8..d75894c 100644
--- a/static/css/txt/ayashii.css
+++ b/static/css/txt/ayashii.css
@@ -7,7 +7,7 @@ h2 span{font-weight:initial;font-size:24px;margin-left:4px;display:inline-block;
 h3{margin-bottom:.5em;padding-bottom:.5em}
 h4:before{content:"＞";color:#FFFFFE;display:inline-block;font-size:16px;width:40px}
 .first h4:before{content:none}
-input[type=submit],input[type=button],button{border:1px outset #FFF;background:#DDD;color:#000}
+input[type=submit],input[type=button],button,#themeSelector{border:1px outset #FFF;background:#DDD;color:#000}
 #main_nav,.banner{background:inherit;text-align:left;margin:0;padding-left:2.5%}
 #titlebox{margin-bottom:1em;margin-top:5px}
 .threadnav a{margin-left:4px}
diff --git a/static/css/txt/bios.css b/static/css/txt/bios.css
index 1f19e25..95763b7 100644
--- a/static/css/txt/bios.css
+++ b/static/css/txt/bios.css
@@ -2,7 +2,7 @@ body,textarea,.lastposts #counter{background:#00a;color:#FFF}
 a,a .name,.lastposts #n2{color:#ff0;text-decoration:none}
 a:focus,a:active,a:active .name,#n2:active{background:#f00;color:#FFF}
 .mainpage .threadlinks a:before,#threadlinks a:before,.lastposts a:before,.lastposts label:before{content:'▶ '}
-input[type="text"],textarea{background:#00a;border:1px solid #FFF;color:#FFF}
+input[type="text"],textarea,#themeSelector{background:#00a;border:1px solid #FFF;color:#FFF}
 input[type="submit"],input[type="button"],button{background:#FFF;border:0;color:#000;padding:2px 10px}
 input[type="submit"]:active,input[type="button"]:active,button:active{background:#000;border-style:solid;color:#FFF}
 ::selection{background:#FFF;color:#000}
diff --git a/static/css/txt/blue moon.css b/static/css/txt/blue moon.css
index 29d8bf4..86c7cba 100644
--- a/static/css/txt/blue moon.css
+++ b/static/css/txt/blue moon.css
@@ -9,7 +9,7 @@ h2 a{color:#EEE}
 h3{color:#EEE;margin:0.7em 0}
 h4{background:#DDD;padding-bottom:.2em}
 hr{display:none}
-input[type=text],textarea{background:#EEE;border:1px inset #444}
+input[type=text],textarea,#themeSelector{background:#EEE;border:1px inset #444}
 input[type=submit],input[type=button],button{background:#000;color:#FFF;border:1px outset #444}
 input[type=submit]:active,input[type=button]:active,button:active{color:#DDD}
 #main_nav{background:#FFF;color:#6B7B8D}
diff --git a/static/css/txt/ciber.css b/static/css/txt/ciber.css
index be5fada..5039e0e 100644
--- a/static/css/txt/ciber.css
+++ b/static/css/txt/ciber.css
@@ -13,7 +13,7 @@ h3 span,#size,.abbrev{color:#639}
 hr{background:#2A4A75;border:0;height:1px;box-shadow:0 0 10px #2A4A75}
 .spoil{background:#2A4A75;color:#2A4A75;text-shadow:none}.spoil:hover{color:#000}
 input:active,input:focus,textarea:active,textarea:focus,button:active,button:active{box-shadow:0 0 15px}
-.outerbox input,.outerbox textarea{background:#002f00;border:1px solid #68F855;color:#68F855}
+.outerbox input,.outerbox textarea,#themeSelector{background:#002f00;border:1px solid #68F855;color:#68F855}
 .outerbox input[type=submit],.outerbox input[type=button],.outerbox button{background:#0F0;border:3px outset #0F0;color:#000}
 .outerbox input[type=submit]:active,.outerbox input[type=button]:active,.outerbox button:active{background:#0C0;border-style:inset}
 .threadpage input,.threadpage textarea,.thread input,.thread textarea{background:#000;border:1px solid #2A4A75;color:#2A4A75;text-shadow:1px 1px #000}
diff --git a/static/css/txt/cuteanarchy.css b/static/css/txt/cuteanarchy.css
index 1e93539..c5470ee 100644
--- a/static/css/txt/cuteanarchy.css
+++ b/static/css/txt/cuteanarchy.css
@@ -42,6 +42,7 @@ hr {
 input[type="text"],
 input[type="submit"],
 input[type="button"],
+#themeSelector,
 textarea {
  background: #e2ffeb;
  border: 1px solid #b4ccbc;
diff --git a/static/css/txt/ventanas.css b/static/css/txt/ventanas.css
index 6f7ea7a..80b38da 100644
--- a/static/css/txt/ventanas.css
+++ b/static/css/txt/ventanas.css
@@ -20,7 +20,7 @@ hr,h4,.deleted{border-top:2px groove white}
 #main_nav .cur_brd{background:#BBB url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAHUlEQVQImQESAO3/AMG/wv////7/AP///v++vr7/gXcOcY36q6gAAAAASUVORK5CYII=');font-weight:bold}
 #main_nav .cur_brd,#main_nav a:active,.threadnav a:active,input[type=submit]:active,input[type=button]:active,button:active{border-color:#000 #FFF #FFF #000;border-style:groove}
 .outerbox,.mainpage .thread,#q-p{border-width:2px;border-color:#FFF #000 #000 #FFF;border-style:groove}
-input[type=text],textarea,.innerbox,#content,#threadlist{border-width:2px;border-color:#000 #FFF #FFF #000;border-style:groove}
+input[type=text],textarea,.innerbox,#content,#threadlist,#themeSelector{border-width:2px;border-color:#000 #FFF #FFF #000;border-style:groove}
 #threadlinks:before{content:"";display:block;height:15px;margin-bottom:5px}
 .innerbox{padding:10px;margin:2px}
 .links{border:1px solid;border-color:#888 #dadada #dadada #888;padding:2px}
diff --git a/static/js/weabotxt.js b/static/js/weabotxt.js
index 37668d8..91e2ab0 100644
--- a/static/js/weabotxt.js
+++ b/static/js/weabotxt.js
@@ -1,5 +1,7 @@
 var style_cookie = "weabot_style_txt";
-if(style_cookie && localStorage.hasOwnProperty(style_cookie)) { set_stylesheet(localStorage.getItem(style_cookie)); }
+if(style_cookie && localStorage.hasOwnProperty(style_cookie)) {
+  set_stylesheet(localStorage.getItem(style_cookie));
+}
 
 var hiddenposts = Array();
 
@@ -240,6 +242,11 @@ function togglepost(e) {
   localStorage.setItem("hiddenposts", hiddenposts.join("!"));
 }
 
+function applyTheme(){
+  var newTheme = document.getElementById("themeSelector").value;
+  set_stylesheet(newTheme);
+}
+
 document.addEventListener("DOMContentLoaded", function() {
   if (localStorage.hasOwnProperty("weabot")) weabot = JSON.parse(localStorage.getItem("weabot"));
   else weabot = {"name":null,"email":null,"password":null};
@@ -256,16 +263,10 @@ document.addEventListener("DOMContentLoaded", function() {
   var forms = document.getElementsByTagName("form");
   for(var i=0;i<forms.length;i++) { if(forms[i].id.startsWith("postform")) setInputs(forms[i].id); }
 
-  var sss = document.getElementsByClassName("ss");
-  var style = localStorage.getItem(style_cookie);
-  for(var i=0;i<sss.length;i++) {
-    sss[i].addEventListener("click", function() {
-      set_stylesheet(this.textContent);
-      var cur = document.getElementById("cur_stl");
-      if (cur) cur.removeAttribute("id");
-      this.id = "cur_stl";
-    });
-    if (sss[i].innerText == style) sss[i].id = "cur_stl";
+  if (document.body.className == "mainpage") {
+    var themeSelector = document.getElementById("themeSelector");
+    themeSelector.addEventListener("change", applyTheme, false);
+    themeSelector.value = localStorage.getItem(style_cookie);
   }
 
   var dds = document.getElementsByClassName("del");