﻿// copyright MAJENKA - http://majenka.net

// user interface functions       

//================================================================================================    
  
// function to set default button

function UI() {}

// set an element's visibility
UI.SetVisibility = function(element, visible)
{        
    if (visible)
    {
        element.style.visibility = 'visible';
    }
    else
    {
        element.style.visibility = 'hidden';
    }
}

// toggle an element's visibility
UI.ToggleVisibility = function(element)
{        
    setVisibility(element, (element.style.visibility == 'hidden'));
}

// set an element's display
UI.SetDisplay = function(element, displayed)
{        
    if (displayed)
    {
        element.style.display = 'block';
    }
    else
    {
        element.style.display = 'none';
    }
}
    
// toggle an element's display
UI.ToggleDisplay = function(element)
{ 
    setDisplay(element, (element.style.display == 'none'));
}    

// toggle the homepage forum tabs
UI.SwitchHomepageForumTabs = function(latest)
{       
    var divForumLatestHeader = document.getElementById('divForumLatestHeader');
    var divForumMostPopularHeader = document.getElementById('divForumMostPopularHeader');
    var divForumLatest = document.getElementById('divForumLatest');
    var divForumMostPopular = document.getElementById('divForumMostPopular');       
    
    if (latest)
    {        
        divForumLatestHeader.style.height = '19px';
        divForumLatestHeader.style.styleFloat = 'left';
        divForumLatestHeader.style.padding = '5px';
        divForumLatestHeader.style.backgroundColor = '#ffffff';
        divForumLatestHeader.style.borderLeft = 'solid 1px #aaaaaa';
        divForumLatestHeader.style.borderTop = 'solid 1px #aaaaaa';
        divForumLatestHeader.style.borderRight = 'solid 1px #aaaaaa';
        
        divForumMostPopularHeader.style.height = '19px';
        divForumMostPopularHeader.style.styleFloat = 'left';
        divForumMostPopularHeader.style.padding = '5px';
        divForumMostPopularHeader.style.backgroundColor = '#dddddd';
        divForumMostPopularHeader.style.borderLeft = 'solid 1px #aaaaaa';
        divForumMostPopularHeader.style.borderTop = 'solid 1px #aaaaaa';
        divForumMostPopularHeader.style.borderRight = 'solid 1px #aaaaaa';
        divForumMostPopularHeader.style.borderBottom = 'solid 1px #aaaaaa';
        
        divForumLatest.style.display = 'block';
        divForumMostPopular.style.display = 'none';
        
      //  divForumLatest.setAttribute("class", "forum-homepage-tab-current");
      //  divForumLatestHeader.setAttribute("class", "forum-homepage-tab-header-current");
        
      //  divForumMostPopular.setAttribute("class", "forum-homepage-tab-not-current");
      //  divForumMostPopularHeader.setAttribute("class", "forum-homepage-tab-header-not-current");
    }
    else
    {       
        divForumMostPopularHeader.style.height = '19px';
        divForumMostPopularHeader.style.styleFloat = 'left';
        divForumMostPopularHeader.style.padding = '5px';
        divForumMostPopularHeader.style.backgroundColor = '#ffffff';
        divForumMostPopularHeader.style.borderLeft = 'solid 1px #aaaaaa';
        divForumMostPopularHeader.style.borderTop = 'solid 1px #aaaaaa';
        divForumMostPopularHeader.style.borderRight = 'solid 1px #aaaaaa';
        
        divForumLatestHeader.style.height = '19px';
        divForumLatestHeader.style.styleFloat = 'left';
        divForumLatestHeader.style.padding = '5px';
        divForumLatestHeader.style.backgroundColor = '#dddddd';
        divForumLatestHeader.style.borderLeft = 'solid 1px #aaaaaa';
        divForumLatestHeader.style.borderTop = 'solid 1px #aaaaaa';
        divForumLatestHeader.style.borderRight = 'solid 1px #aaaaaa';
        divForumLatestHeader.style.borderBottom = 'solid 1px #aaaaaa';
        
        divForumMostPopular.style.display = 'block';
        divForumLatest.style.display = 'none';
             
//            divForumLatest.setAttribute("class", "forum-homepage-tab-not-current");
//            divForumLatestHeader.setAttribute("class", "forum-homepage-tab-header-not-current");
//            
//            divForumMostPopular.setAttribute("class", "forum-homepage-tab-current");
//            divForumMostPopularHeader.setAttribute("class", "forum-homepage-tab-header-current");
    }
}

