Skip to content

Commit

Permalink
Mass work-in-progress commit from before xmas. Improved home, tag pag…
Browse files Browse the repository at this point in the history
…e, more
  • Loading branch information
David Singleton committed Jan 4, 2011
1 parent ed3ed78 commit 09c9d9e
Show file tree
Hide file tree
Showing 11 changed files with 373 additions and 170 deletions.
33 changes: 18 additions & 15 deletions www/_inc/header.inc.php
@@ -1,19 +1,19 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title><?php if (isset($title)) { ?><?php h($title); ?> - <?php } ?>David Singleton</title>


<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

<meta name="description" content="The blog of David Singleton, Ramblings of a Web Developer" />
<meta name="keywords" content="david singleton, dave singleton, web developer, london, css, php, lamp, mysql, unix, programming, web standards, coding, microformats, web sites, angry rants" />
<meta name="author" content="David Singleton" />
<meta name="robots" content="index, follow" />

<meta name="viewport" content="initial-scale=1.0, width=device-width, maximum-scale=1.0"/>

<link rel="openid.server" href="http://www.myopenid.com/server" />
<link rel="openid.delegate" href="http://dsingleton.myopenid.com/" />
<meta http-equiv="X-XRDS-Location" content="http://dsingleton.myopenid.com/xrds" />
Expand All @@ -24,20 +24,20 @@

<link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>

<?php if (isset($extra_css)) { foreach($extra_css as $path) { ?>
<?php if (isset($extra_css)) { foreach($extra_css as $path) { ?>
<link rel="stylesheet" href="<?php h($path); ?>" type="text/css" />
<?php } } ?>
<?php } } ?>

<?php if (isset($extra_js)) { foreach($extra_js as $path) { ?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<?php if (isset($extra_js)) { foreach($extra_js as $path) { ?>
<script type="text/javascript" src="<?php h($path); ?>"></script>
<?php } } ?>
<?php } } ?>

<?php if (isset($feed)) { ?>
<?php if (isset($feed)) { ?>
<link href="<?php h($feed['url']); ?>" rel="alternate" type="application/rss+xml" title="<? h($title); ?>" />
<?php } ?>
<?php } ?>

<meta name="viewport" content="initial-scale=1.0, width=device-width, maximum-scale=1.0"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>

<body>
Expand All @@ -46,11 +46,14 @@

<header>
<p>
<a class="name" href="/" ><span class="firstname">David</span> <span class="lastname">Singleton</span></a>
A <a href="/tag/web"><span class="title">web developer</span></a>
living in <span class="adr"><span class="locality"><a href="/tag/london">London</a></span></span>
and working at <a href="http://last.fm">Last.fm</a>.

<span class="myname">
<a class="name" href="/" ><span class="firstname">David</span> <span class="lastname">Singleton</span></a>
</span>
<span class="aboutme">
A <a href="/tag/web"><span class="title">web developer</span></a>
living in <span class="adr"><span class="locality"><a href="/tag/london">London</a></span></span>
and working at <a href="http://last.fm">Last.fm</a>.
</span>
<span class="tagline">I write a <a href="/blog">blog</a>, tag <a href="/tag">things</a> and <a href="/code">code</a>, find out <a href="/about">more &raquo;</a></span>
</p>

Expand Down
2 changes: 1 addition & 1 deletion www/about/index.php
Expand Up @@ -6,7 +6,7 @@
?>
<?php require_once '../_inc/header.inc.php'; ?>
<article>
<h2>About</h2>
<h2>About</h2>
<p>I'm a web developer, I wrote code for a living and for fun. I live in East London, also for fun.</p>

