Ejegg has submitted this change and it was merged.
Change subject: Fix time display, remove refresh and profile btns
......................................................................
Fix time display, remove refresh and profile btns
edited to convert spaces to tabs
Change-Id: Ia0bbb34c0101647d5e17317453db763e94e93db8
---
M src/components/boards/generic-board/generic-board.html
M src/components/nav-bar/nav-bar.html
M src/components/widgets/x-by-y/x-by-y.html
M src/components/widgets/x-by-y/x-by-y.js
4 files changed, 157 insertions(+), 132 deletions(-)
Approvals:
Ejegg: Looks good to me, approved
diff --git a/src/components/boards/generic-board/generic-board.html
b/src/components/boards/generic-board/generic-board.html
index dcdcc9e..7797fae 100644
--- a/src/components/boards/generic-board/generic-board.html
+++ b/src/components/boards/generic-board/generic-board.html
@@ -6,9 +6,9 @@
<p data-bind="text: displayDate"></p>
</div>
<div class="col-md-8 titleCol">
- <div class="btn-group btn-group-xs pull-right">
+ <!-- <div class="btn-group btn-group-xs pull-right">
<button type="button" class="btn btn-default"
data-bind="click: reloadBoard"><i class="fa fa-refresh"
style="padding-right:5px"></i> Refresh</button>
- </div>
+ </div> -->
</div>
</div>
diff --git a/src/components/nav-bar/nav-bar.html
b/src/components/nav-bar/nav-bar.html
index b1fb42a..6e2a1c1 100644
--- a/src/components/nav-bar/nav-bar.html
+++ b/src/components/nav-bar/nav-bar.html
@@ -27,7 +27,7 @@
<div class="hide subNavBoardOpts
subNavButton" id="profileLinks">
<ul>
<li><a
href="/logout">Log out</a></li>
- <li id="Profile"
data-bind="click: $parent.setDisplayPage">Profile</li>
+ <!-- <li id="Profile"
data-bind="click: $parent.setDisplayPage">Profile</li> -->
</ul>
</div>
</span>
diff --git a/src/components/widgets/x-by-y/x-by-y.html
b/src/components/widgets/x-by-y/x-by-y.html
index 3229239..27185a9 100644
--- a/src/components/widgets/x-by-y/x-by-y.html
+++ b/src/components/widgets/x-by-y/x-by-y.html
@@ -1,52 +1,52 @@
<div class="row">
<span data-bind="if: preDataLoading">
- <div class="loadingWidget">
- <img src="/images/catloader.gif" />
- <h3 class="text-center">Loading.....</h3>
- </div>
- </span>
+ <div class="loadingWidget">
+ <img src="/images/catloader.gif" />
+ <h3 class="text-center">Loading.....</h3>
+ </div>
+ </span>
<div class="panel panel-purple">
- <div class="panel-heading">
- <div class="btn-group btn-group-xs pull-right">
- <button type="button" class="btn btn-default
dropdown-toggle" data-toggle="modal" data-target="#XYsqlModal"><i class="fa
fa-database"></i></button>
- <!-- <button type="button" id="savedCharts" class="btn
btn-default dropdown-toggle" data-toggle="dropdown"
data-target="#XYsavedChart"><i class="fa fa-area-chart"></i> Saved
charts...</button>
- <ul class="dropdown-menu" role="menu"
aria-labelledby="savedCharts" id="savedChartsMenu" data-bind="foreach:
presetTitles, style: { width: '300px'}">
+ <div class="panel-heading">
+ <div class="btn-group btn-group-xs pull-right">
+ <button type="button" class="btn btn-default
dropdown-toggle" data-toggle="modal" data-target="#XYsqlModal"><i class="fa
fa-database"></i></button>
+ <!-- <button type="button" id="savedCharts"
class="btn btn-default dropdown-toggle" data-toggle="dropdown"
data-target="#XYsavedChart"><i class="fa fa-area-chart"></i> Saved
charts...</button>
+ <ul class="dropdown-menu" role="menu"
aria-labelledby="savedCharts" id="savedChartsMenu" data-bind="foreach:
presetTitles, style: { width: '300px'}">
<li data-bind="text: $data"></li>
</ul> -->
- </div>
- </div>
+ </div>
+ </div>
- <div class="panel-body">
- <div class="row-fluid">
- <div class="col-md-3 col-sm-12">
+ <div class="panel-body">
+ <div class="row-fluid">
+ <div class="col-md-3 col-sm-12">
- <div class="row">
- <div class="well lightWell col-md-12">
- <form id="XYform" data-bind="event:
{change: logStateChange(true)}">
- <div class="row-fluid">
- <h4>Show:</h4>
- <select
data-bind="options: ySlices, value: showSlice"></select>
- <hr>
- </div>
- <!-- <div class="row-fluid">
- <h4>By:</h4>
- <select
data-bind="options: xSlices, value: bySlice"></select>
- <hr>
- </div> -->
+ <div class="row">
+ <div class="well lightWell
col-md-12">
+ <form id="XYform"
data-bind="event: {change: logStateChange(true)}">
+ <div
class="row-fluid">
+
<h4>Show:</h4>
+ <select
data-bind="options: ySlices, value: showSlice"></select>
+ <hr>
+ </div>
+ <!-- <div
class="row-fluid">
+
<h4>By:</h4>
+ <select
data-bind="options: xSlices, value: bySlice"></select>
+ <hr>
+ </div> -->
- <div class="row-fluid">
- <h4>Starting
time range:</h4><br>
+ <div
class="row-fluid">
+
<h4>Starting time range:</h4><br>
<select
id="startingTimeRange" placeholder="Range..." data-bind="options: timeChoices,
value: timeChoice"></select>
<!--
<hr> -->
- </div>
+ </div>
- <!-- <div
class="row-fluid">
- <label
for="selectXYFilters">Additional filters:</label><br>
- <span
data-bind="foreach: groupChoices">
- <div
class="panel panel-default xyGroupOption">
-
<div class="panel-heading">
+ <!-- <div
class="row-fluid">
+ <label
for="selectXYFilters">Additional filters:</label><br>
+ <span
data-bind="foreach: groupChoices">
+
<div class="panel panel-default xyGroupOption">
+
<div class="panel-heading">
<span data-bind="text: $data.name" class="pull-left"></span>
<span class="pull-right" data-bind="if: $data.choices"><i
class="fa fa-caret-down" data-bind="click:
$parent.showPanelBody($data.name)"></i></span>
</div>
@@ -61,112 +61,113 @@
</div>
</div>
</span>
- </div> -->
- </form>
- </div>
+ </div> -->
+ </form>
+ </div>
- </div>
+ </div>
- <div class="row">
- <button class="btn btn-block btn-col btn-info"
data-bind="click: submitXY"><i class="fa fa-area-chart"></i> Preview chart
</button>
- </div>
- <div class="row">
- <button class="btn btn-block btn-col
btn-danger" data-bind="visible: !chartSaved() && optionStateChanged, click:
saveWidgetConfig"><i class="fa fa-save"></i> Save chart </button>
- </div>
- <div class="row">
- <button class="btn btn-block btn-col
btn-success" data-bind="visible: chartSaved"><i class="fa
fa-check-circle-o"></i> Chart saved. </button>
- </div>
+ <div class="row">
+ <button class="btn btn-block
btn-col btn-info" data-bind="click: submitXY"><i class="fa fa-area-chart"></i>
Preview chart </button>
+ </div>
+ <div class="row">
+ <button class="btn btn-block
btn-col btn-danger" data-bind="visible: !chartSaved() && optionStateChanged,
click: saveWidgetConfig"><i class="fa fa-save"></i> Save chart </button>
+ </div>
+ <div class="row">
+ <button class="btn btn-block
btn-col btn-success" data-bind="visible: chartSaved"><i class="fa
fa-check-circle-o"></i> Chart saved. </button>
+ </div>
- </div>
+ </div>
- <div class="col-md-9 col-sm-12">
+ <div class="col-md-9 col-sm-12">
- <div class="row" id="specifiedXYchart">
- <div class="col-md-12">
- <span data-bind="if: !config">
- <div class="row-fluid alert
alert-danger" data-bind="style: { width: '100%', overflow: 'hidden'}">
- <div class="col-md-1">
- <h1><i class="fa
fa-gears"></i></h1>
- </div>
- <div class="col-md-11">
- <h3>This widget hasn't
been set up yet.</h3>
- <p>Choose display
options to see the chart.</p>
- </div>
- </div>
- </span>
+ <div class="row" id="specifiedXYchart">
+ <div class="col-md-12">
+ <span data-bind="if:
!config">
+ <div
class="row-fluid alert alert-danger" data-bind="style: { width: '100%',
overflow: 'hidden'}">
+ <div
class="col-md-1">
+
<h1><i class="fa fa-gears"></i></h1>
+ </div>
+ <div
class="col-md-11">
+
<h3>This widget hasn't been set up yet.</h3>
+
<p>Choose display options to see the chart.</p>
+ </div>
+ </div>
+ </span>
- <div class="row-fluid" data-bind="if:
chartLoaded">
- <h1 data-bind="text: title"></h1>
- <h4 data-bind="visible:
chosenFilters > 0">Narrowed by:
- <span data-bind="foreach:
chosenFilters">
- <span class='label
label-success' data-bind="text: $data"></span>
- </span>
- </h4>
- </div>
- <div id='x-by-yChart' data-bind="attr: {
width: chartWidth, height: chartHeight }"></div>
- </div>
+ <div class="row-fluid"
data-bind="if: chartLoaded">
+ <h1
data-bind="text: title"></h1>
+ <h4
data-bind="text: subtitle"></h4>
+ <h4
data-bind="visible: chosenFilters > 0">Narrowed by:
+ <span
data-bind="foreach: chosenFilters">
+
<span class='label label-success' data-bind="text: $data"></span>
+ </span>
+ </h4>
+ </div>
+ <div id='x-by-yChart'
data-bind="attr: { width: chartWidth, height: chartHeight }"></div>
+ </div>
- <!-- <div class="col-md-2 pull-right">
- <button class="btn-info"><i class="fa
fa-bar-chart"></i></button>
- <button class="btn-info"><i class="fa
fa-line-chart"></i></button>
- <button class="btn-info"><i class="fa
fa-pie-chart"></i></button>
- <button class="btn-info"><i class="fa
fa-table"></i></button>
- </div> -->
- </div>
- </div>
+ <!-- <div class="col-md-2
pull-right">
+ <button
class="btn-info"><i class="fa fa-bar-chart"></i></button>
+ <button
class="btn-info"><i class="fa fa-line-chart"></i></button>
+ <button
class="btn-info"><i class="fa fa-pie-chart"></i></button>
+ <button
class="btn-info"><i class="fa fa-table"></i></button>
+ </div> -->
+ </div>
+ </div>
- </div>
+ </div>
- </div>
+ </div>
</div>
</div>
<div class="modal fade" id="XYsavedCharts">
<div class="modal-dialog">
- <div class="modal-content">
- <div class="modal-header">
- <button type="button" class="close"
data-dismiss="modal"><span aria-hidden="true">×</span><span
class="sr-only">Close</span></button>
- <h4 class="modal-title">Set up the chart!</h4>
- </div>
- <div class="modal-body">
- <div class="row-fluid">
- <div class="col-md-12 well">
- <label>Show a saved chart:</label>
- <div class="input-group">
- <select data-bind="options: presetTitles,
value: title"></select>
- </div>
- </div>
- </div>
- </div>
- <div class="modal-footer">
- <button type="button" class="btn btn-default"
data-dismiss="modal">Cancel</button>
- <button type="button" class="btn btn-success pull-right"
data-dismiss="modal">Submit</button>
- </div>
- </div>
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close"
data-dismiss="modal"><span aria-hidden="true">×</span><span
class="sr-only">Close</span></button>
+ <h4 class="modal-title">Set up the chart!</h4>
+ </div>
+ <div class="modal-body">
+ <div class="row-fluid">
+ <div class="col-md-12 well">
+ <label>Show a saved
chart:</label>
+ <div class="input-group">
+ <select
data-bind="options: presetTitles, value: title"></select>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default"
data-dismiss="modal">Cancel</button>
+ <button type="button" class="btn btn-success
pull-right" data-dismiss="modal">Submit</button>
+ </div>
+ </div>
</div>
</div>
<div class="modal fade" id="XYsqlModal">
<div class="modal-dialog">
- <div class="modal-content">
- <div class="modal-header">
- <button type="button" class="close" data-dismiss="modal"><span
aria-hidden="true">×</span><span class="sr-only">Close</span></button>
- <h4 class="modal-title">Fraud Gauge SQL:</h4>
- </div>
- <div class="modal-body" data-bind="text: queryStringSQL"></div>
- </div><!-- /.modal-content -->
- </div>
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close"
data-dismiss="modal"><span aria-hidden="true">×</span><span
class="sr-only">Close</span></button>
+ <h4 class="modal-title">Chart SQL:</h4>
+ </div>
+ <div class="modal-body" data-bind="text:
queryStringSQL"></div>
+ </div><!-- /.modal-content -->
+ </div>
</div>
<div class="modal fade" id="loadingModal">
<div class="modal-dialog">
- <div class="modal-content">
- <h3 class="modal-body">Chart Loading....</h3>
- <div class="progress">
+ <div class="modal-content">
+ <h3 class="modal-body">Chart Loading....</h3>
+ <div class="progress">
<div class="progress-bar progress-bar-success
progress-bar-striped active" role="progressbar" aria-valuenow="100"
aria-valuemin="0" aria-valuemax="100" style="width: 100%">
</div>
</div>
- </div><!-- /.modal-content -->
- </div>
+ </div><!-- /.modal-content -->
+ </div>
</div>
\ No newline at end of file
diff --git a/src/components/widgets/x-by-y/x-by-y.js
b/src/components/widgets/x-by-y/x-by-y.js
index 7a36515..8fdffb6 100644
--- a/src/components/widgets/x-by-y/x-by-y.js
+++ b/src/components/widgets/x-by-y/x-by-y.js
@@ -11,19 +11,41 @@
function XByYChartViewModel( params ){
WidgetBase.call( this, params );
- var self = this,
- wasSaved = self.chartSaved(); //populateChoices() may
overwrite
- self.showSlice = ko.observable();
- self.bySlice = ko.observable();
- self.timeChoice = ko.observable();
- self.queryRequest = {};
- self.queryString = '';
- self.chosenFilters = ko.observableArray();
- self.subChoices = ko.observableArray();
+ var self = this,
+ wasSaved = self.chartSaved(); //populateChoices() may
overwrite
+
+ self.showSlice = ko.observable();
+ self.bySlice = ko.observable();
+ self.timeChoice = ko.observable();
+ self.displayedTimeChoice = ko.observable('');
+ self.queryRequest = {};
+ self.queryString = '';
+ self.chosenFilters = ko.observableArray();
+ self.subChoices = ko.observableArray();
self.chartWidth(950);
- self.title = ko.computed(function(){
- return self.showSlice(); //+ ' by ' + self.bySlice();
+ self.title = ko.computed( function(){
+ if( self.displayedTimeChoice()==='Year' ){
+ return self.showSlice() + ' Over All Time';
+ } else {
+ return self.showSlice() + ' by ' +
self.displayedTimeChoice();
+ }
+ });
+
+ self.subtitle = ko.computed( function(){
+ var from = '';
+ switch(self.displayedTimeChoice()){
+ case 'Year':
+ return;
+ case 'Month':
+ from = moment().subtract(1,
'year').format('MMMM Do, YYYY');
+ break;
+ case 'Day':
+ from = moment().subtract(1,
'month').format('MMMM Do, YYYY');
+ break;
+ }
+
+ return from + ' to ' + moment().format('MMMM Do, YYYY');
});
self.makeChart = function(data){
@@ -317,6 +339,7 @@
self.submitXY = function(){
$('#loadingModal').modal('show');
+
self.queryRequest.ySlice = self.showSlice();
//self.queryRequest.xSlice = self.bySlice();
//self.queryRequest.additionalFilters =
self.chosenFilters();
@@ -326,11 +349,12 @@
self.config.showSlice = self.showSlice();
self.config.queryString = self.queryString;
self.config.timeBreakout =
self.queryRequest.timeBreakout;
- self.config.chartData = self.chartData;
+ self.config.chartData = self.chartData;
var chartDataCall = self.getChartData(self.queryString);
$.when( chartDataCall ).then( function( dataArray ){
+ self.displayedTimeChoice(self.timeChoice());
self.retrievedResults(dataArray.results);
self.dataLoading(false);
--
To view, visit https://gerrit.wikimedia.org/r/195996
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ia0bbb34c0101647d5e17317453db763e94e93db8
Gerrit-PatchSet: 5
Gerrit-Project: wikimedia/fundraising/dash
Gerrit-Branch: master
Gerrit-Owner: Ssmith <[email protected]>
Gerrit-Reviewer: Ejegg <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
