dateitem.js

javascript 很酷的类库

            oldValue = this._value.setTime(oldValue.getTime());
		this.setValue(oldValue);
	},    


    // getItemValue() - method to get the initial value of items when writing out this 
    // containerItem's innerHTML.
    // For the Date Item we give our sub items (selects / text item) the correct value when they
    // are initially set up.
    getItemValue : function (item, values) {
        return item.getValue();
        
    },

    //> @method dateItem.setWidth()    (A)
    //      @group  sizing
    //          set the width for this element
    //          Overridden to set the size of the date text field, if present
    //
    //        @param    (number)    new width for the form element
    //<
    setWidth : function (width) {
        // we don't support any size other than 200 if we're showing the selectors
        if (!this.useTextField) {
            this.width = 200;      
            return;
        }
        
        // Note that the superclass implementation will mark us for redraw if necessary, and
        // the date text field will pick up its new size from the getInnerWidth() override.
        return this.Super("setWidth", arguments);
    },

	//>	@method	dateItem.getDefaultValue()	(A)
	//  Override getDefaultValue to guarantee that it returns a date if 
    //  <code>item.enforceDate</code> is true. If no default date is supplied, defaults to the
    //  current date.
	//<
    // Note: As currently written this method will not consistently return the same date instance
    // unless this.defaultValue is explicitly specifed as a date object. Instead we create a
    // new date instance each time the method is called and return that. 
    // This can be a gotcha - for exmaple when checking for changes to a date item we have to 
    // use compareDates() rather than ==.
	getDefaultValue : function () {
		var value = this.Super("getDefaultValue");       
        if (this.useTextField && !this.enforceDate) return value;
		if (!isc.isA.Date(value)) value = this.parseDate(value);
        // if we still don't have a valid date, default to a new Date().
        // NOTE: can't just set the defaultValue to "new Date()" as this object would then
        // be shared amongst all date instances
		if (!isc.isA.Date(value) && !this.useTextField) {
            value = new Date();
            // zero out the time by default
            value.setHours(0);
            value.setMinutes(0);
            value.setSeconds(0);
            value.setMilliseconds(0);
        }
		return value;
	},
    
    //>	@method	dateItem.getStartDate()	(A)
	//		use this method, rather than referring to this.startDate, to guarantee that it
    //      returns a date
    //      Note - Does not update this.startDate - should it?
	//<
	getStartDate : function () {
        var startDate = this.parseDate(this.startDate);
        if(!isc.isA.Date(startDate)) {
            //>DEBUG
            this.logWarn("startDate was not in valid date format - using default start date");
            //<DEBUG
            startDate = isc.DateItem.DEFAULT_START_DATE;
        }
        return startDate;
    },
    
    //>	@method	dateItem.getEndDate()	(A)
	//		use this method, rather than referring to this.endDate, to guarantee that it
    //      returns a date
	//<
	getEndDate : function () {
        var endDate = this.parseDate(this.endDate);
        if(!isc.isA.Date(endDate)) {
            //>DEBUG
            this.logWarn("endDate was not in valid date format - using default end date");
            //<DEBUG
            endDate = isc.DateItem.DEFAULT_END_DATE;
        }
        return endDate;
    },
    
    // Override focusInItem to focus in the appropriate sub-item
    focusInItem : function () {
        if (!this.isVisible()) return;

        if (this.useTextField) {
            if (this.dateTextField) this.dateTextField.focusInItem();
        } else {
			var format = this.getSelectorFormat(),

                // Format will be "DMY" / "YMD" / "MDY" / etc.
                // (Parse the string rather than comparing with the DateItem.DAY_MONTH_YEAR class 
                // constants - it's slower but will support the user specifying just "MY" or something)
                firstSelector = format.charAt(0)
            ;
            
            if (firstSelector == "D" && this.daySelector) this.daySelector.focusInItem();
            if (firstSelector == "M" && this.monthSelector) this.monthSelector.focusInItem();
            if (firstSelector == "Y" && this.yearSelector) this.yearSelector.focusInItem();
        }
        // If it couldn't find the appropriate sub-item, this method is a no-op        
    },

	//>	@method	dateItem.getDayOptions()	(A)
	//		Return the list of options for the day selector.
	//
	//		@return	(array)	Array of day numbers from 1-31;
	//<
	getDayOptions : function () {

        var startDate = this.getStartDate(),
            endDate = this.getEndDate();

        // If the date range spans more than one month, return [1 - 31]
        //  - Even if they are less than a month apart
        //  (startDate = March 30th and endDate = April 6th (Same Year), for example)
        //  we don't want to return [1,2,3,4,5,6,30,31], as this will look wierd in the selector, 
        //  and allow you to select dates outside the range anyway (the March 1st, etc.)
        //  - Only time we want to have this return a range smaller than 1-31 is if we have a range
        //  within a single month (Feb 2 - 20th, 1945), for example.
        var startDay = 1, 
            endDay = 31;
        
        // If it's within a single month in a year, return appropriate subset of days    
        if (startDate.getYear() == endDate.getYear() &&
            startDate.getMonth() == endDate.getMonth()) {
                startDay = startDate.getDate()
                endDay = endDate.getDate()
        }
            
		// if the list of options is already in the mapCache, just pull it from there
		var key = "day." + startDay + "." + endDay;
		if (isc.DateItem.mapCache[key]) return isc.DateItem.mapCache[key];

		// otherwise build the options and store it in the dayMapCache
		var options = isc.DateItem.mapCache[key] = [];
		for (var i = startDay; i <= endDay; i++) options[i - startDay] = i;

		return options;	
	},
	
	//>	@method	dateItem.getMonthOptions()	(A)
	//		Return the list of options for the month selector.
	//
	//		@return	(array)	Object of month number (0-based!) to short month name ["Jan","Feb",...]
	//<
	getMonthOptions : function () {

        var startDate = this.getStartDate(),
            endDate = this.getEndDate();
            
        // If the date range spans more than one year, return ["Jan" - "December"]
        //  - Even if they are less than a year apart
        //  (startDate in December 1995, and endDate in February 1996, for example)
        //  we don't want to return ["Jan", "Feb", "Dec"], as this will look wierd in the selector, 
        //  and allow you to select dates outside the range anyway ("Feb, 1995", for example)
        //  - Only time we want to have this return an incomplete range is if we have a range
        //  within a single year (Feb - April, 1945), for example.
        var startMonth = 0, 
            endMonth = 11;

        // If it's within a single month in a year, return appropriate subset of days    
        if (startDate.getYear() == endDate.getYear()) {
                startMonth = startDate.getMonth()
                endMonth = endDate.getMonth()
        }
    
		// if the list of options is already in the mapCache, just pull it from there
		var key = "month." + startMonth + "." + endMonth;
		if (isc.DateItem.mapCache[key]) return isc.DateItem.mapCache[key];

		// otherwise build the options and store it in the dayMapCache
		var options = isc.DateItem.mapCache[key] = {};

		// get the list of names as an array
		var monthNames = new Date().getShortMonthNames();
		// and convert it to an object
		for (; startMonth <= endMonth; startMonth++) {
			options[startMonth] = monthNames[startMonth];
		}

		return options;	
	},
	
	//>	@method	dateItem.getYearOptions()	(A)
	//		Return the list of options for the year selector.
	//
	//		@return	(array)	Array of day numbers from this.startYear - this.endYear;
	//<
	getYearOptions : function () {

        var startYear = this.getStartDate().getFullYear(),
            endYear = this.getEndDate().getFullYear();

		// if the list of options is already in the mapCache, just pull it from there
		var key = "year." + startYear + "." + endYear;
		if (isc.DateItem.mapCache[key]) return isc.DateItem.mapCache[key];

		// otherwise build the options and store it in the dayMapCache
		var options = isc.DateItem.mapCache[key] = [];
        for (var i = startYear; i <= endYear; i++) {
			options[i-startYear] = i;
		}
		return options;	
	},

	
	//>	@method	dateItem.parseDate()
	//		@group	elements
	//			parse a date passed in as a string
	//
	//		@param	dateString (string)     date value as a string
    //      @param  inputFormat   (DateInputFormat) format for date strings to be parsed
	//
	//		@return	(date)		date value
	//<
	parseDate : function (dateString, inputFormat) {
        if (inputFormat == null) inputFormat = this.inputFormat;        
		return Date.parseInput(dateString, inputFormat, this.centuryThreshold, true);
	},
    

    // Methods effecting the dateChooser
    
    // override 'showPicker' - instead of creating a picker instance we're reusing a shared
    // one.
    showPicker : function () {

        if (!this.picker) this.picker = isc.DateChooser.getSharedDateChooser();
        var picker = this.picker;
        
        var oldItem = picker.callingFormItem;
        if (oldItem != this) {
            if (oldItem) oldItem.ignore(picker, "dataChanged");
            this.observe(picker, "dataChanged", "observer.pickerDataChanged(observed)");
            
            picker.callingFormItem = this;
            picker.callingForm = this.form;
        }
        
        return this.Super("showPicker", arguments);
        
    },
    
    // custom code to center the picker over the picker icon
    getPickerRect : function () {
        // we want the date chooser to float centered over the picker icon.
        var left = this.getPageLeft(),
            top = this.getPageTop(),
            
            chooserWidth = isc.DateItem.chooserWidth + 3,
            chooserHeight = isc.DateItem.chooserHeight + 3;

        left += (this.getVisibleWidth() - (this.getPickerIconWidth() /2)) - 
                (chooserWidth/2);
        
        top += (this.getPickerIconHeight() / 2) - (chooserHeight/2);

        // NOTE: don't return chooserWidth/Height as part of the rect, which would cause the
        // picker to actually be resized to those dimensions, and they may match the natural
        // size at which the chooser draws given skinning properties.
        return [left, top];
    },
    

	//>	@method	dateItem.pickerDataChanged()
    //      Store the date passed in, and fire the change handler for this item.
    //      Called when the user selects a date from the date-chooser window.  
    //  @visibility internal
	//<
	pickerDataChanged : function (picker) {

        var date = picker.getData();
        var year = date.getFullYear(),
            month = date.getMonth(),
            day = date.getDate();

        // avoid firing 'updateValue' while setting the values of sub items
        this._suppressUpdates = true;

        if (this.useTextField) {
            this.dateTextField.setValue(date.toShortDate(this.displayFormat));
        } else {
            if (this.yearSelector) this.yearSelector.setValue(year);
            if (this.monthSelector) this.monthSelector.setValue(month);
            if (this.daySelector) this.daySelector.setValue(day);
        }
        this._suppressUpdates = false;
        
        // Explicitly call 'updateValue' to save the new date (handles firing change
        // handlers, etc. too)
        this.updateValue();
	}

    //>EditMode dynamically changing useTextField
    , 
    propertyChanged : function (propertyName) {
        if (propertyName == "useTextField") this.setItems();
    }
    //<EditMode
});

}