User registration fun

saxifrage · Dec 18, 2015 · 77285c2 · 77285c2
1 parent 6700922
commit 77285c2
Show file tree

Hide file tree

Showing 37 changed files with 668 additions and 110 deletions.
diff --git a/Gemfile b/Gemfile
@@ -25,5 +25,5 @@ group :development, :test do
   gem 'web-console', '~> 2.0'
   gem 'spring'
   gem 'pry-rails'
+  gem 'pry-nav'
 end
-
diff --git a/Gemfile.lock b/Gemfile.lock
@@ -100,6 +100,8 @@ GEM
       coderay (~> 1.1.0)
       method_source (~> 0.8.1)
       slop (~> 3.4)
+    pry-nav (0.2.4)
+      pry (>= 0.9.10, < 0.11.0)
     pry-rails (0.3.4)
       pry (>= 0.9.10)
     puma (2.11.1)
@@ -197,6 +199,7 @@ DEPENDENCIES
   jquery-rails
   kaminari
   pg
+  pry-nav
   pry-rails
   puma
   pundit

diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb
@@ -16,6 +16,7 @@ def index
   end
 
   def configure_permitted_parameters
-    devise_parameter_sanitizer.for(:sign_up) << :name
+    devise_parameter_sanitizer.for(:account_update).push(organizer_ids: [])
+    devise_parameter_sanitizer.for(:sign_up).push(:name, organizers_attributes: [:name, :description])
   end
 end
diff --git a/app/controllers/organizers_controller.rb b/app/controllers/organizers_controller.rb
@@ -6,7 +6,7 @@ class OrganizersController < ApplicationController
   # GET /organizers
   # GET /organizers.json
   def index
-    @organizers = Organizer.all
+    @organizers = Organizer.order(:name)
     render json: @organizers
   end
 

diff --git a/app/serializers/organizer_serializer.rb b/app/serializers/organizer_serializer.rb
@@ -1,15 +1,11 @@
 class OrganizerSerializer < ActiveModel::Serializer
   root :organizer
-  attributes :type, :description, :address, :logo, :name, :id, :uid, :url
+  attributes :type, :description, :logo, :name, :id, :uid, :url
 
   def type
     'Organizer'
   end
 
-  def address
-    '999 Pancake Way'
-  end
-
   def logo
     object.logo_url
   end

diff --git a/client/home/HomeView.html b/client/home/HomeView.html
@@ -4,7 +4,7 @@
 	<div class="container">
 		<h1 class="hero__title">Learn.PGH</h1>
 		<h2 class="hero__desc">Pursue your passions and unlock new opportunities.</h2>
-		<a class="btn btn-primary" href="http://cityasacampus.org/map/" target="_blank">Explore the Map</a>
+		<a class="btn btn__secondary" href="http://cityasacampus.org/map/" target="_blank">Explore the Map</a>
 		<span class="hero__or">Or</span>
 		<form role="search" ng-submit="textSearch(term)">
           <div class="form-group">
@@ -88,25 +88,25 @@ <h2 class="hero__desc">Pursue your passions and unlock new opportunities.</h2>
 			</style>
 			<g id="Layer_1">
 				<polygon class="animate-opacity st10" points="554.3,-3.1 394.7,-3.1 330,-3.1 358.9,29.1 486.9,171.8 611.1,60.2 	"/>
-				
+
 					<rect x="1031.3" y="328" transform="matrix(-0.668 -0.7442 0.7442 -0.668 1564.7332 1545.681)" class="animate-opacity st11" width="191.7" height="191.7"/>
 				<polygon class="animate-opacity st12" points="833.9,558.3 890.7,621.6 1050.2,621.6 1086.1,589.4 958.1,446.8 	"/>
 				<polygon class="animate-opacity st12" points="148.7,217.8 118.4,184 -9.6,41.4 -152.2,169.4 -24.2,312 6.1,345.8 134.1,488.4 276.8,360.4 	"/>
