Перейти к содержанию
tolik777

[Выполнено] Пофиксить баг календаря. Подружить модуль и шаблон

Рекомендуемые сообщения

Краткое описание задачи: Необходимо пофиксить баг календаря связанный с позиционированием. Насколько я разобрался, работа в основном связана с JavaScript, плюс немного CSS.

 

Исходные данные:

ocStore 1.5.5.1.2

Модуль OpenCart Reservations -booking system for products vqmod

Шаблон Pizza Chef - Bootstrap Template 1.0.2 vqmod

Больше никаких изменений не вносилось.

 

Более подробное описание задачи:

Итак на основе OpenCart и вышеупомянутого модуля создается сервис аренды. Смысл данного модуля в том, что он подменяет поле даты (задается опция) у товара и добавляет второй поле, т.к. срок аренды с такой-то даты по такую то.

Вот как это выглядит на дефолтном шаблоне:

post-669947-0-84614400-1402929641_thumb.png

При этом, модуль заменяет стандартный модуль календаря на Zebra_Datepicker

 

Проблема в том, что после установки шаблона Pizza, он также заменяет модуль календаря на какой-то свой. Я пытался оставить в шаблоне старый модуль календаря, для этого я исключил XML-файл для vqmod, который вырезает модуль календаря, а также в шаблон product.tpl добавил строчки даты (когда отображаются опции даты) из дефолтного шаблона.

Календарь и функции аренды заработали, но криво, т.к. во первых иконка календарика отображается не там где надо, а во вторых при щелчке на ней сам календарь отображается снизу страницы.

post-669947-0-37978200-1402930228_thumb.png

post-669947-0-60137700-1402930238_thumb.png

 

Пытался разобраться сам. В коде календаря zebra_datepicker.src.js нашел функции для расчета позиции отображения иконки и самого календаря:

 var

                    // get the date picker width and height
                    datepicker_width = datepicker.outerWidth(),
                    datepicker_height = datepicker.outerHeight(),

                    // compute the date picker's default left and top
                    // this will be computed relative to the icon's top-right corner (if the calendar icon exists), or
                    // relative to the element's top-right corner otherwise, to which the offsets given at initialization
                    // are added/subtracted
                    left = (undefined !== icon ? icon.offset().left + icon.outerWidth(true) : $element.offset().left + $element.outerWidth(true)) + plugin.settings.offset[0],
                    top = (undefined !== icon ? icon.offset().top : $element.offset().top) - datepicker_height + plugin.settings.offset[1],

                    // get browser window's width and height
                    window_width = $(window).width(),
                    window_height = $(window).height(),

                    // get browser window's horizontal and vertical scroll offsets
                    window_scroll_top = $(window).scrollTop(),
                    window_scroll_left = $(window).scrollLeft();

                // if date picker is outside the viewport, adjust its position so that it is visible
                if (left + datepicker_width > window_scroll_left + window_width) left = window_scroll_left + window_width - datepicker_width;
                if (left < window_scroll_left) left = window_scroll_left;
                if (top + datepicker_height > window_scroll_top + window_height) top = window_scroll_top + window_height - datepicker_height;
                if (top < window_scroll_top) top = window_scroll_top;

                // make the date picker visible
                datepicker.css({
                    'left':     left,
                    'top':      top
                });

top как раз задает позицию по вертикали. Если поставить там фиксированное значение, то все работает как надо, но стоит изменить размер окна браузера, так по вертикали сразу же происходит смещение. В общем должна быть привязка к элементу формы по которой щелкнули. Но здесь у меня ума не хватает разобраться.

 

В общем ищу исполнителя данной интересной задачки.

 

Сроки ваши.

 

По стоимости готов выслушать.

 

Оплата WebMoney, RBKMoney, Яндекс.Деньги, Сбербанк, на карту, на р/с и т.д. как вам удобнее.

 

Если нужен отзыв на weblancer или fl, то можно оформить через биржу фриланса с оставлением отзыва (у меня там эккаунты по несколько лет с постоянными заказами и отзывами).

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Работа сделана. Топик закрыт.

