var Camera = Class.create();

Camera.prototype = {

    /**
     * Constructor, initializes the class variables
     *
     * @param   {String}    serverAddress   The ip-address of the server
     * @param   {String}    cameraId        The id of the camera
     * @param   {boolean}   hasParent       Whether the element has an server as a parent or not
     * @param   {element}   container       The container element for the camera element
     */
    initialize: function (serverAddress, cameraId, hasParent, container) {
        this.serverAddress  = serverAddress;
        this.cameraId       = cameraId;
        this.hasParent      = hasParent;
        this.parentEl       = container;
    },


    /**
     * Creates the camera element with the statistics. A camera element has the image element and
     * all the statistics of the camera.
     */
    create: function () {

        var elId = CAMERA_ELEMENT_ID_PREFIX + '_' + this.serverAddress + '_' + this.cameraId,
            rowContainer = Builder.node('div', { className: 'cameraRowContainer clearfix' }),
            container = Builder.node('div', {
                id: elId, className: CAMERA_ELEMENT_CLASS
            }, [
                OTOS.Dom.createHeading((this.hasParent ? 'h3' : 'h2'), this.createHeaderText()),
                rowContainer
            ]),
            imageContainer  = this.createImageElement();

        // create the column for the image

        var imageColumn = OTOS.ElementManager.createElementColumn();

        imageContainer.appendChild(this.createHeader((this.hasParent ? 'h4' : 'h3'), 'Kamerakuva'));
        imageColumn.appendChild(imageContainer);
        rowContainer.appendChild(imageColumn);

        // rounded corners
        new Rounded(imageColumn, OTOS.ElementConfig.ELEMENT_ROUNDING_SETTINGS);

        // create the statistics

        var imageAreas  = OTOS.ElementConfig.SERVERDATA[this.serverAddress]['cameras'][this.cameraId]['imageAreas'];

        // go through all the image areas and append them into the document

        for (var i in imageAreas) {

            var newColumn       = OTOS.ElementManager.createElementColumn(),
                newStatistics   = new Statistics(this.serverAddress, this.cameraId, i, newColumn);

            newColumn.appendChild(newStatistics.create(this.hasParent ? 2 : 1));

            // rounded corners
            new Rounded(newColumn, OTOS.ElementConfig.ELEMENT_ROUNDING_SETTINGS);

            rowContainer.appendChild(newColumn);

        } // for

        this.parentEl.appendChild(container);

    },


    /**
     * Creates the header element for the camera element. This is the content for
     * the heading element (h2, h3 etc).
     *
     * @return  The header element
     * @type    {element}
     */
    createHeaderText: function () {

        var server      = OTOS.ElementConfig.SERVERDATA[this.serverAddress],
            camera      = server['cameras'][this.cameraId],
            headerText  = !this.hasParent
                                ? server['name'] + ' / ' + camera['name']
                                : camera['name'];

        return document.createTextNode(headerText);

    },


    /**
     * Creates the camera element when the OTOS.Main.TREEMODE is true. The container is cleared
     * before creating the element and the camerabrowser is updated. After creating the
     * element the statistics and the images are updated.
     */
    show: function () {

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

        this.create(this.parentEl);

        OTOS.Statistics.refreshStatistics(null, null, null);
        clearTimeout(OTOS.Camera.TIMER);
        OTOS.Camera.updateCameraImages();

        window.location.hash = '#';

    },


    /**
     * Creates the camera element without the statistics.
     */
    showInfo: function () {

        OTOS.Tree.changeToggleNodeValue($(CAMERA_LINK_ID_PREFIX + '_' + this.cameraId));

        var cameraElement = $('imageContainer' + '_' + this.serverAddress + '_' + this.cameraId);

        // if the camera element exists, let's remove it (and change the column count)

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

    },


    /**
     * Creates the image container for the camera element
     *
     * @return  The image container
     * @type    {element}
     */
    createImageElement: function () {
        return Builder.node('div', {
            className: 'imageContainer element',
            id: 'imageContainer_' + this.serverAddress + '_' + this.cameraId
        });
    },


    /**
     * Creates the image element and the header
     */
    showImage: function () {

        var parentCol = OTOS.ElementManager.createElementColumn();

        parentCol.appendChild(this.createImageElement());
        parentCol.firstChild.appendChild(this.createHeader('h2', this.createHeaderText()));
        this.parentEl.appendChild(parentCol);

        clearTimeout(OTOS.Camera.TIMER);
        OTOS.Camera.updateCameraImages();

        new Rounded(parentCol, OTOS.ElementConfig.ELEMENT_ROUNDING_SETTINGS);

    },


    /**
     *
     */
    createHeader: function (hLevel, hText) {

        var pLink   = Builder.node('a', { href: 'javascript: void(0)' }, [ 'Url' ]),
            header  = Builder.node(hLevel, { className: 'clearfix' }, [
                Builder.node('span', { className: 'left' }, [ hText ]),
                Builder.node('span', { className: 'right' }, [ pLink ])
            ]);

        this.createCameraURLLinkObserver(pLink);

        return header;

    },


    /**
     *
     */
    createCameraURLLinkObserver: function (el) {
        Event.observe(el, 'click', function () {
            if ($('cameraURLPopup_' + this.cameraId) == undefined) {
                var myPopup = new Popup(
                    'cameraURLPopup_' + this.cameraId, {
                        parent: el,
                        content: this.createImageHTMLTag(),
                        width: 500,
                        height: 200,
                        title: 'Kamerakuvan HTML-tagi'
                    });
                myPopup.show();
            } // if
        }.bind(this));
    },


    /**
     * NOTE:    Is the server address correct?
     */
    createImageHTMLTag: function () {

        var imageUrl = '<img src="http://213.216.208.153/otos/getimage.php?server=' + this.serverAddress
            + '&cam_id=' + this.cameraId + '" alt="" />';

        return Builder.node('code', [ imageUrl ]);

    }

};