Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.07.2014, 13:36
Новичок на форуме
Отправить личное сообщение для eugen35 Посмотреть профиль Найти все сообщения от eugen35
 
Регистрация: 21.07.2014
Сообщений: 9

виджет, только сторона клиента (JS, JQUery, работа с датами, масштабирование)
виджет, только сторона клиента (JS, JQUery, работа с датами, масштабирование)
Диаграмма Ганта - продолжить разработку. Описание текущего кода и его работу можете увидеть в задании. Сам код - в http://jsfiddle.net/PWvL5/

Стоимость: 1500 руб. за проект.

Описание работы скрипта:

Работает в общем-то банально. В общем используются три вида функций:
1) функция для определения числа дней в месяце getDaysinMonth().
2) функция для определения начала предыдущего/последующего периода prevNextPeriod().
(аргументы дата, для которой нужно определить предыдущий период, dir – направление (предыдущий или последующий), значения prev, prev+, next, next+. Разница с плюсом в том, что если дата, для которой нужно определить предыдущий период, итак является началом периода, то при prev она же и возвращается, а при prev+ возвращается дата периода, идущего перед этим периодом. То же самое с next и next+).
3) функция для определения формата вывода названия периода (формат вывода даты) – getUnit().
Они иногда присутствуют в нескольких модификациях (отдельно для дней недели, отдельно для месяцев и т.д.).

Есть 10 шкал (1 шкала это объект) в массиве. Каждая шкала состоит из двух кусков: мелкие деления (mainUnit) и крупные деления (unit). Т.е. в одном крупном делении несколько мелких. Ну и помимо этого навешано несколько методов: (prevNextPeriod() – отдельно для мелких и крупных делений, getUnit()– отдельно для мелких и крупных делений) и т.п. Также есть полезное свойство/метод unitLength – для мелких делений оно содержит примитив – ширину для их отображения на экране в px. А для крупных делений это метод, который возвращает расчётную ширину в px для их отражения на экране (а сделать это пришлось из-за того, что у месяцев разная длина).

Ну а дальше нарисовать любую шкалу (<table><td>) не проблема: берём заданную дату начала шкалы, вставляем <td>, затем берём с помощью prevNextPeriod следующий период и снова рисуем <td>, пока следующий период не станет больше заданной даты окончания шкалы.
(код длиной в пять строчек)

Ну и осталось добавить в масштабе выбранной шкалы задачи - activities (есть дата начала и дата конца задачи). Вычисляю разницу в милисекундах от заданного начала шкалы до даты начала задачи, затем, зная отображаемую ширину мелких делений, посредством деления, перевожу дату начала в координату left задачи в масштабе данной шкалы. Тоже самое с датой конца задачи. Добавляю задачу.
(код длиной в 8 строчек)


Чего хочу:
0) я в коде поизлишествовал (не сразу у меня сложилось такое мнение и есть лишние кусочки), буду рад если его перепишете короче и нагляднее и правильнее
(тут цена по договорённости)
1) сделайте модификацию prevNextPeriod() для квартала, полугодия, года и подключите к соответствующим объектам шкалы
(времени Вам на это потребуется 30-60 минут с отладкой).
1,5) среднюю горизонтальную border между шкалой крупных и мелких делений уберите (см. скришоты)
1,7) сделайте, чтобы не по двойному клику переключались шкалы, а по ctrl+колёсико мыши вверх/вниз.
2) ниже сетки добавить столбцы, обозначающие рабочее время (оно берётся из функции– смотри пункт 5 ниже и получается округлением до ближайшего периода) - С 9 до 18-00, С 13-00 до 14-00 перерыв на обед. В предпраздничные дни – до 17-00. СКРИНШОТЫ ПРИЛОЖЕНЫ (0-3 – для шкал 0-3 соответственно, а далее серые столбцы не рисуются у всех шкал далее будет просто белое поле – смотри скриншот 4).
3) дату старта диаграммы и дату окончания диаграммы устанавливать автоматически, исходя из списка задач (от начала самой ранней задачи, до конца самой поздней задачи);
(15-30 минут)
4) высоту задач и отступов (кстати, это класс .gantChartBar) между ними сделать в виде переменной;
(5-10 минут)
5) сделать функцию для определения по дате: рабочий день, предпраздничный или выходной/праздничный. Ну и для выдачи расписания рабочего времени по дате, выдача в виде массива – что то вроде: индекс 0 значение 9-13-00, индекс 1 значение 14-00-18-00.
6) ну и наконец, сделать так, чтобы дата конца задачи считалась с использованием функции с -аргументами: дата начала, длительность задачи – на выходе получаем дату окончания. При этом:
- Если длительность задана в днях, часах, минутах – считаются только рабочие дни, часы, минуты (см. п.5 функция определения рабочего времени).
- Если длительность задана в месяцах, кварталах, полугодиях, годах – календарное время используется.
7) Ну и всё это описать – ещё подробнее, чем я здесь описал + комментариев поболее чем я в коде сделал.


