src/widgets/Arrow.js
author cavaliet
Thu, 02 Jan 2014 16:40:25 +0100
branchnew-model
changeset 1019 3ab36f402b0c
parent 882 61c384dda19e
child 1020 198c2b79f5e1
permissions -rw-r--r--
update widgets after enhance in annotation platform.
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
     1
IriSP.Widgets.Arrow = function(player, config) {
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
     2
    IriSP.Widgets.Widget.call(this, player, config);
880
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
     3
    this.current_pilot_widget = this.pilot_widget
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
     4
};
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
     5
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
     6
IriSP.Widgets.Arrow.prototype = new IriSP.Widgets.Widget();
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
     7
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
     8
IriSP.Widgets.Arrow.prototype.defaults = {
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
     9
    arrow_height : 12,
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    10
    arrow_width : 20,
880
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    11
    base_height : 0,
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    12
    base_curve : 0,
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    13
    fill_url: IriSP.widgetsDir + '/img/pinstripe.png',
880
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    14
    fill_color: "#ffffff", //Gradients can be used, e.g. "90-#000-#fff" for vertical white-to-black
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    15
    stroke_color: "#b7b7b7",
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    16
    stroke_width: 1.5,
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    17
    animation_speed: 20
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    18
};
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    19
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    20
IriSP.Widgets.Arrow.prototype.draw = function() {
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    21
    this.height = this.arrow_height + this.base_height;
882
61c384dda19e Big refactoring
veltr
parents: 880
diff changeset
    22
    this.$.addClass("Ldt-Arrow").css({
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    23
        height: (1+this.height) + "px",
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    24
        "margin-top": "1px",
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    25
        overflow: "hidden"
882
61c384dda19e Big refactoring
veltr
parents: 880
diff changeset
    26
    });
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    27
    this.paper = new Raphael(this.container, this.width, 1+this.height );
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    28
    window.myArrow = this;
880
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    29
    this.svgArrow = this.paper.path('M0,' + this.height + 'L' + this.width + ',' + this.height);
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    30
    this.svgArrow.attr({
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    31
        stroke: this.stroke_color,
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    32
        "stroke-width": this.stroke_width,
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    33
        fill: this.fill_url ? ( 'url(' + this.fill_url + ')' ) : this.fill_color
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    34
    });
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    35
    this.moveToX(0);
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    36
};
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    37
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    38
IriSP.Widgets.Arrow.prototype.drawAt = function(_x) {
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    39
    _x = Math.max(0, Math.min(_x, this.width));
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    40
    var _d = 'M0,' + this.height
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    41
        + 'L0,' + Math.min( this.height, this.arrow_height + this.base_curve)
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    42
        + 'Q0,' + this.arrow_height
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    43
        + ' ' + Math.max(0, Math.min(this.base_curve, _x - this.arrow_width / 2)) + ',' + this.arrow_height
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    44
        + 'L' + Math.max(0, _x - this.arrow_width / 2) + ',' + this.arrow_height
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    45
        + 'L' + Math.max(0, _x - this.arrow_width / 2) + ',' + Math.min(this.arrow_height, 2 * this.arrow_height * _x / this.arrow_width)
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    46
        + 'L' + _x + ',0'
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    47
        + '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)
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    48
        + 'L' + Math.min(this.width, _x + this.arrow_width / 2) + ',' + this.arrow_height
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    49
        + 'L' + Math.min(this.width, Math.max(this.width - this.base_curve, _x + this.arrow_width / 2)) + ',' + this.arrow_height
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    50
        + 'Q' + this.width + ',' + this.arrow_height
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    51
        + ' ' + this.width + ',' + Math.min( this.height, this.arrow_height + this.base_curve)
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    52
        + 'L' + this.width + ',' + this.height;
880
4c7b33bf2795 Started work on CreateAnnotation and Mediafragment
veltr
parents: 876
diff changeset
    53
    this.svgArrow.attr({
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    54
        path: _d
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    55
    });
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    56
};
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    57
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    58
IriSP.Widgets.Arrow.prototype.moveToX = function(_x) {
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    59
    this.targetX = Math.max(0, Math.min(_x, this.width));
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    60
    if (typeof this.animInterval === "undefined") {
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    61
        this.animInterval = window.setInterval(
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    62
            this.functionWrapper("increment"),
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    63
            40
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    64
        );
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    65
    }
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    66
    this.increment();
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    67
};
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    68
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    69
IriSP.Widgets.Arrow.prototype.moveToTime = function(_t) {
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    70
    this.moveToX(this.width * _t / this.media.duration);
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    71
};
876
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    72
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    73
IriSP.Widgets.Arrow.prototype.increment = function() {
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    74
    if (typeof this.currentX === "undefined") {
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    75
        this.currentX = this.targetX;
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    76
    }
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    77
    if (this.currentX < this.targetX) {
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    78
        this.currentX = Math.min(this.targetX, this.currentX + this.animation_speed);
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    79
    }
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    80
    if (this.currentX > this.targetX) {
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    81
        this.currentX = Math.max(this.targetX, this.currentX - this.animation_speed);
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    82
    }
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    83
    if (this.currentX === this.targetX) {
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    84
        window.clearInterval(this.animInterval);
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    85
        this.animInterval = undefined;
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    86
    }
03967b6ada7c ArrowWidget, AnnotationWidget
veltr
parents:
diff changeset
    87
    this.drawAt(this.currentX);
1019
3ab36f402b0c update widgets after enhance in annotation platform.
cavaliet
parents: 882
diff changeset
    88
};