arnaucube/blockchainIDsystem
1
0
Fork 0
mirror of https://github.com/arnaucube/blockchainIDsystem.git synced 2026-02-07 19:16:43 +01:00
Code Issues Packages Projects Releases Wiki Activity

started to implement clientApp (Go + Electron(with Angularjs))

Browse Source
This commit is contained in:
arnaucode
2017-12-27 20:25:03 +01:00
parent 92462dc3db
commit 91dc63ed96
36 changed files with 1102 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
clientApp/GUI/.bowerrc Normal file
View File

@@ -0,0 +1,3 @@
{
"directory": "bower_components"
}

2
clientApp/GUI/.gitignore vendored Normal file
View File

@@ -0,0 +1,2 @@
bower_components
node_modules

84
clientApp/GUI/app.js Normal file
View File

@@ -0,0 +1,84 @@
'use strict';
var urlapi = "http://127.0.0.1:3130/";
var clientapi = "http://127.0.0.1:4100/";
// Declare app level module which depends on views, and components
angular.module('app', [
'ngRoute',
'ngMessages',
'angularBootstrapMaterial',
'ui.bootstrap',
'toastr',
'app.navbar',
'app.main',
'app.signup',
'app.login'
]).
config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
$locationProvider.hashPrefix('!');
if ((localStorage.getItem('blid_token'))) {
console.log(window.location.hash);
if ((window.location.hash === '#!/login') || (window.location.hash === '#!/signup')) {
window.location = '#!/main';
}
$routeProvider.otherwise({
redirectTo: '/main'
});
} else {
if ((window.location !== '#!/login') || (window.location !== '#!/signup')) {
console.log('app, user no logged');
localStorage.removeItem('blid_token');
localStorage.removeItem('blid_userdata');
window.location = '#!/login';
$routeProvider.otherwise({
redirectTo: '/login'
});
}
}
}])
.config(function(toastrConfig) {
angular.extend(toastrConfig, {
autoDismiss: false,
containerId: 'toast-container',
maxOpened: 0,
newestOnTop: true,
positionClass: 'toast-bottom-right',
preventDuplicates: false,
preventOpenDuplicates: false,
target: 'body'
});
})
.factory('httpInterceptor', function httpInterceptor() {
return {
request: function(config) {
return config;
},
requestError: function(config) {
return config;
},
response: function(res) {
return res;
},
responseError: function(res) {
return res;
}
};
})
.factory('api', function($http) {
return {
init: function() {
/*$http.defaults.headers.common['X-Access-Token'] = localStorage.getItem('block_webapp_token');
$http.defaults.headers.post['X-Access-Token'] = localStorage.getItem('block_webapp_token');*/
}
};
})
.run(function(api) {
api.init();
});

18
clientApp/GUI/bower.json Normal file
View File

@@ -0,0 +1,18 @@
{
"name": "angular-seed",
"description": "A starter project for AngularJS",
"version": "0.0.0",
"homepage": "",
"license": "MIT",
"private": true,
"dependencies": {
"angular": "^1.6.2",
"angular-route": "^1.6.1",
"angular-messages": "^1.6.5",
"angular-bootstrap-material": "abm#^0.1.4",
"angular-bootstrap": "^2.5.0",
"components-font-awesome": "^4.7.0",
"angular-toastr": "^2.1.1",
"cssMaterialColors": "*"
}
}

9
clientApp/GUI/css/bootstrapMaterial-dark-overwrite.css vendored Normal file
View File

@@ -0,0 +1,9 @@
body {
background: #000000!important;
color: #ffffff!important;
}
.card {
background: #000000!important;
color: #ffffff!important;
border: 1px solid #ffffff!important;
}

1
clientApp/GUI/css/own.css Normal file
View File

@@ -0,0 +1 @@

BIN
clientApp/GUI/img/blockchainIDsystem-logo-black.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

BIN
clientApp/GUI/img/blockchainIDsystem-logo-white.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

69
clientApp/GUI/index.html Normal file
View File

@@ -0,0 +1,69 @@
<!DOCTYPE html>
<html lang="en" ng-app="app" ng-cloak>
<head>
<meta charset="utf-8">
<title>blockchainIDsystem</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" href="img/blockchainIDsystem-logo-black.png">
<link rel="stylesheet" href="bower_components/components-font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="css/own.css">
<link rel="stylesheet" href="css/bootstrapMaterial-dark-overwrite.css">
<link href="bower_components/cssMaterialColors/colors.css" rel="stylesheet">
</head>
<body ng-app="webapp">
<div ng-include="'views/navbar.html'"></div>
<br><br><br><br><br>
<div ng-view></div>
<!-- ELECTRON
Insert this line above script imports
Works for both browser and electron with the same code -->
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
<!-- Angular js -->
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-messages/angular-messages.js"></script>
<!-- Bootstrap -->
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
<!-- Bootstrap Material Design -->
<link rel="stylesheet" href="bower_components/bootstrap-material-design/dist/css/bootstrap-material-design.css">
<link rel="stylesheet" href="bower_components/bootstrap-material-design/dist/css/ripples.css">
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/angular-bootstrap-material/dist/angular-bootstrap-material.js"></script>
<!-- jQuery for Bootstrap -->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<!-- toastr -->
<link rel="stylesheet" type="text/css" href="bower_components/angular-toastr/dist/angular-toastr.css" />
<script type="text/javascript" src="bower_components/angular-toastr/dist/angular-toastr.tpls.js"></script>
<!-- app's js -->
<script src="app.js"></script>
<script src="views/navbar.js"></script>
<script src="views/main/main.js"></script>
<script src="views/signup/signup.js"></script>
<script src="views/login/login.js"></script>
<!-- ELECTRON
Insert this line after script imports -->
<script>if (window.module) module = window.module;</script>
</body>
</html>

