Added i18n package and (add popper npm dependency for "dropdown-toggle")

.meteor/packages

@@ -33,3 +33,5 @@ aldeed:collection2-core@2.0.1
 aldeed:autoform
 aldeed:schema-deny
 fourseven:scss
+tap:i18n
+accounts-password

.meteor/versions

@@ -1,7 +1,9 @@
 accounts-base@1.4.0
+accounts-password@1.5.0
 aldeed:autoform@6.2.0
 aldeed:collection2-core@2.0.1
 aldeed:schema-deny@2.0.0
+aldeed:simple-schema@1.3.3
 allow-deny@1.1.0
 arillo:flow-router-helpers@0.5.2
 autoupdate@1.3.12
@@ -16,6 +18,7 @@ boilerplate-generator@1.3.0
 caching-compiler@1.1.9
 caching-html-compiler@1.1.2
 callback-hook@1.0.10
+cfs:http-methods@0.0.32
 check@1.2.5
 coffeescript@1.11.1_4
 ddp@1.4.0
@@ -31,6 +34,7 @@ ecmascript-runtime@0.5.0
 ecmascript-runtime-client@0.5.0
 ecmascript-runtime-server@0.5.0
 ejson@1.1.0
+email@1.2.3
 es5-shim@4.6.15
 fourseven:scss@4.5.4
 geojson-utils@1.0.10
@@ -49,6 +53,7 @@ logging@1.1.19
 mdg:validated-method@1.1.0
 meteor@1.8.0
 meteor-base@1.2.0
+meteorspark:util@0.2.0
 minifier-css@1.2.16
 minifier-js@2.2.0
 minimongo@1.4.0
@@ -60,6 +65,7 @@ momentjs:moment@2.10.6
 mongo@1.3.0
 mongo-dev-server@1.1.0
 mongo-id@1.0.6
+npm-bcrypt@0.9.3
 npm-mongo@2.2.33
 observe-sequence@1.0.16
 ordered-dict@1.0.9
@@ -74,10 +80,14 @@ retry@1.0.9
 routepolicy@1.0.12
 seba:minifiers-autoprefixer@1.0.1
 service-configuration@1.0.11
+session@1.1.7
+sha@1.0.9
 shell-server@0.3.0
 spacebars@1.0.15
 spacebars-compiler@1.1.3
+srp@1.0.10
 standard-minifier-js@2.2.0
+tap:i18n@1.8.2
 templating@1.3.2
 templating-compiler@1.3.3
 templating-runtime@1.3.2

i18n/en.i18n.yml

@@ -0,0 +1 @@
+home_title: Meteor-skeleton

i18n/ua.i18n.yml

@@ -0,0 +1,2 @@
+home_title: Метеор-скелетон
+

imports/startup/client/i18n.js

@@ -0,0 +1,9 @@
+import { TAPi18n  } from 'meteor/tap:i18n'
+
+TAPi18n.setLanguage('en')
+  .done(function () {
+  })
+  .fail(function (error_message) {
+    // Handle the situation
+    console.log(error_message);
+  });

imports/startup/client/router/filter-config.js

@@ -10,7 +10,7 @@ import { notify } from "/imports/modules/notifier"
 // Simple redirect unless user is logged in
 const mustBeLoggedIn = (context, redirect, stop) => {
   if (!Meteor.userId()) {
-    redirect("frontpage")
+    redirect("login")
     notify("Must be logged in!", "error")
   }
 }
@@ -20,4 +20,5 @@ Uncomment to require the user to be logged in to view og modify documents
 Note: This is only handled client-side. Remember to do verification on the server as well
 */
 
-// FlowRouter.triggers.enter([mustBeLoggedIn], { except: ['frontpage', 'about'] })
+
+FlowRouter.triggers.enter([mustBeLoggedIn], { only: ['documentsIndex'] }) // or {except: ["login","registration"]} for all pages blocked without login and registration

imports/startup/client/router/page-routes.js

@@ -4,6 +4,9 @@ import { BlazeLayout } from "meteor/kadira:blaze-layout"
 import "/imports/ui/pages/frontpage/frontpage.js"
 import "/imports/ui/pages/about/about.js"
 