//================================================================================================

// grid command e.g. delete 
UI.GridCommand = function(message, loc)
{
    if (confirm(message))
    {            
        location.replace(loc);
    }
}

//================================================================================================

// page structure

UI.BodyOnLoad = function()
{        
    UI.CreatePageStructure();
        
    UI.BuildHeader();
}

UI.CreatePageStructure = function()
{        
 //   XSLT.TransformFile('header', 'xmlFile.xml', 'page-header.xslt');
 //   XSLT.TransformFile('footer', 'xmlFile.xml', 'page-footer.xslt');
 //   XSLT.TransformFile('mainMenu', 'xmlFile.xml', 'main-menu.xslt');
}
    
UI.BuildHeader = function()
{
    var aUsername = document.getElementById('aUsername');
    aUsername.innerHTML = username;
    aUsername.href = siteUrl + '/user/item.aspx?id=' + userId;
    
    var aAccount1 = document.getElementById('aAccount1');
    var aAccount2 = document.getElementById('aAccount2');
    
    if (isAuthenticated == 'true')
    {
        aAccount1.innerHTML = 'Account';
        aAccount1.href = siteUrl + '/account';
        
        aAccount2.innerHTML = 'Log Out';
        aAccount2.href = siteUrl + '/log-out.aspx';
    }
    else
    {
        aAccount1.innerHTML = 'Login';
        aAccount1.href = siteUrl + '/login.aspx';
        
        aAccount2.innerHTML = 'Create Account';
        aAccount2.href = siteUrl + '/create-account.aspx';
    }
}
    
//================================================================================================

// collect values from the search control form

function SearchControl() {}

var SearchControlUrl;

// grid command e.g. delete 
SearchControl.SetUrl = function(url)
{
    SearchControlUrl = url;
}

// grid command e.g. delete 
SearchControl.CollectValues = function()
{
    var searchColumn = document.getElementById('searchColumn').value;
    var q = document.getElementById('q').value;
    var allVisible = document.getElementById('all');
    
    if (allVisible == null)
    {   
        location.replace(SearchControlUrl +
            '?searchcolumn=' +
            searchColumn +
            '&q=' +
            q);
    }
    else
    {
        var all = allVisible.checked;
    
        if (all) 
        {
            location.replace(SearchControlUrl +
                '?searchcolumn=' +
                searchColumn +
                '&q=' +
                q +
                '&all=' +
                all);
        }
        else 
        {
            location.replace(SearchControlUrl +
                '?searchcolumn=' +
                searchColumn +
                '&q=' +
                q);
        }
    }
}

//================================================================================================

// redirects to the search page with query

function Search() {}

Search.RunQuery = function()
{
    var q = document.getElementById('q').value;
        
    location.replace(siteUrl + '/search.aspx?q=' + q);            
}

Search.RunChannelQuery = function(textBoxId, channelName) 
{            
    var q = document.getElementById(textBoxId).value;
        
    location.replace(siteUrl + '/search.aspx?q=' + q + '&channel=' + channelName);            
}
       
//================================================================================================

//// map link

//function Map() {}

//Search.RunQuery = function()
//{
//    // tool box map link functions
//    
//    var mapLink = { 
//        
//        setVisibility: function(visible)
//        {            
//            setVisibility(document.getElementById('ctl00_toolbox_hyperLinkGoogleMap'), visible); 
//        },
//        
//        callback: function(c) 
//        {        
//            var hyperLinkGoogleMap = document.getElementById('ctl00_toolbox_hyperLinkGoogleMap');

//            if (c.map.Id > 0) 
//            {
//                function hyperLinkGoogleMap_Click()
//                {
//                    map.load(
//                        c.map.Latitude,
//                        c.map.Longitude, 
//                        c.map.ZoomLevel,
//                        c.map.mapType,
//                        c.map.ShowMarker,
//                        c.map.MarkerLatitude, 
//                        c.map.MarkerLongitude);
//                }

