Skip to content
This repository was archived by the owner on Dec 17, 2024. It is now read-only.

Commit 84202e9

Browse files
starpitstarpit
committed
fix for sticky back button
Fixes #737
1 parent b639a05 commit 84202e9

File tree

12 files changed

+49
-38
lines changed

12 files changed

+49
-38
lines changed

‎app/content/js/bottom-stripe.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -189,4 +189,9 @@ exports.addModeButtons = (modes, entity, options) => {
189189
const defaultMode = modes && modes.find(({defaultMode}) => defaultMode),
190190
show = options && options.show || (defaultMode && (defaultMode.mode || defaultMode.label))
191191
bottomStripe.addModeButtons(modes, entity, show)
192+
193+
if (!options || !options.preserveBackButton) {
194+
const backContainer = document.querySelector(css.backContainer)
195+
backContainer.classList.remove('has-back-button')
196+
}
192197
}

‎app/content/js/picture-in-picture.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -195,5 +195,8 @@ module.exports = (command, highlightThis, container, returnTo, options) => event
195195
highlight(highlightThis)
196196

197197
// now we can safely begin executing the command
198-
return typeof command === 'string' ? repl.pexec(command) : command()
198+
return typeof command === 'string'
199+
? repl.pexec(command, { preserveBackButton: true })
200+
: typeof command === 'function' ? command()
201+
: ui.showEntity(command, { preserveBackButton: true })
199202
}

