Przeglądaj źródła

Main navigation stack

Markus Ochel 13 lat temu
rodzic
commit
f7d30f58e3

+ 23 - 0
admin/controllers/authors.coffee

@@ -0,0 +1,23 @@
+Spine       = require('spine/core')
+# $           = Spine.$
+templates   = require('duality/templates')
+
+Author      = require('models/author')
+
+
+class Authors extends Spine.Controller
+  className: 'authors panel'
+
+  constructor: ->
+    super
+    Author.fetch()
+    @active @render
+
+  render: ->
+    context = 
+      authors: Author.all()
+    @el.html templates.render('authors.html', {}, context)
+    @
+
+
+module.exports = Authors

+ 12 - 35
admin/controllers/index.coffee

@@ -1,22 +1,12 @@
 Spine       = require('spine/core')
+require('spine/route')
+require('spine/manager')
+
 templates   = require('duality/templates')
 session     = require('session')
 
-# Sites       = require('controllers/sites')
-# Authors     = require('controllers/authors')
-# Collections = require('controllers/collections')
-# Essays      = require('controllers/essays')
-# Blocks      = require('controllers/blocks')
-# Sponsors    = require('controllers/sponsors')
-# Contacts    = require('controllers/contacts')
-
-Site        = require('models/site')
-Author      = require('models/author')
-Collection  = require('models/collection')
-Essay       = require('models/essay')
-Block       = require('models/block')
-Sponsor     = require('models/sponsor')
-Contact     = require('models/contact')
+MainNav   = require('controllers/main-nav')
+MainStack   = require('controllers/main-stack')
 
 
 class App extends Spine.Controller
@@ -28,7 +18,7 @@ class App extends Spine.Controller
   checkSession: ->
     session.info (err, info) =>
       if '_admin' in info.userCtx.roles
-        @render()
+        @startApp()
       else
         username = 'admin'
         pass = 'couchaxs'
@@ -37,30 +27,17 @@ class App extends Spine.Controller
             alert "Error logging in as #{username}: #{err}"
           else
             if '_admin' in resp.roles
-              @render()
+              @startApp()
             else
               alert "User #{username} does not have permission"
 
-  render: ->
-    site = new Sites
-    Site.fetch()
-    Author.fetch()
-    Collection.fetch()
-    Essay.fetch()
-    Block.fetch()
-    Sponsor.fetch()
-    Contact.fetch()
+  startApp: ->
+    @mainNav   = new MainNav
+    @mainStack = new MainStack
 
-    @context =
-      sites: Site.all()
-      authors: Author.all()
-      collections: Collection.all()
-      essays: Essay.all()
-      blocks: Block.all()
-      sponsors: Sponsor.all()
-      contacts: Contact.all()
+    @append @mainNav, @mainStack
 
-    @el.html templates.render('home.html', {}, @context)
+    Spine.Route.setup()
 
 
 module.exports = App

+ 18 - 0
admin/controllers/main-nav.coffee

@@ -0,0 +1,18 @@
+Spine       = require('spine/core')
+$           = Spine.$
+templates   = require('duality/templates')
+
+
+class MainNav extends Spine.Controller
+  className: 'main nav'
+
+  constructor: ->
+    super
+    @render()
+
+  render: ->
+    @el.html templates.render('main-nav.html', {}, {})
+    @
+
+
+module.exports = MainNav

+ 27 - 0
admin/controllers/main-stack.coffee

@@ -0,0 +1,27 @@
+Spine       = require('spine/core')
+
+Sites       = require('controllers/sites')
+Authors     = require('controllers/authors')
+# Collections = require('controllers/collections')
+# Essays      = require('controllers/essays')
+# Blocks      = require('controllers/blocks')
+# Sponsors    = require('controllers/sponsors')
+# Contacts    = require('controllers/contacts')
+
+
+class MainStack extends Spine.Stack
+  className: 'main stack'
+
+  controllers:
+    sites: Sites
+    authors: Authors
+
+  default: 'sites'
+
+  routes:
+    '/sites':   'sites'
+    '/authors': 'authors'
+
+
+module.exports = MainStack
+    

+ 23 - 0
admin/controllers/sites.coffee