-				<polygon class="animate-opacity st14" points="1570.8,-3.1 1509.8,-3.1 1459.3,-3.1 1344.6,99.8 1310.9,130.1 1168.2,258.2 1296.3,400.8 
+				<polygon class="animate-opacity st14" points="1570.8,-3.1 1509.8,-3.1 1459.3,-3.1 1344.6,99.8 1310.9,130.1 1168.2,258.2 1296.3,400.8
 					1438.9,272.8 1472.6,242.5 1615.3,114.4 1649,84.1 1746.2,-3.1 	"/>
 				<polygon class="animate-opacity st12" points="1150.2,592.9 1176,621.6 1405.1,621.6 1420.8,607.5 1292.8,464.8 	"/>
 				<polygon class="animate-opacity st12" points="641.8,412.2 499.1,540.2 465.4,570.5 511.2,621.6 572.2,621.6 695.4,621.6 769.8,554.8 	"/>
 				<polygon class="animate-opacity st14" points="1314.3,66.1 1391.4,-3.1 1252.3,-3.1 	"/>
-				<polygon class="animate-opacity st15" points="976.2,112.1 945.9,78.3 872.8,-3.1 749.6,-3.1 675.2,63.7 641.4,94 517.2,205.5 645.2,348.1 
+				<polygon class="animate-opacity st15" points="976.2,112.1 945.9,78.3 872.8,-3.1 749.6,-3.1 675.2,63.7 641.4,94 517.2,205.5 645.2,348.1
 					675.5,381.9 803.6,524.5 927.8,413 961.5,382.7 1104.2,254.7 	"/>
 				<polygon class="animate-opacity st10" points="1191.3,-3.1 1104.4,-3.1 1036.5,-3.1 933.8,-3.1 979.6,48 1009.9,81.8 1137.9,224.4 1280.6,96.4 	"/>
-				<polygon class="animate-opacity st11" points="1627.5,482.9 1597.2,449.1 1469.2,306.5 1326.6,434.5 1454.6,577.2 1484.9,610.9 1494.5,621.6 
+				<polygon class="animate-opacity st11" points="1627.5,482.9 1597.2,449.1 1469.2,306.5 1326.6,434.5 1454.6,577.2 1484.9,610.9 1494.5,621.6
 					1752,621.6 	"/>
-				<polygon class="animate-opacity st11" points="483.5,235.8 340.8,363.8 307.1,394.1 164.4,522.2 253.7,621.6 340.6,621.6 435.1,536.8 468.8,506.5 
+				<polygon class="animate-opacity st11" points="483.5,235.8 340.8,363.8 307.1,394.1 164.4,522.2 253.7,621.6 340.6,621.6 435.1,536.8 468.8,506.5
 					611.5,378.4 	"/>
-				<polygon class="animate-opacity st11" points="130.7,552.5 100.4,518.7 -27.6,376.1 -57.9,342.3 -186,199.7 -309.8,310.8 -309.8,348.7 
+				<polygon class="animate-opacity st11" points="130.7,552.5 100.4,518.7 -27.6,376.1 -57.9,342.3 -186,199.7 -309.8,310.8 -309.8,348.7
 					-200.6,470.3 -170.3,504.1 -64.8,621.6 -14.3,621.6 53.6,621.6 192.7,621.6 	"/>
-				<polygon class="animate-opacity st15" points="325.1,59.4 294.8,25.7 269,-3.1 39.9,-3.1 11.5,-3.1 24.2,11.1 152.2,153.7 182.5,187.5 310.5,330.1 
+				<polygon class="animate-opacity st15" points="325.1,59.4 294.8,25.7 269,-3.1 39.9,-3.1 11.5,-3.1 24.2,11.1 152.2,153.7 182.5,187.5 310.5,330.1
 					453.2,202.1 	"/>
 				<rect x="-310.5" y="-7" class="animate-opacity st2" width="2066.1" height="628.6"/>
 			</g>

diff --git a/client/index.html b/client/index.html
@@ -7,6 +7,7 @@
     <link rel="shortcut icon" href="shared/favicon/favicon.ico"/>
     <title></title>
     <link rel="stylesheet" href="app.min.css">
+    <link rel="stylesheet" href="vendors.min.css">
     <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,800,800italic">
     <script type="text/javascript" src="//maps.googleapis.com/maps/api/js"></script>
   </head>