+import '/imports/ui/pages/login/login.js'
+import '/imports/ui/pages/registration/registration.js'
+
 // ***************************************************************
 // Static pages
 // ***************************************************************
@@ -33,3 +36,35 @@ FlowRouter.route("/about", {
   },
   name: "about"
 })
+
+
+// LOGIN
+// -------------------------------------------------------
+FlowRouter.route('/login', {
+  action: function () {
+    BlazeLayout.render('layout', {header: "header", main: 'login', footer: 'footer' })
+  },
+  name: 'login'
+})
+
+
+
+// REGISTRATION
+// -------------------------------------------------------
+FlowRouter.route('/registration', {
+  action: function () {
+    BlazeLayout.render('layout', {header: "header", main: 'registration', footer: 'footer' })
+  },
+  name: 'registration'
+})
+
+// LOGOUT
+// -------------------------------------------------------
+
+FlowRouter.route('/logout', {
+  name: 'logout',
+  action: function () {
+    Meteor.logout();
+    FlowRouter.go('/login');
+  }
+});

imports/ui/helpers/handlebars-helpers.js

@@ -40,3 +40,9 @@ Template.registerHelper("getProfileImage", image => {
 Template.registerHelper("bytesToSize", bytes => {
   return helpers.bytesToSize(bytes)
 })
+
+// Translates those bytes to something more readable (e.g. 1.2 MB)
+Template.registerHelper("isLoggedIn", () => {
+  return !!Meteor.user()
+})
+

imports/ui/pages/frontpage/frontpage.html

@@ -2,7 +2,7 @@
 
   <div class="frontpage">
     <div class="jumbotron">
-      <h1 class="display-4">Meteor-skeleton</h1>
+      <h1 class="display-4">{{_ "home_title"}}</h1>
       <p class="lead">A boilerplate for Meteor - giving you a simple and more organized way to create projects.</p>
       <p>It comes with a complete collection sample including publications, subscriptions and CRUD functionality. Routes, views and some
         nice helpers are also included.</p>

imports/ui/pages/login/login.html

@@ -0,0 +1,47 @@
+<template name="login">
+  <div class="container">
+    <div class="login">
+      <form class="form-horizontal" role="form">
+        <div class="row">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <h2>Please Login</h2>
+            <hr>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <div class="form-group has-danger">
+              <label class="sr-only" for="email">E-Mail Address</label>
+              <div class="input-group mb-2 mr-sm-2 mb-sm-0">
+                <input type="text" name="email" class="form-control" id="email"
+                       placeholder="you@example.com" required autofocus>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <div class="form-group">
+              <label class="sr-only" for="password">Password</label>
+              <div class="input-group mb-2 mr-sm-2 mb-sm-0">
+                <input type="password" name="password" class="form-control" id="password"
+                       placeholder="Password" required>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="row" style="padding-top: 1rem">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <button type="submit" class="btn btn-success"><i class="fa fa-sign-in"></i> Login</button>
+          </div>
+        </div>
+      </form>
+    </div>
+  </div>
+
+
+</template>

imports/ui/pages/login/login.js

@@ -0,0 +1,32 @@
+import {Template} from 'meteor/templating'
+import {Meteor} from 'meteor/meteor'
+
+import {notify} from '/imports/modules/notifier'
+
+
+import './login.html'
+import './login.scss'
+
+
+Template.login.events({
+
+  'submit form': function (event) {
+    // Prevent default browser form submit
+    event.preventDefault();
+
+    // Get value from form element
+    const target = event.target;
+    const email = target.email.value;
+    const password = target.password.value;
+
+    Meteor.loginWithPassword(email, password, function (err) {
+      if (err) {
+        console.log('Handle errors here: ', err);
+        notify(err.reason, 'info')
+      } else if (!!Meteor.userId()) {
+        FlowRouter.go('documentsIndex')
+      }
+    })
+  }
+
+});

imports/ui/pages/login/login.scss

@@ -0,0 +1,8 @@
+.login {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin: -200px 0 0 -300px;
+  width:600px;
+  height:600px;
+}

imports/ui/pages/registration/registration.html

@@ -0,0 +1,60 @@
+<template name="registration">
+  <div class="container">
+    <div class="registration">
+      <form class="form-horizontal" role="form">
+        <div class="row">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <h2>Please Sign up</h2>
+            <hr>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <div class="form-group has-danger">
+              <label class="sr-only" for="username">Username</label>
+              <div class="input-group mb-2 mr-sm-2 mb-sm-0">
+                <input type="text" name="username" class="form-control" id="username"
+                       placeholder="Username" required autofocus>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="row">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <div class="form-group has-danger">
+              <label class="sr-only" for="email">E-Mail Address</label>
+              <div class="input-group mb-2 mr-sm-2 mb-sm-0">
+                <input type="text" name="email" class="form-control" id="email"
+                       placeholder="you@example.com" required autofocus>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <div class="form-group">
+              <label class="sr-only" for="password">Password</label>
+              <div class="input-group mb-2 mr-sm-2 mb-sm-0">
+                <input type="password" name="password" class="form-control" id="password"
+                       placeholder="Password" required>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="row" style="padding-top: 1rem">
+          <div class="col-md-3"></div>
+          <div class="col-md-6">
+            <button type="submit" class="btn btn-success"><i class="fa fa-sign-in"></i> Login</button>
+          </div>
+        </div>
+      </form>
+    </div>
+  </div>
+
+
+</template>

imports/ui/pages/registration/registration.js

@@ -0,0 +1,31 @@
+import {Template} from 'meteor/templating'
+import {Meteor} from 'meteor/meteor'
+import {FlowRouter} from 'meteor/kadira:flow-router'
+
+import {notify} from '/imports/modules/notifier'
+
+import './registration.html'
+
+
+Template.registration.events({
+  'submit form': function (event) {
+    // Prevent default browser form submit
+    event.preventDefault();
+
+    // Get value from form element
+    const target = event.target;
+    const email = target.email.value;
+    const username = target.username.value;
+    const password = target.password.value;
+
+    Accounts.createUser({username: username, email: email, password: password}, function (err) {
+      if (err) {
+        console.log('Handle errors here: ', err);
+        notify(err.reason, 'info')
+      } else if (!!Meteor.userId()) {
+        FlowRouter.go('documentsIndex')
+      }
+    })
+  }
+
+});

imports/ui/pages/registration/registration.scss

@@ -0,0 +1,8 @@
+.registration {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin: -200px 0 0 -300px;
+  width:600px;
+  height:600px;
+}

imports/ui/shared/header/header.html

@@ -2,7 +2,7 @@
 
   <nav class="Header navbar navbar-expand-lg navbar-dark bg-primary mb-4">
     <div class="container">
-      <a class="navbar-brand" href="{{pathFor 'frontpage'}}">Meteor-skeleton</a>
+      <a class="navbar-brand" href="{{pathFor 'frontpage'}}">{{_ "home_title"}}</a>
 
       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
         aria-expanded="false" aria-label="Toggle navigation">
@@ -28,7 +28,32 @@
           <li class="nav-item">
             <a class="nav-link" href="https://github.com/kjetilhau/meteor-skeleton" target="_blank">Github</a>
           </li>
+          {{#if isLoggedIn}}
+            <li class="nav-item">
+              <a class="nav-link" href="#goToUserprofilePath" >{{currentUser.username}}</a>
+            </li>
+            <li class="nav-item ">
+              <a class="nav-link" href="{{pathFor 'logout'}}">Logout</a>
+            </li>
+          {{else}}
+            <li class="nav-item {{isActiveRoute 'login'}}">
+              <a class="nav-link" href="{{pathFor 'login'}}">Sign in</a>
+            </li>
+            <li class="nav-item {{isActiveRoute 'registration'}}">
+              <a class="nav-link" href="{{pathFor 'registration'}}">Sign up</a>
+            </li>
+          {{/if}}
+          <div class="dropdown">
+            <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+              {{language}}
+            </button>
+            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+              <a class="dropdown-item" href="#en" onclick="TAPi18n.setLanguage('en');">EN</a>
+              <a class="dropdown-item" href="#ua" onclick="TAPi18n.setLanguage('ua');">UA</a>
+            </div>
+          </div>
         </ul>
+
       </div>
     </div>
   </nav>