‎app/content/js/repl.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -245,13 +245,13 @@ const printResults = (block, nextBlock, resultDom, echo=true, execOptions, parse
245245

246246
} else if (response.type === 'custom' || response.renderAs == 'custom') {
247247
if (echo) {
248-
ui.showCustom(response)
248+
ui.showCustom(response, execOptions)
249249
ui.ok(resultDom.parentNode)
250250
}
251251

252252
} else if (response.type === 'activations') {
253253
// activation response
254-
ui.showActivation(response, resultDom)
254+
ui.showActivation(response, resultDom, execOptions)
255255

256256
} else if (response.verb === 'delete') {
257257
if (echo) ui.ok(resultDom.parentNode)

‎app/content/js/ui.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -529,7 +529,7 @@ const ui = (function() {
529529
* Render an activation response in the CLI portion of the UI
530530
*
531531
*/
532-
self.showActivation = (response, resultDom) => {
532+
self.showActivation = (response, resultDom, execOptions) => {
533533
if (!response.response && response.activationId) {
534534
// probably non-blocking invoke
535535
// say "ok: invoked foo with id xxx"
@@ -562,7 +562,7 @@ const ui = (function() {
562562

563563
} else {
564564
// blocking invoke, we have a response
565-
ui.showEntity(response)
565+
ui.showEntity(response, execOptions)
566566
ui.ok(resultDom)
567567
}
568568
}
@@ -936,7 +936,7 @@ const ui = (function() {
936936
// add mode buttons, if requested
937937
const modes = custom.modes
938938
if (!options || !options.leaveBottomStripeAlone) {
939-
bottomStripe.addModeButtons(modes, custom)
939+
bottomStripe.addModeButtons(modes, custom, options)
940940
sidecar.setAttribute('class', `${sidecar.getAttribute('data-base-class')} visible custom-content`)
941941
} else {
942942
sidecar.classList.add('custom-content')

‎app/plugins/modules/activation-visualizations/lib/cell.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@ exports.renderCell = (returnTo, cell, activation, isFailure=!activation.response
6868
}
6969

7070
if (activation) {
71-
cell.onclick = drilldownWith(returnTo, () => repl.pexec(`wsk activation get ${activation.activationId}`), cell)
71+
cell.onclick = drilldownWith(returnTo, `wsk activation get ${activation.activationId}`, cell)
7272

7373
// tooltip
7474
const result = activation.response && activation.response.result

‎app/plugins/modules/activation-visualizations/lib/grid.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -211,12 +211,12 @@ const _drawGrid = (options, {sidecar, leftHeader, rightHeader}, content, groupDa
211211
pathComponents = group.path.split('/'),
212212
packageName = pathComponents.length === 4 ? pathComponents[2] : ''
213213

214-
const onclick = drilldownWith(viewName, () => repl.pexec(`action get "${group.path}"`))
214+
const onclick = drilldownWith(viewName, `action get "${group.path}"`)
215215
ui.addNameToSidecarHeader(sidecar, group.name, packageName, onclick)
216216

217217
drawLegend(viewName, rightHeader, group, options)
218218
} else {
219-
const onclick = options.appName ? drilldownWith(viewName, () => repl.pexec(`app get "${options.appName}"`)) : undefined,
219+
const onclick = options.appName ? drilldownWith(viewName, `app get "${options.appName}"`) : undefined,
220220
pathComponents = (options.appName||'').split('/'),
221221
packageName = pathComponents.length === 4 ? pathComponents[2] : pathComponents.length === 2 && options.appName.charAt(0) !== '/' ? pathComponents[0] : '',
222222
name = pathComponents.length > 1 ? pathComponents[pathComponents.length - 1] : options.appName || titleWhenNothingSelected
@@ -265,7 +265,7 @@ const _drawGrid = (options, {sidecar, leftHeader, rightHeader}, content, groupDa
265265
labelInner.appendChild(labelAction)
266266
labelAction.innerText = actionName
267267
labelAction.className = 'clickable grid-label-part'
268-
labelAction.onclick = drilldownWith(viewName, () => repl.pexec(`grid ${optionsToString(options)} --zoom 1 --name "${group.path}"`))
268+
labelAction.onclick = drilldownWith(viewName, `grid ${optionsToString(options)} --zoom 1 --name "${group.path}"`)
269269
}
270270

271271
// render the grid

‎app/plugins/modules/activation-visualizations/lib/table.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -535,7 +535,7 @@ const _drawTable = (options, header, content, groupData, eventBus, sorter=defaul
535535
if (!redraw) {
536536
outlier.dom = dot
537537
dot.className = 'outlier-dot cell-show-only-when-outliers-shown'
538-
dot.onclick = drilldownWith(viewName, () => repl.pexec(`activation get ${activation.activationId}`))
538+
dot.onclick = drilldownWith(viewName, `activation get ${activation.activationId}`)
539539
barWrapper.appendChild(dot)
540540

541541
// try to explain why it's slow
@@ -572,7 +572,7 @@ const _drawTable = (options, header, content, groupData, eventBus, sorter=defaul
572572
} else {
573573
// drill down to grid, showing just successes
574574
cell.classList.add('clickable')
575-
cell.onclick = drilldownWith(viewName, () => repl.pexec(`grid ${optionsToString(options)} --success --zoom 1 --name "${group.path}" ${splitOptions}`))
575+
cell.onclick = drilldownWith(viewName, `grid ${optionsToString(options)} --success --zoom 1 --name "${group.path}" ${splitOptions}`)
576576
}
577577
cell.appendChild(countPart)
578578
countPart.innerText = group.nSuccesses
@@ -602,7 +602,7 @@ const _drawTable = (options, header, content, groupData, eventBus, sorter=defaul
602602

603603
// drill down to grid, showing just failures
604604
cell.classList.add('clickable')
605-
cell.onclick = drilldownWith(viewName, () => repl.pexec(`grid ${optionsToString(options)} --failure --zoom 1 --name "${group.path}" ${splitOptions}`))
605+
cell.onclick = drilldownWith(viewName, `grid ${optionsToString(options)} --failure --zoom 1 --name "${group.path}" ${splitOptions}`)
606606
if (group.nFailures === 0) {
607607
cell.classList.add('count-is-zero')
608608
cell.classList.remove('clickable')

‎app/plugins/modules/activation-visualizations/lib/timeline-histogram.js

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ const drawTimeline = (options, header) => activations => {
3838
content.style.width = 0 // ugh, chrome doesn't trigger a resize on shrink; see https://stackoverflow.com/a/7985973
3939

4040
// header title
41-
const onclick = options.appName ? drilldownWith(viewName, () => repl.pexec(`app get "${options.appName}"`)) : undefined
41+
const onclick = options.appName ? drilldownWith(viewName, `app get "${options.appName}"`) : undefined
4242
ui.addNameToSidecarHeader(sidecar, options.appName || titleWhenNothingSelected, undefined, onclick)
4343

4444
// add time range to the sidecar header
@@ -79,10 +79,10 @@ const prepare = (timelineData, theme) => {
7979
labels: [],
8080
datasets: [
8181
{ type: 'line', fill: false, borderWidth: theme.cost.borderWidth||6, pointBorderWidth: 3, pointBackgroundColor: theme.cost.pointBackgroundColor || 'rgba(255,255,255,0.5)', pointRadius: theme.cost.pointRadius === undefined ? 3 :theme.cost.pointRadius, pointHoverRadius: 6,
82-
xborderDash: [12,4], label: 'Cumulative Cost'.toUpperCase(), data: accumulate(cost), yAxisID: 'cost',
82+
borderDash: [12,1], label: 'Cumulative Cost', data: accumulate(cost), yAxisID: 'cost',
8383
borderColor: theme.cost.border, backgroundColor: theme.cost.bg},
84-
{ type: 'bar', fill, borderWidth, label: 'Successes'.toUpperCase(), data: success, hoverBackgroundColor: hover(theme.success), borderColor: theme.success.border, backgroundColor: theme.success.bg },
85-
{ type: 'bar', fill, borderWidth, label: 'Failures'.toUpperCase(), data: failure, hoverBackgroundColor: hover(theme.failure), borderColor: theme.failure.border, backgroundColor: theme.failure.bg }
84+
{ type: 'bar', fill, borderWidth, label: 'Successes', data: success, hoverBackgroundColor: hover(theme.success), borderColor: theme.success.border, backgroundColor: theme.success.bg },
85+
{ type: 'bar', fill, borderWidth, label: 'Failures', data: failure, hoverBackgroundColor: hover(theme.failure), borderColor: theme.failure.border, backgroundColor: theme.failure.bg }
8686
]
8787
}
8888

@@ -107,7 +107,7 @@ const prepare = (timelineData, theme) => {
107107
*/
108108
const _drawTimeline = ({options, content, timelineData}) => () => {
109109
const timeFormat = 'MM/DD/YYYY HH:mm',
110-
{ colors } = require(`../themes/${options.theme || 'ibm'}`)
110+
{ colors } = require(`../themes/${options.theme || 'colorbrewer1'}`)
111111

112112
/** render the chart */
113113
const render = () => {
@@ -215,7 +215,7 @@ const _drawTimeline = ({options, content, timelineData}) => () => {
215215
onClick: (event, {datasetIndex}) => {
216216
if (datasetIndex < 2) {
217217
const filter = datasetIndex === 0 ? 'success' : 'failure'
218-
drilldownWith(viewName, () => repl.pexec(`grid ${optionsToString(options)} --${filter}`))()
218+
drilldownWith(viewName, `grid ${optionsToString(options)} --${filter}`)()
219219
}
220220
},
221221
labels: {
@@ -324,7 +324,7 @@ const _drawTimeline = ({options, content, timelineData}) => () => {
324324
timeRangeEnd = _index === labels.length - 1 ? last : labels[_index + 1]
325325
if (_datasetIndex < 2) {
326326
const filter = _datasetIndex === 0 ? 'success' : 'failure'
327-
drilldownWith(viewName, () => repl.pexec(`grid ${optionsToString(options)} --since ${timeRangeStart} --upto ${timeRangeEnd} --${filter}`))()
327+
drilldownWith(viewName, `grid ${optionsToString(options)} --since ${timeRangeStart} --upto ${timeRangeEnd} --${filter}`)()
328328
}
329329
}
330330
}
@@ -342,7 +342,7 @@ const _drawTimeline = ({options, content, timelineData}) => () => {
342342
*/
343343
module.exports = (commandTree, prequire) => {
344344
const wsk = prequire('/ui/commands/openwhisk-core'),
345-
mkCmd = (cmd, extraOptions) => visualize(wsk, commandTree, cmd, viewName, drawTimeline, '\t--theme <orange-cyan|coral|acacia|highcharts|ibm> [default=ibm]\n\t--nBuckets configure the number of buckets along the x axis [default=20]', extraOptions),
345+
mkCmd = (cmd, extraOptions) => visualize(wsk, commandTree, cmd, viewName, drawTimeline, extraOptions),
346346
timelineIt = mkCmd('timeline'),
347347
pollingTimeline = mkCmd('...', { live: true })
348348

‎app/plugins/modules/activation-visualizations/lib/util.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -398,10 +398,11 @@ exports.optionsToString = options => {
398398
let str = ''
399399
for (let key in options) {
400400
// underscore comes from minimist
401-
if (key !== '_' && options[key] !== undefined && key !== 'name') {
401+
if (key !== '_' && options[key] !== undefined && key !== 'name' && key !== 'theme') {
402402
const dash = key.length === 1 ? '-' : '--',
403403
prefix = options[key] === false ? 'no-' : '', // e.g. --no-help
404404
value = options[key] === true || options[key] === false ? '' : ` ${options[key]}`
405+
405406
if (! (dash === '-' && options[key] === false)) {
406407
// avoid -no-q, i.e. single dash
407408
str = `${str} ${dash}${prefix}${key}${value}`
@@ -424,7 +425,7 @@ exports.darken = (color, factor=0.3) => Color(color).darken(factor).rgbString()
424425
*
425426
*/
426427
exports.ready = () => new Promise(resolve => {
427-
ui.injectScript('https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.bundle.min.js')
428+
ui.injectScript('https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.min.js')
428429

429430
const iter = () => {
430431
if (typeof Chart === 'undefined') {

‎app/plugins/modules/activation-visualizations/themes/colorbrewer1.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,9 @@
1717
const { transparent } = require('../lib/util')
1818

1919
exports.colors = ctx => {
20-
const orange = '#e31a1c',
21-
cyan = '#1f78b4',
22-
blue = '#ff7f00',
20+
const orange = '#e71d32',
21+
cyan = '#2166ac',
22+
blue = '#67a9cf',
2323
barBorder = transparent('#292525', 0.6)
2424

2525
const gradient = ctx.createLinearGradient(0, 0, 0, 800)
@@ -30,8 +30,8 @@ exports.colors = ctx => {
3030
fontFamily: 'ibm-plex-sans',
3131
success: { border: barBorder, bg: cyan },
3232
failure: { border: barBorder, bg: orange },
33-
cost: { border: blue, bg: gradient, borderWidth: 8, pointRadius: 6 },
34-
fontColor: '#5A5A5A',
33+
cost: { border: blue, bg: gradient, borderWidth: 4, pointRadius: 0 },
34+
fontColor: 'black',
3535
chart: {
3636
backgroundColor: '#fff'
3737
},

0 commit comments

Comments
 (0)