Detailed password info

This commit is contained in:
Sander 2016-09-12 13:21:41 +02:00
parent c04745aef8
commit 43f40d04a1
4 changed files with 78 additions and 5 deletions

View file

@ -1,12 +1,15 @@
.pass-meter {
width:100%;
padding-top:3px;
padding-bottom:4px;
padding-bottom: 20px;
}
.pass-meter.hidden {
display: none;
}
.pass-meter .details, .pass-meter .pass-meter-message{
margin-top: 3px;
}
.pass-meter-col {
float:left;
@ -59,4 +62,12 @@
.pass-meter .details:hover{
color: rgb(0, 102, 255) !important;
}
.detail_box .row {
clear: both;
}
.detail_box .row .col{
float: left;
width: 49%;
}

View file

@ -3,7 +3,7 @@ angular.module('templates-main', ['views/partials/password-meter.html', 'views/s
angular.module('views/partials/password-meter.html', []).run(['$templateCache', function($templateCache) {
'use strict';
$templateCache.put('views/partials/password-meter.html',
'<div class="pass-meter {{masterClass}}"><div class="{{colClass}} pass-meter-col {{first}}"><div class="indicator"></div></div><div class="{{colClass}} pass-meter-col {{second}}"><div class="indicator"></div></div><div class="{{colClass}} pass-meter-col {{third}}"><div class="indicator"></div></div><div class="{{colClass}} pass-meter-col {{fourth}}"><div class="indicator"></div></div><div class="details" ng-click="toggleScore()">Details</div><div class="pass-meter-message">{{message}}</div><div class="detail_box" ng-show="scoreShown">{{score}}</div></div>');
'<div class="pass-meter {{masterClass}}"><div class="{{colClass}} pass-meter-col {{first}}"><div class="indicator"></div></div><div class="{{colClass}} pass-meter-col {{second}}"><div class="indicator"></div></div><div class="{{colClass}} pass-meter-col {{third}}"><div class="indicator"></div></div><div class="{{colClass}} pass-meter-col {{fourth}}"><div class="indicator"></div></div><div class="details" ng-click="toggleScore()"><span ng-show="!scoreShown">Details</span> <span ng-show="scoreShown">Hide details</span></div><div class="pass-meter-message">{{message}}</div><div class="detail_box" ng-show="scoreShown"><div class="row"><div class="col">Score:</div><div class="col">{{score.score}}</div></div><div class="row"><div class="col">100 / hour<br><small>Throttled online attack</small></div><div class="col">{{score.crack_times_display.online_throttling_100_per_hour}}</div></div><div class="row"><div class="col">10 / second<br><small>Unthrottled online attack</small></div><div class="col">{{score.crack_times_display.online_no_throttling_10_per_second}}</div></div><div class="row"><div class="col">10k / second<br><small>Offline attack, slow hash, many cores</small></div><div class="col">{{score.crack_times_display.offline_slow_hashing_1e4_per_second}}</div></div><div class="row"><div class="col">10B / second<br><small>offline attack, fast hash, many cores</small></div><div class="col">{{score.crack_times_display.offline_fast_hashing_1e10_per_second}}</div></div><div class="row"><div class="col">Match sequence:</div><div class="col"><div class="sequence" ng-repeat="sequence in score.sequence"><div>Pattern: {{sequence.pattern}}</div><div>Matched word: {{sequence.matched_word}}</div><div>Dictionary name: {{sequence.dictionary_name}}</div><div>Guesses: {{sequence.guesses}}</div></div></div></div></div></div>');
}]);
angular.module('views/show_vault.html', []).run(['$templateCache', function($templateCache) {

View file

@ -56,7 +56,7 @@
if (scope.strength == 0) {
scope.first = 'poor';
scope.message = 'Poor';
scope.message = 'poor';
} else if (scope.strength == 1) {
scope.first = 'poor';
scope.second = 'poor';

View file

@ -11,7 +11,69 @@
<div class="{{colClass}} pass-meter-col {{fourth}}">
<div class="indicator"></div>
</div>
<div class="details" ng-click="toggleScore()">Details</div>
<div class="details" ng-click="toggleScore()">
<span ng-show="!scoreShown">Details</span>
<span ng-show="scoreShown">Hide details</span>
</div>
<div class="pass-meter-message">{{message}}</div>
<div class="detail_box" ng-show="scoreShown">{{score}}</div>
<div class="detail_box" ng-show="scoreShown">
<div class="row">
<div class="col">
Score:
</div>
<div class="col">
{{score.score}}
</div>
</div>
<div class="row">
<div class="col">
100 / hour<br/>
<small> Throttled online attack</small>
</div>
<div class="col">
{{score.crack_times_display.online_throttling_100_per_hour}}
</div>
</div>
<div class="row">
<div class="col">
10 / second<br/>
<small>Unthrottled online attack</small>
</div>
<div class="col">
{{score.crack_times_display.online_no_throttling_10_per_second}}
</div>
</div>
<div class="row">
<div class="col">
10k / second<br/>
<small>Offline attack, slow hash, many cores</small>
</div>
<div class="col">
{{score.crack_times_display.offline_slow_hashing_1e4_per_second}}
</div>
</div>
<div class="row">
<div class="col">
10B / second<br/>
<small>offline attack, fast hash, many cores</small>
</div>
<div class="col">
{{score.crack_times_display.offline_fast_hashing_1e10_per_second}}
</div>
</div>
<div class="row">
<div class="col">
Match sequence:
</div>
<div class="col">
<!-- {{score.sequence}} -->
<div class="sequence" ng-repeat="sequence in score.sequence">
<div>Pattern: {{sequence.pattern}}</div>
<div>Matched word: {{sequence.matched_word}}</div>
<div>Dictionary name: {{sequence.dictionary_name}}</div>
<div>Guesses: {{sequence.guesses}}</div>
</div>
</div>
</div>
</div>
</div>