Спасибо пользователю m899 за качественно выполненную работу!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Гость
Эта тема закрыта для публикации ответов.

  • Похожий контент

    • От Exzik
      Добрый день , форумчане 
      Появилась проблема, которую я не могу решить сам 
      На страницу категорий добавил скрипт прокрутки, работает как часы  и грузит все отлично.
      Проблема в том, что из-за этого скрипта перестали работать кнопки (Добавить в корзину и т.д )
      Не могли бы подсказать в чем именно проблема ? 
      Ссылка на сайт  тут
       
       
      Скрипт 
      $(function() { function scrollLoader() { console.log('---', 123) if ($(window).scrollTop() == $(document).height() - $(window).height()) { console.log('---', 'ok') setTimeout(function() { $('#endless').trigger('click') }, autoscroller.delay) } } var autoscroller = [] //setting autoscroller.hidePagination = 1 autoscroller.autoScroll = 0 autoscroller.catcher = '#endless' autoscroller.delay = 1000 autoscroller.loading = 0 $(window).scroll(function() { scrollLoader() if (inWindow(autoscroller.catcher) && !autoscroller.loading && autoscroller.autoScroll) { autoscroller.loading = true $('#endless .fa-refresh').addClass('btn-load-new') } }) if ($('.category-catalog').length) { if ($('.pagination').length && !$('.pagination > li:last-child').hasClass('active')) { $('#content col-12 col-md-9 order-2').hide() $('.pagination') .parent() .before( '<div class="col-xs-12 text-center"><button class="btn btn-success btn-lg" id="endless" style="margin: 15px auto; padding: 10px 120px;" ><span class="btn-load-new">Еще товары</span></i></button></div>') $('#endless').on('click', function(e) { var lastProduct = $('.pagination') .closest('.category-catalog') .find('.front-top-products li:last-child') var nextPage = $('ul.pagination li.active').next().find('a:first-child') var nextPageHref = nextPage.attr('href').substring(7) // console.log('---',nextPageHref); // console.log('---', nextPage.attr('href')); $.ajax({ url: 'https://' + nextPageHref, beforeSend: function() { $('#endless .fa-refresh').addClass('btn-load-new') }, success: function(data) { var products = $(data).find('.category-catalog .front-top-products') lastProduct.after(products) $('.pagination').html($(data).find('.pagination > *')) nextPage = $('ul.pagination li.active').next().find('a:first-child') if (nextPage.length == 0) { $('#endless').remove() } else { $('#endless .fa-refresh').removeClass('btn-load-new') } autoscroller.loading = 1 }, }) return false }) } } function inWindow(el) { if ($(el).length) { var scrollTop = $(window).scrollTop() var windowHeight = $(window).height() var offset = $(el).offset() if (scrollTop <= offset.top && ($(el).height() + offset.top) < (scrollTop + windowHeight)) { return true } } return false } })  
    • От deadlylimonad
      Появилась ошибка в JS при переезде на https, перестали подгружаться товары в категориях (бесконечная прокрутка).
      Вот что в консоли:
      Mixed Content: The page at 'https://abt-professional.com/magazin/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://abt-professional.com/magazin/?page=2'. This request has been blocked; the content must be served over HTTPS. send @ jquery-2.1.1.min.js?j2v=2.8.5:4 ajax @ jquery-2.1.1.min.js?j2v=2.8.5:4 n.(anonymous function) @ jquery-2.1.1.min.js?j2v=2.8.5:4 load @ jquery-ias.min.js?j2v=2.8.5:13 (anonymous) @ jquery-ias.min.js?j2v=2.8.5:13 j @ jquery-2.1.1.min.js?j2v=2.8.5:2 add @ jquery-2.1.1.min.js?j2v=2.8.5:2 c.next @ jquery-ias.min.js?j2v=2.8.5:13 scrollHandler @ jquery-ias.min.js?j2v=2.8.5:13 a @ jquery-ias.min.js?j2v=2.8.5:13 setTimeout (async) d @ jquery-ias.min.js?j2v=2.8.5:13 f @ jquery-2.1.1.min.js?j2v=2.8.5:2 dispatch @ jquery-2.1.1.min.js?j2v=2.8.5:3 r.handle @ jquery-2.1.1.min.js?j2v=2.8.5:3  
    • От deadlylimonad
      Привет. Проблема в том, что все выпадающие меню (главное вверху и несколько в футере) в мобильной версии сайта начинают работать т.е. выпадать только после прокрутки страницы на тлф. туда-сюда, или если в браузере (при эмуляции тлф.) то после некоторого перетаскивания границ экрана эмулируемого устройства (320-760px). Думаю, что-то с подгрузкой скриптов. Куда копать?
      Версия ocStore 2.3.0.2.2, JOURNALv.2.8.5
      https://abt-professional.com/
    • От Techno1og
      ocStore 1.5. Нужно внести правки в css и javascript  на основании отчета W3C validator,
      Сократить объем кода, переместить скрипты в подвал сайта, объединить стили и т.д...сохранив логику. 
       
    • От Yarilo
      Добрый день! Заметил ошибки в карточке товара, что это может быть?
       
      Как можно это исправить? Подскажите пожалуйста!
  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.