Skip to content

Commit

Permalink
fix(interaction): Prioritize mouse input (#280)
Browse files Browse the repository at this point in the history
Determine by userAgent and prioritize mouse input type for non-mobile environment.

Fix #92 
Close #280
  • Loading branch information
netil committed Feb 11, 2018
1 parent 8337555 commit 5cc3442
Show file tree
Hide file tree
Showing 3 changed files with 22 additions and 10 deletions.
10 changes: 9 additions & 1 deletion spec/interactions/interaction-spec.js
Expand Up @@ -30,6 +30,10 @@ describe("INTERACTION", () => {
};
});

it("inputType should be 'mouse", () => {
expect(chart.internal.inputType).to.be.equal("mouse");
});

it("should have 4 event rects properly", () => {
const lefts = [69, 130, 198, 403];
const widths = [61, 68, 205, 197.5];
Expand Down Expand Up @@ -406,7 +410,7 @@ describe("INTERACTION", () => {
});
});

it("set inputType.mouse=false", () => {
it("set option inputType.mouse=false", () => {
args.interaction.inputType.mouse = false;
});

Expand Down Expand Up @@ -528,6 +532,10 @@ describe("INTERACTION", () => {
};
});

it("inputType should be 'touch", () => {
expect(chart.internal.inputType).to.be.equal("touch");
});

it("showed each data points tooltip?", done => {
util.simulator(chart.internal.svg.node(), {
pos: [250,150],
Expand Down
7 changes: 4 additions & 3 deletions src/internals/ChartInternal.js
Expand Up @@ -1258,15 +1258,16 @@ export default class ChartInternal {
convertInputType() {
const $$ = this;
const config = $$.config;
const hasMouse = config.interaction_inputType_mouse ? ("onmouseover" in window) : false;
const isMobile = $$.isMobile();
const hasMouse = config.interaction_inputType_mouse && !isMobile ? ("onmouseover" in window) : false;
let hasTouch = false;

if (notEmpty(config.interaction_inputType_touch)) {
if (config.interaction_inputType_touch) {
// Ref: https://github.com/Modernizr/Modernizr/blob/master/feature-detects/touchevents.js
// On IE11 with IE9 emulation mode, ('ontouchstart' in window) is returning true
hasTouch = ("ontouchmove" in window) || (window.DocumentTouch && document instanceof window.DocumentTouch);
}

return (hasTouch && "touch") || (hasMouse && "mouse") || null;
return (hasMouse && "mouse") || (hasTouch && "touch") || null;
}
}
15 changes: 9 additions & 6 deletions src/internals/ua.js
Expand Up @@ -5,16 +5,19 @@
import ChartInternal from "./ChartInternal";
import {extend} from "./util";

const ua = window.navigator.userAgent;

extend(ChartInternal.prototype, {
isSafari() {
const ua = window.navigator.userAgent;

return ua.indexOf("Safari") >= 0 &&
ua.indexOf("Chrome") < 0;
return ua.indexOf("Safari") > -1 && !this.isChrome();
},

isChrome() {
return window.navigator.userAgent
.indexOf("Chrome") >= 0;
return ua.indexOf("Chrome") > -1;
},

isMobile() {
// https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent
return ua.indexOf("Mobi") > -1;
}
});

0 comments on commit 5cc3442

Please sign in to comment.