mirror of
https://github.com/arnaucube/thoughts.git
synced 2026-02-07 03:36:49 +01:00
web i server: login, post thought, get thoughts
This commit is contained in:
nau
111
web/controllers.js
Normal file
111
web/controllers.js
Normal file
@@ -0,0 +1,111 @@
|
||||
|
||||
var url="http://localhost:3000/api/";
|
||||
angular.module('thoughtsApp', [])
|
||||
.controller('ThoughtsController', function(
|
||||
$scope,
|
||||
$http
|
||||
) {
|
||||
var thoughtsList = this;
|
||||
if(window.sessionStorage.getItem('thoughtsToken'))
|
||||
{
|
||||
$scope.userLogged=true;
|
||||
}else{
|
||||
$scope.userLogged=false;
|
||||
}
|
||||
|
||||
$http({
|
||||
method : "GET",
|
||||
url : url + "thoughts"
|
||||
}).then(function mySucces(response) {
|
||||
thoughtsList.thoughts = response.data;
|
||||
}, function myError(response) {
|
||||
$scope.myWelcome = response.statusText;
|
||||
});
|
||||
|
||||
thoughtsList.addTodo = function() {
|
||||
todoList.todos.push({text:todoList.todoText, done:false});
|
||||
todoList.todoText = '';
|
||||
};
|
||||
|
||||
$scope.login = function(){
|
||||
ActivateLoadBar();
|
||||
|
||||
var obj = {
|
||||
username: $scope.username,
|
||||
password: $scope.password
|
||||
};
|
||||
$http({
|
||||
method : "POST",
|
||||
url : url + "auth",
|
||||
data: obj
|
||||
}).then(function mySucces(response) {
|
||||
if(response.data.success==true)
|
||||
{
|
||||
window.sessionStorage.setItem('thoughtsUsername', $scope.username);
|
||||
window.sessionStorage.setItem('thoughtsToken', response.data.token);
|
||||
window.sessionStorage.setItem('thoughtsUserAvatar', response.data.avatar);
|
||||
toastr.success("Logged in");
|
||||
setTimeout(function(){
|
||||
window.location="index.html";
|
||||
}, 1000);
|
||||
}else{
|
||||
toastr.error(response.data.message);
|
||||
setTimeout(function(){
|
||||
window.location="login.html";
|
||||
}, 1000);
|
||||
}
|
||||
}, function myError(response) {
|
||||
toastr.error(response.statusText);
|
||||
});
|
||||
};
|
||||
$scope.logout = function(){
|
||||
window.sessionStorage.removeItem('thoughtsUsername')
|
||||
window.sessionStorage.removeItem('thoughtsToken');
|
||||
window.sessionStorage.removeItem('thoughtsUserAvatar');
|
||||
toastr.info("logging out");
|
||||
setTimeout(function(){
|
||||
window.location="index.html";
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
$scope.postThought = function(){
|
||||
ActivateLoadBar();
|
||||
|
||||
var obj = {
|
||||
time: new Date(),
|
||||
content: $scope.newthought,
|
||||
username: window.sessionStorage.getItem('thoughtsUsername'),
|
||||
avatar: window.sessionStorage.getItem('thoughtsUserAvatar'),
|
||||
token: window.sessionStorage.getItem('thoughtsToken')
|
||||
};
|
||||
$http({
|
||||
method : "POST",
|
||||
url : url + "thoughts",
|
||||
data: obj
|
||||
}).then(function mySucces(response) {
|
||||
$scope.myWelcome = response.data;
|
||||
toastr.success("Thought published");
|
||||
setTimeout(function(){
|
||||
window.location="index.html";
|
||||
}, 1000);
|
||||
}, function myError(response) {
|
||||
toastr.error(response.statusText);
|
||||
});
|
||||
};
|
||||
|
||||
});
|
||||
|
||||
|
||||
/* LOADBAR */
|
||||
function ActivateLoadBar(){
|
||||
var html="";
|
||||
html+="<br>";
|
||||
html+="<div id='loadbar' class='progress'>";
|
||||
html+=" <div class='indeterminate'></div>";
|
||||
html+="</div>";
|
||||
document.body.innerHTML+=html;
|
||||
}
|
||||
function DesactivateLoadBar(){
|
||||
document.getElementById('loadbar').innerHTML="";
|
||||
}
|
||||
/* </LOADBAR */
|
||||
@@ -1,6 +1,6 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<html ng-app="thoughtsApp">
|
||||
<head>
|
||||
<!--Import Google Icon Font-->
|
||||
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
@@ -15,22 +15,22 @@
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body ng-app="thoughtsApp">
|
||||
<body ng-controller="ThoughtsController as thoughtsList">
|
||||
|
||||
<div ng-include="'menu.htm'"></div>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div ng-controller="ThoughtsController as thoughtsList">
|
||||
<div>
|
||||
<ul class="collection">
|
||||
<li class="collection-item avatar" ng-repeat="thought in thoughtsList.thoughts">
|
||||
<li class="collection-item avatar" ng-repeat="thought in thoughtsList.thoughts | orderBy: '-time'">
|
||||
<img ng-src="img/icons/animals/{{thought.avatar}}.png" class="circle">
|
||||
<a ng-href="user.html?={{thought.username}}" class="title">
|
||||
{{thought.username}}
|
||||
</a>
|
||||
|
||||
<div class="chip">{{thought.time | date:'HH:mm'}}</div>
|
||||
<p>{{thought.content}}</p>
|
||||
<a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
|
||||
<a href="#!" class="secondary-content"><i class="material-icons indigo-text text-lighten-2">grade</i></a>
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
@@ -52,7 +52,7 @@
|
||||
<script src="jslib/toastr.js"></script>
|
||||
<link type="text/css" rel="stylesheet" href="jslib/toastr.css"/>
|
||||
|
||||
<script src="index.js"></script>
|
||||
<script src="controllers.js"></script>
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
70
web/index.js
70
web/index.js
@@ -1,70 +0,0 @@
|
||||
|
||||
|
||||
angular.module('thoughtsApp', [])
|
||||
.controller('ThoughtsController', function() {
|
||||
var thoughtsList = this;
|
||||
thoughtsList.thoughts = [
|
||||
{
|
||||
time: '9h',
|
||||
content:'primer thought',
|
||||
username: 'user1',
|
||||
fav: '',
|
||||
avatar: 'bat'
|
||||
},
|
||||
{
|
||||
time: '10h',
|
||||
content:'quart thought',
|
||||
username: 'user4',
|
||||
fav: '',
|
||||
avatar: 'tiger'
|
||||
},
|
||||
{
|
||||
time: '10h',
|
||||
content:'segon thought, aquí, provant',
|
||||
username: 'user2',
|
||||
fav: '',
|
||||
avatar: 'toucan'
|
||||
},
|
||||
{
|
||||
time: '10h',
|
||||
content:'tercer thought, responent',
|
||||
username: 'user1',
|
||||
fav: '',
|
||||
avatar: 'bat'
|
||||
},
|
||||
{
|
||||
time: '10h',
|
||||
content:'hola com va',
|
||||
username: 'user3',
|
||||
fav: '',
|
||||
avatar: 'macaw'
|
||||
},
|
||||
{
|
||||
time: '10h',
|
||||
content:'quart thought',
|
||||
username: 'user5',
|
||||
fav: '',
|
||||
avatar: 'giraffe'
|
||||
}];
|
||||
|
||||
thoughtsList.addTodo = function() {
|
||||
todoList.todos.push({text:todoList.todoText, done:false});
|
||||
todoList.todoText = '';
|
||||
};
|
||||
|
||||
thoughtsList.remaining = function() {
|
||||
var count = 0;
|
||||
angular.forEach(todoList.todos, function(todo) {
|
||||
count += todo.done ? 0 : 1;
|
||||
});
|
||||
return count;
|
||||
};
|
||||
|
||||
thoughtsList.archive = function() {
|
||||
var oldTodos = todoList.todos;
|
||||
todoList.todos = [];
|
||||
angular.forEach(oldTodos, function(todo) {
|
||||
if (!todo.done) todoList.todos.push(todo);
|
||||
});
|
||||
};
|
||||
});
|
||||
59
web/login.html
Normal file
59
web/login.html
Normal file
@@ -0,0 +1,59 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html ng-app="thoughtsApp">
|
||||
<head>
|
||||
<!--Import Google Icon Font-->
|
||||
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<!--Import materialize.css-->
|
||||
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
|
||||
|
||||
<!--Let browser know website is optimized for mobile-->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>Thoughts - new thought</title>
|
||||
|
||||
<!-- ANGULAR -->
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body ng-controller="ThoughtsController">
|
||||
|
||||
<div ng-include="'menu.htm'"></div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="input-field col s12">
|
||||
<input ng-model="username" id="username" type="text" class="validate">
|
||||
<label for="username">Username</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="input-field col s12">
|
||||
<input ng-model="password" id="password" type="password" class="validate">
|
||||
<label for="password">password</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="index.html" class="waves-effect waves-light btn red lighten-2 ">Cancel</a>
|
||||
<a ng-click="login()" class="waves-effect waves-light btn indigo lighten-2 right">Login</a>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--Import jQuery before materialize.js-->
|
||||
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
|
||||
<script type="text/javascript" src="js/materialize.min.js"></script>
|
||||
|
||||
<script src="jslib/toastr.js"></script>
|
||||
<link type="text/css" rel="stylesheet" href="jslib/toastr.css"/>
|
||||
|
||||
<script src="controllers.js"></script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
30
web/menu.htm
30
web/menu.htm
@@ -7,33 +7,32 @@
|
||||
<li><a ><i class='material-icons'>settings_power</i></a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
<div class='navbar-fixed'>
|
||||
<nav>
|
||||
<div class='nav-wrapper indigo lighten-2'>
|
||||
|
||||
<a href='index.html' class='brand-logo'>Thoughts</a>
|
||||
<a href='#' data-activates='mobile-demo' class='button-collapse'><i class='material-icons'>menu</i></a>
|
||||
<ul class='right hide-on-med-and-down'>
|
||||
<!-- if(userlogged==true){-->
|
||||
<li><a href='neweviction.html'><i class='material-icons'>add</i></a></li>
|
||||
<li><a href='editassembly.html'><i class='material-icons'>perm_identity</i></a></li>
|
||||
<li><a onclick='onBtnLogout()' ><i class='material-icons'>settings_power</i></a></li>
|
||||
<!-- }else{
|
||||
<li><a href='signin.html'>Signup</a></li>
|
||||
<li><a href='login.html'> Login</a></li>
|
||||
}-->
|
||||
</ul>
|
||||
|
||||
<ul class='right'>
|
||||
<!-- Dropdown Trigger -->
|
||||
|
||||
<li><a href='neweviction.html'><i class='material-icons'>add</i></a></li>
|
||||
<ul class='right' ng-hide="!userLogged">
|
||||
|
||||
<li><a href='newthought.html'><i class='material-icons'>add</i></a></li>
|
||||
<li><a class="dropdown-button" href="#!" data-activates="dropdown1"><i class='material-icons'>perm_identity</i></a></li>
|
||||
|
||||
<li><a ng-click="logout()"><i class='material-icons'>power_settings_new</i></a></li>
|
||||
|
||||
</ul>
|
||||
<ul class='right' ng-hide="userLogged">
|
||||
|
||||
<li><a href='login.html'><i class='material-icons'>input</i></a></li>
|
||||
|
||||
|
||||
</ul>
|
||||
<ul class='side-nav' id='mobile-demo'>
|
||||
<li><a href='index.html'>Home</a></li>
|
||||
<!-- if(userlogged==true){-->
|
||||
<li><a href='neweviction.html'>Add eviction</a></li>
|
||||
<li><a href='newthought.html'>Add eviction</a></li>
|
||||
<li><a href='editassembly.html'>Edit assembly</a></li>
|
||||
<li><a onclick='onBtnLogout()'>Logout</a></li>
|
||||
<!-- }else{
|
||||
@@ -43,3 +42,4 @@
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
53
web/newthought.html
Normal file
53
web/newthought.html
Normal file
@@ -0,0 +1,53 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html ng-app="thoughtsApp">
|
||||
<head>
|
||||
<!--Import Google Icon Font-->
|
||||
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<!--Import materialize.css-->
|
||||
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
|
||||
|
||||
<!--Let browser know website is optimized for mobile-->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>Thoughts - new thought</title>
|
||||
|
||||
<!-- ANGULAR -->
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body ng-controller="ThoughtsController">
|
||||
|
||||
<div ng-include="'menu.htm'"></div>
|
||||
|
||||
<div class="container">
|
||||
<br>
|
||||
<div class="badge indigo-text right">{{144 - newthought.length}}</div>
|
||||
<div class="input-field col s6">
|
||||
<textarea ng-model="newthought" id="textarea1" class="materialize-textarea"></textarea>
|
||||
<label for="textarea1">New thought</label>
|
||||
</div>
|
||||
|
||||
<a href="index.html" class="waves-effect waves-light btn red lighten-2 ">Cancel</a>
|
||||
<a ng-click="postThought()" class="waves-effect waves-light btn indigo lighten-2 right">Publish</a>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--Import jQuery before materialize.js-->
|
||||
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
|
||||
<script type="text/javascript" src="js/materialize.min.js"></script>
|
||||
|
||||
<script src="jslib/toastr.js"></script>
|
||||
<link type="text/css" rel="stylesheet" href="jslib/toastr.css"/>
|
||||
|
||||
<script src="controllers.js"></script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user