|
|
@ -8,25 +8,24 @@ define(
|
|
|
|
'Calendar/Collection',
|
|
|
|
'Calendar/Collection',
|
|
|
|
'System/StatusModel',
|
|
|
|
'System/StatusModel',
|
|
|
|
'History/Queue/QueueCollection',
|
|
|
|
'History/Queue/QueueCollection',
|
|
|
|
|
|
|
|
'Config',
|
|
|
|
'Mixins/backbone.signalr.mixin',
|
|
|
|
'Mixins/backbone.signalr.mixin',
|
|
|
|
'fullcalendar',
|
|
|
|
'fullcalendar',
|
|
|
|
'jquery.easypiechart'
|
|
|
|
'jquery.easypiechart'
|
|
|
|
], function (vent, Marionette, moment, CalendarCollection, StatusModel, QueueCollection) {
|
|
|
|
], function (vent, Marionette, moment, CalendarCollection, StatusModel, QueueCollection, Config) {
|
|
|
|
|
|
|
|
|
|
|
|
var _instance;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return Marionette.ItemView.extend({
|
|
|
|
return Marionette.ItemView.extend({
|
|
|
|
|
|
|
|
storageKey: 'calendar.view',
|
|
|
|
|
|
|
|
|
|
|
|
initialize: function () {
|
|
|
|
initialize: function () {
|
|
|
|
this.collection = new CalendarCollection().bindSignalR({ updateOnly: true });
|
|
|
|
this.collection = new CalendarCollection().bindSignalR({ updateOnly: true });
|
|
|
|
this.listenTo(this.collection, 'change', this._reloadCalendarEvents);
|
|
|
|
this.listenTo(this.collection, 'change', this._reloadCalendarEvents);
|
|
|
|
this.listenTo(QueueCollection, 'sync', this._reloadCalendarEvents);
|
|
|
|
this.listenTo(QueueCollection, 'sync', this._reloadCalendarEvents);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
render : function () {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var self = this;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
render : function () {
|
|
|
|
this.$el.empty().fullCalendar({
|
|
|
|
this.$el.empty().fullCalendar({
|
|
|
|
defaultView : 'basicWeek',
|
|
|
|
defaultView : Config.getValue(this.storageKey, 'basicWeek'),
|
|
|
|
allDayDefault : false,
|
|
|
|
allDayDefault : false,
|
|
|
|
ignoreTimezone: false,
|
|
|
|
ignoreTimezone: false,
|
|
|
|
weekMode : 'variable',
|
|
|
|
weekMode : 'variable',
|
|
|
@ -41,54 +40,62 @@ define(
|
|
|
|
prev: '<i class="icon-arrow-left"></i>',
|
|
|
|
prev: '<i class="icon-arrow-left"></i>',
|
|
|
|
next: '<i class="icon-arrow-right"></i>'
|
|
|
|
next: '<i class="icon-arrow-right"></i>'
|
|
|
|
},
|
|
|
|
},
|
|
|
|
viewRender : this._getEvents,
|
|
|
|
viewRender : this._viewRender.bind(this),
|
|
|
|
eventRender : function (event, element) {
|
|
|
|
eventRender : this._eventRender.bind(this),
|
|
|
|
self.$(element).addClass(event.statusLevel);
|
|
|
|
|
|
|
|
self.$(element).children('.fc-event-inner').addClass(event.statusLevel);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (event.progress > 0) {
|
|
|
|
|
|
|
|
self.$(element).find('.fc-event-time')
|
|
|
|
|
|
|
|
.after('<span class="chart pull-right" data-percent="{0}"></span>'.format(event.progress));
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
self.$(element).find('.chart').easyPieChart({
|
|
|
|
|
|
|
|
barColor : '#ffffff',
|
|
|
|
|
|
|
|
trackColor: false,
|
|
|
|
|
|
|
|
scaleColor: false,
|
|
|
|
|
|
|
|
lineWidth : 2,
|
|
|
|
|
|
|
|
size : 14,
|
|
|
|
|
|
|
|
animate : false
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
eventClick : function (event) {
|
|
|
|
eventClick : function (event) {
|
|
|
|
vent.trigger(vent.Commands.ShowEpisodeDetails, {episode: event.model});
|
|
|
|
vent.trigger(vent.Commands.ShowEpisodeDetails, {episode: event.model});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
_instance = this;
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onShow: function () {
|
|
|
|
onShow: function () {
|
|
|
|
this.$('.fc-button-today').click();
|
|
|
|
this.$('.fc-button-today').click();
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
_viewRender: function (view) {
|
|
|
|
|
|
|
|
if (Config.getValue(this.storageKey) !== view.name) {
|
|
|
|
|
|
|
|
Config.setValue(this.storageKey, view.name);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this._getEvents(view);
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
_eventRender: function (event, element) {
|
|
|
|
|
|
|
|
this.$(element).addClass(event.statusLevel);
|
|
|
|
|
|
|
|
this.$(element).children('.fc-event-inner').addClass(event.statusLevel);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (event.progress > 0) {
|
|
|
|
|
|
|
|
this.$(element).find('.fc-event-time')
|
|
|
|
|
|
|
|
.after('<span class="chart pull-right" data-percent="{0}"></span>'.format(event.progress));
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.$(element).find('.chart').easyPieChart({
|
|
|
|
|
|
|
|
barColor : '#ffffff',
|
|
|
|
|
|
|
|
trackColor: false,
|
|
|
|
|
|
|
|
scaleColor: false,
|
|
|
|
|
|
|
|
lineWidth : 2,
|
|
|
|
|
|
|
|
size : 14,
|
|
|
|
|
|
|
|
animate : false
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
_getEvents: function (view) {
|
|
|
|
_getEvents: function (view) {
|
|
|
|
var start = moment(view.visStart).toISOString();
|
|
|
|
var start = moment(view.visStart).toISOString();
|
|
|
|
var end = moment(view.visEnd).toISOString();
|
|
|
|
var end = moment(view.visEnd).toISOString();
|
|
|
|
|
|
|
|
|
|
|
|
_instance.$el.fullCalendar('removeEvents');
|
|
|
|
this.$el.fullCalendar('removeEvents');
|
|
|
|
|
|
|
|
|
|
|
|
_instance.collection.fetch({
|
|
|
|
this.collection.fetch({
|
|
|
|
data : { start: start, end: end },
|
|
|
|
data : { start: start, end: end },
|
|
|
|
success: function (collection) {
|
|
|
|
success: this._setEventData.bind(this)
|
|
|
|
_instance._setEventData(collection);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
});
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
_setEventData: function (collection) {
|
|
|
|
_setEventData: function (collection) {
|
|
|
|
var events = [];
|
|
|
|
var events = [];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var self = this;
|
|
|
|
|
|
|
|
|
|
|
|
collection.each(function (model) {
|
|
|
|
collection.each(function (model) {
|
|
|
|
var seriesTitle = model.get('series').title;
|
|
|
|
var seriesTitle = model.get('series').title;
|
|
|
|
var start = model.get('airDateUtc');
|
|
|
|
var start = model.get('airDateUtc');
|
|
|
@ -100,15 +107,15 @@ define(
|
|
|
|
start : start,
|
|
|
|
start : start,
|
|
|
|
end : end,
|
|
|
|
end : end,
|
|
|
|
allDay : false,
|
|
|
|
allDay : false,
|
|
|
|
statusLevel : _instance._getStatusLevel(model, end),
|
|
|
|
statusLevel : self._getStatusLevel(model, end),
|
|
|
|
progress : _instance._getDownloadProgress(model),
|
|
|
|
progress : self._getDownloadProgress(model),
|
|
|
|
model : model
|
|
|
|
model : model
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
events.push(event);
|
|
|
|
events.push(event);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
_instance.$el.fullCalendar('addEventSource', events);
|
|
|
|
this.$el.fullCalendar('addEventSource', events);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
_getStatusLevel: function (element, endTime) {
|
|
|
|
_getStatusLevel: function (element, endTime) {
|
|
|
|