//                hyperLinkGoogleMap.onclick = hyperLinkGoogleMap_Click;
//                setVisibility(hyperLinkGoogleMap, true);
//            }
//            else 
//            {
//                setVisibility(hyperLinkGoogleMap, false);
//            }
//        },

//        setByDirectoryId: function(directoryId) 
//        {
//            setDisplay(document.getElementById('ctl00_map1_divMapCanvas'), false);
//            
//            mapWebService.getMapByDirectoryId(directoryId, this.callback);
//        },
//        
//        setByForumId: function(forumId) 
//        {
//            setDisplay(document.getElementById('ctl00_map1_divMapCanvas'), false);
//            
//            mapWebService.getMapByForumId(forumId, this.callback);
//        },
//        
//        setByNewsId: function(newsId) 
//        {
//            setDisplay(document.getElementById('ctl00_map1_divMapCanvas'), false);
//            
//            mapWebService.getMapByNewsId(newsId, this.callback);
//        },
//        
//        setByPhotoId: function (photoId) 
//        {
//            setDisplay(document.getElementById('ctl00_map1_divMapCanvas'), false);
//            
//            mapWebService.getMapByPhotoId(photoId, this.callback);
//        },
//        
//        setByVideoId: function(videoId) 
//        {
//            setDisplay(document.getElementById('ctl00_map1_divMapCanvas'), false);
//            
//            mapWebService.getMapByVideoId(videoId, this.callback);
//        },
//        
//        setByWebPageId: function(webPageId) 
//        {
//            setDisplay(document.getElementById('ctl00_map1_divMapCanvas'), false);
//            
//            mapWebService.getMapByWebPageId(newsId, this.callback);
//        },
//        
//        setByWhatsOnId: function(whatsOnId) 
//        {
//            setDisplay(document.getElementById('ctl00_map1_divMapCanvas'), false);
//            
//            mapWebService.getMapByWhatsOnId(whatsOnId, this.callback);
//        }
//    };
//   
    
//================================================================================================

// social bookmarking functions 

function Bookmark() {}

Bookmark.BuildInnerHTML = function(name, iconFilename)
{
    return '<img alt="' + 
        name + 
        '" title="' + 
        name + 
        '" style="margin-right: 4px" ' +
        'src="' + 
        siteUrl + 
        '/images/' +
        iconFilename +
        '" />' +
        name;
}

Bookmark.SetUrl = function(url) 
{               
    var hyperLinkDelicious = document.getElementById('hyperLinkDelicious');
    hyperLinkDelicious.href = 'http://del.icio.us/post?url=' + siteUrl + '/' + url;
    hyperLinkDelicious.innerHTML = Bookmark.BuildInnerHTML('del.ici.ous', 'delicious.png');
    
    var hyperLinkDigg = document.getElementById('hyperLinkDigg');
    hyperLinkDigg.href = 'http://digg.com/submit?url=' + this.loc;
    hyperLinkDigg.innerHTML = Bookmark.BuildInnerHTML('Digg', 'digg.png');
    
    var hyperLinkFacebook = document.getElementById('hyperLinkFacebook');
    hyperLinkFacebook.href = 'http://www.facebook.com/sharer.php?u=' + this.loc;
    hyperLinkFacebook.innerHTML = Bookmark.BuildInnerHTML('Facebook', 'facebook.gif');
    
    var hyperLinkGoogleBookmark = document.getElementById('hyperLinkGoogleBookmark');
    hyperLinkGoogleBookmark.href = 'http://www.google.com/bookmarks/mark?bkmk=' + this.loc;
    hyperLinkGoogleBookmark.innerHTML = Bookmark.BuildInnerHTML('Google', 'google-icon.gif');
    
    var hyperLinkReddit = document.getElementById('hyperLinkReddit');
    hyperLinkReddit.href = 'http://reddit.com/submit?url=' + this.loc;
    hyperLinkReddit.innerHTML = Bookmark.BuildInnerHTML('Reddit', 'reddit.gif');
    
    var hyperLinkStumbleUpon= document.getElementById('hyperLinkStumbleUpon');
    hyperLinkStumbleUpon.href = 'http://www.stumbleupon.com/submit?url=' + this.loc;
    hyperLinkStumbleUpon.innerHTML = Bookmark.BuildInnerHTML('Stumble Upon', 'stumble-upon.png');            
}
    
//================================================================================================

// user functions 

function UserLink() {}

var UserLinkUserId = 0;

UserLink.Callback = function(c)
{                 
    var hyperLinkUser = document.getElementById('hyperLinkUser');
    hyperLinkUser.innerHTML = c.Name;
    hyperLinkUser.href = siteUrl 
        + '/user/item.aspx?id='
        + c.Id;                      
}

UserLink.SetUserId = function(userId)
{
    UserScriptService.GetUser(userId, UserLink.Callback, false);
}            
 
////================================================================================================

//// send a link functions 

//function SendLink() {}

//var SendLinkSuccess = false;
//var SendLinkUrl = '';

//SendLink.SetUrl = function(url)
//{  
//   SendLinkUrl = url;
//}
//               
//SendLink.Callback = function(result)
//{           
//    SendLinkSuccess = result;
//     
//    var divProcessing = document.getElementById('ctl00_toolbox_tableProcessing');
//    var tableSendItem = document.getElementById('ctl00_toolbox_tableSendItem');
//    var spanSuccess = document.getElementById('ctl00_toolbox_spanSuccess');
//    var spanFailure = document.getElementById('ctl00_toolbox_spanFailure');
//    
//    UI.SetDisplay(document.getElementById('ctl00_toolbox_imgProcessing'), false);
//    
//    if (SendLinkSuccess)
//    {
//        spanSuccess.innerHTML = 'Email Sent';
//        UI.SetDisplay(spanSuccess, true);
//    }
//    else
//    {
//        UI.SetDisplay(tableProcessing, false);
//        UI.SetDisplay(tableSendItem, true);
//        spanFailure.innerHTML = 'Email Failed';
//        UI.SetVisibility(spanFailure, true);
//    }
//            
//    setTimeout('SendLink.Finish()', 1000);
//}

//SendLink.Send = function()
//{            
//    if (//validation)
//    {                
//        setDisplay(document.getElementById('ctl00_toolbox_tableSendItem'), false);
//        setDisplay(document.getElementById('ctl00_toolbox_spanSuccess'), false);
//        setDisplay(document.getElementById('ctl00_toolbox_tableProcessing'), true);
//        setDisplay(document.getElementById('ctl00_toolbox_imgProcessing'), true);
//        
//        emailWebService.sendLink(
//            headingText, 
//            this.url, 
//            document.getElementById('ctl00_toolbox_textBoxEmail').value, 
//            document.getElementById('ctl00_toolbox_textBoxname').value, 
//            document.getElementById('ctl00_toolbox_textBoxMessage').value, 
//            this.callback); 
//    }
//}
//        
//        clear: function()
//        {
//            setDisplay(document.getElementById('ctl00_toolbox_tableSendItem'), true);
//            setDisplay(document.getElementById('ctl00_toolbox_spanSuccess'), false);
//            setDisplay(document.getElementById('ctl00_toolbox_tableProcessing'), false);
//            document.getElementById('ctl00_toolbox_textBoxEmail').value = '';
//            document.getElementById('ctl00_toolbox_textBoxName').value = '';
//            document.getElementById('ctl00_toolbox_textBoxMessage').value = '';
//            setDisplay(document.getElementById('ctl00_toolbox_requiredFieldValidatorName'), false);
//            setDisplay(document.getElementById('ctl00_toolbox_requiredFieldValidatorEmail'), false);
//            setDisplay(document.getElementById('ctl00_toolbox_regularExpressionValidatorEmail'), false);
//            
//            sendLink.emailItemResult = false;
//        },

//        hide: function()
//        {
//            if (sendLink.emailItemResult)
//            {
//                document.getElementById('ctl00_toolbox_buttonSendToAFriend_Cancel').click();
//                
//                sendLink.clear();
//            }
//            else
//            {
//                setVisibility(document.getElementById('ctl00_toolbox_spanFailure'), false);
//            }
//        }
//    };
   
//================================================================================================

// page heading functions 

function PageHeading() {}

PageHeading.SetTitle = function(text)
{          
    document.getElementById('h1').innerHTML = text;
}

