targetj 1.0.2

package/src/TargetManager.js

@@ -0,0 +1,228 @@
+function TargetManager() {
+    this.doneTargets = [];
+}
+
+TargetManager.prototype.setTargetValuesWithKeys = function(tmodel, keys, force) {
+    for (var i = 0; i < keys.length; i++) {
+        var key = keys[i];
+        if (tmodel.targetValues[key] && tmodel.getCallingTargetKey(key) === key) {
+            this.setTargetValue(tmodel, key, force);
+        }
+    }
+};
+
+TargetManager.prototype.setTargetValues = function(tmodel) {
+         
+    var activeKeys = Object.keys(tmodel.activeTargetKeyMap);
+    
+    if (tmodel.targets !== tmodel.actualValues.targets) {
+        tmodel.actualValues.targets =  tmodel.targets;
+        Object.keys(tmodel.targets).forEach(function(key) {
+            if (activeKeys.indexOf(key) === -1) {
+                activeKeys.push(key);
+            }
+        });
+    }
+                    
+    tmodel.targetUpdatingMap = {};
+    tmodel.targetUpdatingList = [];
+                    
+    for (var i = 0; i < activeKeys.length; i++) {
+       
+        var key = activeKeys[i];
+                                
+        if (tmodel.targetUpdatingMap[key]) {
+            continue;
+        }   
+        
+        if (tmodel.isTargetUpdating(key) && tmodel.getCallingTargetKey(key) !== key) {  
+            tmodel.targetUpdatingMap[key] = true;
+            tmodel.targetUpdatingList.push(key); 
+            continue;
+        }
+        
+        var result = this.setTargetValue(tmodel, key);
+
+        if (result) {
+            tmodel.targetUpdatingMap[key] = true;
+            tmodel.targetUpdatingList.push(key);  
+        } else if (tmodel.isTargetDone(key) && !tmodel.isTargetComplete(key)) {            
+            this.doneTargets.push({ tmodel: tmodel, key: key });
+        }
+    }
+
+    if (tmodel.getParent() && tmodel.targetUpdatingList.length === 0) {
+        tmodel.getParent().removeUpdatingChild(tmodel);
+    }
+};
+
+TargetManager.prototype.setTargetValue = function(tmodel, key, force) {
+    var target = tmodel.targets[key];
+    
+    if (!TUtil.isDefined(target)) {
+        delete tmodel.activeTargetKeyMap[key];        
+        return;
+    }
+
+    if (tmodel.isTargetUpdating(key) || !tmodel.targetValues[key] || tmodel.isTargetInLoop(key) || !tmodel.hasTargetGotExecuted(key) || force) {
+
+        if (tmodel.isTargetEnabled(key)) {
+
+            var valueOnly = target ? !!target.valueOnly : false;
+
+            if (!TUtil.isDefined(tmodel.getActualTimeStamp(key))) {
+                var cycle = tmodel.getTargetCycle(key);
+                var valueArray = TargetUtil.getValueStepsCycles(tmodel, target, cycle, valueOnly, key);               
+                TargetUtil.assignValueArray(tmodel, key, valueArray);
+            }
+
+            if (tmodel.isTargetInLoop(key) 
+                    || !tmodel.isTargetDone(key) 
+                    || !tmodel.isTargetComplete(key) 
+                    || TUtil.isDefined(tmodel.getActualTimeStamp(key))
+                    || !tmodel.hasTargetGotExecuted(key)) {
+                tmodel.activeTargetKeyMap[key] = true;
+            } else if (tmodel.activeTargetKeyMap[key]) {
+                delete tmodel.activeTargetKeyMap[key];
+            }
+            
+            if (TUtil.isDefined(tmodel.getActualTimeStamp(key))) {
+                var schedulePeriod = TargetUtil.getActualSchedulePeriod(tmodel, key, tmodel.getTargetStepInterval(key)); 
+                if (schedulePeriod > 0) {
+                    tapp.manager.scheduleRun(schedulePeriod, "actualInterval__" + tmodel.oid + "__" + key); 
+                }
+            }
+            
+            return (!tmodel.isTargetDone(key) && !tmodel.isTargetComplete(key)) || !tmodel.doesTargetEqualActual(key);
+        } else {
+            tmodel.activeTargetKeyMap[key] = true;
+        }
+    } else if (tmodel.activeTargetKeyMap[key]) {
+        delete tmodel.activeTargetKeyMap[key];
+    }
+    
+};
+
+TargetManager.prototype.setActualValues = function(tmodel)  { 
+    var i;
+    var target;
+    var key, keys = [];
+                                
+    for (i = 0; i < tmodel.targetUpdatingList.length; i++) {
+        key = tmodel.targetUpdatingList[i];
+                
+        target = tmodel.targets[key];
+        var status = tmodel.getTargetStatus(key);
+               
+        if (tmodel.isTargetUpdating(key)) {
+            keys.push(key);
+        }
+        
+        if (status !== tmodel.getTargetStatus(key)) {
+            tapp.manager.scheduleRun(1, tmodel.oid + "-" + key + '-statusChange');            
+        }
+    }
+             
+    for (i = 0; i < keys.length; i++) {
+        key = keys[i];
+        
+        var schedulePeriod = TargetUtil.getActualSchedulePeriod(tmodel, key, tmodel.getTargetStepInterval(key));
+        if (schedulePeriod === 0 || !TUtil.isDefined(schedulePeriod)) {
+            this.setActualValue(tmodel, key);            
+        } else {            
+            tapp.manager.scheduleRun(schedulePeriod, "actualInterval__" + tmodel.oid + "__" + key);  
+        }
+    }
+     
+};
+
+TargetManager.prototype.setJustActualValue = function(tmodel, key)  {
+    
+     var target = tmodel.targets[key];
+
+    if (!tmodel.targetValues[key] || (target && typeof target.enabledOn === 'function' && !target.enabledOn.call(tmodel, key))) {
+        return false;
+    }
+    
+    var targetValue = tmodel.getTargetValue(key);
+   
+    var step = tmodel.getTargetStep(key);
+    var easing = TUtil.isDefined(tmodel.getTargetEasing(key)) ? tmodel.getTargetEasing(key) : EasingEffects.linear;
+    var steps = tmodel.getTargetSteps(key);
+    var easingStep = easing(tmodel.getTargetStepPercent(key, step)); 
+    
+    if (step < steps) {
+        if (!TUtil.isDefined(tmodel.getLastActualValue(key))) {
+            tmodel.setLastActualValue(key, tmodel.actualValues[key]);
+        }
+        tmodel.actualValues[key] = typeof targetValue  === 'number' ? targetValue * easingStep + tmodel.getLastActualValue(key) * (1 - easingStep) : targetValue;
+    } else {          
+        tmodel.actualValues[key] = targetValue;
+    } 
+};
+
+TargetManager.prototype.setActualValue = function(tmodel, key) {
+    
+    if (!tmodel.targetValues[key]) return false;
+    
+    var targetValue = tmodel.getTargetValue(key);
+    var step = tmodel.getTargetStep(key);
+    var steps = tmodel.getTargetSteps(key);
+    var easing = TUtil.isDefined(tmodel.getTargetEasing(key)) ? tmodel.getTargetEasing(key) : EasingEffects.linear;
+    var cycle = tmodel.getTargetCycle(key);
+    var easingStep = easing(tmodel.getTargetStepPercent(key, step)); 
+    var cycleUpdate = false;
+    var stepInterval = tmodel.getTargetStepInterval(key);  
+    var lastUpdate = tmodel.getActualValueLastUpdate(key);
+    var oldValue = tmodel.actualValues[key], oldStep = step, oldCycle = cycle;
+    var now = browser.now();
+       
+    if (step < steps) { 
+        if (!TUtil.isDefined(tmodel.getLastActualValue(key))) {
+            tmodel.setLastActualValue(key, tmodel.actualValues[key]);
+        }
+        tmodel.actualValues[key] = typeof targetValue  === 'number' ? targetValue * easingStep + tmodel.getLastActualValue(key) * (1 - easingStep) : targetValue;
+       
+        tmodel.setActualValueLastUpdate(key);
+        tmodel.setActualValueLastUpdate(key);
+        
+        var stepIncrease = 1;
+        if (!TUtil.isDefined(stepInterval) && false) {
+            var expectedStepInterval = 10;
+            stepIncrease = step > 0 && lastUpdate && tapp.throttle === 0 && expectedStepInterval > 0 ? Math.max(1, Math.floor((now - lastUpdate) / expectedStepInterval)) : 1;
+        }
+                 
+        step = tmodel.setTargetStep(key, step + stepIncrease);         
+    } 
+
+    if (step >= steps) {        
+        tmodel.actualValues[key] = targetValue;
+        tmodel.setActualValueLastUpdate(key);
+                
+        if (typeof tmodel.targets[key] === 'object' && typeof tmodel.targets[key].onStepsEnd === 'function') {
+            tmodel.targets[key].onStepsEnd.call(tmodel, key, cycle);
+        }
+        
+        tmodel.updateTargetStatus(key);        
+
+        if (tmodel.getTargetCycle(key) < tmodel.getTargetCycles(key)) {
+            tmodel.setTargetCycle(key, tmodel.getTargetCycle(key) + 1);
+
+            cycleUpdate = true;
+            tmodel.resetTargetStep(key);
+            tmodel.resetLastActualValue(key);
+        }
+                
+    }
+    
+    TargetUtil.handleValueChange(tmodel, key, tmodel.actualValues[key], oldValue, oldStep, oldCycle);
+
+    if (TUtil.isDefined(tmodel.getActualTimeStamp(key)))  {
+        tmodel.resetActualTimeStamp(key); 
+    }
+       
+    if (step < steps || cycleUpdate) {
+        tapp.manager.scheduleRun(step < steps ? stepInterval : 0, tmodel.oid + "---" + key + "-" + step + "/" + steps + "-" + cycle + "-" + stepInterval);
+    }            
+    
+};

