1 IriSP.Widgets.Arrow = function(player, config) {

     2     IriSP.Widgets.Widget.call(this, player, config);

     3     this.current_pilot_widget = this.pilot_widget

     4 };

     5 

     6 IriSP.Widgets.Arrow.prototype = new IriSP.Widgets.Widget();

     7 

     8 IriSP.Widgets.Arrow.prototype.defaults = {

     9     arrow_height : 16,

    10     arrow_width : 24,

    11     base_height : 0,

    12     base_curve : 0,

    13     fill_url: IriSP.widgetsDir + '/img/pinstripe.png',

    14     fill_color: "#ffffff", //Gradients can be used, e.g. "90-#000-#fff" for vertical white-to-black

    15     stroke_color: "#b7b7b7",

    16     stroke_width: 1.5,

    17     animation_speed: 20,

    18     pilot_widget: "Annotation"

    19 }

    20 

    21 IriSP.Widgets.Arrow.prototype.draw = function() {

    22     this.height = this.arrow_height + this.base_height;

    23     this.$.addClass("Ldt-Arrow").css({

    24         height: this.height + "px",

    25         "margin-top": "1px"

    26     });

    27     this.paper = new Raphael(this.container, this.width, this.height );

    28     window.myArrow = this;

    29     this.svgArrow = this.paper.path('M0,' + this.height + 'L' + this.width + ',' + this.height);

    30     this.svgArrow.attr({

    31         stroke: this.stroke_color,

    32         "stroke-width": this.stroke_width,

    33         fill: this.fill_url ? ( 'url(' + this.fill_url + ')' ) : this.fill_color

    34     });

    35     this.moveTo(0);

    36     this.bindPopcorn("IriSP.Arrow.updatePosition","onUpdatePosition");

    37     this.bindPopcorn("IriSP.Arrow.takeover","onTakeover");

    38     this.bindPopcorn("IriSP.Arrow.release","onRelease");

    39 }

    40 

    41 IriSP.Widgets.Arrow.prototype.drawAt = function(_x) {

    42     _x = Math.floor(Math.max(0, Math.min(_x, this.width)));

    43     var _d = 'M0,' + this.height

    44         + 'L0,' + Math.min( this.height, this.arrow_height + this.base_curve)

    45         + 'Q0,' + this.arrow_height

    46         + ' ' + Math.max(0, Math.min(this.base_curve, _x - this.arrow_width / 2)) + ',' + this.arrow_height

    47         + 'L' + Math.max(0, _x - this.arrow_width / 2) + ',' + this.arrow_height

    48         + 'L' + Math.max(0, _x - this.arrow_width / 2) + ',' + Math.min(this.arrow_height, 2 * this.arrow_height * _x / this.arrow_width)

    49         + 'L' + _x + ',0'

    50         + 'L' + Math.min(this.width, _x + this.arrow_width / 2) + ',' + Math.min(this.arrow_height, 2 * this.arrow_height * ( this.width - _x ) / this.arrow_width)

    51         + 'L' + Math.min(this.width, _x + this.arrow_width / 2) + ',' + this.arrow_height

    52         + 'L' + Math.min(this.width, Math.max(this.width - this.base_curve, _x + this.arrow_width / 2)) + ',' + this.arrow_height

    53         + 'Q' + this.width + ',' + this.arrow_height

    54         + ' ' + this.width + ',' + Math.min( this.height, this.arrow_height + this.base_curve)

    55         + 'L' + this.width + ',' + this.height;

    56     this.svgArrow.attr({

    57         path: _d

    58     });

    59 }

    60 

    61 IriSP.Widgets.Arrow.prototype.moveTo = function(_x) {

    62     this.targetX = Math.floor(Math.max(0, Math.min(_x, this.width)));

    63     if (typeof this.animInterval === "undefined") {

    64         this.animInterval = window.setInterval(

    65             this.functionWrapper("increment"),

    66             40

    67         )

    68     }

    69     this.increment();

    70 }

    71 

    72 IriSP.Widgets.Arrow.prototype.increment = function() {

    73     if (typeof this.currentX === "undefined") {

    74         this.currentX = this.targetX;

    75     }

    76     if (this.currentX < this.targetX) {

    77         this.currentX = Math.min(this.targetX, this.currentX + this.animation_speed);

    78     }

    79     if (this.currentX > this.targetX) {

    80         this.currentX = Math.max(this.targetX, this.currentX - this.animation_speed);

    81     }

    82     if (this.currentX === this.targetX) {

    83         window.clearInterval(this.animInterval);

    84         this.animInterval = undefined;

    85     }

    86     this.drawAt(this.currentX);

    87 }

    88 

    89 IriSP.Widgets.Arrow.prototype.onUpdatePosition = function(_param) {

    90     if (_param.widget === this.current_pilot_widget) {

    91         if (typeof _param.x !== "undefined") {

    92             this.moveTo(_param.x);

    93         } else {

    94             this.moveTo(this.width * _param.time / this.source.getDuration());

    95         }

    96     }

    97 }

    98 

    99 IriSP.Widgets.Arrow.prototype.onTakeover = function(_widget) {

   100     this.current_pilot_widget = _widget;

   101 }

   102 

   103 IriSP.Widgets.Arrow.prototype.onRelease = function(_widget) {

   104     this.current_pilot_widget = this.pilot_widget;

   105 }