|
|
- enyo.kind({
- name: "enyo.AlphaJumper",
- classes: "enyo-alpha-jumper enyo-border-box",
- published: {
- marker: null
- },
- events: {
- onAlphaJump: ""
- },
- handlers: {
- ondown: "down",
- onmove: "move",
- onup: "up"
- },
- initComponents: function() {
- for (var s="A".charCodeAt(0), i=s; i<s+26; i++) {
- this.createComponent({content: String.fromCharCode(i)});
- }
- this.inherited(arguments);
- },
- down: function(inSender, inEvent) {
- if (this.tracking) {
- enyo.dispatcher.release();
- }
- this.tracking = true;
- if (this.hasNode()) {
- var b = this.node.getBoundingClientRect();
- // IE8 does not return width
- var w = (b.width === undefined) ? (b.right - b.left) : b.width;
- this.x = b.left + w/2;
- }
- enyo.dispatcher.capture(this);
- this.track(inEvent);
- },
- move: function(inSender, inEvent) {
- if (this.tracking) {
- this.track(inEvent);
- }
- },
- up: function() {
- if (this.tracking) {
- enyo.dispatcher.release();
- this.setMarker(null);
- this.tracking = false;
- }
- },
- track: function(inEvent) {
- var n = document.elementFromPoint(this.x, inEvent.pageY);
- var c = this.nodeToControl(n);
- if (c) {
- this.setMarker(c);
- }
- },
- nodeToControl: function(inNode) {
- for (var i=0, c$=this.controls, c; c=c$[i]; i++) {
- if (inNode == c.hasNode()) {
- return c;
- }
- }
- },
- markerChanged: function(inLast) {
- if (inLast) {
- inLast.removeClass("active");
- }
- if (this.marker) {
- this.marker.addClass("active");
- this.doAlphaJump({letter: this.marker.getContent(), index: this.marker.indexInContainer()});
- }
- }
- });
|