PageHeading.SetBreadCrumb = function(text, url)
{          
    var breadCrumb = document.getElementById('hyperLinkBreadcrumb_1');            
            
    breadCrumb.innerHTML = text;
    breadCrumb.href = url;
}       
   
//================================================================================================

// slide show functions 

function SlideShow() {}

var SlideShowPhotoId = 0;
var SlideShowFC = null;
var SlideShowCarrier = null;
var SlideShowRepeat = false;

// this function is called after the preloading of the photo has completed
SlideShow.PhotoLoaded = function()
{          
    var imagePhoto = document.getElementById('imagePhoto');            
    
    imagePhoto.alt = SlideShowCarrier.photo.Name;
    imagePhoto.title = SlideShowCarrier.photo.Name;
    imagePhoto.src = SlideShowCarrier.SiteUrl
        + '/resources/'
        + SlideShowCarrier.photo.user.Id
        + '/images/3/'
        + SlideShowCarrier.resource.Filename;
        
    // show new photo 
    document.getElementById('divPhotoContainer').style.display = 'block'; 
    document.getElementById('divPhotoLoading').style.display = 'none'; 
    
    //TODO: need to move this to the photo loaded mathod
    if (SlideShowRepeat)
    {
        SlideShowFC = setTimeout('SlideShow.Play()', 5000);
    }
}

// function to call the slide show web service        
SlideShow.GetSlide = function(id, previous)
{   
    // show ajax loading animation instead of photo
    document.getElementById('divPhotoContainer').style.display = 'none'; 
    document.getElementById('divPhotoLoading').style.display = 'block';            
    
    PhotoScriptService.GetSlide(id, previous, SlideShow.CallBack);
}
        
// function get slide show and setTimeOut
SlideShow.Play = function()
{
    clearTimeout(SlideShowFC);
    SlideShowRepeat = true;
    SlideShow.GetSlide(SlideShowPhotoId, false);
}
        
// function to switch the photo slide        
SlideShow.SwitchSlide = function()
{        
    // pre load the image 
    var imagePreload = new Image();
    imagePreload.onload = SlideShow.PhotoLoaded; 
    imagePreload.src = SlideShowCarrier.SiteUrl
        + '/resources/'
        + SlideShowCarrier.photo.user.Id
        + '/images/3/'
        + SlideShowCarrier.resource.Filename;
        
    //assign photoId to a global variable
    SlideShowPhotoId = SlideShowCarrier.photo.Id;
    
    // call the change bread crumb function (e.g. 0 is the channel link, 1 is the category link, ... )
    PageHeading.SetBreadCrumb(
        SlideShowCarrier.photo.photoCategory.Name, 
        SlideShowCarrier.SiteUrl + 
        '/photo/default.aspx?id=' + 
        SlideShowCarrier.photo.photoCategory.Id);
    
    // change the header text 
    PageHeading.SetTitle(SlideShowCarrier.photo.Name);
    
    // change the photo description
    if (SlideShowCarrier.photo.Content != null)
    {
        document.getElementById('spanPhotoContent').innerHTML = SlideShowCarrier.photo.Content;
    }
    
    // change sent to a friend link
  //  sendLink.setUrl(slideShow.carrier.SiteUrl + '/photo/item.aspx?id=' + slideShow.carrier.photo.Id);

    // set user link     
    UserLink.SetUserId(SlideShowCarrier.photo.user.Id);
    
    // set the map link 
   // mapLink.setByPhotoId(slideShow.carrier.photo.Id);
               
    // set social bookmark url
   //   Bookmark.SetUrl(SlideShowCarrier.SiteUrl + '/photo/item.aspx?id=' + slideShow.carrier.photo.Id);
}

// call back from the webs service
SlideShow.CallBack = function(c)
{            
    SlideShowCarrier = c;
        
    SlideShow.SwitchSlide();
}

