diff --git a/buildman/component/basecomponent.py b/buildman/component/basecomponent.py index 47781dff5..bd4032776 100644 --- a/buildman/component/basecomponent.py +++ b/buildman/component/basecomponent.py @@ -8,3 +8,6 @@ class BaseComponent(ApplicationSession): self.parent_manager = None self.build_logs = None self.user_files = None + + def kind(self): + raise NotImplementedError \ No newline at end of file diff --git a/buildman/component/buildcomponent.py b/buildman/component/buildcomponent.py index e20ee822d..647161190 100644 --- a/buildman/component/buildcomponent.py +++ b/buildman/component/buildcomponent.py @@ -49,6 +49,9 @@ class BuildComponent(BaseComponent): BaseComponent.__init__(self, config, **kwargs) + def kind(self): + return 'builder' + def onConnect(self): self.join(self.builder_realm) diff --git a/buildman/manager/enterprise.py b/buildman/manager/enterprise.py index c56830a1c..0ce69e508 100644 --- a/buildman/manager/enterprise.py +++ b/buildman/manager/enterprise.py @@ -25,6 +25,9 @@ class DynamicRegistrationComponent(BaseComponent): logger.debug('Registering new build component+worker with realm %s', realm) return realm + def kind(self): + return 'registration' + class EnterpriseManager(BaseManager): """ Build manager implementation for the Enterprise Registry. """ @@ -82,5 +85,7 @@ class EnterpriseManager(BaseManager): if build_component in self.ready_components: self.ready_components.remove(build_component) + self.unregister_component(build_component) + def num_workers(self): return len(self.all_components) diff --git a/buildman/manager/ephemeral.py b/buildman/manager/ephemeral.py index cfb52f8ad..473e75fb3 100644 --- a/buildman/manager/ephemeral.py +++ b/buildman/manager/ephemeral.py @@ -271,8 +271,6 @@ class EphemeralBuilderManager(BaseManager): def build_component_disposed(self, build_component, timed_out): logger.debug('Calling build_component_disposed.') - - # TODO make it so that I don't have to unregister the component if it timed out self.unregister_component(build_component) @coroutine diff --git a/buildman/server.py b/buildman/server.py index ebbc558bb..f6ba9b4bc 100644 --- a/buildman/server.py +++ b/buildman/server.py @@ -1,5 +1,6 @@ import logging import trollius +import json from autobahn.asyncio.wamp import RouterFactory, RouterSessionFactory from autobahn.asyncio.websocket import WampWebSocketServerFactory @@ -69,7 +70,21 @@ class BuilderServer(object): @controller_app.route('/status') def status(): - return server._current_status + metrics = server._queue.get_metrics(require_transaction=False) + (running_count, available_not_running_count, available_count) = metrics + + workers = [component for component in server._current_components + if component.kind() == 'builder'] + + data = { + 'status': server._current_status, + 'running_local': server._job_count, + 'running_total': running_count, + 'workers': len(workers), + 'job_total': available_count + running_count + } + + return json.dumps(data) self._controller_app = controller_app diff --git a/data/model/legacy.py b/data/model/legacy.py index ab80aa1a1..fe675767e 100644 --- a/data/model/legacy.py +++ b/data/model/legacy.py @@ -170,8 +170,7 @@ def _create_user(username, email): pass try: - new_user = User.create(username=username, email=email) - return new_user + return User.create(username=username, email=email) except Exception as ex: raise DataModelException(ex.message) diff --git a/data/queue.py b/data/queue.py index 40a94c6e9..c1fb871ad 100644 --- a/data/queue.py +++ b/data/queue.py @@ -6,6 +6,12 @@ from util.morecollections import AttrDict MINIMUM_EXTENSION = timedelta(seconds=20) +class NoopWith: + def __enter__(self): + pass + + def __exit__(self, type, value, traceback): + pass class WorkQueue(object): def __init__(self, queue_name, transaction_factory, @@ -49,21 +55,32 @@ class WorkQueue(object): def _item_by_id_for_update(self, queue_id): return db_for_update(QueueItem.select().where(QueueItem.id == queue_id)).get() - def update_metrics(self): - if self._reporter is None: - return - - with self._transaction_factory(db): + def get_metrics(self, require_transaction=True): + guard = self._transaction_factory(db) if require_transaction else NoopWith() + with guard: now = datetime.utcnow() name_match_query = self._name_match_query() running_query = self._running_jobs(now, name_match_query) running_count = running_query.distinct().count() - available_query = self._available_jobs_not_running(now, name_match_query, running_query) + available_query = self._available_jobs(now, name_match_query) available_count = available_query.select(QueueItem.queue_name).distinct().count() - self._reporter(self._currently_processing, running_count, running_count + available_count) + available_not_running_query = self._available_jobs_not_running(now, name_match_query, + running_query) + available_not_running_count = (available_not_running_query.select(QueueItem.queue_name) + .distinct().count()) + + return (running_count, available_not_running_count, available_count) + + def update_metrics(self): + if self._reporter is None: + return + + (running_count, available_not_running_count, available_count) = self.get_metrics() + self._reporter(self._currently_processing, running_count, + running_count + available_not_running_count) def put(self, canonical_name_list, message, available_after=0, retries_remaining=5): """ diff --git a/endpoints/api/__init__.py b/endpoints/api/__init__.py index 377834002..0252851a1 100644 --- a/endpoints/api/__init__.py +++ b/endpoints/api/__init__.py @@ -334,7 +334,11 @@ def validate_json_request(schema_name): def wrapped(self, *args, **kwargs): schema = self.schemas[schema_name] try: - validate(request.get_json(), schema) + json_data = request.get_json() + if json_data is None: + raise InvalidRequest('Missing JSON body') + + validate(json_data, schema) return func(self, *args, **kwargs) except ValidationError as ex: raise InvalidRequest(ex.message) diff --git a/endpoints/api/suconfig.py b/endpoints/api/suconfig.py index daaba41ce..10741d9f3 100644 --- a/endpoints/api/suconfig.py +++ b/endpoints/api/suconfig.py @@ -50,6 +50,7 @@ class SuperUserRegistryStatus(ApiResource): @verify_not_prod def get(self): """ Returns the status of the registry. """ + # If there is no conf/stack volume, then report that status. if not CONFIG_PROVIDER.volume_exists(): return { diff --git a/endpoints/realtime.py b/endpoints/realtime.py index 9f1d5c44f..44b806ce1 100644 --- a/endpoints/realtime.py +++ b/endpoints/realtime.py @@ -4,13 +4,62 @@ import json from flask import request, Blueprint, abort, Response from flask.ext.login import current_user from auth.auth import require_session_login -from app import userevents +from endpoints.common import route_show_if +from app import app, userevents +from auth.permissions import SuperUserPermission + +import features +import psutil +import time logger = logging.getLogger(__name__) realtime = Blueprint('realtime', __name__) +@realtime.route("/ps") +@route_show_if(features.SUPER_USERS) +@require_session_login +def ps(): + if not SuperUserPermission().can(): + abort(403) + + def generator(): + while True: + build_status = {} + try: + builder_data = app.config['HTTPCLIENT'].get('http://localhost:8686/status', timeout=1) + if builder_data.status_code == 200: + build_status = json.loads(builder_data.text) + except: + pass + + try: + data = { + 'count': { + 'cpu': psutil.cpu_percent(interval=1, percpu=True), + 'virtual_mem': psutil.virtual_memory(), + 'swap_mem': psutil.swap_memory(), + 'connections': len(psutil.net_connections()), + 'processes': len(psutil.pids()), + 'network': psutil.net_io_counters() + }, + 'build': build_status + } + except psutil.AccessDenied: + data = {} + + json_string = json.dumps(data) + yield 'data: %s\n\n' % json_string + time.sleep(1) + + try: + return Response(generator(), mimetype="text/event-stream") + except: + pass + + + @realtime.route("/user/") @require_session_login def index(): diff --git a/external_libraries.py b/external_libraries.py index 3fa48c44a..3ab6bfd4a 100644 --- a/external_libraries.py +++ b/external_libraries.py @@ -6,7 +6,7 @@ LOCAL_DIRECTORY = 'static/ldn/' EXTERNAL_JS = [ 'code.jquery.com/jquery.js', - 'netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js', + 'netdna.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js', 'ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js', 'ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular-route.min.js', 'ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular-sanitize.min.js', @@ -19,7 +19,7 @@ EXTERNAL_JS = [ EXTERNAL_CSS = [ 'netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css', - 'netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.no-icons.min.css', + 'netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css', 'fonts.googleapis.com/css?family=Source+Sans+Pro:400,700', ] diff --git a/requirements-nover.txt b/requirements-nover.txt index 9b8707870..b81936ec7 100644 --- a/requirements-nover.txt +++ b/requirements-nover.txt @@ -47,3 +47,4 @@ pyOpenSSL pygpgme cachetools mock +psutil \ No newline at end of file diff --git a/requirements.txt b/requirements.txt index 4e51c6245..ee41fcc56 100644 --- a/requirements.txt +++ b/requirements.txt @@ -39,6 +39,7 @@ mixpanel-py==3.2.1 mock==1.0.1 paramiko==1.15.2 peewee==2.4.7 +psutil==2.2.1 psycopg2==2.5.4 py-bcrypt==0.4 pycrypto==2.6.1 diff --git a/static/css/core-ui.css b/static/css/core-ui.css index a89f07f39..2012129c1 100644 --- a/static/css/core-ui.css +++ b/static/css/core-ui.css @@ -702,4 +702,19 @@ .co-alert .co-step-bar { float: right; margin-top: 6px; +} + +.realtime-area-chart, .realtime-line-chart { + margin: 10px; + text-align: center; +} + +.rickshaw_graph { + overflow: hidden; + padding-bottom: 40px; +} + +.cor-container { + padding-left: 15px; + padding-right: 15px; } \ No newline at end of file diff --git a/static/css/quay.css b/static/css/quay.css index e09fce346..4fc72cc49 100644 --- a/static/css/quay.css +++ b/static/css/quay.css @@ -3,6 +3,10 @@ margin: 0; } +.btn { + outline: none !important; +} + @media (max-width: 410px) { .olrk-normal { display: none; @@ -159,7 +163,7 @@ nav.navbar-default .navbar-nav>li>a.active { .notification-view-element .circle { position: absolute; - top: 14px; + top: 15px; left: 0px; width: 12px; @@ -179,13 +183,13 @@ nav.navbar-default .navbar-nav>li>a.active { margin-bottom: 4px; } -.notification-view-element .container { +.notification-view-element .notification-content { padding: 10px; border-radius: 6px; margin-left: 16px; } -.notification-view-element .container:hover { +.notification-view-element .notification-content:hover { background: rgba(66, 139, 202, 0.1); } @@ -1140,59 +1144,59 @@ i.toggle-icon:hover { } .visible-sm-inline { - display: none; + display: none !important; } .visible-md-inline { - display: none; + display: none !important; } .hidden-sm-inline { - display: inline; + display: inline !important; } .hidden-xs-inline { - display: inline; + display: inline !important; } @media (min-width: 991px) { .visible-md-inline { - display: inline; + display: inline !important; } } @media (max-width: 991px) and (min-width: 768px) { .visible-sm-inline { - display: inline; + display: inline !important; } .hidden-sm-inline { - display: none; + display: none !important; } } @media (max-width: 700px) { .hidden-xs-inline { - display: none; + display: none !important; } } .visible-xl { - display: none; + display: none !important; } .visible-xl-inline { - display: none; + display: none !important; } @media (min-width: 1200px) { .visible-xl { - display: block; + display: block !important; } .visible-xl-inline { - display: inline-block; + display: inline-block !important; } } @@ -1413,6 +1417,10 @@ i.toggle-icon:hover { background: transparent; } +.jumbotron p { + font-size: 100%; +} + .jumbotron .disclaimer-link { font-size: .3em; vertical-align: 23px; @@ -1483,6 +1491,8 @@ i.toggle-icon:hover { .landing-content { z-index: 2; + padding-left: 20px; + padding-right: 20px; } .landing .call-to-action i.fa { @@ -3762,7 +3772,7 @@ p.editable:hover i { text-align: center; position: relative; color: white; - left: -42px; + left: -38px; top: -9px; font-weight: bold; font-size: .4em; @@ -3772,23 +3782,6 @@ p.editable:hover i { margin-bottom: 40px; } -.landing .social-alternate { - color: #777; - font-size: 2em; - margin-left: 43px; - line-height: 1em; -} - -.landing .social-alternate .inner-text { - text-align: center; - position: relative; - color: white; - left: -43px; - top: -9px; - font-weight: bold; - font-size: .4em; -} - .contact-options { margin-top: 60px; } @@ -4972,3 +4965,9 @@ i.slack-icon { left: 16px; font-size: 28px; } + +.chart-col h4, .chart-col h5 { + display: block; + text-align: center; +} + diff --git a/static/directives/application-manager.html b/static/directives/application-manager.html index 824fd36f7..ba7fb90ae 100644 --- a/static/directives/application-manager.html +++ b/static/directives/application-manager.html @@ -1,7 +1,7 @@
-
+
Create New Application diff --git a/static/directives/config/config-setup-tool.html b/static/directives/config/config-setup-tool.html index 6b40f1fd5..7863ab1a4 100644 --- a/static/directives/config/config-setup-tool.html +++ b/static/directives/config/config-setup-tool.html @@ -1,5 +1,5 @@
- +
@@ -289,7 +289,7 @@