<p>I love taking things apart, figuring out how they work, and solving problems. Mostly <a href="/tag/code">code</a> or <a href="/code/design">design</a>, but sometimes baking too. Sometimes I write about these things on my <a href="/blog">blog</a>.</p>
Expand Down
16 changes: 8 additions & 8 deletions www/blog.php
Expand Up @@ -10,6 +10,7 @@
$oPost = TumblrPost::getBySlug($post);
if ($oPost) {
$title = $oPost->getTitle();
$aPosts = array_slice($aPosts, 0, 10);
}
else {
$action = '404';
Expand All @@ -27,28 +28,27 @@

<?php if ($action == 'view') { ?>

<article>
<article class="blog-entry">
<h1><?php h($oPost->getTitle()); ?></h1>
<?php echo $oPost->getBody(); ?>
</article>

<aside>
<div class="tags">
<h4>Tagged</h4>
<ul class="tags">
<?php foreach($oPost->getTags() as $tag) { ?>
<li><a href="/tag/<?php h($tag); ?>"><?php h($tag); ?></a></li>
<li><a rel="tag" href="/tag/<?php h($tag); ?>"><?php h($tag); ?></a></li>
<?php } ?>
</ul>
</div>

</article>

<aside>
<div class="recent posts">
<h4>Recent posts</h4>
<ul class="posts">
<?php foreach($aPosts as $oPost) { ?>
<li><a href="<?php h($oPost->getURL()); ?>"><?php h($oPost->getTitle()); ?></a></li>
<?php } ?>
</ul>

<p><a href="/blog">More&hellip;</p>
</div>
</aside>

Expand Down
82 changes: 52 additions & 30 deletions www/index.php
@@ -1,42 +1,64 @@
<!-- a -->
<?php require_once '../init.php'; ?>
<?php

$aRecentPosts = TumblrPost::getRecent(3);
$extra_css = array('/static/css/home.css');

$aPosts = TumblrPost::getRecent(3);

$feed = array('url' => '/feed/blog.rss');

?>
<?php require_once './_inc/header.inc.php'; ?>
<article>
<h2>About</h2>
<p>
Check out my <a href="/about/cv/">CV</a> (recently updated) for more about my skills and work history. Working on something interesting? Let me know. Or take a look at my "elsewhere" links to learn a bit more about me personally.
</p>

<p>I have a few projects of my own hosted here, such as;
a selector for <a href="/code/icon-selector">Famfamfam silk icons</a>,
a JS/Flash MP3 player called <a href="/code/1bit">1Bit</a>,
and some prototype hacking on <a href="/code/lifestream">activity/life streaming</a> (powered by <a href="http://delicious.com/dsingleton/microformats">microformats</a> and Google <a href="http://delicious.com/dsingleton/socialgraph">Social Graph</a>).
</p>

<p>I occasionally <a href="/blog">blog</a>; some recent posts</p>
<ol>
<?php foreach($aRecentPosts as $oPost) {?>
<li><a href="<?php h($oPost->getURL()); ?>"><?php h($oPost->getTitle()); ?></a></li>
<?php } ?>
</ol>

<p>You can contact me via <em>[my first name]</em>@<em>[this domain]</em>. No spam please.</p>
<h2>Hello</h2>

<a href="http://www.flickr.com/photos/visivo/4669744135/" title="lastfm BBQ 4 lyfe by visivo, on Flickr"><img class="snapshot" src="http://farm5.static.flickr.com/4018/4669744135_b1c3a3634b_m.jpg" width="180" height="240" alt="lastfm BBQ 4 lyfe" /></a>

<p>My name is David and I like to make <strong>things</strong>. Mostly on the web, but sometimes with paper, pens or potatoes.</p>

<p>I live in London, I'm a web developer and I like doing a bit of everything. I work at <a href="http://last.fm">Last.fm</a> where I enjoy building things used by millions of people every day.</p>

<h2>Elsewhere online</h2>
<p>
I collect <a href="http://del.icio.us/dsingleton/" rel="me">links</a>,
take <a href="http://flickr.com/photos/davidsingleton/" rel="me">photos</a>,
listen to <a href="http://last.fm/user/underpangs/" rel="me">music</a>,
attend <a href="http://upcoming.yahoo.com/user/30794/" rel="me">events</a>,
write <a href="http://github.com/dsingleton" rel="me">code</a>
and talk <a href="http://twitter.com/dsingleton/" rel="me">nonsense</a>.
</p>
<p>I also like to write about my passions; <a href="/blog">technology</a>, <a href="http://last.fm/user/underpangs">music</a>, and <a href="http://munchmun.ch">food</a>, that sort of thing.</p>
<br>

<!-- <p>I have a few projects of my own hosted here, such as;
a selector for <a href="/code/icon-selector">Famfamfam silk icons</a>,
a JS/Flash MP3 player called <a href="/code/1bit">1Bit</a>,
and some prototype hacking on <a href="/code/lifestream">activity/life streaming</a> (powered by <a href="/tag/microformats">microformats</a> and Google <a href="/tagsocialgraph">Social Graph</a>).
</p> -->

<h2>Recent blog posts</h2>
<div class="hfeed">
<?php foreach($aPosts as $oPost) { ?>
<div class="hentry">
<h3 class="entry-title">
<a href="<?php h($oPost->getURL())?>" rel="bookmark">
<?php h($oPost->getTitle()); ?>
</a>
</h3>

<p class="entry-content"><?php echo ($oPost->getExtract()); ?>&hellip; <a href="<?php h($oPost->getURL()); ?>">more &raquo;</a></p>
</div>
<?php } ?>
<p><a href="/blog">Older Posts &raquo;</a></p>
</div>
</article>

<aside>
<h2>Get in touch</h2>

<p>You can contact me via <a href="mailto:david@dsingleton.co.uk" class="email">david@dsingleton.co.uk</a> or <a href="http://twitter.com/?status=@dsingleton">@dsingleton</a> me on Twitter</p>

<h2>Find me on&hellip;</h2>
<ul>
<li><a href="http://last.fm/user/underpangs/" rel="me">Last.fm</a></li>
<li><a href="http://twitter.com/dsingleton/" rel="me">Twitter</a></li>
<li><a href="http://delicious.com/dsingleton/" rel="me">Delicious</a></li>
<li><a href="http://flickr.com/photos/davidsingleton/" rel="me">Flickr</a></li>
<li><a href="http://github.com/dsingleton" rel="me">Github</a></li>
<li><a href="http://upcoming.yahoo.com/user/30794/" rel="me">Upcoming</a></li>
</ul>

<p>There are also some other David Singletons. You might be looking for <a href="http://www.google.com/search?q=david%20singleton%20-dsingleton.co.uk">one of them</a> instead.</p>
</article>

Expand Down
32 changes: 12 additions & 20 deletions www/speaking/index.php
Expand Up @@ -4,31 +4,23 @@
?>
<?php require_once '../_inc/header.inc.php'; ?>

<h3>Speaking</h3>
<article>
<h1>Speaking</h1>
<p>Occasionally I speak at events, conferences and un-conferences, this is a collection of notable talks and slides. If you're interested in me speaking at an event, please <a href="/about">get in touch</a>.</p>

<h4>Recently&hellip;</h4>
<dl>
<dt>2010 - <a href="http://www.slideshare.net/davidsingleton/lastfm-vs-xbox">DIBI - Last.fm vs Xbox.</a></dt>
<dd>
<p><a href="http://www.dibiconference.com/speaker/">Design It, Build It</a>, a two track front-end/back-end conference in Newcastle where I presented <a href="">Last.fm Vs Xbox</a>. A look how we launched a Last.fm radio application to millions of Xbox Live users. Covering estimations, panic, profiling, optimisation and preparing for the worst. A 30 minute presentation followed by 10 minutes of Q&amp;A</p>
</dd>
</dl>
<h2>2010</h2>

<h3><a href="http://www.slideshare.net/davidsingleton/lastfm-vs-xbox">DIBI - Last.fm vs Xbox.</a></h3>
<p><a href="http://www.dibiconference.com/speaker/">Design It, Build It</a>, a two track front-end/back-end conference in Newcastle where I presented <a href="">Last.fm Vs Xbox</a>. A look how we launched a Last.fm radio application to millions of Xbox Live users. Covering estimations, panic, profiling, optimisation and preparing for the worst. A 30 minute presentation followed by 10 minutes of Q&amp;A</p>

<h4>Past talks</h4>
<dl>
<dt>2009 - <a href="http://www.slideshare.net/davidsingleton/scalecamp-2009-lastfm-vs-xbox">Scale Camp</a></dt>
<dd>
<p>The first <a href="http://www.scalecamp.org.uk/">Scale Camp</a>, organised by and hosted by The Guardian. An invite only un-conference focusing on high-scale problems and technology, with representatives from The Guardian, BBC, Yahoo, etc speaking. I gave a short and frank presentation on launching a Last.fm radio app on Xbox Live, focusing on more on technology.</p>
</dd>

<dt>2009 - <a href="http://www.slideshare.net/davidsingleton/music-hackday-boston-the-lastfm-api">Music Hackday Boston - Last.fm APIs</a></dt>
<dd>
<p>I gave an overview of the Last.fm API. What data we offer, how to use it, limitations and some usage examples. The 4rd <a href="http://musichackday.org">music hackday</a>, see also <a href="/blog/music-hackday-boston">my review</a> of the event (and of the weekends <a href="http://munchmun.ch/2009/12/on-tour-in-boston/">food</a> and <a href="http://www.last.fm/user/underpangs/journal/2009/12/05/37s7nl_el_boston">music</a>)</p>
</dd>
</dl>
<h2>2009</h2>

<h3><a href="http://www.slideshare.net/davidsingleton/scalecamp-2009-lastfm-vs-xbox">Scale Camp</a></h3>
<p>The first <a href="http://www.scalecamp.org.uk/">Scale Camp</a>, organised by and hosted by The Guardian. An invite only un-conference focusing on high-scale problems and technology, with representatives from The Guardian, BBC, Yahoo, etc speaking. I gave a short and frank presentation on launching a Last.fm radio app on Xbox Live, focusing on more on technology.</p>

<h3><a href="http://www.slideshare.net/davidsingleton/music-hackday-boston-the-lastfm-api">Music Hackday Boston - Last.fm APIs</a></h3>
<p>I gave an overview of the Last.fm API. What data we offer, how to use it, limitations and some usage examples. The 4rd <a href="http://musichackday.org">music hackday</a>, see also <a href="/blog/music-hackday-boston">my review</a> of the event (and of the weekends <a href="http://munchmun.ch/2009/12/on-tour-in-boston/">food</a> and <a href="http://www.last.fm/user/underpangs/journal/2009/12/05/37s7nl_el_boston">music</a>)</p>

</article>

<?php require_once '../_inc/footer.inc.php'; ?>
80 changes: 17 additions & 63 deletions www/static/css/base.css
Expand Up @@ -12,13 +12,13 @@ body {

/** Header */

#page header p a.name {
#page header span.myname {
float: left;

margin: -5px 25px 15px 0;
padding: 5px 10px;

color: #FFFFFF;
color: #fff;
background-color: DodgerBlue;
font-size: 40px;

Expand All @@ -34,22 +34,16 @@ body {
-webkit-transform: rotate(-2deg);
}

#page header span.myname a {
color: #fff;
text-decoration: none;
}

header {
margin: 0 0 24px;
width: 552px;
}

header p.bio {
font-size: 16px;
}

header p.tagline {
border-top: 1px solid #ddd;
display: inline-block;
margin-top: 5px;
padding-top: 5px;
}


/** Page */

Expand All @@ -61,50 +55,33 @@ header p.tagline {
background: auto;
}

#page a {
color: DodgerBlue;
}


/** Article */

article {
margin: 24px 0;
float: left;
}


article {
width: 552px;
}

article p {
margin: 0 0 1em 0;
}

ul.tags li,
div.tags ul li {
background: #eee;
-moz-border-radius: 3px;
display: inline-block;
padding: 2px 5px;
margin: 4px 2px;
text-decoration: none;
}


/** Aside */

aside {
float: right;
max-width: 240px;
max-width: 200px;

margin: 2em 0;
padding: 0 20px 20px;

color: #666;
margin: 25px 0;
padding: 0 0 0 20px;
border-left: 3px solid #eee;
background: #f6f6f6;

border: 1px solid #eee;
-moz-border-radius: 5px;
}

/** Footer */

footer {
clear: both;
border-top: 1px solid #ccc;
Expand All @@ -131,26 +108,3 @@ footer ul li a[href*=twitter] {

padding: 5px 15px 5px 20px;
}


/** Elements & Misc */

dl dt {
font-weight: bold;
margin-top: 1em;
}

ul.hfeed {
list-style: none;
}

ul.hfeed li {
padding: 0 0 10px 0;
margin: 0 0 10px 0;
border-bottom: 1px solid #eee;
}

small {
font-size: 13px;
line-height: 18px;
}

0 comments on commit 09c9d9e

Please sign in to comment.