﻿
/// -----------------------------------------------------
/// Home Page Rotating Feature Clientside object
///

var FeatureItem = Class.create();

FeatureItem.prototype = {
///<summary></summary>
    
    title : null,
    copy : null,
    imageUrl : null,
    imageAlt : null,
    linkText : null,
    linkUrl : null,
    linkTip : null,    
    subTitle : null,
    
    initialize: function(ttl, cpy, imgUrl, imgAltTxt, lnkTxt, lnkUrl, lnkTp, subTitle) {
        ///<summary></summary>
        ///<paran name="ttl">Title</param>
        ///<paran name="cpy">Copy</param>
        ///<paran name="imgUrl">Image Url</param>
        ///<paran name="imgAltTxt">Image Alt text</param>
        ///<paran name="lnkTxt">Link Text</param>
        ///<paran name="lnkUrl">Link Url</param>
        ///<paran name="lnkTp">Link Tooltip</param>
        ///<paran name="subTitle">Sub Title</param>
                
        this.title = ttl;
        this.copy = cpy;
        this.imageUrl = imgUrl;
        this.imageAlt = imgAltTxt;
        this.linkText = lnkTxt;
        this.linkUrl = lnkUrl;
        this.linkTip = lnkTp;
        this.subTitle = subTitle;
    }
};


/// -----------------------------------------------------
/// Home Page Rotating Feature Clientside Methods
///

var _homepageFeatureScope = null;

var HomePageFeature = Class.create();

HomePageFeature.prototype = {
    ///<summary></summary>

    // collection of feature items
    featureItems: null,

    // current item index
    currentItemIndex: null,

    // show delay
    delay: 5000,

    titleElementID: '',
    copyElementID: '',
    imageElementID: '',
    linkElementID: '',

    initialize: function(itemsCollection) {
        ///<summary>Init class</summary>

        _homepageFeatureScope = this;
        this.currentItemIndex = 0;
        this.featureItems = itemsCollection;
        this._start();
    },

    _start: function() {
        ///<summary>Start animation</summary>

        this._displayItem();

    },

    _displayItem: function() {
        ///<summary></summary>

        if (_homepageFeatureScope.featureItems.length > 0) {
            // ref to the current item in the collection
            var item = _homepageFeatureScope.featureItems[_homepageFeatureScope.currentItemIndex];

            if (item.imageUrl.length > 0) {

                if (item.title.length < 1) {
                    // render item with image and no heading or link
                    _homepageFeatureScope._renderImageOnlyItem(item);
                } else {
                    // render item with image and heading
                    _homepageFeatureScope._renderImageItem(item);
                }

            } else {
                // render item with copy
                _homepageFeatureScope._renderCopyItem(item);
            }

            // increment counter
            _homepageFeatureScope.currentItemIndex++;
            if (_homepageFeatureScope.currentItemIndex > _homepageFeatureScope.featureItems.length - 1)
                _homepageFeatureScope.currentItemIndex = 0;

            // render the next item after a delay
            setTimeout(_homepageFeatureScope._displayItem, _homepageFeatureScope.delay);

        }

    },

    _renderImageItem: function(item) {
        ///<summary></summary>
        ///<param name="item"></param>

        // image url should be changed dependant on ssl
        if (window.location.protocol == 'https:')
            item.imageUrl = item.imageUrl.replace('http:', 'https:');
        else // just checking
            item.imageUrl = item.imageUrl.replace('https:', 'http:');


        var html = new Array();

        html.push('<div class="homepageRotatingFeatureInner" style="cursor:pointer" onclick="redir(\'' + item.linkUrl + '\'); return false;">');
        if (item.title.toLowerCase() == 'virtual tours')
            html.push('<h4 style="font-size:1.8em">' + item.title + '<img src="/Miller.HomesWeb/img/play-mocha.gif" alt="" /></h4>');
        else
            html.push('<h4>' + item.title + '</h4>');
        html.push('   <img src="' + item.imageUrl + '" alt="' + item.imageAlt + '" />');
        html.push('   <p><a href="' + item.linkUrl + '" title="' + item.linkTip + '">' + item.linkText + '</a></p>');
        html.push('</div>');

        $('elPresentation').innerHTML = html.join('');

        document.getElementById('homeFeature').style.border = '1px solid #696969';
    },

    _renderImageOnlyItem: function(item) {
        ///<summary></summary>
        ///<param name="item"></param>

        // image url should be changed dependant on ssl
        if (window.location.protocol == 'https:')
            item.imageUrl = item.imageUrl.replace('http:', 'https:');
        else // just checking
            item.imageUrl = item.imageUrl.replace('https:', 'http:');


        var html = '';

        html += '<div class="homepageRotatingFeatureInner" style="margin:0px;padding:0px;cursor:pointer;border:none;" onclick="redir(\'' + item.linkUrl + '\'); return false;">';
        html += '   <img class="imageOnly" width="197" height="152" src="' + item.imageUrl + '" alt="' + item.imageAlt + '" />';
        html += '</div>';

        $('elPresentation').innerHTML = html;

        $('homeFeature').style.border = '0';  // FF sucks, set border to 0 not empty string or null as you would expect.
    },

    _renderCopyItem: function(item) {
        ///<summary></summary>
        ///<param name="item"></param>

        var html = '';

        html += '<div class="homepageRotatingFeatureInner" style="cursor:pointer" onclick="redir(\'' + item.linkUrl + '\'); return false;">';
        html += '   <h4>' + item.title + '</h4>';
        if (item.subTitle) {
            if (item.subTitle.length > 0)
                html += '   <h5>' + item.subTitle + '</h5>';
        }
        html += '   <p style="height:80px">' + item.copy + '</p>';
        html += '   <p><a href="' + item.linkUrl + '" title="' + item.linkTip + '">' + item.linkText + '</a></p>';
        html += '</div>';

        $('elPresentation').innerHTML = html;

        $('homeFeature').style.border = '1px solid #696969';
    }

};

function redir(url) {
    window.location = url;
}

