var Statistics = Class.create();

Statistics.prototype = {

    /**
     * Class constructor
     */
    initialize: function (serverAddress, cameraId, areaId, container) {
        this.serverAddress  = serverAddress;
        this.cameraId       = cameraId;
        this.areaId         = areaId;
        this.parentEl       = container;
    },


    /**
     * Creates the statistics element
     *
     * @param   {int}   parentCount     The number of parent elements
     *                                  (0 = none,
     *                                   1 = camera element,
     *                                   2 = server and camera)
     */
    create: function (parentCount) {

        var server  = OTOS.ElementConfig.SERVERDATA[this.serverAddress],
            camera  = server['cameras'][this.cameraId],
            area    = camera['imageAreas'][this.areaId],
            areaSuffix = this.serverAddress + '_' + this.cameraId + '_' + this.areaId,
            pLink = Builder.node('a', { href: 'javascript: void(0)' }, [ 'Url' ]);

        var headerText = (parentCount == 0)
                ? (server['name'] + ' / '+ camera['name'] + ' / ' + area['name'])
                : area['name'];
            hLevel = (parentCount == 0) ? 'h2' : (parentCount == 1 ? 'h3' : 'h4');

        var el = Builder.node('div', {
                className: AREA_ELEMENT_CLASS + ' element',
                id: AREA_ELEMENT_ID_PREFIX + '_' + areaSuffix
            }, [
                (OTOS.Main && OTOS.Main.TREEMODE && parentCount == 0)
                    ? OTOS.Dom.createHeading(hLevel, headerText)
                    : Builder.node(hLevel, { className: 'clearfix' }, [
                        Builder.node('span', { className: 'left' }, [ headerText ]),
                        Builder.node('span', { className: 'right' }, [ pLink ])
                    ]),
                Builder.node('div', { className: 'statContent' }, [
                    Builder.node('iframe', {
                        frameBorder: '0',
                        id: 'iframe_' + areaSuffix,
                        name: 'iframe_' + areaSuffix
                    })
                ])/*,
                pLink*/
            ]);

        this.createStatisticsLinkObserver(pLink);

        return el;

    },


    /**
     * Creates the statistics element when the OTOS.Main.TREEMODE is true. Only the statistics element
     * will be in the content area.
     */
    show: function () {

        OTOS.Dom.removeChildNodes(this.parentEl);
        OTOS.Tree.updateTree();
        OTOS.Main.TREEMODE = true;

        this.parentEl.appendChild(this.create(0));
        OTOS.Statistics.refreshStatistics(null, null, null);
        window.location.hash = '#';

    },


    /**
     * Creates or removes the statistics element when not in the OTOS.Main.TREEMODE
     */
    showInfo: function () {

        OTOS.Tree.changeToggleNodeValue($(STATISTICS_LINK_ID_PREFIX + '_' + this.areaId));

        var areaElement = $(AREA_ELEMENT_ID_PREFIX + '_' + this.serverAddress + '_' + this.cameraId + '_' + this.areaId);

        // if the statistics element exists, let's remove it and change the column count

        if (areaElement != null && !OTOS.Main.TREEMODE) {
            OTOS.ElementManager.removeColumn(areaElement, this.parentEl);
        } else {
            OTOS.ElementManager.handleElementAdding(this.parentEl);
            this.showStatistics();
        } // else

    },


    /**
     *
     */
    showStatistics: function () {

        var parentCol = OTOS.ElementManager.createElementColumn();

        parentCol.appendChild(this.create(0));
        this.parentEl.appendChild(parentCol);
        OTOS.Statistics.refreshStatistics(this.serverAddress, this.cameraId, this.areaId);
        new Rounded(parentCol, OTOS.ElementConfig.ELEMENT_ROUNDING_SETTINGS);

    },


    /**
     * Updates the iframe's content
     *
     * @param   {element}   element     The iframe element
     * @param   {int}       width       The new width for the iframe
     * @param   {String}    filename    The src-attribute of the iframe
     * @param   {String}    chartType   The chartType of the iframe's chart
     * @param   {int}       statType    The statType of the iframe's chart
     * @param   {Object}    parameters  The time parameters for the iframe,
     *                                  { period, date, dow }
     */
    updateChart: function (element, width, filename, chartType, statType, parameters) {

        var height  = parseInt(width * OTOS.Statistics.CHART_SIZE_FACTOR);
        width       = parseInt(width);

        var urlParams = filename + '?server=' + this.serverAddress + '&cam_id=' + this.cameraId + '&area_id=' + this.areaId
                            + '&chart_width=' + (width - 20) + '&chart_height=' + (height - 30) + '&chart_type=' + chartType;

        if (filename == 'prediction.php' && parameters['dow'] != null) {
            urlParams += '&dow=' + parameters['dow'];
        } // if

        if (filename == 'prediction.php' || filename == 'measurements.php') {

            if (parameters['period'] != null) urlParams += '&period=' + parameters['period'];
            if (parameters['date'] != null) urlParams += '&date_from=' + parameters['date'];

            urlParams += '&stat=' + statType + '&showButtons=0';

        } else if (filename == 'realtimemeasurements.php') {
            urlParams += '&display_width=60&refresh_interval=1';
        } // else if

        element.setAttribute('width', width);
        element.setAttribute('height', height);
        element.setAttribute('src', urlParams);

    },


    /**
     *
     */
    createStatisticsLinkObserver: function (el) {
        Event.observe(el, 'click', function () {
            if ($('statisticsURLPopup_' + this.areaId) == undefined) {
                var myPopup = new Popup(
                    'statisticsURLPopup_' + this.areaId, {
                        parent: el,
                        content: this.createStatisticsHTMLTag(),
                        width: 500,
                        height: 200,
                        title: 'Tilaston HTML-tagi'
                    });
                myPopup.show();
            }
        }.bind(this));
    },


    /**
     *
     */
    createStatisticsHTMLTag: function () {

        var myIframe    = $(['iframe', this.serverAddress, this.cameraId, this.areaId].join('_')),
            chartWidth  = myIframe.getAttribute('width'),
            chartHeight = myIframe.getAttribute('height'),
            chartSrc    = myIframe.getAttribute('src'),
            filename    = chartSrc.split('?')[0],
            queryStr    = chartSrc.split('?')[1],
            queryParams = queryStr.toQueryParams();

        var chartUrl = 'http://213.216.208.153/otos/'
            + filename + '?' + $H(queryParams).toQueryString();

        return Builder.node('code', [
                '<iframe src="' + chartUrl + '" width="' + chartWidth + '" height="' + chartHeight
                + '" frameborder="0"></iframe>'
        ]);

    }

};