From 542e8d1452130079ae47f7a56328f8421e56f5ab Mon Sep 17 00:00:00 2001
From: Choom
Date: Mon, 16 Jan 2023 05:32:08 -0300
Subject: Config para el usuario

---
 cgi/api.py                         |  11 ++++
 cgi/templates/base_bottom.html     |   4 +-
 cgi/templates/base_top.html        |   2 +-
 cgi/templates/txt_board.en.html    |   2 +-
 cgi/templates/txt_board.html       |   2 +-
 cgi/weabot.py                      |   7 ---
 static/css/cyber.css               |   6 +-
 static/css/dickgirl.css            |   2 +-
 static/css/guro.css                |   2 +-
 static/css/hotdog.css              |   4 +-
 static/css/ib.css                  |   9 +--
 static/css/kraut.css               |   4 +-
 static/css/lavanda.css             |   2 +-
 static/css/photon.css              |   2 +-
 static/css/putaba.css              |   6 +-
 static/css/rene.css                |   6 +-
 static/css/spc/material.css        |   2 +-
 static/css/spc/material_normal.css |   2 +-
 static/css/spc/navidad.css         |   4 +-
 static/css/spc/valentin.css        |   4 +-
 static/css/spc/valentin2.css       |   4 +-
 static/css/txt/amber.css           |   2 +-
 static/css/txt/ayashii.css         |   4 +-
 static/css/txt/bbs.css             |   6 +-
 static/css/txt/berries.css         |   2 +-
 static/css/txt/cuteanarchy.css     |   2 +-
 static/css/txt/gamer.css           |   2 +-
 static/css/txt/mercury.css         |   3 +
 static/css/txt/void.css            |   2 +-
 static/css/vndb.css                |   6 +-
 static/example/banner.jpg          | Bin 0 -> 3826 bytes
 static/example/bbs1.html           |  58 +++++++++++++++++++
 static/example/bbs2.html           |  53 +++++++++++++++++
 static/example/ib1.html            |  97 +++++++++++++++++++++++++++++++
 static/js/userconf.js              | 114 +++++++++++++++++++++++++++++++++++++
 static/js/weabotxt.js              |   2 +-
 36 files changed, 383 insertions(+), 57 deletions(-)
 create mode 100644 static/example/banner.jpg
 create mode 100644 static/example/bbs1.html
 create mode 100644 static/example/bbs2.html
 create mode 100644 static/example/ib1.html
 create mode 100644 static/js/userconf.js

diff --git a/cgi/api.py b/cgi/api.py
index e6968f8..129da97 100644
--- a/cgi/api.py
+++ b/cgi/api.py
@@ -336,6 +336,7 @@ def api_process(self, path_split):
             post['thumb_height'] = post['thumb_height']
             post['message'] = post['message']
             values['posts'].append(post)
+
     elif method == 'delete':
         data_board = formdata.get('dir')
         data_postid = formdata.get('id')
@@ -357,6 +358,7 @@ def api_process(self, path_split):
             imageonly = True
 
         deletePosts(board['dir'], postid, imageonly, data_password)
+
     elif method == 'post':
         boarddir = formdata.get('board')
 
@@ -385,6 +387,13 @@ def api_process(self, path_split):
         values['post_url'] = post_url
         values['time_taken'] = ttaken
         values['post_id'] = postid
+
+    elif method == 'styles':
+        values['bbs_styles'] = Settings.TXT_STYLES
+        values['ib_styles'] = Settings.STYLES
+        values['bbs_styles_default'] = Settings.TXT_STYLES_DEFAULT
+        values['ib_styles_default'] = Settings.STYLES_DEFAULT
+
     elif method == 'newThreads':
         data_limit = formdata.get('limit')
         limit = 30
@@ -399,9 +408,11 @@ def api_process(self, path_split):
 
         threads = getNewThreads(limit)
         values['threads'] = threads
+
     elif method == "blotter":
         latest_news = FetchAll("SELECT `timestamp`, `message`, `timestamp_formatted` FROM `news` WHERE `type` = '2' ORDER BY `timestamp` DESC LIMIT %s", (Settings.HOME_NEWS,))
         values["news"] = latest_news
+
     elif method == 'boardsExtra':
         boards = FetchAll('SELECT dir, name, longname, subname, postarea_desc, postarea_extra, anonymous, subject, message, disable_name, disable_subject, allow_spoilers, allow_oekaki, numthreads, board_type, allow_images, allow_image_replies, maxsize FROM `boards` WHERE `secret`=0 ORDER BY `sort` ASC')
         values['boards'] = boards
