Просмотр исходного кода

Drop widgetHeaderClass/widgetContentClass/highlightStateClass from View.js

Joan Karadimov 8 лет назад
Родитель
Сommit
b5bb4f3616

+ 8 - 8
src/agenda/AgendaView.js

@@ -81,7 +81,7 @@ var AgendaView = FC.AgendaView = View.extend({
 		this.timeGrid.renderDates();
 		this.timeGrid.renderDates();
 
 
 		// the <hr> that sometimes displays under the time-grid
 		// the <hr> that sometimes displays under the time-grid
-		this.bottomRuleEl = $('<hr class="fc-divider ' + this.widgetHeaderClass + '"/>')
+		this.bottomRuleEl = $('<hr class="fc-divider ' + this.calendar.theme.getClass('widgetHeader') + '"/>')
 			.appendTo(this.timeGrid.el); // inject it into the time-grid
 			.appendTo(this.timeGrid.el); // inject it into the time-grid
 
 
 		if (this.dayGrid) {
 		if (this.dayGrid) {
@@ -126,15 +126,15 @@ var AgendaView = FC.AgendaView = View.extend({
 			'<table class="' + this.calendar.theme.getClass('tableGrid') + '">' +
 			'<table class="' + this.calendar.theme.getClass('tableGrid') + '">' +
 				'<thead class="fc-head">' +
 				'<thead class="fc-head">' +
 					'<tr>' +
 					'<tr>' +
-						'<td class="fc-head-container ' + this.widgetHeaderClass + '"></td>' +
+						'<td class="fc-head-container ' + this.calendar.theme.getClass('widgetHeader') + '"></td>' +
 					'</tr>' +
 					'</tr>' +
 				'</thead>' +
 				'</thead>' +
 				'<tbody class="fc-body">' +
 				'<tbody class="fc-body">' +
 					'<tr>' +
 					'<tr>' +
-						'<td class="' + this.widgetContentClass + '">' +
+						'<td class="' + this.calendar.theme.getClass('widgetContent') + '">' +
 							(this.dayGrid ?
 							(this.dayGrid ?
 								'<div class="fc-day-grid"/>' +
 								'<div class="fc-day-grid"/>' +
-								'<hr class="fc-divider ' + this.widgetHeaderClass + '"/>' :
+								'<hr class="fc-divider ' + this.calendar.theme.getClass('widgetHeader') + '"/>' :
 								''
 								''
 								) +
 								) +
 						'</td>' +
 						'</td>' +
@@ -482,7 +482,7 @@ var agendaTimeGridMethods = {
 			weekText = this.start.format(view.opt('smallWeekFormat'));
 			weekText = this.start.format(view.opt('smallWeekFormat'));
 
 
 			return '' +
 			return '' +
-				'<th class="fc-axis fc-week-number ' + view.widgetHeaderClass + '" ' + view.axisStyleAttr() + '>' +
+				'<th class="fc-axis fc-week-number ' + view.calendar.theme.getClass('widgetHeader') + '" ' + view.axisStyleAttr() + '>' +
 					view.buildGotoAnchorHtml( // aside from link, important for matchCellWidths
 					view.buildGotoAnchorHtml( // aside from link, important for matchCellWidths
 						{ date: this.start, type: 'week', forceOff: this.colCnt > 1 },
 						{ date: this.start, type: 'week', forceOff: this.colCnt > 1 },
 						htmlEscape(weekText) // inner HTML
 						htmlEscape(weekText) // inner HTML
@@ -490,7 +490,7 @@ var agendaTimeGridMethods = {
 				'</th>';
 				'</th>';
 		}
 		}
 		else {
 		else {
-			return '<th class="fc-axis ' + view.widgetHeaderClass + '" ' + view.axisStyleAttr() + '></th>';
+			return '<th class="fc-axis ' + view.calendar.theme.getClass('widgetHeader') + '" ' + view.axisStyleAttr() + '></th>';
 		}
 		}
 	},
 	},
 
 
@@ -499,7 +499,7 @@ var agendaTimeGridMethods = {
 	renderBgIntroHtml: function() {
 	renderBgIntroHtml: function() {
 		var view = this.view;
 		var view = this.view;
 
 
-		return '<td class="fc-axis ' + view.widgetContentClass + '" ' + view.axisStyleAttr() + '></td>';
+		return '<td class="fc-axis ' + view.calendar.theme.getClass('widgetContent') + '" ' + view.axisStyleAttr() + '></td>';
 	},
 	},
 
 
 
 
@@ -523,7 +523,7 @@ var agendaDayGridMethods = {
 		var view = this.view;
 		var view = this.view;
 
 
 		return '' +
 		return '' +
-			'<td class="fc-axis ' + view.widgetContentClass + '" ' + view.axisStyleAttr() + '>' +
+			'<td class="fc-axis ' + view.calendar.theme.getClass('widgetContent') + '" ' + view.axisStyleAttr() + '>' +
 				'<span>' + // needed for matchCellWidths
 				'<span>' + // needed for matchCellWidths
 					view.getAllDayHtml() +
 					view.getAllDayHtml() +
 				'</span>' +
 				'</span>' +

+ 4 - 4
src/basic/BasicView.js

@@ -127,12 +127,12 @@ var BasicView = FC.BasicView = View.extend({
 			'<table class="' + this.calendar.theme.getClass('tableGrid') + '">' +
 			'<table class="' + this.calendar.theme.getClass('tableGrid') + '">' +
 				'<thead class="fc-head">' +
 				'<thead class="fc-head">' +
 					'<tr>' +
 					'<tr>' +
-						'<td class="fc-head-container ' + this.widgetHeaderClass + '"></td>' +
+						'<td class="fc-head-container ' + this.calendar.theme.getClass('widgetHeader') + '"></td>' +
 					'</tr>' +
 					'</tr>' +
 				'</thead>' +
 				'</thead>' +
 				'<tbody class="fc-body">' +
 				'<tbody class="fc-body">' +
 					'<tr>' +
 					'<tr>' +
-						'<td class="' + this.widgetContentClass + '"></td>' +
+						'<td class="' + this.calendar.theme.getClass('widgetContent') + '"></td>' +
 					'</tr>' +
 					'</tr>' +
 				'</tbody>' +
 				'</tbody>' +
 			'</table>';
 			'</table>';
@@ -367,7 +367,7 @@ var basicDayGridMethods = {
 
 
 		if (view.colWeekNumbersVisible) {
 		if (view.colWeekNumbersVisible) {
 			return '' +
 			return '' +
-				'<th class="fc-week-number ' + view.widgetHeaderClass + '" ' + view.weekNumberStyleAttr() + '>' +
+				'<th class="fc-week-number ' + view.calendar.theme.getClass('widgetHeader') + '" ' + view.weekNumberStyleAttr() + '>' +
 					'<span>' + // needed for matchCellWidths
 					'<span>' + // needed for matchCellWidths
 						htmlEscape(view.opt('weekNumberTitle')) +
 						htmlEscape(view.opt('weekNumberTitle')) +
 					'</span>' +
 					'</span>' +
@@ -402,7 +402,7 @@ var basicDayGridMethods = {
 		var view = this.view;
 		var view = this.view;
 
 
 		if (view.colWeekNumbersVisible) {
 		if (view.colWeekNumbersVisible) {
-			return '<td class="fc-week-number ' + view.widgetContentClass + '" ' +
+			return '<td class="fc-week-number ' + view.calendar.theme.getClass('widgetContent') + '" ' +
 				view.weekNumberStyleAttr() + '></td>';
 				view.weekNumberStyleAttr() + '></td>';
 		}
 		}
 
 

+ 1 - 1
src/common/DayGrid.js

@@ -77,7 +77,7 @@ var DayGrid = FC.DayGrid = Grid.extend(DayTableMixin, {
 	// `row` is the row number.
 	// `row` is the row number.
 	renderDayRowHtml: function(row, isRigid) {
 	renderDayRowHtml: function(row, isRigid) {
 		var view = this.view;
 		var view = this.view;
-		var classes = [ 'fc-row', 'fc-week', view.widgetContentClass ];
+		var classes = [ 'fc-row', 'fc-week', view.calendar.theme.getClass('widgetContent') ];
 
 
 		if (isRigid) {
 		if (isRigid) {
 			classes.push('fc-rigid');
 			classes.push('fc-rigid');

+ 2 - 2
src/common/DayGrid.limit.js

@@ -285,7 +285,7 @@ DayGrid.mixin({
 		var isTheme = view.opt('theme');
 		var isTheme = view.opt('theme');
 		var title = this.getCellDate(row, col).format(view.opt('dayPopoverFormat'));
 		var title = this.getCellDate(row, col).format(view.opt('dayPopoverFormat'));
 		var content = $(
 		var content = $(
-			'<div class="fc-header ' + view.widgetHeaderClass + '">' +
+			'<div class="fc-header ' + view.calendar.theme.getClass('widgetHeader') + '">' +
 				'<span class="fc-close ' +
 				'<span class="fc-close ' +
 					(isTheme ? 'ui-icon ui-icon-closethick' : 'fc-icon fc-icon-x') +
 					(isTheme ? 'ui-icon ui-icon-closethick' : 'fc-icon fc-icon-x') +
 				'"></span>' +
 				'"></span>' +
@@ -294,7 +294,7 @@ DayGrid.mixin({
 				'</span>' +
 				'</span>' +
 				'<div class="fc-clear"/>' +
 				'<div class="fc-clear"/>' +
 			'</div>' +
 			'</div>' +
-			'<div class="fc-body ' + view.widgetContentClass + '">' +
+			'<div class="fc-body ' + view.calendar.theme.getClass('widgetContent') + '">' +
 				'<div class="fc-event-container"></div>' +
 				'<div class="fc-event-container"></div>' +
 			'</div>'
 			'</div>'
 		);
 		);

+ 3 - 3
src/common/DayTableMixin.js

@@ -252,7 +252,7 @@ var DayTableMixin = FC.DayTableMixin = {
 		var view = this.view;
 		var view = this.view;
 
 
 		return '' +
 		return '' +
-			'<div class="fc-row ' + view.widgetHeaderClass + '">' +
+			'<div class="fc-row ' + view.calendar.theme.getClass('widgetHeader') + '">' +
 				'<table class="' + this.view.calendar.theme.getClass('tableGrid') + '">' +
 				'<table class="' + this.view.calendar.theme.getClass('tableGrid') + '">' +
 					'<thead>' +
 					'<thead>' +
 						this.renderHeadTrHtml() +
 						this.renderHeadTrHtml() +
@@ -297,7 +297,7 @@ var DayTableMixin = FC.DayTableMixin = {
 		var isDateValid = isDateWithinRange(date, view.activeRange); // TODO: called too frequently. cache somehow.
 		var isDateValid = isDateWithinRange(date, view.activeRange); // TODO: called too frequently. cache somehow.
 		var classNames = [
 		var classNames = [
 			'fc-day-header',
 			'fc-day-header',
-			view.widgetHeaderClass
+			view.calendar.theme.getClass('widgetHeader')
 		];
 		];
 		var innerHtml = htmlEscape(date.format(this.colHeadFormat));
 		var innerHtml = htmlEscape(date.format(this.colHeadFormat));
 
 
@@ -375,7 +375,7 @@ var DayTableMixin = FC.DayTableMixin = {
 		var isDateValid = isDateWithinRange(date, view.activeRange); // TODO: called too frequently. cache somehow.
 		var isDateValid = isDateWithinRange(date, view.activeRange); // TODO: called too frequently. cache somehow.
 		var classes = this.getDayClasses(date);
 		var classes = this.getDayClasses(date);
 
 
-		classes.unshift('fc-day', view.widgetContentClass);
+		classes.unshift('fc-day', view.calendar.theme.getClass('widgetContent'));
 
 
 		return '<td class="' + classes.join(' ') + '"' +
 		return '<td class="' + classes.join(' ') + '"' +
 			(isDateValid ?
 			(isDateValid ?

+ 1 - 1
src/common/Grid.js

@@ -716,7 +716,7 @@ var Grid = FC.Grid = Class.extend(ListenerMixin, {
 				classes.push('fc-today');
 				classes.push('fc-today');
 
 
 				if (noThemeHighlight !== true) {
 				if (noThemeHighlight !== true) {
-					classes.push(view.highlightStateClass);
+					classes.push(view.calendar.theme.getClass('stateHighlight'));
 				}
 				}
 			}
 			}
 			else if (date < today) {
 			else if (date < today) {

+ 2 - 2
src/common/TimeGrid.js

@@ -80,7 +80,7 @@ var TimeGrid = FC.TimeGrid = Grid.extend(DayTableMixin, {
 			isLabeled = isInt(divideDurationByDuration(slotTime, this.labelInterval));
 			isLabeled = isInt(divideDurationByDuration(slotTime, this.labelInterval));
 
 
 			axisHtml =
 			axisHtml =
-				'<td class="fc-axis fc-time ' + view.widgetContentClass + '" ' + view.axisStyleAttr() + '>' +
+				'<td class="fc-axis fc-time ' + view.calendar.theme.getClass('widgetContent') + '" ' + view.axisStyleAttr() + '>' +
 					(isLabeled ?
 					(isLabeled ?
 						'<span>' + // for matchCellWidths
 						'<span>' + // for matchCellWidths
 							htmlEscape(slotDate.format(this.labelFormat)) +
 							htmlEscape(slotDate.format(this.labelFormat)) +
@@ -94,7 +94,7 @@ var TimeGrid = FC.TimeGrid = Grid.extend(DayTableMixin, {
 					(isLabeled ? '' : ' class="fc-minor"') +
 					(isLabeled ? '' : ' class="fc-minor"') +
 					'>' +
 					'>' +
 					(!isRTL ? axisHtml : '') +
 					(!isRTL ? axisHtml : '') +
-					'<td class="' + view.widgetContentClass + '"/>' +
+					'<td class="' + view.calendar.theme.getClass('widgetContent') + '"/>' +
 					(isRTL ? axisHtml : '') +
 					(isRTL ? axisHtml : '') +
 				"</tr>";
 				"</tr>";
 
 

+ 0 - 14
src/common/View.js

@@ -27,11 +27,6 @@ var View = FC.View = Model.extend({
 
 
 	eventOrderSpecs: null, // criteria for ordering events when they have same date/time
 	eventOrderSpecs: null, // criteria for ordering events when they have same date/time
 
 
-	// classNames styled by jqui themes
-	widgetHeaderClass: null,
-	widgetContentClass: null,
-	highlightStateClass: null,
-
 	// for date utils, computed from options
 	// for date utils, computed from options
 	nextDayThreshold: null,
 	nextDayThreshold: null,
 	isHiddenDayHash: null,
 	isHiddenDayHash: null,
@@ -58,7 +53,6 @@ var View = FC.View = Model.extend({
 		this.name = this.type;
 		this.name = this.type;
 
 
 		this.nextDayThreshold = moment.duration(this.opt('nextDayThreshold'));
 		this.nextDayThreshold = moment.duration(this.opt('nextDayThreshold'));
-		this.initThemingProps();
 		this.initHiddenDays();
 		this.initHiddenDays();
 		this.isRTL = this.opt('isRTL');
 		this.isRTL = this.opt('isRTL');
 
 
@@ -535,14 +529,6 @@ var View = FC.View = Model.extend({
 	},
 	},
 
 
 
 
-	// Initializes internal variables related to theming
-	initThemingProps: function() {
-		this.widgetHeaderClass = this.calendar.theme.getClass('widgetHeader');
-		this.widgetContentClass = this.calendar.theme.getClass('widgetContent');
-		this.highlightStateClass = this.calendar.theme.getClass('stateHighlight');
-	},
-
-
 	/* Business Hours
 	/* Business Hours
 	------------------------------------------------------------------------------------------------------------------*/
 	------------------------------------------------------------------------------------------------------------------*/
 
 

+ 5 - 5
src/list/ListView.js

@@ -18,7 +18,7 @@ var ListView = View.extend({
 	renderSkeleton: function() {
 	renderSkeleton: function() {
 		this.el.addClass(
 		this.el.addClass(
 			'fc-list-view ' +
 			'fc-list-view ' +
-			this.widgetContentClass
+			this.calendar.theme.getClass('widgetContent')
 		);
 		);
 
 
 		this.scroller.render();
 		this.scroller.render();
@@ -206,7 +206,7 @@ var ListViewGrid = Grid.extend({
 		var altFormat = view.opt('listDayAltFormat');
 		var altFormat = view.opt('listDayAltFormat');
 
 
 		return '<tr class="fc-list-heading" data-date="' + dayDate.format('YYYY-MM-DD') + '">' +
 		return '<tr class="fc-list-heading" data-date="' + dayDate.format('YYYY-MM-DD') + '">' +
-			'<td class="' + view.widgetHeaderClass + '" colspan="3">' +
+			'<td class="' + view.calendar.theme.getClass('widgetHeader') + '" colspan="3">' +
 				(mainFormat ?
 				(mainFormat ?
 					view.buildGotoAnchorHtml(
 					view.buildGotoAnchorHtml(
 						dayDate,
 						dayDate,
@@ -256,18 +256,18 @@ var ListViewGrid = Grid.extend({
 
 
 		return '<tr class="' + classes.join(' ') + '">' +
 		return '<tr class="' + classes.join(' ') + '">' +
 			(this.displayEventTime ?
 			(this.displayEventTime ?
-				'<td class="fc-list-item-time ' + view.widgetContentClass + '">' +
+				'<td class="fc-list-item-time ' + view.calendar.theme.getClass('widgetContent') + '">' +
 					(timeHtml || '') +
 					(timeHtml || '') +
 				'</td>' :
 				'</td>' :
 				'') +
 				'') +
-			'<td class="fc-list-item-marker ' + view.widgetContentClass + '">' +
+			'<td class="fc-list-item-marker ' + view.calendar.theme.getClass('widgetContent') + '">' +
 				'<span class="fc-event-dot"' +
 				'<span class="fc-event-dot"' +
 				(bgColor ?
 				(bgColor ?
 					' style="background-color:' + bgColor + '"' :
 					' style="background-color:' + bgColor + '"' :
 					'') +
 					'') +
 				'></span>' +
 				'></span>' +
 			'</td>' +
 			'</td>' +
-			'<td class="fc-list-item-title ' + view.widgetContentClass + '">' +
+			'<td class="fc-list-item-title ' + view.calendar.theme.getClass('widgetContent') + '">' +
 				'<a' + (url ? ' href="' + htmlEscape(url) + '"' : '') + '>' +
 				'<a' + (url ? ' href="' + htmlEscape(url) + '"' : '') + '>' +
 					htmlEscape(seg.event.title || '') +
 					htmlEscape(seg.event.title || '') +
 				'</a>' +
 				'</a>' +