Initial work on a demo view. But brunch won't build demo-app.js for some reason.

app/lib/Router.coffee

@@ -16,8 +16,9 @@ module.exports = class CocoRouter extends Backbone.Router
     # editor views tend to have the same general structure
     'editor/:model(/:slug_or_id)(/:subview)': 'editorModelView'
 
-    # Experimenting with direct links
+    # Direct links
-    'test/*subpath': go('test')
+    'test/*subpath': go('TestView')
+    'demo/*subpath': go('DemoView')
     'play/ladder/:levelID': go('play/ladder/ladder_view')
     'play/ladder': go('play/ladder_home')
 

app/styles/demo.sass

@@ -0,0 +1,14 @@
+#demo-view
+  margin: 0 20px
+  
+  h2
+    background: #add8e6
+    font-family: Arial, Geneva, sans-serif
+    padding: 20px
+    font-weight: bold
+
+  #demo-wrapper
+    width: 78%
+    
+  #demo-nav
+    width: 20%

app/templates/demo.jade

@@ -0,0 +1,22 @@
+h2 Demo Page
+
+ol.breadcrumb
+  for path in parentFolders
+    li
+      a(href=path.url)= path.name
+  li.active= currentFolder
+
+.well.pull-left#demo-wrapper
+  #demo-area
+    
+.nav.nav-pills.nav-stacked.pull-right.well#demo-nav
+  for child in children
+    li(class=child.type)
+      a(href=child.url).small
+        if child.type == 'folder'
+          span.glyphicon.glyphicon-folder-close
+        else
+          span.glyphicon.glyphicon-file
+        span.spl= child.name
+        if child.type == 'folder'
+          strong (#{child.size})

app/views/TestView.coffee

@@ -1,7 +1,9 @@
 CocoView = require 'views/kinds/CocoView'
 template = require 'templates/test'
+requireUtils = require 'lib/requireUtils'
 
-TEST_BASE_PATH = 'test/app/'
+TEST_REQUIRE_PREFIX = 'test/app/'
+TEST_URL_PREFIX = '/test/'
 
 module.exports = TestView = class TestView extends CocoView
   id: "test-view"
@@ -33,67 +35,18 @@ module.exports = TestView = class TestView extends CocoView
     
   getRenderData: ->
     c = super(arguments...)
-    c.parentFolders = @getParentFolders()
+    c.parentFolders = requireUtils.getParentFolders(@subPath, TEST_URL_PREFIX)
-    c.children = @getChildren()
+    c.children = requireUtils.parseImmediateChildren(@specFiles, @subPath, TEST_REQUIRE_PREFIX, TEST_URL_PREFIX)
     parts = @subPath.split('/')
     c.currentFolder = parts[parts.length-1] or parts[parts.length-2] or 'All'
     c
     
-  getParentFolders: ->
-    return [] unless @subPath
-    paths = []
-    parts = @subPath.split('/')
-    while parts.length
-      parts.pop()
-      paths.unshift {
-        name: parts[parts.length-1] or 'All'
-        url: '/test/' + parts.join('/')
-      }
-    paths
-    
-  getChildren: ->
-    return [] unless @specFiles
-    folders = {}
-    files = {}
-    
-    requirePrefix = TEST_BASE_PATH + @subPath
-    if requirePrefix[requirePrefix.length-1] isnt '/'
-      requirePrefix += '/'
-      
-    for f in @specFiles
-      f = f[requirePrefix.length..]
-      continue unless f
-      parts = f.split('/')
-      name = parts[0]
-      group = if parts.length is 1 then files else folders
-      group[name] ?= 0
-      group[name] += 1
-
-    children = []
-    urlPrefix = '/test/'+@subPath
-    urlPrefix += '/' if urlPrefix[urlPrefix.length-1] isnt '/'
-    
-    for name in _.keys(folders)
-      children.push { 
-        type:'folder',
-        url: urlPrefix+name
-        name: name+'/'
-        size: folders[name]
-      }
-    for name in _.keys(files)
-      children.push {
-        type:'file',
-        url: urlPrefix+name
-        name: name
-      }
-    children
-    
   # RUNNING TESTS
   
   initSpecFiles: ->
     @specFiles = TestView.getAllSpecFiles()
     if @subPath
-      prefix = TEST_BASE_PATH + @subPath
+      prefix = TEST_REQUIRE_PREFIX + @subPath
       @specFiles = (f for f in @specFiles when f.startsWith prefix)
 
   @runTests: (specFiles) ->

config.coffee

@@ -35,7 +35,8 @@ exports.config =
           (bower_components[\/\\]aether[\/\\]build[\/\\]aether.js)
         )///
         'javascripts/test-app.js': /^test[\/\\]app/