diff --git a/cgi/templates/base_bottom.html b/cgi/templates/base_bottom.html
index 102f8f2..2a63435 100644
--- a/cgi/templates/base_bottom.html
+++ b/cgi/templates/base_bottom.html
@@ -1,3 +1,3 @@
-<div class="footer">- <a href="//www.bienvenidoainternet.org" target="_top">weabot</a> <?py include('templates/revision.html') ?> -</div>
+<div id="footer">- <a href="//www.bienvenidoainternet.org" target="_top">weabot</a> <?py include('templates/revision.html') ?> -</div>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/cgi/templates/base_top.html b/cgi/templates/base_top.html
index 2dc079e..dcf3d65 100644
--- a/cgi/templates/base_top.html
+++ b/cgi/templates/base_top.html
@@ -37,7 +37,7 @@
 </head>
 <body#{' class="res"' if replythread else ''} data-brd="#{board}">
   <div id="main_nav"><span>[<a href="/" target="_top">Bienvenido a Internet</a>] [<?py include('templates/navbar.html') ?>]</span></div>
-  <div class="logo">
+  <div id="logo">
   <?py if board: ?>
     #{board_long}
   <?py else: ?>
diff --git a/cgi/templates/txt_board.en.html b/cgi/templates/txt_board.en.html
index 13a1554..75f548a 100644
--- a/cgi/templates/txt_board.en.html
+++ b/cgi/templates/txt_board.en.html
@@ -2,7 +2,7 @@
 <body class="mainpage" data-brd="#{board}">
 <div id="main_nav"><a href="/" target="_top">Bienvenido a Internet</a> | <?py include('templates/navbar.html') ?></div>
 <?py if banner_url: ?>
-  <img class="banner" src="#{banner_url}" style="width:#{banner_width}px;height:#{banner_height}px;" />
+  <img id="banner" src="#{banner_url}" width="#{banner_width}" height="#{banner_height}" />
 <?py #endif ?>
 <div id="titlebox" class="outerbox">
   <div class="innerbox">
diff --git a/cgi/templates/txt_board.html b/cgi/templates/txt_board.html
index 98cb159..4e8d820 100644
--- a/cgi/templates/txt_board.html
+++ b/cgi/templates/txt_board.html
@@ -2,7 +2,7 @@
 <body class="mainpage" data-brd="#{board}">
 <div id="main_nav"><a href="/" target="_top">Bienvenido a Internet</a> | <?py include('templates/navbar.html') ?></div>
 <?py if banner_url: ?>
-  <img class="banner" src="#{banner_url}" style="width:#{banner_width}px;height:#{banner_height}px;" />
+  <img id="banner" src="#{banner_url}" width="#{banner_width}" height="#{banner_height}" />
 <?py #endif ?>
 <div id="titlebox" class="outerbox">
   <div class="innerbox">
diff --git a/cgi/weabot.py b/cgi/weabot.py
index 3ecf0f3..c1bc1a3 100755
--- a/cgi/weabot.py
+++ b/cgi/weabot.py
@@ -323,13 +323,6 @@ class weabot(object):
                 else:
                     url = f"{Settings.HOME_URL}{board['dir']}/res/{thread['id']}.html"
                 self.output += '<html xmlns="http://www.w3.org/1999/xhtml"><meta http-equiv="refresh" content="0;url=%s" /><body><p>...</p></body></html>' % url
-            elif path_split[1] == "nostalgia":
-                caught = True
-                OpenDb()
-                thread = FetchOne(
-                    "SELECT `timestamp` FROM `archive` WHERE `boardid` = 9 AND `timestamp` < 1462937230 ORDER BY RAND() LIMIT 1")
-                url = f"{Settings.HOME_URL}/zonavip/read/{thread['timestamp']}/"
-                self.output += '<html xmlns="http://www.w3.org/1999/xhtml"><meta http-equiv="refresh" content="0;url=%s" /><body><p>...</p></body></html>' % url
             elif path_split[1] == "banned":
                 OpenDb()
                 bans = FetchAll("SELECT * FROM `bans` WHERE INET6_ATON(%s) BETWEEN `ipstart` AND `ipend`", (self.ip,))
diff --git a/static/css/cyber.css b/static/css/cyber.css
index 3504641..39eee7a 100644
--- a/static/css/cyber.css
+++ b/static/css/cyber.css
@@ -52,10 +52,10 @@ input[type="submit"]:active {
   background: #1a1a1a;
   border-bottom: double 3px #989898;
   color: #989898;
-  margin: -10px -10px 0;
-  padding: 10px;
+  margin: -8px -8px 0;
+  padding: 8px;
 }
