Daniel@0
|
1 /* global ChordVis */
|
Daniel@0
|
2 'use strict';
|
Daniel@0
|
3
|
Daniel@0
|
4 App.module('TooltipModule', function (TooltipModule, App, Backbone, Marionette, $, _) {
|
Daniel@0
|
5 var renderFunctions = {};
|
Daniel@0
|
6
|
Daniel@0
|
7 var OBJECT_TYPE_CHORD_SEQUENCE = 1;
|
Daniel@0
|
8
|
Daniel@0
|
9 TooltipModule.addInitializer(function() {
|
Daniel@0
|
10
|
Daniel@0
|
11
|
Daniel@0
|
12 TooltipModule.TooltipView = Backbone.View.extend({
|
Daniel@0
|
13
|
Daniel@0
|
14 initialize: function(options) {
|
Daniel@0
|
15 var _this = this;
|
Daniel@0
|
16
|
Daniel@0
|
17 _this.$tooltip = $("<div/>").addClass("tooltip").appendTo("body");
|
Daniel@0
|
18 },
|
Daniel@0
|
19
|
Daniel@0
|
20 update: function(mouseEvent, title, target) {
|
Daniel@0
|
21 var _this = this;
|
Daniel@0
|
22 // removing the tooltip
|
Daniel@0
|
23 if (!mouseEvent || mouseEvent.type == "mouseout" || mouseEvent.type == "mouseup" || !title) {
|
Daniel@0
|
24 _this.previousTarget = null;
|
Daniel@0
|
25 _this.$tooltip.addClass("tooltip_animation_slow-opacity");
|
Daniel@0
|
26 _this.$tooltip.removeClass("tooltip_state_visible");
|
Daniel@0
|
27 } else {
|
Daniel@0
|
28 if (target != _this.previousTarget) {
|
Daniel@0
|
29 _this.$tooltip.removeClass("tooltip_animation_slow-opacity");
|
Daniel@0
|
30 _this.$tooltip.addClass("tooltip_state_visible");
|
Daniel@0
|
31
|
Daniel@0
|
32 _this.$tooltip.html(title);
|
Daniel@0
|
33 }
|
Daniel@0
|
34
|
Daniel@0
|
35 _this.$tooltip.position({
|
Daniel@0
|
36 of: mouseEvent,
|
Daniel@0
|
37 my: "left+20 topt+20",
|
Daniel@0
|
38 collision: "flip flip"
|
Daniel@0
|
39 });
|
Daniel@0
|
40 };
|
Daniel@0
|
41 }
|
Daniel@0
|
42 // update: function(mouseEvent, object) {
|
Daniel@0
|
43 // var _this = this;
|
Daniel@0
|
44 // var objectType = null;
|
Daniel@0
|
45 // if (object && object.sequenceAsObject && object.sequenceAsObject && object.sequenceAsObject.frequency && object.sequenceAsObject.chordsInOrder) {
|
Daniel@0
|
46 // objectType = OBJECT_TYPE_CHORD_SEQUENCE;
|
Daniel@0
|
47 // }
|
Daniel@0
|
48 // if (!mouseEvent || mouseEvent.type == "mouseout" || !objectType) {
|
Daniel@0
|
49 // _this.previousObject = null;
|
Daniel@0
|
50 // _this.$tooltip.addClass("tooltip_animation_slow-opacity");
|
Daniel@0
|
51 // _this.$tooltip.removeClass("tooltip_state_visible");
|
Daniel@0
|
52 // } else {
|
Daniel@0
|
53 // if (object != _this.previousObject) {
|
Daniel@0
|
54 // _this.$tooltip.removeClass("tooltip_animation_slow-opacity");
|
Daniel@0
|
55 // _this.$tooltip.addClass("tooltip_state_visible");
|
Daniel@0
|
56 // // Chord sequence
|
Daniel@0
|
57 // if (objectType == OBJECT_TYPE_CHORD_SEQUENCE) {
|
Daniel@0
|
58 // _this.previousObject = object;
|
Daniel@0
|
59 //
|
Daniel@0
|
60 // var chordIds = _.pluck(object.sequenceAsObject.chordsInOrder, "id");
|
Daniel@0
|
61 // var chordTitles = [];
|
Daniel@0
|
62 // for (var i = 0; i < chordIds.length; i++) {
|
Daniel@0
|
63 // chordTitles.push(_this.bankOfChords.get(chordIds[i]).getNormalisedId());
|
Daniel@0
|
64 // }
|
Daniel@0
|
65 // var frequency = object.sequenceAsObject.frequency;
|
Daniel@0
|
66 // _this.$tooltip.html(_.str.sprintf("%s<br/>in %s%% of recordings", chordTitles.join(" → "), _.str.numberFormat(frequency, 2)));
|
Daniel@0
|
67 // }
|
Daniel@0
|
68 // }
|
Daniel@0
|
69 //
|
Daniel@0
|
70 // _this.$tooltip.position({
|
Daniel@0
|
71 // of: mouseEvent,
|
Daniel@0
|
72 // my: "left+20 topt+20",
|
Daniel@0
|
73 // collision: "flip flip"
|
Daniel@0
|
74 // });
|
Daniel@0
|
75 // };
|
Daniel@0
|
76 // }
|
Daniel@0
|
77 });
|
Daniel@0
|
78
|
Daniel@0
|
79 TooltipModule.tooltipView = new TooltipModule.TooltipView();
|
Daniel@0
|
80
|
Daniel@0
|
81 TooltipModule._updateTooltipForDOMNodeWithExTitle = function(mouseEvent) {
|
Daniel@0
|
82 TooltipModule.tooltipView.update(mouseEvent, $(this).attr("tooltip-title"), this);
|
Daniel@0
|
83 };
|
Daniel@0
|
84
|
Daniel@0
|
85
|
Daniel@0
|
86 TooltipModule.update = function(mouseEvent, title, target) {
|
Daniel@0
|
87 TooltipModule.tooltipView.update(mouseEvent, title, target);
|
Daniel@0
|
88 };
|
Daniel@0
|
89
|
Daniel@0
|
90 TooltipModule.convertTitlesToTooltips = function($container) {
|
Daniel@0
|
91 $container.find("[title]").each(function(){
|
Daniel@0
|
92 var $this = $(this);
|
Daniel@0
|
93 $this
|
Daniel@0
|
94 .attr("tooltip-title", $this.attr("title"))
|
Daniel@0
|
95 .removeAttr("title");
|
Daniel@0
|
96 if (App.options.enableTooltipsForControlsWithTitles) {
|
Daniel@0
|
97 $this
|
Daniel@0
|
98 .on('mouseover', TooltipModule._updateTooltipForDOMNodeWithExTitle)
|
Daniel@0
|
99 .on('mouseout', TooltipModule._updateTooltipForDOMNodeWithExTitle)
|
Daniel@0
|
100 .on('mousemove', TooltipModule._updateTooltipForDOMNodeWithExTitle)
|
Daniel@0
|
101 .on('mouseup', TooltipModule._updateTooltipForDOMNodeWithExTitle);
|
Daniel@0
|
102 }
|
Daniel@0
|
103
|
Daniel@0
|
104 });
|
Daniel@0
|
105 };
|
Daniel@0
|
106 });
|
Daniel@0
|
107 }); |