Skip to content

Commit

Permalink
Merge pull request #2555 from project-hatohol/integrate-default-filte…
Browse files Browse the repository at this point in the history 
…r-html

Integrate default filter html
  • Loading branch information
@masa0612
masa0612 authored Jun 7, 2017
2 parents 08db3b6 + ad3e70c commit 002e470
Show file tree
Hide file tree
Showing 3 changed files with 60 additions and 79 deletions.
85 changes: 44 additions & 41 deletions client/static/css/hatohol.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ div#controller-container
padding: 16px 4px 16px 4px;
}

#view-config input[type="text"] {
input#auto-reload-interval,#num-rows-per-page {
width: 4em;
display: inline-block;
}
Expand All @@ -123,18 +123,16 @@ label.unit {
}

div#filter-name-config {
margin-top: 16px;
margin-bottom: 20px;
margin-top: 6px;
margin-bottom: 10px;
}

#filter-name-config .btn.dropdown-toggle {
float: none;
}

#filter-name-config ul {
width: 380px;
left: initial;
right: 32px;
min-width: 320px;
}

#filter-name-config li {
Expand All @@ -151,6 +149,10 @@ button#filter-name-list-button {
margin-bottom: 2px;
}

button#filter-name-list-add-button {
margin-bottom: 6px;
}

button#filter-name-list-delete-button {
margin-bottom: 6px;
}
Expand Down Expand Up @@ -219,13 +221,6 @@ table.view-layout-mock td.highlight {
border-color: red !important;
}

select.default-filter-selector {
display: inline-block;
vertical-align: middle;
margin-left: 40px;
width: 200px;
}

td[contenteditable=true]:empty::before {
content: attr(data-placeholder);
color: #888888;
Expand Down Expand Up @@ -358,10 +353,27 @@ h2.hatohol-graph {
}

.filter-element {
display: inline-block;
*display:inline;
text-align: left;
margin-right: 10px;
*display:inline;
display: inline-table;
text-align: left;
margin-right: 10px;
width: 33%;
margin: 0;
padding: 0 0 12px 0;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.filter-element p {
display: table-cell;
vertical-align: middle;
height: auto;
line-height: 100%;
}

.filter-element select {
width: 50%;
}

.filter-time-range {
Expand Down Expand Up @@ -557,14 +569,22 @@ html {
color: #666666;
}

#summaryBar #select-summary-filter {
#summaryBar .filter-element {
position: relative;
left: 10px;
top: 7px;
width: auto;
width: 100px;
font-size: 12px;
}

#summaryBar .filter-element .bootstrap-select {
width: 150px;
}

#select-filter ul {
min-width: 250px;
}

#summaryBar #summaryBarRight {
position: absolute;
right: 170px;
Expand Down Expand Up @@ -638,31 +658,10 @@ html {
margin: 0;
}

#hideDiv .filter-element {
display: inline-table;
width: 33%;
margin: 0;
padding: 0 0 12px 0;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

#hideDiv .filter-element p {
display: table-cell;
vertical-align: middle;
height: auto;
line-height: 100%;
}

#hideDiv .bootstrap-select.btn-group > .disabled {
.bootstrap-select.btn-group > .disabled {
background-color: #adadad;
}

#hideDiv .filter-element select {
width: 50%;
}

#hideDiv #apply-all-filter {
background: #428bca;
border-color: #428bca;
Expand Down Expand Up @@ -773,6 +772,10 @@ div#abbreviating-event-descriptions-container {
margin: 0;
}

#view-config .bootstrap-select {
width: 200px;
}

