// Scalebar - Creates a (vertical) colorized scalebar.
//
// the main reason this is a dynamically built is so we can change
// the units if necessary (not implemented yet).
//
// History:
// Feb 3, 2006, Original version, Noel Gorelick, (gorelick@asu.edu)

SCALEBAR_IMAGE_SRC = "images/scalebar.png"
SCALEBAR_HEIGHT = 150;

var Scalebar = Class.create();
Scalebar.prototype = {};

// LIMITS is an array of [low , high] indicating the range of the scalebar
// STEPS is the array of tic marks.  It's assumed the img is linearly
//       scaled from low to high
// Each text legend will have UNITS appended to it.
Scalebar.prototype.initialize = function(doc, limits, steps, units) {
    this.container = makeDiv(doc, { position: "absolute" 
                                    , bottom: px(50) 
                                    , left: px(10) 
                                    , height: px(SCALEBAR_HEIGHT) 
                                    , fontSize: px(10) 
                                    , whiteSpace: "nowrap" 
                                    , fontFamily: 'Arial, sans serif' 
                                   });
    this.legend = makeDiv(doc);

    var bot = limits[0];
    var top = limits[1]
    var delta = top - bot;

    // create and place the tic marks and labels
    for (var i = 0 ; i < steps.length ; i++) {
        var offset = SCALEBAR_HEIGHT * ((top - steps[i]) / delta);
        var div = makeDiv(doc, {  position: 'absolute'
                                , top: px(offset)
                                , height: px(1)
                                });

        var tic = makeDiv(doc,  {   position: 'absolute'
                                    , height: px(1)
                                    , width: px(20)
                                    , border: "#000 solid 0px"
                                    , borderTopWidth: px(1)
                                });

        var label = makeDiv(doc, {  position: 'absolute'
                                    , top: em(-0.6)
                                    , left: px(25)
                                    , lineHeight: em(1.0)
                                });
        label.appendChild(doc.createTextNode(steps[i] + " " + units));

        div.appendChild(tic);
        div.appendChild(label);
        this.legend.appendChild(div);
    }

    var caption = makeDiv(doc, { position: 'absolute'
                               , top: em(-2.0)
                               , left: px(0)
                               });
    caption.appendChild(doc.createTextNode("Elevation"));

    this.container.appendChild(makeImage(doc, SCALEBAR_IMAGE_SRC));
    this.container.appendChild(this.legend);
    this.container.appendChild(caption);
}

Scalebar.prototype.show = function() { 
    this.getContainer().style.visibility = "visible";
}
Scalebar.prototype.hide = function() { 
    this.getContainer().style.visibility = "hidden";
}
Scalebar.prototype.getContainer = function() { 
    return(this.container);
}

// If the scalebar is going to become dynamic, this should
// destroy the legend and recompute it with new values.
Scalebar.prototype.updateLegend = function() {
    
}

Scalebar.prototype.setLimits = function(limits) {
    this.limits = limits;
    this.updateLegend();
}