added currency selector to navbar. secondary navbar on blockpage when scroll

This commit is contained in:
Gustavo Cortez 2014-02-24 19:42:17 -03:00
parent e3a93f958c
commit 151d6b7d75
5 changed files with 59 additions and 13 deletions

View File

@ -117,7 +117,6 @@ margin-left: 0;
} }
.navbar-form { .navbar-form {
margin-left: 20px;
width: 35%; width: 35%;
margin-top: 15px; margin-top: 15px;
} }
@ -127,11 +126,11 @@ margin-left: 0;
margin: 0; margin: 0;
} }
.navbar-form { .navbar-form {
width: 20%; width: 15%;
} }
} }
@media (max-width: 768px) { @media (max-width: 767px) {
.navbar-form { .navbar-form {
width: auto; width: auto;
} }
@ -146,6 +145,7 @@ margin-left: 0;
font-size: 34px; font-size: 34px;
font-style: italic; font-style: italic;
font-weight: 700; font-weight: 700;
overflow: hidden;
} }
.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus { .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
@ -154,7 +154,6 @@ margin-left: 0;
.navbar-default .navbar-brand { .navbar-default .navbar-brand {
color: #FFFFFF; color: #FFFFFF;
margin-right: 20px;
padding: 22px 15px; padding: 22px 15px;
} }
@ -211,6 +210,7 @@ margin-left: 0;
font-size: 12px; font-size: 12px;
color: #eee; color: #eee;
text-align: center; text-align: center;
margin-right: 10px;
} }
.status .tooltip { .status .tooltip {
@ -661,3 +661,15 @@ a.v_highlight_more {
color: #fff; color: #fff;
} }
.secondary_navbar {
width: 100%;
background: #fff;
position: fixed;
top: 64px;
left: 0;
border: 1px solid #eee;
padding: 10px;
text-align: center;
z-index: 10000;
}

View File

@ -3,6 +3,18 @@
var ZeroClipboard = window.ZeroClipboard; var ZeroClipboard = window.ZeroClipboard;
angular.module('insight') angular.module('insight')
.directive("scroll", function ($window) {
return function(scope, element, attrs) {
angular.element($window).bind("scroll", function() {
if (this.pageYOffset >= 200) {
scope.secondaryNavbar = true;
} else {
scope.secondaryNavbar = false;
}
scope.$apply();
});
};
})
.directive('whenScrolled', function($window) { .directive('whenScrolled', function($window) {
return { return {
restric: 'A', restric: 'A',

View File

@ -1,5 +1,20 @@
<div data-ng-include src="'/views/includes/connection.html'"></div> <div data-ng-include src="'/views/includes/connection.html'"></div>
<section data-ng-controller="BlocksController" data-ng-init="findOne()"> <section data-ng-controller="BlocksController" data-ng-init="findOne()">
<div class="secondary_navbar" scroll data-ng-class="{'hidden': !secondaryNavbar}">
<div class="row">
<div class="col-md-2">
<a href="/block/{{block.previousblockhash}}">&larr; Previous Block</a>
</div>
<div class="col-md-8 text-center">
<strong>Block</strong> #{{block.height}} &middot;
<strong>Hash</strong> {{block.hash}}
<span class="btn-copy" clip-copy="block.hash"></span>
</div>
<div class="col-md-2">
<a href="/block/{{block.nextblockhash}}">Next Block &rarr;</a>
</div>
</div>
</div>
<h1>Block #{{block.height}}</h1> <h1>Block #{{block.height}}</h1>
<div class="progress progress-striped active" data-ng-if="!block.hash"> <div class="progress progress-striped active" data-ng-if="!block.hash">
<div class="progress-bar progress-bar-info" style="width: 100%"> <div class="progress-bar progress-bar-info" style="width: 100%">

View File

@ -1,9 +1,15 @@
<div class="text-center"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">
<small class="text-muted">Currency:</small> {{currency.symbol}} <span class="caret"></span>
<div class="btn-group currency m10l" data-ng-controller="CurrencyController"> </a>
<ul class="dropdown-menu">
<a href="#" type="button" class="btn btn-default btn-sm" data-ng-click="setCurrency('USD')" data-ng-class="{active: currency.symbol == 'USD'}" tooltip="Change to USD: Bitstamp ${{currency.bitstamp}}"> <small>USD </small></a> <li>
<a href="#" type="button" class="btn btn-default btn-sm" data-ng-click="setCurrency('BTC')" data-ng-class="{active: currency.symbol == 'BTC'}" tooltip="Change to BTC"><small>BTC</small></a> <a href="#" data-ng-click="setCurrency('USD')" data-ng-class="{active: currency.symbol == 'USD'}">USD</a>
<a href="#" type="button" class="btn btn-default btn-sm" data-ng-click="setCurrency('mBTC')" data-ng-class="{active: currency.symbol == 'mBTC'}" tooltip="Change to mBTC"><small>mBTC</small></a> </li>
</div> <li>
</div> <a href="#" data-ng-click="setCurrency('BTC')" data-ng-class="{active: currency.symbol == 'BTC'}">BTC</a>
</li>
<li>
<a href="#" data-ng-click="setCurrency('mBTC')" data-ng-class="{active: currency.symbol == 'mBTC'}">mBTC</a>
</li>
</ul>

View File

@ -42,6 +42,7 @@
<strong>Height</strong> {{totalBlocks || info.blocks}} <strong>Height</strong> {{totalBlocks || info.blocks}}
</div> </div>
</li> </li>
<li class="dropdown" data-ng-controller="CurrencyController" data-ng-include src="'/views/includes/currency.html'"></li>
</ul> </ul>
</div> </div>
</div> </div>