Authentication for the registry can be handled by either the registry itself or LDAP. - External authentication providers (such as Github) can be used on top of this choice. + External authentication providers (such as GitHub) can be used on top of this choice.

@@ -339,20 +339,20 @@
- +
- Github (Enterprise) Authentication + GitHub (Enterprise) Authentication

- If enabled, users can use Github or Github Enterprise to authenticate to the registry. + If enabled, users can use GitHub or GitHub Enterprise to authenticate to the registry.

- Note: A registered Github (Enterprise) OAuth application is required. + Note: A registered GitHub (Enterprise) OAuth application is required. View instructions on how to - + Create an OAuth Application in GitHub

@@ -360,21 +360,21 @@
- +
- + - + @@ -402,7 +402,7 @@
Github:GitHub:
Github Endpoint:GitHub Endpoint:
- The Github Enterprise endpoint. Must start with http:// or https://. + The GitHub Enterprise endpoint. Must start with http:// or https://.
-
+
@@ -471,20 +471,20 @@
- +
- Github (Enterprise) Build Triggers + GitHub (Enterprise) Build Triggers

- If enabled, users can setup Github or Github Enterprise triggers to invoke Registry builds. + If enabled, users can setup GitHub or GitHub Enterprise triggers to invoke Registry builds.

- Note: A registered Github (Enterprise) OAuth application (separate from Github Authentication) is required. + Note: A registered GitHub (Enterprise) OAuth application (separate from GitHub Authentication) is required. View instructions on how to - + Create an OAuth Application in GitHub

@@ -492,21 +492,21 @@
- +
- + - + @@ -534,7 +534,7 @@
Github:GitHub:
Github Endpoint:GitHub Endpoint:
- The Github Enterprise endpoint. Must start with http:// or https://. + The GitHub Enterprise endpoint. Must start with http:// or https://.
-
+
diff --git a/static/directives/cor-tab-panel.html b/static/directives/cor-tab-panel.html index 57f9dfa1c..f92d683ab 100644 --- a/static/directives/cor-tab-panel.html +++ b/static/directives/cor-tab-panel.html @@ -1,3 +1,3 @@
-
+
\ No newline at end of file diff --git a/static/directives/dockerfile-build-form.html b/static/directives/dockerfile-build-form.html index 4dfba4e08..6278bd940 100644 --- a/static/directives/dockerfile-build-form.html +++ b/static/directives/dockerfile-build-form.html @@ -1,8 +1,8 @@
-
+
-
+
Uploading file {{ upload_file }}
@@ -10,7 +10,7 @@
-
+
diff --git a/static/directives/loading-status.html b/static/directives/loading-status.html index 9ed712459..1776b5235 100644 --- a/static/directives/loading-status.html +++ b/static/directives/loading-status.html @@ -1,4 +1,4 @@ -
+
diff --git a/static/directives/logs-view.html b/static/directives/logs-view.html index cc3c51d2f..28fc8edb0 100644 --- a/static/directives/logs-view.html +++ b/static/directives/logs-view.html @@ -1,6 +1,6 @@
-
+
Usage Logs @@ -20,9 +20,7 @@
-
- -
+
diff --git a/static/directives/notification-view.html b/static/directives/notification-view.html index ef0f85de2..6b9dda7a3 100644 --- a/static/directives/notification-view.html +++ b/static/directives/notification-view.html @@ -1,5 +1,5 @@
-
+
diff --git a/static/directives/ps-usage-graph.html b/static/directives/ps-usage-graph.html new file mode 100644 index 000000000..90c67c22b --- /dev/null +++ b/static/directives/ps-usage-graph.html @@ -0,0 +1,75 @@ +
+ +
+
+ Cannot load build system status. Please restart your container. +
+
+
+

Build Queue

+
+ Running Jobs: {{ data.build.running_total }} | Total Jobs: {{ data.build.job_total }} +
+
+
+ +
+

Local Build Workers

+
+ Local Workers: {{ data.build.workers }} | Working: {{ data.build.running_local }} +
+
+
+
+
+ + +
+

CPU Usage %

+
+
+ +
+

Process Count

+
+
+ +
+

Virtual Memory %

+
+
+ +
+

Swap Memory

+
+
+ +
+

Network Connections

+
+
+ +
+

Network Usage (Bytes)