-#        'test/javascripts/test-vendor.js': /^test[\/\\](?=vendor)/
+        'javascripts/demo-app.js': /^demo/
+        
       order:
         before: [
           'bower_components/jquery/dist/jquery.js'

demo/views/editor/PatchesView.demo.coffee

@@ -0,0 +1,21 @@
+PatchesView = require 'views/editor/patches_view'
+CocoModel = require 'models/CocoModel'
+
+class BlandModel extends CocoModel
+  @className: 'Bland'
+  @schema: {
+    type: 'object'
+    additionalProperties: false
+    properties:
+      number: {type: 'number'}
+      object: {type: 'object'}
+      string: {type: 'string'}
+      _id: {type: 'string'}
+  }
+  urlRoot: '/db/bland'
+
+
+module.exports = ->
+  model = new BlandModel({_id:'12345'})
+  new PatchesView(model)
+  

test/app/lib/requireUtils.coffee

@@ -0,0 +1,48 @@
+module.exports.getParentFolders = (subPath, urlPrefix='/test/') ->
+  return [] unless subPath
+  paths = []
+  parts = subPath.split('/')
+  while parts.length
+    parts.pop()
+    paths.unshift {
+      name: parts[parts.length-1] or 'All'
+      url: urlPrefix + parts.join('/')
+    }
+  paths
+  
+module.exports.parseImmediateChildren = (allChildren, subPath, baseRequirePath='test/app/', urlPrefix='/test/') ->
+  return [] unless allChildren
+  folders = {}
+  files = {}
+
+  requirePrefix = baseRequirePath + subPath
+  if requirePrefix[requirePrefix.length-1] isnt '/'
+    requirePrefix += '/'
+
+  for f in allChildren
+    f = f[requirePrefix.length..]
+    continue unless f
+    parts = f.split('/')
+    name = parts[0]
+    group = if parts.length is 1 then files else folders
+    group[name] ?= 0
+    group[name] += 1
+
+  children = []
+  urlPrefix += subPath
+  urlPrefix += '/' if urlPrefix[urlPrefix.length-1] isnt '/'
+
+  for name in _.keys(folders)
+    children.push {
+      type:'folder',
+      url: urlPrefix+name
+      name: name+'/'
+      size: folders[name]
+    }
+  for name in _.keys(files)
+    children.push {
+      type:'file',
+      url: urlPrefix+name
+      name: name
+    }
+  children

test/app/views/DemoView.coffee

@@ -0,0 +1,85 @@
+CocoView = require 'views/kinds/CocoView'
+template = require 'templates/demo'
+requireUtils = require 'lib/requireUtils'
+
+DEMO_REQUIRE_PREFIX = 'demo/app/'
+DEMO_URL_PREFIX = '/demo/'
+
+###
+  What are demo files?
+  
+  They could be a function which returns an element to insert into the demo page.
+  But what about demoing achievements? They'll get put into the main html. Or modals.
+  Well, I was thinking that a single folder would show all demos at the same time, line them up.
+  But it'd be confusing to have a whole bunch of achievement demos show up all at the same time?
+  Maybe there could be a button to show all the demos. Hmm, that'd be cool.
+  It could work like Jasmine, where it modifies the path and so when you select to run them, they all run with page reloads.
+  I think for now, I'll just say: have it be a function which we can run anytime.
+  It may or may not return an element to be inserted into the main area.
+    
+  Another idea. Do we want root views to just take over the full view?
+  Or should they just go into the central part?
+  Probably should take over the full view, and if you want to get out of the demo, you navigate back.
+  
+###
+
+module.exports = DemoView = class DemoView extends CocoView
+  id: "demo-view"
+  template: template
+
+  # INITIALIZE
+
+  constructor: (options, @subPath='') ->
+    super(options)
+    @subPath = @subPath[1..] if @subPath[0] is '/'
+    @loadDemoingLibs() unless DemoView.loaded
+
+  loadDemoingLibs: ->
+    @queue = new createjs.LoadQueue()
+    @queue.on('complete', @scriptsLoaded, @)
+    for f in ['jasmine', 'jasmine-html', 'boot', 'mock-ajax', 'demo-app']
+      @queue.loadFile({
+        src: "/javascripts/#{f}.js"
+        type: createjs.LoadQueue.JAVASCRIPT
+      })
+
+  scriptsLoaded: ->
+    @initDemoFiles()
+    @children = requireUtils.parseImmediateChildren(@demoFiles, @subPath, DEMO_REQUIRE_PREFIX, DEMO_URL_PREFIX)
+    @render()
+    @runDemo()
+
+  # RENDER DATA
+
+  getRenderData: ->
+    c = super(arguments...)
+    c.parentFolders = requireUtils.getParentFolders(@subPath, DEMO_URL_PREFIX)
+    c.children = @children or []
+    parts = @subPath.split('/')
+    c.currentFolder = parts[parts.length-1] or parts[parts.length-2] or 'All'
+    c
+
+  # RUNNING DEMOS
+
+  initDemoFiles: ->
+    @demoFiles = @getAllDemoFiles()
+    if @subPath
+      prefix = TEST_REQUIRE_PREFIX + @subPath
+      @demoFiles = (f for f in @demoFiles when f.startsWith prefix)
+
+  runDemo: ->
+    # TODO: Maybe have an option to run all demos in this folder at the same time?
+    return unless @subPath and _.last(@subPath.split('/')).indexOf('.demo') > -1
+    requirePath = DEMO_REQUIRE_PREFIX + @subPath
+    demoFunc = require requirePath
+    if not _.isFunction(demoFunc)
+      console.error "Demo files must export a function. #{requirePath} does not."
+      return
+    view = demoFunc()
+    return unless view
+    @$el.find('#demo-area').empty().append(view.el)
+    # TODO, maybe handle root views differently than modal views differently than everything else?
+
+  getAllDemoFiles = ->
+    allFiles = window.require.list()
+    (f for f in allFiles when f.indexOf('.demo') > -1)