www/index.html

   1 <!DOCTYPE html>
   2 <!-- Blerg is (C) 2011 The Dominion of Awesome, and is distributed under a
   3      BSD-style license.  Please see the COPYING file for details.
   4   -->
   5 <html>
   6 <head>
   7 <title>Blërg!</title>
   8 <link rel="stylesheet" href="css/blerg.css">
   9 <script type="text/javascript" src="js/prototype.js"></script>
  10 <script type="text/javascript" src="js/blerg.js"></script>
  11 <meta http-equiv="content-type" content="text/html; charset=utf-8">
  12 <meta name="viewport" content="width=device-width, user-scalable=no, maximum-scale=1.0"/>
  13 </head>
  14 <body onload="init()">
  15
  16 <div id="header">
  17   <div id="siteid">
  18     <img src="/images/blerglogo.png" class="logo" width="125" height="122">
  19     <h1><a href="/">Blërg!</a></h1>
  20     <h2><span name="section">Welcome</span></h2>
  21   </div>
  22   <div id="controls">
  23     <form style="font-size: small" id="login" onsubmit="loginStatus.login($('login.username').value, $('login.password').value); return false">
  24       username: <input type="text" id="login.username" size="10">
  25       password: <input type="password" id="login.password" size="10">
  26       <input type="submit" value="login">
  27       <p style="font-size: large"><a href="#" onclick="$('welcome').hide(); $('items').hide(); $('post').hide(); $('signup').show(); return false;">I want to blërg!</a></p>
  28     </form>
  29     <div id="logout" style="display: none">
  30       Hello, <a href="#" id="userlink"></a>. <a href="#" onclick="loginStatus.logout(); return false">logout</a><br>
  31       <a href="#" onclick="postPopup(); return false">Write new entry</a><br>
  32       <a href="#" id="reflink">Chatter about me</a>
  33     </div>
  34     <div id="rss" style="display:none"><a id="rsslink" href=""><img src="/images/rss.png" width="16" height="16"> RSS</a></div>
  35   </div>
  36   <div style="clear:both"></div>
  37   <div id="post" style="display:none">
  38     <h2>What's on your mind?</h2>
  39     <form onsubmit="loginStatus.post($('post.content').value); return false">
  40       <textarea rows="3" id="post.content" onkeydown="resizePostContent()"></textarea>
  41       <div id="post.buttons">
  42         <input type="submit" value="close" onclick="$('post').hide(); return false">
  43         <input type="submit" value="post">
  44       </div>
  45     </form>
  46   </div>
  47 </div>
  48
  49
  50 <div id="main">
  51   <div id="items" style="display:none">
  52   </div>
  53
  54   <div id="welcome">
  55   <h2>I am 12 and what is this</h2>
  56
  57   <p>Blërg is a miniblogging platform.  It's less limited than
  58   microblogging platforms like <a
  59   href="http://twitter.com/">Twitter</a>, but much simpler than
  60   full-blown blogging platforms like <a
  61   href="http://wordpress.com/">Wordpress</a> or <a
  62   href="http://livejournal.com/">Livejournal</a>.  Blërg is also an open
  63   source tagged text database engine written in C that does the back-end
  64   work.</p>
  65
  66   <h2>But what's wrong with Twitter?</h2>
  67
  68   <p>I'M GLAD YOU ASKED. While I don't believe the basic social premise
  69   of Twitter is broken, there are two facets of it that are IMNSHO just
  70   wrong:</p>
  71
  72   <ol>
  73   <li><strong>Ruby on Rails</strong> - Using rails to prototype a system is
  74   fine &mdash; scaling up to a million hits a day with it is just poor
  75   engineering. As the service grew, I'm sure it cost them a lot more
  76   time than it saved.</li>
  77   <li><strong>140 characters is not enough</strong> - I routinely write
  78   sentences longer than 140 characters, so I can't imagine even beginning to
  79   make a point in such a small space.  This textual confinement has led to the
  80   rise of URL shorteners, which are <a
  81   href="http://bytex64.net/blog/e2256">breaking the internet</a>.
  82   </ol>
  83
  84   <p>Blërg solves these problems by applying absurd reactionary
  85   engineering. Blërg's database backend is a custom C program that
  86   handles requests over HTTP and stores data in a very small and
  87   efficient indexed log-structured database. The frontend is done
  88   entirely in client-side Javascript. A single post can be up to 65535
  89   bytes in length.</p>
  90
  91   <p>Which is not to say that I believe writing your service in C is the
  92   solution to all your problems.  Clearly, this approach has just as
  93   many hairy problems that will bite you in the ass sooner or later.
  94   The best way, as with most things, lies somewhere in the middle of
  95   high-level abstraction and ZOMGHARDCORE OPTIMIZATION.</p>
  96
  97   <h2>Is this a joke?</h2>
  98
  99   <p>Yes. No. Maybe.  Blërg is an exercise in constructive satire &mdash; a
 100   fully functional service created in a fit of hubris to poke fun at Twitter's
 101   engineering.  It's just for fun, but no one is going to keep you from using
 102   it seriously. :]</p>
 103   </div>
 104
 105   <div id="navigation">
 106     <a id="newer_link" href="#" onclick="newer_page(); return false" style="display:none">&lt;&lt; newer</a>
 107     <a id="older_link" href="#" onclick="older_page(); return false" style="display:none">older &gt;&gt;</a>
 108   </div>
 109
 110   <div id="signup" style="display:none">
 111     <h2>Sign Up</h2>
 112     <table>
 113       <tr><td>Username:</td><td><input type="text" id="signup.username" width="40"></td>
 114       <tr><td>Password:</td><td><input type="password" id="signup.password" width="40"></td>
 115     </table>
 116     <button onclick="signup()">Signup</button> <button onclick="signup_cancel()">Cancel</button>
 117   </div>
 118 </div>
 119
 120 </body>
 121 </html>