// function to play / stop the slide show
SlideShow.StartStop = function()
{
    clearTimeout(SlideShowFC);
    
    SlideShowRepeat = false;
 
    var buttonPlay = document.getElementById('buttonPlay');
    
    if (buttonPlay.value == 'Play')
    {
        // disable previous and next buttons
        document.getElementById('buttonPrevious').setAttribute('disabled', 'disabled');
        document.getElementById('buttonNext').setAttribute('disabled', 'disabled');
        
        buttonPlay.value = 'Pause';
        
        clearTimeout(SlideShowFC);
        SlideShowRepeat = true;
        SlideShow.GetSlide(SlideShowPhotoId, false);
    }
    else
    {
        buttonPlay.value = 'Play';
        
        // enable previous and next buttons
        document.getElementById('buttonPrevious').removeAttribute('disabled');
        document.getElementById('buttonNext').removeAttribute('disabled');
    }
}

// previous / next buttons onclick event handler function
SlideShow.SlideIt = function(previous)
{                            
    clearTimeout(SlideShowFC);
    SlideShowRepeat = false;
    SlideShow.GetSlide(SlideShowPhotoId, previous);
}
        
SlideShow.SetPhotoId = function(photoId)
{
    SlideShowPhotoId = photoId;
}      
       
//================================================================================================

// forum functions 

function Forum() {}

var ForumPostArray = new Array();

var ForumPostArrayCount = 0;

// add a post to the array
Forum.AddPost = function(postId)
{ 
    ForumPostArray[ForumPostArrayCount] = postId;
    
    ForumPostArrayCount++;
}    

// clear form elements
Forum.PinOnClick = function(id)
{
    var imgPin = document.getElementById('imgPin_' + id);                  
    var divPostContainer = document.getElementById('divPostContainer_' + id);
    
    if (imgPin.src.toLowerCase() == siteUrl.toLowerCase() + '/app_images/pin.gif')
    {                                
        if (divPostContainer.style.display == 'none')
        {
            ForumScriptService.GetForum(id, Forum.CallBack);
        }
        
        Forum.PinPost(id);
    }
    else
    {                                
        if (divPostContainer.style.display == 'block')
        {
            Forum.ClosePost(id);
        }
    }
}
   
Forum.CloseAllPosts = function(includingPinned)
{
    for (var i = 0; i < ForumPostArray.length; i++)
    {   
        if (includingPinned || 
            document.getElementById('imgPin_' + ForumPostArray[i]).src.toLowerCase() 
            == siteUrl.toLowerCase() + '/app_images/pin.gif')
        {    
            Forum.ClosePost(ForumPostArray[i]);
        }
    }
}
        
Forum.ClosePost = function(id)
{       
    var divPC = document.getElementById('divPostContainer_' + id);
    divPC.style.display = 'none';
    
    var divPT = document.getElementById('divPostTop_' + id);
    divPT.style.background = '#ffffff';
    
    var imgPin = document.getElementById('imgPin_' + id);
    imgPin.alt = 'Click to pin post';
    imgPin.title = 'Click to pin post';
    imgPin.src = siteUrl + '/app_images/pin.gif';
}
        
Forum.OpenAllPosts = function()
{
    for (var i = 0; i < ForumPostArray.length; i++)
    {
        ForumScriptService.GetForum(ForumPostArray[i], Forum.CallBackAll);               
    }
}
        
Forum.PinPost = function(id)
{                        
    var imgPin = document.getElementById('imgPin_' + id); 
    imgPin.alt = 'Pinned. Click to unpin';
    imgPin.title = 'Pinned. Click to unpin';
    imgPin.src = siteUrl + '/app_images/pinned.gif';
}
        
Forum.GetPost = function(id)
{         
    if (document.getElementById('imgPin_' + id).src.toLowerCase() == 
        siteUrl.toLowerCase() + '/app_images/pin.gif')
    {                             
        if (document.getElementById('divPostContainer_' + id).style.display == 'none')
        {          
            ForumScriptService.GetForum(id, Forum.CallBack);
        }                
        else
        {               
            Forum.ClosePost(id);
        }
    }
}
        
// call back - this closes all posts first (works inconjunction with getpost(id))
Forum.CallBack = function(si)
{                     
    Forum.CloseAllPosts(false);
                      
    var divPostTop = document.getElementById('divPostTop_' + si.Id);           
    var divPostContainer = document.getElementById('divPostContainer_' + si.Id); 
    var divPostContent = document.getElementById('divPostContent_' + si.Id);             
       
    divPostContent.innerHTML = si.Content;
    divPostTop.style.background = '#b2c9d9';
    divPostContainer.style.display = 'block';
}
        
// call back - this one does not close all posts (works with open all)
Forum.CallBackAll = function(si)
{            
    var divPostTop = document.getElementById('divPostTop_' + si.Id);           
    var divPostContainer = document.getElementById('divPostContainer_' + si.Id); 
    var divPostContent = document.getElementById('divPostContent_' + si.Id);              
   
    divPostContent.innerHTML = si.Content;
    divPostTop.style.background = '#b2c9d9';
    divPostContainer.style.display = 'block';
    
    var imgPin = document.getElementById('imgPin_' + si.Id); 
    imgPin.alt = 'Pinned. Click to unpin';
    imgPin.title = 'Pinned. Click to unpin';
    imgPin.src = siteUrl + '/app_images/pinned.gif';
}      
      
//================================================================================================

// contact us 

function ContactUs() {}

var ContactUsSuccess = false;

// clear form elements
ContactUs.ClearForm = function()
{           
    document.getElementById('textName').value = '';
    document.getElementById('textEmailAddress').value = '';            
    document.getElementById('textAreaMessage').value = '';
        
    // hide message labels
    UI.SetDisplay(document.getElementById('spanErrorName'), false);
    UI.SetDisplay(document.getElementById('spanErrorEmailAddress'), false);
    UI.SetDisplay(document.getElementById('spanErrorMessage'), false);
    UI.SetDisplay(document.getElementById('spanResult'), false);
}
        
ContactUs.Finish = function()
{
    if (ContactUsSuccess)
    {                
        ContactUs.ClearForm();
        
        ContactUsSuccess = false;
    }
    else
    {
        UI.SetVisibility(document.getElementById('spanResult'), false);
    }
}

// function to display whether the email was successfully sent 
ContactUs.CallBack = function(result)
{
    ContactUsSuccess = result;
        
    var spanResult = document.getElementById('spanResult');
    
    if (ContactUsSuccess)
    {
        spanResult.innerHTML = 'Sent';
    }
    else
    {                
        spanResult.innerHTML = 'Sending Failed';
    }

    setTimeout('ContactUs.Finish()', 1000);
}
    
ContactUs.ValidateForm = function() 
{
    var isValid = true;
    var errorMessage = '';            
    
    // validate name text box
    var textName = document.getElementById('textName');
    var spanErrorName = document.getElementById('spanErrorName');
    errorMessage = Validation.Empty(textName);            
    if (errorMessage == '')
    {
        UI.SetDisplay(spanErrorName, false);
    }
    else
    {
        UI.SetDisplay(spanErrorName, true);
        
        isValid = false;
    }
    spanErrorName.innerHTML = errorMessage;
                
    // validate email address text box
    var textEmailAddress = document.getElementById('textEmailAddress');
    var spanErrorEmailAddress = document.getElementById('spanErrorEmailAddress');
    errorMessage = Validation.EmailAddress(textEmailAddress);
    if (errorMessage == "")
    {
        UI.SetDisplay(spanErrorEmailAddress, false);
    }
    else
    {
        UI.SetDisplay(spanErrorEmailAddress, true);
        
        isValid = false;
    }
    spanErrorEmailAddress.innerHTML = errorMessage;
    
    // validate message text box
    var textAreaMessage = document.getElementById('textAreaMessage');
    var spanErrorMessage = document.getElementById('spanErrorMessage');
    errorMessage = Validation.Empty(textAreaMessage);            
    if (errorMessage == '')
    {
        UI.SetDisplay(spanErrorMessage, false);
    }
    else
    {
        UI.SetDisplay(spanErrorMessage, true);
        
        isValid = false;
    }
    spanErrorMessage.innerHTML = errorMessage;
    
    return isValid;
}
        
// send email button click handler
ContactUs.Send = function()
{   
    if (ContactUs.ValidateForm()) 
    {            
        var spanResult = document.getElementById('spanResult');
        spanResult.innerHTML = "Sending";                
        UI.SetVisibility(spanResult, true);
                
        EmailScriptService.SendMessage(
            document.getElementById('textName').value, 
            document.getElementById('textEmailAddress').value, 
            document.getElementById('textAreaMessage').value, 
            ContactUs.CallBack);
    }
}