Skip to content

Commit b82fda6

Browse files
lanterndevlanterndev
committed
rewrite vis using angular directives
temporarily use custom built version of angular-ui-bootstrap while the fix for angular-ui/bootstrap#387 has not yet been released with additional patch to support tooltip-placement="mouse"
1 parent 09ea288 commit b82fda6

15 files changed

+3237
-2271
lines changed

‎app/_css/app.css

+48-16
Original file line numberDiff line numberDiff line change
@@ -6407,6 +6407,7 @@ html, body {
64076407

64086408
body {
64096409
background: url('../img/bg.png');
6410+
overflow: hidden;
64106411
}
64116412

64126413
small {
@@ -6496,6 +6497,7 @@ label.checkbox.inline, label.radio.inline {
64966497

64976498
.tooltip-inner {
64986499
font-size: 12.6px;
6500+
max-width: none;
64996501
}
65006502

65016503
.btn-give {
@@ -6778,6 +6780,21 @@ textarea {
67786780
}
67796781
}
67806782

6783+
.modal {
6784+
background-color: transparent;
6785+
}
6786+
6787+
.modal-header, .modal-body:not(#welcome) {
6788+
background-color: white;
6789+
}
6790+
6791+
.modal-header {
6792+
-webkit-border-top-left-radius: 6px;
6793+
border-top-left-radius: 6px;
6794+
-webkit-border-top-right-radius: 6px;
6795+
border-top-right-radius: 6px;
6796+
}
6797+
67816798
.modal.fade {
67826799
-webkit-transition: opacity 0.3s ease;
67836800
transition: opacity 0.3s ease;
@@ -6876,7 +6893,7 @@ textarea {
68766893

68776894
#welcome {
68786895
text-align: center;
6879-
background-color: black;
6896+
background-color: rgba(0, 0, 0, 0.3);
68806897
color: white;
68816898
}
68826899
#welcome .modal-body {
@@ -7265,6 +7282,14 @@ textarea.report {
72657282
left: 25px;
72667283
}
72677284

7285+
#vis-block {
7286+
position: absolute;
7287+
top: 0;
7288+
right: 0;
7289+
bottom: 0;
7290+
left: 0;
7291+
}
7292+
72687293
#vis-container, #vis {
72697294
height: 100%;
72707295
}
@@ -7302,6 +7327,14 @@ textarea.report {
73027327
stroke-opacity: 1 !important;
73037328
}
73047329

7330+
.peer {
7331+
opacity: 0.4;
7332+
}
7333+
7334+
.peer.connected {
7335+
opacity: 1;
7336+
}
7337+
73057338
.peer.get, #self.get {
73067339
fill: #ffcc66;
73077340
}
@@ -7330,54 +7363,53 @@ g.transferring .connection {
73307363
opacity: 1;
73317364
}
73327365

7333-
.tooltip.vis .tooltip-inner {
7334-
max-width: none;
7366+
.tooltip .vis {
73357367
text-align: left;
73367368
white-space: nowrap;
73377369
text-overflow: ellipsis;
73387370
}
7339-
.tooltip.vis .tooltip-inner .picture {
7371+
.tooltip .vis .picture {
73407372
height: 64px;
73417373
width: 64px;
73427374
margin: 5px 10px 0 0;
73437375
}
7344-
.tooltip.vis .tooltip-inner .picture, .tooltip.vis .tooltip-inner .headers {
7376+
.tooltip .vis .picture, .tooltip .vis .headers {
73457377
float: left;
73467378
}
7347-
.tooltip.vis .tooltip-inner .header {
7379+
.tooltip .vis .header {
73487380
font-weight: bold;
73497381
font-size: 14.7px;
73507382
}
7351-
.tooltip.vis .tooltip-inner .get .header, .tooltip.vis .tooltip-inner .get .type {
7383+
.tooltip .vis .get .header, .tooltip .vis .get .type {
73527384
color: #ffcc66;
73537385
}
7354-
.tooltip.vis .tooltip-inner .give .header, .tooltip.vis .tooltip-inner .give .type {
7386+
.tooltip .vis .give .header, .tooltip .vis .give .type {
73557387
color: #aad092;
73567388
}
7357-
.tooltip.vis .tooltip-inner .unknown .header, .tooltip.vis .tooltip-inner .unknown .type {
7389+
.tooltip .vis .unknown .header, .tooltip .vis .unknown .type {
73587390
color: #eeeeee;
73597391
}
7360-
.tooltip.vis .tooltip-inner .cloud .header, .tooltip.vis .tooltip-inner .laeproxy .header, .tooltip.vis .tooltip-inner .cloud .type, .tooltip.vis .tooltip-inner .laeproxy .type {
7392+
.tooltip .vis .cloud .header, .tooltip .vis .laeproxy .header, .tooltip .vis .cloud .type, .tooltip .vis .laeproxy .type {
73617393
color: green !important;
73627394
}
7363-
.tooltip.vis .tooltip-inner .type {
7395+
.tooltip .vis .type {
73647396
font-size: 10.5px;
73657397
}
7366-
.tooltip.vis .tooltip-inner .peerid, .tooltip.vis .tooltip-inner .id {
7398+
.tooltip .vis .peerid, .tooltip .vis .id {
73677399
font-size: 10.5px;
73687400
color: #999999;
73697401
}
7370-
.tooltip.vis .tooltip-inner .stats {
7402+
.tooltip .vis .stats {
73717403
clear: both;
73727404
font-size: 10.5px;
73737405
}
7374-
.tooltip.vis .tooltip-inner .lastConnected {
7406+
.tooltip .vis .lastConnected {
73757407
font-size: 10.5px;
73767408
}
7377-
.tooltip.vis .tooltip-inner .npeersEver {
7409+
.tooltip .vis .npeersEver {
73787410
color: #999999;
73797411
}
7380-
.tooltip.vis .tooltip-inner .give-colored {
7412+
.tooltip .vis .give-colored {
73817413
color: #aad092;
73827414
}
73837415

‎app/index.html

+8
Original file line numberDiff line numberDiff line change
@@ -27,17 +27,25 @@
2727
<script src="lib/angular/i18n/angular-locale_fa-ir.js"></script>
2828
<script src="lib/angular/i18n/angular-locale_ar.js"></script>
2929
-->
30+
3031
<script src="components/angular-ui-utils/modules/if/if.js"></script>
3132
<script src="components/angular-ui-utils/modules/showhide/showhide.js"></script>
33+
<!--
3234
<script src="components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
35+
-->
36+
<script src="lib/ui-bootstrap-tpls-0.4.0-SNAPSHOT.js"></script>
37+
3338
<!--
3439
<script src="lib/bootstrap.js"></script>
3540
<script src="lib/select2/select2.js"></script>
3641
-->
3742

3843
<script src="components/lodash/lodash.js"></script>
3944
<script src="components/d3/d3.js"></script>
45+
<script src="lib/topojson.js"></script>
46+
<!--
4047
<script src="components/topojson/topojson.js"></script>
48+
-->
4149

4250
<script src="js/version.js"></script>
4351
<script src="js/app.js"></script>

‎app/js/app.js

-5
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,4 @@ var app = angular.module('app', [
3030
// angular-ui config
3131
.value('ui.config', {
3232
animate: 'ui-hide',
33-
jq: {
34-
tooltip: {
35-
container: 'body'
36-
}
37-
}
3833
});

‎app/js/controllers.js

+1-5
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,7 @@ function ContactCtrl($scope, MODAL, $filter, CONTACT_FORM_MAXLEN) {
220220
}, true);
221221
}
222222

223-
function SettingsCtrl($scope, $timeout, modelSrvc, logFactory, MODAL) {
223+
function SettingsCtrl($scope, logFactory, MODAL) {
224224
var log = logFactory('SettingsCtrl');
225225

226226
$scope.$watch('model.settings.runAtSystemStart', function(runAtSystemStart) {
@@ -249,10 +249,6 @@ function ProxiedSitesCtrl($scope, $timeout, $filter, logFactory, MODAL, SETTING,
249249
proxiedSites = [],
250250
proxiedSitesDirty = [];
251251

252-
$scope.$watch('model.modal', function(modal) {
253-
$scope.show = modal === MODAL.proxiedSites;
254-
});
255-
256252
$scope.$watch('searchText', function(searchText) {
257253
$scope.inputFiltered = (searchText ? fltr(proxiedSitesDirty, searchText) : proxiedSitesDirty).join('\n');
258254
});

‎app/js/directives.js

+13-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
'use strict';
22

3-
angular.module('app.directives', [])
3+
var directives = angular.module('app.directives', [])
44
.directive('focusOn', ['$parse', function($parse) {
55
return function(scope, element, attr) {
66
var val = $parse(attr['focusOn']);
@@ -11,3 +11,15 @@ angular.module('app.directives', [])
1111
});
1212
}
1313
}]);
14+
15+
// XXX https://github.com/angular/angular.js/issues/1050#issuecomment-9650293
16+
angular.forEach(['x', 'y', 'cx', 'cy', 'd', 'fill', 'r'], function(name) {
17+
var ngName = 'ng' + name[0].toUpperCase() + name.slice(1);
18+
directives.directive(ngName, function() {
19+
return function(scope, element, attrs) {
20+
attrs.$observe(ngName, function(value) {
21+
attrs.$set(name, value);
22+
})
23+
};
24+
});
25+
});

‎app/js/filters.js

+5
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@
22

33
angular.module('app.filters', [])
44
// see i18n.js for i18n filter
5+
.filter('upper', function() {
6+
return function(s) {
7+
return angular.uppercase(s);
8+
};
9+
})
510
.filter('badgeCount', function() {
611
return function(str, max) {
712
var count = parseInt(str), max = max || 9;

0 commit comments

Comments
 (0)