+
+
+
\ No newline at end of file diff --git a/static/directives/realtime-area-chart.html b/static/directives/realtime-area-chart.html new file mode 100644 index 000000000..d42d46784 --- /dev/null +++ b/static/directives/realtime-area-chart.html @@ -0,0 +1,6 @@ +
+
+
+
+
+
\ No newline at end of file diff --git a/static/directives/realtime-line-chart.html b/static/directives/realtime-line-chart.html new file mode 100644 index 000000000..74e8f748c --- /dev/null +++ b/static/directives/realtime-line-chart.html @@ -0,0 +1,6 @@ +
+
+
+
+
+
\ No newline at end of file diff --git a/static/directives/robots-manager.html b/static/directives/robots-manager.html index 6c9dd8fdd..b4bc89cab 100644 --- a/static/directives/robots-manager.html +++ b/static/directives/robots-manager.html @@ -2,7 +2,7 @@
Robot accounts allow for delegating access in multiple repositories to role-based accounts that you manage
-
+
diff --git a/static/js/app.js b/static/js/app.js index 6b936a302..43fa6fc5c 100644 --- a/static/js/app.js +++ b/static/js/app.js @@ -6612,6 +6612,54 @@ quayApp.directive('locationView', function () { }); +quayApp.directive('psUsageGraph', function () { + var directiveDefinitionObject = { + priority: 0, + templateUrl: '/static/directives/ps-usage-graph.html', + replace: false, + transclude: false, + restrict: 'C', + scope: { + 'isEnabled': '=isEnabled' + }, + controller: function($scope, $element) { + $scope.counter = -1; + $scope.data = null; + + var source = null; + + var connect = function() { + if (source) { return; } + source = new EventSource('/realtime/ps'); + source.onmessage = function(e) { + $scope.$apply(function() { + $scope.counter++; + $scope.data = JSON.parse(e.data); + }); + }; + }; + + var disconnect = function() { + if (!source) { return; } + source.close(); + source = null; + }; + + $scope.$watch('isEnabled', function(value) { + if (value) { + connect(); + } else { + disconnect(); + } + }); + + $scope.$on("$destroy", disconnect); + } + }; + return directiveDefinitionObject; +}); + + quayApp.directive('avatar', function () { var directiveDefinitionObject = { priority: 0, diff --git a/static/js/controllers/superuser.js b/static/js/controllers/superuser.js index ddaee7d5c..f867cd43b 100644 --- a/static/js/controllers/superuser.js +++ b/static/js/controllers/superuser.js @@ -17,6 +17,11 @@ function SuperUserAdminCtrl($scope, $timeout, ApiService, Features, UserService, $scope.pollChannel = null; $scope.logsScrolled = false; $scope.csrf_token = encodeURIComponent(window.__token); + $scope.dashboardActive = false; + + $scope.setDashboardActive = function(active) { + $scope.dashboardActive = active; + }; $scope.configurationSaved = function() { $scope.requiresRestart = true; diff --git a/static/js/core-config-setup.js b/static/js/core-config-setup.js index cd7d9b356..569169201 100644 --- a/static/js/core-config-setup.js +++ b/static/js/core-config-setup.js @@ -205,6 +205,10 @@ angular.module("core-config-setup", ['angularFileUpload']) }; var getKey = function(config, path) { + if (!config) { + return null; + } + var parts = path.split('.'); var current = config; for (var i = 0; i < parts.length; ++i) { @@ -303,10 +307,10 @@ angular.module("core-config-setup", ['angularFileUpload']) if (!value) { return; } ApiService.scGetConfig().then(function(resp) { - $scope.config = resp['config']; + $scope.config = resp['config'] || {}; initializeMappedLogic($scope.config); $scope.mapped['$hasChanges'] = false; - }); + }, ApiService.errorDisplay('Could not load config')); }); } }; diff --git a/static/js/core-ui.js b/static/js/core-ui.js index fc1ea029c..ed5e982e5 100644 --- a/static/js/core-ui.js +++ b/static/js/core-ui.js @@ -270,9 +270,18 @@ angular.module("core-ui", []) 'tabActive': '@tabActive', 'tabTitle': '@tabTitle', 'tabTarget': '@tabTarget', - 'tabInit': '&tabInit' + 'tabInit': '&tabInit', + 'tabShown': '&tabShown', + 'tabHidden': '&tabHidden' }, controller: function($rootScope, $scope, $element) { + $element.find('a[data-toggle="tab"]').on('hidden.bs.tab', function (e) { + $scope.tabHidden({}); + }); + + $element.find('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { + $scope.tabShown({}); + }); } }; return directiveDefinitionObject; @@ -297,6 +306,236 @@ angular.module("core-ui", []) return directiveDefinitionObject; }) + .directive('realtimeAreaChart', function () { + var directiveDefinitionObject = { + priority: 0, + templateUrl: '/static/directives/realtime-area-chart.html', + replace: false, + transclude: false, + restrict: 'C', + scope: { + 'data': '=data', + 'labels': '=labels', + 'colors': '=colors', + 'counter': '=counter' + }, + controller: function($scope, $element) { + var graph = null; + var series = []; + var palette = new Rickshaw.Color.Palette( { scheme: 'spectrum14' } ); + var colors = $scope.colors || []; + + var setupGraph = function() { + for (var i = 0; i < $scope.labels.length; ++i) { + series.push({ + name: $scope.labels[i], + color: i >= colors.length ? palette.color(): $scope.colors[i], + stroke: 'rgba(0,0,0,0.15)', + data: [] + }); + } + + var options = { + element: $element.find('.chart')[0], + renderer: 'area', + stroke: true, + series: series, + min: 0, + padding: { + 'top': 0.3, + 'left': 0, + 'right': 0, + 'bottom': 0.3 + } + }; + + if ($scope.minimum != null) { + options['min'] = $scope.minimum == 'auto' ? 'auto' : $scope.minimum * 1; + } else { + options['min'] = 0; + } + + if ($scope.maximum != null) { + options['max'] = $scope.maximum == 'auto' ? 'auto' : $scope.maximum * 1; + } + + graph = new Rickshaw.Graph(options); + + xaxes = new Rickshaw.Graph.Axis.Time({ + graph: graph, + timeFixture: new Rickshaw.Fixtures.Time.Local() + }); + + yaxes = new Rickshaw.Graph.Axis.Y({ + graph: graph, + tickFormat: Rickshaw.Fixtures.Number.formatKMBT + }); + + hoverDetail = new Rickshaw.Graph.HoverDetail({ + graph: graph, + xFormatter: function(x) { + return new Date(x * 1000).toString(); + } + }); + }; + + var refresh = function(data) { + if (!data || $scope.counter < 0) { return; } + if (!graph) { + setupGraph(); + } + + var timecode = new Date().getTime() / 1000; + for (var i = 0; i < $scope.data.length; ++i) { + var arr = series[i].data; + arr.push( + {'x': timecode, 'y': $scope.data[i] } + ); + + if (arr.length > 10) { + series[i].data = arr.slice(arr.length - 10, arr.length); + } + } + + graph.renderer.unstack = true; + graph.update(); + }; + + $scope.$watch('counter', function() { + refresh($scope.data_raw); + }); + + $scope.$watch('data', function(data) { + $scope.data_raw = data; + refresh($scope.data_raw); + }); + } + }; + return directiveDefinitionObject; + }) + + + .directive('realtimeLineChart', function () { + var directiveDefinitionObject = { + priority: 0, + templateUrl: '/static/directives/realtime-line-chart.html', + replace: false, + transclude: false, + restrict: 'C', + scope: { + 'data': '=data', + 'labels': '=labels', + 'counter': '=counter', + 'labelTemplate': '@labelTemplate', + 'minimum': '@minimum', + 'maximum': '@maximum' + }, + controller: function($scope, $element) { + var graph = null; + var xaxes = null; + var yaxes = null; + var hoverDetail = null; + var series = []; + var counter = 0; + var palette = new Rickshaw.Color.Palette( { scheme: 'spectrum14' } ); + + var setupGraph = function() { + var options = { + element: $element.find('.chart')[0], + renderer: 'line', + series: series, + padding: { + 'top': 0.3, + 'left': 0, + 'right': 0, + 'bottom': 0.3 + } + }; + + if ($scope.minimum != null) { + options['min'] = $scope.minimum == 'auto' ? 'auto' : $scope.minimum * 1; + } else { + options['min'] = 0; + } + + if ($scope.maximum != null) { + options['max'] = $scope.maximum == 'auto' ? 'auto' : $scope.maximum * 1; + } + + graph = new Rickshaw.Graph(options); + xaxes = new Rickshaw.Graph.Axis.Time({ + graph: graph, + timeFixture: new Rickshaw.Fixtures.Time.Local() + }); + + yaxes = new Rickshaw.Graph.Axis.Y({ + graph: graph, + tickFormat: Rickshaw.Fixtures.Number.formatKMBT + }); + + hoverDetail = new Rickshaw.Graph.HoverDetail({ + graph: graph, + xFormatter: function(x) { + return new Date(x * 1000).toString(); + } + }); + }; + + var refresh = function(data) { + if (data == null) { return; } + if (!graph) { + setupGraph(); + } + + if (typeof data == 'number') { + data = [data]; + } + + if ($scope.labels) { + data = data.slice(0, $scope.labels.length); + } + + if (series.length == 0){ + for (var i = 0; i < data.length; ++i) { + var title = $scope.labels ? $scope.labels[i] : $scope.labelTemplate.replace('{x}', i + 1); + series.push({ + 'color': palette.color(), + 'data': [], + 'name': title + }) + } + } + + counter++; + var timecode = new Date().getTime() / 1000; + + for (var i = 0; i < data.length; ++i) { + var arr = series[i].data; + arr.push({ + 'x': timecode, + 'y': data[i] + }) + + if (arr.length > 10) { + series[i].data = arr.slice(arr.length - 10, arr.length); + } + } + + graph.update(); + }; + + $scope.$watch('counter', function(counter) { + refresh($scope.data_raw); + }); + + $scope.$watch('data', function(data) { + $scope.data_raw = data; + }); + } + }; + return directiveDefinitionObject; + }) + .directive('corStepBar', function() { var directiveDefinitionObject = { priority: 4, diff --git a/static/lib/rickshaw.min.css b/static/lib/rickshaw.min.css new file mode 100644 index 000000000..d1b32d8eb --- /dev/null +++ b/static/lib/rickshaw.min.css @@ -0,0 +1 @@ +.rickshaw_graph .detail{pointer-events:none;position:absolute;top:0;z-index:2;background:rgba(0,0,0,.1);bottom:0;width:1px;transition:opacity .25s linear;-moz-transition:opacity .25s linear;-o-transition:opacity .25s linear;-webkit-transition:opacity .25s linear}.rickshaw_graph .detail.inactive{opacity:0}.rickshaw_graph .detail .item.active{opacity:1}.rickshaw_graph .detail .x_label{font-family:Arial,sans-serif;border-radius:3px;padding:6px;opacity:.5;border:1px solid #e0e0e0;font-size:12px;position:absolute;background:#fff;white-space:nowrap}.rickshaw_graph .detail .x_label.left{left:0}.rickshaw_graph .detail .x_label.right{right:0}.rickshaw_graph .detail .item{position:absolute;z-index:2;border-radius:3px;padding:.25em;font-size:12px;font-family:Arial,sans-serif;opacity:0;background:rgba(0,0,0,.4);color:#fff;border:1px solid rgba(0,0,0,.4);margin-left:1em;margin-right:1em;margin-top:-1em;white-space:nowrap}.rickshaw_graph .detail .item.left{left:0}.rickshaw_graph .detail .item.right{right:0}.rickshaw_graph .detail .item.active{opacity:1;background:rgba(0,0,0,.8)}.rickshaw_graph .detail .item:after{position:absolute;display:block;width:0;height:0;content:"";border:5px solid transparent}.rickshaw_graph .detail .item.left:after{top:1em;left:-5px;margin-top:-5px;border-right-color:rgba(0,0,0,.8);border-left-width:0}.rickshaw_graph .detail .item.right:after{top:1em;right:-5px;margin-top:-5px;border-left-color:rgba(0,0,0,.8);border-right-width:0}.rickshaw_graph .detail .dot{width:4px;height:4px;margin-left:-3px;margin-top:-3.5px;border-radius:5px;position:absolute;box-shadow:0 0 2px rgba(0,0,0,.6);box-sizing:content-box;-moz-box-sizing:content-box;background:#fff;border-width:2px;border-style:solid;display:none;background-clip:padding-box}.rickshaw_graph .detail .dot.active{display:block}.rickshaw_graph{position:relative}.rickshaw_graph svg{display:block;overflow:hidden}.rickshaw_graph .x_tick{position:absolute;top:0;bottom:0;width:0;border-left:1px dotted rgba(0,0,0,.2);pointer-events:none}.rickshaw_graph .x_tick .title{position:absolute;font-size:12px;font-family:Arial,sans-serif;opacity:.5;white-space:nowrap;margin-left:3px;bottom:1px}.rickshaw_annotation_timeline{height:1px;border-top:1px solid #e0e0e0;margin-top:10px;position:relative}.rickshaw_annotation_timeline .annotation{position:absolute;height:6px;width:6px;margin-left:-2px;top:-3px;border-radius:5px;background-color:rgba(0,0,0,.25)}.rickshaw_graph .annotation_line{position:absolute;top:0;bottom:-6px;width:0;border-left:2px solid rgba(0,0,0,.3);display:none}.rickshaw_graph .annotation_line.active{display:block}.rickshaw_graph .annotation_range{background:rgba(0,0,0,.1);display:none;position:absolute;top:0;bottom:-6px}.rickshaw_graph .annotation_range.active{display:block}.rickshaw_graph .annotation_range.active.offscreen{display:none}.rickshaw_annotation_timeline .annotation .content{background:#fff;color:#000;opacity:.9;padding:5px;box-shadow:0 0 2px rgba(0,0,0,.8);border-radius:3px;position:relative;z-index:20;font-size:12px;padding:6px 8px 8px;top:18px;left:-11px;width:160px;display:none;cursor:pointer}.rickshaw_annotation_timeline .annotation .content:before{content:"\25b2";position:absolute;top:-11px;color:#fff;text-shadow:0 -1px 1px rgba(0,0,0,.8)}.rickshaw_annotation_timeline .annotation.active,.rickshaw_annotation_timeline .annotation:hover{background-color:rgba(0,0,0,.8);cursor:none}.rickshaw_annotation_timeline .annotation .content:hover{z-index:50}.rickshaw_annotation_timeline .annotation.active .content{display:block}.rickshaw_annotation_timeline .annotation:hover .content{display:block;z-index:50}.rickshaw_graph .y_axis,.rickshaw_graph .x_axis_d3{fill:none}.rickshaw_graph .y_ticks .tick line,.rickshaw_graph .x_ticks_d3 .tick{stroke:rgba(0,0,0,.16);stroke-width:2px;shape-rendering:crisp-edges;pointer-events:none}.rickshaw_graph .y_grid .tick,.rickshaw_graph .x_grid_d3 .tick{z-index:-1;stroke:rgba(0,0,0,.2);stroke-width:1px;stroke-dasharray:1 1}.rickshaw_graph .y_grid .tick[data-y-value="0"]{stroke-dasharray:1 0}.rickshaw_graph .y_grid path,.rickshaw_graph .x_grid_d3 path{fill:none;stroke:none}.rickshaw_graph .y_ticks path,.rickshaw_graph .x_ticks_d3 path{fill:none;stroke:gray}.rickshaw_graph .y_ticks text,.rickshaw_graph .x_ticks_d3 text{opacity:.5;font-size:12px;pointer-events:none}.rickshaw_graph .x_tick.glow .title,.rickshaw_graph .y_ticks.glow text{fill:#000;color:#000;text-shadow:-1px 1px 0 rgba(255,255,255,.1),1px -1px 0 rgba(255,255,255,.1),1px 1px 0 rgba(255,255,255,.1),0 1px 0 rgba(255,255,255,.1),0 -1px 0 rgba(255,255,255,.1),1px 0 0 rgba(255,255,255,.1),-1px 0 0 rgba(255,255,255,.1),-1px -1px 0 rgba(255,255,255,.1)}.rickshaw_graph .x_tick.inverse .title,.rickshaw_graph .y_ticks.inverse text{fill:#fff;color:#fff;text-shadow:-1px 1px 0 rgba(0,0,0,.8),1px -1px 0 rgba(0,0,0,.8),1px 1px 0 rgba(0,0,0,.8),0 1px 0 rgba(0,0,0,.8),0 -1px 0 rgba(0,0,0,.8),1px 0 0 rgba(0,0,0,.8),-1px 0 0 rgba(0,0,0,.8),-1px -1px 0 rgba(0,0,0,.8)}.rickshaw_legend{font-family:Arial;font-size:12px;color:#fff;background:#404040;display:inline-block;padding:12px 5px;border-radius:2px;position:relative}.rickshaw_legend:hover{z-index:10}.rickshaw_legend .swatch{width:10px;height:10px;border:1px solid rgba(0,0,0,.2)}.rickshaw_legend .line{clear:both;line-height:140%;padding-right:15px}.rickshaw_legend .line .swatch{display:inline-block;margin-right:3px;border-radius:2px}.rickshaw_legend .label{margin:0;white-space:nowrap;display:inline;font-size:inherit;background-color:transparent;color:inherit;font-weight:400;line-height:normal;padding:0;text-shadow:none}.rickshaw_legend .action:hover{opacity:.6}.rickshaw_legend .action{margin-right:.2em;font-size:10px;opacity:.2;cursor:pointer;font-size:14px}.rickshaw_legend .line.disabled{opacity:.4}.rickshaw_legend ul{list-style-type:none;margin:0;padding:0;margin:2px;cursor:pointer}.rickshaw_legend li{padding:0 0 0 2px;min-width:80px;white-space:nowrap}.rickshaw_legend li:hover{background:rgba(255,255,255,.08);border-radius:3px}.rickshaw_legend li:active{background:rgba(255,255,255,.2);border-radius:3px} \ No newline at end of file diff --git a/static/lib/rickshaw.min.js b/static/lib/rickshaw.min.js new file mode 100644 index 000000000..bd5769912 --- /dev/null +++ b/static/lib/rickshaw.min.js @@ -0,0 +1,3 @@ +(function(root,factory){if(typeof define==="function"&&define.amd){define(["d3"],function(d3){return root.Rickshaw=factory(d3)})}else if(typeof exports==="object"){module.exports=factory(require("d3"))}else{root.Rickshaw=factory(d3)}})(this,function(d3){var Rickshaw={namespace:function(namespace,obj){var parts=namespace.split(".");var parent=Rickshaw;for(var i=1,length=parts.length;i0){var x=s.data[0].x;var y=s.data[0].y;if(typeof x!="number"||typeof y!="number"&&y!==null){throw"x and y properties of points should be numbers instead of "+typeof x+" and "+typeof y}}if(s.data.length>=3){if(s.data[2].xthis.window.xMax)isInRange=false;return isInRange}return true};this.onUpdate=function(callback){this.updateCallbacks.push(callback)};this.onConfigure=function(callback){this.configureCallbacks.push(callback)};this.registerRenderer=function(renderer){this._renderers=this._renderers||{};this._renderers[renderer.name]=renderer};this.configure=function(args){this.config=this.config||{};if(args.width||args.height){this.setSize(args)}Rickshaw.keys(this.defaults).forEach(function(k){this.config[k]=k in args?args[k]:k in this?this[k]:this.defaults[k]},this);Rickshaw.keys(this.config).forEach(function(k){this[k]=this.config[k]},this);if("stack"in args)args.unstack=!args.stack;var renderer=args.renderer||this.renderer&&this.renderer.name||"stack";this.setRenderer(renderer,args);this.configureCallbacks.forEach(function(callback){callback(args)})};this.setRenderer=function(r,args){if(typeof r=="function"){this.renderer=new r({graph:self});this.registerRenderer(this.renderer)}else{if(!this._renderers[r]){throw"couldn't find renderer "+r}this.renderer=this._renderers[r]}if(typeof args=="object"){this.renderer.configure(args)}};this.setSize=function(args){args=args||{};if(typeof window!==undefined){var style=window.getComputedStyle(this.element,null);var elementWidth=parseInt(style.getPropertyValue("width"),10);var elementHeight=parseInt(style.getPropertyValue("height"),10)}this.width=args.width||elementWidth||400;this.height=args.height||elementHeight||250;this.vis&&this.vis.attr("width",this.width).attr("height",this.height)};this.initialize(args)};Rickshaw.namespace("Rickshaw.Fixtures.Color");Rickshaw.Fixtures.Color=function(){this.schemes={};this.schemes.spectrum14=["#ecb796","#dc8f70","#b2a470","#92875a","#716c49","#d2ed82","#bbe468","#a1d05d","#e7cbe6","#d8aad6","#a888c2","#9dc2d3","#649eb9","#387aa3"].reverse();this.schemes.spectrum2000=["#57306f","#514c76","#646583","#738394","#6b9c7d","#84b665","#a7ca50","#bfe746","#e2f528","#fff726","#ecdd00","#d4b11d","#de8800","#de4800","#c91515","#9a0000","#7b0429","#580839","#31082b"];this.schemes.spectrum2001=["#2f243f","#3c2c55","#4a3768","#565270","#6b6b7c","#72957f","#86ad6e","#a1bc5e","#b8d954","#d3e04e","#ccad2a","#cc8412","#c1521d","#ad3821","#8a1010","#681717","#531e1e","#3d1818","#320a1b"];this.schemes.classic9=["#423d4f","#4a6860","#848f39","#a2b73c","#ddcb53","#c5a32f","#7d5836","#963b20","#7c2626","#491d37","#2f254a"].reverse();this.schemes.httpStatus={503:"#ea5029",502:"#d23f14",500:"#bf3613",410:"#efacea",409:"#e291dc",403:"#f457e8",408:"#e121d2",401:"#b92dae",405:"#f47ceb",404:"#a82a9f",400:"#b263c6",301:"#6fa024",302:"#87c32b",307:"#a0d84c",304:"#28b55c",200:"#1a4f74",206:"#27839f",201:"#52adc9",202:"#7c979f",203:"#a5b8bd",204:"#c1cdd1"};this.schemes.colorwheel=["#b5b6a9","#858772","#785f43","#96557e","#4682b4","#65b9ac","#73c03a","#cb513a"].reverse();this.schemes.cool=["#5e9d2f","#73c03a","#4682b4","#7bc3b8","#a9884e","#c1b266","#a47493","#c09fb5"];this.schemes.munin=["#00cc00","#0066b3","#ff8000","#ffcc00","#330099","#990099","#ccff00","#ff0000","#808080","#008f00","#00487d","#b35a00","#b38f00","#6b006b","#8fb300","#b30000","#bebebe","#80ff80","#80c9ff","#ffc080","#ffe680","#aa80ff","#ee00cc","#ff8080","#666600","#ffbfff","#00ffcc","#cc6699","#999900"]};Rickshaw.namespace("Rickshaw.Fixtures.RandomData");Rickshaw.Fixtures.RandomData=function(timeInterval){var addData;timeInterval=timeInterval||1;var lastRandomValue=200;var timeBase=Math.floor((new Date).getTime()/1e3);this.addData=function(data){var randomValue=Math.random()*100+15+lastRandomValue;var index=data[0].length;var counter=1;data.forEach(function(series){var randomVariance=Math.random()*20;var v=randomValue/25+counter++ +(Math.cos(index*counter*11/960)+2)*15+(Math.cos(index/7)+2)*7+(Math.cos(index/17)+2)*1;series.push({x:index*timeInterval+timeBase,y:v+randomVariance})});lastRandomValue=randomValue*.85};this.removeData=function(data){data.forEach(function(series){series.shift()});timeBase+=timeInterval}};Rickshaw.namespace("Rickshaw.Fixtures.Time");Rickshaw.Fixtures.Time=function(){var self=this;this.months=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];this.units=[{name:"decade",seconds:86400*365.25*10,formatter:function(d){return parseInt(d.getUTCFullYear()/10,10)*10}},{name:"year",seconds:86400*365.25,formatter:function(d){return d.getUTCFullYear()}},{name:"month",seconds:86400*30.5,formatter:function(d){return self.months[d.getUTCMonth()]}},{name:"week",seconds:86400*7,formatter:function(d){return self.formatDate(d)}},{name:"day",seconds:86400,formatter:function(d){return d.getUTCDate()}},{name:"6 hour",seconds:3600*6,formatter:function(d){return self.formatTime(d)}},{name:"hour",seconds:3600,formatter:function(d){return self.formatTime(d)}},{name:"15 minute",seconds:60*15,formatter:function(d){return self.formatTime(d)}},{name:"minute",seconds:60,formatter:function(d){return d.getUTCMinutes()}},{name:"15 second",seconds:15,formatter:function(d){return d.getUTCSeconds()+"s"}},{name:"second",seconds:1,formatter:function(d){return d.getUTCSeconds()+"s"}},{name:"decisecond",seconds:1/10,formatter:function(d){return d.getUTCMilliseconds()+"ms"}},{name:"centisecond",seconds:1/100,formatter:function(d){return d.getUTCMilliseconds()+"ms"}}];this.unit=function(unitName){return this.units.filter(function(unit){return unitName==unit.name}).shift()};this.formatDate=function(d){return d3.time.format("%b %e")(d)};this.formatTime=function(d){return d.toUTCString().match(/(\d+:\d+):/)[1]};this.ceil=function(time,unit){var date,floor,year;if(unit.name=="month"){date=new Date(time*1e3);floor=Date.UTC(date.getUTCFullYear(),date.getUTCMonth())/1e3;if(floor==time)return time;year=date.getUTCFullYear();var month=date.getUTCMonth();if(month==11){month=0;year=year+1}else{month+=1}return Date.UTC(year,month)/1e3}if(unit.name=="year"){date=new Date(time*1e3);floor=Date.UTC(date.getUTCFullYear(),0)/1e3;if(floor==time)return time;year=date.getUTCFullYear()+1;return Date.UTC(year,0)/1e3}return Math.ceil(time/unit.seconds)*unit.seconds}};Rickshaw.namespace("Rickshaw.Fixtures.Time.Local");Rickshaw.Fixtures.Time.Local=function(){var self=this;this.months=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];this.units=[{name:"decade",seconds:86400*365.25*10,formatter:function(d){return parseInt(d.getFullYear()/10,10)*10}},{name:"year",seconds:86400*365.25,formatter:function(d){return d.getFullYear()}},{name:"month",seconds:86400*30.5,formatter:function(d){return self.months[d.getMonth()]}},{name:"week",seconds:86400*7,formatter:function(d){return self.formatDate(d)}},{name:"day",seconds:86400,formatter:function(d){return d.getDate()}},{name:"6 hour",seconds:3600*6,formatter:function(d){return self.formatTime(d)}},{name:"hour",seconds:3600,formatter:function(d){return self.formatTime(d)}},{name:"15 minute",seconds:60*15,formatter:function(d){return self.formatTime(d)}},{name:"minute",seconds:60,formatter:function(d){return d.getMinutes()}},{name:"15 second",seconds:15,formatter:function(d){return d.getSeconds()+"s"}},{name:"second",seconds:1,formatter:function(d){return d.getSeconds()+"s"}},{name:"decisecond",seconds:1/10,formatter:function(d){return d.getMilliseconds()+"ms"}},{name:"centisecond",seconds:1/100,formatter:function(d){return d.getMilliseconds()+"ms"}}];this.unit=function(unitName){return this.units.filter(function(unit){return unitName==unit.name}).shift()};this.formatDate=function(d){return d3.time.format("%b %e")(d)};this.formatTime=function(d){return d.toString().match(/(\d+:\d+):/)[1]};this.ceil=function(time,unit){var date,floor,year;if(unit.name=="day"){var nearFuture=new Date((time+unit.seconds-1)*1e3);var rounded=new Date(0);rounded.setMilliseconds(0);rounded.setSeconds(0);rounded.setMinutes(0);rounded.setHours(0);rounded.setDate(nearFuture.getDate());rounded.setMonth(nearFuture.getMonth());rounded.setFullYear(nearFuture.getFullYear());return rounded.getTime()/1e3}if(unit.name=="month"){date=new Date(time*1e3);floor=new Date(date.getFullYear(),date.getMonth()).getTime()/1e3;if(floor==time)return time;year=date.getFullYear();var month=date.getMonth();if(month==11){month=0;year=year+1}else{month+=1}return new Date(year,month).getTime()/1e3}if(unit.name=="year"){date=new Date(time*1e3);floor=new Date(date.getUTCFullYear(),0).getTime()/1e3;if(floor==time)return time;year=date.getFullYear()+1;return new Date(year,0).getTime()/1e3}return Math.ceil(time/unit.seconds)*unit.seconds}};Rickshaw.namespace("Rickshaw.Fixtures.Number");Rickshaw.Fixtures.Number.formatKMBT=function(y){var abs_y=Math.abs(y);if(abs_y>=1e12){return y/1e12+"T"}else if(abs_y>=1e9){return y/1e9+"B"}else if(abs_y>=1e6){return y/1e6+"M"}else if(abs_y>=1e3){return y/1e3+"K"}else if(abs_y<1&&y>0){return y.toFixed(2)}else if(abs_y===0){return""}else{return y}};Rickshaw.Fixtures.Number.formatBase1024KMGTP=function(y){var abs_y=Math.abs(y);if(abs_y>=0x4000000000000){return y/0x4000000000000+"P"}else if(abs_y>=1099511627776){return y/1099511627776+"T"}else if(abs_y>=1073741824){return y/1073741824+"G"}else if(abs_y>=1048576){return y/1048576+"M"}else if(abs_y>=1024){return y/1024+"K"}else if(abs_y<1&&y>0){return y.toFixed(2)}else if(abs_y===0){return""}else{return y}};Rickshaw.namespace("Rickshaw.Color.Palette");Rickshaw.Color.Palette=function(args){var color=new Rickshaw.Fixtures.Color;args=args||{};this.schemes={};this.scheme=color.schemes[args.scheme]||args.scheme||color.schemes.colorwheel;this.runningIndex=0;this.generatorIndex=0;if(args.interpolatedStopCount){var schemeCount=this.scheme.length-1;var i,j,scheme=[];for(i=0;iself.graph.x.range()[1]){if(annotation.element){annotation.line.classList.add("offscreen");annotation.element.style.display="none"}annotation.boxes.forEach(function(box){if(box.rangeElement)box.rangeElement.classList.add("offscreen")});return}if(!annotation.element){var element=annotation.element=document.createElement("div");element.classList.add("annotation");this.elements.timeline.appendChild(element);element.addEventListener("click",function(e){element.classList.toggle("active");annotation.line.classList.toggle("active");annotation.boxes.forEach(function(box){if(box.rangeElement)box.rangeElement.classList.toggle("active")})},false)}annotation.element.style.left=left+"px";annotation.element.style.display="block";annotation.boxes.forEach(function(box){var element=box.element;if(!element){element=box.element=document.createElement("div");element.classList.add("content");element.innerHTML=box.content;annotation.element.appendChild(element);annotation.line=document.createElement("div");annotation.line.classList.add("annotation_line");self.graph.element.appendChild(annotation.line);if(box.end){box.rangeElement=document.createElement("div");box.rangeElement.classList.add("annotation_range");self.graph.element.appendChild(box.rangeElement)}}if(box.end){var annotationRangeStart=left;var annotationRangeEnd=Math.min(self.graph.x(box.end),self.graph.x.range()[1]);if(annotationRangeStart>annotationRangeEnd){annotationRangeEnd=left;annotationRangeStart=Math.max(self.graph.x(box.end),self.graph.x.range()[0])}var annotationRangeWidth=annotationRangeEnd-annotationRangeStart;box.rangeElement.style.left=annotationRangeStart+"px";box.rangeElement.style.width=annotationRangeWidth+"px";box.rangeElement.classList.remove("offscreen")}annotation.line.classList.remove("offscreen");annotation.line.style.left=left+"px"})},this)};this.graph.onUpdate(function(){self.update()})};Rickshaw.namespace("Rickshaw.Graph.Axis.Time");Rickshaw.Graph.Axis.Time=function(args){var self=this;this.graph=args.graph;this.elements=[];this.ticksTreatment=args.ticksTreatment||"plain";this.fixedTimeUnit=args.timeUnit;var time=args.timeFixture||new Rickshaw.Fixtures.Time;this.appropriateTimeUnit=function(){var unit;var units=time.units;var domain=this.graph.x.domain();var rangeSeconds=domain[1]-domain[0];units.forEach(function(u){if(Math.floor(rangeSeconds/u.seconds)>=2){unit=unit||u}});return unit||time.units[time.units.length-1]};this.tickOffsets=function(){var domain=this.graph.x.domain();var unit=this.fixedTimeUnit||this.appropriateTimeUnit();var count=Math.ceil((domain[1]-domain[0])/unit.seconds);var runningTick=domain[0];var offsets=[];for(var i=0;iself.graph.x.range()[1])return;var element=document.createElement("div");element.style.left=self.graph.x(o.value)+"px";element.classList.add("x_tick");element.classList.add(self.ticksTreatment);var title=document.createElement("div");title.classList.add("title");title.innerHTML=o.unit.formatter(new Date(o.value*1e3));element.appendChild(title);self.graph.element.appendChild(element);self.elements.push(element)})};this.graph.onUpdate(function(){self.render()})};Rickshaw.namespace("Rickshaw.Graph.Axis.X");Rickshaw.Graph.Axis.X=function(args){var self=this;var berthRate=.1;this.initialize=function(args){this.graph=args.graph;this.orientation=args.orientation||"top";this.pixelsPerTick=args.pixelsPerTick||75;if(args.ticks)this.staticTicks=args.ticks;if(args.tickValues)this.tickValues=args.tickValues;this.tickSize=args.tickSize||4;this.ticksTreatment=args.ticksTreatment||"plain";if(args.element){this.element=args.element;this._discoverSize(args.element,args);this.vis=d3.select(args.element).append("svg:svg").attr("height",this.height).attr("width",this.width).attr("class","rickshaw_graph x_axis_d3");this.element=this.vis[0][0];this.element.style.position="relative";this.setSize({width:args.width,height:args.height})}else{this.vis=this.graph.vis}this.graph.onUpdate(function(){self.render()})};this.setSize=function(args){args=args||{};if(!this.element)return;this._discoverSize(this.element.parentNode,args);this.vis.attr("height",this.height).attr("width",this.width*(1+berthRate));var berth=Math.floor(this.width*berthRate/2);this.element.style.left=-1*berth+"px"};this.render=function(){if(this._renderWidth!==undefined&&this.graph.width!==this._renderWidth)this.setSize({auto:true});var axis=d3.svg.axis().scale(this.graph.x).orient(this.orientation);axis.tickFormat(args.tickFormat||function(x){return x});if(this.tickValues)axis.tickValues(this.tickValues);this.ticks=this.staticTicks||Math.floor(this.graph.width/this.pixelsPerTick);var berth=Math.floor(this.width*berthRate/2)||0;var transform;if(this.orientation=="top"){var yOffset=this.height||this.graph.height;transform="translate("+berth+","+yOffset+")"}else{transform="translate("+berth+", 0)"}if(this.element){this.vis.selectAll("*").remove()}this.vis.append("svg:g").attr("class",["x_ticks_d3",this.ticksTreatment].join(" ")).attr("transform",transform).call(axis.ticks(this.ticks).tickSubdivide(0).tickSize(this.tickSize));var gridSize=(this.orientation=="bottom"?1:-1)*this.graph.height;this.graph.vis.append("svg:g").attr("class","x_grid_d3").call(axis.ticks(this.ticks).tickSubdivide(0).tickSize(gridSize)).selectAll("text").each(function(){this.parentNode.setAttribute("data-x-value",this.textContent)});this._renderHeight=this.graph.height};this._discoverSize=function(element,args){if(typeof window!=="undefined"){var style=window.getComputedStyle(element,null);var elementHeight=parseInt(style.getPropertyValue("height"),10);if(!args.auto){var elementWidth=parseInt(style.getPropertyValue("width"),10)}}this.width=(args.width||elementWidth||this.graph.width)*(1+berthRate);this.height=args.height||elementHeight||40};this.initialize(args)};Rickshaw.namespace("Rickshaw.Graph.Axis.Y");Rickshaw.Graph.Axis.Y=Rickshaw.Class.create({initialize:function(args){this.graph=args.graph;this.orientation=args.orientation||"right";this.pixelsPerTick=args.pixelsPerTick||75;if(args.ticks)this.staticTicks=args.ticks;if(args.tickValues)this.tickValues=args.tickValues;this.tickSize=args.tickSize||4;this.ticksTreatment=args.ticksTreatment||"plain";this.tickFormat=args.tickFormat||function(y){return y};this.berthRate=.1;if(args.element){this.element=args.element;this.vis=d3.select(args.element).append("svg:svg").attr("class","rickshaw_graph y_axis");this.element=this.vis[0][0];this.element.style.position="relative";this.setSize({width:args.width,height:args.height})}else{this.vis=this.graph.vis}var self=this;this.graph.onUpdate(function(){self.render()})},setSize:function(args){args=args||{};if(!this.element)return;if(typeof window!=="undefined"){var style=window.getComputedStyle(this.element.parentNode,null);var elementWidth=parseInt(style.getPropertyValue("width"),10);if(!args.auto){var elementHeight=parseInt(style.getPropertyValue("height"),10)}}this.width=args.width||elementWidth||this.graph.width*this.berthRate;this.height=args.height||elementHeight||this.graph.height;this.vis.attr("width",this.width).attr("height",this.height*(1+this.berthRate));var berth=this.height*this.berthRate;if(this.orientation=="left"){this.element.style.top=-1*berth+"px"}},render:function(){if(this._renderHeight!==undefined&&this.graph.height!==this._renderHeight)this.setSize({auto:true});this.ticks=this.staticTicks||Math.floor(this.graph.height/this.pixelsPerTick);var axis=this._drawAxis(this.graph.y);this._drawGrid(axis);this._renderHeight=this.graph.height},_drawAxis:function(scale){var axis=d3.svg.axis().scale(scale).orient(this.orientation);axis.tickFormat(this.tickFormat);if(this.tickValues)axis.tickValues(this.tickValues);if(this.orientation=="left"){var berth=this.height*this.berthRate;var transform="translate("+this.width+", "+berth+")"}if(this.element){this.vis.selectAll("*").remove()}this.vis.append("svg:g").attr("class",["y_ticks",this.ticksTreatment].join(" ")).attr("transform",transform).call(axis.ticks(this.ticks).tickSubdivide(0).tickSize(this.tickSize));return axis},_drawGrid:function(axis){var gridSize=(this.orientation=="right"?1:-1)*this.graph.width;this.graph.vis.append("svg:g").attr("class","y_grid").call(axis.ticks(this.ticks).tickSubdivide(0).tickSize(gridSize)).selectAll("text").each(function(){this.parentNode.setAttribute("data-y-value",this.textContent) +})}});Rickshaw.namespace("Rickshaw.Graph.Axis.Y.Scaled");Rickshaw.Graph.Axis.Y.Scaled=Rickshaw.Class.create(Rickshaw.Graph.Axis.Y,{initialize:function($super,args){if(typeof args.scale==="undefined"){throw new Error("Scaled requires scale")}this.scale=args.scale;if(typeof args.grid==="undefined"){this.grid=true}else{this.grid=args.grid}$super(args)},_drawAxis:function($super,scale){var domain=this.scale.domain();var renderDomain=this.graph.renderer.domain().y;var extents=[Math.min.apply(Math,domain),Math.max.apply(Math,domain)];var extentMap=d3.scale.linear().domain([0,1]).range(extents);var adjExtents=[extentMap(renderDomain[0]),extentMap(renderDomain[1])];var adjustment=d3.scale.linear().domain(extents).range(adjExtents);var adjustedScale=this.scale.copy().domain(domain.map(adjustment)).range(scale.range());return $super(adjustedScale)},_drawGrid:function($super,axis){if(this.grid){$super(axis)}}});Rickshaw.namespace("Rickshaw.Graph.Behavior.Series.Highlight");Rickshaw.Graph.Behavior.Series.Highlight=function(args){this.graph=args.graph;this.legend=args.legend;var self=this;var colorSafe={};var activeLine=null;var disabledColor=args.disabledColor||function(seriesColor){return d3.interpolateRgb(seriesColor,d3.rgb("#d8d8d8"))(.8).toString()};this.addHighlightEvents=function(l){l.element.addEventListener("mouseover",function(e){if(activeLine)return;else activeLine=l;self.legend.lines.forEach(function(line){if(l===line){if(self.graph.renderer.unstack&&(line.series.renderer?line.series.renderer.unstack:true)){var seriesIndex=self.graph.series.indexOf(line.series);line.originalIndex=seriesIndex;var series=self.graph.series.splice(seriesIndex,1)[0];self.graph.series.push(series)}return}colorSafe[line.series.name]=colorSafe[line.series.name]||line.series.color;line.series.color=disabledColor(line.series.color)});self.graph.update()},false);l.element.addEventListener("mouseout",function(e){if(!activeLine)return;else activeLine=null;self.legend.lines.forEach(function(line){if(l===line&&line.hasOwnProperty("originalIndex")){var series=self.graph.series.pop();self.graph.series.splice(line.originalIndex,0,series);delete line.originalIndex}if(colorSafe[line.series.name]){line.series.color=colorSafe[line.series.name]}});self.graph.update()},false)};if(this.legend){this.legend.lines.forEach(function(l){self.addHighlightEvents(l)})}};Rickshaw.namespace("Rickshaw.Graph.Behavior.Series.Order");Rickshaw.Graph.Behavior.Series.Order=function(args){this.graph=args.graph;this.legend=args.legend;var self=this;if(typeof window.jQuery=="undefined"){throw"couldn't find jQuery at window.jQuery"}if(typeof window.jQuery.ui=="undefined"){throw"couldn't find jQuery UI at window.jQuery.ui"}jQuery(function(){jQuery(self.legend.list).sortable({containment:"parent",tolerance:"pointer",update:function(event,ui){var series=[];jQuery(self.legend.list).find("li").each(function(index,item){if(!item.series)return;series.push(item.series)});for(var i=self.graph.series.length-1;i>=0;i--){self.graph.series[i]=series.shift()}self.graph.update()}});jQuery(self.legend.list).disableSelection()});this.graph.onUpdate(function(){var h=window.getComputedStyle(self.legend.element).height;self.legend.element.style.height=h})};Rickshaw.namespace("Rickshaw.Graph.Behavior.Series.Toggle");Rickshaw.Graph.Behavior.Series.Toggle=function(args){this.graph=args.graph;this.legend=args.legend;var self=this;this.addAnchor=function(line){var anchor=document.createElement("a");anchor.innerHTML="✔";anchor.classList.add("action");line.element.insertBefore(anchor,line.element.firstChild);anchor.onclick=function(e){if(line.series.disabled){line.series.enable();line.element.classList.remove("disabled")}else{if(this.graph.series.filter(function(s){return!s.disabled}).length<=1)return;line.series.disable();line.element.classList.add("disabled")}self.graph.update()}.bind(this);var label=line.element.getElementsByTagName("span")[0];label.onclick=function(e){var disableAllOtherLines=line.series.disabled;if(!disableAllOtherLines){for(var i=0;idomainX){dataIndex=Math.abs(domainX-data[i].x)0){alignables.forEach(function(el){el.classList.remove("left");el.classList.add("right")});var rightAlignError=this._calcLayoutError(alignables);if(rightAlignError>leftAlignError){alignables.forEach(function(el){el.classList.remove("right");el.classList.add("left")})}}if(typeof this.onRender=="function"){this.onRender(args)}},_calcLayoutError:function(alignables){var parentRect=this.element.parentNode.getBoundingClientRect();var error=0;var alignRight=alignables.forEach(function(el){var rect=el.getBoundingClientRect();if(!rect.width){return}if(rect.right>parentRect.right){error+=rect.right-parentRect.right}if(rect.left=self.previewWidth){frameAfterDrag[0]-=frameAfterDrag[1]-self.previewWidth;frameAfterDrag[1]=self.previewWidth}}self.graphs.forEach(function(graph){var domainScale=d3.scale.linear().interpolate(d3.interpolateNumber).domain([0,self.previewWidth]).range(graph.dataDomain());var windowAfterDrag=[domainScale(frameAfterDrag[0]),domainScale(frameAfterDrag[1])];self.slideCallbacks.forEach(function(callback){callback(graph,windowAfterDrag[0],windowAfterDrag[1])});if(frameAfterDrag[0]===0){windowAfterDrag[0]=undefined}if(frameAfterDrag[1]===self.previewWidth){windowAfterDrag[1]=undefined}graph.window.xMin=windowAfterDrag[0];graph.window.xMax=windowAfterDrag[1];graph.update()})}function onMousedown(){drag.target=d3.event.target;drag.start=self._getClientXFromEvent(d3.event,drag);self.frameBeforeDrag=self.currentFrame.slice();d3.event.preventDefault?d3.event.preventDefault():d3.event.returnValue=false;d3.select(document).on("mousemove.rickshaw_range_slider_preview",onMousemove);d3.select(document).on("mouseup.rickshaw_range_slider_preview",onMouseup);d3.select(document).on("touchmove.rickshaw_range_slider_preview",onMousemove);d3.select(document).on("touchend.rickshaw_range_slider_preview",onMouseup);d3.select(document).on("touchcancel.rickshaw_range_slider_preview",onMouseup)}function onMousedownLeftHandle(datum,index){drag.left=true;onMousedown()}function onMousedownRightHandle(datum,index){drag.right=true;onMousedown()}function onMousedownMiddleHandle(datum,index){drag.left=true;drag.right=true;drag.rigid=true;onMousedown()}function onMouseup(datum,index){d3.select(document).on("mousemove.rickshaw_range_slider_preview",null);d3.select(document).on("mouseup.rickshaw_range_slider_preview",null);d3.select(document).on("touchmove.rickshaw_range_slider_preview",null);d3.select(document).on("touchend.rickshaw_range_slider_preview",null);d3.select(document).on("touchcancel.rickshaw_range_slider_preview",null);delete self.frameBeforeDrag;drag.left=false;drag.right=false;drag.rigid=false}element.select("rect.left_handle").on("mousedown",onMousedownLeftHandle);element.select("rect.right_handle").on("mousedown",onMousedownRightHandle);element.select("rect.middle_handle").on("mousedown",onMousedownMiddleHandle);element.select("rect.left_handle").on("touchstart",onMousedownLeftHandle);element.select("rect.right_handle").on("touchstart",onMousedownRightHandle);element.select("rect.middle_handle").on("touchstart",onMousedownMiddleHandle)},_getClientXFromEvent:function(event,drag){switch(event.type){case"touchstart":case"touchmove":var touchList=event.changedTouches;var touch=null;for(var touchIndex=0;touchIndexyMax)yMax=y});if(!series.length)return;if(series[0].xxMax)xMax=series[series.length-1].x});xMin-=(xMax-xMin)*this.padding.left;xMax+=(xMax-xMin)*this.padding.right;yMin=this.graph.min==="auto"?yMin:this.graph.min||0;yMax=this.graph.max===undefined?yMax:this.graph.max;if(this.graph.min==="auto"||yMin<0){yMin-=(yMax-yMin)*this.padding.bottom}if(this.graph.max===undefined){yMax+=(yMax-yMin)*this.padding.top}return{x:[xMin,xMax],y:[yMin,yMax]}},render:function(args){args=args||{};var graph=this.graph;var series=args.series||graph.series;var vis=args.vis||graph.vis;vis.selectAll("*").remove();var data=series.filter(function(s){return!s.disabled}).map(function(s){return s.stack});var pathNodes=vis.selectAll("path.path").data(data).enter().append("svg:path").classed("path",true).attr("d",this.seriesPathFactory());if(this.stroke){var strokeNodes=vis.selectAll("path.stroke").data(data).enter().append("svg:path").classed("stroke",true).attr("d",this.seriesStrokeFactory())}var i=0;series.forEach(function(series){if(series.disabled)return;series.path=pathNodes[0][i];if(this.stroke)series.stroke=strokeNodes[0][i];this._styleSeries(series);i++},this)},_styleSeries:function(series){var fill=this.fill?series.color:"none";var stroke=this.stroke?series.color:"none";series.path.setAttribute("fill",fill);series.path.setAttribute("stroke",stroke);series.path.setAttribute("stroke-width",this.strokeWidth);if(series.className){d3.select(series.path).classed(series.className,true)}if(series.className&&this.stroke){d3.select(series.stroke).classed(series.className,true)}},configure:function(args){args=args||{};Rickshaw.keys(this.defaults()).forEach(function(key){if(!args.hasOwnProperty(key)){this[key]=this[key]||this.graph[key]||this.defaults()[key];return}if(typeof this.defaults()[key]=="object"){Rickshaw.keys(this.defaults()[key]).forEach(function(k){this[key][k]=args[key][k]!==undefined?args[key][k]:this[key][k]!==undefined?this[key][k]:this.defaults()[key][k]},this)}else{this[key]=args[key]!==undefined?args[key]:this[key]!==undefined?this[key]:this.graph[key]!==undefined?this.graph[key]:this.defaults()[key]}},this)},setStrokeWidth:function(strokeWidth){if(strokeWidth!==undefined){this.strokeWidth=strokeWidth}},setTension:function(tension){if(tension!==undefined){this.tension=tension}}});Rickshaw.namespace("Rickshaw.Graph.Renderer.Line");Rickshaw.Graph.Renderer.Line=Rickshaw.Class.create(Rickshaw.Graph.Renderer,{name:"line",defaults:function($super){return Rickshaw.extend($super(),{unstack:true,fill:false,stroke:true})},seriesPathFactory:function(){var graph=this.graph;var factory=d3.svg.line().x(function(d){return graph.x(d.x)}).y(function(d){return graph.y(d.y)}).interpolate(this.graph.interpolation).tension(this.tension);factory.defined&&factory.defined(function(d){return d.y!==null});return factory}});Rickshaw.namespace("Rickshaw.Graph.Renderer.Stack");Rickshaw.Graph.Renderer.Stack=Rickshaw.Class.create(Rickshaw.Graph.Renderer,{name:"stack",defaults:function($super){return Rickshaw.extend($super(),{fill:true,stroke:false,unstack:false})},seriesPathFactory:function(){var graph=this.graph;var factory=d3.svg.area().x(function(d){return graph.x(d.x)}).y0(function(d){return graph.y(d.y0)}).y1(function(d){return graph.y(d.y+d.y0)}).interpolate(this.graph.interpolation).tension(this.tension);factory.defined&&factory.defined(function(d){return d.y!==null});return factory}});Rickshaw.namespace("Rickshaw.Graph.Renderer.Bar");Rickshaw.Graph.Renderer.Bar=Rickshaw.Class.create(Rickshaw.Graph.Renderer,{name:"bar",defaults:function($super){var defaults=Rickshaw.extend($super(),{gapSize:.05,unstack:false});delete defaults.tension;return defaults},initialize:function($super,args){args=args||{};this.gapSize=args.gapSize||this.gapSize;$super(args)},domain:function($super){var domain=$super();var frequentInterval=this._frequentInterval(this.graph.stackedData.slice(-1).shift());domain.x[1]+=Number(frequentInterval.magnitude);return domain},barWidth:function(series){var frequentInterval=this._frequentInterval(series.stack);var barWidth=this.graph.x.magnitude(frequentInterval.magnitude)*(1-this.gapSize);return barWidth},render:function(args){args=args||{};var graph=this.graph;var series=args.series||graph.series;var vis=args.vis||graph.vis;vis.selectAll("*").remove();var barWidth=this.barWidth(series.active()[0]);var barXOffset=0;var activeSeriesCount=series.filter(function(s){return!s.disabled}).length;var seriesBarWidth=this.unstack?barWidth/activeSeriesCount:barWidth;var transform=function(d){var matrix=[1,0,0,d.y<0?-1:1,0,d.y<0?graph.y.magnitude(Math.abs(d.y))*2:0];return"matrix("+matrix.join(",")+")"};series.forEach(function(series){if(series.disabled)return;var barWidth=this.barWidth(series);var nodes=vis.selectAll("path").data(series.stack.filter(function(d){return d.y!==null})).enter().append("svg:rect").attr("x",function(d){return graph.x(d.x)+barXOffset}).attr("y",function(d){return graph.y(d.y0+Math.abs(d.y))*(d.y<0?-1:1)}).attr("width",seriesBarWidth).attr("height",function(d){return graph.y.magnitude(Math.abs(d.y))}).attr("transform",transform);Array.prototype.forEach.call(nodes[0],function(n){n.setAttribute("fill",series.color)});if(this.unstack)barXOffset+=seriesBarWidth},this)},_frequentInterval:function(data){var intervalCounts={};for(var i=0;i0){this[0].data.forEach(function(plot){item.data.push({x:plot.x,y:0})})}else if(item.data.length===0){item.data.push({x:this.timeBase-(this.timeInterval||0),y:0})}this.push(item);if(this.legend){this.legend.addLine(this.itemByName(item.name))}},addData:function(data,x){var index=this.getIndex();Rickshaw.keys(data).forEach(function(name){if(!this.itemByName(name)){this.addItem({name:name})}},this);this.forEach(function(item){item.data.push({x:x||(index*this.timeInterval||1)+this.timeBase,y:data[item.name]||0})},this)},getIndex:function(){return this[0]&&this[0].data&&this[0].data.length?this[0].data.length:0},itemByName:function(name){for(var i=0;i1;i--){this.currentSize+=1;this.currentIndex+=1;this.forEach(function(item){item.data.unshift({x:((i-1)*this.timeInterval||1)+this.timeBase,y:0,i:i})},this)}}},addData:function($super,data,x){$super(data,x);this.currentSize+=1;this.currentIndex+=1;if(this.maxDataPoints!==undefined){while(this.currentSize>this.maxDataPoints){this.dropData()}}},dropData:function(){this.forEach(function(item){item.data.splice(0,1)});this.currentSize-=1},getIndex:function(){return this.currentIndex}});return Rickshaw}); \ No newline at end of file diff --git a/static/partials/about.html b/static/partials/about.html index 7440efc09..01c40f277 100644 --- a/static/partials/about.html +++ b/static/partials/about.html @@ -1,4 +1,4 @@ -
+

About Us

diff --git a/static/partials/build-package.html b/static/partials/build-package.html index 3f6df7d50..7ed70e98e 100644 --- a/static/partials/build-package.html +++ b/static/partials/build-package.html @@ -1,8 +1,8 @@
-
+
You do not have permission to view this page
-
+

diff --git a/static/partials/confirm-invite.html b/static/partials/confirm-invite.html index 807ca4540..5bf2f97ad 100644 --- a/static/partials/confirm-invite.html +++ b/static/partials/confirm-invite.html @@ -1,5 +1,5 @@
-

Dockerfile or .tar.gz or .zip: