Implemented article preview

cmd/frontend/articles.go

@@ -16,10 +16,18 @@ import (
 	b "streifling.com/jason/cpolis/cmd/backend"
 )
 
-type ArticlePreviewHtmlData struct {
+const (
+	EditMode = iota
+	PreviewMode
+)
+
+type EditorHTMLData struct {
 	Title       string
 	Description string
-	Content     template.HTML
+	Content     string
+	HTMLContent template.HTML
+	Tags        []*b.Tag
+	Mode        int
 }
 
 func ShowHub(c *b.Config, db *b.DB, s *b.CookieStore) http.HandlerFunc {
@@ -31,14 +39,36 @@ func ShowHub(c *b.Config, db *b.DB, s *b.CookieStore) http.HandlerFunc {
 			template.Must(tmpl, err).ExecuteTemplate(w, "page-content", msg)
 		}
 
+		session.Values["article"] = nil
+		if err = session.Save(r, w); err != nil {
+			log.Println(err)
+			http.Error(w, err.Error(), http.StatusInternalServerError)
+			return
+		}
+
 		tmpl, err := template.ParseFiles(c.WebDir + "/templates/hub.html")
 		template.Must(tmpl, err).ExecuteTemplate(w, "page-content", session.Values["role"].(int))
 	}
 }
 
