Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / examples / calendar / src / EventEditForm.js
diff --git a/examples/calendar/src/EventEditForm.js b/examples/calendar/src/EventEditForm.js
deleted file mode 100644 (file)
index b97cbbd..0000000
+++ /dev/null
@@ -1,228 +0,0 @@
-/*!
- * Ext JS Library 3.3.1
- * Copyright(c) 2006-2010 Sencha Inc.
- * licensing@sencha.com
- * http://www.sencha.com/license
- */
-/**
- * @class Ext.calendar.EventEditForm
- * @extends Ext.form.FormPanel
- * <p>A custom form used for detailed editing of events.</p>
- * <p>This is pretty much a standard form that is simply pre-configured for the options needed by the
- * calendar components. It is also configured to automatically bind records of type {@link Ext.calendar.EventRecord}
- * to and from the form.</p>
- * <p>This form also provides custom events specific to the calendar so that other calendar components can be easily
- * notified when an event has been edited via this component.</p>
- * <p>The default configs are as follows:</p><pre><code>
-    labelWidth: 65,
-    title: 'Event Form',
-    titleTextAdd: 'Add Event',
-    titleTextEdit: 'Edit Event',
-    bodyStyle: 'background:transparent;padding:20px 20px 10px;',
-    border: false,
-    buttonAlign: 'center',
-    autoHeight: true,
-    cls: 'ext-evt-edit-form',
-</code></pre>
- * @constructor
- * @param {Object} config The config object
- */
-Ext.calendar.EventEditForm = Ext.extend(Ext.form.FormPanel, {
-    labelWidth: 65,
-    title: 'Event Form',
-    titleTextAdd: 'Add Event',
-    titleTextEdit: 'Edit Event',
-    bodyStyle: 'background:transparent;padding:20px 20px 10px;',
-    border: false,
-    buttonAlign: 'center',
-    autoHeight: true,
-    // to allow for the notes field to autogrow
-    cls: 'ext-evt-edit-form',
-
-    // private properties:
-    newId: 10000,
-    layout: 'column',
-
-    // private
-    initComponent: function() {
-
-        this.addEvents({
-            /**
-             * @event eventadd
-             * Fires after a new event is added
-             * @param {Ext.calendar.EventEditForm} this
-             * @param {Ext.calendar.EventRecord} rec The new {@link Ext.calendar.EventRecord record} that was added
-             */
-            eventadd: true,
-            /**
-             * @event eventupdate
-             * Fires after an existing event is updated
-             * @param {Ext.calendar.EventEditForm} this
-             * @param {Ext.calendar.EventRecord} rec The new {@link Ext.calendar.EventRecord record} that was updated
-             */
-            eventupdate: true,
-            /**
-             * @event eventdelete
-             * Fires after an event is deleted
-             * @param {Ext.calendar.EventEditForm} this
-             * @param {Ext.calendar.EventRecord} rec The new {@link Ext.calendar.EventRecord record} that was deleted
-             */
-            eventdelete: true,
-            /**
-             * @event eventcancel
-             * Fires after an event add/edit operation is canceled by the user and no store update took place
-             * @param {Ext.calendar.EventEditForm} this
-             * @param {Ext.calendar.EventRecord} rec The new {@link Ext.calendar.EventRecord record} that was canceled
-             */
-            eventcancel: true
-        });
-
-        this.titleField = new Ext.form.TextField({
-            fieldLabel: 'Title',
-            name: Ext.calendar.EventMappings.Title.name,
-            anchor: '90%'
-        });
-        this.dateRangeField = new Ext.calendar.DateRangeField({
-            fieldLabel: 'When',
-            anchor: '90%'
-        });
-        this.reminderField = new Ext.calendar.ReminderField({
-            name: 'Reminder'
-        });
-        this.notesField = new Ext.form.TextArea({
-            fieldLabel: 'Notes',
-            name: Ext.calendar.EventMappings.Notes.name,
-            grow: true,
-            growMax: 150,
-            anchor: '100%'
-        });
-        this.locationField = new Ext.form.TextField({
-            fieldLabel: 'Location',
-            name: Ext.calendar.EventMappings.Location.name,
-            anchor: '100%'
-        });
-        this.urlField = new Ext.form.TextField({
-            fieldLabel: 'Web Link',
-            name: Ext.calendar.EventMappings.Url.name,
-            anchor: '100%'
-        });
-
-        var leftFields = [this.titleField, this.dateRangeField, this.reminderField],
-        rightFields = [this.notesField, this.locationField, this.urlField];
-
-        if (this.calendarStore) {
-            this.calendarField = new Ext.calendar.CalendarPicker({
-                store: this.calendarStore,
-                name: Ext.calendar.EventMappings.CalendarId.name
-            });
-            leftFields.splice(2, 0, this.calendarField);
-        };
-
-        this.items = [{
-            id: 'left-col',
-            columnWidth: 0.65,
-            layout: 'form',
-            border: false,
-            items: leftFields
-        },
-        {
-            id: 'right-col',
-            columnWidth: 0.35,
-            layout: 'form',
-            border: false,
-            items: rightFields
-        }];
-
-        this.fbar = [{
-            text: 'Save',
-            scope: this,
-            handler: this.onSave
-        },
-        {
-            cls: 'ext-del-btn',
-            text: 'Delete',
-            scope: this,
-            handler: this.onDelete
-        },
-        {
-            text: 'Cancel',
-            scope: this,
-            handler: this.onCancel
-        }];
-
-        Ext.calendar.EventEditForm.superclass.initComponent.call(this);
-    },
-
-    // inherited docs
-    loadRecord: function(rec) {
-        this.form.loadRecord.apply(this.form, arguments);
-        this.activeRecord = rec;
-        this.dateRangeField.setValue(rec.data);
-        if (this.calendarStore) {
-            this.form.setValues({
-                'calendar': rec.data[Ext.calendar.EventMappings.CalendarId.name]
-            });
-        }
-        this.isAdd = !!rec.data[Ext.calendar.EventMappings.IsNew.name];
-        if (this.isAdd) {
-            rec.markDirty();
-            this.setTitle(this.titleTextAdd);
-            Ext.select('.ext-del-btn').setDisplayed(false);
-        }
-        else {
-            this.setTitle(this.titleTextEdit);
-            Ext.select('.ext-del-btn').setDisplayed(true);
-        }
-        this.titleField.focus();
-    },
-
-    // inherited docs
-    updateRecord: function() {
-        var dates = this.dateRangeField.getValue();
-
-        this.form.updateRecord(this.activeRecord);
-        this.activeRecord.set(Ext.calendar.EventMappings.StartDate.name, dates[0]);
-        this.activeRecord.set(Ext.calendar.EventMappings.EndDate.name, dates[1]);
-        this.activeRecord.set(Ext.calendar.EventMappings.IsAllDay.name, dates[2]);
-    },
-
-    // private
-    onCancel: function() {
-        this.cleanup(true);
-        this.fireEvent('eventcancel', this, this.activeRecord);
-    },
-
-    // private
-    cleanup: function(hide) {
-        if (this.activeRecord && this.activeRecord.dirty) {
-            this.activeRecord.reject();
-        }
-        delete this.activeRecord;
-
-        if (this.form.isDirty()) {
-            this.form.reset();
-        }
-    },
-
-    // private
-    onSave: function() {
-        if (!this.form.isValid()) {
-            return;
-        }
-        this.updateRecord();
-
-        if (!this.activeRecord.dirty) {
-            this.onCancel();
-            return;
-        }
-
-        this.fireEvent(this.isAdd ? 'eventadd': 'eventupdate', this, this.activeRecord);
-    },
-
-    // private
-    onDelete: function() {
-        this.fireEvent('eventdelete', this, this.activeRecord);
-    }
-});
-
-Ext.reg('eventeditform', Ext.calendar.EventEditForm);