refactored blog and redesigned it

css/style.css

@@ -1,23 +1,19 @@
 {{define "style"}}
 html, body {
-	color: LightGrey;
     font-family: 'HelveticaNeue-Light','Helvetica Neue', Helvetica, Arial, sans-serif;;
     font-size: 15px;
     line-height:  170%;
-    //color: #35465D;    
     color: #506692;
     background-color: #d6e2fa;
-    //background-color: #506692;    
 }
 
+
 .title {
-	//padding: 20px;
 	justify-content: flex-end;
 	color: #ff8f00;
 }
 
 .title:hover {
-    //background-color: #687fad;    
     color: lightblue;    
     background-color: #d6e2fa;
 }
@@ -43,8 +39,6 @@ article {
 }
 
 .posts{
-    //width: 700px;
-    //background-color: #506692;
     background-color: #d6e2fa;
 }
 
@@ -62,7 +56,6 @@ h1 {
 	letter-spacing: 5px;
 	margin-right: -5px;
 	font-size: 40px;
-	//color: #97c5e0;
     color: #506692;
     text-align: right;
 	justify-content: flex-end;
@@ -81,11 +74,9 @@ a {
 
 a:hover {
 	color: orange;
-    --background-color: #ffffff;
 }
 
 img {
-	//border-radius: 10px;
 	display: block;
 	width: 100%;
     max-width: 600px;   
@@ -106,7 +97,6 @@ ul {
 .tagline{
     text-align: right;
     color: #506692;
-	//color: #97c5e0;
 }
 
 .section{
@@ -121,6 +111,7 @@ ul {
     justify-content: flex-end;
     padding-bottom: 20px;
     color: #35465D;    
+	width: 270px
 }
 
 .menuselect{
@@ -136,7 +127,6 @@ ul {
 }
 
 .menuElement:hover {
-    //background-color: #687fad;    
     color: lightblue;    
 }
 
@@ -153,15 +143,24 @@ ul {
 	text-decoration: none;
 }
 
-.bottomMenuElement:hover {
+.shit {
-    //background-color: #ffffff;
+	padding: 32px;
-    //color: lightblue;    
+}
-    //background-color: #d6e2fa;
+
+
+
+#yearline li.yearline {
+	padding-bottom: 8px;
+}
+
+#yearline li.yearend {
+	height: 24px;
 }
 
 .titleArea {
 	display: flex;
 	justify-content: center;
+	margin-bottom:30px;
 }
 
 #titleArea ul>li {
@@ -170,13 +169,13 @@ ul {
 
 #titleArea li {
     display: table-cell;
+	width: 270px;
 }
 
 #section ul > li{
 	display: block;
 	margin: auto;
     float: center;
-    //text-align: right;
     list-style: none;
 }
 
@@ -187,7 +186,6 @@ ul {
 }
 
 #menu ul{
-	//display: block;
 	margin: auto;
     float: center;
     text-align: center;
@@ -198,6 +196,4 @@ ul {
     //display: inline-block;
 }
 
-
-
 {{end}}

main.go

@@ -9,9 +9,10 @@ import (
 	"strings"
 )
 
-//Page : Is exported to PostCollection
 type Page struct {
 	Title       string
+	Years		[][]Post
+	//Years		map[int][]Post
 	Posts       []Post
 	CurrentPage string
 }
@@ -19,13 +20,27 @@ type Page struct {
 var style = ``
 var name = "takunomi"
 var posts []Post
-var templates = template.Must(template.ParseFiles("templates/blog.tmpl", "templates/about.tmpl","templates/keru_shoujo.tmpl", "templates/past.tmpl", "templates/contact.tmpl", "templates/blog_roll.tmpl", "templates/post.tmpl"))
+var years [][]Post
+//var years map[int][]Post
+var templates = template.Must(template.ParseFiles(
+	"templates/blog.tmpl", 
+	"templates/about.tmpl",
+	"templates/keru_shoujo.tmpl",
+	"templates/past.tmpl",
+	"templates/contact.tmpl", 
+	"templates/blog_roll.tmpl", 
+	"templates/title.tmpl", 
+	"templates/navbar.tmpl", 
+	"templates/main.tmpl", 
+	"templates/post.tmpl"))
 
 func main() {
 
 	buildHandlers()
 	retrievePosts()
 
+	
+
 	if os.Args[1] == "local" {
 		http.ListenAndServe(":8080", nil)
 	}
@@ -38,8 +53,14 @@ func main() {
 
 func retrievePosts() {
 	posts = nil
+	years = nil
+	//years = make(map[int][]Post)
 	filepath.Walk("./posts", newPost)
-	posts = reversePosts()
+	years = reverseYears()
+	for i := 0; i<len(years); i++ {
+		years[i] = reversePosts(years[i])
+	}
+	//posts = reversePosts()
 }
 
 func buildHandlers() {
@@ -64,27 +85,27 @@ func errorHandler(w http.ResponseWriter, req *http.Request, status int) {
 func postHandler(w http.ResponseWriter, r *http.Request) {
 	title := strings.TrimPrefix(r.URL.Path, "/post/")
 	posts := []Post{getPostByURLTitle(title)}
-	page := Page{name, posts, "blog"}
+	page := Page{name, years, posts, "blog"}
 	renderTemplates(w, page)
 }
 
 func aboutHandler(w http.ResponseWriter, r *http.Request) {
-	page := Page{name, []Post{}, "about"}
+	page := Page{name, nil, []Post{}, "about"}
 	renderTemplates(w, page)
 }
 
 func pastHandler(w http.ResponseWriter, r *http.Request) {
-	page := Page{name, posts, "past"}
+	page := Page{name, years, posts, "past"}
 	renderTemplates(w, page)
 }
 
 func keruHandler(w http.ResponseWriter, r *http.Request) {
 	posts := []Post{getPostByURLTitle("The-Girl-Who-Kicked-a-Rabbit")}
-	page := Page{name, posts, "blog"}
+	page := Page{name, years, posts, "blog"}
 	renderTemplates(w, page)
 }
 func contactHandler(w http.ResponseWriter, r *http.Request) {
-	page := Page{name, []Post{}, "contact"}
+	page := Page{name, nil, []Post{}, "contact"}
 	renderTemplates(w, page)
 }
 

postUtils.go

@@ -10,17 +10,17 @@ import (
 	"time"
 )
 
-//Post : Is exported
 type Post struct {
 	Date       time.Time
 	NormalDate string
+	Year	   int
 	Title      string
 	URLTitle   string
 	Content    template.HTML
 }
 
 const htmlDateLayout = "2006-01-02"
-const normalDateLayout = "02 Jan - 06"
+const normalDateLayout = "02 Jan"
 var modTime time.Time
 
 func newPost(path string, f os.FileInfo, err error) error {
@@ -39,15 +39,87 @@ func newPost(path string, f os.FileInfo, err error) error {
 	doc, _ := html.Parse(strings.NewReader(s))
 	dateParsed := getDate(doc)
 	dateFormatted := dateParsed.Format(normalDateLayout)
+	fmt.Println(dateParsed.Year())
 	var p = Post{
 		dateParsed,
 		dateFormatted,
+		dateParsed.Year(),
 		title,
 		strings.Replace(title, " ", "-", -1),
 		template.HTML(string(content[:len(content)])),
 	}
 
+	fmt.Println(len(years))
+	if len(years) == 0 { //List is empty
+		fmt.Println("first")
+		years = append(years, []Post{p})
+	} else { // or go through each year
+		for i := 0; i < len(years); i++ {
+			if p.Year < years[i][0].Year{//This year is before the current year
+				// Insert a new year before this year
+				fmt.Println("earlier")
+				if i == 0 {
+					var earliestYear = [][]Post{[]Post{p}}
+					years = append(earliestYear, years...)
+					fmt.Println("earliest")
+				} else {
+					years = append(years[:i+1],years[i:]...)
+					years[i] = []Post{p}
+					fmt.Println("early inbetween")
+				}
+				break
+			} else if  p.Year == years[i][0].Year { //found the year
+				fmt.Println("same year")
+				//n := append(years[i], p) //add the post to the year (fix sorting of that later)
+				n := insertPostAccordingToDate(p, years[i])
+				years[i] = n
+				break
+			} else if p.Year > years[i][0].Year { //Is this year greater?
+				fmt.Println("older")
+				if i == len(years) - 1 { // Is this the final element?
+					fmt.Println("oldest")
+					y := append(years, []Post{p}) // then append a new year
+					years = y
+					break
+				} else if years[i+1][0].Year > p.Year{ // Is the next year greater than the post's year?
+					fmt.Println("Inbetween")
+					// Insert a new year in between
+					years = append(years[:i+2], years[i+1:]...)
+					//years = append(years[:i+1], years[i:]...)
+					years[i+1] = []Post{p}
+					break
+				}
+			}
+		}
+	}
+	fmt.Println("")
+
+	/*
+	var finalYearExist := years[len(years)] != nil
+	var postIsNewest := years[len(years)][0].Date.Year() < p.Date.Year()
+	if finalYearsExist && postIsNewest { //is the year of this post greater than the year of the posts at the final slice?
+		var newYear := []Post{p} // Then add a nice slice with this post as an element
+		years = append(years, newYear)
+	} else {
+		var yearExists := false
+		for i := 0; i < len(years); i++ { //go through each year
+			if p.Date.Year() == years[i][0].Date.Year() { //found the year
+				yearExists = true
+				years = append(years[i], p) //add the post to the year
+				break
+			}
+		}
+		if yearExists == false {
+		}
+	}
+	aYear := years[0]
+	yearPosts := years[p.Date.Year()]
+	yearPosts = append(yearPosts, p)
+	//yearPosts = insertPostAccordingToDate(p, yearPosts)
+	years[p.Date.Year()] = yearPosts
+
 	posts = insertPostAccordingToDate(p, posts)
+	*/
 	return nil
 }
 
@@ -74,34 +146,49 @@ func getDate(n *html.Node) time.Time {
 	return t
 }
 
-func reversePosts() []Post {
+func reverseYears() [][]Post {
-	length := len(posts)
+	length := len(years)
+	s := make([][]Post, length)
+	for i := 0; i < length; i++ {
+		s[i] = years[length-(i+1)] }
+	return s
+}
+
+func reversePosts(slice []Post) []Post {
+	length := len(slice)
 	s := make([]Post, length)
 	for i := 0; i < length; i++ {
-		s[i] = posts[length-(i+1)]
+		s[i] = slice[length-(i+1)]
 	}
 	return s
 }
 
 func getPostByURLTitle(title string) Post {
-	for _, post := range posts {
+	for _, year := range years {
-		if post.URLTitle == title {
+		for _, post := range year {
-			return post
+			if post.URLTitle == title {
+				return post
+			}
 		}
 	}
+	////for _, post := range posts {
+	//	if post.URLTitle == title {
+	//		return post
+	//	}
+	//}
 	return Post{}
 }
 
-func insertPostAccordingToDate(post Post, arr []Post) []Post {
+func insertPostAccordingToDate(post Post, postSlice []Post) []Post {
-	for i, p := range arr {
+	for i, p := range postSlice {
 		if p.Date.After(post.Date) {
-			s := make([]Post, len(arr)+1, cap(arr)+1)
+			s := make([]Post, len(postSlice)+1, cap(postSlice)+1)
-			copy(s[:], arr[:])     //make a copy of the slice
+			copy(s[:], postSlice[:])     //make a copy of the slice
-			copy(s[i+1:], arr[i:]) //move the upper part of the slice ahead, creating a hole
+			copy(s[i+1:], postSlice[i:]) //move the upper part of the slice ahead, creating a hole
 			s[i] = post            //insert new element into hole
 			return s
 		}
 	}
-	posts = append(posts, post)
+	postSlice = append(postSlice, post)
-	return posts
+	return postSlice
 }

templates/blog.tmpl

@@ -7,46 +7,11 @@
 		<link rel="stylesheet" href="/css/style.css">
 	</head>
 	<body>
-		<div class="titleArea" style="margin-bottom:30px;">
+		{{template "title" .}}
-			<ul id=titleArea>
-				<li style="width:270px;">
-					<h1 style="margin-bottom:0px;"><a class="title" href="/" style="text-decoration: none;">{{.Title}}</a></h1>
-					<div class="tagline">
-						<p style="text-indent: 0; margin-top:10px;">play, talk, develop</p>
-					</div>
-				</li>
-				<li style="width:568px;padding:50px;">
-				</li>
-			</ul>
-		</div>
 		<div class="section">
 			<ul id="section">
-				<li>
+				{{template "navbar" .}}
-					<div class="menu" style="width:270px;">
+				{{template "main" .}}
-						<ul id="menu">
-							<!-- <li><a class={{if eq .CurrentPage "blog"}}		"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/">blog</a></li>  -->
-							<li><a class={{if eq .CurrentPage "past"}}		"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/past">past</a></li>
-							<li><a class={{if eq .CurrentPage "keru_shoujo"}}		"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/the_girl_who_kicked_a_rabbit">the girl who kicked a rabbit</a></li>
-							<li><a class={{if eq .CurrentPage "about"}}		"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/about">about</a></li>
-							<li><a class={{if eq .CurrentPage "contact"}}	"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/contact">contact</a></li>
-						</ul>		
-					</div>
-				</li>
-				<li>
-					<div class="contents">
-						{{if eq .CurrentPage "blog"}}
-							<article class="posts">{{template "content" .}}</article>
-						{{else if eq .CurrentPage "about"}}
-							<div>{{template "about" .}}</div>
-						{{else if eq .CurrentPage "past"}}
-							<div>{{template "past" .}}</div>
-						{{else if eq .CurrentPage "keru_shoujo"}}
-							<div>{{template "keru_shoujo" .}}</div>
-						{{else if eq .CurrentPage "contact"}}
-							<div>{{template "contact" .}}</div>
-						{{end}}
-					</div>
-				</li>
 			</ul>
 		</div>
 	</body>

templates/main.tmpl

@@ -0,0 +1,17 @@
+{{define "main"}}
+<li>
+	<div class="contents">
+		{{if eq .CurrentPage "blog"}}
+			<article class="posts">{{template "content" .}}</article>
+		{{else if eq .CurrentPage "about"}}
+			<div>{{template "about" .}}</div>
+		{{else if eq .CurrentPage "past"}}
+			<div>{{template "past" .}}</div>
+		{{else if eq .CurrentPage "keru_shoujo"}}
+			<div>{{template "keru_shoujo" .}}</div>
+		{{else if eq .CurrentPage "contact"}}
+			<div>{{template "contact" .}}</div>
+		{{end}}
+	</div>
+</li>
+{{end}}

templates/navbar.tmpl

@@ -0,0 +1,12 @@
+{{define "navbar"}}
+<li>
+	<div class="menu">
+		<ul id="menu">
+			<li><a class={{if eq .CurrentPage "past"}} "menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/past">past</a></li>
+			<li><a class={{if eq .CurrentPage "keru_shoujo"}} "menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/the_girl_who_kicked_a_rabbit">the girl who kicked a rabbit</a></li>
+			<li><a class={{if eq .CurrentPage "about"}}	"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/about">about</a></li>
+			<li><a class={{if eq .CurrentPage "contact"}} "menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/contact">contact</a></li>
+		</ul>		
+	</div>
+</li>
+{{end}}

templates/past.tmpl

@@ -1,17 +1,28 @@
 {{define "past"}}
 <article class="post">
-	<ul style="width: max-content; list-style: none;">
+	<ul id=yearline style="width: max-content; list-style: none;">
-		{{with .Posts}}
+		{{with .Years}}
 		{{range .}}
-			<li>
+			<li class="yearline">
-				<div style="display: flex; justify-content: space-between; ">
+				<!-- I mean just what the fuck is going on in that line below -->
-				<div style="padding-right: 20px">
+				<!-- Like, I know, but it's still ridiculous -->
+				{{(index . 0).Year}}
+			</li>
+			{{range .}}
+				<li>
+					<div style="display: flex; justify-content: space-between; ">
+						<div style="padding-right: 20px">
 							<a class="no-link" style="text-decoration: none;" href="/post/{{.URLTitle}}">{{.Title}}</a>
-				</div>
+						</div>
-				<div>
+						<div>
 							{{.NormalDate}}
-				</div>
+						</div>
-				</div>{{end}}{{end}}
+					</div>
+				</li>
+			{{end}}
+			<li class="yearend"/>
+		{{end}}
+		{{end}}
 	</ul>
 </article>
 {{end}}

templates/title.tmpl

@@ -0,0 +1,14 @@
+{{define "title"}}
+<div class="titleArea">
+	<ul id=titleArea>
+		<li>
+			<h1 style="margin-bottom:0px;"><a class="title" href="/" style="text-decoration: none;">{{.Title}}</a></h1>
+			<div class="tagline">
+				<p style="text-indent: 0; margin-top:10px;">play, talk, develop</p>
+			</div>
+		</li>
+		<li style="width:568px;padding:50px;">
+		</li>
+	</ul>
+</div>
+{{end}}