@@ -0,0 +1,23 @@
+Spine       = require('spine/core')
+# $           = Spine.$
+templates   = require('duality/templates')
+
+Site        = require('models/site')
+
+
+class Sites extends Spine.Controller
+  className: 'sites panel'
+
+  constructor: ->
+    super
+    Site.fetch()
+    @active @render
+
+  render: ->
+    context = 
+      sites: Site.all()
+    @el.html templates.render('sites.html', {}, context)
+    @
+
+
+module.exports = Sites

+ 1 - 1
admin/kanso.json

@@ -29,7 +29,7 @@
     "handlebars": null,
     "handlebars-helpers": null,
     "duality-handlebars": null,
-
+    "showdown": null,
     "jquery": null,
     "spine": null,
     "underscore": null

+ 1 - 0
admin/models/author.coffee

@@ -3,6 +3,7 @@ require('lib/spine-couch-ajax')
 
 class Author extends Spine.Model
   @configure "Author", "site", "name", "email", "bio", "links", "photo_url"
+  
   @extend Spine.Model.CouchAjax
   
   @nameSort: (a, b) ->

+ 1 - 0
admin/models/block.coffee

@@ -3,6 +3,7 @@ require('lib/spine-couch-ajax')
 
 class Block extends Spine.Model
   @configure "Block", "site", "code", "name", "content"
+  
   @extend Spine.Model.CouchAjax
   
   @nameSort: (a, b) ->

+ 1 - 0
admin/models/collection.coffee

@@ -3,6 +3,7 @@ require('lib/spine-couch-ajax')
 
 class Collection extends Spine.Model
   @configure "Collection", "site", "slug", "name", "intro"
+  
   @extend Spine.Model.CouchAjax
   
   @nameSort: (a, b) ->

+ 1 - 0
admin/models/contact.coffee

@@ -3,6 +3,7 @@ require('lib/spine-couch-ajax')
 
 class Contact extends Spine.Model
   @configure "Contact", "name", "email", "note"
+  
   @extend Spine.Model.CouchAjax
   
   @nameSort: (a, b) ->

+ 1 - 0
admin/models/essay.coffee

@@ -3,6 +3,7 @@ require('lib/spine-couch-ajax')
 
 class Essay extends Spine.Model
   @configure "Essay", "site", "slug", "title", "intro", "body", "published", "published_at", "updated_at", "author_id", "sponsor_id", "collections"
+  
   @extend Spine.Model.CouchAjax
   
   @titleSort: (a, b) ->

+ 1 - 0
admin/models/site.coffee

@@ -3,6 +3,7 @@ require('lib/spine-couch-ajax')
 
 class Site extends Spine.Model
   @configure "Site", "name", "name_html", "tagline", "footer_html", "url", "theme", "css", "google_analytics_code"
+  
   @extend Spine.Model.CouchAjax
   
   @nameSort: (a, b) ->

+ 1 - 0
admin/models/sponsor.coffee

@@ -3,6 +3,7 @@ require('lib/spine-couch-ajax')
 
 class Sponsor extends Spine.Model
   @configure "Sponsor", "format", "name", "url", "label", "content", "note", "contact_id"
+  
   @extend Spine.Model.CouchAjax
   
   @nameSort: (a, b) ->

+ 191 - 0
admin/static/css/theme.styl