diff --git a/client/index.js b/client/index.js
@@ -20,6 +20,8 @@ if (!(Modernizr.borderradius &&
     'caac.opportunity-instances.controller',
     'caac.users.login.controller',
     'caac.users.auth.service',
+    'caac.users.register.learners.controller',
+    'caac.users.register.organizers.controller',
     'ngRoute',
     'ng-token-auth',
     'angular.filter'
@@ -44,7 +46,15 @@ if (!(Modernizr.borderradius &&
       templateUrl: 'dashboard/DashboardView.html'
     }).when('/users/login', {
       controller: 'LoginController',
-      templateUrl: 'users/auth/LoginView.html'
+      templateUrl: 'users/auth/login/LoginView.html'
+    }).when('/users/register', {
+      templateUrl: 'users/auth/register/RegisterView.html'
+    }).when('/users/register/learners', {
+      controller: 'RegisterLearnersController',
+      templateUrl: 'users/auth/register/learners/RegisterLearnersView.html'
+    }).when('/users/register/organizers', {
+      controller: 'RegisterOrganizersController',
+      templateUrl: 'users/auth/register/organizers/RegisterOrganizersView.html'
     }).when('/', {
       controller: 'HomeController',
       templateUrl: 'home/HomeView.html'
@@ -87,4 +97,4 @@ if (!(Modernizr.borderradius &&
       }
     }
   ]);
-}
+}
diff --git a/client/index.scss b/client/index.scss
@@ -23,6 +23,8 @@
 @import './dashboard/DashboardStyle';
 @import './shared/navbar/NavbarStyle';
 @import './shared/copyright/CopyrightStyle';
+@import './shared/progress-indicator/ProgressIndicatorStyle';
 @import './home/HomeStyle';
 @import './opportunity-instances/OpportunityInstancesStyle';
-@import './users/auth/LoginStyle';
+@import './users/auth/login/LoginStyle';
+@import './users/auth/register/RegisterStyle'
diff --git a/client/opportunity-instances/OpportunityInstancesView.html b/client/opportunity-instances/OpportunityInstancesView.html
@@ -32,7 +32,7 @@ <h3 class="sub-banner-heading">{{opportunityInstance.neighborhood}}</h3>
           <h3 class="sub-banner-heading">{{opportunityInstance.registration_deadline | date:'MM/dd/yyyy'}}</h3>
         </div><!--/col-md-2-->
         <div class="col-md-2-5">
-          <a class="btn btn-primary btn-block" ng-class="{'disabled': registrationStatus}" href="{{opportunityInstance.registration_url}}" target="_blank">Register Now</a>
+          <a class="btn btn__secondary btn-block" ng-class="{'disabled': registrationStatus}" href="{{opportunityInstance.registration_url}}" target="_blank">Register Now</a>
         </div><!--/col-md-2-->
       </div><!--/row -->
     </div><!-- /container-->
@@ -155,8 +155,8 @@ <h4 class="detail-type">Ongoing?</h4>
         </div><!-- /opp-section-->
       </section>
 
-      
+
   </div><!-- /row-->
 </div><!-- /container-fluid-->
 </div><!--opportunity-instance-->
-<copyright></copyright>
+<copyright></copyright>
diff --git a/client/organizers/OrganizersService.js b/client/organizers/OrganizersService.js
@@ -0,0 +1,15 @@
+angular.module('caac.organizers.service', [
+  ])
+  .factory('OrganizersService',
+    function($http, $log) {
+      var logger = $log.getInstance('RegisterController');
+
+      var selectOrganizers = function() {
+        return $http.get('/organizers');
+      };
+
+      return {
+        selectOrganizers: selectOrganizers
+      };
+    }
+  );
diff --git a/client/shared/conf/_ThemeStyle.scss b/client/shared/conf/_ThemeStyle.scss
@@ -62,7 +62,7 @@ a{
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #494949;
-  font-size: 22px;
+  @include rem(font-size, 22px);
   padding: 7px 15px 10px;
   border-radius: 2px;
   font-weight: 700;
@@ -83,17 +83,17 @@ a{
   }
 }
 
