UX: Don't dock back button while dragging

This commit is contained in:
Robin Ward 2016-12-22 12:48:02 -05:00
parent 681f246df8
commit 46f2a11a80
1 changed files with 9 additions and 2 deletions

View File

@ -48,12 +48,17 @@ function timelineDate(date) {
createWidget('timeline-scroller', { createWidget('timeline-scroller', {
tagName: 'div.timeline-scroller', tagName: 'div.timeline-scroller',
buildKey: () => `timeline-scroller`,
defaultState() {
return { dragging: false };
},
buildAttributes() { buildAttributes() {
return { style: `height: ${SCROLLER_HEIGHT}px` }; return { style: `height: ${SCROLLER_HEIGHT}px` };
}, },
html(attrs) { html(attrs, state) {
const { current, total, date } = attrs; const { current, total, date } = attrs;
const contents = [ const contents = [
@ -64,7 +69,7 @@ createWidget('timeline-scroller', {
contents.push(h('div.timeline-ago', timelineDate(date))); contents.push(h('div.timeline-ago', timelineDate(date)));
} }
if (attrs.showDockedButton) { if (attrs.showDockedButton && !state.dragging) {
contents.push(attachBackButton(this)); contents.push(attachBackButton(this));
} }
let result = [ h('div.timeline-handle'), h('div.timeline-scroller-content', contents) ]; let result = [ h('div.timeline-handle'), h('div.timeline-scroller-content', contents) ];
@ -77,10 +82,12 @@ createWidget('timeline-scroller', {
}, },
drag(e) { drag(e) {
this.state.dragging = true;
this.sendWidgetAction('updatePercentage', e.pageY); this.sendWidgetAction('updatePercentage', e.pageY);
}, },
dragEnd(e) { dragEnd(e) {
this.state.dragging = false;
if ($(e.target).is('button')) { if ($(e.target).is('button')) {
this.sendWidgetAction('goBack'); this.sendWidgetAction('goBack');
} else { } else {