-.logo {
+#logo {
   color: #c00;
 }
 .replymode,
diff --git a/static/css/dickgirl.css b/static/css/dickgirl.css
index 9f3d4ec..da5b708 100644
--- a/static/css/dickgirl.css
+++ b/static/css/dickgirl.css
@@ -21,7 +21,7 @@ a:hover .name,
   margin: -8px -8px 0;
   padding: 8px;
 }
-.logo {
+#logo {
   color: #d3f8d3;
 }
 hr {
diff --git a/static/css/guro.css b/static/css/guro.css
index 1a74df4..cea75cf 100644
--- a/static/css/guro.css
+++ b/static/css/guro.css
@@ -19,7 +19,7 @@ a:hover .name b,
 .nav label:hover {
   color: #d00;
 }
-.logo {
+#logo {
   color: #af0a0f;
 }
 .replymode,
diff --git a/static/css/hotdog.css b/static/css/hotdog.css
index 81d271b..1e38749 100644
--- a/static/css/hotdog.css
+++ b/static/css/hotdog.css
@@ -108,8 +108,8 @@ input[type="submit"]:active, input[type="button"]:active{
   background:#fff;
   border-bottom:1px solid #000;
   color:#000;
-  margin:-10px -10px 0;
-  padding:10px
+  margin:-8px -8px 0;
+  padding:8px;
 }
 .managertable td{
   border:1px solid #000
diff --git a/static/css/ib.css b/static/css/ib.css
index 5118ebf..7ea910e 100644
--- a/static/css/ib.css
+++ b/static/css/ib.css
@@ -55,7 +55,7 @@ select,
 #search input {
   font-size: 85%;
 }
-.logo {
+#logo {
   font-size: 160%;
   font-weight: bold;
   margin: 8px 0;
@@ -294,7 +294,7 @@ body:not(.res) .thread.hidden > *,
   text-align: center;
   white-space: nowrap;
 }
-.footer {
+#footer {
   clear: both;
   margin-top: 8px;
   text-align: center;
@@ -309,12 +309,8 @@ body:not(.res) .thread.hidden > *,
 
 @media (max-width: 600px) {
   body {
-    font-size: 14px;
     padding: 4px;
   }
-  textarea {
-    font-size: 14px;
-  }
   #main_nav.mob {
     font-size: 12px;
     line-height: 1em;
@@ -380,6 +376,7 @@ body:not(.res) .thread.hidden > *,
     margin-left: 4px;
   }
   .thumb {
+    margin: 0 8px;
     max-width: 100px;
     max-height: 100px;
     object-fit: scale-down;
diff --git a/static/css/kraut.css b/static/css/kraut.css
index 5b7a862..ec1798a 100644
--- a/static/css/kraut.css
+++ b/static/css/kraut.css
@@ -27,8 +27,8 @@ a:hover .name,
 }
 #main_nav {
   background: #bbd;
-  margin: -10px -10px 0;
-  padding: 10px;
+  margin: -8px -8px 0;
+  padding: 8px;
 }
 .replymode,
 .extramode {
diff --git a/static/css/lavanda.css b/static/css/lavanda.css
index 3ba0b79..3ae7893 100644
--- a/static/css/lavanda.css
+++ b/static/css/lavanda.css
@@ -16,7 +16,7 @@ a:hover .name,
 .nav label:hover {
   color: rgb(221, 0, 129);
 }
-.logo {
+#logo {
   color: #ffccfc;
 }
 .replymode,
diff --git a/static/css/photon.css b/static/css/photon.css
index b7b487d..af8f539 100644
--- a/static/css/photon.css
+++ b/static/css/photon.css
@@ -10,7 +10,7 @@ body {
 a,
 a .name,
 a .name b,
-.logo,
+#logo,
 .nav label {
   color: #f60;
 }
diff --git a/static/css/putaba.css b/static/css/putaba.css
index 45152dc..f86cb4e 100644
--- a/static/css/putaba.css
+++ b/static/css/putaba.css
@@ -177,12 +177,12 @@ input[type="submit"].psei {
 .yt:hover {
   background: #efefef;
 }
-.footer {
+#footer {
   background: #000;
   color: #fff;
 }
-.footer a,
-.footer a:hover {
+#footer a,
+#footer a:hover {
   background: #000;
 }
 .quoted {
diff --git a/static/css/rene.css b/static/css/rene.css
index cc4a4c6..e13752b 100644
--- a/static/css/rene.css
+++ b/static/css/rene.css
@@ -20,8 +20,8 @@ a:hover .name,
 #main_nav {
   background: #d15014;
   color: #eee;
-  margin: -10px -10px 0;
-  padding: 10px;
+  margin: -8px -8px 0;
+  padding: 8px;
 }
 #main_nav a {
   color: #fff;
@@ -30,7 +30,7 @@ a:hover .name,
   color: #d15014;
   background: #fff;
 }
-.logo,
+#logo,
 .replymode,
 .extramode {
   color: #fff;
diff --git a/static/css/spc/material.css b/static/css/spc/material.css
index 02eb49e..cbae764 100644
--- a/static/css/spc/material.css
+++ b/static/css/spc/material.css
@@ -59,7 +59,7 @@ h2 span,
 .threadnav,
 hr,
 #size,
-.banner,
+#banner,
 .threadpage .postform br {
   display: none;
 }
diff --git a/static/css/spc/material_normal.css b/static/css/spc/material_normal.css
index 0c75456..7011925 100644
--- a/static/css/spc/material_normal.css
+++ b/static/css/spc/material_normal.css
@@ -56,7 +56,7 @@ h4 {
 }
 hr,
 #size,
-.banner,
+#banner,
 .threadpage .postform br {
   display: none;
 }
diff --git a/static/css/spc/navidad.css b/static/css/spc/navidad.css
index 19621bb..55177e4 100644
--- a/static/css/spc/navidad.css
+++ b/static/css/spc/navidad.css
@@ -20,7 +20,7 @@ a:hover {
   clear: both;
   float: right;
 }
-.logo {
+#logo {
   clear: both;
   text-align: center;
   font-size: 2em;
@@ -56,7 +56,7 @@ a:hover {
   color: #fff;
   font-weight: 800;
 }
-.footer {
+#footer {
   text-align: center;
   font-size: 12px;
   font-family: serif;
diff --git a/static/css/spc/valentin.css b/static/css/spc/valentin.css
index cf70219..5a96e5b 100644
--- a/static/css/spc/valentin.css
+++ b/static/css/spc/valentin.css
@@ -21,7 +21,7 @@ a:hover {
   clear: both;
   float: right;
 }
-.logo {
+#logo {
   clear: both;
   text-align: center;
   font-size: 2em;
@@ -57,7 +57,7 @@ a:hover {
   color: #2c5700;
   font-weight: 800;
 }
-.footer {
+#footer {
   text-align: center;
   font-size: 12px;
   font-family: serif;
diff --git a/static/css/spc/valentin2.css b/static/css/spc/valentin2.css
index 83f76d3..f908139 100644
--- a/static/css/spc/valentin2.css
+++ b/static/css/spc/valentin2.css
@@ -20,7 +20,7 @@ a:hover {
   clear: both;
   float: right;
 }
-.logo {
+#logo {
   clear: both;
   text-align: center;
   font-size: 2em;
@@ -58,7 +58,7 @@ a:hover {
   color: #666;
   font-weight: 800;
 }
-.footer {
+#footer {
   text-align: center;
   font-size: 12px;
   font-family: serif;
diff --git a/static/css/txt/amber.css b/static/css/txt/amber.css
index a7a1fc8..4f24254 100644
--- a/static/css/txt/amber.css
+++ b/static/css/txt/amber.css
@@ -44,7 +44,7 @@ h3:after {
 }
 h2,
 .thread .threadnav {
-  margin: 7px;
+  margin: 7px 7px 0;
 }
 h3 {
   margin: 8px 0;
diff --git a/static/css/txt/ayashii.css b/static/css/txt/ayashii.css
index bb981a9..6653a92 100644
--- a/static/css/txt/ayashii.css
+++ b/static/css/txt/ayashii.css
@@ -51,7 +51,7 @@ button {
   padding: 0 8px;
 }
 #main_nav,
-.banner {
+#banner {
   background: inherit;
   text-align: left;
   margin: 0;
@@ -162,7 +162,7 @@ form .msg {
     margin-right: 4px;
   }
   #main_nav,
-  .banner {
+  #banner {
     padding-left: 0;
   }
   h2 span {
diff --git a/static/css/txt/bbs.css b/static/css/txt/bbs.css
index a8a5a7b..622ab7e 100644
--- a/static/css/txt/bbs.css
+++ b/static/css/txt/bbs.css
@@ -77,12 +77,12 @@ button:active {
   background: #ccc;
   border-style: inset;
 }
-.banner {
+#banner {
   display: block;
   margin: 0 auto;
 }
 #rules {
-  margin: 0.5em 0;
+  margin: 0.5em 0 0 0;
 }
 code {
   font-size: 14px;
@@ -354,7 +354,7 @@ form .msg {
   body.threadpage {
     margin: 4px;
   }
-  .banner {
+  #banner {
     width: 100% !important;
     height: auto !important;
     margin-top: 1em;
diff --git a/static/css/txt/berries.css b/static/css/txt/berries.css
index 425f1ca..fd0e5a0 100644
--- a/static/css/txt/berries.css
+++ b/static/css/txt/berries.css
@@ -87,7 +87,7 @@ h4 {
   border-bottom: 1px solid #222;
   color: #7cafc2;
 }
-.banner {
+#banner {
   -webkit-filter: grayscale(60%);
   filter: grayscale(60%);
 }
diff --git a/static/css/txt/cuteanarchy.css b/static/css/txt/cuteanarchy.css
index 864cc40..a1d7935 100644
--- a/static/css/txt/cuteanarchy.css
+++ b/static/css/txt/cuteanarchy.css
@@ -84,7 +84,7 @@ h3 span {
   color: #7cafc2;
 }
 
-.banner {
+#banner {
   -webkit-filter: grayscale(60%);
   filter: grayscale(60%);
 }
diff --git a/static/css/txt/gamer.css b/static/css/txt/gamer.css
index 3079afe..9352597 100644
--- a/static/css/txt/gamer.css
+++ b/static/css/txt/gamer.css
@@ -175,7 +175,7 @@ form .msg {
 #threads td {
   color: #aaa;
 }
-.footer {
+#footer {
   color: #66B;
 }
 @media (max-width: 600px) {
diff --git a/static/css/txt/mercury.css b/static/css/txt/mercury.css
index 921ec7c..bc4273b 100644
--- a/static/css/txt/mercury.css
+++ b/static/css/txt/mercury.css
@@ -15,6 +15,9 @@ h2 a:active,
 #n2:active {
   color: #f48;
 }
+#main_nav {
+  background: #cce;
+}
 h2 a,
 h4,
 h4 a {
diff --git a/static/css/txt/void.css b/static/css/txt/void.css
index 5e9d431..38a49dc 100644
--- a/static/css/txt/void.css
+++ b/static/css/txt/void.css
@@ -11,7 +11,7 @@ body,
 #main_nav {
   background: #000;
 }
-.banner,
+#banner,
 .outerbox,
 .thread,
 #threads {
diff --git a/static/css/vndb.css b/static/css/vndb.css
index 90481f2..734bf5d 100644
--- a/static/css/vndb.css
+++ b/static/css/vndb.css
@@ -26,7 +26,7 @@ a:hover .name,
   border-bottom: none;
   text-decoration: underline;
 }
-.logo {
+#logo {
   color: #135;
   font-style: italic;
 }
@@ -110,8 +110,8 @@ hr {
   background: rgba(7, 28, 47, 0.8);
   border: 1px solid #258;
 }
-.footer,
-.footer a {
+#footer,
+#footer a {
   color: #247;
 }
 .quoted {
diff --git a/static/example/banner.jpg b/static/example/banner.jpg
new file mode 100644
index 0000000..1b87d92
Binary files /dev/null and b/static/example/banner.jpg differ
diff --git a/static/example/bbs1.html b/static/example/bbs1.html
new file mode 100644
index 0000000..fdf59ba
--- /dev/null
+++ b/static/example/bbs1.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="es">
+<head>
+  <title>Ejemplo de Bienvenido a Internet BBS</title>
+  <meta charset="utf-8">
+  <meta name="robots" content="noindex, nofollow" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <link rel="shortcut icon" href="/favicon.ico" />
+  <link rel="stylesheet" href="/static/css/txt/bbs.css" />
+  <link rel="stylesheet" id="css" href="/static/css/txt/futanari.css" />
+</head>
+<body class="mainpage">
+<div id="main_nav"><a href="#">Bienvenido a Internet</a> | <a href="#">Board 1</a> <a href="#">Board 2</a> <a href="#">Board 3</a></div>
+
+<img id="banner" src="/static/example/banner.jpg" style="width:420px;height:75px;">
+
+<div id="titlebox" class="outerbox">
+	<div class="innerbox">
+		<div class="threadnav"><a href="#">■</a><a href="#">▼</a></div>
+		<h1>Board 1@Bienvenido a Internet BBS</h1>
+		<div id="rules">Descripción del board.</div>
+	</div>
+	<div class="innerbox links"><a href="#"><b>Enlace 1</b></a> | <a href="#"><b>Enlace 2</b></a> | <a href="#"><b>Enlace 3</b></a></div>
+</div>
+
+<div class="thread">
+<div class="innerbox">
+  <div class="threadnav"><a href="#">■</a><a href="#">▲</a><a href="#">▼</a></div>
+  <h2><span>[1:3]</span><a href="#">Hilo de ejemplo</a></h2>
+  <div class="replies">
+    <div class="reply">
+      <h4>1 : <span class="name"><b>Sin Nombre</b></span> : <span class="date">01/09/93(mie)00:26:56 ID:BdsM7DCu0</span></h4>
+      <div class="msg">Mensaje de ejemplo.</div>
+    </div>
+    <div class="reply">
+      <h4>2 : <span class="name"><b>Sin Nombre</b> ◆Tripcode</span> : <span class="date">01/09/93(mie)00:30:40 ID:pBCyve6z0</span></h4>
+      <div class="msg">Mensaje de ejemplo.</div>
+    </div>
+    <div class="reply">
+      <h4>3 : <a href="#"><span class="name"><b>Sin Nombre</b></span></a> : <span class="date">01/09/93(mie)01:02:10 ID:UpB2akif4</span></h4>
+      <div class="msg">Mensaje de ejemplo.</div>
+    </div>
+  </div>
+	<form class="postform" name="postform" action="#">
+    <input type="submit" value="Responder"> <input type="button" name="preview" value="Previsualizar"> <span><span>Nombre:&nbsp;</span><input type="text" name="fielda" size="13"><span>&nbsp;E-mail:&nbsp;</span><input type="text" name="fieldb" size="13"></span>
+    <div class="formpad">
+      <textarea name="message" cols="70" rows="6"></textarea>
+      <div class="threadlinks">
+        <a href="#"><b>Hilo completo</b></a>
+        <a href="#"><b>Lista de hilos</b></a>
+        <a href="#"><b>Nuevo hilo</b></a>
+      </div>
+    </div>
+  </form>
+</div>
+</div>
+</body>
+</html>
diff --git a/static/example/bbs2.html b/static/example/bbs2.html
new file mode 100644
index 0000000..f9b4386
--- /dev/null
+++ b/static/example/bbs2.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="es">
+<head>
+  <title>Ejemplo de Bienvenido a Internet BBS</title>
+  <meta charset="utf-8">
+  <meta name="robots" content="noindex, nofollow" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <link rel="shortcut icon" href="/favicon.ico" />
+  <link rel="stylesheet" href="/static/css/txt/bbs.css" />
+  <link rel="stylesheet" id="css" href="/static/css/txt/futanari.css" />
+</head>
+<body class="threadpage">
+<div id="thread_nav">
+  <a href="#">Bienvenido a Internet</a>
+  <a href="#">■Volver al BBS■</a>
+  <a href="#">Hilo completo</a>
+  <a href="#">▼Bajar▼</a>
+</div>
+<hr />
+<div class="thread">
+  <h3>Hilo de ejemplo <span>(3 respuestas)</span></h3>
+  <div class="replies">
+    <div class="reply">
+      <h4>1 : <span class="name"><b>Sin Nombre</b></span> : <span class="date">01/09/93(mie)00:26:56 ID:BdsM7DCu0</span></h4>
+      <div class="msg">Mensaje de ejemplo.</div>
+    </div>
+    <div class="reply">
+      <h4>2 : <span class="name"><b>Sin Nombre</b> ◆Tripcode</span> : <span class="date">01/09/93(mie)00:30:40 ID:pBCyve6z0</span></h4>
+      <div class="msg">Mensaje de ejemplo.</div>
+    </div>
+    <div class="reply">
+      <h4>3 : <a href="#"><span class="name"><b>Sin Nombre</b></span></a> : <span class="date">01/09/93(mie)01:02:10 ID:UpB2akif4</span></h4>
+      <div class="msg">Mensaje de ejemplo.</div>
+    </div>
+  </div>
+	<div id="size">0 KB</div>
+</div>
+<hr />
+<div id="lastposts"><a href="#" id="n">Ver nuevos posts</a></div>
+<hr />
+<form class="postform" name="postform" action="#">
+	<div class="threadlinks">
+		<a href="#">■Volver al BBS■</a>
+		<a href="#">Hilo completo</a>
+		<a href="#">▲Subir▲</a>
+	</div>
+	<input type="submit" value="Responder"> <input type="button" name="preview" value="Previsualizar"> <span><span>Nombre:&nbsp;</span><input type="text" name="fielda" size="13"><span>&nbsp;E-mail:&nbsp;</span><input type="text" name="fieldb" size="13"></span>
+	<br />
+	<textarea name="message" cols="80" rows="7"></textarea>
+</form>
+</div>
+</body>
+</html>
diff --git a/static/example/ib1.html b/static/example/ib1.html
new file mode 100644
index 0000000..69c5865
--- /dev/null
+++ b/static/example/ib1.html
@@ -0,0 +1,97 @@
+<!DOCTYPE html>
+<html lang="es">
+<head>
+  <title>Ejemplo de B.a.I. IB</title>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <meta name="robots" content="noindex, nofollow" />
+  <link rel="shortcut icon" href="/favicon.ico" />
+  <link rel="stylesheet" href="/static/css/ib.css" />
+  <link rel="stylesheet" id="css" href="/static/css/dickgirl.css" />
+</head>
+<body>
+<div id="main_nav"><span>[<a href="#">Bienvenido a Internet</a>] [<a href="#">Board 1</a> <a href="#">Board 2</a> <a href="#">Board 3</a>]</span></div>
+
+<div id="logo">Board 1@B.a.I. IB</div>
+
+<hr width="90%" size="1">
+
+<div class="postarea">
+<form name="postform" id="postform" action="#">
+<table class="postform">
+  <tr>
+    <td class="postblock">Asunto</td>
+    <td>
+      <input type="text" name="subject" size="35">
+      <input type="submit" value="Crear hilo">
+    </td>
+  </tr>
+  <tr>
+    <td class="postblock">Mensaje</td>
+    <td><textarea name="message" cols="40" rows="6" style="height:80px"></textarea></td>
+  </tr>
+  <tr>
+    <td colspan="2" id="rules">
+    <ul>
+      <li>Descripción del board.</li>
+      <li><a href="#">Enlace 1</a> (<a href="#">Enlace 2</a>/<a href="#">Enlace 3</a>/<a href="#">Enlace 4</a>)</li>
+    </ul>
+    </td>
+  </tr>
+</table>
+</form>
+</div>
+
+<hr />
+
+<div class="thread">
+  <div class="fs">
+    <span>Nombre de archivo:</span><a href="#" class="expimg">1234567890.gif</a>-(4000 B, 200x260)
+    <small>Imagen miniatura</small> [<a href="#" class="tt">Ocultar hilo</a>]
+  </div>
+  <a href="#"><img class="thumb" src="/basura3.gif" width="192" height="250"></a>
+  <div class="info">
+    <label><input type="checkbox" name="delete" value="1"><span class="subj">Sin asunto</span></label>
+    <span class="name"><b>Sin Nombre</b></span>
+    <span class="date">01/09/93(mie)00:00:01</span>
+    <span class="reflink"><a href="#">No.</a><a href="#">123</a></span>
+    <a class="rep" href="#">rep</a>
+    [<a href="#" class="hsbn">Responder</a>]
+  </div>
+  <blockquote>Mensaje de ejemplo.</blockquote>
+  <table>
+    <tr>
+    <td class="ell">…</td>
+    <td class="reply">
+      <div class="info">
+        <label><input type="checkbox" name="delete" value="1"></label>
+        <span class="name"><b>Sin Nombre</b></span>
+        <span class="date">01/09/93(mie)02:17:49</span>
+        <span class="reflink"><a href="#">No.</a><a href="#">127</a></span>
+        <a class="rep" href="#">rep</a>
+      </div>
+      <blockquote>Mensaje de ejemplo.</blockquote>
+    </td>
+    </tr>
+  </table>
+  <table>
+    <tr>
+    <td class="ell">…</td>
+    <td class="reply">
+      <div class="info">
+        <label><input type="checkbox" name="delete" value="1"></label>
+        <a href="#"><span class="name"><b>Sin Nombre</b></span></a>
+        <span class="date">01/09/93(mie)02:55:36</span>
+        <span class="reflink"><a href="#">No.</a><a href="#">135</a></span>
+        <a class="rep" href="#">rep</a>
+      </div>
+      <blockquote>Mensaje de ejemplo.</blockquote>
+    </td>
+    </tr>
+  </table>
+</div>
+<div class="cut"></div>
+<hr />
+<div id="footer">- <a href="#">weabot</a> -</div>
+</body>
+</html>
diff --git a/static/js/userconf.js b/static/js/userconf.js
new file mode 100644
index 0000000..985090a
--- /dev/null
+++ b/static/js/userconf.js
@@ -0,0 +1,114 @@
+var request = new XMLHttpRequest();
+
+function cargarEstilos() {
+  var api = '/cgi/api/styles';
+  request.open("GET", api, true);
+  request.send();
+}
+
+function listarEstilos(id, estilos, def) {
+	var select = document.getElementById(id);
+
+	for (var i=0; i < estilos.length; i++) {
+		var opt = document.createElement('option');
+		opt.value = estilos[i];
+		opt.textContent = estilos[i];
+		if (i == def) {
+			opt.selected = true;
+		}
+		select.appendChild(opt);
+	}
+}
+
+request.onreadystatechange = function() {
+  if (request.readyState == 4) {
+    var json = JSON.parse(request.responseText);
+    if (json.state == "success") {
+			listarEstilos('stylebbs', json.bbs_styles, json.bbs_styles_default);
+			listarEstilos('styleib', json.ib_styles, json.ib_styles_default);
+    }
+  }
+};
+
+function cambiarModo(e) {
+  var iframe = document.getElementById('examplebbs');
+  var estilo = document.getElementById('stylebbs').value;
+
+  if (this.dataset.view == '1') {
+    iframe.addEventListener('load', mostrarEstilo);
+    iframe.src = '/static/example/bbs2.html';
+    this.value = 'Ver modo frontal';
+    this.dataset.view = '2';
+  } else {
+    iframe.src = '/static/example/bbs1.html';
+    this.value = 'Ver modo respuesta';
+    this.dataset.view = '1';
+  }
+}
+
+function mostrarEstilo(e) {
+  var tipo = e.target.dataset.type;
+  if (e.target.tagName.toLowerCase() == 'iframe') {
+    var estilo = document.getElementById(('style'+tipo)).value;
+    var iframe = e.target;
+  } else {
+    var estilo = e.target.value;
+    var id = "example" + tipo;
+    var iframe = document.getElementById(id);
+  }
+
+  var css = iframe.contentDocument.getElementById('css');
+  var loc = "/static/css/";
+  if (tipo == 'bbs') {
+    loc += 'txt/';
+  }
+
+  css.href = loc + estilo.toLowerCase() + ".css";
+}
+
+function cargariframe(tipo) {
+  var iframe = document.createElement('iframe');
+  iframe.id = 'example' + tipo;
+  iframe.dataset.type = tipo;
+  iframe.addEventListener('load', cargarDatos);
+  iframe.src = '/static/example/' + tipo + '1.html';
+  var div = document.getElementById("desc" + tipo);
+  div.appendChild(document.createElement("br"));
+  div.appendChild(iframe);
+}
+
+function cargarDatos(e) {
+  var tipo = this.dataset.type;
+  var key = 'weabot_style_' + tipo;
+  if (localStorage.hasOwnProperty(key)) {
+    var estilo = localStorage.getItem(key);
+    document.getElementById(('style'+tipo)).value = estilo;
+    mostrarEstilo(e);
+    this.tabIndex = -1;
+  }
+  this.removeEventListener('load', cargarDatos);
+}
+
+function establecerEstilo(e) {
+  var key = e.target.dataset.key;
+}
+
+function init(tipo) {
+  cargariframe(tipo);
+  document.getElementById('style'+tipo).addEventListener('change', mostrarEstilo);
+  document.getElementById('set'+tipo).addEventListener('click', function() {
+    var key = 'weabot_style_' + tipo;
+    var estilo = document.getElementById(('style'+tipo)).value;
+    localStorage.setItem(key, estilo);
+  });
+}
+
+document.addEventListener("DOMContentLoaded", function() {
+  document.getElementById("escondeme").style.display = 'none';
+
+  cargarEstilos();
+
+  document.getElementById('switchview').addEventListener('click', cambiarModo);
+  init('bbs');
+  init('ib');
+});
diff --git a/static/js/weabotxt.js b/static/js/weabotxt.js
index 2c93105..27d3cda 100644
--- a/static/js/weabotxt.js
+++ b/static/js/weabotxt.js
@@ -1,4 +1,4 @@
-var style_cookie = "weabot_style_txt";
+var style_cookie = "weabot_style_bbs";
 if (localStorage.hasOwnProperty(style_cookie)) {
   setTheme(localStorage.getItem(style_cookie));
 }
-- 
cgit v1.2.1-18-gbd029