Веб-приложение Календарь

@Alpi · Регистрация: 16.11.2012

Студворк — интернет-сервис помощи студентам

В общем, стоит задача сделать вебприложение-календарь, или что-то вроде appointment app. Должна быть возможность назначать события на определенную дату и определенный час, и чтобы потом этот час показывался как занятый. У каждого юзера свой календарь.
Я совсем затупил, и пока ничего в сети вменяемого не нашел. Как это должно выглядеть, чтобы можно было передавать в виде JSON и фронт-енд по нему строил календарь, в котором было бы видно, какие дни и часы заняты, а какие нет?

Я пока решил, что должен быть класс события, в котором помимо даты и времени будет ссылка на юзера, которому оно принадлежит и какая-то уже инфа о самом событии, что на данном этапе не важно.
Затем при открытии страницы из базы берется массив событий отфильтрованный по данному юзеру, на неделю или на месяц.

А вот как это показывать потом в JS, чтобы потом было видно свободное время, на которое можно что-то назначить? Может, кто-то ткнет носом в похожий проект на JS? Интересует фронт-енд часть. Спасибо.

@Padimanskas · 26.10.2015, 05:21

Alpi, если пользователь получает данные в виде JSON то их всего лишь нужно привести в внутренний вид объекта.

JavaScript
1
JSON.stringify(userData);

но обычно данные из AJAX трансфомируются самостоятельно, нужно только указать что на выходе мы получаем именно JSON

@Alpi · 26.10.2015, 05:25 **[ТС]**

Padimanskas, да нет, это я все понимаю. Я больше хочу понять, как вообще должен выглядеть код, который будет это все в календаре показывать. Понятия не имею, с чего начать браузерную часть, вот и прошу пример какой-нибудь ((

@Padimanskas · 26.10.2015, 06:26

Кстати, в массиве совсем не обязательно указывать весь календарь) например есть события

JavaScript
1
2
3
4
5
{
    "10/26/2015 15:00": "Сходить в магазин", 
    "11/10/2015 13:00": "Оплатит счет", 
    "11/25/2015 16:00": "Позвонить заказчику"
}

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

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var events = {
    "10/26/2015 15:00": "сходить в магазин", 
    "11/10/2015 13:00": "оплатить счет", 
    "11/25/2015 16:00": "позвонить заказчику"
};
 
function getDayOfWeekByIndex(index) {
    return ["понедельник","вторник","среду","четверг","пятницу","субботу","воскресенье"][index];
}
 
function getMonthByIndex(index, suffix) {
return ["января","февраля","марта","апреля","мая","июня","июля","августа","сентября","октября","ноября","декабря"][index];
}
 
var event;
for(var date in events) {
    event = new Date(date);
    alert(event.getDay() + '-ого ' + getMonthByIndex(event.getMonth()) + ', в ' + getDayOfWeekByIndex(event.getDay()) + ', мне нужно ' + events[date]);
}

Добавлено через 2 минуты
Календарь можно использовать любой. Хоть из jQuery) Обычно в мануале описаны все методы и способ обращения к ним.

@Alpi · 26.10.2015, 06:37 **[ТС]**

Padimanskas, так, я, кажется, понял примерно, в какую сторону двигаться. Спасибо. Вернусь еще потом тупые вопросы задавать )

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .	SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer 8Observer8 08.02.2026 Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .	SDL3 для Web (WebAssembly): Основы отладки веб-приложений на SDL3 по USB и Wi-Fi, запущенных в браузере мобильных устройств 8Observer8 07.02.2026 Содержание блога Браузер Chrome имеет средства для отладки мобильных веб-приложений по USB. В этой пошаговой инструкции ограничимся работой с консолью. Вывод в консоль - это часть процесса. . .
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .

@Alpi 104 / 0 / 1 Регистрация: 16.11.2012 Сообщений: 41

	Веб-приложение Календарь 26.10.2015, 00:56. Показов 1505. Ответов 4 Метки нет (Все метки) В общем, стоит задача сделать вебприложение-календарь, или что-то вроде appointment app. Должна быть возможность назначать события на определенную дату и определенный час, и чтобы потом этот час показывался как занятый. У каждого юзера свой календарь. Я совсем затупил, и пока ничего в сети вменяемого не нашел. Как это должно выглядеть, чтобы можно было передавать в виде JSON и фронт-енд по нему строил календарь, в котором было бы видно, какие дни и часы заняты, а какие нет? Я пока решил, что должен быть класс события, в котором помимо даты и времени будет ссылка на юзера, которому оно принадлежит и какая-то уже инфа о самом событии, что на данном этапе не важно. Затем при открытии страницы из базы берется массив событий отфильтрованный по данному юзеру, на неделю или на месяц. А вот как это показывать потом в JS, чтобы потом было видно свободное время, на которое можно что-то назначить? Может, кто-то ткнет носом в похожий проект на JS? Интересует фронт-енд часть. Спасибо. 0

@Alpi 104 / 0 / 1 Регистрация: 16.11.2012 Сообщений: 41
	26.10.2015, 05:25 [ТС]
	Padimanskas, да нет, это я все понимаю. Я больше хочу понять, как вообще должен выглядеть код, который будет это все в календаре показывать. Понятия не имею, с чего начать браузерную часть, вот и прошу пример какой-нибудь (( 0

@Alpi 104 / 0 / 1 Регистрация: 16.11.2012 Сообщений: 41
	26.10.2015, 06:37 [ТС]
	Padimanskas, так, я, кажется, понял примерно, в какую сторону двигаться. Спасибо. Вернусь еще потом тупые вопросы задавать ) 0

Опции темы