marko/share-a-secret-java-api
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Frontend improvements.

Browse Source
This commit is contained in:
Marko Zivanovic
2014-11-26 21:46:58 +01:00
parent b73efaa359
commit 9f44f918cc
5 changed files with 66 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/java/rs/in/zivanovic/share/a/secret/api/controllers/SasController.java
+2 -2
View File
@@ -58,8 +58,8 @@ public class SasController {
return SasResponse.badRequest().withInvalidParameterValueError("threshold", params.getThreshold(),
"must not be grater than 'total' (" + String.valueOf(params.getTotal()) + ")").build();
}
List<SecretShare> shares = ShamirSecretSharing.split(params.getSecret(), params.getTotal(), params.
getThreshold());
List<SecretShare> shares = ShamirSecretSharing.split(params.getSecret(), params.getTotal(),
params.getThreshold());
return SasResponse.ok().withData(new Shares(shares)).build();
}
}
src/main/resources/static/index.html
+45 -16
View File
@@ -10,34 +10,41 @@
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular-resource.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> <script src="js/app.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.0/ui-bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.0/ui-bootstrap-tpls.min.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>
<body ng-controller="MainController">
<div class="container">
<div class="page-header">
<p class="lead">This is the explanation of what this service does.</p>
<h1>What's this all about?</h1>
<blockquote>
<p>Secret sharing (also called secret splitting) refers to methods for distributing a secret amongst a group of participants, each of whom is allocated a share of the secret. The secret can be reconstructed only when a sufficient number, of possibly different types, of shares are combined together; individual shares are of no use on their own.</p>
<footer><a href="https://en.wikipedia.org/wiki/Secret_sharing" target="_blank">Wikipedia</a></footer>
</blockquote>
</div>
<form>
<div class="row">
<div class="col-md-8">
<label for="secret">Enter the secret you want to split here:</label><br/>
<input select-on-click id="secret" type="text" ng-model="secret" size="20" placeholder="Enter your secret here ..." class="form-control" required="true"/>
<div class="col-md-8 form-group">
<label for="secret">Enter here the secret you want to share:</label>
<input id="secret" type="text" ng-model="secret" size="20" placeholder="Enter your secret here ..." class="form-control input-lg" required="true"/>
</div>
<div class="col-md-2">
<div class="col-md-2 form-group">
<label for="total">Total shares:</label>
<input id="total" type="number" ng-model="total" min="1" max="100" size="3" class="form-control"/>
<input id="total" type="number" ng-model="total" min="1" max="100" size="3" class="form-control input-lg"/>
</div>
<div class="col-md-2">
<div class="col-md-2 form-group">
<label for="threshold">Required shares:</label>
<input id="threshold" type="number" ng-model="threshold" min="1" max="100" size="3" class="form-control"/>
<input id="threshold" type="number" ng-model="threshold" min="1" max="100" size="3" class="form-control input-lg"/>
</div>
</div>
<br/>
<div class="row">
<div class="col-md-12">
<div class="col-md-12 form-group">
<button id="split" ng-click="split()" class="btn btn-lg btn-primary btn-block">Split</button>
</div>
</div>
@@ -47,18 +54,40 @@
<div class="row" ng-show="errors.length">
<h1>Whoops, something's wrong ...</h1>
</div>
<div ng-repeat="err in errors" class="row">
<div ng-repeat="err in errors">
<div class="alert alert-danger">{{err.message}}</div>
</div>
</div>
<div class="row">
<div class="row" ng-show="shares.length">
<div class="row" ng-show="shares.length">
<div class="row">
<hr/>
<h1>Here are your secret shares ...</h1>
</div>
<div ng-repeat="share in shares" class="row">
<div class="alert" ng-class="{'alert-info': !isShareClicked(share), 'alert-success': isShareClicked(share)}" ng-click="shareClicked(share)" select-on-click>{{share}}</div>
</div>
<tabset>
<tab>
<tab-heading><i class="glyphicon glyphicon-list"></i> List</tab-heading>
<div class="panel panel-default">
<div class="panel-body">
<p class="text-muted">Click on a share to select it for easy copying to clipboard.
After clicking it, the share will change color to indicate the ones you have already copied.</p>
<div ng-repeat="share in shares">
<div class="text-nowrap alert" ng-class="{'alert-info': !isShareClicked(share), 'alert-success': isShareClicked(share)}" ng-click="shareClicked(share)" select-on-click>{{share}}</div>
</div>
</div>
</div>
</tab>
<tab>
<tab-heading><i class="glyphicon glyphicon-align-left"></i> Text</tab-heading>
<div class="panel panel-default">
<div class="panel-body">
<p class="text-muted">Use this panel to easily copy all shares at once.</p>
<textarea class="form-control" rows="{{total < 20 ? total : 20}}" readonly="true" wrap="off">{{sharesAsText}}</textarea>
</div>
</div>
</tab>
</tabset>
</div>
</div>
src/main/resources/static/js/app.js
+2 -1
View File
@@ -24,6 +24,7 @@
angular.module('sasApp', [
'ngResource',
'ui.bootstrap',
'sasControllers',
'sasServices'
]).directive('selectOnClick', function ($window) {
@@ -37,5 +38,5 @@ angular.module('sasApp', [
selection.addRange(range);
});
}
}
};
});
src/main/resources/static/js/controllers.js
+15 -8
View File
@@ -32,18 +32,19 @@ angular.module('sasControllers', []).
var clickedShares = {};
$scope.isShareClicked = function (share) {
console.log('iA: ' + JSON.stringify(clickedShares));
console.log('iO: ' + clickedShares[share]);
return clickedShares[share] !== undefined;
};
$scope.shareClicked = function (share) {
console.log('cA: ' + JSON.stringify(clickedShares));
console.log('cO: ' + clickedShares[share]);
clickedShares[share] = true;
};
$scope.split = function () {
if ($scope.secret === undefined || $scope.secret.length === 0 ||
$scope.total === undefined || Number($scope.total) > 100 ||
$scope.threshold === undefined || Number($scope.threshold) > 99) {
return;
}
$scope.errors = [];
$scope.shares = [];
clickedShares = {};
@@ -52,17 +53,23 @@ angular.module('sasControllers', []).
total: $scope.total,
threshold: $scope.threshold},
function (response) {
console.log(JSON.stringify(response));
if (response.status === 'OK') {
$scope.shares = response.data.shares;
$scope.sharesAsText = mergeSharesToString(response.data.shares);
} else {
$scope.errors = response.errors;
console.log("Errors: " + JSON.stringify(response.errors));
}
}, function (response) {
console.log(JSON.stringify(response));
$scope.errors = response.data.errors;
console.log("Errors: " + JSON.stringify(response.data.errors));
});
};
}]);
function mergeSharesToString(shares) {
var res = "";
for (var i in shares) {
res = res + shares[i] + (i < shares.length - 1 ? "\n" : "");
}
return res;
}
src/main/resources/static/sas.css
+1 -18
View File
@@ -1,18 +1 @@
/* Sticky footer styles
-------------------------------------------------- */
html {
position: relative;
min-height: 100%;
}
body {
/* Margin bottom by footer height */
margin-bottom: 60px;
}
.footer {
position: absolute;
bottom: 0;
width: 100%;
/* Set the fixed height of the footer here */
height: 60px;
background-color: #f5f5f5;
}
.nav, .pagination, .carousel, .panel-title a { cursor: pointer; }