basic pages and nav

2 files changed, 164 insertions, 17 deletions

diff --git a/src/model.lisp b/src/model.lisp
index 650e238..00edde2 100644
--- a/src/model.lisp
+++ b/src/model.lisp
@@ -166,7 +166,7 @@
 
 ;;; TRANSACTIONS
 
-(defun new-user (&key name)
+(defun new-user (&key name password)
   (with-transaction ()
     (make-instance 'user :name name)))
 
diff --git a/src/site.lisp b/src/site.lisp
index a21afa0..33fab15 100644
--- a/src/site.lisp
+++ b/src/site.lisp
@@ -1,6 +1,6 @@
 (defpackage #:vampire.site
   (:import-from #:lazybones #:defendpoint*)
-  (:import-from #:spinneret #:with-html #:with-html-string)
+  (:import-from #:spinneret #:with-html #:with-html-string #:deftag)
   (:local-nicknames
    (#:lzb #:lazybones)
    (#:client #:lazybones/client.parenscript)
@@ -60,9 +60,15 @@ page."
         (:meta :name "viewport" :content "width=device-width, initial-scale=1.0")
         (:link :rel "stylesheet" :href "/css/theme.css"))
        (:body
-        (:script :src "/js/vampire-api.js" :defer t)
         ,@body))))
 
+(defmacro defpage/session
+    (path (&key (title "") params setup) &body body)
+  `(defpage ,path (:title ,title :params ,params :setup ,setup
+                   :auth (logged-in-p) :notauth (lzb:http-redirect "/login"))
+     (header)
+     ,@body))
+
 
 (defmacro two-columns (col1 col2)
   "A Two-Column Layout Macro"
@@ -83,6 +89,31 @@ page."
 
 ;;; PAGE ELEMENTS
 
+(deftag form (inputs attrs &key (button "submit"))
+  `(progn
+     (:form ,@attrs
+            (progn ,@inputs)
+            (:button :type "submit" ,button))))
+
+(defun input (name placeholder &optional (type "text"))
+  (with-html
+    (:input
+     :name name
+     :placeholder placeholder
+     :type type)))
+
+(defun active-a (path text &key (class ""))
+  "generates an A element that has the `active` class when PATH is the
+path we're visiting"
+  (print (list :request-path (lzb:request-path)))
+  (with-html
+    (let ((classes (if (string-equal path (lzb:request-path))
+                       (str:join " " (list "active" class))
+                       class)))
+      (if (plusp (length classes))
+          (:a :class classes :href path text)
+          (:a :href path text)))))
+
 ;;; LOGIN PAGE
 
 ;;; HOME PAGE
@@ -167,7 +198,6 @@ page."
          (:span "playlist-duration"
                 (util:secs-to-hms (model::playlist-duration playlist))))))
 
-
 (defun playlist-control-app (playlist)
   (with-html
     (:script)))
@@ -175,19 +205,74 @@ page."
 (defparameter +vampire-session-cookie+ "SESSIONKEY")
 
 (defun logged-in-p ()
-  (a:when-let (token (lzb:response-cookie +vampire-session-cookie+))
+  (print 'logged-in-p)
+  (a:when-let (token (print (lzb:request-cookie +vampire-session-cookie+)))
     (model:lookup token)))
 
-(defpage "/"
-    (:title "Vampire"
-     :auth (logged-in-p)
-     :notauth (lzb:http-redirect "/login"))
-  (:p "Welcome to vampire"))
 
 
+(defun header ()
+  (with-html
+    (:header
+     (:hgroup
+      (:div :class "navbar2"
+            (:div :class "right vsep-container"
+                  (:a :class "vsep-item" :href "/about" "about")
+                  (:a :class "vsep-item" :href "/logout" "logout"))
+            (:h1 "V A M P I R E")))
+     (:hgroup
+      (:nav
+       (:div :class "navbar"
+             (active-a "/you" "YOU")
+             (active-a "/us" "US")
+             (active-a "/tracks" "TRACKS")))))))
+
+(defendpoint* :get "/" () ()
+  (if (logged-in-p)
+      (lzb:http-redirect "/you")
+      (lzb:http-redirect "/login")))
+
+(defpage/session "/you" (:title "Vampire ~ Your Stuff")
+  (:div :class "container"))
+
+(defpage/session "/us" (:title "Vampire ~ Our Playlists")
+  (:div :class "container"))
+
+(defpage/session "/tracks" (:title "Vampire ~ Track Library")
+  (:div :class "container"))
+
+(defpage/session "/about" (:title "Vampore ~ About")
+  (:div :class "container"
+        "to be done"))
+
+(defpage/session "/library" (:title "Vampire ~ Track Library"))
+
 (defpage "/login"
     (:title "Vampire - Login")
-  (:p "Go ahead and log in"))
+  (:div :class "container"
+        (form :button "Login" :method "POST" :action "/login"
+          (input "username" "User name")
+          (input "password" "Password" "password"))
+        (:a :href "/create-account" "Create Account")))
+
+(defendpoint* :post "/login" () (:body-vars (username password))
+  (a:if-let (user (model:login-user username password))
+    (let ((session (model:make-session user)))
+      (lzb:set-response-cookie
+       +vampire-session-cookie+ (model:key session))
+      (lzb:http-redirect "/"))
+    (lzb:http-redirect "/login")))
+
+(defpage "/create-account"
+    (:title "Vampire - Create Account")
+  (:div :class "container"
+        (form :action "/create-account" :method "POST"
+          (input "token" "Invite Token")
+          (input "name" "Choose User Name")
+          (input "password" "Choose a Passwrod" "password"))))
+
+
+
 
 (defpage "/playlist/:pl a-playlist:"
     (:title (playlist-title-string pl)
@@ -205,12 +290,74 @@ page."
 (defendpoint* :get "/css/theme.css" () ()
   (setf (lzb:response-header :content-type) "text/css")
   (lass:compile-and-write
-   (let ()
-     '(div
-       :background "#222222"
-       :color "white"))))
-
-;;; JAVASCRIT
+   '(:let ((main-background "#343434")
+           (main-textcolor "#dfdede")
+           (active-color "#aabbcc")
+           (active-background-color "#222222")
+           (link-color "#aaddbb")
+           (hover-color "#ddeeff")
+           (hover-backround-color "black")
+           (fringe-color "#aabbcc")
+           (padding "5px")
+           (bigger "1.7em"))
+     (body
+      :background #(main-background)
+      :color #(main-textcolor))
+
+     (a
+      :color #(link-color))
+
+     (header
+      :font-size 1.1em)
+
+     (.vsep-container
+      :display inline
+      :border-left 1px solid #(fringe-color)
+      (.vsep-item
+       :padding-right 4px
+       :padding-left 4px
+       :border-right 1px solid #(fringe-color)))
+     
+     (.right
+      :float right)
+     
+     (.inline
+      :display inline)
+
+     (.navbar2
+      :width 100%
+      :overflow auto
+      (h1
+       :float left
+       :width 100%
+       :text-align center))
+     
+     (.navbar
+      :width 100%
+      :overflow auto 
+      :border-bottom 1px solid #(fringe-color)
+      (a
+       :float left
+       :width 33%
+       :font-size #(bigger)
+       :text-align center
+       :text-decoration none)
+      ((:and a :hover)
+       :color #(hover-color)
+       :background #(hover-backround-color))
+      (a.active
+       :background #(active-background-color)
+       :color #(active-color)))
+
+     (:media "(max-width: 650px)"
+      (.navbar
+       (a
+        :float none
+        :display block
+        :width 100%
+        :text-align left))))))
+
+;;; JAVASCRIPT
 
 (defendpoint* :get "/js/vampire-api.js" () ()
   "Serves a javascript module called 'VampireApi'"