;(function() { $.fn.spacecalendar = function(options) { var pluginName = 'spacecalendar'; // Find the plugin attached to the element var instance = this.data(pluginName); // If the instance wasn't found, create it... if(!instance) { // Return the element being bound to return this.each(function() { return $(this).data(pluginName, new spacecalendar(this, options)); }); } // ...otherwise if the user passes true to the plugin (on the second call), // then return the instance of the plugin itself return (options === true) ? instance : this; }; // Default options $.fn.spacecalendar.defaults = { // The house id houseId: 0, // 开始时间 startDate: null, // 房源配置数组 spaceData: [], // 是否可以编辑 isEditable: true, // The date that will be treated as 'today'. todayDate: function(){ var today = new Date(); return today._clear(); }, // The date that will appear selected when the spacecalendar renders. // By default it will be set to todayDate. selectedDate: null, // Names of the month that will be shown in the title. // Will default to 1月, 2月,...,12月 monthNames: null, // Names of the days of the Week that will be shown below the title. // Will default to 周一, 周二,...,周日 dowNames: null, // The day of the week to start the spacecalendar on. 0 is Sunday, 1 is Monday and so on. dowOffset: 1, // First date of the month. firstDate: null }; // Our plugin object var spacecalendar = (function() { // Main entry point. Initialize the plugin function spacecalendar(element, userOptions) { // Grab handle to this var self = this; // Save bound element to el self.el = $(element); var el = self.el; // Merge user options into default options self.options = $.extend(true, {}, $.fn.spacecalendar.defaults, userOptions); var options = self.options; // Find the spacecalendar element if the user provided one self.spacecalendar = $($.find('[gldp-el=' + el.attr('gldp-id') + ' ]')); if(!(el.attr('gldp-id') || '').length) { el.attr('gldp-id', 'gldp-' + Math.round(Math.random() * 1e10)) } el.addClass('gldp-el'); // Render spacecalendar self.render(); // self.show(); }; // Public methods spacecalendar.prototype = { // Render the spacecalendar render: function(renderCalback) { var self = this; var el = self.el; var options = self.options; var spacecalendar = self.spacecalendar; // Build a core class (with border) that every element would have var coreClass = ' core border '; var cssName = 'gldp-default'; // Get today var todayVal = options.todayDate()._val(); var todayTime = todayVal.time/1000; // Constants var maxRow = 6; var maxCol = 7; var dowNames = options.dowNames || [ '周日', '周一', '周二', '周三', '周四', '周五', '周六' ]; var monthNames = options.monthNames || [ ' 1 月', ' 2 月', ' 3 月', ' 4 月', ' 5 月', ' 6 月', ' 7 月', ' 8 月', ' 9 月', ' 10 月', ' 11 月', ' 12 月' ]; // Create container width based on el size var containerWidth = el.outerWidth(); // Create cell width based on container size var cellWidth = containerWidth / maxCol; // If spacecalendar doesn't exist, create it and re-assign it to self if(!spacecalendar.length) { self.spacecalendar = spacecalendar = $('
') .attr('gldp-el', el.attr('gldp-id')) .css( { width: containerWidth + 'px' }); $(el).append(spacecalendar); } // Add core classes and remove spacecalendar's children spacecalendar.removeClass() .addClass(cssName) .children().remove(); // Helper function to setDate (function() { var _firstDate = new Date(options.startDate); if(_firstDate.getDate() != 1){ _firstDate.setDate(1); _firstDate.setMonth(_firstDate.getMonth() + 1); } options.firstDate = _firstDate; })(); var getStartEndDate = function(_offset) { // Create start date as the first date of the month var _firstDate = new Date(options.firstDate); // Default to no offset _offset = _offset || 0; // Adjust date for month offset _firstDate.setMonth(_firstDate.getMonth() + _offset); var startOffset = _firstDate.getDay() - options.dowOffset; startOffset = startOffset < 1 ? -7 - startOffset : -startOffset; var _startDate = _firstDate._add(startOffset)/1000, _endDate = _firstDate._add(7*6-1)/1000; return {startDate: _startDate, endDate: _endDate}; }; // Get the previous, next start/end dates var prevDateObj = getStartEndDate(-1), nextDateObj = getStartEndDate(1); var prevStartDate = prevDateObj.startDate, prevEndDate = prevDateObj.endDate; var nextStartDate = nextDateObj.startDate, nextEndDate = nextDateObj.endDate; // Get the first date for the current month being rendered var firstDateVal = options.firstDate._val(); var firstDateMonth = firstDateVal.month; var firstDateYear = firstDateVal.year; var prevCell = $('') .addClass("title") .append( $('