72
clientApp/GUI/main.js Normal file
View File

@@ -0,0 +1,72 @@
const electron = require('electron')
// Module to control application life.
const app = electron.app
// Module to create native browser window.
const BrowserWindow = electron.BrowserWindow
const Tray = electron.Tray
const Menu = electron.Menu
// Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the JavaScript object is garbage collected.
let mainWindow
function createWindow () {
// Create the browser window.
mainWindow = new BrowserWindow({
width: 850,
height: 600,
icon: 'icon.png'
})
tray = new Tray('icon.png')
const contextMenu = Menu.buildFromTemplate([
{label: 'Obre la finestra', type: 'radio'},
{label: 'javascript madness', type: 'radio'},
{label: 'Tanca', type: 'radio'}
//{label: 'Tanca', type: 'radio', checked: true}
])
tray.setToolTip('Panopticon, projectNSA')
tray.setContextMenu(contextMenu)
//mainWindow.setMenu(null);
// and load the index.html of the app.
mainWindow.loadURL(`file://${__dirname}/index.html`)
// Open the DevTools.
//mainWindow.webContents.openDevTools()
// Emitted when the window is closed.
mainWindow.on('closed', function () {
// Dereference the window object, usually you would store windows
// in an array if your app supports multi windows, this is the time
// when you should delete the corresponding element.
mainWindow = null
})
}
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', createWindow)
// Quit when all windows are closed.
app.on('window-all-closed', function () {
// On OS X it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', function () {
// On OS X it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (mainWindow === null) {
createWindow()
}
})
// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and require them here.

15
clientApp/GUI/package.json Normal file
View File

@@ -0,0 +1,15 @@
{
"name": "blockchainIDsystem-clientApp",
"version": "1.0.0",
"description": "frontend desktop app for blockchainIDsystem",
"main": "main.js",
"scripts": {
"postinstall": "bower install",
"prestart": "npm install",
"start": "electron ."
},
"devDependencies": {
"electron-prebuilt": "^1.2.0"
},
"license": "MIT"
}

27
clientApp/GUI/views/login/login.html Executable file
View File

@@ -0,0 +1,27 @@
<div class="container">
<div class="row">
<div class="col-sm-4">
</div>
<div class="col-sm-4">
<div class="card">
<div class="card-body">
<h4 class="card-title">
blockchainIDsystem
</h4>
<input ng-model="user.email" class="form-control" placeholder="Email" type="text">
<input ng-model="user.password" class="form-control" placeholder="Password" type="password">
<div ng-click="login()" class="btn btn-raised c_indigo300 pull-right">Login</div>
</div>
</div>
</div>
<div class="col-sm-4">
</div>
</div>
</div>

44
clientApp/GUI/views/login/login.js Executable file
View File

@@ -0,0 +1,44 @@
'use strict';
angular.module('app.login', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/login', {
templateUrl: 'views/login/login.html',
controller: 'LoginCtrl'
});
}])
.controller('LoginCtrl', function($scope, $http, $routeParams, toastr) {
$scope.user = {};
$scope.login = function() {
console.log('Doing login', $scope.user);
console.log(urlapi + "login");
$http({
url: urlapi + 'login',
method: "POST",
headers: {
"Content-Type": undefined
},
data: $scope.user
})
.then(function(data) {
console.log("data: ");
console.log(data.data);
if (data.data.token) {
localStorage.setItem("blid_token", data.data.token);
localStorage.setItem("blid_user", JSON.stringify(data.data));
window.location.reload();
} else {
console.log("login failed");
toastr.error('Login failed');
}
},
function(data) {
console.log(data);
});
};
});

31
clientApp/GUI/views/main/main.html Executable file
View File

@@ -0,0 +1,31 @@
<div class="container">
<div class="row">
<div class="col-sm-4">
</div>
<div class="col-sm-4">
<div class="card">
<div class="card-body">
<h4 class="card-title">
blockchainIDsystem
</h4>
<div ng-click="newID()" class="btn btn-raised c_o_cyan300">Create new ID</div>
</div>
<hr>
<div class="card-body">
<h4 class="card-title">
Current IDs
</h4>
<p ng-repeat="id in ids">
{{id}} <div ng-click="" class="btn btn-raised c_o_indigo300">Verify</div>
</p>
</div>
</div>
</div>
<div class="col-sm-4">
</div>
</div>
</div>