@@ -0,0 +1,191 @@
+@import url('http://fonts.googleapis.com/css?family=Lato:300,400,700')
+
+$tealColor  = #61E0DF // #97E6D3
+$greenColor = #81C977
+$brownColor = #B4805B
+$blueColor  = #BAD0EF
+$greyColor  = #b4b4b4
+
+$primaryColor = $blueColor
+$lightGrey    = #c4c4c4
+$linkColor    = darken($primaryColor, 20%)
+$textColor    = #848484
+
+// apply a natural box layout model to all elements
+*
+  border-box()
+
+body
+  margin: 0
+  padding: 0
+  background: #f3f3f3
+  color: $textColor
+  font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif
+  font-weight: 300
+  font-size: 16px
+  letter-spacing: 0em
+  word-spacing: 0.2em
+  line-height: 1.5em
+
+h1, h2, h3, h4, h5, h6
+  color: darken($textColor, 4%)
+  font-weight: 300
+  line-height: 1.2em
+
+h1
+  font-size: 3.5em
+h2
+  font-size: 2.5em
+h3
+  font-size: 2em
+h4
+  font-size: 1.5em
+h5
+  font-size: 1.125em
+  font-weight: 400
+h6
+  font-size: 0.875em
+  font-weight: 400
+  line-height: 1.5em
+
+a
+  color: $linkColor
+  text-decoration: none
+
+  &:hover
+    text-decoration: none
+  
+  &.button
+    display: inline-block
+    padding: 10px 20px
+    background: $primaryColor
+    color: #fff
+    font-weight: 400
+
+    &.large
+      font-size: 2em
+      line-height: 1.2em
+      padding: 14px 30px
+
+b
+  font-weight: 700
+
+strong
+ font-weight: 400 
+
+small
+  font-size: 0.875em
+  color: $lightGrey
+
+blockquote
+  position: relative
+  border-right: 10px solid $primaryColor
+  padding: 0 1.5em 0 2.5em
+  margin: 1.5em 0
+  text-align: right
+  font-size: 1.125em
+  font-weight: 300
+  &:before
+    content: '“'
+    position: absolute
+    top: 0.2em
+    left: 0
+    color: $primaryColor
+    font-size: 6em
+    font-weight: 700
+
+img
+  display: block
+  border: 0
+
+.app-logo
+  padding: 20px 0
+  margin-bottom: 30px
+  font-size: 3.25em
+  line-height: 0.8em
+  font-weight: 400
+  color: #fff
+  letter-spacing: -0.07em
+  word-spacing: 0em
+  white-space: nowrap
+  text-align: center
+
+.site-name
+  margin: 0 0 0.8em -0.05em
+  font-size: 5.25em
+  line-height: 0.8em
+  font-weight: 300
+  color: $lightGrey
+  letter-spacing: -0.07em
+  word-spacing: 0em
+  white-space: nowrap
+  a
+    color: $lightGrey
+  b, strong
+    color: $primaryColor
+
+span.label
+  font-weight: 300
+  color: $lightGrey
+
+.main.nav
+  position: absolute
+  top: 0
+  left: 0
+  bottom: 0
+  width: 150px
+  background: $primaryColor
+  overflow: auto
+
+  > ul
+    list-style-type: none
+    padding: 0
+    margin: 0
+
+    > li
+      padding: 0
+
+      a
+        display: block
+        padding: 5px 20px
+        font-weight: 400
+        color: #fff
+
+
+.main.stack
+  position: absolute
+  top: 0
+  left: 150px
+  right: 20%
+  bottom: 0
+  background: #fff
+  overflow: hidden
+
+  .panel
+    position: absolute
+    top: 0
+    bottom: 0
+    left: 0
+    right: 0
+    overflow: auto
+    padding: 20px 30px
+
+.stack > *:not(.active)
+  display: none
+
+section.essays
+
+  > ul.list
+    list-style-type: none
+    margin: 0
+    padding: 0
+
+    li.item
+      margin-bottom: 1em
+      
+      .meta
+        font-size: 0.875em
+        > a
+          display: inline-block
+          margin-right: 2em
+

+ 6 - 0
admin/templates/authors.html

@@ -0,0 +1,6 @@
+<h3>Authors</h3>
+<ul>
+  {{#each authors}}
+  <li>{{name}} ({{_id}})</li>
+  {{/each}}
+</ul>

+ 2 - 2
admin/templates/index.html

@@ -1,5 +1,3 @@
-<div id="app"></div>
-
 <script type="text/javascript">
   var $ = require('jquery');
   var exports = this;
@@ -10,3 +8,5 @@
     });
   });
 </script>
+
+<div id="app"></div>

+ 8 - 0
admin/templates/main-nav.html

@@ -0,0 +1,8 @@
+<div class="app-logo">kleks</div>
+<ul>
+  <li class="dashboard"><a href="#/">Dashboard</a></li>
+  <li class="sites"><a href="#/sites">Sites</a></li>
+  <li class="authors"><a href="#/authors">Authors</a></li>
+  <li class="collections"><a href="#/collections">Collections</a></li>
+  <li class="essays"><a href="#/essays">Essays</a></li>
+</ul>

+ 6 - 0
admin/templates/sites.html

@@ -0,0 +1,6 @@
+<h3>Sites</h3>
+<ul>
+  {{#each sites}}
+  <li>{{name}} ({{_id}})</li>
+  {{/each}}
+</ul>