package/src/TargetUtil.js

@@ -0,0 +1,221 @@
+function TargetUtil() {}
+
+TargetUtil.extractInvisibles = function(tmodel, target, key) {
+    if (typeof target === 'object' && target) {
+        Object.keys(target).forEach(function(k) {
+            if (k === 'onInvisible') {
+                if (!tmodel.invisibleFunctions) {
+                    tmodel.invisibleFunctions = [];
+                }                         
+                tmodel.invisibleFunctions.push({ fn: target[k], key: key });
+            }
+        });                
+    }
+};
+
+TargetUtil.emptyValue = function() {
+    return {
+        value: undefined, 
+        step: 0, 
+        steps: 0, 
+        cycle: 0, 
+        cycles: 0, 
+        stepInterval: 0, 
+        lastActualValue: undefined,
+        actualTimeStamp: undefined,
+        actualValueLastUpdate: 0,
+        status: '',
+        executionCounter: 0,
+        callingTargetKey: undefined
+    };
+};
+
+TargetUtil.getValueStepsCycles = function(tmodel, _target, cycle, valueOnly, key) {
+    var value = 0, steps = 0, stepInterval = 0, cycles = 0;
+    var lastValue = tmodel.getValue(key);
+    
+    function getValue(target) {             
+        if (Array.isArray(target)) {                      
+            if (!target.valueOnly) {
+                if (typeof target[0] === 'function')    {
+                  value = target[0].call(tmodel, key, cycle, lastValue);
+                } else {
+                    value = target[0];
+                }
+                steps = target.length >= 2 ? target[1] : steps;
+                stepInterval = target.length >= 3 ? target[2] : stepInterval;                
+                cycles = target.length >= 4 ? target[3] : cycles;
+
+                return [value, steps, stepInterval, cycles];
+            } else {
+                return [target, steps, stepInterval, cycles];
+            }
+                
+        } else if (typeof target === 'object' && target && !(target instanceof TModel)) {
+            value = typeof target.value === 'function' ? target.value.call(tmodel, key, cycle, lastValue) : TUtil.isDefined(target.value) ? target.value : target;
+            steps = typeof target.steps === 'function' ? target.steps.call(tmodel, key, cycle) : TUtil.isDefined(target.steps) ? target.steps : 0;
+            stepInterval = typeof target.stepInterval === 'function' ? target.stepInterval.call(tmodel, key, cycle, tmodel.getTargetStepInterval(key), steps) : TUtil.isDefined(target.stepInterval) ? target.stepInterval : 0;            
+            cycles = typeof target.cycles === 'function' ? target.cycles.call(tmodel, key, cycle, tmodel.getTargetCycles(key)) : TUtil.isDefined(target.cycles) ? target.cycles : 0;
+
+            if (Array.isArray(value) && valueOnly === false && !value.valueOnly) {
+                return getValue(value);
+            } else {
+                return [value, steps, stepInterval, cycles];
+            }
+            
+        } else {               
+            if (typeof target === 'function') {
+                return getValue(target.call(tmodel, key, cycle, lastValue));
+            } else if (typeof target === 'number' 
+                    || typeof target === 'string'
+                    || typeof target === 'boolean'            
+                    || (target instanceof TModel)
+                    || (typeof target === 'object')) {
+                
+                return [target, steps, stepInterval, cycles];
+            } else {      
+                return [value, steps, stepInterval, cycles];
+            }
+        }
+    }
+   
+    var valueArray = getValue(_target);
+      
+    return valueArray;
+};
+
+TargetUtil.assignValueArray = function(tmodel, key, valueArray) {
+    
+    if (Array.isArray(valueArray)) {
+        var newValue = valueArray[0];
+        var newSteps = valueArray[1];
+        var newStepInterval = valueArray[2];        
+        var newCycles = valueArray[3];
+        var target = tmodel.targets[key];
+               
+        var cycle = tmodel.getTargetCycle(key);
+        var targetValue = tmodel.targetValues[key];        
+        var theValue = targetValue ? targetValue.value : undefined;
+        var newValueFlag = !TUtil.areEqual(theValue, newValue, target.deepEquality) 
+                || !TUtil.isDefined(targetValue)
+                || (!tmodel.isTargetUpdating(key) && !tmodel.doesTargetEqualActual(key));
+                
+        if (newValueFlag || targetValue.steps !== newSteps || targetValue.cycles !== newCycles || targetValue.stepInterval !== newStepInterval) {
+                     
+            tmodel.setTargetValue(key, newValue, newSteps, newStepInterval, newCycles, key);
+            tmodel.targetValues[key].executionCounter++;
+            
+            if (newValueFlag) {
+                tmodel.resetTargetStep(key);
+               
+                tmodel.resetLastActualValue(key);
+            }
+        }
+    }
+};
+
+TargetUtil.getIntervalValue = function(tmodel, key, interval) {
+    var intervalValue = typeof interval === 'function' ? interval.call(tmodel, key) : interval;
+
+    return TUtil.isNumber(intervalValue) ? intervalValue : 0;
+};
+
+TargetUtil.getActualSchedulePeriod = function(tmodel, key, intervalValue) {   
+    
+    var now = browser.now();
+    var pastPeriod;
+    var schedulePeriod = 0;
+    
+    if (intervalValue > 0) {
+        if (TUtil.isDefined(tmodel.getActualTimeStamp(key))) {
+            pastPeriod = now - tmodel.getActualTimeStamp(key);
+            if (pastPeriod < intervalValue) {
+                schedulePeriod = intervalValue - pastPeriod;
+            } else {
+                schedulePeriod = 0;
+            }
+        } else {
+            tmodel.setActualTimeStamp(key, now);
+            schedulePeriod = intervalValue;
+        }
+    } else if (TUtil.isDefined(tmodel.getActualTimeStamp(key))) {
+        pastPeriod = now - tmodel.getActualTimeStamp(key);
+        if (pastPeriod < 0) {
+            schedulePeriod = -pastPeriod;
+        } else {
+            schedulePeriod = 0;
+        }
+    }
+
+    return schedulePeriod;
+};
+
+TargetUtil.getTargetSchedulePeriod = function(tmodel, key, intervalValue) {   
+    
+    var now = browser.now();
+    var pastPeriod;
+    var schedulePeriod = 0;
+    
+    if (intervalValue > 0) {
+        if (TUtil.isDefined(tmodel.getTargetTimeStamp(key))) {
+            pastPeriod = now - tmodel.getTargetTimeStamp(key);
+            if (pastPeriod < intervalValue) {
+                schedulePeriod = intervalValue - pastPeriod;
+            } else {
+                schedulePeriod = 0;
+            }
+        } else {
+            tmodel.setTargetTimeStamp(key, now);
+            schedulePeriod = intervalValue;
+        }
+        
+    } else if (TUtil.isDefined(tmodel.getTargetTimeStamp(key))) {
+        pastPeriod = now - tmodel.getTargetTimeStamp(key);
+        if (pastPeriod < 0) {
+            schedulePeriod = -pastPeriod;
+        } else {
+            schedulePeriod = 0;
+        }
+    }
+
+    return schedulePeriod;
+};
+
+TargetUtil.handleValueChange = function(tmodel, key, newValue, lastValue, step, cycle) {
+    if (typeof tmodel.targets[key] === 'object' && typeof tmodel.targets[key].onValueChange === 'function') {
+        var valueChanged = !TUtil.areEqual(newValue, lastValue, tmodel.targets[key].deepEquality);
+        if (valueChanged) {
+            tmodel.targets[key].onValueChange.call(tmodel, key, newValue, lastValue, cycle);     
+        }
+    }    
+};
+
+TargetUtil.setWidthFromDom = function(child) {
+    var width = TUtil.isDefined(child.domWidth) ? child.domWidth.width : 10 ;
+    
+    if (!TUtil.isDefined(child.domWidth) 
+            || child.domWidth.height !== child.getHeight() 
+            || child.hasTargetUpdatedAfter('width', 'width', child.getParent())) {
+        child.$dom.width('auto');
+        width = child.$dom.width();
+    }
+    
+    child.domWidth = { width: width, height: child.getHeight() };
+    child.setValue('width', width);
+};
+
+
+TargetUtil.setHeightFromDom = function(child) {
+    var height = TUtil.isDefined(child.domHeight) ? child.domHeight.height : 10 ;
+    
+    if (!TUtil.isDefined(child.domHeight) 
+            || child.domHeight.width !== child.getWidth() 
+            || child.hasTargetUpdatedAfter('height', 'height', child.getParent())) {
+        child.$dom.height('auto');
+        height = child.$dom.height();
+    }
+
+    child.domHeight = { height: height, width: child.getWidth() };
+    
+    child.setValue('height', height);
+};

