passman/templates/views/partials/password-meter.html

<div class="pass-meter {{masterClass}}" off-click="matchBreakdown = false;">
	<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">
				Password score:
			</div>
			<div class="col">
				{{score.score}}
			</div>
		</div>
		<div><b>Cracking times</b></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">
				<span class="link" ng-click="toggleMatchBreakdown()">See match sequence</span>
			</div>
		</div>
	</div>
</div>

<div class="match-sequence hidden" >
	<div class="container" ng-style="{'width': score.sequence.length * 210 }">
		<div class="sequence" ng-repeat="sequence in score.sequence">
			<div><b>{{sequence.token}}</b></div>
			<div>Pattern: {{sequence.pattern}}</div>
			<div>Matched word: {{sequence.matched_word}}</div>
			<div>Dictionary name: {{sequence.dictionary_name}}</div>
			<div>Rank: {{sequence.rank}}</div>
			<div>Reversed: {{sequence.reversed}}</div>
			<div>Guesses: {{sequence.guesses}}</div>
			<div>Base guesses: {{sequence.base_guesses}}</div>
			<div>Uppercase variations: {{sequence.l33t_variations}}</div>
			<div>l33t-variations: {{sequence.l33t_variations}}</div>
		</div>
	</div>
</div>