.table.verticalAlignMiddle > tbody > tr > td {
vertical-align: middle;
}
Expand Down
1 change: 1 addition & 0 deletions client/static/js/triggers_view.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -425,6 +425,7 @@ var TriggersView = function(userProfile, options) {
html += "<td class='" + severityClass + "'>" +
anchorTagForDomesticLink(
'ajax_events?serverId=' + escapeHTML(serverId) +
'&hostId=' + escapeHTML(trigger["hostId"]) +
'&triggerId=' + escapeHTML(trigger["id"]),
escapeHTML(triggerName));
+ "</td>";
Expand Down
53 changes: 15 additions & 38 deletions client/viewer/events_ajax.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,9 @@ <h2 style="margin-left: 20px;">{% trans "Event" %}</h2>
<button style="display: none;">
{% trans "Hosts with important events" %}<span class="badge" id="numOfImportantEventOccurredHosts">N/A</span>
</button>
<select id="select-summary-filter" class="form-control"></select>
<div class="filter-element">
<select id="select-filter" class="form-control" data-live-search="true"></select>
</div>
<div id="summaryBarRight">
<div id="update-time-wrap">
<div id="update-time"> {% trans "Last Update:"%} None </div>
Expand All @@ -63,7 +65,7 @@ <h2 style="margin-left: 20px;">{% trans "Event" %}</h2>
<form class="form-inline hatohol-filter-toolbar">
<div class="clearfix">
<div class="pull-left">
<h3 id="controller-container-title"></h3>
<h3 id="controller-container-title"> {% trans "All Events" %} </h3>
<span id="filtering-options-brief"><span aria-hiden="true" class="glyphicon glyphicon-tag"></span><span id="filtering-options-brief-line"/></span>
</div>
<div class="pull-right">
Expand Down Expand Up @@ -136,9 +138,7 @@ <h3 id="controller-container-title"></h3>
</select>
</div>
<div class="filter-element">
<p><label>{% trans "Filter:" %}</label></p>
<select id="select-filter" class="form-control" data-live-search="true" data-width="50%">
</select>
<p></p>
</div>
<div class="filter-element">
<p><label>{% trans "Hostgroup Name:" %}</label></p>
Expand Down Expand Up @@ -210,10 +210,16 @@ <h4 class="modal-title" id="events-view-config-label">{% trans "Event Page Setti
<ul id="config-tab-list" class="nav nav-tabs">
<li class="active"><a href="#view-config" data-toggle="tab">{% trans "View" %}</a></li>
<li><a href="#filter-config" data-toggle="tab">{% trans "Filter" %}</a></li>
<li><a href="#default-filter-config" data-toggle="tab">{% trans "Default filter" %}</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane fade in active" id="view-config">
<label>{% trans "Default filter" %}</label>
<div class="filter-element" style="float: right;">
<select id="events-default-filter-selector" class="form-control" data-live-search="true">
</select>
</div>

<hr>
<div class="boxed-group">
<p><label for="auto-reload-interval">{% trans "Auto reload interval (5 - 600 sec)" %}</p>
<p>
Expand Down Expand Up @@ -289,8 +295,9 @@ <h4 class="modal-title" id="events-view-config-label">{% trans "Event Page Setti
<div class="tab-pane fade" id="filter-config">

<!-- Filter name -->
<div id="filter-name-config" class="btn-group">
<label for="filter-name-entry">{% trans "Filter name(1 - 128 char)" %}</label>
<br>
<div id="filter-name-config" class="btn-group">
<input id="filter-name-entry" class="form-control" type="text" style="width: 290px" maxlength="128">
<button id="filter-name-list-button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
Expand All @@ -302,7 +309,7 @@ <h4 class="modal-title" id="events-view-config-label">{% trans "Event Page Setti
<i class="glyphicon glyphicon-plus"></i>
</button>
<button id="filter-name-list-delete-button" class="btn btn-primary">
{% trans "Delete" %}
<i class="glyphicon glyphicon-trash"></i>
</button>

<!-- Period filter config -->
Expand Down Expand Up @@ -573,36 +580,6 @@ <h4 class="modal-title" id="events-view-config-label">{% trans "Event Page Setti
</div>
</div>

<div class="tab-pane fade" id="default-filter-config">

<div>
<p>{% trans 'Select a filter to apply as the default filter of the summary view.' %}
</p>
<div class="view-layout-mock">
<table class="table-bordered view-layout-mock">
<tr><td class="controlbar highlight"></td></tr>
<tr><td></td></tr>
</table>
</div>
<select size="8" id="summary-default-filter-selector" class="default-filter-selector">
</select>
</div>

<hr>

<div>
<p>{% trans 'Select a filter to apply as the default filter of the event list view.' %}</p>
<div class="view-layout-mock">
<table class="table-bordered view-layout-mock">
<tr><td class="controlbar"></td></tr>
<tr><td class="highlight"></td></tr>
</table>
</div>
<select size="8" id="events-default-filter-selector" class="default-filter-selector">
</select>
</div>

</div>
</div>

</div>
Expand Down

0 comments on commit 002e470

Please sign in to comment.