/* a - категория - первое меню b - компания - второе меню p - проект */ //переменные(скорее константы), содержащие значения скоростей. используются для анимации. var itemSpeed = 300; var listSpeed = 500; var hideSpeed = 100; var loadSpeed = 500; //глобальные переменные, содержащие текущие значения: var currenta = 0; // - ID категории var currentb = 0; // - ID компании var currentp = 0; // - ID проекта //флаг игнорирования кликов. используется при подгрузке данных var blockClick = false; $(document).ready(function() { //инициализация обоих меню - категорий и компаний //меню категорий больше перегружаться не будет initMenu(); //обработчик клика на лого. вызывает переинициализацию второго меню - меню компаний $(".logolink").click(function(){ if (blockClick) return; if (currenta == 0 && currentb == 0) return; clickCategoryW(currenta); if (currentb != 0) { $("#bb"+currentb).animate({width:'toggle'}, itemSpeed); //сворачиваем подменю проектов компании setTimeout(function() {loadCompany(0);}, loadSpeed); } }); //готовим фоновую картинку к перетаскиванию $(".image").jqDrag(); //обработчик клика на слово "Адрес" из футера. показываем слой с картой $("#map").click(function(){ $(".map").css("top", parseInt(($(document).height()-$(".map").height())/2)+"px"); $(".map").css("left", parseInt(($(document).width()-$(".map").width())/2)+"px"); $(".map").toggle(); }); $(".map").click(function(){ $(".map").hide(); }); //поскольку на странице предполагается перетаскивание, используем плагин, запрещающий выделение текста на некоторых слоях $(".menu").disableTextSelect(); $(".image").disableTextSelect(); $(".info").disableTextSelect(); $(".footer").disableTextSelect(); }); //Функция инициализации меню. Обращаемся к серверному скрипту, передаем параметр c со значением c. //Возвращаемый хэш содержит списки - всех категорий и всех компаний function initMenu() { $.getJSON("engine.php?c=c", function(data) { if (typeof data.result !== "undefined") { //Выводим списки категорий и компаний createCategoryList(data.result.category); createCompanyList(data.result.company); //элементы списков категорий и компаний - двойные (белые и черные) для анимации. //создаем обработчики кликов на элементы списков $("#category .b").click(function(){ clickCategoryB(getId($(this).attr("id"), 'ab')); }); $("#category .w").click(function(){ clickCategoryW(getId($(this).attr("id"), 'aw')); }); $("#company .b").click(function(){ clickCompanyB(getId($(this).attr("id"), 'bb')); }); $("#company .w").click(function(){ clickCompanyW(getId($(this).attr("id"), 'bw')); }); } }); } /* Элементы списков категорий и компаний - двойные (белые и черные) для анимации. Черный - B (black) - это "включение", а белый - W (white) - "выключение". */ //Функция-обработчик клика на черный элемент списка категорий. //В результате список компаний будет содержать только компании, для которых были реализованы проекты в данной категории function clickCategoryB(a) { if (blockClick) return; if (a <= 0) return; blockClick = true; //если перед этим уже была выбрана какая-то категория, то нужно "отключить" ее элемент в списке if (currenta != 0) $("#ab"+currenta).animate({width:'toggle'}, itemSpeed); //"включаем" элемент списка выбранной категории $("#ab"+a).animate({width:'toggle'}, itemSpeed); //скрываем (сворачиваем) текущий список компаний $("#company .w").addClass("wb"); $("#company .b").hide(); $("#company .wb").animate({width:'toggle'}, hideSpeed); //после некоторой паузы разворачиваем новый список компаний - для выбранной категории setTimeout(function() {loadCategory(a);}, loadSpeed); } //Функция-обработчик клика на белый элемент списка категорий. //Это "отключение" категории. Список категории примет значение по умолчанию function clickCategoryW(a) { if (blockClick) return; if (a <= 0) return; blockClick = true; //"отключаем" текущий элемент списка категорий $("#ab"+a).animate({width:'toggle'}, itemSpeed); //скрываем (сворачиваем) текущий список компаний $("#company .w").addClass("wb"); $("#company .b").hide(); $("#company .wb").animate({width:'toggle'}, hideSpeed); //после некоторой паузы разворачиваем список компаний по умолчанию (всех компаний) setTimeout(function() {loadCategory(0);}, loadSpeed); } //Функция-обработчик клика на черный элемент списка компаний //В результате под выбранным пунктом появится подменю проектов function clickCompanyB(b) { if (blockClick) return; if (b <= 0) return; blockClick = true; //если перед этим уже была выбрана какая-то компания, то нужно "отключить" ее элемент в списке if (currentb != 0) { $("#bb"+currentb).animate({width:'toggle'}, itemSpeed); //сворачиваем подменю проектов компании setTimeout(function() {loadCompany(0);}, loadSpeed); } //"включаем" пункт меню выбранной компании $("#bb"+b).animate({width:'toggle'}, itemSpeed); //после некоторой паузы разворачиваем подменю, содержащий проекты для выбранной компании setTimeout(function() {loadCompany(b);}, loadSpeed); } //Функция-обработчик клика на белый элемент списка компаний //Это "отключение" компании. Подменю проектов будет спрятано function clickCompanyW(b) { if (blockClick) return; if (b <= 0) return; blockClick = true; //"отключаем" пункт меню выбранной компании $("#bb"+b).animate({width:'toggle'}, itemSpeed); //после некоторой паузы сворачиваем подменю проектов выбранной компании setTimeout(function() {loadCompany(0);}, hideSpeed); } //Функция-обработчик клика на проект - элемент подменю компании function clickProjectB(p) { if (blockClick) return; if (p <= 0) return; //в момент подгрузки бэкграунда в общем-то необязательно блокировать клики. но можно и убрать комментарий //blockClick = true; //если перед этим был активен другой пункт меню проектов, то "выключаем" его if (currentp != 0) $("#pb"+currentp).animate({width:'toggle'}, itemSpeed); //"включаем" элемент меню выбранного проекта $("#pb"+p).animate({width:'toggle'}, itemSpeed); //после некоторой паузы подгружаем проект - меняем бэкграунд и активируем информационный блок (справа) setTimeout(function() {loadProject(p);}, loadSpeed); } //Функция-загрузчик компаний для выбранной категории //Обращаемся к серверному скрипту. Передаем параметр c=a и параметр a, содержащий ID категории function loadCategory(a) { $.getJSON("engine.php?c=a&a="+a, function(data) { if (typeof data.result !== "undefined") { //Необходимо произвести несколько шаманский действий: //прячем список компаний $("#company").hide(); //заменяем список на новый createCompanyList(data.result.company); //готовим элементы к эффектному "выезжанию" $("#company .w").addClass("wh"); $("#company .b").animate({width:'toggle'}, 1); //показываем слой списка компаний - пока он как бы пуст $("#company").show(); //список компаний эффектно "выезжает", после чего черные и белые пункты меню занимают полженные места для будущей анимации $("#company .b").animate({width:'toggle'}, listSpeed, function(){$("#company .w").removeClass("wh");}); //присваиваем соответствующие значения глобальным переменным currenta = a; currentb = 0; blockClick = false; //создаем обработчики кликов на черные и белые пункты меню списка компаний $("#company .b").click(function(){ clickCompanyB(getId($(this).attr("id"), 'bb')); }); $("#company .w").click(function(){ clickCompanyW(getId($(this).attr("id"), 'bw')); }); } }); } //Функция-загрузчик списка проектов для выбранной компании //В результате появится подменю проектов под выбранным пунктом из списка компаний, если передается ненулевое значение //Происходит обращение к серверному скрипту. Передается параметр c=b, параметр b равный ID компании, а также параметр a, имеющий текущее значение категории //либо подменю спрячется function loadCompany(b) { if (b == 0) { //если передается нулевое значение, то подменю проектов просто сворачивается //хотя совсем непросто, нужно произвести несколько действий, чтобы во всех разумных браузерах анимация смотрелась корректно var ul = $("#bw"+currentb).parent().find("ul"); ul.find(".w").addClass("wb"); ul.find(".b").hide(); ul.find(".wb").animate({width:'toggle'}, hideSpeed); ul.animate({height:'toggle'}, itemSpeed, function(){ul.empty(); ul.remove();}); currentb = 0; blockClick = false; } else { $.getJSON("engine.php?c=b&a="+currenta+"&b="+b, function(data) { if (typeof data.result !== "undefined") { //формируем подменю, содержащее список проектов. пока оно не принадлежит "дому" var ul = $("