mirror of
https://github.com/openSUSE/osem.git
synced 2026-08-14 04:04:03 +00:00
Integrate the schedule in the admin interface
Integrate the schedule in the admin interface while adapting it to the new associations and models.
This commit is contained in:
Ana
parent
e7a30302ff
commit
dfd64a4510
32 changed files with 291 additions and 10074 deletions
|
|
@ -1,23 +1,13 @@
|
|||
.schedule-time-column
|
||||
.schedule-time-column-header
|
||||
= Time
|
||||
- (9..18).each do |hour|
|
||||
.schedule-time-slot
|
||||
= "#{hour}:00"
|
||||
.schedule-time-slot
|
||||
= "#{hour}:15"
|
||||
.schedule-time-slot
|
||||
= "#{hour}:30"
|
||||
.schedule-time-slot
|
||||
= "#{hour}:45"
|
||||
|
||||
- @rooms.each do |room|
|
||||
.schedule-room-column{:id => "schedule-room-#{room.guid}", "room-guid" => room.guid}
|
||||
.schedule-room-column-header
|
||||
= room.name
|
||||
= "(#{room.size} people)"
|
||||
- (9..18).each do |hour|
|
||||
.schedule-room-slot{:id => "schedule-room-#{room.guid}-#{hour}-0", "room-guid" => room.guid, "hour" => "#{hour}:00"}
|
||||
.schedule-room-slot{:id => "schedule-room-#{room.guid}-#{hour}-15", "room-guid" => room.guid, "hour" => "#{hour}:15"}
|
||||
.schedule-room-slot{:id => "schedule-room-#{room.guid}-#{hour}-30", "room-guid" => room.guid, "hour" => "#{hour}:30"}
|
||||
.schedule-room-slot{:id => "schedule-room-#{room.guid}-#{hour}-45", "room-guid" => room.guid, "hour" => "#{hour}:45"}
|
||||
.row
|
||||
- @rooms.each do |room|
|
||||
.col-md-2.col-xs-6
|
||||
.room-name
|
||||
= room.name
|
||||
- (9*4..18*4).each do |slot|
|
||||
- hour = slot / 4
|
||||
- time = (15 * (slot % 4) == 0) ? '00' : 15 * (slot % 4)
|
||||
.schedule-room-slot{ id: "schedule-room-#{room.guid}-#{hour}-#{time}", |
|
||||
"room-guid" => room.guid, |
|
||||
hour: "#{hour}:#{time}", |
|
||||
date: date}
|
||||
= "#{hour}:#{time}"
|
||||
|
|
|
|||
|
|
@ -1,48 +1,166 @@
|
|||
.schedule-content
|
||||
%h2
|
||||
= "Schedule for #{@conference.title}"
|
||||
#unscheduled.unscheduled
|
||||
.unscheduled-header
|
||||
Unscheduled Events
|
||||
#schedule.schedule
|
||||
.schedule-dates-header
|
||||
%ul#date-tabs
|
||||
- @dates.each do |date|
|
||||
%li.date-selector
|
||||
= link_to "#{date}", "#", id: "#{date}-selector", onclick: "Schedule.changeDay('#{date}')"
|
||||
.schedule-rooms-container
|
||||
= render 'day_tab'
|
||||
.row
|
||||
.col-md-12
|
||||
.page-header
|
||||
%h1 Schedule
|
||||
%p.text-muted
|
||||
Create the schedules for the conference
|
||||
|
||||
.row
|
||||
.col-md-2
|
||||
.h4
|
||||
Unscheduled events
|
||||
.unscheduled-events
|
||||
.col-md-10
|
||||
%ul.nav.nav-tabs
|
||||
- @dates.each do |date|
|
||||
%li{ class: "#{ (@dates.first == date) ? 'active' : '' }"}
|
||||
%a{ href: "##{date}" }
|
||||
= date
|
||||
.tab-content
|
||||
- @dates.each do |date|
|
||||
.tab-pane{ class: "#{ (@dates.first == date) ? 'active' : '' }", id: "#{date}" }
|
||||
= render partial: 'day_tab', locals: { date: date }
|
||||
|
||||
|
||||
:javascript
|
||||
$(document).ready( function() {
|
||||
//Schedule.loadDaysAndTracks("#{@conference.short_title}");
|
||||
var conference = "#{@conference.short_title}"
|
||||
Schedule.loadEvents("#{@conference.short_title}", "#{@dates.first}");
|
||||
$('.schedule-room-slot').droppable({
|
||||
accept: '.schedule-event',
|
||||
tolerance: "pointer",
|
||||
drop: function(event, ui) {
|
||||
$(ui.draggable).appendTo(this);
|
||||
var myId = $(ui.draggable).attr("guid");
|
||||
var myRoom = $(this).attr("room-guid")
|
||||
var myDate = $(this).attr("date");
|
||||
var myTime = $(this).attr("hour");
|
||||
var length = $(ui.draggable).attr("length");
|
||||
$(ui.draggable).css("left", 0);
|
||||
$(ui.draggable).css("top", 0);
|
||||
$(this).css("background-color", "#ffffff");
|
||||
|
||||
// 15 minute slots on the schedule are 30px,
|
||||
// thus the magic multiplier here
|
||||
$(ui.draggable).height(length * 2 - 7);
|
||||
$(ui.draggable).width($(this).width() - 10);
|
||||
Schedule.save(conference, myId, myRoom, myDate, myTime);
|
||||
},
|
||||
over: function(event, ui) {
|
||||
$(this).css("background-color", "#009ED8");
|
||||
},
|
||||
out: function(event, ui) {
|
||||
$(this).css("background-color", "#ffffff");
|
||||
}
|
||||
});
|
||||
});
|
||||
var conference = "#{@conference.short_title}"
|
||||
var schedule_id = "#{@schedule_id}";
|
||||
|
||||
var Schedule = {
|
||||
loadEvents: function(conference_id, start_date) {
|
||||
var url = '/admin/conference/' + conference_id + '/program/events';
|
||||
var callback = function(data) {
|
||||
$.each(data, function(key, val) {
|
||||
Schedule.newEvent(val, conference_id);
|
||||
});
|
||||
};
|
||||
$.getJSON(url, callback);
|
||||
},
|
||||
newEvent: function(vars, conference_id) {
|
||||
var height = (vars["length"] / 15 * 58) - 23; // this height fits the room cells
|
||||
var lines = Math.floor((height - 7) / 23); // subtracting the padding before calculate the number of lines
|
||||
var newEvent = $('<div class="schedule-event">'
|
||||
+ '<div class="schedule-event-text" style="-webkit-line-clamp: '+ lines + '; height: ' + (lines * 23) + 'px;">'
|
||||
+ '<span onclick="Schedule.remove(\'event-' + vars["guid"] + '\', \'' + conference_id +'\');" class="schedule-event-delete-button">X</span>'
|
||||
+ vars["title"] + '</div></div>');
|
||||
newEvent.attr("id", "event-" + vars["guid"]);
|
||||
newEvent.attr("guid", vars["guid"]);
|
||||
newEvent.css("height", height);
|
||||
newEvent.css('background-color',vars["track_color"]);
|
||||
newEvent.css('color',vars["track_text_color"]);
|
||||
var date = "none";
|
||||
var room = "none"
|
||||
var time = "none";
|
||||
for (i = 0; i < vars["event_schedules"].length; i++) {
|
||||
event_schedule = vars["event_schedules"][i];
|
||||
if(event_schedule["schedule_id"] == schedule_id){
|
||||
room = event_schedule["room_guid"];
|
||||
var d = new Date(event_schedule["start_time"]);
|
||||
date = d.getUTCFullYear() + "-"
|
||||
+ ('0' + (d.getUTCMonth() +1)).slice(-2) + '-'
|
||||
+ ('0' + d.getUTCDate()).slice(-2);
|
||||
minutes = d.getUTCMinutes();
|
||||
time = d.getUTCHours() + ':' + (minutes == 0 ? '00' : minutes);
|
||||
console.log("date: " + d);
|
||||
newEvent.attr("room", room);
|
||||
newEvent.attr("date", date);
|
||||
newEvent.attr("hour", time);
|
||||
}
|
||||
}
|
||||
newEvent.draggable({
|
||||
snap: '.schedule-room-slot',
|
||||
revertDuration: 200,
|
||||
revert: function (event, ui) {
|
||||
console.log(event.attr);
|
||||
return !event;
|
||||
},
|
||||
stop: function(event, ui) {
|
||||
this._originalPosition = this._originalPosition || ui.originalPosition;
|
||||
ui.helper.animate( this._originalPosition );
|
||||
},
|
||||
opacity: 0.7,
|
||||
snapMode: "inner",
|
||||
zIndex: 2
|
||||
});
|
||||
if (date == "none" || room == "none") {
|
||||
newEvent.find(".schedule-event-delete-button").hide();
|
||||
$('.unscheduled-events').append(newEvent);
|
||||
} else {
|
||||
var element = "[date='" + date +"'][hour='" + time + "'][room-guid='" + room + "']";
|
||||
$(element).append(newEvent);
|
||||
}
|
||||
},
|
||||
remove: function(element, conference_id) {
|
||||
var e = $("#" + element);
|
||||
var unscheduled = $(".unscheduled-events");
|
||||
|
||||
var url = '/admin/conference/' + conference_id + '/schedule';
|
||||
var params = {
|
||||
event: e.attr("guid"),
|
||||
room: "none",
|
||||
date: "none",
|
||||
time: "none",
|
||||
schedule: schedule_id
|
||||
};
|
||||
var callback = function(data) {
|
||||
console.log(data);
|
||||
e.appendTo(unscheduled);
|
||||
e.find(".schedule-event-delete-button").hide();
|
||||
}
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: 'PUT',
|
||||
data: params,
|
||||
success: callback,
|
||||
dataType : 'json'
|
||||
});
|
||||
},
|
||||
save: function (conference_id, event_id, room_id, date, time) {
|
||||
var url = '/admin/conference/' + conference_id + '/schedule';
|
||||
var params = {
|
||||
event: event_id,
|
||||
room: room_id,
|
||||
date: date,
|
||||
time: time,
|
||||
schedule: schedule_id
|
||||
};
|
||||
var callback = function(data) {
|
||||
console.log(data);
|
||||
$("#event-" + event_id).find(".schedule-event-delete-button").show();
|
||||
}
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: 'PUT',
|
||||
data: params,
|
||||
success: callback,
|
||||
dataType : 'json'
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
Schedule.loadEvents("#{@conference.short_title}", "#{@dates.first}");
|
||||
|
||||
$(document).ready( function() {
|
||||
$('.schedule-room-slot').droppable({
|
||||
accept: '.schedule-event',
|
||||
tolerance: "pointer",
|
||||
drop: function(event, ui) {
|
||||
$(ui.draggable).appendTo(this);
|
||||
var myId = $(ui.draggable).attr("guid");
|
||||
var myRoom = $(this).attr("room-guid")
|
||||
var myDate = $(this).attr("date");
|
||||
var myTime = $(this).attr("hour");
|
||||
$(ui.draggable).css("left", 0);
|
||||
$(ui.draggable).css("top", 0);
|
||||
$(this).css("background-color", "#ffffff");
|
||||
Schedule.save(conference, myId, myRoom, myDate, myTime);
|
||||
},
|
||||
over: function(event, ui) {
|
||||
$(this).css("background-color", "#009ED8");
|
||||
},
|
||||
out: function(event, ui) {
|
||||
$(this).css("background-color", "#ffffff");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue