First stab at enyo rewrite
Rearchitected the way view loading works. Changed login box to be enyo-ish.
Made enyo dialog signup. Made Welcome page way more obnoxious. No API is
hooked up yet, though.
border: 0;
}
-#header {
+.blerg-header {
background-color: #1E1E1E;
color: white;
padding: 8px 8px 16px 8px;
}
-#header .logo {
+.blerg-header .logo {
float: left;
margin-right: 10px;
}
-#header h1 {
+.blerg-header h1 {
margin: 4px 0 0 0;
font-size: 65px;
text-shadow: black 0px 2px;
}
-#header a {
+.blerg-header a {
color: inherit;
text-decoration: none;
}
-#header a:hover {
+.blerg-header a:hover {
text-decoration: underline;
}
-#header h2 {
+.blerg-header h2 {
margin: 0;
font-size: 28px;
text-shadow: black 0px 1px;
}
-#siteid {
- float: left;
- width: 40%;
-}
-
-#controls {
+.blerg-controls {
float: right;
width: 50%;
margin-top: 8px;
font-family: "Alte Haas Grotesk Bold", sans-serif;
}
-#main {
+.blerg-main {
padding: 15pt 15pt 20pt 15pt;
}
-#signup {
- padding: 8pt;
-}
-
-#main h2, #signup h2, #about h2 {
+.blerg-main h2 {
margin: 8pt 0;
}
-#post {
+.blerg-post {
padding: 20pt 20pt 16pt 20pt;
}
-#post h2 {
+.blerg-post h2 {
font-size: 14pt;
- margin: 4pt 0 0 -4px;
+ margin: 0;
}
-#post\.buttons {
+.blerg-post .buttons {
text-align: right;
- margin-right: -4px;
}
-#post\.buttons input {
- font-size: 14pt;
+.blerg-post .buttons .onyx-button {
+ margin-left: 4pt;
+ height: 0.4in;
+ width: 1in;
+}
+
+.blerg-post .onyx-input-decorator {
+ display: block;
+ border-color: #CCC;
+ margin: 4pt 0;
}
-#post\.content {
+.blerg-post .onyx-textarea {
+ display: block;
+ width: 100%;
+}
+
+.blerg-post .content {
font-size: 14pt;
font-family: sans-serif;
- margin: 4pt 0 4pt -4px;
- border-width: 0;
- padding: 4px;
+}
+
+.login {
+ display: inline-block;
+ width: 200px;
+}
+
+.login .onyx-button {
+ width: 100%;
+ margin-top: 4pt;
+}
+
+.login .enyo-input {
width: 100%;
}
padding-left: 6px;
margin-left: 2px;
}
+
+.blerg-dialog {
+ width: 300px;
+ padding: 8px;
+}
+
+.blerg-dialog h2 {
+ font-size: 14pt;
+ margin: 0;
+}
+
+.blerg-dialog .onyx-groupbox {
+ margin: 8px 0;
+}
+
+.blerg-dialog .onyx-button {
+ display: block;
+ margin: 8px 0 0 0;
+ width: 100%;
+}
+
+.blerg-dialog .onyx-input {
+ width: 100%;
+}
<head>
<title>Blërg!</title>
<link rel="stylesheet" href="css/blerg.css">
-<script type="text/javascript" src="js/prototype.js"></script>
-<script type="text/javascript" src="js/Bytex64.FX.js"></script>
-<script type="text/javascript" src="js/blerg.js"></script>
-<script type="text/javascript" src="js/blergmedia.js"></script>
+<!-- enyo dev -->
+<script type="text/javascript" src="jssrc/enyo/enyo.js"></script>
+<script type="text/javascript" src="jssrc/package.js"></script>
+
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, maximum-scale=1.0"/>
</head>
-<body onload="init()">
+<body>
+<script type="text/javascript">
+//new blerg.Blerg({}).renderInto(document.body);
+new blerg.Blerg({}).write();
+</script>
+<!--
<div id="header">
<div id="siteid">
<img src="images/blerglogo.png" class="logo" width="125" height="122">
<div id="items" style="display:none">
</div>
- <div id="welcome" style="display:none">
-
- <div id="latest">
- <h2>Latest posts</h2>
- <div id="latest-posts"></div>
- <h2>Latest tags</h2>
- <div id="latest-tags"></div>
- </div>
-
- <h2>I am 12 and what is this</h2>
-
- <p>Blërg is a microblogging platform. Or maybe a miniblogging
- platform. Blërg is not sure. Blërg is a lot like <a
- href="http://twitter.com/">Twitter</a>, but aims to fix some of its
- idiosyncracies. Blërg does not want to be a full blogging platform
- like <a href="http://wordpress.com/">Wordpress</a> or <a
- href="http://livejournal.com/">Livejournal</a>. Blërg is also an <a
- href="/doc/">open source tagged text database engine</a> written in C
- that does the back-end work. Blërg's author finds it entertaining to
- anthropomorphize Blërg in the third person.</p>
-
- <h2>But what's wrong with Twitter?</h2>
-
- <p>I'M GLAD YOU ASKED. There are two aspects of Twitter that just bug
- me as an engineer:</p>
-
- <ol>
- <li><strong>Ruby on Rails</strong> - Using rails to prototype a system is
- fine — scaling up to a million hits a day with it is just a bad
- idea. As the service grew, I'm sure it cost them a lot more time than
- it saved.</li>
- <li><strong>140 characters is not enough</strong> - I routinely write
- sentences longer than 140 characters, so I can't even begin to imagine
- making a point in such a small space. This textual confinement has
- led to the rise of URL shorteners, which are <a
- href="http://bytex64.net/blog/e2256">breaking the internet</a>.
- </ol>
-
- <p>Blërg solves these problems by applying absurd reactionary
- engineering. Blërg's database backend is a custom C program that
- handles requests over HTTP and stores data in a very small and
- efficient indexed log-structured database. The frontend is done
- entirely in client-side Javascript. A single post can be up to 65535
- bytes in length.</p>
-
- <p>Which is not to say that I believe writing your service in C is the
- solution to all your problems. Clearly, this approach has just as
- many hairy problems that will bite you in the ass sooner or later.
- The best way, as with most things, lies somewhere in the middle of
- high-level abstraction and ZOMGHARDCORE OPTIMIZATION.</p>
-
- <h2>Is this a joke?</h2>
-
- <p>Yes. No. Maybe. Blërg is an exercise in constructive satire — a
- fully functional service created in a fit of hubris to poke fun at Twitter's
- engineering. It's just for fun, but no one is going to keep you from using
- it seriously. :]</p>
-
- <h2>Tell me more about this database engine.</h2>
-
- <p>Here, take a look at the <a href="/doc/#design">design docs</a>.</p>
-
- <h2>I'm a social media whore and I want to share links!</h2>
-
- <p>I've created a bookmarklet just for you: <a href="javascript:location.href='http://blerg.dominionofawesome.com/?post/'+encodeURIComponent(document.title)+'/'+encodeURIComponent(location.href)">Blërg it!</a></p>
-
- </div>
-
<div id="navigation">
<a id="newer_link" href="#" onclick="return qlink()" style="display:none"><< newer</a>
<a id="older_link" href="#" onclick="return qlink()" style="display:none">older >></a>
</div>
</div>
+-->
</body>
</html>
return false;
}
-function Welcome() {
- loadLatest();
-}
-
-Welcome.prototype.show = function() {
- $$('[name=section]').each(function(v) { v.update('Welcome') });
- $('welcome').show();
-}
-
-Welcome.prototype.hide = function() {
- stopTicker();
- $('welcome').hide();
-}
-
-Welcome.prototype.updateState = function() {
- this.show();
-}
-
function ExternalURLPost(m) {
this.title = decodeURIComponent(m[1]).replace(']','').replace('[','');
this.url = decodeURIComponent(m[2]);
$('post.content').value = '[' + this.title + '](' + this.url + ')';
$('post').show();
}
-
-var urlmap = [
- ['search', /^\?post\/([^/]+)\/(.+)/, ExternalURLPost],
- ['hash', /^#\/(ref|tag)\/([A-Za-z0-9_-]+)(?:\/p(\d+))?$/, Tag],
- ['hash', /^#\/feed(?:\/p(\d+))?$/, Feed],
- ['hash', /^#([A-Za-z0-9_-]+)(?:\/(p)?(\d+))?$/, User]
-];
-
-function urlSwitch() {
- var m;
- var pageconstructor;
-
- for (var i = 0; i < urlmap.length; i++) {
- if (m = location[urlmap[i][0]].match(urlmap[i][1])) {
- pageconstructor = urlmap[i][2];
- break;
- }
- }
- if (i == urlmap.length)
- pageconstructor = Welcome;
-
- if (currentPager && currentPager instanceof pageconstructor) {
- // updateState returns true if the state has been successfully updated.
- // Otherwise, we continue and create a new instance.
- if (currentPager.updateState(m))
- return;
- }
-
- if (currentPager && currentPager.hide)
- currentPager.hide();
-
- currentPager = new pageconstructor(m);
- if (currentPager.show)
- currentPager.show();
-}
-
-var lastHash;
-function hashCheck() {
- if (location.hash != lastHash) {
- lastHash = location.hash;
- urlSwitch();
- }
-}
-
-function init() {
- items = $('items');
- loginStatus = new LoginStatus();
-
- lastHash = location.hash;
- urlSwitch();
-
- setInterval(hashCheck, 250);
-
- document.body.observe('keyup', function(event) {
- if (event.shiftKey && event.keyCode == 32) {
- postPopup();
- event.stop();
- }
- });
- $('post.content').addEventListener('keyup', function(event) {
- event.stopPropagation();
- }, true);
-}
+enyo.kind({
+ name: "blerg.API",
+ create: function() {
+ this.inherited(arguments);
+ }
+});
+enyo.kind({
+ name: "blerg.Blerg",
+ kind: "Control",
+ lastHash: null,
+ handlers: {
+ onStartSignup: "showSignupDialog",
+ onTryLogin: "tryLogin",
+ onSetTitle: "setTitle"
+ },
+ components: [
+ {classes: "blerg-header", components: [
+ {kind: "blerg.Title"},
+ {kind: "blerg.Controls"},
+ {style: "clear: both"},
+ {name: "post", kind: "blerg.Post", showing: false},
+ {name: "help", kind: "blerg.Help"}
+ ]},
+ {name: "main", kind: "blerg.Main"},
+ {name: "signupDialog", kind: "blerg.SignupDialog"},
+ {name: "passwdDialog", kind: "blerg.PasswdDialog"}
+ ],
+ urlmap: [
+ ['search', /^\?post\/([^/]+)\/(.+)/, "blerg.ExternalURLPost"],
+ ['hash', /^#\/(ref|tag)\/([A-Za-z0-9_-]+)(?:\/p(\d+))?$/, "blerg.Tag"],
+ ['hash', /^#\/feed(?:\/p(\d+))?$/, "blerg.Feed"],
+ ['hash', /^#([A-Za-z0-9_-]+)(?:\/(p)?(\d+))?$/, "blerg.User"]
+ ],
+ pathHandlers: [ blerg.Welcome ],
+ rendered: function() {
+ this.inherited(arguments);
+
+ this.lastHash = location.hash;
+ this.urlSwitch();
+
+ //setInterval(this.hashCheck.bind(this), 250);
+
+ document.body.addEventListener('keyup', function(event) {
+ if (event.shiftKey && event.keyCode == 32) {
+ this.$.post.show();
+ event.stopPropagation();
+ }
+ }, false);
+ },
+ hashCheck: function() {
+ if (location.hash != this.lastHash) {
+ this.lastHash = location.hash;
+ this.urlSwitch();
+ }
+ },
+ urlSwitch: function() {
+ var m;
+ var objdef = null;
+
+ for (var i = 0; i < this.pathHandlers.length; i++) {
+ var handler = this.pathHandlers[i];
+ objdef = handler.locationDetect(window.location);
+ if (objdef)
+ break;
+ }
+ if (!objdef)
+ objdef = {classes: "blerg-error", content: "No handler found"}
+
+ this.$.main.updateView(objdef);
+ },
+ showSignupDialog: function() {
+ this.$.signupDialog.show();
+ },
+ setTitle: function(inSender, inEvent) {
+ if (inEvent.section != undefined)
+ this.$.title.setSection(inEvent.section);
+
+ if (inEvent.subscribed != undefined)
+ this.$.title.setSubscribed(inEvent.subscribed);
+
+ if (inEvent.showControls)
+ this.$.title.showControls()
+ else
+ this.$.title.hideControls();
+ },
+ tryLogin: function(inSender, inEvent) {
+ }
+});
+enyo.kind({
+ name: "blerg.Controls",
+ kind: "Control",
+ style: "float: right",
+ classes: "blerg-controls",
+ published: {
+ loggedIn: false
+ },
+ components: [
+ {name: "loggedOutControls", components: [
+ {tag: "form", onsubmit: "doLogin", classes: "login", components: [
+ {kind: "onyx.Groupbox", components: [
+ {kind: "onyx.InputDecorator", components: [
+ {name: "username", kind: "onyx.Input", placeholder: "Username"}
+ ]},
+ {kind: "onyx.InputDecorator", components: [
+ {name: "password", kind: "onyx.Input", placeholder: "Password", type: "password"}
+ ]},
+ ]},
+ {kind: "onyx.Button", content: "Login", onclick: "doLogin"}
+ ]}
+ ]},
+ {name: "loggedInControls", showing: false, components: [
+ {name: "greeting"},
+ {kind: "onyx.Toolbar", components: [
+ {kind: "onyx.Button", content: "Write", onClick: "writeClicked"},
+ {kind: "onyx.Button", content: "Hearsay", onClick: "chatterClicked"},
+ {kind: "onyx.Button", content: "Stalking", onClick: "feedClicked"}
+ ]},
+ {components: [
+ {name: "rssButton", showing: false, kind: "blerg.Link", components: [
+ {kind: "Image", src: "/images/rss.png", width: 16, height: 16},
+ {noDom: true, content: " RSS"}
+ ]}
+ ]}
+ ]}
+ ],
+ showRSS: function(url) {
+ this.$.rssButton.show();
+ if (url)
+ this.$.rssButton.setAttribute('href', url);
+ },
+ hideRSS: function() {
+ this.$.rssButton.hide();
+ },
+ loggedInChanged: function() {
+ if (this.loggedIn) {
+ this.$.loggedOutControls.hide();
+ this.$.loggedInControls.show();
+ } else {
+ this.$.loggedOutControls.show();
+ this.$.loggedInControls.hide();
+ }
+ },
+ doLogin: function() {
+ this.bubble('onTryLogin', {
+ username: this.$.username.getValue(),
+ password: this.$.password.getValue()
+ });
+ }
+});
+enyo.kind({
+ name: "blerg.Help",
+ kind: "Control",
+ components: [
+ ]
+});
+enyo.kind({
+ name: "blerg.Link",
+ tag: "a",
+ attributes: {href:"#"}
+});
+enyo.kind({
+ name: "blerg.Main",
+ kind: "Control",
+ classes: "blerg-main",
+ currentView: null,
+ updateView: function(objdef) {
+ if (!this.currentView || this.currentView.kind != this.currentView.kind) {
+ this.destroyComponents();
+ this.currentView = this.createComponent(objdef);
+ this.currentView.render();
+ } else {
+ for (var i in objdef)
+ this.currentView.setProperty(i, objdef[i])
+ }
+ }
+});
+enyo.kind({
+ name: "blerg.PasswdDialog",
+ kind: "onyx.Popup",
+ classes: "blerg-dialog",
+ autoDismiss: true,
+ centered: true,
+ floating: true,
+ modal: true,
+ components: [
+ {tag: "h2", content: "Sign Up"},
+ {kind: "onyx.Groupbox", components: [
+ {kind: "onyx.InputDecorator", components: [
+ {name: "password1", kind: "onyx.Input", placeholder: "Username", type: "password"}
+ ]},
+ {kind: "onyx.InputDecorator", components: [
+ {name: "password2", kind: "onyx.Input", placeholder: "Password", type: "password"}
+ ]}
+ ]},
+ {kind: "onyx.Button", content: "Change", onclick: "changeClick", classes: "onyx.affirmative"},
+ {kind: "onyx.Button", content: "Cancel", onclick: "cancelClick", classes: "onyx-negative"}
+ ],
+ changeClick: function() {
+ // Do stuff
+ },
+ cancelClick: function() {
+ this.hide();
+ }
+});
+enyo.kind({
+ name: "blerg.Post",
+ kind: "Control",
+ classes: "blerg-post",
+ components: [
+ {tag: "h2", content: "What's on your mind?"},
+ {kind: "onyx.InputDecorator", components: [
+ {name: "postContent", classes: "content", kind: "onyx.TextArea", onkeydown: "resizePostContent"}
+ ]},
+ {classes: "buttons", components: [
+ {kind: "onyx.Button", content: "Close", onclick: "closePost", classes: "onyx-negative"},
+ {kind: "onyx.Button", content: "Post", onclick: "doPost", classes: "onyx-affirmative"}
+ ]}
+ ],
+ getData: function() {
+ return this.$.postContent.getValue();
+ },
+ setData: function(inVal) {
+ this.$.postContent.setValue(inVal);
+ },
+ closePost: function() {
+ this.hide();
+ },
+ doPost: function() {
+ this.bubble('onPost', {data: this.getData()});
+ }
+});
+enyo.kind({
+ name: "blerg.SignupDialog",
+ kind: "onyx.Popup",
+ classes: "blerg-dialog",
+ autoDismiss: true,
+ centered: true,
+ floating: true,
+ modal: true,
+ components: [
+ {tag: "h2", content: "Sign Up"},
+ {kind: "onyx.Groupbox", components: [
+ {kind: "onyx.InputDecorator", components: [
+ {name: "username", kind: "onyx.Input", placeholder: "Username"}
+ ]},
+ {kind: "onyx.InputDecorator", components: [
+ {name: "password", kind: "onyx.Input", placeholder: "Password", type: "password"}
+ ]}
+ ]},
+ {kind: "onyx.Button", content: "Signup", onclick: "signupClick", classes: "onyx-affirmative"},
+ {kind: "onyx.Button", content: "Cancel", onclick: "cancelClick", classes: "onyx-negative"}
+ ],
+ signupClick: function() {
+ // Do stuff
+ },
+ cancelClick: function() {
+ this.hide();
+ }
+});
+enyo.kind({
+ name: "blerg.Title",
+ kind: "Control",
+ style: "float: left; width: 40%",
+ published: {
+ subscribed: null,
+ section: ""
+ },
+ components: [
+ {kind: "Image", classes: "logo", src: "images/blerglogo.png", attributes: {width: 125, height: 122}},
+ {tag: "h1", components: [
+ {kind: "blerg.Link", content: "Blërg!"}
+ ]},
+ {tag: "h2", components: [
+ {name: "section", tag: "span"}
+ ]},
+ {name: "userControls", showing: false, components: [
+ {kind: "blerg.Link", onclick: "clickChatter", content: "[chatter]"},
+ {name: "subscribeLink", kind: "blerg.Link", onclick: "clickSubscribe", showing: false, content: "[stalk]"},
+ {name: "unsubscribeLink", kind: "blerg.Link", onclick: "clickUnsubscribe", showing: false, content: "[stop stalking]"}
+ ]}
+ ],
+ create: function() {
+ this.inherited(arguments);
+ this.subscribedChanged();
+ },
+ clickChatter: function() {
+ this.bubble("onChatter");
+ },
+ clickSubscribe: function() {
+ this.bubble("onSubscribe");
+ },
+ clickUnsubscribe: function() {
+ this.bubble("onUnsubscribe");
+ },
+ subscribedChanged: function() {
+ if (this.subscribed == null) {
+ this.$.subscribeLink.hide();
+ this.$.unsubscribeLink.hide();
+ } else if (this.subscribed) {
+ this.$.subscribeLink.hide();
+ this.$.unsubscribeLink.show();
+ } else {
+ this.$.subscribeLink.show();
+ this.$.unsubscribeLink.hide();
+ }
+ },
+ sectionChanged: function() {
+ this.$.section.setContent(this.section);
+ },
+ showControls: function() {
+ this.$.userControls.hide();
+ },
+ hideControls: function() {
+ this.$.userControls.hide();
+ }
+});
+enyo.kind({
+ name: "blerg.Welcome",
+ statics: {
+ locationDetect: function(l) {
+ if (l.hash.match(/^(#\/?)?$/))
+ return {kind: "blerg.Welcome"}
+ else
+ return false;
+ }
+ },
+ components: [
+ {components: [
+ {style: "float: right; text-align: center; margin: 0 0 1em 1em", components: [
+ {style: "font-size: 14pt; margin-bottom: 4pt", content: "Curious? Click this unbelievably obnoxious button!"},
+ {kind: "onyx.Button", content: "I want to Blërg!", style: "font-size: 40pt; padding: 1em; background-color: #C0F; color: #F88", onclick: "startSignup"}
+ ]}
+ ]},
+ {allowHtml: true, content: '<h2>I am 12 and what is this</h2> <p>Blërg is a microblogging platform. Or maybe a miniblogging platform. Blërg is not sure. Blërg is a lot like <a href="http://twitter.com/">Twitter</a>, but aims to fix some of its idiosyncracies. Blërg does not want to be a full blogging platform like <a href="http://wordpress.com/">Wordpress</a> or <a href="http://livejournal.com/">Livejournal</a>. Blërg is also an <a href="/doc/">open source tagged text database engine</a> written in C that does the back-end work. Blërg\'s author finds it entertaining to anthropomorphize Blërg in the third person.</p>'},
+ {name: "moreLink", kind: "blerg.Link", onclick: "loadMore", content: "Tell me more..."},
+ {style: "clear: both"},
+ {name: "contentBox", allowHtml: true},
+ {tag: "h2", content: "Latest posts"},
+ {name: "latestPosts"},
+ {tag: "h2", content: "Latest tags"},
+ {name: "latestTags"}
+ ],
+ rendered: function() {
+ this.inherited(arguments);
+
+ this.bubble("onSetTitle", {section: "Welcome!"});
+ },
+ loadMore: function() {
+ var req = new enyo.Ajax({
+ url: "/welcome.html",
+ handleAs: "text"
+ });
+ req.response(function(inSender, inResponse) {
+ this.$.contentBox.setContent(inResponse);
+ this.$.moreLink.hide();
+ }.bind(this));
+ req.go();
+ },
+ startSignup: function() {
+ this.bubble('onStartSignup');
+ }
+});
+enyo.depends(
+ 'API.js',
+ 'Link.js',
+ 'Title.js',
+ 'Controls.js',
+ 'Post.js',
+ 'Help.js',
+ 'Main.js',
+ 'SignupDialog.js',
+ 'PasswdDialog.js',
+ 'Welcome.js',
+ 'Blerg.js'
+);
+enyo.depends(
+ 'onyx',
+ 'blerg'
+);
+<!DOCTYPE html>
+
+<h2>But what's wrong with Twitter?</h2>
+
+<p>I'M GLAD YOU ASKED. There are two aspects of Twitter that just bug
+me as an engineer:</p>
+
+<ol>
+<li><strong>Ruby on Rails</strong> - Using rails to prototype a system is
+fine — scaling up to a million hits a day with it is just a bad
+idea. As the service grew, I'm sure it cost them a lot more time than
+it saved.</li>
+<li><strong>140 characters is not enough</strong> - I routinely write
+sentences longer than 140 characters, so I can't even begin to imagine
+making a point in such a small space. This textual confinement has
+led to the rise of URL shorteners, which are <a
+href="http://bytex64.net/blog/e2256">breaking the internet</a>.
+</ol>
+
+<p>Blërg solves these problems by applying absurd reactionary
+engineering. Blërg's database backend is a custom C program that
+handles requests over HTTP and stores data in a very small and
+efficient indexed log-structured database. The frontend is done
+entirely in client-side Javascript. A single post can be up to 65535
+bytes in length.</p>
+
+<p>Which is not to say that I believe writing your service in C is the
+solution to all your problems. Clearly, this approach has just as
+many hairy problems that will bite you in the ass sooner or later.
+The best way, as with most things, lies somewhere in the middle of
+high-level abstraction and ZOMGHARDCORE OPTIMIZATION.</p>
+
+<h2>Is this a joke?</h2>
+
+<p>Yes. No. Maybe. Blërg is an exercise in constructive satire — a
+fully functional service created in a fit of hubris to poke fun at Twitter's
+engineering. It's just for fun, but no one is going to keep you from using
+it seriously. :]</p>
+
+<h2>Tell me more about this database engine.</h2>
+
+<p>Here, take a look at the <a href="/doc/#design">design docs</a>.</p>
+
+<h2>I'm a social media whore and I want to share links!</h2>
+
+<p>I've created a bookmarklet just for you: <a href="javascript:location.href='http://blerg.dominionofawesome.com/?post/'+encodeURIComponent(document.title)+'/'+encodeURIComponent(location.href)">Blërg it!</a></p>