@@ -159,6 +159,23 @@ div.comment {

         border-bottom: 1px solid #ddd;

 }

+div.commentheader {

+        margin: 10px;

+}

+

+span.commentauthor {

+        font-size: 18px;

+        float: left;

+}

+

+span.commentdate {

+        float: right;

+}

+

+div.commenttext {

+        margin: 5px 30px 10px;

+}

+

 p.commentbox {

         margin: 0px;

         padding: 0px;

@@ -201,3 +218,23 @@ input.inputsendcomment:active {

         color: #eee;

 }

+div#prevnext {

+        width: 820px;

+        margin-left: auto;

+        margin-right: auto;

+        margin-top: 15px;

+        margin-bottom: 10px;

+        padding: 10px;

+}

+

+a.pagenum {

+        text-decoration: none;

+}

+

+span.paginas {

+        float: left;

+}

+

+span.newerolder {

+        float: right;

+}

@@ -17,8 +17,16 @@ function request(querytext, func, errorfunc) {

         req.send();

 }

+function getvar(name) {

+        var re=new RegExp("[?&]"+name+"=\([^&]*\)");

+        var value=window.location.search.match(re);

+        if(value===null || value.length<2)

+                return(name+"=");

+        return(name+"="+value[1]);

+}

+

 gotonewpost.onclick = function(e) {

-        window.location="/newpost.html"+window.location.search

+        window.location="/newpost.html?"+getvar("s");

 };

 document.getElementById("posts").innerHTML='Loading posts...';

@@ -55,15 +63,16 @@ function changepost(postnum,data) {

         for(var i in p.comments) {

                 var c=p.comments[i];

                 comments.push('<div class="comment">');

-                comments.push('<p class="commentheader">');

+                comments.push('<div class="commentheader">');

                 var commentdate=new Date(0);

                 commentdate.setUTCSeconds(parseInt(c.date));

+                comments.push('<span class="commentauthor">');

                 comments.push(decodeURIComponent(c.author));

-                comments.push(" ");

+                comments.push('</span>&nbsp;<span class="commentdate">');

                 comments.push(commentdate.toString());

-                comments.push('</p><p>');

+                comments.push('</span></div><div class="commenttext">');

                 comments.push(decodeURIComponent(c.text));

-                comments.push('</p>');

+                comments.push('</div>');

                 comments.push('</div>');

         }

         comments.push('<div class="commentbox"><p class="commentbox">');

@@ -73,8 +82,8 @@ function changepost(postnum,data) {

         postsarray[toppost-postnum]='<div class="post">'+header.join("")+body.join("")+'</div>'+comments.join("") /*+JSON.stringify(p) */;

         functionsarray[toppost-postnum]=function() {

                 var requri=[];

-                requri.push("/newcomment");

-                requri.push(window.location.search);

+                requri.push("/newcomment?");

+                requri.push(getvar("s"));

                 requri.push("&n="+postnum);

                 requri.push("&t=");

                 requri.push(encodeURIComponent(document.getElementById("comment"+(toppost-postnum)).value));

@@ -107,7 +116,7 @@ function displayposts() {

 }

 function refreshpost(postnum) {

-        request("/getpost"+window.location.search+"&n="+postnum, function(r1) {

+        request("/getpost?"+getvar("s")+"&n="+postnum, function(r1) {

                 changepost(postnum,r1);

                 displayposts();

         },function() {

@@ -115,12 +124,79 @@ function refreshpost(postnum) {

         });

 }

+function refreshprevnext() {

+        var nav=[];

+        var curpage;

+        var totalpages;

+        var inc;

+        var maxinc=(Number(lastpost)/postsperpage)/2;

+        nav.push('<span class="paginas">P&aacute;gina:');

+        curpage=Math.floor(((Number(lastpost)-Number(toppost))/postsperpage))+1;

+        totalpages=Math.floor((Number(lastpost)-1)/postsperpage)+1;

+        for(var page=1;(Number(lastpost)-(page-1)*postsperpage)>0;page+=inc) {

+                if(Number(toppost)<=(Number(lastpost)-(page-1)*postsperpage) &&

+                   Number(toppost)>(Number(lastpost)-(page)*postsperpage)) {

+                        nav.push(" "+page);

+                } else {

+                        nav.push(' <a href="');

+                        nav.push('/posts.html?');

+                        nav.push(getvar("s"));

+                        if(page>1) {

+                                nav.push('&p=');

+                                nav.push(Number(toppost)-(page-1)*postsperpage);

+                        }

+                        nav.push('" class="pagenum">');

+                        nav.push(page);

+                        nav.push('</a>');

+                }

+                if(Math.abs(curpage-page)<5) {

+                        inc=1;

+                } else {

+                        inc=Math.floor((Math.abs(curpage-page)/totalpages)*maxinc);

+                        inc=(inc<=0)?1:inc;

+                        if(page<totalpages && (page+inc)>totalpages)

+                                inc=totalpages-page;

+                }

+        }

+        nav.push('</span> ');

+        nav.push('<span class="newerolder">');

+        if(toppost<lastpost) {

+                nav.push(' <a href="');

+                nav.push('/posts.html?');

+                nav.push(getvar("s"));

+                if((Number(toppost)+Number(postsperpage))<lastpost) {

+                        nav.push('&p=');

+                        nav.push(Number(toppost)+Number(postsperpage));

+                }

+                nav.push('" class="pagenum">Posts m&aacute;s nuevos</a>');

+        } else

+                nav.push("Posts más nuevos");

+        nav.push(" | ");

+        if((Number(toppost)-Number(postsperpage))>0) {

+                nav.push(' <a href="');

+                nav.push('/posts.html?');

+                nav.push(getvar("s"));

+                nav.push('&p=');

+                nav.push(Number(toppost)-Number(postsperpage));

+                nav.push('" class="pagenum">Posts m&aacute;s antiguos</a>');

+        } else

+                nav.push('Posts más antiguos');

+        nav.push('</span>');

+        document.getElementById("prevnext").innerHTML=nav.join("");

+}

-request("/lastpost"+window.location.search,function(r) {

+request("/lastpost?"+getvar("s"),function(r) {

+        var p;

         lastpost=r;

-        toppost=r;

+        toppost=r

+        p=getvar("p");

+        if(p.length>2)

+                toppost=Number(p.slice(2));

+        if(toppost<0 || toppost>lastpost)

+                toppost=lastpost;

+        refreshprevnext();

         for(var i=0;i<postsperpage;i++)

-                refreshpost(r-i);

+                refreshpost(toppost-i);

 },function() {

         document.getElementById("posts").innerHTML='There are no posts';

 });

new file mode 100644

@@ -0,0 +1,7 @@

+/*

+Copyright (c) 2011, Yahoo! Inc. All rights reserved.

+Code licensed under the BSD License:

+http://developer.yahoo.com/yui/license.html

+version: 2.9.0

+*/

+html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,button,caption,cite,code,dfn,em,input,optgroup,option,select,strong,textarea,th,var{font:inherit}del,ins{text-decoration:none}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:baseline}sub{vertical-align:baseline}legend{color:#000}

\ No newline at end of file