-func WriteArticle(c *b.Config, db *b.DB) http.HandlerFunc {
+func WriteArticle(c *b.Config, db *b.DB, s *b.CookieStore) http.HandlerFunc {
 	return func(w http.ResponseWriter, r *http.Request) {
-		tags, err := db.GetTagList()
+		session, err := s.Get(r, "cookie")
+		if err != nil {
+			tmpl, err := template.ParseFiles(c.WebDir + "/templates/login.html")
+			msg := "Session nicht mehr gültig. Bitte erneut anmelden."
+			template.Must(tmpl, err).ExecuteTemplate(w, "page-content", msg)
+		}
+
+		var data EditorHTMLData
+		if session.Values["article"] == nil {
+			data = EditorHTMLData{}
+		} else {
+			data = session.Values["article"].(EditorHTMLData)
+		}
+		data.Mode = EditMode
+
+		data.Tags, err = db.GetTagList()
 		if err != nil {
 			log.Println(err)
 			http.Error(w, err.Error(), http.StatusInternalServerError)
@@ -46,7 +76,7 @@ func WriteArticle(c *b.Config, db *b.DB) http.HandlerFunc {
 		}
 
 		tmpl, err := template.ParseFiles(c.WebDir + "/templates/editor.html")
-		template.Must(tmpl, err).ExecuteTemplate(w, "page-content", tags)
+		template.Must(tmpl, err).ExecuteTemplate(w, "page-content", data)
 	}
 }
 
@@ -59,6 +89,13 @@ func SubmitArticle(c *b.Config, db *b.DB, s *b.CookieStore) http.HandlerFunc {
 			template.Must(tmpl, err).ExecuteTemplate(w, "page-content", msg)
 		}
 
+		session.Values["article"] = nil
+		if err = session.Save(r, w); err != nil {
+			log.Println(err)
+			http.Error(w, err.Error(), http.StatusInternalServerError)
+			return
+		}
+
 		article := &b.Article{
 			Title:       r.PostFormValue("article-title"),
 			Description: r.PostFormValue("article-description"),
@@ -449,7 +486,7 @@ func UploadImage(c *b.Config) http.HandlerFunc {
 func PreviewArticle(c *b.Config, s *b.CookieStore) http.HandlerFunc {
 	return func(w http.ResponseWriter, r *http.Request) {
 		var err error
-		data := new(ArticlePreviewHtmlData)
+		data := EditorHTMLData{Mode: PreviewMode}
 
 		data.Title, err = b.ConvertToPlain(r.PostFormValue("article-title"))
 		if err != nil {
@@ -465,13 +502,14 @@ func PreviewArticle(c *b.Config, s *b.CookieStore) http.HandlerFunc {
 			return
 		}
 
-		content, err := b.ConvertToHTML(r.PostFormValue("article-content"))
+		data.Content = r.PostFormValue("article-content")
+		content, err := b.ConvertToHTML(data.Content)
 		if err != nil {
 			log.Println(err)
 			http.Error(w, err.Error(), http.StatusInternalServerError)
 			return
 		}
-		data.Content = template.HTML(content)
+		data.HTMLContent = template.HTML(content)
 
 		session, err := s.Get(r, "cookie")
 		if err != nil {
@@ -489,6 +527,6 @@ func PreviewArticle(c *b.Config, s *b.CookieStore) http.HandlerFunc {
 
 		tmpl, err := template.ParseFiles(c.WebDir + "/templates/editor.html")
 		tmpl = template.Must(tmpl, err)
-		tmpl.ExecuteTemplate(w, "preview", data)
+		tmpl.ExecuteTemplate(w, "page-content", data)
 	}
 }

cmd/main.go

@@ -12,7 +12,7 @@ import (
 
 func init() {
 	gob.Register(b.User{})
-	gob.Register(f.ArticlePreviewHtmlData{})
+	gob.Register(f.EditorHTMLData{})
 }
 
 func main() {
@@ -68,7 +68,7 @@ func main() {
 	mux.HandleFunc("GET /show-all-users-delete", f.ShowAllUsers(config, db, store, "delete-user"))
 	mux.HandleFunc("GET /this-issue", f.ShowCurrentArticles(config, db))
 	mux.HandleFunc("GET /unpublished-articles", f.ShowUnpublishedArticles(config, db))
-	mux.HandleFunc("GET /write-article", f.WriteArticle(config, db))
+	mux.HandleFunc("GET /write-article", f.WriteArticle(config, db, store))
 
 	mux.HandleFunc("POST /add-first-user", f.AddFirstUser(config, db, store))
 	mux.HandleFunc("POST /add-tag", f.AddTag(config, db, store))

web/templates/editor.html

@@ -2,28 +2,26 @@
 <h2>Editor</h2>
 
 <form id="edit-area">
-    <div class="btn-area">
+    {{if eq .Mode 0}}
-        <button class="btn" disabled hx-get="/hub" hx-target="#edit-area">Schreiben</button>
+    <button class="btn" hx-post="/preview-article" hx-target="#page-content">Vorschau</button>
-        <button class="btn" hx-post="/preview-article" hx-target="#edit-area">Vorschau</button>
-    </div>
 
     <div class="flex flex-col gap-y-1">
         <label for="article-title">Titel</label>
-        <input name="article-title" type="text" />
+        <input name="article-title" type="text" value="{{.Title}}" />
     </div>
     <div class="flex flex-col">
         <label for="article-description">Beschreibung</label>
-        <textarea name="article-description"></textarea>
+        <textarea name="article-description">{{.Description}}</textarea>
     </div>
     <div class="flex flex-col">
         <label for="article-content">Artikel</label>
-        <textarea name="article-content"></textarea>
+        <textarea name="article-content">{{.Content}}</textarea>
     </div>
 
     <div>
         <span>Tags</span>
         <div class="flex flex-wrap gap-x-4">
-            {{range .}}
+            {{range .Tags}}
             <div>
                 <input id="{{.Name}}" name="tags" type="checkbox" value="{{.ID}}" />
                 <label for="{{.Name}}">{{.Name}}</label>
@@ -41,6 +39,26 @@
         <input class="action-btn" type="submit" value="Senden" hx-post="/submit-article" hx-target="#page-content" />
         <button class="btn" hx-get="/hub" hx-target="#page-content">Abbrechen</button>
     </div>
+    {{else}}
+    <button class="btn" hx-get="/write-article" hx-target="#page-content">Schreiben</button>
+
+    <span>Titel</span>
+    <div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
+        {{.Title}}
+    </div>
+
+    <span>Beschreibung</span>
+    <div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
+        {{.Description}}
+    </div>
+
+    <span>Artikel</span>
+    <div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
+        <div class="prose">
+            {{.HTMLContent}}
+        </div>
+    </div>
+    {{end}}
 </form>
 
 <script>
@@ -72,23 +90,3 @@
 </div>
 {{end}}
 {{end}}
-
-
-{{define "preview"}}
-<span>Titel</span>
-<div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
-    {{.Title}}
-</div>
-
-<span>Beschreibung</span>
-<div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
-    {{.Description}}
-</div>
-
-<span>Artikel</span>
-<div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
-    <div class="prose">
-        {{.Content}}
-    </div>
-</div>
-{{end}}