sjs/samhuri.net
1
0
Fork 0
mirror of https://github.com/samsonjs/samhuri.net.git synced 2026-04-27 14:57:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

add blog archive, tweak styles

Browse source
This commit is contained in:
Sami Samhuri 2011-11-27 22:58:28 -08:00
parent 36b3ae5b9d
commit 63fdb8b3f9
10 changed files with 163 additions and 107 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
assets/blog.css
View file

@ -1,5 +1,5 @@
body { margin: 0 body { margin: 0
; padding: 0 ; padding: 0 0 3em
} }
h1 { margin: 0 h1 { margin: 0
@ -17,6 +17,8 @@ h1 { margin: 0
.hidden { display: none } .hidden { display: none }
#archive { text-align: center }
#index { width: 80% #index { width: 80%
; min-width: 300px ; min-width: 300px
; max-width: 800px ; max-width: 800px
@ -26,13 +28,12 @@ h1 { margin: 0
; border-radius: 10px ; border-radius: 10px
; background-color: #eee ; background-color: #eee
; margin: 1em auto ; margin: 1em auto
; padding: 1em
; font-size: 1.2em ; font-size: 1.2em
; line-height: 1.5em
; list-style-type: none
} }
#index ul { padding: 0 1em
; list-style-type: none
}
.date { float: right } .date { float: right }
article { width: 80% article { width: 80%
@ -65,6 +66,7 @@ article h1 a:hover { text-shadow: #cc0 1px 1px 8px
article h2 { font-size: 1.8em article h2 { font-size: 1.8em
; font-weight: normal ; font-weight: normal
; text-align: left
; margin: 1em 0 ; margin: 1em 0
; padding: 0 ; padding: 0
; color: #222 ; color: #222
@ -78,26 +80,10 @@ time { color: #444
; font-size: 1.2em ; font-size: 1.2em
} }
#permalink { font-size: 1em }
.gist { font-size: 0.8em } .gist { font-size: 0.8em }
#around { width: 80%
; min-width: 400px
; max-width: 800px
; margin: 1em auto
; padding: 0 3em 1em
; font-size: 1.2em
}
#prev { float: left }
#next { float: right }
#around br { clear: both }
.sep { text-align: center
; font-size: 2em
; color: #666
; display: none
}
/* show discussion */ /* show discussion */
#sd-container { margin: 3em 0 } #sd-container { margin: 3em 0 }
@ -174,14 +160,19 @@ input[type=submit] { font-size: 1.1em
} }
footer { margin: 0 footer { margin: 0
; padding: 1em 0 ; padding: 0.2em 0
; background-color: #cdf ; background-color: #def
; border-top: solid 1px #bbb ; border-top: solid 1px #bbb
; clear: both ; clear: both
; position: fixed
; width: 100%
; bottom: 0
} }
footer p { margin: 0.5em }
footer a { border-bottom: none footer a { border-bottom: none
; color: #25c ; color: #25c
; font-size: 1.3em ; font-size: 1.2em
; text-decoration: none ; text-decoration: none
} }

10
assets/blog.js
View file

@ -37,15 +37,6 @@
jQuery(function($) { jQuery(function($) {
var hidden = true
, index = $('#index')
$('#index-toggle').click(function() {
index.toggle()
hidden = !hidden
$(this).html(hidden ? '↓ show posts ↓' : '↑ hide posts ↑')
})
$('#need-js').remove() $('#need-js').remove()
SJS.request({uri: countCommentsURL(SJS.filename)}, function(err, request, body) { SJS.request({uri: countCommentsURL(SJS.filename)}, function(err, request, body) {
@ -65,7 +56,6 @@
$('#sd-container').remove() $('#sd-container').remove()
$('#comment-stuff').slideDown(1.5, function() { this.scrollIntoView(true) }) $('#comment-stuff').slideDown(1.5, function() { this.scrollIntoView(true) })
getComments() getComments()
return false
}) })
var showdown = new Showdown.converter() var showdown = new Showdown.converter()

33
assets/mobile.css
View file

@ -23,6 +23,8 @@
{ {
/* common */ /* common */
body { padding-bottom: 0 }
h1 { font-size: 2em h1 { font-size: 2em
; margin-top: 1em ; margin-top: 1em
} }
@ -50,18 +52,14 @@
#blog img { max-width: 100% } #blog img { max-width: 100% }
nav#index { width: 90% #index { width: 90%
; min-width: 310px ; min-width: 200px
; margin: 0.3em auto ; margin: 0.3em auto 1em
; padding-bottom: 0.3em ; padding: 0.5em
} ; font-size: 1em
}
nav#index ul { font-size: 0.8em #index li > span.date { display: none }
; padding-left: 2em
}
nav#index li { list-style-type: disc }
nav#index li > span.date { display: none }
#blog article h1 { font-size: 1.6em #blog article h1 { font-size: 1.6em
; margin-top: 0 ; margin-top: 0
@ -77,18 +75,6 @@
pre, .gist { font-size: 0.8em } pre, .gist { font-size: 0.8em }
.sep { font-size: 1em }
#around { min-width: 310px
; margin: 0
; padding: 0 0.2em
; font-size: 0.8em
}
#prev, #next { padding: 0.3em 0
; font-size: 0.95em
}
#comment-stuff { padding: 0 #comment-stuff { padding: 0
; margin-top: 2em ; margin-top: 2em
} }
@ -123,6 +109,7 @@
footer { margin: 0 footer { margin: 0
; padding: 0.5em 0 ; padding: 0.5em 0
; position: relative
} }
} }

