var originalLookId = null;
var widgetType = 0; // 0:search, 1: look, 2: lookBrowser, 3:product, 4:trend, 5:brand, 6:promo
var makeLookInfo = 'var shopstyle_li = {\"pid\":\"uid921-3589-70\"\n,\"host\":\"http://widget.shopstyle.com/widget\"\n,\"commonParams\":\"\"\n,\"searchBoxPrompt\":\"ShopStyle search:\"\n};\n';
eval(makeLookInfo);
originalLookId = shopstyle_li.originalLookId;
var haveLookInfo = (shopstyle_li.host !== undefined);


function makeSearchBox() {
    var box = document.picker.sampleSearchBox;
    if (box != null) {
        var pid = shopstyle_li.pid;
        var host = 'http://www.shopstyle.com/browse';
        var str = '<form action="' + host + '" target="_top">\n';
        str += '<input type="hidden" name="pid" value="' + pid + '">\n';
        str += shopstyle_li.searchBoxPrompt+'\n';
        str += '<input type="text" name="fts"> <input type="submit" value="Go">\n</form>';
        box.value = str;
    }
}

function showLookOptions() {
    if (document.getElementById('lookSelector') != null) {
        var lookIndex = document.picker.lookSelector.value;
        if (lookIndex < 0 || shopstyle_li.looks[lookIndex].type == "0") {
            $$('.basicLook').invoke('show');
            $$('.spreadLook').invoke('hide');
            $('rows').value = "1";
            $('columns').value = "3";
        } else {
            $$('.basicLook').invoke('hide');
            $$('.spreadLook').invoke('show');
            $('rows').value = "1";
            $('columns').value = "2";
            $('size').value = "large";
            $('sidebar').checked = false;
        }
    }
}

function makeLookSelect()
{
    var lkSelect = document.getElementById('lookSelector');
    if (lkSelect != null) {
        if (shopstyle_li.looks.length > 1) {
            lkSelect.appendChild(buildOption(-1, shopstyle_li.latestTitle, false));
        }

        var ii=0;
        for (ii=0; ii<shopstyle_li.looks.length; ii++) {
            var li = shopstyle_li.looks[ii];
            var title = li.title + ((li.type == 1) ? (' ' + shopstyle_li.spreadTag) : '');
            lkSelect.appendChild(buildOption(ii, title, originalLookId == li.id));
        }
    }
}

function buildOption(value, label, selected)
{
    var opt = document.createElement('option');
    opt.value = value;
    opt.appendChild(document.createTextNode(label));
    opt.selected = selected;

    return opt;
}

function checkPid(){

    if(document.picker.sampleText.value.indexOf('pid=')<0){
        document.picker.sampleText.value = document.picker.sampleText.value.replace("?", "?pid=" + document.getElementById('pid').innerHTML );
    }

    if(document.getElementById('pid').innerHTML != '2254'){
        document.picker.sampleText.value = document.picker.sampleText.value.replace("pid=2254", "pid=" + document.getElementById('pid').innerHTML );
    }

    if(document.picker.sampleText.value.indexOf('pid=2254')>0){
         if(!$('errorNoPid')){
             var newNode = document.createElement('div');
             newNode.id = 'errorNoPid';
             newNode.innerHTML = "NOTE: You are not signed in. Be sure to <a href=/"+signin_url+">sign in or register</a> to get credit for clicks.";
             $('embedCode').parentNode.insertBefore(newNode, $('embedCode').nextSibling );
             if(!logged_in) {
                newNode.innerHTML = "NOTE: You are not signed in. Be sure to <a href=/"+signin_url+">sign in or register</a> to get credit for clicks.";
             }
             else {
                newNode.innerHTML = "NOTE: Your account is not enrolled in ShopSense. Be sure to <a href=/"+signin_url+">enroll</a> your account to get credit for clicks.";
             }
        }
    }

}

function makeWidget() {

    checkPid();

    if (haveLookInfo) {
        var host = shopstyle_li.host;

        var str;
        var widgetLocation = 0;
        if (document.picker.widgetLocation !== undefined) {
            widgetLocation = document.picker.widgetLocation.value;
        }

        if (widgetType == 0) {
            var search = document.picker.search == null ? '' : document.picker.search.value;
            var size = document.picker.size.selectedIndex;   // 0=small, 1=large
            var catUrl = document.picker.category.value;
            var cellWidth = document.picker.columns.value;
            var cellHeight = document.picker.rows.value;
            str = makeSearchWidget(host, size, widgetLocation, search, catUrl, cellWidth, cellHeight);
        }
        else if (widgetType == 1 && shopstyle_li.looks !== undefined && shopstyle_li.looks.length > 0) {
            var indx = 0;
            var look = 0;
            if (document.getElementById('lookSelector') != null) {
                indx = document.picker.lookSelector.value;
            }
            if (indx < 0) {
                indx = 1; // to get latest look
            }
            var li = shopstyle_li.looks[indx];
            look = li.id;

            if (li.type == 0) {  // basic look
                var size = document.picker.size.selectedIndex;   // 0=small, 1=large
                var sidebar = document.picker.sidebar != null && document.picker.sidebar.checked && size == 1;
                var cellWidth = document.picker.columns.value;
                var cellHeight = document.picker.rows.value;
                str = makeGridLookWidget(host, look, shopstyle_li.user, size, widgetLocation, cellWidth, cellHeight, sidebar);
            }
            else { // spread look
                var size = document.picker.ssize.selectedIndex;   // 0=small, 1=large
                var sidebar = document.picker.ssidebar.checked;
                var brandName = li.brandN.escapeHTML();
                var stUrl = li.siteU;
                var brandUrl = stUrl + "/browse/" + li.brandU;
                var title = li.title;
                var desc = li.description;
                var customImage = li.customImage;
                str = makeSpreadLookWidget(host, look, stUrl, brandName, brandUrl, size, widgetLocation, li.powerAlt, sidebar, title, desc, customImage);
            }
        }
        else if (widgetType == 2) {
            var size = document.picker.size.selectedIndex;   // 0=small, 1=large
            str = makeLookBrowserWidget(host, shopstyle_li.searchUser, shopstyle_li.searchGroup, shopstyle_li.searchTags, size, widgetLocation);
        }
        else if (widgetType == 3) {
            var size = document.picker.psize.selectedIndex;   // 0=small, 1=medium, 2=large
            var style = document.picker.pstyle.selectedIndex;
            var showBrand = false;
            if (document.picker.showbrand !== undefined) {
                showBrand = document.picker.showbrand.checked;
            }

            str = makeProductBrowserWidget(style, size, widgetLocation, showBrand, shopstyle_li.purchaseLink, shopstyle_li.poweredBySite, shopstyle_li.images, shopstyle_li.brandPrompt, shopstyle_li.seeMoreUrl, shopstyle_li.poweredByAlt);
        }
        else if (widgetType == 4) {
            var size = 1; // large
            var catUrl = document.picker.category.value;
            var cellWidth = document.picker.columns.value;
            var cellHeight = document.picker.rows.value;
            str = makeTrendWidget(host, size, widgetLocation, catUrl, cellWidth, cellHeight);
        }
        else if (widgetType == 5) {
            var cellWidth = document.picker.columns.value;
            var cellHeight = document.picker.rows.value;
            str = makeBrandWidget(host, cellWidth, cellHeight);
        }
        else if (widgetType == 6) {
            var cellWidth = document.picker.columns.value;
            var cellHeight = document.picker.rows.value;
            str = makePromotionWidget(host, cellWidth, cellHeight);
        }
        else if(widgetType == 7){
            var size = document.picker.size.selectedIndex;   // 0=small, 1=large
            var sidebar = document.picker.sidebar != null && document.picker.sidebar.checked && size == 1;
            var cellWidth = document.picker.columns.value;
            var cellHeight = document.picker.rows.value;
            var look = document.picker.lookSelector.value;
            str = makeGridLookWidget(host, look, user, size, widgetLocation, cellWidth, cellHeight, sidebar);
        }
        else {
            str = '';
        }

        var sampleStr = str;
        if (sampleStr.search(/<iframe/i) >= 0) {
            sampleStr = sampleStr.replace(/\&local=1\&conservative=1/, '');
        }

        document.picker.sampleText.value = sampleStr;
        document.getElementById('sampleFrame').innerHTML = str;

        makeSearchBox();
    }

    return false;
}

function getWidth(size, cellWidth, sidebar)
{
    var width;
    if (size == 0) {
        width = Math.max(70 * cellWidth + 10, 102);
    }
    else {
        width = (sidebar ? 115 : 10) + (138 * cellWidth);
    }
    return width;
}

function getHeight(size, cellHeight)
{
    var height;
    if (size == 0) {
        height = 84 * cellHeight + 72;
    }
    else {
        height = 190 * cellHeight + 64;
    }
    return height;
}

function appendCommonParams(url)
{
    var commonParams = shopstyle_li.commonParams;
    if (commonParams != '') {
        if (url.indexOf("?") > -1) {
            return url + '&' + commonParams;
        } else {
            return url + '?' + commonParams;
        }
    }
    else{
        if (url.indexOf("?") > -1) {
            return url + '&';
        } else {
            return url + '?';
        }
    }

}

function makeGridLookWidget(host, look, user, size, widgetLocation, cellWidth, cellHeight, sidebar)
{
    var width = getWidth(size, cellWidth, sidebar);
    var height = getHeight(size, cellHeight);

    var str = '';
    var sampleStr = '';
    var locationStyle = getLocationStyle(widgetLocation, false);

    str = '<iframe ';
    str += 'width="' + width + '" height="' + height + '" frameborder="0" scrolling="no" ';
    if (locationStyle != null) {
        str += 'style="' + locationStyle + '" ';
    }
    var url = host;
    url = appendCommonParams(url);

    str += 'src="' + url;

    if (look == '-1') {
        str += '&user=' + user;
    }
    else if (look != '') {
        str += '&look=' + look;
    }

    if (size == 0) {
        str += '&size=Small'
    }
    str += '&width=' + cellWidth;
    str += '&height=' + cellHeight;
    str += '&layouttype=0';

    if (sidebar) {
        str += '&sidebar=1';
    }

    str += '&local=1&conservative=1"></iframe>';

    return str;
}

function makeSpreadLookWidget(host, look, stUrl, brandName, brandUrl, size, widgetLocation, powerAlt, sidebar, title, description, customImage)
{
    var width = 0;
    var height = 0;
    var sidebarWidth = 0;
    if (size == 0) {
        sidebarWidth = sidebar ? 115 : 0;
        width = sidebarWidth + 284;
        height = sidebar ? 268 : 243;
    }
    else {
        sidebarWidth = sidebar ? 260 : 0;
        width = sidebarWidth + 479;
        height = sidebar ? 426 : 401;
    }

    var locationStyle = getLocationStyle(widgetLocation, true);
    var str = '<div style="position:relative; border:1px solid #b9b9b9; background:white; width:' + width + 'px;';
    if (locationStyle != null) {
        str += locationStyle;
    }
    var vwUrl = stUrl + '/action/viewLook?id=' + look;
    vwUrl = appendCommonParams(vwUrl);

    var brUrl = brandUrl;
    brUrl = appendCommonParams(brUrl);

    str += '">';
    if (sidebar) {
        str += '<div style="color:#606060;font-family:verdana,arial;font-size:12px;text-align:center;margin:5px">' + title + '</div>';

        if (customImage != null) {
            if (size == 0) {
                customImage = customImage.replace(/.jpg/, '_medium.jpg');
            }
            str += '<div style="float:left; margin:10px 5px 0 5px"><img src="' + customImage + '"></div>';
        }
    }

    str += '<div style="margin-left:' + (sidebar ? (sidebarWidth + 'px; border-left:1px solid #d8d8d8') : '2px; margin-bottom:25px') + '">';
    str += '<a href="' + vwUrl + '" style="outline:none;border:none">';
    str += '<img style="border-style:none;background:none" src="' + stUrl + '/action/spreadWidgetImage?look=' + look;
    if (size == 1) {
        str += '&size=Large';
    }
    str += '"/></a><a href="' + brUrl + '" style="color:#909090">';
    str += '<img src="' + stUrl + '/im/widget/ShopStyleLogo_powered.png" alt="' + powerAlt + '" ';
    str += 'style="border-style:none;background:none;position:absolute;right:4px;bottom:4px"/></a></div>';
    if (sidebar) {
        str += '<div style="color:#606060;font-family:verdana,arial;font-size:11px;text-align:center;margin:8px 5px 25px 5px">'
        str += description + '</div>';
    }
    str += '</div>';

    return str;
}

function makeSearchWidget(host, size, widgetLocation, search, catUrl, cellWidth, cellHeight)
{
    var width = getWidth(size, cellWidth, false);
    var height = getHeight(size, cellHeight);

    var locationStyle = getLocationStyle(widgetLocation, false);
    var str = '<iframe ';
    str += 'name="shopstyle_search" ';
    str += 'width="' + width + '" height="' + height + '" frameborder="0" scrolling="no" ';
    if (locationStyle != null) {
        str += 'style="' + locationStyle + '" ';
    }
    var url = host;
    url = appendCommonParams(url);

    str += 'src="' + url;

    str += '&fts=' + escape(search);
    if (catUrl != '') {
        str += '&cat=' + catUrl;
    }
    str += '&width=' + cellWidth;
    str += '&height=' + cellHeight;
    if (size == 0) {
        str += '&size=Small'
    }

    str += '&local=1&conservative=1"></iframe>';

    return str;
}

function makeLookBrowserWidget(host, searchUser, searchGroup, searchTags, size, widgetLocation)
{
    var locationStyle = getLocationStyle(widgetLocation, false);
    var url = host;
    url = appendCommonParams(url);

    var str = '<iframe ';
    str += 'src="' + url + '&';
    if (searchUser !== undefined) {
        str += 'searchUser=' + encodeURIComponent(searchUser);
    }
    else if (searchGroup !== undefined) {
        str += 'groupId=' + searchGroup;
     }
    else {
        str += 'searchTags=' + encodeURIComponent(searchTags);
    }

    if (size == 1) {
        str += '&size=Large';
    }
    str += '&local=1&conservative=1" ';
    if (size == 0) {
        str += 'width="266" height="289" ';
    }
    else {
        str += 'width="480" height="456" ';
    }
    if (locationStyle != null) {
        str += 'style="' + locationStyle + '" ';
    }
    str += 'frameborder="0" scrolling="no"></iframe>';

    return str;
}

function makeProductBrowserWidget(widgetStyle, widgetSize, widgetLocation, showBrand, purchaseLink, poweredBySite, images, brandPrompt, seeMoreUrl, poweredByAlt)
{
    if (purchaseLink === undefined) {
        return '';
    }
    var textSizeStyle = 'font-size:12px;';
    var poweredImage = 'ShopStyleLogo_powered_small.png';
    if (widgetSize == 0) {
        imageUrl = images[0];
        textSizeStyle = 'font-size:10px;';
    }
    else if (widgetSize == 2) {
        imageUrl = images[2];
        poweredImage = 'ShopStyleLogo_powered.png';
    }
    else {
        imageUrl = images[1];
        textSizeStyle = 'font-size:11px;';
    }
    var seeMoreHref = appendCommonParams(poweredBySite + seeMoreUrl);

    var locationStyle = getLocationStyle(widgetLocation, true);
    var url = purchaseLink;
    url = appendCommonParams(url);
    var str = '';

    if (widgetStyle == 0 || widgetStyle == 1) {
        str += '<table';
        if (showBrand && brandPrompt !== undefined || locationStyle != null) {
            str += ' style="';
            if (showBrand && brandPrompt !== undefined) {
                str += 'font-family:Verdana,Arial,Helvetica,sans-serif;';
            }
            if (locationStyle != null) {
                str += locationStyle;
            }
            str += '"';
        }
        str += '><tr><td>';
        str += '<div style="border:1px solid #b9b9b9; background:white;">';
        str += '<div style="text-align:center;padding:5px">';

        str += '<a href="' + url +'" rel="nofollow" target="_blank">';
        str += '<img src="' + imageUrl + '" style="border-style:none"/>';
        str += '</a>';
        if (showBrand && brandPrompt !== undefined) {
            str += '<a href="' + seeMoreHref + '" style="text-decoration:none">';
            str += '<div style="margin:3px;color:#606060;' + textSizeStyle + '">'+brandPrompt+'</div>';
            str += '</a>';
        }
        str += '</div>';
        if (widgetStyle == 0) {  // include logo
            str += '<div style="text-align:right;padding:0px 2px 2px 2px">';
            str += '<a href="'+seeMoreHref+'" style="color:#909090">';
            str += '<img src="'+poweredBySite+'/im/widget/'+poweredImage+'" alt="'+poweredByAlt+'" style="border-style:none;"/>';
            str += '</a></div>';
        }
        str += '</div></td></tr></table>';
    }
    else {  // link only
        str += url;
    }

    return str;
}

function makeTrendWidget(host, size, widgetLocation, catUrl, cellWidth, cellHeight)
{
    var width = getWidth(size, cellWidth, false);
    var height = getHeight(size, cellHeight);

    var str = '';
    var sampleStr = '';
    var locationStyle = getLocationStyle(widgetLocation, false);

    str = '<iframe ';
    str += 'width="' + width + '" height="' + height + '" frameborder="0" scrolling="no" ';
    if (locationStyle != null) {
        str += 'style="' + locationStyle + '" ';
    }
    var url = host;
    url = appendCommonParams(url);

    str += 'src="' + url;
    if (catUrl != '') {
        str += '&cat=' + catUrl;
    }
    str += '"></iframe>';

    return str;
}

function makeBrandWidget(host, cellWidth, cellHeight)
{
    var width = 165 * cellWidth;
    var height = 191 * cellHeight + 64;

    var str = '<iframe ';
    str += 'width="' + width + '" height="' + height + '" frameborder="0" scrolling="no" ';
    var url = host;
    url = appendCommonParams(url);

    str += 'src="' + url;
    str += '"></iframe>';

    return str;
}

function makePromotionWidget(host, cellWidth, cellHeight)
{
    var width = 344 * cellWidth;
    var height = 162 * cellHeight + 58;

    var str = '<iframe ';
    str += 'width="' + width + '" height="' + height + '" frameborder="0" scrolling="no" ';
    var url = host;
    url = appendCommonParams(url);

    str += 'src="' + url;
    str += '"></iframe>';

    return str;
}

function getLocationStyle(widgetLocation, isBlock)
{
    if (widgetLocation == -1) {
        return 'float:left;margin-right:10px;';
    }
    else if (widgetLocation == 1) {
        return 'float:right;margin-left:10px;';
    }
    else if (widgetLocation == 0 && !isBlock) {
        return 'display:block;';
    }
    /* -- to support an "inline" option, which looks ugly
    else if (widgetLocation == 2 && isBlock) {
        return 'display:inline;';
    }
    */
    else {
        return null;
    }
}

function sizeChanged(value) {
    var sidebarBox = document.getElementById('sidebar');
    if (sidebarBox != null) {
        sidebarBox.disabled = (value == 'small');
        sidebarBox.checked = false;
    }
}

function typeChanged(value) {
    document.picker.psize.disabled = (value == 2);
    if (document.picker.showbrand !== undefined) {
        document.picker.showbrand.disabled = (value == 2);
    }
}

function productSelect(element, changeSelected){
    if(changeSelected){
        if($('productSelected')){
            $('productSelected').removeAttribute('id');
        }
        element.parentNode.setAttribute('id','productSelected');
    }

    $$('.productSelect').each(function(e){e.removeClassName('productSelect')})
    element.parentNode.addClassName('productSelect');
    var raw = $(element).down('.details').innerHTML;
    var product = eval(raw.replace(/[\n\r]/g,''));
    product = product[0];
//    console.log(product);
    var description = $(element).parentNode.down('.description').innerHTML;
    var pid = "&pid=" + $('pid').innerHTML;

    product.url = product.url.replace('pid=2254',pid);

    var showBrand = "";
    if($F('showBrand') == 'on'){
        showBrand = '<a style="border:0" href="' + product.seeMoreUrl +'" style="text-decoration:none"><div style="margin:3px;color:#606060;font-size:11px;">' + product.seeMoreLabel + '</div></a>';
    }

    var imageSize = $F('imageSize');
    var widgetStyle = $F('widgetStyle');
    var widgetFloat = $F('widgetFloat');

    var content = ' Sample content from your blog: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. ';

    //link only
    if(widgetStyle == 1){
        str = product.url
    }
    //image no logo
    else{
        var logo = "";
        if(widgetStyle != 2) {
            logo = '<div style="text-align:right;padding:0px 2px 2px 2px"><a style="border:0" href=" ' + product.seeMoreUrl +'" style="color:#909090"><img src="http://www.shopstyle.com/im/widget/ShopStyleLogo_powered.png" alt="' + product.seeMoreLabel + ' at ShopStyle" style="border-style:none;"></a></div>';
        }

        var float = "";

        if(widgetFloat == 3){
            float = "float:left; margin-right:15px;"
        }
        else if(widgetFloat == 1){
            float = "float:right; margin-left:15px;"
        }
        else {
            float = 'margin-bottom:5px';
        }

        var str = '<table style="clear:both;'+float+'"><tr><td><div style="border:1px solid #b9b9b9; background:white;"><div style="text-align:center;padding:5px;"><a style="border:0" href="' + product.url+ '" rel="nofollow" target="_blank"><img src="' + product.images[imageSize].url+'" style="border-style:none"/></a>'+showBrand+'</div>'+logo+'</div></td></tr></table>';

    }

    document.getElementById('sampleFrame').innerHTML = str + content;
    document.picker.sampleText.value = str ;
}

function changeAdIframe(changeAd){
    var size = $F('size');
    var version = $F('version');
    var sizeInfo = $F('size').split('x');
    var cat = $F('category');
    var width = sizeInfo[0];
    var height = sizeInfo[1];
    var ad = $('ad-frame');
    var popupAd = $('ad-frame-popup');
    var popupAd300x250 = $('ad-frame-300x250-popup');
    var embedCode = $('embedCode');
    var popup = "";

    if(size == '728x90' || size == '300x250xPopUp'){
        popup = "&popup=true";
    }

    if (changeAd) {
        if(size == '728x90'){
            popupAd.show();
            popupAd300x250.hide();
            ad.hide();
        }
        else if(size == '300x250xPopUp'){
            popupAd.hide();
            popupAd300x250.show();
            ad.hide();
        }
        else {
            popupAd.hide();
            popupAd300x250.hide();
            ad.src = "http://ads.shopstyle.com/?iframe=true&size=" + size + "&cat=" + cat + "&v=" + version;
            ad.width = width;
            ad.height = height;
            ad.show();
        }
    }

    checkPid();

    size = size.replace('xPopUp','');

    $('embedCode').value = "<script src='http://ads.shopstyle.com/?size=" + size + "&cat=" + cat + "&v=" + version + "&pid=" + pid + popup + "' language='Javascript'><\/script>";
}

function showRetailers(site){
    var site = site ? "&site=" + site : ""
    document.write('<div id="retailers"></div>');
    new Ajax.Request('/sugar-ads/proxy', {
        parameters: {'feed': 'http://api.shopstyle.com/action/apiGetRetailers?pid=uid6836-686094-82&format=json' + site},
        onSuccess: function(transport) {
            data = eval('('+transport.responseText+')');
            var i=0;
            var output = '';
            var retailerArray = new Array;

            for (i=0; i <= data.retailers.length - 1; i++){
                if(data.retailers[i].id){
                    retailerArray[data.retailers[i].url] = data.retailers[i].name;
                }
            }

            var retailerArray2 = sortAssoc(retailerArray);

            var columns = 3;
            var perColumn =  parseInt(data.retailers.length / 3) + 1;
            var i=0;
            for(var url in retailerArray2){
                if(url.indexOf('http') >= 0 ){
                    if(i % perColumn == 0){
                        output = output + "<div class=retailerColumn>";
                    }
                    output = output + "<a class='retailer' href='"+url+"' target='shopstyleWindow'>" + retailerArray2[url] + "</a> <br>";
                    i++;
                    if(i % perColumn == 0 || i == data.retailers.length - 1){
                        output = output + "</div>";
                    }
                }
            }
            $('retailers').innerHTML = output;
        }
    });
}

function sortAssoc(aInput)
{
var aTemp = [];
for (var sKey in aInput)
aTemp.push([sKey, aInput[sKey]]);
aTemp.sort(function () {return arguments[0][1] < arguments[1][1]});

var aOutput = [];
for (var nIndex = aTemp.length-1; nIndex >=0; nIndex--)
aOutput[aTemp[nIndex][0]] = aTemp[nIndex][1];

return aOutput;
}

function createPhotoLayout(nid){
    document.write('<style>.gallery_table{display:none}</style>');
    document.write('<div id="photo-layout"></div>');
    new Ajax.Request('/api', {
        method: 'get',
        parameters: {'nids': nid, 'format': 'json', 'gallery_xml': 'true', 'images': 'all'},
        onSuccess: function(transport) {
            data = getJsonData(transport);
            slides = data.items.gallery.slide;
            var output = '';
            var i=0;
            for (i=0; i <= slides.length - 1; i++){
                var image = slides[i].image[0].attributes.url;
                var title = data.items.gallery.slide[i].title.replace("#i", i+1);
                var body = data.items.gallery.slide[i].body.replace(/\[/g,'<').replace(/\]/g,'>');
                var urlPreview = image.replace('.medium','');
                var url = image.replace('.medium','.xlarge');

                if(i % 2){
                    var className = 'even';
                    output = output + "<div class='screenshot "+className+"'><div class='dropshadow-caption'><div class='headline'>" + title + "</div><p>"+body +"</p></div><div class='dropshadow'><a id='lightview_"+i+"' title='"+title+"' rel='gallery[shopstyleProduct]' class='lightview'  href='"+urlPreview+"'><img src='"+url+"' ></a></div></div>";

                }
                else {
                    var className = 'odd';
                    output = output + "<div class='screenshot "+className+"'><div class='dropshadow'><a id='lightview_"+i+"' title='"+title+"' rel='gallery[shopstyleProduct]' class='lightview'  href='"+urlPreview+"'><img src='"+url+"' ></a></div><div class='dropshadow-caption'><div class='headline'>" + title + "</div><p>"+body +"</p></div></div>";
                }
            }
            $('photo-layout').innerHTML = output;
        }
    });
}

function getJsonData(transport){
    var searchFor = " =";
    var characters = transport.responseText.indexOf(searchFor);
    var jsonVar = transport.responseText.substring(0, characters);
    eval(transport.responseText.replace(/\@/g,"")); //javascript does not like @attributes
    data = eval(jsonVar);
    return data;
}

function createSlideShow(nid, size){

    if(size == 'small'){
        var size = 'small';
        var cssSize = '.large';
    }
    else if (size == 'medium'){
        var size = 'medium';
        var cssSize = '.large';
    }
    else{
        var size = 'large';
        var cssSize = '.xlarge';
    }


    document.write('<style>.gallery_table{display:none}</style>');
    document.write('<div id="slideshow"></div>');
    new Ajax.Request('/api', {
        method: 'get',
        parameters: {'nids': nid, 'format': 'json', 'gallery_xml': 'true', 'images': 'all'},
        onSuccess: function(transport) {

            data = getJsonData(transport);
            slides = data.items.gallery.slide;

            if(size == 'small'){
                slides.splice(18, slides.length-18);
                slides = shuffle(slides);
                slides.splice(5, slides.length-5);
            }

            var output = '';
            var i=0;

            for (i=0; i <= slides.length - 1; i++){
                var image = slides[i].image[0].attributes.url;
                var title = data.items.gallery.slide[i].title.replace("#i", i+1);
                var link = data.items.gallery.slide[i].body;
                var urlPreview = image.replace('.large','');
                var url = image.replace('.large',cssSize);
                if(link && size!= 'small'){
                    var link1 = "<a target=_top href="+link+">"+title+"</a>";
                    var link2 = " <a target='_new' href='"+link+"'>"+title+"</a>";
                }
                else{
                    var link1 = title ;
                    var link2= " ";
                }
                output = output + "<div class='screenshot screenshot-"+size+"'><div class='dropshadow'><a id='lightview_"+i+"' title='"+link1+"' rel='gallery[shopstyleProduct]' class='lightview'  href='"+urlPreview+"'><img src='"+url+"' ></a></div><div class='dropshadow-caption'>"  + link2 +"</div></div>";
            }
            $('slideshow').innerHTML = output;
        }
    });
}

shuffle = function(o){ //v1.0
	for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
	return o;
};


function toggleFilter(filter) {
    $(filter).toggleClassName('activefilter');
    colorFilter(filter);
}

function colorFilter(filter) {
    filterlist = filter.up('.filterlist');
    label = $(filterlist.id + '_label');
    if(hasActiveFilters(filterlist.id)) {
        label.addClassName('active');
        $('clear_button').addClassName('active');
    } else if(!hasActiveFilters(filterlist.id)) {
        label.removeClassName('active');
    }
}

function hasActiveFilters(id) {
    size = $$('#' + id + ' .activefilter').size();
    if(size > 0) {
        return true;
    }
    return false;
}

function loadFilter(filter) {
    activeFilter = filter;
    $$('.filterlist').invoke('hide');
    filtertemplate = new Template('<span class="ssfilter filter_type" onclick="toggleFilter(this);" id="#{id}">#{name} (#{count})</span><br />');
    list = $(filter+'_filter_results');
    if(!(list.hasClassName('loaded')) && !(hasActiveFilters(list.readAttribute('id')))) {
        new Ajax.Request('/spread/filters',{
            method: 'get',
            parameters: {
              terms: $('photo_search_terms').value,
              filtertype: filter,
              filters: getActiveFilterQuery(),
              cat: $('cat').value
            },
            onSuccess: function(transport) {
                r = eval('('+transport.responseText+')');
                list.update(''); //clear for new filters
                r.filters.each(function(filter){
                    list.insert(filtertemplate.evaluate({
                        id: r.idPrefix + filter.id,
                        name: filter.name,
                        count: filter.count
                    }));
                });
                list.show();
                $('filter_options').show();
            }
        });
        list.addClassName('loaded');
    } else {
        $(filter+'_filter_results').show();
        $('filter_options').show();
    }
}

function clearFilters(all) {
    if(all) {
        f = '.ssfilter';
        $$('.filterlist').invoke('removeClassName','loaded');
    } else {
        f = '#' + activeFilter + '_filter_results .ssfilter';
    }
    $$(f).invoke('removeClassName','activefilter');
    $$('.filterlist').invoke('hide');
    $('filter_options').hide();
    $$('.filter_type').invoke('removeClassName','active');
    $('clear_button').removeClassName('active');
}

function doSearch() {
    search.doInitialSearch();
    return true;
}

var Search = Class.create();
Search.prototype = {
initialize: function() {
  this.resultsDiv = $('results');
  this.nextResultsDiv = $('nextResults');
  this.prevResultsDiv = $('prevResults');
  this.inputElement = $('photo_search_terms');
  this.pageNum = 1;
  this.mycontext = 'shopstyle';
  this.spreadOverlay = '<div style="display:none;background: #fff url(/static/imgs/onsugar_indicator.gif) center no-repeat;  opacity: 0.8; height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; z-index: 10000;"></div>';
},
insertElement: function(element) {
  var raw = $(element).down('.details').innerHTML;
  var stripped = raw.replace(/[\n\r]/g,'');
    $('info').value = stripped;
    $('myform').submit();

},
doInitialSearch: function() {
  $('pageNumber').innerHTML='0';
  pages = $$('.pageDiv');
  for(i=0; i<pages.length; i++) {
    pages[i].update('');
    pages[i].insert('<input type="hidden" class="loadedDiv" value="false" ></input>');
  }
  $('pager').style.display='none';
  this.makeResultsDiv(this.nextResultsDiv, 1);
  this.getNextPage();
},
makeResultsDiv: function(containingDiv, pageNum) {
  if(pageNum<=0) {
    return;
  }
  pageDiv=$$('#'+containingDiv.id+' .pageDiv')[0];
  pageDiv.id='page_'+pageNum;
  loadedElement = $$('#page_'+pageNum+' .loadedDiv')[0];
  loadedElement.value=false;
  //there are some theoretical issues with this variable and race conditions, but in real life nobody is going to be able to change it fast enough to invoke them. -LAW
  if($('ssSelect')) {
    var ssType = $('ssSelect').value;
  }
  else {
    var ssType = '';
  }
  if(shopstyle){
      $$('.filterlist').invoke('hide');
      $('filter_options').hide();
  }
  thisSearch = this.inputElement.value + "_" + $('cat').value;
  if(shopstyle && (thisSearch != lastSearch)){
      clearFilters(true);
      lastSearch = thisSearch;
  }
  var site = $('site') ? $('site').value : null;
  new Ajax.Request('/sugar-ads/proxy', {
    method: 'post',
    parameters: {feed: 'http://api.shopstyle.com/action/apiSearch?pid=2254&format=json&fts='+escape(this.inputElement.value)+'&count=5&site='+site+'&min='+ (pageNum - 1) +'&cat='+$('cat').value},
    onSuccess: function(transport) {
      var results = eval("[" + transport.responseText + "]");

      $('waitGraphic').style.display='none';
      pageDiv = $('page_'+pageNum);
      pageDiv.update('');
      if(results.totalCount==0) {
        pageDiv.insert("<div style='padding-top:30px;'>We're sorry, there are no results for that search term.  Please try again.</div>");
        return;
      }
      pageDiv.insert('<input type="hidden" id="loaded_'+pageNum+'" class="loadedDiv" value="false" ></input>');
      loadedElement = $$('#page_'+pageNum+' .loadedDiv')[0];
      loadedElement.value=true;
      $('pager').style.display='block';
      $('totalResults').innerHTML=results[0].totalCount;
      pagesTotal = Math.ceil(results[0].totalCount/search.contexts[search.mycontext].perPage);
      if(pagesTotal==1) {
        $('pageRight').className="pager-next inactive";
      }
      $('totalPages').innerHTML=pagesTotal;
      //preloading images with this object seems to help performance...
      var imgArray = new Array();
      results[0].products.each(function(result){
        img = [];
        if(shopstyle){
            img[0] = result.images[0];
            img[1] = result.images[1];
            img[2] = result.images[2];
            var trimmedName = result.name;
            if(trimmedName.length>50) {
                trimmedName = trimmedName.substring(0,50)+'...';
            }
            if(result.salePrice) {
                var description = trimmedName + ' <span style="text-decoration:line-through;color:#999999;padding-right:2px;">' + result.priceLabel+ '</span>' + result.salePriceLabel;
            }
            else {
                var description = trimmedName + ' ' + result.priceLabel + ' - ' + result.retailer;
            }
            imgArray.push(img[1].url);
        }
        else {
            img[0] = result.imageSmall;
            img[1] = result.imageMedium;
            img[2] = result.imageLarge;
            description = result.descriptionShort;
            imgArray.push(img[0].url);
        }
        var template = new Template(search.contexts[search.mycontext].template);
        pageDiv.insert(template.evaluate({
          //JSON API has different image structure
          'thumbnail' : img[0].url,
          'medium' : img[1].url,
          'large' : img[2].url,
          'url' : result.url ? result.url : '',
          'date' : result.date,
          'descriptionShort' : description,
          'description' : result.description,
          'title' : result.title,
          'heightThumb' : img[0].height,
          'widthThumb' : img[0].width,
          'heightLarge' : img[2].height,
          'widthLarge' : img[2].width,
          'json' : "[" + Object.toJSON(result) + ",\"shopstyle\"]"
        }));
      });
      var filters = $('filters');
      if(filters) {
        $('filters').show();
      }
      for(i=0; i<imgArray.length; i++) {
        imgPreload[imgArray[i]]=new Image();
        imgPreload[imgArray[i]].src=imgArray[i];
      }


        $$('.search_result')[0].setAttribute('id','productSelected');
        productSelect($("productSelected"));
        $$('.search_result')[0].addClassName('productSelect');
    }

  });
},
getNextPage: function() {
  pageNum = $('pageNumber').innerHTML;
  pageNum = parseInt(pageNum);
  pagesTotal = $('totalPages').innerHTML;
  if(pagesTotal) {
    pagesTotal = parseInt(pagesTotal);
  }
  if(pageNum<pagesTotal || pageNum==0) {
    this.prevResultsDiv.innerHTML=this.resultsDiv.innerHTML;
    this.resultsDiv.innerHTML=this.nextResultsDiv.innerHTML;
    pageNum++;
    this.handlePagers(pageNum, pagesTotal);
    $('pageNumber').innerHTML = pageNum;
    loadedElement = $$('#page_'+pageNum+' .loadedDiv')[0];
    if(loadedElement.value=='false') {
      $('waitGraphic').style.display='block';
    }
    this.makeResultsDiv(this.nextResultsDiv, pageNum+1);
  }
},
getPrevPage: function() {
  pageNum = parseInt($('pageNumber').innerHTML);
  if(pageNum>1) {
    this.nextResultsDiv.innerHTML=this.resultsDiv.innerHTML;
    this.resultsDiv.innerHTML=this.prevResultsDiv.innerHTML;
    pageNum--;
    this.handlePagers(pageNum, pagesTotal);
    $('pageNumber').innerHTML = pageNum;
    loadedElement = $$('#page_'+pageNum+' .loadedDiv')[0];
    if(loadedElement.value=='false') {
      $('waitGraphic').style.display='block';
    }
    this.makeResultsDiv(this.prevResultsDiv, pageNum-1);
  }
},
handlePagers: function(pageNum, pagesTotal) {
  i=0;
  if(pageNum!=1) {
    $('pageLeft').className="pager-prev active";
  }
  else {
    $('pageLeft').className="pager-prev inactive";
  }
  if(pageNum<pagesTotal || pageNum==1) {
    $('pageRight').className="pager-next active";
  }
  else {
    $('pageRight').className="pager-next inactive";
  }
},
contexts : {
  "getty" : {
    "url" : "/spread/getty",
    "template" : '<div class="search_result"><div onclick="search.insertElement(this); return true;" class="results_thumb" style="background-image:url(\'#{thumbnail}\');"><div class="details">#{json}</div></div><div class="description">#{descriptionShort}</div></div>',
    "tooltip" : false,
    "perPage" : 5
  },
  "shopstyle" : {
    "url" : "/spread/shopstyle",
    "template" : '<div class="search_result"><div onclick="productSelect(this, true);" onmouseover="this.parentNode.addClassName(\'productHover\')" onmouseout="this.parentNode.removeClassName(\'productHover\')" class="results_thumb" style="background-image:url(\'#{medium}\');"><div class="details">#{json}</div></div><div class="description">#{descriptionShort}</div></div>',
    "tooltip" : true,
    "perPage" : 5
  }
}
};

function getActiveFilterQuery() {
  q = '';
  $$('.activefilter').each(function(filter){
     q += '&fl=' + filter.id;
  });
  return q;
}

function getHashStringValue(name) {
queryString = window.location.hash.replace('#','');
nameArray = queryString.split('&');
for (i=0; i < nameArray.length; i++) {
  queryStringName = nameArray[i].split('=');
  if (queryStringName[0] == name) {
    return queryStringName[1];
  }
}
}


function searchBox(){


    var width = getWidth($F('size'), $F('columns'), false) -12;
    var code = '<div style="font-size:12px; font-family:verdana, arial, sans-serif;width:'+width+'px;border:1px solid #B9B9B9;padding:2px 6px"><form action="http://widget.shopstyle.com/widget" target="shopstyle_search"><input type="hidden" name="pid" value="'+document.getElementById('pid').innerHTML + '"/>ShopStyle search: <input type="text" name="fts"/> <input type="submit" value="Go"/></form></div>';

    if(document.picker.sampleText.value.indexOf('ShopStyle search') > 0){
        makeWidget();
    }
    else {

        document.picker.sampleText.value = document.picker.sampleText.value + code;

        //this does not work in ie7
        //document.getElementById('sampleFrame').innerHTML = document.getElementById('sampleFrame').innerHTML + code;

        //this does
        var newdiv = document.createElement("div");
        newdiv.innerHTML = code;
        var sampleFrame = document.getElementById("sampleFrame");
        sampleFrame.appendChild(newdiv);


    }

}

function createPhotoLayout2(nid){
    return createPhotoLayout(nid);
}

function createSlideShow2(nid, size){
    return createSlideShow(nid, size);
}

function getQueryVariable(variable) {
  var query = window.location.search.substring(1);
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
    if (pair[0] == variable) {
      return pair[1];
    }
  }
}