35
clientApp/GUI/views/main/main.js Executable file
View File

@@ -0,0 +1,35 @@
'use strict';
angular.module('app.main', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/main', {
templateUrl: 'views/main/main.html',
controller: 'MainCtrl'
});
}])
.controller('MainCtrl', function($scope, $http) {
$scope.ids = [];
$http.get(clientapi + 'ids')
.then(function(data) {
console.log('data success');
console.log(data);
$scope.ids = data.data;
}, function(data) {
console.log('data error');
});
$scope.newID = function() {
$http.get(clientapi + 'newid')
.then(function(data) {
console.log('data success');
console.log(data);
$scope.ids = data.data;
}, function(data) {
console.log('data error');
});
};
});

30
clientApp/GUI/views/navbar.html Executable file
View File

@@ -0,0 +1,30 @@
<div ng-controller="NavbarCtrl" ng-show="user">
<nav class="navbar navbar-fixed-top c_cyanG500to300">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/" title="blockchainIDsystem">
<img src="img/blockchainIDsystem-logo-white.png" style="width:30px;height:30px;display:inline;" alt=""> <b>blockchainIDsystem</b>
</a>
</div>
<div class="navbar-collapse collapse navbar-responsive-collapse">
<ul class="nav navbar-nav navbar-right">
<li>
<a href="">
<i title="User" class="fa fa-user fa-1x"></i> {{user.email}}
</a>
</li>
<li>
<a href="" ng-click="logout()">
<i title="Exit" class="fa fa-power-off fa-1x"></i>
</a>
</li>
</ul>
</div>
</div>
</nav>
</div>

22
clientApp/GUI/views/navbar.js Executable file
View File

@@ -0,0 +1,22 @@
'use strict';
angular.module('app.navbar', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/navbar', {
templateUrl: 'views/navbar.html',
controller: 'NavbarCtrl'
});
}])
.controller('NavbarCtrl', function($scope, $http, $routeParams, $location) {
$scope.user = JSON.parse(localStorage.getItem("blid_user"));
$scope.logout = function() {
localStorage.removeItem("blid_token");
localStorage.removeItem("blid_user");
window.location.reload();
};
});

41
clientApp/GUI/views/signup/signup.html Executable file
View File

@@ -0,0 +1,41 @@
<div class="container">
<div class="row">
<div class="col-sm-4">
</div>
<div class="col-sm-4">
<div class="panel">
<div class="panel-heading c_deepPurpleG500to300">
<h3 class="panel-title">Signup</h3>
</div>
<div class="panel-body">
<div class="form-group label-floating">
<input ng-model="user.username" abmFormControl class="form-control" id="inputUsername" placeholder="Username" type="text">
</div>
<div class="form-group">
<input ng-model="user.password" abmFormControl class="form-control" id="inputPassword" placeholder="Password" type="password">
</div>
<div class="form-group label-floating">
<input ng-model="user.email" abmFormControl class="form-control" id="inputEmail" placeholder="Email" type="text">
</div>
<div class="form-group label-floating">
<input ng-model="user.phone" abmFormControl class="form-control" id="inputPhone" placeholder="Phone" type="text">
</div>
<div class="form-group row">
<label for="staticEmail" class="col-sm-1 col-form-label">@</label>
<div class="col-sm-10">
<input ng-model="user.telegram" abmFormControl class="form-control" id="inputTelegram" placeholder="Telegram" type="text">
</div>
</div>
<a ng-href="#!/login" class="btn btn-raised c_grey500">Back</a>
<div ng-click="doSignup()" class="btn btn-raised c_deepPurple300 pull-right">Signup</div>
</div>
</div>
</div>
<div class="col-sm-4">
</div>
</div>
</div>

43
clientApp/GUI/views/signup/signup.js Executable file
View File

@@ -0,0 +1,43 @@
'use strict';
angular.module('app.signup', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/signup', {
templateUrl: 'views/signup/signup.html',
controller: 'SignupCtrl'
});
}])
.controller('SignupCtrl', function($scope, $http, $routeParams) {
$scope.user = {};
$scope.doSignup = function() {
console.log('Doing login', $scope.user);
$http({
url: urlapi + 'signup',
method: "POST",
data: $scope.user
})
.then(function(response) {
console.log("response: ");
console.log(response.data);
if (response.data.success == true)
{
localStorage.setItem("cr_webapp_token", response.data.token);
localStorage.setItem("cr_webapp_userdata", JSON.stringify(response.data.user));
window.location.reload();
}else{
console.log("signup failed");
toastr.error('Signup failed');
}
},
function(response) { // optional
// failed
console.log(response);
});
};
});