Skip to content
This repository has been archived by the owner on Nov 22, 2017. It is now read-only.

Commit

Permalink
Upgrade to 5.0.0 navbar styles. Yay more room for queries
Browse files Browse the repository at this point in the history
  • Loading branch information
Rashid Khan committed Mar 31, 2016
1 parent 4afe051 commit 7010b75
Show file tree
Hide file tree
Showing 4 changed files with 84 additions and 123 deletions.
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "timelion",
"version": "0.1.258",
"version": "0.1.259",
"dependencies": {
"body-parser": "^1.12.0",
"boom": "^2.8.0",
Expand Down
48 changes: 35 additions & 13 deletions public/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ require('ui/saved_objects/saved_object_registry').register(require('plugins/time

// TODO: Expose an api for dismissing notifications
var unsafeNotifications = require('ui/notify')._notifs;
var ConfigTemplate = require('ui/config_template');
//var ConfigTemplate = require('ui/config_template');

require('ui/routes').enable();

Expand Down Expand Up @@ -62,17 +62,39 @@ app.controller('timelion', function (
var savedSheet = $route.current.locals.savedSheet;
var blankSheet = [defaultExpression];

// config panel templates
$scope.configTemplate = new ConfigTemplate({
load: require('plugins/timelion/partials/load_sheet.html'),
save: require('plugins/timelion/partials/save_sheet.html'),
options: require('plugins/timelion/partials/sheet_options.html'),
docs: '<timelion-docs></timelion-docs>'
});
$scope.topNavMenu = [{
key: 'new',
description: 'New Sheet',
run: function () { kbnUrl.change('/'); }
}, {
key: 'add',
description: 'Add a chart',
run: function () { $scope.newCell(); }
}, {
key: 'save',
description: 'Save Sheet',
template: require('plugins/timelion/partials/save_sheet.html')
}, {
key: 'open',
description: 'Load Sheet',
template: require('plugins/timelion/partials/load_sheet.html')
}, {
key: 'options',
description: 'Options',
template: require('plugins/timelion/partials/sheet_options.html')
}, {
key: 'docs',
description: 'Documentation',
template: '<timelion-docs></timelion-docs>'
}];


$timeout(function () {
if (config.get('timelion:showTutorial', true)) {
$scope.kbnTopNav.open('docs');
}
}, 0);

if (config.get('timelion:showTutorial', true)) {
$scope.configTemplate.toggle('docs');
}

$scope.state = new AppState(getStateDefaults());
function getStateDefaults() {
Expand All @@ -99,7 +121,7 @@ app.controller('timelion', function (
search: $scope.search,
dontShowHelp: function () {
config.set('timelion:showTutorial', false);
$scope.configTemplate.toggle('docs');
$scope.kbnTopNav.close('docs');
}
};
};
Expand Down Expand Up @@ -193,7 +215,7 @@ app.controller('timelion', function (
savedSheet.timelion_columns = $scope.state.columns;
savedSheet.timelion_rows = $scope.state.rows;
savedSheet.save().then(function (id) {
$scope.configTemplate.close('save');
//$scope.configTemplate.close('save');
if (id) {
notify.info('Saved sheet as "' + savedSheet.title + '"');
if (savedSheet.id !== $routeParams.id) {
Expand Down
27 changes: 15 additions & 12 deletions public/app.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,6 @@
@import './chart.less';
@import './suggestions.less';

navbar.timelion-navbar {
padding-top: 16px;
padding-bottom: 16px;
}

[chart] {
height: 100%;
width: 100%;
Expand Down Expand Up @@ -47,10 +42,7 @@ navbar.timelion-navbar {
}

&-stats {
color: @text-color;
font-size: 0.9em;
padding: 5px 20px;
display: inline-block;
font-weight: normal;
}

&-buttons {
Expand Down Expand Up @@ -99,8 +91,16 @@ navbar.timelion-navbar {
}
}

navbar.timelion-navbar .form-control:focus {
border-color: @gray-lighter;

navbar.timelion-navbar {

input, select {
height: 34px;
}

.form-control:focus {
border-color: @gray-lighter;
}
}

.timelion-nav-wrapper {
Expand Down Expand Up @@ -128,7 +128,7 @@ navbar.timelion-navbar .form-control:focus {
}

select.timelion-interval {
width: 60px !important;
width: 70px !important;
-webkit-appearance: none;
-moz-appearance: none;
background-position: right 50%;
Expand All @@ -145,6 +145,9 @@ select.timelion-interval {
}
}

timelion-interval {
display: flex;
}

input.timelion-interval {
border-radius: 0;
Expand Down
130 changes: 33 additions & 97 deletions public/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,106 +1,42 @@
<div class="timelion" ng-controller="timelion">
<div class="timelion app-container" ng-controller="timelion">

<kbn-top-nav name="timelion" config="topNavMenu">
<div class="kibana-nav-info ng-scope">
<span class="kibana-nav-info-title">
<span ng-show="opts.savedSheet.id">
{{opts.savedSheet.title}}
<i class="fa fa-bolt" ng-click="showStats = !showStats"></i>
</span>
<small class="timelion-stats" ng-show="showStats">
Query Time {{stats.queryTime - stats.invokeTime}}ms /
Processing Time {{stats.sheetTime - stats.queryTime}}ms
</small>
</span>
</div>
</kbn-top-nav>

<navbar class="timelion-navbar" scroll-class="timelion-scroll-class-header" scroll-limit=45 ng-show="chrome.getVisible()">
<form role="form" class="fill inline-form" ng-submit="search()" name="discoverSearch">
<div class="typeahead">
<div class="input-group"
ng-class="discoverSearch.$invalid ? 'has-error' : ''">
<input input-focus
ng-model="state.sheet[state.selected]"
timelion-expression="{{state.sheet[state.selected]}}"
placeholder="Expression ..."
aria-label="Expression input"
type="text"
class="form-control timelion-expression">

<timelion-interval model="state.interval"></timelion-interval>

<button type="submit"
ng-disabled="discoverSearch.$invalid"
aria-label="Search">
<span aria-hidden="true" class="fa fa-play"></span></button>
</div>
<div class="input-group"
ng-class="discoverSearch.$invalid ? 'has-error' : ''">
<input input-focus
ng-model="state.sheet[state.selected]"
timelion-expression="{{state.sheet[state.selected]}}"
placeholder="Expression ..."
aria-label="Expression input"
type="text"
class="form-control timelion-expression">

<timelion-interval model="state.interval"></timelion-interval>

<button type="submit"
ng-disabled="discoverSearch.$invalid"
aria-label="Search">
<span aria-hidden="true" class="fa fa-play"></span></button>
</div>
</form>


<div class="button-group" role="toolbar" scroll-class="timelion-scroll-class-options" scroll-limit=45>
<kbn-tooltip text="Toggle Menu" placement="bottom" append-to-body="1">
<button
ng-click="toggle('showButtons')"
aria-label="Toggle Menu">
<i aria-hidden="true" class="fa fa-bars"></i>
</button>
</kbn-tooltip>
</div>
</navbar>

<div scroll-class="timelion-scroll-class-options" scroll-limit=45>
<div ng-if="showButtons" class="timelion-subnav">
<div class="timelion-stats">
<strong>Deduplication</strong> {{((1 - (stats.cacheCount/stats.queryCount))*100) | number:0}}% /
<strong>Query Time</strong> {{stats.queryTime - stats.invokeTime}}ms /
<strong>Processing Time</strong> {{stats.sheetTime - stats.queryTime}}ms
</div>
<div ng-if="showButtons" class="timelion-buttons">
<kbn-tooltip text="New Sheet" placement="bottom" append-to-body="1">
<a
ng-click="newSheet()"
aria-label="New Sheet">
<i aria-hidden="true" class="fa fa-file-new-o"></i>
</a>
</kbn-tooltip>

<kbn-tooltip text="Sheet Options" placement="bottom" append-to-body="1">
<a
ng-click="configTemplate.toggle('options');"
ng-class="{active: configTemplate.is('options')}"
aria-haspopup="true"
aria-expanded="{{ configTemplate.is('options') }}"
aria-label="Sheet Options">
<i aria-hidden="true" class="fa fa-cog"></i>
</a>
</kbn-tooltip>

<kbn-tooltip text="Save Sheet" placement="bottom" append-to-body="1">
<a
ng-click="configTemplate.toggle('save');"
ng-class="{active: configTemplate.is('save')}"
aria-haspopup="true"
aria-expanded="{{ configTemplate.is('save') }}"
aria-label="Save Search">
<i aria-hidden="true" class="fa fa-save"></i>
</a>
</kbn-tooltip>
<kbn-tooltip text="Load Sheet" placement="bottom" append-to-body="1">
<a
aria-haspopup="true"
aria-expanded="{{ configTemplate.is('load') }}"
ng-click="configTemplate.toggle('load');"
ng-class="{active: configTemplate.is('load')}"
aria-label="Load Saved Search">
<i aria-hidden="true" class="fa fa-folder-open-o"></i>
</a>
</kbn-tooltip>
<kbn-tooltip text="Add Chart" placement="bottom" append-to-body="1">
<a
aria-label="Add Chart"
ng-click="newCell()">
<i aria-hidden="true" class="fa fa-area-chart"></i>
</a>
</kbn-tooltip>
<kbn-tooltip text="Show Help" placement="bottom" append-to-body="1">
<a
aria-label="Show Help"
ng-click="configTemplate.toggle('docs');">
<i aria-hidden="true" class="fa fa-question-circle"></i>
</a>
</kbn-tooltip>
</div>
</div>

<config config-template="configTemplate" config-object="opts" config-close="configClose"></config>
</div>

<div class="timelion-container" scroll-class="timelion-scroll-class-body" scroll-limit=45>
<div class="timelion-container-sheet">
<div class="timelion-container-sheet-margin"
Expand Down

0 comments on commit 7010b75

Please sign in to comment.