Rename airtime_mvc/ to legacy/

legacy/public/js/waveformplaylist/time_scale.js

@@ -0,0 +1,170 @@
+'use strict';
+
+var TimeScale = function() {
+
+};
+
+TimeScale.prototype.init = function(config) {
+
+    var that = this,
+        canv,
+        div,
+        resizeTimer;
+
+    makePublisher(this);
+
+    div = document.getElementsByClassName("playlist-time-scale")[0];
+
+    if (div === undefined) {
+        return;
+    }
+    
+    canv = document.createElement("canvas");
+    this.canv = canv;
+    this.context = canv.getContext('2d');
+    this.config = config;
+    this.container = div; //container for the main time scale.
+
+    //TODO check for window resizes to set these.
+    this.width = this.container.clientWidth;
+    this.height = this.container.clientHeight;
+
+    canv.setAttribute('width', this.width);
+    canv.setAttribute('height', this.height);
+
+    //array of divs displaying time every 30 seconds. (TODO should make this depend on resolution)
+    this.times = [];
+
+    this.prevScrollPos = 0; //checking the horizontal scroll (must update timeline above in case of change)
+
+    //TODO check scroll adjust.
+    function doneResizing() {
+        that.width = that.container.clientWidth;
+        that.height = that.container.clientHeight;
+
+        canv.setAttribute('width', that.width);
+        canv.setAttribute('height', that.height);
+
+        that.drawScale();
+    };
+
+    function onResize() {
+        clearTimeout(resizeTimer);
+        resizeTimer = setTimeout(doneResizing, 100);
+    };
+
+    TimeScale.prototype.onResize = onResize;
+
+    this.drawScale();
+};
+
+/*
+    Return time in format mm:ss
+*/
+TimeScale.prototype.formatTime = function(seconds) {
+    var out, m, s;
+
+    s = seconds % 60;
+    m = (seconds - s) / 60;
+
+    if (s < 10) {
+        s = "0"+s;
+    }
+
+    out = m + ":" + s;
+
+    return out;
+};
+
+TimeScale.prototype.clear = function() {
+   
+    this.container.innerHTML = "";
+    this.context.clearRect(0, 0, this.width, this.height);
+};
+
+TimeScale.prototype.drawScale = function(offset) {
+    var cc = this.context,
+        canv = this.canv,
+        colors = this.config.getColorScheme(),
+        pix,
+        res = this.config.getResolution(),
+        SR = this.config.getSampleRate(),
+        pixPerSec = SR/res,
+        pixOffset = offset || 0, //caused by scrolling horizontally
+        i,
+        end,
+        counter = 0,
+        pixIndex,
+        container = this.container,
+        width = this.width,
+        height = this.height,
+        div,
+        time,
+        sTime,
+        fragment = document.createDocumentFragment(),
+        scaleY,
+        scaleHeight;
+
+
+    this.clear();
+
+    fragment.appendChild(canv);
+    cc.fillStyle = colors.timeColor;
+    end = width + pixOffset;
+
+    for (i = 0; i < end; i = i + pixPerSec) {
+
+        pixIndex = ~~(i);
+        pix = pixIndex - pixOffset;
+
+        if (pixIndex >= pixOffset) {
+
+            //put a timestamp every 30 seconds.
+            if (counter % 30 === 0) {
+
+                sTime = this.formatTime(counter);
+                time = document.createTextNode(sTime);
+                div = document.createElement("div");
+        
+                div.style.left = pix+"px";
+                div.appendChild(time);
+                fragment.appendChild(div);
+
+                scaleHeight = 10;
+                scaleY = height - scaleHeight;
+            }
+            else if (counter % 5 === 0) {
+                scaleHeight = 5;
+                scaleY = height - scaleHeight;
+            }
+            else {
+                scaleHeight = 2;
+                scaleY = height - scaleHeight;
+            }
+
+            cc.fillRect(pix, scaleY, 1, scaleHeight);
+        }
+
+        counter++;  
+    }
+
+    container.appendChild(fragment);
+};
+
+TimeScale.prototype.onTrackScroll = function() {
+    var scroll = this.config.getTrackScroll(),
+        scrollX = scroll.left;    
+
+    if (scrollX !== this.prevScrollPos) {
+        this.prevScrollPos = scrollX;
+        this.drawScale(scrollX);
+    }
+};
+
+TimeScale.prototype.onResolutionChange = function() {
+    var scroll = this.config.getTrackScroll(),
+        scrollX = scroll.left;    
+
+    this.drawScale(scrollX);
+};
+