var iphoneCalcClass = function(){
    iphoneCalcClass.prototype.isIe6 = function(){
        var isIE6RE = new RegExp("MSIE 6");
        return isIE6RE.test(navigator.userAgent);
    }
    iphoneCalcClass.prototype.intval = function(num, fund){
        num = parseInt(num, fund);
        if (isNaN(num)) {
            return 0;
        } else {
            return num;
        }
    }
    iphoneCalcClass.prototype.getElementsByClassName = function(element, className){
        if (element && element.getElementsByClassName) {
            return element.getElementsByClassName(className);
        } else {
            var retnode = [];
            var myclass = new RegExp('\\b'+className+'\\b');
            var elem = element.getElementsByTagName('*');
            for (var i = 0; i < elem.length; i++) {
            var classes = elem[i].className;
            if (myclass.test(classes)) retnode.push(elem[i]);
            }
            return retnode;
        }
    }
    iphoneCalcClass.prototype.elementWidth = 248;
    iphoneCalcClass.prototype.animationSpeed = 10;
    iphoneCalcClass.prototype.animationShift = 31;
    iphoneCalcClass.prototype.animationStarted = false;
    iphoneCalcClass.prototype.currentStep = 0;
    iphoneCalcClass.prototype.request = false;
    iphoneCalcClass.prototype.xmlDoc = false;
    iphoneCalcClass.prototype.plans = {};
    iphoneCalcClass.prototype.getObjectLength = function(object){
        var i = 0;
        for (var x in object){i++;}
        return i;
    }
    iphoneCalcClass.prototype.setCurrentStep = function(step){this.currentStep = step;};
    iphoneCalcClass.prototype.getCurrentStep = function(){return this.currentStep;};
    iphoneCalcClass.prototype.animate = function(handlerElement, start, stop, step) {
        handlerElement.stepsList.style.marginLeft = "-" + start + "px";
        if (start > stop) {
            setTimeout(function(){handlerElement.animate(handlerElement, start-iphoneCalcClass.prototype.animationShift, stop, step);}, iphoneCalcClass.prototype.animationSpeed);
        } else if (start < stop) {
            setTimeout(function(){handlerElement.animate(handlerElement, start+iphoneCalcClass.prototype.animationShift, stop, step);}, iphoneCalcClass.prototype.animationSpeed);
        } else {
            handlerElement.animationStarted = false;
            this.setCurrentStep(step);
        }
    }
    iphoneCalcClass.prototype.setTabIndexOnStep = function(handlerElement, step){
        var inputs = handlerElement.htmlElement.getElementsByTagName('input');
        for (var i=0; i<inputs.length; i++){
            inputs[i].setAttribute('tabIndex', '-1');
        }
        inputs = handlerElement.stepsList.childNodes[step].getElementsByTagName('input');
        for (i=0; i<inputs.length; i++){
            inputs[i].setAttribute('tabIndex', i+1);
        }
    }
    iphoneCalcClass.prototype.getSize = function(size, ending, planData){
        if(!ending){ending = 'BT'};
        if (!planData){
            var ext = 'K';
        } else {
            var ext = 'k';
        }
        if (size > 1024) {
            size = size / 1024;
            ext = 'M';
        }
        if (size > 1024) {
            if (!planData){
                size = size / 1024;
            } else {
                size = size / 1000;
            }
            ext = 'G';
        }
        if (size > 1024) {
            if (!planData){
                size = size / 1024;
            } else {
                size = size / 1000;
            }
            ext = 'T';
        }
        if (size > 1024) {
            if (!planData){
                size = size / 1024;
            } else {
                size = size / 1000;
            }
            ext = 'P';
        }
        if (size > 1024) {
            if (!planData){
                size = size / 1024;
            } else {
                size = size / 1000;
            }
            ext = 'E';
        }
        size = size.toFixed(2).toString();
        while(size[size.length-1]=='0'){
            size = size.substr(0, size.length-1);
        }
        if (size[size.length-1]=='.'){size = size.substr(0, size.length-1);}
        return size + ' ' + ext + ending;
    }
    iphoneCalcClass.prototype.calculateOnDemand = function(handlerElement){
        //Calculation
        var iVpd = iphoneCalcClass.prototype.intval(document.getElementById('vpd').value);
		var iBitrate = iphoneCalcClass.prototype.intval(document.getElementById('bitrate').value);
		var iDuration = iphoneCalcClass.prototype.intval(document.getElementById('duration').value);
        var totalKb = ((iBitrate * iDuration * 60) / 8) * iVpd;
		var totalPerMonth = totalKb * 30;
		document.getElementById('onDemandTPM').innerHTML = iphoneCalcClass.prototype.getSize(totalPerMonth);
        document.getElementById('vpdLabel').innerHTML = iVpd;
        document.getElementById('bitrateLabel').innerHTML = iBitrate;
        document.getElementById('durationLabel').innerHTML = iDuration;
        //Plan
        var selectedPlan = 0;
        var plansCount = iphoneCalcClass.prototype.getObjectLength(handlerElement.plans);
        while (selectedPlan<(plansCount-1) && handlerElement.plans[selectedPlan].mediaDelivery<totalPerMonth){
            selectedPlan++;
        }
        document.getElementById('onDemandPlanName').innerHTML = handlerElement.plans[selectedPlan].name + ' Media Plan';
        document.getElementById('onDemandPlanTransfer').innerHTML = iphoneCalcClass.prototype.getSize(handlerElement.plans[selectedPlan].mediaDelivery,'BT',true);
        document.getElementById('onDemandPlanStorage').innerHTML = iphoneCalcClass.prototype.getSize(handlerElement.plans[selectedPlan].mediaStorage,'BT',true);
        document.getElementById('onDemandSubscribeButton').setAttribute('href', handlerElement.plans[selectedPlan].subscriptionURL);
        var cost = parseFloat(handlerElement.plans[selectedPlan].subscriptionRate).toFixed(2);
        if (cost != 0) {
            document.getElementById('onDemandPlanCost').innerHTML = '$' + cost;
        } else {
            document.getElementById('onDemandPlanCost').innerHTML = 'CALL';
        }
        
        handlerElement.stepForward(handlerElement, true);
    }
    iphoneCalcClass.prototype.calculateLiveEvent = function(handlerElement){
        handlerElement.showStep(handlerElement, 4, true);
        var iEpm = iphoneCalcClass.prototype.intval(document.getElementById('epm').value);
		var iBitrate_le = iphoneCalcClass.prototype.intval(document.getElementById('bitrate_le').value);
		var iDuration_le = iphoneCalcClass.prototype.intval(document.getElementById('duration_le').value);
        var iUsers = iphoneCalcClass.prototype.intval(document.getElementById('users').value);
        var totalKb = ((iBitrate_le * iDuration_le * 60) / 8) * iUsers;
        var eventPeak = iBitrate_le * iUsers;
		var totalPerMonth = totalKb * iEpm;
		document.getElementById('liveEventTPM').innerHTML = iphoneCalcClass.prototype.getSize(totalPerMonth);
        document.getElementById('liveEventTPE').innerHTML = iphoneCalcClass.prototype.getSize(eventPeak, 'bps', true);
        document.getElementById('epmLabel').innerHTML = iEpm;
        document.getElementById('usersLabel').innerHTML = iUsers;
        document.getElementById('bitrate_leLabel').innerHTML = iBitrate_le;
        document.getElementById('duration_leLabel').innerHTML = iDuration_le;

        //Plan
        //Corporate is minimum for live events
        var selectedPlan = 2;
        var plansCount = iphoneCalcClass.prototype.getObjectLength(handlerElement.plans);
        while (selectedPlan<(plansCount-1) && handlerElement.plans[selectedPlan].mediaDelivery<totalPerMonth){
            selectedPlan++;
        }
        document.getElementById('liveEventPlanName').innerHTML = handlerElement.plans[selectedPlan].name + ' Media Plan';
        document.getElementById('liveEventPlanTransfer').innerHTML = iphoneCalcClass.prototype.getSize(handlerElement.plans[selectedPlan].mediaDelivery,'BT',true);
        document.getElementById('liveEventPlanStorage').innerHTML = iphoneCalcClass.prototype.getSize(handlerElement.plans[selectedPlan].mediaStorage,'BT',true);
        document.getElementById('liveEventSubscribeButton').setAttribute('href', handlerElement.plans[selectedPlan].subscriptionURL);
        var cost = parseFloat(handlerElement.plans[selectedPlan].subscriptionRate).toFixed(2);
        if (cost != 0) {
            document.getElementById('liveEventPlanCost').innerHTML = '$' + cost;
        } else {
            document.getElementById('liveEventPlanCost').innerHTML = 'CALL';
        }

        handlerElement.stepForward(handlerElement, true);
    }
    iphoneCalcClass.prototype.showStep = function(handlerElement, step, animate){
        if (!handlerElement.animationStarted){
            handlerElement.setTabIndexOnStep(handlerElement,step);
            var previousStep = handlerElement.getCurrentStep();
            if (animate){
                handlerElement.animationStarted = true;
                iphoneCalcClass.prototype.animate(
                    handlerElement,
                    previousStep*iphoneCalcClass.prototype.elementWidth,
                    step*iphoneCalcClass.prototype.elementWidth,
                    step
                );
            } else {
                this.stepsList.style.marginLeft = "-" + step*this.elementWidth + "px";
                this.setCurrentStep(step);
            }
        }
    };
    iphoneCalcClass.prototype.stepBack = function(handlerElement,animate){
        this.showStep(handlerElement,this.getCurrentStep() - 1, animate);
    }
    iphoneCalcClass.prototype.stepForward = function(handlerElement,animate){
        this.showStep(handlerElement,this.getCurrentStep() + 1, animate);
    }
    iphoneCalcClass.prototype.steps = {};
    /* Creating Main HTML Element */
    this.htmlElement = document.createElement('div');
    this.htmlElement.setAttribute('id','streamCalc');
    var wrapperElement = document.createElement('div');
    wrapperElement.setAttribute('id', 'streamCalcWrapper');
    this.application = document.createElement('div');    
    this.application.setAttribute('id','streamCalcCanvas');
    wrapperElement.appendChild(this.application);
    this.htmlElement.appendChild(wrapperElement);
    document.body.appendChild(this.htmlElement);
    /* Creating Transparent Overlay */
    iphoneCalcClass.prototype.overlayElement = document.createElement('div');
    iphoneCalcClass.prototype.overlayElement.setAttribute('id','streamCalcOverlay');
    var handlerElement = this;
    if (iphoneCalcClass.prototype.isIe6()) {
		iphoneCalcClass.prototype.overlayElement.style.width = (document.documentElement.clientWidth > document.body.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) + 'px';
		iphoneCalcClass.prototype.overlayElement.style.height = (document.documentElement.clientHeight > document.body.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) + 'px';
		iphoneCalcClass.prototype.overlayIframe = document.createElement('iframe');
		iphoneCalcClass.prototype.overlayIframe.setAttribute('id','streamCalcOverlayIframe');
		iphoneCalcClass.prototype.overlayIframe.style.width = (document.documentElement.clientWidth > document.body.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) + 'px';
		iphoneCalcClass.prototype.overlayIframe.style.height = (document.documentElement.clientHeight > document.body.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) + 'px';

        var wrapper = document.createElement('div');
        wrapper.className = 'wrapper';
        iphoneCalcClass.prototype.overlayElement.appendChild(wrapper);

		this.overlayElement.appendChild(iphoneCalcClass.prototype.overlayIframe);
        window.onresize = function(){
            iphoneCalcClass.prototype.overlayElement.style.width = (document.documentElement.clientWidth > document.body.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) + 'px';
            iphoneCalcClass.prototype.overlayElement.style.height = (document.documentElement.clientHeight > document.body.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) + 'px';
            iphoneCalcClass.prototype.overlayIframe.style.width = (document.documentElement.clientWidth > document.body.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) + 'px';
            iphoneCalcClass.prototype.overlayIframe.style.height = (document.documentElement.clientHeight > document.body.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) + 'px';
        }
	}
    iphoneCalcClass.prototype.overlayElement.onclick = function(){handlerElement.toggle();return false;};
    document.body.appendChild(this.overlayElement);

    iphoneCalcClass.prototype.parseXML = function(response){
        iphoneCalcClass.prototype.xmlDoc = response.responseXML.documentElement;
        var plans = handlerElement.xmlDoc.getElementsByTagName('plan');
        for (var i = 0; i < plans.length; i++){
            iphoneCalcClass.prototype.plans[i] = {};
            for (var k = 0; k < plans[i].attributes.length; k++){
                iphoneCalcClass.prototype.plans[i][plans[i].attributes[k].name] = plans[i].attributes[k].value;
            }
            iphoneCalcClass.prototype.plans[i]['mediaDelivery'] = parseFloat(iphoneCalcClass.prototype.plans[i]['mediaDelivery'])*1000*1024;
            iphoneCalcClass.prototype.plans[i]['mediaStorage'] = parseFloat(iphoneCalcClass.prototype.plans[i]['mediaStorage'])*1000*1024;
            var planPeriods = plans[i].getElementsByTagName("periodPlan");
            for (var k = 0; k < planPeriods.length; k++){
                var periods = planPeriods[k].getElementsByTagName("period");
                for ( var j=0; j<periods.length; j++){
                    if (periods[j].attributes.getNamedItem('period').value == 'Month') {
                        iphoneCalcClass.prototype.plans[i]['subscriptionURL'] = periods[j].attributes.getNamedItem('url').value;
                        iphoneCalcClass.prototype.plans[i]['subscriptionRate'] = planPeriods[k].attributes.getNamedItem('rate').value;
                    }
                }
            }
        }
    }

    iphoneCalcClass.prototype.init = function(handlerElement, handlerClassname, standalone) {
        /* Init XML data */
		var r, res;
		r = new RegExp("[^.]+\.[^.]+$");
		res = r.exec(window.location.host);
		document.domain = res[0];
        var xmlIframe = document.createElement('iframe');
			xmlIframe.setAttribute('id','xmlIframe');
            xmlIframe.setAttribute('src','http://amws.'+document.domain+'/loadPriceMatrix.html');
            handlerElement.application.appendChild(xmlIframe);
        /* Init Handlers */
        var handlers = iphoneCalcClass.prototype.getElementsByClassName(document, handlerClassname);
        for (var i=0; i<handlers.length; i++) {
            handlers[i].onclick = function() {
                handlerElement.toggle();
                return false;
            }
        }
        /* Init Steps */
        var inputElement = null;
        var divElement = null;
        var divElement2 = null;
        var divElement3 = null;
        var spanElement = null;
        var linkElement = null;
        var headerElement = null;
        var paragraphElement = null;
        var listElement = null;
        var listItem = null;
        var infoButton = document.createElement('a');
            infoButton.className = 'infoButton';
            infoButton.setAttribute('href', '#');
        var backButton = document.createElement('a');
            backButton.className = 'backButton';
            backButton.setAttribute('href', '#');
        this.steps = {};
        this.stepsList = document.createElement('ul');
        this.stepsList.setAttribute('id', 'streamCalcStepsList');
        this.application.appendChild(this.stepsList);
        // Step 1
        this.steps[0] = document.createElement('li');
        this.steps[0].setAttribute('id', 'streamCalcStep1');
            divElement = document.createElement('div');
            divElement.className = "row clips";
            inputElement = document.createElement('input');
            inputElement.className = "number";
            inputElement.setAttribute('type', 'text');
            inputElement.setAttribute('id', 'vpd');
            divElement.appendChild(inputElement);
            spanElement = document.createElement('span');
            spanElement.appendChild(document.createTextNode('clips per day'));
            divElement.appendChild(spanElement);
            this.steps[0].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "row minutes";
            inputElement = document.createElement('input');
            inputElement.className = "number";
            inputElement.setAttribute('type', 'text');
            inputElement.setAttribute('id', 'duration');
            divElement.appendChild(inputElement);
            spanElement = document.createElement('span');
            spanElement.appendChild(document.createTextNode('minutes per clip'));
            divElement.appendChild(spanElement);
            this.steps[0].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "row bitrate";
            inputElement = document.createElement('input');
            inputElement.className = "number";
            inputElement.setAttribute('type', 'text');
            inputElement.setAttribute('id', 'bitrate');
            divElement.appendChild(inputElement);
            spanElement = document.createElement('span');
            spanElement.appendChild(document.createTextNode('clip bitrate in kbps'));
            divElement.appendChild(spanElement);
            this.steps[0].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "description";
            divElement.appendChild(document.createTextNode('Have a live event coming up? Click the Live Events tab and fill in the fields to see what your event could use. (All results are just estimates, your bandwidth will probably be different.)'));
            this.steps[0].appendChild(divElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.onclick = function(){handlerElement.calculateOnDemand(handlerElement);return false;}
            linkElement.className = 'mainButton';
            this.steps[0].appendChild(linkElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.className = 'rightTabButton';
            linkElement.onclick = function(){handlerElement.showStep(handlerElement, 3, false); return false;}
            this.steps[0].appendChild(linkElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.className = 'leftTabButton';
            linkElement.onclick = function(){handlerElement.showStep(handlerElement, 3, false); return false;}
            this.steps[0].appendChild(linkElement);
            this.steps[0].appendChild(infoButton.cloneNode(true));
        // Step 2
        this.steps[1] = document.createElement('li');
        this.steps[1].setAttribute('id', 'streamCalcStep2');
            headerElement = document.createElement('h3');
            headerElement.appendChild(document.createTextNode('On-Demand calculation'));
            this.steps[1].appendChild(headerElement);
            this.steps[1].appendChild(infoButton.cloneNode(true));
            this.steps[1].appendChild(backButton.cloneNode(true));
            linkElement = backButton.cloneNode(true);
            linkElement.className = "bottomButton forwardButton";
            this.steps[1].appendChild(linkElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.className = "topButton backButton";
            this.steps[1].appendChild(linkElement);
            divElement = document.createElement('div');
            divElement.className = "calculationResults";
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Transfer per Month'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.setAttribute('id', 'onDemandTPM');
                    divElement3.className = "value";
                    divElement3.appendChild(document.createTextNode('0 MBT'));
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
            this.steps[1].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "resultStats";
            paragraphElement = document.createElement('p');
            paragraphElement.appendChild(document.createTextNode('This traffic estimate is based on:'));
            divElement.appendChild(paragraphElement);
            listElement = document.createElement('ul');
                listItem = document.createElement('li');
                listItem.appendChild(document.createTextNode('average '));
                spanElement = document.createElement('span');
                spanElement.setAttribute('id', 'vpdLabel');
                spanElement.appendChild(document.createTextNode('0'));
                listItem.appendChild(spanElement);
                listItem.appendChild(document.createTextNode(' videos per day for a month'));
                listElement.appendChild(listItem);
                listItem = document.createElement('li');
                listItem.appendChild(document.createTextNode('average '));
                spanElement = document.createElement('span');
                spanElement.setAttribute('id', 'durationLabel');
                spanElement.appendChild(document.createTextNode('0'));
                listItem.appendChild(spanElement);
                listItem.appendChild(document.createTextNode(' minutes long videos'));
                listElement.appendChild(listItem);
                listItem = document.createElement('li');
                 listItem.appendChild(document.createTextNode('typical video encoded at '));
                spanElement = document.createElement('span');
                spanElement.setAttribute('id', 'bitrateLabel');
                spanElement.appendChild(document.createTextNode('0'));
                listItem.appendChild(spanElement);
                listItem.appendChild(document.createTextNode(' kbps'));
                listElement.appendChild(listItem);
            divElement.appendChild(listElement);
            this.steps[1].appendChild(divElement);
        // Step 3
        this.steps[2] = document.createElement('li');
        this.steps[2].setAttribute('id', 'streamCalcStep3');
            this.steps[2].appendChild(infoButton.cloneNode(true));
            this.steps[2].appendChild(backButton.cloneNode(true));
            divElement = document.createElement('div');
            divElement.className = "recommendedPlan";
            divElement.appendChild(document.createTextNode('Media+ Media Plan'));
            divElement.setAttribute('id', 'onDemandPlanName');
            this.steps[2].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "calculationResults";
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Monthly Subscription'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.className = "value";
                    divElement3.setAttribute('id', 'onDemandPlanCost');
                    divElement3.appendChild(document.createTextNode('$0'));
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Transfer per Month'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.className = "value";
                    divElement3.setAttribute('id', 'onDemandPlanTransfer');
                    divElement3.appendChild(document.createTextNode('50 TBT'));
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Storage included'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.className = "value";
                    divElement3.setAttribute('id', 'onDemandPlanStorage');
                    divElement3.appendChild(document.createTextNode('5 TB'));
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
            this.steps[2].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "description callUs";
                paragraphElement = document.createElement('p');
                paragraphElement.appendChild(document.createTextNode('Have questions? Feel free to call us at:'));
                divElement.appendChild(paragraphElement);
                paragraphElement = document.createElement('p');
                paragraphElement.appendChild(document.createTextNode('+1 (323) 657 5969'));
                paragraphElement.className = "number";
                divElement.appendChild(paragraphElement);
            this.steps[2].appendChild(divElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.setAttribute('target', '_blank');
            linkElement.setAttribute('id', 'onDemandSubscribeButton');
            linkElement.className = 'mainButton';
            this.steps[2].appendChild(linkElement);
        // Step 4
        this.steps[3] = document.createElement('li');
        this.steps[3].setAttribute('id', 'streamCalcStep4');
            divElement = document.createElement('div');
            divElement.className = "row clips";
            inputElement = document.createElement('input');
            inputElement.className = "number";
            inputElement.setAttribute('type', 'text');
            inputElement.setAttribute('id', 'epm');
            divElement.appendChild(inputElement);
            spanElement = document.createElement('span');
            spanElement.appendChild(document.createTextNode('events per month'));
            divElement.appendChild(spanElement);
            this.steps[3].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "row users";
            inputElement = document.createElement('input');
            inputElement.className = "number";
            inputElement.setAttribute('type', 'text');
            inputElement.setAttribute('id', 'users');
            divElement.appendChild(inputElement);
            spanElement = document.createElement('span');
            spanElement.appendChild(document.createTextNode('users per event'));
            divElement.appendChild(spanElement);
            this.steps[3].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "row minutes";
            inputElement = document.createElement('input');
            inputElement.className = "number";
            inputElement.setAttribute('type', 'text');
            inputElement.setAttribute('id', 'duration_le');
            divElement.appendChild(inputElement);
            spanElement = document.createElement('span');
            spanElement.appendChild(document.createTextNode('minutes per event'));
            divElement.appendChild(spanElement);
            this.steps[3].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "row bitrate";
            inputElement = document.createElement('input');
            inputElement.className = "number";
            inputElement.setAttribute('type', 'text');
            inputElement.setAttribute('id', 'bitrate_le');
            divElement.appendChild(inputElement);
            spanElement = document.createElement('span');
            spanElement.appendChild(document.createTextNode('event bitrate in kbps'));
            divElement.appendChild(spanElement);
            this.steps[3].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "description";
            divElement.appendChild(document.createTextNode('For video files, click the On-Demand tab and fill in the fields for amonthly estimate. (All results are just estimates, your bandwidth will probably be different.'));
            this.steps[3].appendChild(divElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.className = 'mainButton';
            linkElement.onclick = function(){handlerElement.calculateLiveEvent(handlerElement);return false;}
            this.steps[3].appendChild(linkElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.className = 'leftTabButton';
            linkElement.onclick = function(){handlerElement.showStep(handlerElement, 0, false); return false;}
            this.steps[3].appendChild(linkElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.className = 'rightTabButton';
            linkElement.onclick = function(){handlerElement.showStep(handlerElement, 0, false); return false;}
            this.steps[3].appendChild(linkElement);
            linkElement = document.createElement('a');
            this.steps[3].appendChild(infoButton.cloneNode(true));
        this.steps[4] = document.createElement('li');
        this.steps[4].setAttribute('id', 'streamCalcStep5');
            this.steps[4].appendChild(infoButton.cloneNode(true));
            this.steps[4].appendChild(backButton.cloneNode(true));
            linkElement = backButton.cloneNode(true);
            linkElement.className = "bottomButton forwardButton";
            this.steps[4].appendChild(linkElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.className = "topButton backButton";
            this.steps[4].appendChild(linkElement);
            headerElement = document.createElement('h3');
            headerElement.appendChild(document.createTextNode('Live Events calculation'));
            this.steps[4].appendChild(headerElement);
            divElement = document.createElement('div');
            divElement.className = "calculationResults";
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Transfer per Month'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.setAttribute('id','liveEventTPM');
                    divElement3.className = "value";
                    divElement3.appendChild(document.createTextNode('0 MBT'));
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Peak (per event)'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.setAttribute('id','liveEventTPE');
                    divElement3.className = "value";
                    divElement3.appendChild(document.createTextNode('0 MBT'));
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
            this.steps[4].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "resultStats";
            paragraphElement = document.createElement('p');
            paragraphElement.appendChild(document.createTextNode('This traffic estimate is based on:'));
            divElement.appendChild(paragraphElement);
            listElement = document.createElement('ul');
                listItem = document.createElement('li');
                spanElement = document.createElement('span');
                spanElement.setAttribute('id', 'epmLabel');
                spanElement.appendChild(document.createTextNode('0'));
                listItem.appendChild(spanElement);
                listItem.appendChild(document.createTextNode(' events per month'));
                listElement.appendChild(listItem);
                listItem = document.createElement('li');
                spanElement = document.createElement('span');
                spanElement.setAttribute('id', 'usersLabel');
                spanElement.appendChild(document.createTextNode('0'));
                listItem.appendChild(spanElement);
                listItem.appendChild(document.createTextNode(' users per event'));
                listElement.appendChild(listItem);
                listItem = document.createElement('li');
                spanElement = document.createElement('span');
                spanElement.setAttribute('id', 'duration_leLabel');
                spanElement.appendChild(document.createTextNode('0'));
                listItem.appendChild(spanElement);
                listItem.appendChild(document.createTextNode(' minutes per event'));
                listElement.appendChild(listItem);
                listItem = document.createElement('li');
                spanElement = document.createElement('span');
                spanElement.setAttribute('id', 'bitrate_leLabel');
                spanElement.appendChild(document.createTextNode('0'));
                listItem.appendChild(spanElement);
                listItem.appendChild(document.createTextNode(' kbps bitrate'));
                listElement.appendChild(listItem);
            divElement.appendChild(listElement);
            this.steps[4].appendChild(divElement);
        this.steps[5] = document.createElement('li');
        this.steps[5].setAttribute('id', 'streamCalcStep6');
            this.steps[5].appendChild(infoButton.cloneNode(true));
            this.steps[5].appendChild(backButton.cloneNode(true));
            divElement = document.createElement('div');
            divElement.className = "recommendedPlan";
            divElement.appendChild(document.createTextNode('Media+ Media Plan'));
            divElement.setAttribute('id', 'liveEventPlanName');
            this.steps[5].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "calculationResults";
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Monthly Subscription'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.className = "value";
                    divElement3.appendChild(document.createTextNode('$0'));
                    divElement3.setAttribute('id', 'liveEventPlanCost');
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Transfer per Month'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.className = "value";
                    divElement3.appendChild(document.createTextNode('50 TBT'));
                    divElement3.setAttribute('id', 'liveEventPlanTransfer');
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
                divElement2 = document.createElement('div');
                divElement2.className = "resultRow";
                    divElement3 = document.createElement('div');
                    divElement3.className = "name";
                    divElement3.appendChild(document.createTextNode('Storage included'));
                    divElement2.appendChild(divElement3);
                    divElement3 = document.createElement('div');
                    divElement3.className = "value";
                    divElement3.appendChild(document.createTextNode('5 TB'));
                    divElement3.setAttribute('id', 'liveEventPlanStorage');
                    divElement2.appendChild(divElement3);
                divElement.appendChild(divElement2);
            this.steps[5].appendChild(divElement);
            divElement = document.createElement('div');
            divElement.className = "description callUs";
                paragraphElement = document.createElement('p');
                paragraphElement.appendChild(document.createTextNode('Have questions? Feel free to call us at:'));
                divElement.appendChild(paragraphElement);
                paragraphElement = document.createElement('p');
                paragraphElement.appendChild(document.createTextNode('+1 (323) 657 5969'));
                paragraphElement.className = "number";
                divElement.appendChild(paragraphElement);
            this.steps[5].appendChild(divElement);
            linkElement = document.createElement('a');
            linkElement.setAttribute('href', '#');
            linkElement.className = 'mainButton';
            linkElement.setAttribute('id', 'liveEventSubscribeButton');
            linkElement.setAttribute('target', '_blank');
            this.steps[5].appendChild(linkElement);
        this.steps[6] = document.createElement('li');
        this.steps[6].setAttribute('id', 'streamCalcStepAbout');
            var aboutBackButton = backButton.cloneNode(true);
            aboutBackButton.setAttribute('id', 'aboutBackButton');
            this.steps[6].appendChild(aboutBackButton);
        for (i in this.steps) {
            handlerElement.stepsList.appendChild(this.steps[i]);
        }
        /* Start: Events observing */
        var backButtons = iphoneCalcClass.prototype.getElementsByClassName(handlerElement.htmlElement, 'backButton');
        for (var i = 0; i<backButtons.length; i++) {
            backButtons[i].onclick = function(){handlerElement.stepBack(handlerElement,true);return false;};
        }
        var forwardButtons = iphoneCalcClass.prototype.getElementsByClassName(handlerElement.htmlElement, 'forwardButton');
        for (var i = 0; i<forwardButtons.length; i++) {
            forwardButtons[i].onclick = function(){handlerElement.stepForward(handlerElement,true);return false;};
        }
        var infoButtons = iphoneCalcClass.prototype.getElementsByClassName(handlerElement.htmlElement, 'infoButton');
        for (var i = 0; i<infoButtons.length; i++) {
            infoButtons[i].onclick = function(){
                var currentStep = handlerElement.getCurrentStep();
                document.getElementById('aboutBackButton').onclick = function(){
                    handlerElement.showStep(handlerElement, currentStep, false);
                    return false;
                }
                handlerElement.showStep(handlerElement, 6, false);
                return false;
            };
        }
        var links = handlerElement.htmlElement.getElementsByTagName('a');
        for (var i=0; i<links.length; i++){
            links[i].setAttribute('tabIndex', '-1');
        }
        handlerElement.setTabIndexOnStep(handlerElement, 0);
        /* End: Events observing */
        /* Start: Images Preloading */
        var images2load = {};
        images2load[0] = 'http://www.streamcalc.net/streamcalc/images/closeButton.png';
        images2load[1] = 'http://www.streamcalc.net/streamcalc/images/step2.png';
        images2load[2] = 'http://www.streamcalc.net/streamcalc/images/iphoneBg.png';
        images2load[3] = 'http://www.streamcalc.net/streamcalc/images/stepAbout.png';
        images2load[4] = 'http://www.streamcalc.net/streamcalc/images/step3.png';
        images2load[5] = 'http://www.streamcalc.net/streamcalc/images/step5.png';
        images2load[6] = 'http://www.streamcalc.net/streamcalc/images/step4.png';
        images2load[7] = 'http://www.streamcalc.net/streamcalc/images/step1.png';
        images2load[8] = 'http://www.streamcalc.net/streamcalc/images/screenTop.png';
        images2load[9] = 'http://www.streamcalc.net/streamcalc/images/inputNumber.png';
        images2load[10] = 'http://www.streamcalc.net/streamcalc/images/rows/bitrate.png';
        images2load[11] = 'http://www.streamcalc.net/streamcalc/images/rows/minutes.png';
        images2load[12] = 'http://www.streamcalc.net/streamcalc/images/rows/clips.png';
        images2load[13] = 'http://www.streamcalc.net/streamcalc/images/rows/users.png';
        var imagePreloader = new Image();
        for (var i in images2load){
            imagePreloader.src = images2load[i];
        }

        if (standalone) {
            handlerElement.toggle();
            handlerElement.overlayElement.onclick = null;
        } else {
            linkElement = document.createElement('a');
            linkElement.className = 'closeCalcButton';
            linkElement.setAttribute('href','#');
            linkElement.onclick = function(){handlerElement.toggle();return false;};
            handlerElement.htmlElement.appendChild(linkElement);
        }
        /* End: Images Preloading */
    }
    iphoneCalcClass.prototype.toggle = function(){
        var className = 'visible';
        if (this.htmlElement.className && this.htmlElement.className.match(new RegExp(className+"\\b"))!=null) {
            this.htmlElement.className=this.htmlElement.className.replace(new RegExp(className+"\\b"), "");
            this.overlayElement.className=this.overlayElement.className.replace(new RegExp(className+"\\b"), "");
        } else {
            this.htmlElement.className=this.htmlElement.className.replace(new RegExp(className+"\\b"), "");
            this.htmlElement.className+=" "+className;
            this.overlayElement.className=this.overlayElement.className.replace(new RegExp(className+"\\b"), "");
            this.overlayElement.className+=" "+className;
        }
    }
}