volt new overlay

app/main/assets/css/app.css.scss

@@ -0,0 +1 @@
+// Place your apps css here

app/main/config/dependencies.rb

@@ -0,0 +1,11 @@
+# Specify which components you wish to include when
+# the "home" component loads.
+
+# bootstrap css framework
+component 'bootstrap'
+
+# a default theme for the bootstrap framework
+component 'bootstrap_jumbotron_theme'
+
+# provides templates for login, signup, and logout
+component 'user_templates'

app/main/config/initializers/boot.rb

@@ -0,0 +1,10 @@
+# Place any code you want to run when the component is included on the client
+# or server.
+
+# To include code only on the client use:
+# if RUBY_PLATFORM == 'opal'
+#
+# To include code only on the server, use:
+# unless RUBY_PLATFORM == 'opal'
+# ^^ this will not send compile in code in the conditional to the client.
+# ^^ this include code required in the conditional.

app/main/config/routes.rb

@@ -0,0 +1,14 @@
+# See https://github.com/voltrb/volt#routes for more info on routes
+
+client '/about', action: 'about'
+
+# Routes for login and signup, provided by user_templates component gem
+client '/signup', component: 'user_templates', controller: 'signup'
+client '/login', component: 'user_templates', controller: 'login', action: 'index'
+client '/password_reset', component: 'user_templates', controller: 'password_reset', action: 'index'
+client '/forgot', component: 'user_templates', controller: 'login', action: 'forgot'
+client '/account', component: 'user_templates', controller: 'account', action: 'index'
+
+# The main route, this should be last. It will match any params not
+# previously matched.
+client '/', {}

app/main/controllers/main_controller.rb

@@ -0,0 +1,27 @@
+# By default Volt generates this controller for your Main component
+module Main
+  class MainController < Volt::ModelController
+    def index
+      # Add code for when the index view is loaded
+    end
+
+    def about
+      # Add code for when the about view is loaded
+    end
+
+    private
+
+    # The main template contains a #template binding that shows another
+    # template.  This is the path to that template.  It may change based
+    # on the params._component, params._controller, and params._action values.
+    def main_path
+      "#{params._component || 'main'}/#{params._controller || 'main'}/#{params._action || 'index'}"
+    end
+
+    # Determine if the current nav component is the active one by looking
+    # at the first part of the url against the href attribute.
+    def active_tab?
+      url.path.split('/')[1] == attrs.href.split('/')[1]
+    end
+  end
+end

app/main/models/user.rb

@@ -0,0 +1,12 @@
+# By default Volt generates this User model which inherits from Volt::User,
+# you can rename this if you want.
+class User < Volt::User
+  # login_field is set to :email by default and can be changed to :username
+  # in config/app.rb
+  field login_field
+  field :name
+
+  validate login_field, unique: true, length: 8
+  validate :email, email: true
+
+end

app/main/views/main/about.html

@@ -0,0 +1,7 @@
+<:Title>
+  About
+
+<:Body>
+  <h1>About</h1>
+
+  <p>About page...</p>

app/main/views/main/index.html

@@ -0,0 +1,6 @@
+<:Title>
+  Home
+
+<:Body>
+  <h1>Home</h1>
+

app/main/views/main/main.html

@@ -0,0 +1,29 @@
+<:Title>
+  {{ view main_path, "title", {controller_group: 'main'} }}
+
+<:Body>
+  <div class="container">
+    <div class="header">
+      <ul class="nav nav-pills pull-right">
+        <:nav href="/">Home</:nav>
+        <:nav href="/about">About</:nav>
+        <:user_templates:menu />
+      </ul>
+      <h3 class="text-muted">salama-debugger</h3>
+    </div>
+
+    <:volt:notices />
+
+    {{ view main_path, 'body', {controller_group: 'main'} }}
+
+    <div class="footer">
+      <p>&copy; Company {{ Time.now.year }}</p>
+    </div>
+
+  </div>
+
+<:Nav>
+  <li class="{{ if active_tab? }}active{{ end }}">
+    <a href="{{ attrs.href }}">{{ yield }}</a>
+  </li>
+