-.btn-primary{
-  background-color: $brand-secondary;
+.btn__primary {
+  background-color: $brand-primary;
   color: $brand-white;
   &:active,
   &:hover {
-    background-color: darken($brand-secondary, 5%);
-    box-shadow: inset 0px 1px 0px $brand-secondary;
+    background-color: darken($brand-primary, 5%);
+    box-shadow: inset 0px 1px 0px $brand-primary;
   }
 }
 
-.btn-secondary {
+.btn__primary-light {
   background-color: $brand-primary-light;
   color: $brand-white;
   &:active,
@@ -103,6 +103,16 @@ a{
   }
 }
 
+.btn__secondary {
+  background-color: $brand-secondary;
+  color: $brand-white;
+  &:active,
+  &:hover {
+    background-color: darken($brand-secondary, 5%);
+    box-shadow: inset 0px 1px 0px $brand-secondary;
+  }
+}
+
 .btn-block{
   display: block;
   margin: 0 auto;
@@ -114,3 +124,94 @@ a{
 .icon {
 
 }
+
+//
+// Headings
+// --------------------------------------------------
+
+.title {
+  @include rem(margin-bottom, 50px);
+
+  h1 {
+    @include rem(font-size, 48px);
+    @include rem(margin, 0 0 15px 0)
+    color: $brand-primary;
+  }
+
+  h2 {
+    @include rem(font-size, 24px);
+    color: $brand-primary;
+    font-weight: 300;
+    @include rem(margin, 10px 0);
+  }
+}
+
+.title.secondary {
+  h1, h2 {
+    color: $brand-secondary;
+  }
+}
+
+.title.primary-light {
+  h1, h2 {
+    color: $brand-primary-light;
+  }
+}
+
+//
+// Forms
+// --------------------------------------------------
+
+.form {
+
+  button {
+    background-color: $brand-white;
+    border: 1px solid $brand-primary;
+    color: $brand-primary;
+    @include rem(margin, 25px 0);
+    @include transition(background .15s linear);
+    -webkit-appearance: none;
+    &:hover{
+        background-color: $brand-primary;
+        color: $brand-white;
+    }
+  }
+
+  button[type="submit"] {
+    @include rem(margin-top, 50px);
+  }
+
+  input, button {
+    width: 90%;
+    @include rem(-webkit-border-radius, 5px);
+    @include rem(-moz-border-radius, 5px);
+    @include rem(border-radius, 5px);
+    @include rem(padding, 20px);
+    @include rem(margin, 10px 0);
+    @include rem(font-size, 24px);
+    opacity: .8;
+    &:disabled {
+        background-color: $brand-gray;
+        color: $brand-white;
+    }
+    &:focus {
+        outline: 0;
+        opacity: 1;
+    }
+    @include transition(opacity .15s linear);
+  }
+
+  input.error {
+    border: 2px solid $brand-red;
+  }
+
+  input {
+    border: 1px solid $brand-gray;
+  }
+
+  p.error {
+    color: $brand-red;
+    @include rem(font-size, 20px);
+  }
+
+}
diff --git a/client/shared/progress-indicator/ProgressIndicatorDirective.js b/client/shared/progress-indicator/ProgressIndicatorDirective.js
@@ -0,0 +1,22 @@
+angular.module('caac.shared.progress-indicator.directive', [])
+  .controller('ProgressIndicatorController', function($scope) {
+      var self = $scope;
+      self.steps = [];
+
+      for (var i = 1; i <= self.numberOfSteps; i++) {
+        self.steps.push({ text: i, complete: i <= self.currentStep });
+        self.steps.push('');
+      }
+    }
+  )
+  .directive('progressIndicator', function() {
+    return {
+      restrict: 'E',
+      scope: {
+        currentStep: '=',
+        numberOfSteps: '='
+      },
+      templateUrl: 'shared/progress-indicator/ProgressIndicatorView.html',
+      controller: 'ProgressIndicatorController'
+    };
+  });
diff --git a/client/shared/progress-indicator/ProgressIndicatorView.html b/client/shared/progress-indicator/ProgressIndicatorView.html
@@ -0,0 +1,4 @@
+<ul>
+    <li ng-repeat="step in steps track by $index" ng-class="{ complete: step.complete }">{{step.text}}</li>
+    <li>&#10004;</li>
+</ul>