Это ещё не всё – остальное – за отдельную оплату.

Разумеется, права на разработку и код принадлежат мне ).
Изображения:
Тип файла: jpg 0.jpg (3.8 Кб, 2 просмотров)
Тип файла: jpg 1.jpg (2.8 Кб, 1 просмотров)
Тип файла: jpg 2.jpg (3.6 Кб, 1 просмотров)
Тип файла: jpg 4.jpg (2.3 Кб, 1 просмотров)
Тип файла: jpg 3.jpg (3.8 Кб, 0 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 29.07.2014, 14:28
Аватар для MallSerg
Профессор
Отправить личное сообщение для MallSerg Посмотреть профиль Найти все сообщения от MallSerg
 
Регистрация: 07.03.2011
Сообщений: 853

http://taitems.github.io/jQuery.Gantt/
Ответить с цитированием
  #3 (permalink)  
Старый 29.07.2014, 21:13
Аватар для nerv_
junior
Отправить личное сообщение для nerv_ Посмотреть профиль Найти все сообщения от nerv_
 
Регистрация: 29.11.2011
Сообщений: 3,924

MallSerg, оставляй номер счета
__________________
Чебурашка стал символом олимпийских игр. А чего достиг ты?
Тишина - самый громкий звук
Ответить с цитированием
  #4 (permalink)  
Старый 30.07.2014, 12:18
Аватар для MallSerg
Профессор
Отправить личное сообщение для MallSerg Посмотреть профиль Найти все сообщения от MallSerg
 
Регистрация: 07.03.2011
Сообщений: 853

Это чистый альтруизм
Ответить с цитированием
  #5 (permalink)  
Старый 31.07.2014, 08:50
Новичок на форуме
Отправить личное сообщение для eugen35 Посмотреть профиль Найти все сообщения от eugen35
 
Регистрация: 21.07.2014
Сообщений: 9

Спасибо, аккуратненько) Только я хочу ещё стрелочки. Также показалось, что там нет такого понятия как длительность задачи, фиксированное начало и т.п. Т.е. они, видимо, предлагают отрисовку и события, а расчёт дат, исходя из последовательности задач и их длительности уже не предлагают. Кроме того, скрипт вроде бы тормозит при рендеринге... Хотя, возможно, из-за загрузки данных о задачах...

У меня сейчас уже отрисовка есть в разных масштабах (как, видимо, и у них). Те правки, которые я просил внести, незначительны (1-4 часа работы). А дальше нужно писать расчёт последовательности и стрелочки и т.п.
И ещё, понятно, что эти товарищи о параметричности класса подумали и грамотно код написали, чего у меня, разумеется, нет - и это была одна из задач - переписать красиво и правильно...

Ну и в общем склонность у меня писать своё, хотя и думаю что в этом не прав ))

Последний раз редактировалось eugen35, 31.07.2014 в 08:53.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Работа с датой на JS или jQuery Bond Общие вопросы Javascript 2 17.06.2013 18:40