Merge branch 'master' of github.com:mostafiz93/Meteor-Boilerplate

client/main.css

@@ -47,7 +47,7 @@ body{
     padding-bottom: 0px !important;
 }
 .topBarTitle{
-	background: #3e40a1;
+	background: #00300d;
     color: #fff;
 }
 .topBarTitle h3{
@@ -56,7 +56,7 @@ body{
 	font-weight: normal;
 }
 .topBar{
-	background: #3e40a1;
+	background: #00300d;
 	text-align: center;
 }
 .topBar h3{
@@ -69,7 +69,7 @@ body{
 
 .sideBar{
   height: calc(100vh - 50px);
-  background: #5153aa;
+  background: #004212;
   position: fixed !important;
   z-index: 9;
   margin: 64px 0px 0px 5px !important;
@@ -100,6 +100,199 @@ body{
 }
 .activeMenu{
 	background: rgba(0,0,0,0.3);
-	border-right: 3px solid #ed4054;
+	border-right: 3px solid #004212;
 	font-weight: normal;
 }
+
+
+/**************************************** Login Page Starts **************************************/
+
+.loginSectionCon{
+	background: rgba(255,255,255,0.4);
+    margin: 3% auto;
+    max-width: 400px;
+    height: auto;
+    border-radius: 10px;
+}
+.loginLogo{
+    height: auto;
+    max-width: 123px;
+    margin: 0px auto 20px;
+    padding-top: 20px;
+}
+.loginSectionCon h2{
+	font-size: 30px;
+	font-weight: lighter;
+	margin: 20px 0px;
+	display: block;
+	text-align: center;
+	color: #212121;
+}
+.logFieldContainer{
+	padding: 20px;
+	background: #fff;
+	border: 1px solid #ddd;
+	border-radius: 10px;
+}
+.logFieldContainer p{
+	margin: 0px;
+}
+.logFieldContainer .loginField{
+	padding: 9px 10px;
+	border: 1px solid #E9ECD2;
+	border-radius: 5px;
+	background: #FEFFEF;
+	width: 100%;
+	margin: 5px 0px 15px;
+}
+.regCheckbox{
+	margin-right: 20px;
+}
+.regCheckboxTitle{
+	margin-right: 20px;
+	padding-bottom: 10px;
+	display: inline-block;
+}
+
+
+
+/************************************   others  *************************************/
+.dropdownContent{
+  margin-bottom: 15px;
+}
+
+.actionButtonContainer .button{
+	margin: 20px auto 0;
+	display: block;
+}
+
+
+
+/************************************  HOME CARD  ************************************/
+
+.complainContainer{
+    width: 90%;
+    margin: 20px auto;
+    background: #fff;
+    border-radius: 5px;
+    box-shadow: 2px 2px 4px #9FA4A8;
+    padding: 20px;
+    position: relative;
+		cursor: pointer;
+}
+.complainContainer03{
+    width: 90%;
+    margin: 0px auto;
+    background: #fff;
+    padding: 20px;
+    position: relative;
+  border-bottom: 1px solid #ddd;
+  color: #757575;
+}
+.complainContainer03:first-child{
+  margin-top: 20px;
+}
+.complainContainer03:last-child{
+  margin-bottom: 20px;
+}
+.complainContainer02{
+	  width: 90%;
+    margin: 20px auto 20px;
+    background: #fff;
+    border-radius: 2px;
+    box-shadow: 0px 1px 4px rgba(0,0,0,0.14);
+    padding: 20px;
+    position: relative;
+}
+.complainContainer > img,
+.complainContainer02 > img{
+    max-height: 60px;
+    max-width: 60px;
+    border-radius: 50%;
+    float: left;
+    margin: 0px 20px 10px 0px;
+}
+.complainContainer > h3{
+    margin: 0px 0px 10px;
+}
+.complainContainer02 > h3{
+    margin: 0px;
+}
+.rightFloatedIcon{
+	float: right;
+  margin-left: 20px;
+}
+.complainItems{
+  float: left;
+}
+.complainItems span,
+.complainItems a{
+    margin-right: 10px;
+    color: #365C7A;
+    cursor: pointer;
+}
+.endTimeIndicator{
+  color: #FF4081;
+  float: right;
+}
+.votingOptions{
+  padding-left: 50px;
+}
+.votingOptions li{
+  padding-bottom: 5px;
+  margin-bottom: 5px;
+  border-bottom: 1px solid #eee;
+}
+.votingOptions li:last-child{
+  border: 0;
+}
+.votingOptions li:last-child a{
+  color: #333;
+  margin-left: 30px;
+}
+.votingOptions li:last-child a:hover{
+  text-decoration: underline;
+}
+.perticipatorOptions{
+  padding-left: 50px;
+  color: #FF9800;
+  list-style-type: disc;
+}
+.perticipatorOptions li span{
+  color: #333;
+}
+.threadRemoveIcon{
+    position: absolute;
+    right: 10px;
+    top: 10px;
+}
+.complainAddBtn{
+    position: fixed;
+    bottom: 5vh;
+    right: 2.5vw;
+    z-index: 999;
+}
+.complainInputContainer{
+    width: 60%;
+    margin: 0px auto;
+}
+.complainInput{
+    width: 100%;
+    padding: 7px 10px;
+    border: 0px;
+    border-bottom: 1px solid #ddd;
+    margin: 10px 0px;
+    resize: none;
+    transition: all  0.3s;
+}
+.complainInput:focus{
+    border-bottom: 2px solid #026DB5;
+}
+.complainInputContainer li i{
+    color: rgba(0,0,0,.87);
+    margin-right: 15px;
+}
+.modalHeader{
+    background: #F7F7F7 !important;
+    text-align: center;
+}

imports/api/users/methods.js

@@ -0,0 +1,15 @@
+import { Meteor } from 'meteor/meteor';
+import { Accounts } from 'meteor/accounts-base';
+
+const bcrypt = require('bcrypt');
+
+Meteor.methods({
+  'user.create':function(data){
+       if(data.code != 'army101') throw new Meteor.Error(500, 'Wrong Activation Code', 'Wrong Activation Code');
+       return Accounts.createUser({
+         name: data.name,
+         username: data.userId,
+         password: data.password,
+       });
+  }
+});

imports/startup/client/routes.js

@@ -1,13 +1,33 @@
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { mount } from 'react-mounter';
 
-import SamplePage from '/imports/ui/pages/samplePage.jsx'
+import HomePage from '/imports/ui/pages/HomePage.jsx'
+import RegisterPage from '/imports/ui/pages/RegisterPage'
+import LoginPage from '/imports/ui/pages/LoginPage'
+
 
 FlowRouter.route('/', {
-  name: 'SamplePage',
+  name: 'Homepage' ,
+  action(params, queryParams) {
+      console.log("home route is being called...");
+      Meteor.userId() ? mount(HomePage) : mount(LoginPage);
+  }
+});
+
+FlowRouter.route('/register', {
+  name: 'RegisterPage',
+  action(params, queryParams) {
+      console.log("home route is being called...");
+      // Meteor.userId() ? mount(Dashboard) : mount(Login);
+      mount(RegisterPage);
+  }
+});
+
+FlowRouter.route('/login', {
+  name: 'LoginPage',
   action(params, queryParams) {
       console.log("home route is being called...");
       // Meteor.userId() ? mount(Dashboard) : mount(Login);
-      mount(SamplePage);
+      mount(LoginPage);
   }
 });

imports/startup/server/index.js

@@ -0,0 +1 @@
+import '/imports/api/users/methods.js';

imports/ui/components/HomeCard.jsx

@@ -0,0 +1,34 @@
+import React, { Component } from 'react';
+
+
+import HomeCardPage from '/imports/ui/pages/HomeCardPage.jsx';
+
+
+export default class HomeCard extends React.Component{
+  constructor(props){
+    super(props);
+  }
+
+  render(){
+    console.log(this.props)
+    return(
+      <div className='complainContainer'>
+        <i className='remove red link icon threadRemoveIcon'></i>
+        <img src='images/logo.png'/>
+        <h3>Complain title goes here</h3>
+        <p className='complainItems'>
+          <span><i className='wait icon'></i>5:05 pm</span>
+          <a><i className='talk outline icon'></i>11 replies</a>
+          <a><i className='attach icon'></i></a>
+        </p>
+        <div className='clr'></div>
+        <p>
+          Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+        </p>
+        <button className="circular ui icon blue button complainAddBtn" >
+          <i className="icon add"></i>
+        </button>
+      </div>
+    )
+  }
+}

imports/ui/components/SampleComponent.jsx

@@ -1,22 +1,69 @@
 import React, { Component } from 'react';
+import { mount } from 'react-mounter';
+
+import HomeCardPage from '/imports/ui/pages/HomeCardPage.jsx';
 
 export default class SampleComponent extends Component{
   constructor(props){
     super(props);
 
     this.state = {
-      count: 0,
+      radio_net: -1,
+      cmd_net: -1,
     }
   }
 
   componentDidMount(){
-    // initiate something
+    $('.ui.dropdown').dropdown()
+  }
+
+  handleChange(name, e) {
+    let val = parseInt(e.target.value);
+    if(val == -1) return;
+
+    let change = {}
+    change[name] = val
+    this.setState(change)
+  }
+
+  handleSubmit(){
+    let x = {
+      radio_net: this.state.radio_net,
+      cmd_net: this.state.cmd_net,
+    }
+    if(x.radio_net == -1 || x.cmd_net == -1){
+      alert('Please select values from both dropdowns')
+      return;
+    }
+    mount(HomeCardPage, x)
   }
 
   render(){
+    console.log(this.state)
     return(
       <div className='contentContainer'>
-        <h3> Hello! This is your component! </h3>
+        <div style={{width: '350px', margin: '5vh auto 15px', borderRadius: '5px', background: '#00300d'}}>
+          <h3 style={{padding: '15px', borderBottom: '1px solid #ddd', textAlign: 'center', margin: 0, color: 'white'}}>Select  Net Type</h3>
+          <div style={{padding: '20px 15px', background: '#ddd'}}>
+            <select className="ui fluid dropdown dropdownContent" onChange={this.handleChange.bind(this, 'radio_net')}>
+              <option value="-1">Select Net Type</option>
+              <option value="1">Army Radio Net</option>
+              <option value="2">Div Radio Net</option>
+              <option value="3">BDE Radio Net</option>
+            </select>
+            <select className="ui fluid dropdown" onChange={this.handleChange.bind(this, 'cmd_net')}>
+              <option value="-1">Select Command or Admin</option>
+              <option value="1">Command Net</option>
+              <option value="2">Admin Net</option>
+            </select>
+            <div className='actionButtonContainer'>
+              <button className='ui blue icon labeled button' onClick={this.handleSubmit.bind(this)}>
+                <i className='send icon'></i>
+                Submit
+              </button>
+            </div>
+          </div>
+        </div>
       </div>
     )
   }