package/src/Viewport.js

@@ -0,0 +1,184 @@
+function Viewport(tmodel) {
+    
+    this.tmodel = tmodel;
+    this.xNext = 0;
+    this.xNorth = 0;
+    this.xWest = 0;
+    this.xEast = 0;
+    this.xSouth = 0;
+        
+    this.xOverflow = 0;
+    
+    this.xOffset = 0;
+    
+    this.yNext = 0;
+    this.yNorth = 0;
+    this.yWest = 0;
+    this.yEast = 0;   
+    this.ySouth = 0;
+    
+    this.yOffset = 0;
+
+    this.reset();
+}
+
+Viewport.prototype.reset = function() {
+    var x, y;
+    if (this.tmodel.type === 'BI') {
+        x = this.tmodel.getX() + this.tmodel.getScrollLeft();
+        y = this.tmodel.getY() + this.tmodel.getScrollTop();
+
+        this.xNext = x;
+        this.xNorth = x;
+        this.xEast = x;
+        this.xSouth = x;
+        this.xWest = x;
+        
+        this.xOverflow = TUtil.isDefined(this.tmodel.getValue('xOverflow')) ? this.tmodel.getValue('xOverflow') : x;
+
+        this.yNext = y;
+        this.yNorth = y;
+        this.yWest = y;
+        this.yEast = y;    
+        this.ySouth = this.tmodel.getRealParent().viewport ? this.tmodel.getRealParent().viewport.ySouth : y;
+              
+    } else {
+        x = this.tmodel.getX();
+        y = this.tmodel.getY();
+
+        this.xNext = x;
+        this.xNorth = x;
+        this.xEast = x;
+        this.xSouth = x;
+        this.xWest = x;
+        
+        this.xOverflow = TUtil.isDefined(this.tmodel.getValue('xOverflow')) ? this.tmodel.getValue('xOverflow') : x;
+
+
+        this.yNext = y;
+        this.yNorth = y;
+        this.yWest = y;
+        this.yEast = y;    
+        this.ySouth = y;       
+    }
+               
+    return this;
+};
+
+Viewport.prototype.setCurrentChild = function(child) {
+    this.currentChild = child;
+        
+    this.xOffset = child.getDomParent() ? -child.getDomParent().getX() : 0;
+    this.yOffset =  child.getDomParent() ? -child.getDomParent().getY() : 0;
+};
+
+Viewport.prototype.getXNext = function() {
+    return this.xNext + this.currentChild.getLeftMargin() + this.xOffset - this.tmodel.getScrollLeft();
+};
+
+Viewport.prototype.getYNext = function() { 
+    return this.yNext + this.currentChild.getTopMargin() + this.yOffset - this.tmodel.getScrollTop();
+};
+
+Viewport.prototype.isXVisible = function(child, x1, x2, minX, maxX) {
+    return child.type === 'BI' ? true : x1 <= maxX && x2 >= minX;
+};
+
+Viewport.prototype.isYVisible = function(child, y1, y2, minY, maxY) {
+    return y1 <= maxY && y2 >= minY;
+};
+
+Viewport.prototype.isVisible = function(child) {
+    
+    var parentScale = child.getDomParent() ? child.getDomParent().getScale() : 1;
+
+    var minX = tapp.dim.screen.x;
+    var minY = tapp.dim.screen.y;
+    var maxX = tapp.dim.screen.width;
+    var maxY = tapp.dim.screen.height;
+         
+    var x = child.getX();
+    var y = child.getY();
+    
+    if (child.getDomHolder() !== tapp.$dom) {
+        minX = child.getDomParent().isInFlow() ? child.getDomParent().absX : child.getDomParent().getX();
+        minY = child.getDomParent().isInFlow() ? child.getDomParent().absY : child.getDomParent().getY();
+        maxX = Math.min(maxX, minX + child.getDomParent().getWidth());
+        maxY = Math.min(maxY, minY + child.getDomParent().getHeight());
+        minX = Math.max(0, minX);
+        minY = Math.max(0, minY);
+
+        x = child.getDomParent().isInFlow() ? child.getDomParent().absX + child.getX() : child.getDomParent().getX() + child.getX();
+        y = child.getDomParent().isInFlow() ? child.getDomParent().absY + child.getY() : child.getDomParent().getY() + child.getY();
+                
+    } else if (child.type === 'BI') {
+        maxX = child.getRealParent().getX() + child.getRealParent().getWidth();
+        maxY = child.getRealParent().getY() + child.getRealParent().getHeight();        
+    }
+   
+    var scale = parentScale * child.getTargetScale();
+    var maxWidth = scale * child.getTargetWidth();
+    var maxHeight = scale * child.getTargetHeight();
+
+    child.xVisible = this.isXVisible(child, x, x + maxWidth, minX, maxX);
+    child.yVisible = this.isYVisible(child, y, y + maxHeight, minY, maxY);
+        
+    //browser.log(child.oid === 'desc')("oid: " + child.oid + " in " + this.tmodel.oid + " min-maxX:" + Math.round(minX) + "-" + Math.round(maxX) + " x:" + Math.round(x) + " w:" + Math.floor(maxWidth) +  " sc:" + scale +  " vx:" + child.xVisible);
+    //browser.log(child.oid === 'closeButton')("oid: " + child.oid + " in " + this.tmodel.oid + " min-maxY:" + Math.round(minY) + "-" + Math.round(maxY) + " y:" + Math.round(y) + " h:" + Math.floor(maxHeight) + " sc:" + scale + " vy:" + child.yVisible);
+
+    return child.isVisible();    
+};
+
+Viewport.prototype.isOverflow = function(outerXEast, innerXEast) {
+    if (TUtil.isNumber(outerXEast) && TUtil.isNumber(innerXEast)) {
+        return outerXEast > innerXEast;
+    }
+};
+
+Viewport.prototype.overflow = function() {
+    this.xNext = this.xOverflow;
+    this.yNext = this.ySouth;
+};
+
+Viewport.prototype.appendNewLine = function() {
+    
+    var height = this.currentChild.getHeight() * this.currentChild.getScale();
+
+    this.xNext = this.xOverflow;
+    this.yNext =  this.ySouth + height + this.currentChild.getTopMargin() + this.currentChild.getBottomMargin() + this.currentChild.getValue('appendNewLine');
+    
+    this.yEast = this.yNext;
+    this.xSouth = this.xNext;
+
+    this.ySouth = Math.max(this.yNext, this.ySouth);
+
+    this.currentChild.getRealParent().viewport.xEast = Math.max(this.currentChild.getRealParent().viewport.xEast, this.xEast);   
+    this.currentChild.getRealParent().viewport.ySouth = Math.max(this.currentChild.getRealParent().viewport.ySouth, this.ySouth); 
+};
+ 
+Viewport.prototype.nextLocation = function() {
+    
+    var innerWidth  = this.currentChild.getInnerWidth() * this.currentChild.getScale();
+    var innerHeight = this.currentChild.getInnerHeight() * this.currentChild.getScale();
+    var innerContentHeight = this.currentChild.getInnerContentHeight() * this.currentChild.getScale();
+            
+    var ySouth = this.yNext + innerHeight + this.currentChild.getTopMargin() + this.currentChild.getBottomMargin();
+    this.xNext += innerWidth + this.currentChild.getLeftMargin() + this.currentChild.getRightMargin();
+    this.yNext += innerContentHeight;
+
+    this.xSouth = this.xNext; 
+    this.yEast = this.yNext; 
+    
+    this.xEast = Math.max(this.xNext, this.xEast);
+    this.ySouth = Math.max(ySouth, this.ySouth);
+            
+    this.currentChild.getRealParent().viewport.xEast = Math.max(this.currentChild.getRealParent().viewport.xEast, this.xEast);       
+    this.currentChild.getRealParent().viewport.ySouth = Math.max(this.currentChild.getRealParent().viewport.ySouth, this.ySouth); 
+};
+
+Viewport.prototype.calcContentWidthHeight = function() {
+    this.tmodel.contentHeight = this.ySouth - this.yNorth;
+    this.tmodel.innerContentHeight = this.yEast - this.yNorth;
+    this.tmodel.innerContentWidth = this.xSouth - this.xWest;    
+    this.tmodel.contentWidth = this.xEast - this.xWest;
+};