From 766dec9996f27c2a2a4fff8074d95f8f3a315fc7 Mon Sep 17 00:00:00 2001 From: Preston Burns Date: Wed, 12 Jun 2019 11:16:16 -0400 Subject: [PATCH 1/2] revert layout --- package-lock.json | 4 ++-- package.json | 2 +- queryOverview.js | 26 +++++++++++++++++--------- scripts/configuration-wiki.md | 4 ++-- settings-schema.json | 2 +- src/chart/onLayout/groupControls.js | 4 ++-- src/styles.js | 19 +++++++++++++------ 7 files changed, 38 insertions(+), 23 deletions(-) diff --git a/package-lock.json b/package-lock.json index c3659bd..0d59e09 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "query-overview", - "version": "2.1.1", + "version": "2.1.2", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -3131,7 +3131,7 @@ }, "path-is-absolute": { "version": "1.0.1", - "resolved": "http://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", + "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", "dev": true }, diff --git a/package.json b/package.json index e0e0ffb..27dcee0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "query-overview", - "version": "2.1.1", + "version": "2.1.2", "description": "Interactive bar chart for exploration of query data from clinical trials", "module": "./src/index.js", "main": "./queryOverview.js", diff --git a/queryOverview.js b/queryOverview.js index 2eb59be..bf1f62c 100644 --- a/queryOverview.js +++ b/queryOverview.js @@ -692,7 +692,12 @@ Controls \--------------------------------------------------------------------------------------***/ '.qo-component--controls {' + ' width: 100%;' + '}', - '.qo-component--controls .wc-controls {' + ' margin-bottom: 0;' + '}', + '.qo-component--controls .wc-controls {' + + ' margin-bottom: 0;' + + ' display: flex;' + + ' width: 90%;' + + ' justify-content: space-around;' + + '}', '.qo-control-grouping {' + ' display: inline-block;' + '}', '.qo-button {' + ' float: left;' + ' display: block;' + '}', '.qo-control-grouping--label,' + @@ -711,8 +716,11 @@ Other controls \---------------------------------------------------------------------------------****/ '.qo-control-grouping--other-controls {' + - ' width: 20%;' + - ' float: right;' + + ' float: left;' + + ' display: flex;' + + ' flex-wrap: wrap;' + + ' justify-content: space-evenly;' + + ' width: 25%;' + '}', '.qo-control-grouping--other-controls .control-group {' + ' width: 100%;' + @@ -733,7 +741,7 @@ ' justify-content: center;' + ' flex-wrap: wrap;' + '}', - '.qo-radio .wc-control-label {' + ' width: 100%;' + '}', + '.qo-radio .wc-control-label {' + ' width: 50%;' + '}', '.qo-radio .radio {' + ' margin-top: 0 !important;' + '}', //checkboxes '.qo-checkbox {' + ' display: flex !important;' + @@ -745,8 +753,8 @@ Filters \---------------------------------------------------------------------------------****/ '.qo-control-grouping--filters {' + - ' width: 20%;' + ' float: left;' + + ' align-content: baseline;' + (typeof navigator !== 'undefined' && !/trident/i.test(navigator.userAgent) ? ' display: flex;' + ' flex-wrap: wrap;' + @@ -755,7 +763,6 @@ '}', '.qo-subsetter {' + ' margin: 5px 2px !important;' + - ' border-top: 1px solid #aaa;' + ' padding-top: 5px;' + ' display: inline-block !important;' + ' vertical-align: top;' + @@ -770,8 +777,9 @@ Chart \--------------------------------------------------------------------------------------***/ '.qo-component--chart {' + - ' width: 58%;' + + ' width: 100%;' + ' margin: 0 auto;' + + ' float: left;' + ' position: relative;' + '}', '.qo-button--reset-chart {' + @@ -1058,7 +1066,7 @@ this.controls.filters = { container: this.controls.wrap - .insert('div', '.qo-subsetter') + .insert('div', ':first-child') //placing filter controls first .classed('qo-control-grouping qo-control-grouping--filters', true) }; this.controls.filters.container @@ -1080,7 +1088,7 @@ this.controls.otherControls = { container: this.controls.wrap - .insert('div', ':first-child') + .insert('div', '.qo-dropdown') .classed('qo-control-grouping qo-control-grouping--other-controls', true) }; this.controls.otherControls.label = this.controls.otherControls.container diff --git a/scripts/configuration-wiki.md b/scripts/configuration-wiki.md index 076d8cf..0e167fd 100644 --- a/scripts/configuration-wiki.md +++ b/scripts/configuration-wiki.md @@ -3,7 +3,7 @@ The most straightforward way to customize query-overview is by using a configura In addition to the standard Webcharts settings several custom settings not available in the base Webcharts library have been added to query-overview to facilitate data mapping and other custom functionality. These custom settings are described in detail below. All defaults can be overwritten by users. # Renderer-specific settings -The sections below describe each query-overview setting as of version 2.1.0. +The sections below describe each query-overview setting as of version 2.1.2. ## settings.site_col `string` @@ -447,7 +447,7 @@ cell text past this cutoff will be truncated and the full text will be captured **default:** `100` # Webcharts settings -The objects below contain Webcharts settings for each display as of version 2.1.0 of the Query Overview. +The objects below contain Webcharts settings for each display as of version 2.1.2 of the Query Overview. ## Chart ``` diff --git a/settings-schema.json b/settings-schema.json index 5b242b5..ed43eb1 100644 --- a/settings-schema.json +++ b/settings-schema.json @@ -2,7 +2,7 @@ "title": "settings", "description": "JSON schema for the configuration of query-overview", "overview": "The most straightforward way to customize query-overview is by using a configuration object whose properties describe the behavior and appearance of the chart. Since query-overview is a Webcharts `chart` object, many default Webcharts settings are set in the [chartSettings.js file](https://github.com/RhoInc/query-overview/blob/master/src/configuration/chartSettings.js) as [described below](#webcharts-settings). Refer to the [Webcharts documentation](https://github.com/RhoInc/Webcharts/wiki/Chart-Configuration) for more details on these settings.\nIn addition to the standard Webcharts settings several custom settings not available in the base Webcharts library have been added to query-overview to facilitate data mapping and other custom functionality. These custom settings are described in detail below. All defaults can be overwritten by users.", - "version": "2.1.0", + "version": "2.1.2", "type": "object", "data-guidelines": "The Query Overview accepts [JSON](https://en.wikipedia.org/wiki/JSON) data of the format returned by [`d3.csv()`](https://github.com/d3/d3-3.x-api-reference/blob/master/CSV.md). The renderer visualizes clinical query data with **one row per query** plus the required variables specified below.", "data-structure": "one record per query", diff --git a/src/chart/onLayout/groupControls.js b/src/chart/onLayout/groupControls.js index de59ad7..108da6d 100644 --- a/src/chart/onLayout/groupControls.js +++ b/src/chart/onLayout/groupControls.js @@ -4,7 +4,7 @@ export default function groupControls() { //Group filters. this.controls.filters = { container: this.controls.wrap - .insert('div', '.qo-subsetter') + .insert('div', ':first-child') //placing filter controls first .classed('qo-control-grouping qo-control-grouping--filters', true) }; this.controls.filters.container @@ -27,7 +27,7 @@ export default function groupControls() { //Group other controls. this.controls.otherControls = { container: this.controls.wrap - .insert('div', ':first-child') + .insert('div', '.qo-dropdown') .classed('qo-control-grouping qo-control-grouping--other-controls', true) }; this.controls.otherControls.label = this.controls.otherControls.container diff --git a/src/styles.js b/src/styles.js index ea1d593..ff8784f 100644 --- a/src/styles.js +++ b/src/styles.js @@ -29,6 +29,9 @@ export default function styles(document) { '}', '.qo-component--controls .wc-controls {' + ' margin-bottom: 0;' + + ' display: flex;' + + ' width: 90%;' + + ' justify-content: space-around;' + '}', '.qo-control-grouping {' + ' display: inline-block;' + @@ -56,9 +59,13 @@ export default function styles(document) { Other controls \---------------------------------------------------------------------------------****/ + '.qo-control-grouping--other-controls {' + - ' width: 20%;' + - ' float: right;' + + ' float: left;' + + ' display: flex;' + + ' flex-wrap: wrap;' + + ' justify-content: space-evenly;' + + ' width: 25%;' + '}', '.qo-control-grouping--other-controls .control-group {' + ' width: 100%;' + @@ -88,7 +95,7 @@ export default function styles(document) { ' flex-wrap: wrap;' + '}', '.qo-radio .wc-control-label {' + - ' width: 100%;' + + ' width: 50%;' + '}', '.qo-radio .radio {' + ' margin-top: 0 !important;' + @@ -111,8 +118,8 @@ export default function styles(document) { \---------------------------------------------------------------------------------****/ '.qo-control-grouping--filters {' + - ' width: 20%;' + ' float: left;' + + ' align-content: baseline;' + ( typeof navigator !== 'undefined' && !/trident/i.test(navigator.userAgent) ? ' display: flex;' + @@ -123,7 +130,6 @@ export default function styles(document) { '}', '.qo-subsetter {' + ' margin: 5px 2px !important;' + - ' border-top: 1px solid #aaa;' + ' padding-top: 5px;' + ' display: inline-block !important;' + ' vertical-align: top;' + @@ -143,8 +149,9 @@ export default function styles(document) { \--------------------------------------------------------------------------------------***/ '.qo-component--chart {' + - ' width: 58%;' + + ' width: 100%;' + ' margin: 0 auto;' + + ' float: left;' + ' position: relative;' + '}', '.qo-button--reset-chart {' + From 7d30fd8fb9510accc8bddfc1bbaca35ea8f55e61 Mon Sep 17 00:00:00 2001 From: Preston Burns Date: Wed, 12 Jun 2019 16:05:51 -0400 Subject: [PATCH 2/2] update hover text for Status Group Answered --- queryOverview.js | 2 +- src/chart/onLayout/addControlTooltips.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/queryOverview.js b/queryOverview.js index bf1f62c..372f9fe 100644 --- a/queryOverview.js +++ b/queryOverview.js @@ -1125,7 +1125,7 @@ 'Query Age': 'Open queries are broken down into how long they have been open. All other queries are classified by status (answered, closed, cancelled).', 'Query Status': - 'Open: site has not responded to the issue\nAnswered: site has responded to issue; DM needs to review\nClosed: issue resolved\nCancelled: query cancelled by DM', + 'Open: site has not responded to the issue\nAnswered: site has responded to issue; individual opening query needs to review\nClosed: issue resolved\nCancelled: query cancelled by DM', 'Query Recency': 'Number of days a query has been open, regardless of its current status (applies only to queries opened in the past 30 days)', Form: diff --git a/src/chart/onLayout/addControlTooltips.js b/src/chart/onLayout/addControlTooltips.js index 0dbb1c4..ead14f2 100644 --- a/src/chart/onLayout/addControlTooltips.js +++ b/src/chart/onLayout/addControlTooltips.js @@ -16,7 +16,7 @@ export default function addControlTooltips() { 'Query Age': 'Open queries are broken down into how long they have been open. All other queries are classified by status (answered, closed, cancelled).', 'Query Status': - 'Open: site has not responded to the issue\nAnswered: site has responded to issue; DM needs to review\nClosed: issue resolved\nCancelled: query cancelled by DM', + 'Open: site has not responded to the issue\nAnswered: site has responded to issue; individual opening query needs to review\nClosed: issue resolved\nCancelled: query cancelled by DM', 'Query Recency': 'Number of days a query has been open, regardless of its current status (applies only to queries opened in the past 30 days)', Form: