362 lines
10 KiB
JavaScript
362 lines
10 KiB
JavaScript
$('#listLeft ul li a').live("click", function() {
|
|
if ($(this).hasClass("listLeftSelected")) {
|
|
return false;
|
|
}
|
|
$('.listLeftSelected').removeClass("listLeftSelected");
|
|
$(this).addClass('listLeftSelected');
|
|
var objId = $(this).attr("data-id");
|
|
var tab = $('.innerSelected').attr("data-slug");
|
|
var formData = getSearchFormJSON();
|
|
formData.object_id = objId;
|
|
var urlString = JSONtoQueryString(formData);
|
|
History.pushState(formData, "", urlString);
|
|
$.getJSON("/m/get_details", {
|
|
'tab': tab,
|
|
'object_id': objId
|
|
}, function(data) {
|
|
$('#imageInside').css({'backgroundImage': 'url(' + data.main_image.thumb + ')'});
|
|
$('#textRight').text(data.title).formatTitle();
|
|
var searchTerm = $('.searchListField').val();
|
|
var html = data.html;
|
|
if (searchTerm != '') {
|
|
html = highlightWordsNoCase(html, searchTerm);
|
|
// html = html.replace(searchTerm, "<span class='highlight'>" + searchTerm + "</span>");
|
|
}
|
|
$('#bottomRight').html(html);
|
|
// console.log(data);
|
|
});
|
|
return false;
|
|
});
|
|
|
|
|
|
$('.thumbsDetails').live("click", function(e) {
|
|
// alert($(this).attr("data-bigimage"));
|
|
var bigImage = $(this).attr("data-bigimage");
|
|
var $img = $('<img />').attr("src", bigImage);
|
|
$('#lightbox, #lightboxPanel').fadeIn(400);
|
|
$('#lightboxPanel').empty().append($img);
|
|
});
|
|
|
|
|
|
$('.toggleNext').live("click", function(e) {
|
|
e.preventDefault();
|
|
var $next = $(this).next();
|
|
if (!$next.is(":visible")) {
|
|
$next.slideDown();
|
|
} else {
|
|
$next.slideUp();
|
|
}
|
|
});
|
|
|
|
function highlightWordsNoCase(data, word)
|
|
{
|
|
var regex = new RegExp("(" + word + ")", "gi");
|
|
return data.replace(regex, "<span class='searchHighlight'>$1</span>");
|
|
}
|
|
|
|
/* Get a jquery <option> row for a sort field, requires s.operator, s.field_name, s.friendly_name */
|
|
function getOption(s) {
|
|
return $('<option />').val(s.operator + s.field_name).text(s.friendly_name);
|
|
}
|
|
|
|
/* Get a Jquery List Row object for an item - requires item.id and item.title*/
|
|
function getLi(item) {
|
|
var titleLength = 30;
|
|
var $li = $('<li />').addClass("tabListItem");
|
|
var $a = $('<a />').attr("href", '#').attr("data-id", item.id).appendTo($li);
|
|
// console.log(item.title.length);
|
|
var $span = $('<span />').text(item.title).appendTo($a);
|
|
return $li;
|
|
}
|
|
|
|
$(function() {
|
|
$('#lightbox').click(function() {
|
|
$('#lightbox, #lightboxPanel').fadeOut(400);
|
|
});
|
|
|
|
/* search button toggle */
|
|
$('.searchInnerField').hide();
|
|
$('#searchInner').toggle(function() {
|
|
$('.searchInnerField').slideDown();
|
|
}, function() {
|
|
$('.searchInnerField').slideUp();
|
|
});
|
|
/* search button end */
|
|
|
|
|
|
// $('#listLeft ul li a').eq(0).click();
|
|
// alert("hi");
|
|
|
|
|
|
$('.tabCategory').click(function() {
|
|
var $this = $(this);
|
|
if ($this.hasClass('.innerSelected')) {
|
|
return false;
|
|
}
|
|
|
|
$('.innerSelected').removeClass("innerSelected");
|
|
$this.addClass("innerSelected");
|
|
$('.displayedTab').removeClass("displayedTab");
|
|
var tab = $this.attr("data-slug");
|
|
var tabId = $this.attr("data-id");
|
|
$('#tabText_' + tabId).addClass("displayedTab");
|
|
doListLoading();
|
|
$.getJSON("/m/get_tab", {
|
|
'tab': tab,
|
|
// 'page_no': 1
|
|
}, function(data) {
|
|
// $('#loadingList').hide();
|
|
stopListLoading(data.page);
|
|
/* begin if for has_list, ideally make into separate render function */
|
|
if (data.has_list) {
|
|
/* handle sort options on list */
|
|
$select = $('#orderBySelect');
|
|
$select.empty();
|
|
var sorts = data.sorts;
|
|
if (sorts.length == 0) { $select.hide(); } else { $select.show(); }
|
|
for (var j=0; j<sorts.length; j++) {
|
|
var s = sorts[j];
|
|
var $opt = getOption(s);
|
|
$select.append($opt);
|
|
}
|
|
/* end handle sort */
|
|
|
|
/* handle displaying initial list on page */
|
|
displayList(data.page.items);
|
|
/* end display initial list */
|
|
|
|
} else {
|
|
/* end if has_list */
|
|
$('#textRight').text(data.title).formatTitle();
|
|
var $html = getNoListHtml(data.page.items);
|
|
$('#bottomRight').empty().append($html);
|
|
History.pushState({'tab': tab}, "", "?tab=" + tab);
|
|
}
|
|
});
|
|
});
|
|
|
|
$('#orderBySelect').change(function(e) {
|
|
$('#listForm').submit();
|
|
});
|
|
|
|
|
|
$('#searchListIcon').click(function() {
|
|
$('#listForm').submit();
|
|
});
|
|
|
|
/*
|
|
$('.searchListField').keyup(function(e) {
|
|
e.preventDefault();
|
|
if (e.keyCode == 13) {
|
|
$('#listForm').submit();
|
|
}
|
|
});
|
|
*/
|
|
|
|
$('#listForm').submit(function(e) {
|
|
e.preventDefault();
|
|
doListLoading();
|
|
// var urlString = "?tab_id=" + $('.innerSelected').attr("data-id") + "&sort=" + sortString + "&search=" + searchTerm;
|
|
var formData = getSearchFormJSON();
|
|
var urlString = JSONtoQueryString(formData);
|
|
// console.log(urlString);
|
|
History.pushState(formData, "", urlString);
|
|
$.getJSON("/m/get_list", formData, function(data) {
|
|
stopListLoading(data);
|
|
displayList(data.items);
|
|
});
|
|
});
|
|
|
|
|
|
$('#triangleUp').click(function() {
|
|
goPreviousPage();
|
|
});
|
|
|
|
$('#triangleDown').click(function() {
|
|
goNextPage();
|
|
});
|
|
|
|
var State = History.getState();
|
|
// console.log(State);
|
|
|
|
|
|
var queryData = QueryStringToJSON(State.hash);
|
|
|
|
doState(queryData);
|
|
|
|
});
|
|
|
|
|
|
|
|
/*
|
|
this function will grow to be a monster. be gentle with it, ideally move state functions to a state namespace or so.
|
|
*/
|
|
function doState(queryData) {
|
|
// console.log(queryData);
|
|
// var tab_slug = queryData.tab;
|
|
// alert(tab_slug);
|
|
if (queryData.tab == undefined || queryData.tab == '') {
|
|
// alert("foo");
|
|
var $tab = $('.defaultTab');
|
|
} else {
|
|
var $tab = $('.tabCategory[data-slug=' + queryData.tab + ']');
|
|
if ($tab.length == 0) {
|
|
$tab = $('.defaultTab');
|
|
}
|
|
}
|
|
$tab.click();
|
|
}
|
|
|
|
|
|
/*
|
|
>>>var foo = {'var1': 'bar', 'var2': 'baz'}
|
|
>>> JSONtoQueryString(foo);
|
|
'?var1=bar&var2=baz'
|
|
*/
|
|
function JSONtoQueryString(obj) {
|
|
var s = "?";
|
|
for (var o in obj) {
|
|
if (obj.hasOwnProperty(o)) {
|
|
s += o + "=" + obj[o] + "&";
|
|
}
|
|
}
|
|
return s.substring(0, s.length - 1);
|
|
}
|
|
|
|
/*
|
|
>>>var foo = "/something/bla/?var1=bar&var2=baz";
|
|
>>>QueryStringToJSON(foo);
|
|
{'var1': 'bar', 'var2': 'baz'}
|
|
*/
|
|
function QueryStringToJSON(qstring) {
|
|
if (qstring.indexOf("?") == -1) {
|
|
return {};
|
|
}
|
|
var q = qstring.split("?")[1];
|
|
var args = {};
|
|
var vars = q.split('&');
|
|
// console.log(vars);
|
|
for (var i=0; i<vars.length; i++) {
|
|
var kv = vars[i].split('=');
|
|
var key = kv[0];
|
|
var value = kv[1];
|
|
args[key] = value;
|
|
}
|
|
return args;
|
|
}
|
|
|
|
function displayList(items) {
|
|
var state = QueryStringToJSON(History.getState().hash);
|
|
console.log(state);
|
|
for (var i=0; i<items.length; i++) {
|
|
var $li = getLi(items[i]);
|
|
$('#listLeft ul').append($li);
|
|
}
|
|
if (state.object_id == undefined || state.object_id == '') {
|
|
$('#listLeft ul li a').eq(0).click();
|
|
} else {
|
|
$('#listLeft ul li a[data-id=' + state.object_id + ']').click(); //FIXME: FIXME!!!!!!!!!!
|
|
}
|
|
}
|
|
|
|
function doListLoading() {
|
|
$('.tabListItem').remove();
|
|
$('#loadingList').show();
|
|
}
|
|
|
|
function stopListLoading(page) {
|
|
$('#currPageNo').text(page.page_no);
|
|
$('#totalPages').text(page.num_pages);
|
|
$('#loadingList').hide();
|
|
if (page.page_no == 1) {
|
|
$('#triangleUp').hide();
|
|
} else {
|
|
$('#triangleUp').show();
|
|
}
|
|
if (page.page_no == page.num_pages) {
|
|
$('#triangleDown').hide();
|
|
} else {
|
|
$('#triangleDown').show();
|
|
}
|
|
}
|
|
|
|
function goNextPage() {
|
|
var currPage = parseInt($('#currPageNo').text());
|
|
var totalPages = parseInt($('#totalPages').text());
|
|
if (currPage < totalPages) {
|
|
getPage(currPage + 1);
|
|
}
|
|
}
|
|
|
|
function goPreviousPage() {
|
|
var currPage = parseInt($('#currPageNo').text());
|
|
if (currPage > 1) {
|
|
getPage(currPage - 1);
|
|
}
|
|
}
|
|
|
|
function getPage(pageNo) {
|
|
$('#page_no').val(pageNo);
|
|
$('#listForm').submit();
|
|
/*
|
|
doListLoading();
|
|
$.getJSON("/m/get_list", {
|
|
'tab_id': $('.innerSelected').attr("data-id"),
|
|
'page': pageNo,
|
|
'sort': $('#orderBySelect').val()
|
|
}, function(page) {
|
|
stopListLoading(page);
|
|
displayList(page.items);
|
|
});
|
|
*/
|
|
}
|
|
|
|
function getNoListHtml(items) {
|
|
var $rhs = $('<div />');
|
|
for (var i=0; i<items.length; i++) {
|
|
var $obj = getNoListItemHtml(items[i]);
|
|
$rhs.append($obj);
|
|
}
|
|
return $rhs;
|
|
}
|
|
|
|
|
|
function getNoListItemHtml(item) {
|
|
if (item.hasOwnProperty("url")) {
|
|
var $ret = $('<div />').addClass("noListItem");
|
|
var $title = $("<div />").addClass("noListTitle").appendTo($ret);
|
|
var $a = $('<a />').attr("href", item.url).addClass("orangeLink").text(item.text).appendTo($title);
|
|
var $text = $("<div />").addClass("noListText").html(item.text).appendTo($ret);
|
|
} else {
|
|
var $ret = $('<div />').addClass("noListItem").addClass("collapsible");
|
|
var $title = $("<div />").addClass("orange").addClass("toggleNext").text(item.title).appendTo($ret);
|
|
var $text = $("<div />").addClass("noListText").addClass("hidden").html(item.text).appendTo($ret);
|
|
}
|
|
return $ret;
|
|
}
|
|
|
|
function getSearchFormJSON() {
|
|
return {
|
|
'tab': $('.innerSelected').attr("data-slug"),
|
|
'sort': $('#orderBySelect').val(),
|
|
'search': $('#searchList').val(),
|
|
'page': $('#page_no').val()
|
|
}
|
|
}
|
|
|
|
jQuery.fn.formatTitle = function() {
|
|
var txt = $(this).text();
|
|
var fontSize;
|
|
// alert(txt.length);
|
|
if (txt.length < 32) {
|
|
fontSize = 50;
|
|
} else if (txt.length < 60) {
|
|
fontSize = 40;
|
|
} else if (txt.length < 100) {
|
|
fontSize = 30;
|
|
} else {
|
|
fontSize = 20;
|
|
}
|
|
this.css({'fontSize': fontSize + "px"});
|
|
}
|