17
blog.rb
View file

@ -44,6 +44,7 @@ class Blag
generate_index generate_index
generate_rss generate_rss
generate_posts_json generate_posts_json
generate_archive
end end
def generate_index def generate_index
@ -51,8 +52,7 @@ class Blag
index_template = File.read(File.join('templates', 'blog', 'index.html')) index_template = File.read(File.join('templates', 'blog', 'index.html'))
post = posts.first post = posts.first
template = post[:link] ? link_template : post_template template = post[:link] ? link_template : post_template
values = { :posts => posts, values = { :post => post,
:post => post,
:article => Mustache.render(template, post), :article => Mustache.render(template, post),
:previous => posts[1], :previous => posts[1],
:filename => post[:filename], :filename => post[:filename],
@ -66,8 +66,7 @@ class Blag
page_template = File.read(File.join('templates', 'blog', 'post.html')) page_template = File.read(File.join('templates', 'blog', 'post.html'))
posts.each_with_index do |post, i| posts.each_with_index do |post, i|
template = post[:link] ? link_template : post_template template = post[:link] ? link_template : post_template
values = { :posts => posts, values = { :title => post[:title],
:title => post[:title],
:link => post[:link], :link => post[:link],
:article => Mustache.render(template, post), :article => Mustache.render(template, post),
:previous => i < posts.length - 1 && posts[i + 1], :previous => i < posts.length - 1 && posts[i + 1],
@ -86,6 +85,12 @@ class Blag
File.open(File.join(@dest, 'posts.json'), 'w') { |f| f.puts(json) } File.open(File.join(@dest, 'posts.json'), 'w') { |f| f.puts(json) }
end end
def generate_archive
archive_template = File.read(File.join('templates', 'blog', 'archive.html'))
html = Mustache.render(archive_template, :posts => posts)
File.open(File.join(@dest, 'archive.html'), 'w') { |f| f.puts(html) }
end
def generate_rss def generate_rss
# posts rss # posts rss
File.open(rss_file, 'w') { |f| f.puts(rss.target!) } File.open(rss_file, 'w') { |f| f.puts(rss.target!) }
@ -170,14 +175,14 @@ class Blag
xml.instruct! 'xml-stylesheet', :href => 'http://samhuri.net/assets/blog-all.min.css', :type => 'text/css' xml.instruct! 'xml-stylesheet', :href => 'http://samhuri.net/assets/blog-all.min.css', :type => 'text/css'
xml.rss :version => '2.0' do xml.rss :version => '2.0' do
xml.channel do xml.channel do
xml.title post[:link] ? "&rarr; #{title}" : title xml.title title
xml.description subtitle xml.description subtitle
xml.link url xml.link url
xml.pubDate posts.first[:rfc822] xml.pubDate posts.first[:rfc822]
posts.each do |post| posts.each do |post|
xml.item do xml.item do
xml.title post[:title] xml.title post[:link] ? "&rarr; #{post[:title]}" : post[:title]
xml.description post[:rss_html] xml.description post[:rss_html]
xml.pubDate post[:rfc822] xml.pubDate post[:rfc822]
xml.author post[:author] xml.author post[:author]

82
samhuri.net.tmproj
View file

@ -3,7 +3,7 @@
<plist version="1.0"> <plist version="1.0">
<dict> <dict>
<key>currentDocument</key> <key>currentDocument</key>
<string>assets/mobile.css</string> <string>blog.rb</string>
<key>documents</key> <key>documents</key>
<array> <array>
<dict> <dict>
@ -86,12 +86,12 @@
<key>column</key> <key>column</key>
<integer>0</integer> <integer>0</integer>
<key>line</key> <key>line</key>
<integer>73</integer> <integer>172</integer>
</dict> </dict>
<key>firstVisibleColumn</key> <key>firstVisibleColumn</key>
<integer>0</integer> <integer>0</integer>
<key>firstVisibleLine</key> <key>firstVisibleLine</key>
<integer>33</integer> <integer>140</integer>
</dict> </dict>
<key>combine.sh</key> <key>combine.sh</key>
<dict> <dict>
@ -107,6 +107,34 @@
<key>firstVisibleLine</key> <key>firstVisibleLine</key>
<integer>0</integer> <integer>0</integer>
</dict> </dict>
<key>templates/blog/link.mustache</key>
<dict>
<key>caret</key>
<dict>
<key>column</key>
<integer>0</integer>
<key>line</key>
<integer>9</integer>
</dict>
<key>firstVisibleColumn</key>
<integer>0</integer>
<key>firstVisibleLine</key>
<integer>0</integer>
</dict>
<key>templates/blog/link.rss.html</key>
<dict>
<key>caret</key>
<dict>
<key>column</key>
<integer>0</integer>
<key>line</key>
<integer>10</integer>
</dict>
<key>firstVisibleColumn</key>
<integer>0</integer>
<key>firstVisibleLine</key>
<integer>0</integer>
</dict>
<key>templates/blog/post.html</key> <key>templates/blog/post.html</key>
<dict> <dict>
<key>caret</key> <key>caret</key>
@ -121,6 +149,50 @@
<key>firstVisibleLine</key> <key>firstVisibleLine</key>
<integer>0</integer> <integer>0</integer>
</dict> </dict>
<key>templates/blog/post.mustache</key>
<dict>
<key>caret</key>
<dict>
<key>column</key>
<integer>0</integer>
<key>line</key>
<integer>7</integer>
</dict>
<key>columnSelection</key>
<false/>
<key>firstVisibleColumn</key>
<integer>0</integer>
<key>firstVisibleLine</key>
<integer>0</integer>
<key>selectFrom</key>
<dict>
<key>column</key>
<integer>0</integer>
<key>line</key>
<integer>8</integer>
</dict>
<key>selectTo</key>
<dict>
<key>column</key>
<integer>0</integer>
<key>line</key>
<integer>7</integer>
</dict>
</dict>
<key>templates/blog/post.rss.html</key>
<dict>
<key>caret</key>
<dict>
<key>column</key>
<integer>0</integer>
<key>line</key>
<integer>9</integer>
</dict>
<key>firstVisibleColumn</key>
<integer>0</integer>
<key>firstVisibleLine</key>
<integer>0</integer>
</dict>
<key>templates/proj/index.html</key> <key>templates/proj/index.html</key>
<dict> <dict>
<key>caret</key> <key>caret</key>
@ -139,6 +211,10 @@
<key>openDocuments</key> <key>openDocuments</key>
<array> <array>
<string>assets/mobile.css</string> <string>assets/mobile.css</string>
<string>templates/blog/link.rss.html</string>
<string>templates/blog/post.mustache</string>
<string>templates/blog/link.mustache</string>
<string>templates/blog/post.rss.html</string>
<string>templates/proj/index.html</string> <string>templates/proj/index.html</string>
<string>assets/request.js</string> <string>assets/request.js</string>
<string>templates/blog/post.html</string> <string>templates/blog/post.html</string>

41
templates/blog/archive.html Normal file
View file

@ -0,0 +1,41 @@
<!doctype html>
<html lang="en">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>archive :: sjs' blog</title>
<meta name="keywords" content="{{keywords}}">
<link rel="icon" type="image/gif" href="../assets/s.gif">
<link rel="stylesheet" href="../assets/blog-all.min.css">
<link rel="stylesheet" media="screen" href="../assets/mobile.min.css">
<link rel="alternate" type="application/rss+xml" href="http://samhuri.net/blog/sjs.rss" title="sjs' blog">
<body id="blog">
<nav id="breadcrumbs"><a href="../">samhuri.net</a></nav>
<header>
<h1><a href="index.html">sjs' blog</a></h1>
</header>
<ul id="index">
{{#posts}}
<li><a href="{{filename}}">{{title}}</a> <span class="date">{{date}}</span></li>
{{/posts}}
</ul>
<footer>
<p><a href="https://twitter.com/_sjs">@_sjs</a></p>
<p><a href="mailto:sami.samhuri@gmail.com">sami.samhuri@gmail.com</a></p>
</footer>
<script>
var _gaq = _gaq || []
_gaq.push( ['_setAccount', 'UA-214054-5']
, ['_trackPageview']
)
;(function() {
var ga = document.createElement('script')
ga.type = 'text/javascript'
ga.async = true
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'
var s = document.getElementsByTagName('script')[0]
s.parentNode.insertBefore(ga, s)
}())
</script>
</body>
</html>

18
templates/blog/index.html
View file

@ -12,24 +12,8 @@
<header> <header>
<h1><a href="index.html">sjs' blog</a></h1> <h1><a href="index.html">sjs' blog</a></h1>
</header> </header>
<div id="show-posts" class="center"><a id="index-toggle" href="#">&darr; show posts &darr;</a></div> <nav id="archive"><a href="archive.html">archive</a></nav>
<nav id="index" class="hidden">
<ul>
{{#posts}}
<li><a href="{{url}}">{{title}}</a> <span class="date">{{date}}</span></li>
{{/posts}}
</ul>
</nav>
{{{article}}} {{{article}}}
<div id="around">
{{#previous}}
<a id="prev" href="{{filename}}">&larr; {{title}}</a>
{{/previous}}
{{#next}}
<a id="next" href="{{filename}}">{{title}} &rarr;</a>
{{/next}}
<br>
</div>
{{#comments}} {{#comments}}
<p id="need-js" align="center"><strong>(discussion requires JavaScript)</strong></p> <p id="need-js" align="center"><strong>(discussion requires JavaScript)</strong></p>
<div class="center" id="sd-container"><a id="sd" href="#comment-stuff">show the discussion</a></div> <div class="center" id="sd-container"><a id="sd" href="#comment-stuff">show the discussion</a></div>

5
templates/blog/link.mustache
View file

@ -1,9 +1,8 @@
<article> <article>
<header> <header>
<h1><a href="{{link}}">&rarr; {{title}}</a></h1> <h2><a href="{{link}}">&rarr; {{title}}</a></h2>
<time>{{date}}</time> <time>{{date}}</time>
</header> </header>
{{{body}}} {{{body}}}
<p><a href="{{filename}}">&infin;</a></p> <p><a id="permalink" href="{{filename}}">&infin;</a></p>
</article> </article>
<p class="sep">&#x0f04;</p>

20
templates/blog/post.html
View file

@ -9,28 +9,12 @@
<link rel="stylesheet" media="screen" href="../assets/mobile.min.css"> <link rel="stylesheet" media="screen" href="../assets/mobile.min.css">
<link rel="alternate" type="application/rss+xml" href="http://samhuri.net/blog/sjs.rss" title="sjs' blog"> <link rel="alternate" type="application/rss+xml" href="http://samhuri.net/blog/sjs.rss" title="sjs' blog">
<body id="blog"> <body id="blog">
<nav id="breadcrumbs"><a href="../">samhuri.net</a> &bull; <a href="index.html">blog</a></nav> <nav id="breadcrumbs"><a href="../">samhuri.net</a></nav>
<header> <header>
<h1><a href="index.html">sjs' blog</a></h1> <h1><a href="index.html">sjs' blog</a></h1>
</header> </header>
<div id="show-posts" class="center"><a id="index-toggle" href="#">&darr; show posts &darr;</a></div> <nav id="archive"><a href="archive.html">archive</a></nav>
<nav id="index" class="hidden">
<ul>
{{#posts}}
<li><a href="{{url}}">{{title}}</a> <span class="date">{{date}}</span></li>
{{/posts}}
</ul>
</nav>
{{{article}}} {{{article}}}
<div id="around">
{{#previous}}
<a id="prev" href="{{filename}}">&larr; {{title}}</a>
{{/previous}}
{{#next}}
<a id="next" href="{{filename}}">{{title}} &rarr;</a>
{{/next}}
<br>
</div>
{{#comments}} {{#comments}}
<p id="need-js" align="center"><strong>(discussion requires JavaScript)</strong></p> <p id="need-js" align="center"><strong>(discussion requires JavaScript)</strong></p>
<div class="center" id="sd-container"><a id="sd" href="#comment-stuff">show the discussion</a></div> <div class="center" id="sd-container"><a id="sd" href="#comment-stuff">show the discussion</a></div>

1
templates/blog/post.mustache
View file

@ -5,4 +5,3 @@
</header> </header>
{{{body}}} {{{body}}}
</article> </article>
<p class="sep">&#x0f04;</p>