GridFilter is a plugin (ptype='gridfilters') for grids that * allow for a slightly more robust representation of filtering than what is * provided by the default store.

Filtering is adjusted by the user using the grid's column header menu * (this menu can be disabled through configuration). Through this menu users * can configure, enable, and disable filters for each column.

Filtering implementations : *
* Default filtering for Strings, Numeric Ranges, Date Ranges, Lists (which can * be backed by a Ext.data.Store), and Boolean. Additional custom filter types * and menus are easily created by extending Ext.ux.grid.filter.Filter. *
Graphical indicators : *
* Columns that are filtered have {@link #filterCls a configurable css class} * applied to the column headers. *
Paging : *
* If specified as a plugin to the grid's configured PagingToolbar, the current page * will be reset to page 1 whenever you update the filters. *
Automatic Reconfiguration : *
* Filters automatically reconfigure when the grid 'reconfigure' event fires. *
Stateful : * Filter information will be persisted across page loads by specifying a * stateId in the Grid configuration. *
* The filter collection binds to the * {@link Ext.grid.GridPanel#beforestaterestore beforestaterestore} * and {@link Ext.grid.GridPanel#beforestatesave beforestatesave} * events in order to be stateful. *
Grid Changes : *
- A filters property is added to the grid pointing to * this plugin.
- A filterupdate event is added to the grid and is * fired upon onStateChange completion.
Server side code examples : *
- PHP - (Thanks VinylFox)
- Ruby on Rails - (Thanks Zyclops)
- Ruby on Rails - (Thanks Rotomaul)
- Python - (Thanks Matt)
- Grails - (Thanks Mike)

false : Default *

* Flatten into query string of the form (assuming {@link #paramPrefix}='filters': *


filters[0][field]="someDataIndex"&
filters[0][data][comparison]="someValue1"&
filters[0][data][type]="someValue2"&
filters[0][data][value]="someValue3"&
     *

true : *

* JSON encode the filter data *


filters[0][field]="someDataIndex"&
filters[0][data][comparison]="someValue1"&
filters[0][data][type]="someValue2"&
filters[0][data][value]="someValue3"&
     *

List filters are able to be preloaded/backed by an Ext.data.Store to load * their options the first time they are shown. ListFilter utilizes the * {@link Ext.ux.menu.ListMenu} component.

Although not shown here, this class accepts all configuration options * for {@link Ext.ux.menu.ListMenu}.

data to be used to implicitly create a data store * to back this list when the data source is local. If the * data for the list is remote, use the {@link #store} * config instead.

Array : *


options: [
    [11, 'extra small'], 
    [18, 'small'],
    [22, 'medium'],
    [35, 'large'],
    [44, 'extra large']
]
     *

Object : *


labelField: 'name', // override default of 'text'
options: [
    {id: 11, name:'extra small'}, 
    {id: 18, name:'small'}, 
    {id: 22, name:'medium'}, 
    {id: 35, name:'large'}, 
    {id: 44, name:'extra large'} 
]
     *

String : *


     * options: ['extra small', 'small', 'medium', 'large', 'extra large']
     *

Adjust the format of this filter. Defaults to false.

When GridFilters @cfg encode = false (default):


// phpMode == false (default):
filter[0][data][type] list
filter[0][data][value] value1
filter[0][data][value] value2
filter[0][field] prod 

// phpMode == true:
filter[0][data][type] list
filter[0][data][value] value1, value2
filter[0][field] prod 
     *

@cfg encode = true


// phpMode == false (default):
filter : [{"type":"list","value":["small","medium"],"field":"size"}]

// phpMode == true:
filter : [{"type":"list","value":"small,medium","field":"size"}]
     *

remote

{@link #options}

true

Example Usage:

    
var filters = new Ext.ux.grid.GridFilters({
    ...
    filters: [{
        type: 'numeric',
        dataIndex: 'price'
    }]
});
 *

     * fieldCls : Ext.form.NumberField
     *

{@link #fields}

     * fieldCfg : {}
     *


fieldCfg : {
    width: 150,
},
     *

undefined


fields : {
    gt: { // override fieldCfg options
        width: 200,
        fieldCls: Ext.ux.form.CustomNumberField // to override default {@link #fieldCls}
    }
},
     *

iconCls : {
    gt : 'ux-rangemenu-gt',
    lt : 'ux-rangemenu-lt',
    eq : 'ux-rangemenu-eq'
}
     *

menuItemCfgs : {
    emptyText: 'Enter Filter Text...',
    selectOnFocus: true,
    width: 125
}
     *

     * menuItems : ['lt','gt','-','eq']
     *

true

Example Usage:

    
var filters = new Ext.ux.grid.GridFilters({
...
filters: [{
type: 'numeric',
dataIndex: 'price'
}]
});
*

    * fieldCls : Ext.form.NumberField
    *

{@link #fields}

    * fieldCfg : {}
    *


    fieldCfg : {
    width: 150,
    },
    *

undefined


    fields : {
    gt: { // override fieldCfg options
    width: 200,
    fieldCls: Ext.ux.form.CustomNumberField // to override default {@link #fieldCls}
    }
    },
    *

    iconCls : {
    gt : 'ux-rangemenu-gt',
    lt : 'ux-rangemenu-lt',
    eq : 'ux-rangemenu-eq'
    }
    *

    menuItemCfgs : {
    emptyText: 'Enter Filter Text...',
    selectOnFocus: true,
    width: 125
    }
    *

    * menuItems : ['lt','gt','-','eq']
    *

true

Example Usage:

    
var filters = new Ext.ux.grid.GridFilters({
    ...
    filters: [{
        // required configs
        type: 'boolean',
        dataIndex: 'visible'

        // optional configs
        defaultValue: null, // leave unselected (false selected by default)
        yesText: 'Yes',     // default
        noText: 'No'        // default
    }]
});
 *

-1) result[name]=params[p]; } } return result; }, // Perform a view change. The view is launched according to the launch option and defaults to window if none is provided. // view: Name of the view to launch. // command: The command state to start the new view in. // ControlID: An ID that is used to indicate that this view belongs to a certain parent control. Used for statefulness. // internalParams: The internal parameters for this view. MUST be passed to every view building request. // config: // viewParams: A set of parameters to send into the view. // launch: Indicates how to launch this view. values can be 'window' or 'inline' // launchingView: If launch is inline, then this must be the view that is launching this new view. The launchingView's owner will be used to house the new view. // Broadcast: A broadcasting object that will be sent to .Broadcast if this launch is successful // NoBroadcast: An indicator that, when set to true, will prevent this view launch from broadcasting. // header: Set to false and the window will not have a title or border. // DefaultSizing, SubviewSizing: Sizing objects that simply pass on through to the view constructors. // sm: A method that is called when the launch is successful. // top, left: If provided and the view is launching into a window, the window will be positioned using these options. // isSubview: (true/false) indicates this view should be treated as a subview. // PassControl: (true/false) Indicates this view should pass on its control to the launching view and cancel the launching view. launchView: function(config) { var view=config.view; var command=config.command; if(view&&command) { // mask the applied to, or parent element. if(false&&config.launchingView) { if(config.launchingView.appliedTo) { config.launchingView.appliedTo.mask('Loading...'); } else { if(config.launchingView.ownerCt) { var owner_el=config.launchingView.ownerCt.getEl(); if(owner_el) owner_el.mask('Loading'); } } } //alert('vp = ' + Ext.encode(config.viewParams)); //alert('cp = ' + Ext.encode(config.controlParams)); //alert('ip = ' + Ext.encode(config.internalParams)); // Try to create the view+command specified.. var view_object=Trakkware.ViewFramework.createView({ view: view, command: command, parent: config.launchingView, viewParams: config.viewParams, controlParams: config.controlParams, ControlID: config.ControlID, isSubview: config.isSubview, internalParams: config.internalParams, SubviewSizing: config.SubviewSizing, failureCallback: function() { if(config.failureCallback) config.failureCallback(); }, callback: function(view_object) { if(view_object) { if(config.callback) config.callback(); var launching_view = config.launchingView; // Launch into a window by default or if 'window' is specified. if(!config.launch||(config.launch&&config.launch=='window')) { // Default sizing must be defined in order to launch a window. /*if (!Ext.isDefined(config.DefaultSizing)) { alert('A config with no DefaultSizing was passed to a view which is trying to launch in a Window, but cannot because it has no sizing info!'); return; }*/ var window_config={ width: 0, height: 0, autoHeight: false, items: view_object, layout: 'fit', //modal: true, maximizable: (config.maximizable||false), listeners: { afterrender: function(rendered) { // Semi-modal features. Mask the launching view instead of modal-ing the entire thing. // Then, when the launching view is hidden, hide this window. And when the launching view // is shown, show the window! if(launching_view) { if(config.PassControl == true) { // Get the launching view of the view that is launching this view....JESUS! var new_launching_view = launching_view.getLaunchingView(); // Tell the launching view to go away. launching_view.fireEvent('cancelview', true); // Now assign the launching view of the view we just made go away to THIS view's launching view. launching_view = new_launching_view; } } var finish=function(rendered_view) { var width=rendered_view.getWidth(); //Trakkware.ViewFramework.SCROLLBAR_WIDTH; var height=rendered_view.getHeight(); // +Trakkware.ViewFramework.SCROLLBAR_WIDTH; // Sometimes we have a view which likes to autoheight, but gets stuffed into a window. In this case, height will come // back as zero, so use the Height value. //alert(Ext.encode(config.DefaultSizing)); if(height == 0 && config.DefaultSizing) height = config.DefaultSizing.Height; var body_size=Ext.getBody().getViewSize(); var auto_scroll=false; if(width>body_size.width) { width=body_size.width-Trakkware.ViewFramework.SCROLLBAR_WIDTH; auto_scroll=true; } if(height>body_size.height) { height=body_size.height-Trakkware.ViewFramework.SCROLLBAR_WIDTH; auto_scroll=true; } rendered.setSize({ width: width,height: height }); if(auto_scroll===true) rendered.setAutoScroll(true); } if(view_object.rendered===true) { finish(view_object); } else { view_object.on('afterrender',finish); } } } }; var attach_titlechange=true; if(config.header===false) { Ext.apply(window_config,{ header: false, closable: false }); attach_titlechange=false; } else { Ext.apply(window_config,{ title: 'loading...' }); } if(config.top) Ext.apply(window_config, { x: config.top }); if(config.left) Ext.apply(window_config, { y: config.left }); if(config.ControlID) Ext.apply(window_config,{ id: 'window'+config.ControlID }); var window=new Ext.Window(window_config); if(attach_titlechange===true) { // Captures title changes on the view and re-titles the window with the view's title. view_object.on('titlechange',function(panel,title) { window.setTitle(title); }); } // When the view needs to cancel, close this window. // I was listening for cancelview on view_object before, in case this // change causes issues. window.addEvents('cancelview'); window.on('cancelview',function(passed_control) { window.fireEvent('registersemimodalwindow', { Window: window }); window.wasPassedControl = passed_control; window.close(); Ext.destroy(window); return false; }); window.addEvents('registersemimodalwindow', 'semimodal'); window.on('registersemimodalwindow', function(mc) { if(launching_view) launching_view.fireEvent('registersemimodalwindow', mc); }); // This part keeps the infinite front->back->front loop from happening when more than // one masked window is open and then the top (unmasked) window is closed. var current_mask = null; function windowOrder() { if(current_mask != null) { window.toBack(); } } window.on('activate', function() { windowOrder.defer(100); }); window.on('semimodal', function(show) { if(show === true) { current_mask = window.el.mask(null); } else { if(window.wasPassedControl == true) { } window.el.unmask(); current_mask = null; window.toFront(); } }); view_object.on('reloadparentview',function() { if(launching_view) launching_view.fireEvent('reloadview'); window.close(); Ext.destroy(window); return false; }); window.show(); } else if(config.launch=='inline' && launching_view) { var owner=launching_view.ownerCt; var cancelobj=(launching_view.getCancelObject?launching_view.getCancelObject():null); if(owner) { if(owner.items) { // find the current position in owner. var pos = 0; owner.items.each(function(item) { if(item == launching_view) return false; pos++; }); var title = launching_view.title; owner.remove(launching_view); var newtab = owner.insert(pos, view_object); owner.doLayout(); if(owner.getXType && owner.getXType() == 'tabpanel') { owner.activate(newtab); } view_object.applyTitle(title); } else { owner.removeAll(true); owner.add(view_object); owner.doLayout(); } // unmask the owner. var owner_el=owner.getEl(); if(owner_el) owner_el.unmask(); } else { var applied_to=launching_view.appliedTo; // try to save some ram on the client if(launching_view.wrapper) Ext.destroy(launching_view.wrapper); Ext.destroy(launching_view); applied_to.update(''); var wrapper=applied_to.createChild({ tag: 'div' }); view_object.applyToMarkup(wrapper); view_object.appliedTo=applied_to; view_object.wrapper=wrapper; // unmask the applied to element. if(applied_to&&applied_to.unmask) applied_to.unmask(); } } else { throw('unknown launch string: '+config.launch); return; } // If a broadcast object was provided, send it to the Broadcaster. if(config.NoBroadcast!=true&&config.Broadcast) { Trakkware.ViewFramework.Broadcast(config.Broadcast); } if(config.sm && Ext.isFunction(config.sm)) config.sm(true); } } }); } }, // Executes a view action which does not involve view launching. // example of actions that don't launch views: Save, cancel, delete, etc.. // view: name of the view to use for performing this action. // command: the command that represents the action in view. // **Special Note** => Leave view and command empty, and this action will not attempt to make ajax calls back to the Method Handler. // This is useful for actions like Cancel which do not require any data manipulation. // ActionDefinition: The action definition object for this command. // ControlID: The unique id of the website control this view belongs to. used for Broadcasting and listening. // config: // actionParams: A set of unmapped parameters that is used as a source for mapped out parameters when the method handler is called. // successCommand: A command to put this view into if this action is sucessful. // transactionCommand: A command of a parent view that this action is mapped to. Perform action will not do the actual ajax call but will pass this call up to the parent view for transactional processing. // useConfirmation: (true/false) Indicates to use a confirmation before performing this cation. // confirmationTitle: A title to use for the confirmation message box when confirm is true. // confirmationMessage: The message to display when confirming this action. // reloadOnSuccess: (true/false) Indicates that the view or its parent should reload on success. // cancelOnSuccess: (true/false) Indicates the current view should cancel itself upon success. // successMessage: A message to display when the action is sucessful. The actionParams are used as a data source for templating the sucess message. // resetDirtyOnSuccess: (true/false) Indicates that form dirty statuses should be reset when this action is successful. // NoBroadcast: An override boolean that, when set to true, will force this action to NOT broadcast. // rm: A method that is invoked if the action is successful and reloadOnSuccess is true. // cm: A method that is invoked if the action is successful and cancelOnSuccess is true. // vm: A method that is invoked if the action causes a validation response to occur. An array of validations is provided to the method as its sole parameter. // form: If you are using a form with performAction and need it to submit for uploads, then you must include // the FormPanel itself so this csode can call form.getForm().submit() and cause the uploads to submit. // PLEASE NOTE: Even tho you are providing a form here, this code is NOT harvesting the form for values. The data values to // submit must be provided as actionParams just as a non-form would do. // IsTransactional: Indicates this action should be performed transactionally. // TransactionFormID: ID of the form that this transaction belongs to. Used for validations. // TransactionParentCommand: The parent command that maps to this transaction. // ChildTransactions: An array of child transactions that need to go along with this action. // IsDirty: Indicates if the dirtiness associated with the current action. // JustResults: Just get the data from this action and return it. No post action or ANYTHING. // failureCallback: function is called when there is a failure // successCallback: function invoked when action is finished and successful. // ViewObject: The view object making this call. Used by masking to call fireEvent performAction: function(config, calling_view_object) { // Get view and command. They can be empty, so don't get judgemental about their existence up here. var view=config.view; var command=config.command; // Construct a broadcasting object for later use. var broadcast_config={ Command: command, ActionDefinition: config.ActionDefinition, RawData: config.actionParams, ControlID: config.ControlID } // Quick reference var. var child_transactions=null; // When a valid subview transaction map is provided, use transactions. if(Ext.isArray(config.ChildTransactions)&&config.ChildTransactions.length>0) { child_transactions=config.ChildTransactions; config.IsTransactional=true; } // If JustResults is true, override Transactional. if(config.JustResults==true) config.IsTransactional=false; // inner function is called to start the action. The reason for this is Ext.Msg.confirm is a non-blocking alert box so to use the same code for confirmation and non-confirmation, i put // the code in an inner function. function startAction() { // Throw mask if(config.ViewObject) config.ViewObject.fireEvent('mask', { Activate: true, ViewName: view, Command: command }); // Check if this is a transactional action. If so, capture its info and pass it back. if(config.IsTransactional==true) { var transaction={ view: view, command: command, data: config.actionParams, ParentCommand: config.TransactionParentCommand, control_id: config.TransactionFormID // Needs to be set in transactionCallback by caller. }; // Child transactions where provided? If so, bundled this all together and send it off to // the commitTransaction method. if(Ext.isArray(child_transactions)&&child_transactions.length>0) { // Check if this transaction should be added.. var add_transaction=true; if(config.ActionDefinition&&config.ActionDefinition.transactional_only_on_dirty==true) { // If this action requires dirtiness when it is a transaction, don't add it unless it's dirty! if(config.IsDirty==false) add_transaction=false; } if(add_transaction==true) child_transactions.push(transaction); // Commit the collection of transactions. Trakkware.ViewFramework.commitTransaction(view,command,child_transactions,config, function(config,response) { Trakkware.ViewFramework.doPostAction(config,response,calling_view_object); if(Ext.isFunction(config.successCallback)) config.successCallback(); }, config.failureCallback ); return false; } return transaction; } else { // When both the view and command are specified, make a call to the Method Handler with the // actionParams supplied. if(Ext.isDefined(view)&&!Ext.isEmpty(view)&&Ext.isDefined(command)&&!Ext.isEmpty(command)) { // Make the method call and allow it to proceed on to doPostAction. Trakkware.ViewFramework.performMethodCall( calling_view_object, config, function(result) { if(Ext.isFunction(config.successCallback)) config.successCallback(); // When just results, return the results of this method call. if(config.JustResults==true) { return result; } else { // Call a success callback if provided. if(config.sm) config.sm(); // If an action definition was provided send off to the broadcaster if(config.NoBroadcast!=true) { Trakkware.ViewFramework.Broadcast(broadcast_config); } } }, config.failureCallback); } else { // Only do these if JustResults is not true. if(config.JustResults != true) { // No view and/or command so just do the action. Don't make a call to the server. var success=Trakkware.ViewFramework.doPostAction(config,null,calling_view_object); if(config.NoBroadcast != true && success==true) { Trakkware.ViewFramework.Broadcast(broadcast_config); } if(Ext.isFunction(config.successCallback)) config.successCallback(); } } } } // Decide whether to use the dirty confirmation or regular. var use_dirty=false; var confirm=config.useConfirmation; if(config.isDirty==true&&config.confirmOnDirty==true) { use_dirty=true; confirm=true; } var confirm_msg = (use_dirty == true ? config.dirtyConfirmationMessage : config.confirmationMessage); var confirm_title = (use_dirty == true ? config.dirtyConfirmationTitle : config.confirmationTitle); // If a confirmation is required, show one before completing the action. if(confirm==true) { Ext.Msg.confirm(confirm_title,confirm_msg,function(btn) { if(btn=='yes') { return startAction(); } }); } else { return startAction(); } }, // Takes method information and makes an ajax call which call doPostAction // if no callback is provided. // // See performAction // Additional config options: // // JustResults: Set to true to only get the results back from this call, ignoring post action. performMethodCall: function(calling_view_object,config,callback, failureCallback) { var view=config.view; var command=config.command; // Check if a form option was provided. This is required for executing actions that cause a form to upload. if(config.form&&config.form.fileUpload==true) { var upload_form=config.form.getForm(); if(upload_form&&upload_form.isValid()) { upload_form.submit({ params: { view: view, command: command, paramarray: Ext.encode(config.actionParams) }, url: Trakkware.Handlers.MethodHandler, waitMsg: 'Please wait...', success: function(response,action) { // Damn form submits. response=action.result; // Parse the response. var result=response.result; var send_back=null; if(result=='0') { Ext.Msg.alert('Cannot Continue','No changes were made because:\r\n\r\n'+response.msg); if(Ext.isFunction(failureCallback)) failureCallback(); return; } else if(result=='1') { // If instructed to, return the data from the list immediately. if(config.JustResults==true) { send_back={ list: response.list,count: response.count,response: response }; } else { send_back=true; } var success_msg=response.msg; if(success_msg) { Ext.Msg.alert('Success',success_msg); } } else if(result=='2') { if(calling_view_object) { calling_view_object.fireEvent('validations',response.validations); } } if(callback) { callback(config,send_back); } // Do post action after everything else. Trakkware.ViewFramework.doPostAction(config,response,calling_view_object); }, failure: function(response) { Ext.Msg.alert('HTTP error','An unknown Http error occured when I tried to launch this view. Are you still connected to the web?'); if(Ext.isFunction(failureCallback)) failureCallback(); } }); } } else { Ext.Ajax.request({ method: 'POST', url: Trakkware.Handlers.MethodHandler, params: { view: view, command: command, paramarray: Ext.encode(config.actionParams) }, success: function(response) { // Parse the response. response=Ext.decode(response.responseText); var result=response.result; var send_back=null; if(result=='0') { Ext.Msg.alert('Cannot Continue','No changes were made because:\r\n\r\n'+response.msg); if(Ext.isFunction(failureCallback)) failureCallback(); return; } else if(result=='1') { // If instructed to, return the data from the list immediately. if(config.JustResults==true) { send_back={ list: response.list,count: response.count,response: response }; } else { send_back=true; } var success_msg=response.msg; if(success_msg) { Ext.Msg.alert('Success',success_msg); } } else if(result=='2') { if(calling_view_object) { calling_view_object.fireEvent('validations',response.validations); } } if(callback) { callback(config,send_back); } // Do post action after everything else. Trakkware.ViewFramework.doPostAction(config,response,calling_view_object); }, failure: function(response) { Trakkware.ViewFramework.processRequestFailure(response, failureCallback); } }); } }, // Takes an array of transactions and commits them. Any validation results or messages returned by the transaction // are returned to the caller. commitTransaction: function(view,command,transaction_array,config,on_success_callback, failure_callback) { var fixed_array=''; var first=true; Ext.each(transaction_array,function(transaction) { if(first==true) first=false;else fixed_array+=','; fixed_array+=Ext.encode(transaction); }); fixed_array='['+fixed_array+']'; // Test code. See how many transactions and what is in them. //alert('committing a transaction with ' + transaction_array.length + ' transactions.'); Ext.each(transaction_array,function(t) { Trakkware.ViewFramework.log('TRANSACTION: '+Ext.encode(t)); }); // If there were transaction, process them. if(transaction_array.length>0) { Ext.Ajax.request({ method: 'POST', // Do not change this to a GET unless you know what yer doing! url: Trakkware.Handlers.MethodHandler, params: { view: view, command: command, transactions: fixed_array }, success: function(response) { // Parse the response. response=Ext.decode(response.responseText); if(on_success_callback) on_success_callback(config,response); }, failure: function(response) { Trakkware.ViewFramework.processRequestFailure(response, failure_callback); } }); } else { // If the transaction must go forward but there are no transactions, simply call the success methods. if(on_success_callback) on_success_callback(); } }, // Takes a template string, turns it into an Ext.XTemplate, and then finally applies the data parameter to them. applyTemplate: function(template,data) { var tpl=new Ext.XTemplate(template); try { return tpl.apply(data); } catch(e) { } return template; }, // Inner function that is called from performAction() when the action has completed with the server // or never bothered with the server. doPostAction: function(config, response, calling_view_object) { // collect behavior config info. var reload_success=config.reloadOnSuccess; var cancel_view_success=config.cancelOnSuccess; var success_msg=config.successMessage; var reset_dirty=config.resetDirtyOnSuccess; var success_command = config.successCommand; // An ajax response is provided. Deal with it appropriately. if(response&&response.responseText) response=Ext.decode(response.responseText); var perform_success=false; // If a null response is provided, go forward as if we were successful. if(response==null) { perform_success=true; } else { if(!response||response.result=='1') { perform_success=true; // Tell forms to reset.. if(reset_dirty==true) { calling_view_object.fireEvent('resetdirty',calling_view_object); } } // result of 2 means validation errors. if(response&&response.result=='2') { var success=response.success; if(success==false) { calling_view_object.fireEvent('validations',response.validations); } else { perform_success=true; } } else if(response&&response.result=='5') { // The user does not have permission to handle the view requested. Ext.Msg.alert('Permission Denied','The action you attempted cannot be completed because you do not have permissions.',function() { }); } else if(response&&response.result=='6') { // The user is not logged in. Ext.Msg.alert('Not logged in','Your session has ended. Please login again to continue working.',function() { // do re-login here. }); } else if(response&&response.result=='0') { Ext.Msg.alert('Error performing action',response.msg); } } // If the action was successful, do several things depending on how its behavior was set in config. if(perform_success==true) { action_successful=true; // Check success command before anything. if(success_command) { // Fire reload if indicated before changing to the other command and a parent exists. // I put this in to satisfy save & continue functionality. if(reload_success==true && calling_view_object.Parent) { calling_view_object.Parent.fireEvent('reloadview'); calling_view_object = calling_view_object.Parent; } var new_config = { view: config.view, command: success_command, launchingView: calling_view_object, isSubview: false, viewParams: config.actionParams }; var windowMgr = calling_view_object.getWindowMgr(); if(windowMgr != null) { var view = Trakkware.ViewFramework.createView({ view: config.view, command: success_command, launchingView: calling_view_object, viewParams: config.actionParams, isSubview: false, callback: function(viewobject) { windowMgr.addView({ view: viewobject, launch: 'window', replace: true }); } }); } else { // First cancel the calling view. if(cancel_view_success == true) { // Tell the launching view to go away. calling_view_object.fireEvent('cancelview', true); } // THE OLD WAY! Then launch the new view Trakkware.ViewFramework.launchView(new_config); } } else { // When both reload and cancel are set, fire the close-and-reload event. if(reload_success==true && cancel_view_success==true) { calling_view_object.fireEvent('closeviewandreloadparent'); } else { // Fire reload if indicated. if(reload_success==true) { calling_view_object.fireEvent('reloadparentview'); } // Fire cancel if indicated. if(cancel_view_success==true) { calling_view_object.fireEvent('cancelview'); } } } } // Return an indicator of success. return perform_success; }, // BROADCASTING!!!!!!!!!!! // Expected params: // ControlID: Unique page ID of the control that is broadcasting. // Command: The command to broadcast. // ActionDefinition: The action definition for the command that mapped to this command. // RawData: A raw data set that will be mapped using... Broadcast: function(config) { // Validate incoming: if(Trakkware.ViewFramework.requireOption(config,'Command',config.ControlID+': Trakkware.View.Broadcast')==false) return; if(Trakkware.ViewFramework.requireOption(config,'RawData',config.ControlID+': Trakkware.View.Broadcast')==false) return; if(Trakkware.ViewFramework.requireOption(config,'ActionDefinition',config.ControlID+': Trakkware.View.Broadcast')==false) return; // Only broadcast if a ControlID is present. if(config.ControlID) { // Get config options. var command=config.Command; var data=config.RawData; var broadcast=config.ActionDefinition.broadcast; var expected=config.ActionDefinition.expected; // When no map is provided, build one with no parameters. if(!broadcast) broadcast={}; // Get parameter set for the broadcast. var broadcast_parameters={} // Move through the data provided and snag any parameters that match // and convert their parameter name according to the broadcast map. Ext.iterate(broadcast,function(from) { // To be included in the broadcast params, a property needs // to exist in the data AND expected objects. if(data[from]&&expected.indexOf(from)!= -1) broadcast_parameters[broadcast[from]]=data[from]; }) // Special case: If broadcast data is empty, set it to the null token. if(Ext.encode(broadcast_parameters)=='{}') { broadcast_parameters={ NULL: 'NULL' }; } // If you're having a hard time telling what is going on in broadcasts, use this test alert: //alert(config.ControlID + ' is expecting ' + expected + ', \r\nhas ' + Ext.encode(broadcast_parameters) + ' and is changing its state to ' + config.Command + ' with ' + Ext.encode(broadcast)); // Do the actual broadcasting with the StateHash Trakkware.StateHash.changeState(config.ControlID,command,broadcast_parameters); } }, findFieldByPropertyName: function(container,property_name) { if(container&&container.items) { var result=null; container.items.each(function(field) { var xtype=field.getXType?field.getXType():null; if(field.PropertyName&&field.PropertyName==property_name) { result=field; return false; } if(field.xtype=='container') { var child=Trakkware.ViewFramework.findFieldByPropertyName(field,property_name); if(child!=null) { result=child; return false; } } }); return result; } }, findFieldByDatafield: function(container,datafield) { if(container&&container.items) { var result=null; container.items.each(function(field) { var xtype=field.getXType?field.getXType():null; if(field.datafield&&field.datafield==datafield) { result=field; return false; } if(field.xtype=='container') { var child=Trakkware.ViewFramework.findFieldByDatafield(field,datafield); if(child!=null) { result=child; return false; } } }); return result; } }, findTextOrCombo: function(container) { if(container&&container.items) { var result=null; container.items.each(function(field) { if(field.getXType) { var xtype=field.getXType(); if(xtype=='textfield'||xtype=='combo'||xtype=='trakkware_combopicklist') { result=field; return false; } if(xtype=='container') { var child=Trakkware.ViewFramework.findTextOrCombo(field); if(child!=null) { result=child; return false; } } } }); return result; } }, // Simple console logging. log: function(msg) { if(window.console&&window.console.log) window.console.log(msg); }, // Used to indicate xtypes that need ALL data when their values are set. requiresAllData: function(xtype) { var accept=[ 'trakkware_popup', 'trakkware_button', 'trakkware_template', 'trakkware_repeatform' ]; var req=accept.indexOf(xtype); if(req> -1) return true; return false; }, // hack for the massive confusion of javascript + extJS + Microsoft JSON serializer. ParseMicrosoftData: function(date) { if(date.indexOf&&date.indexOf('Date')> -1) { return eval('new '+date.replace('/','').replace('/','')); } }, // Takes a Sizing object and applies it to the config supplied. ApplySizing: function(config,sizing) { if(sizing) { config.width=sizing.Width-Trakkware.ViewFramework.SCROLLBAR_WIDTH; if(sizing.Anchor && sizing.UseAnchor==true) { config.anchor=sizing.Anchor; } if(sizing.AutoHeight==true || sizing.Height == -1) { config.autoHeight=true; } else { config.height=sizing.Height-Trakkware.ViewFramework.SCROLLBAR_WIDTH;; } } return config; }, // Returns an object describing whether to show or hide or don't worry about it based on // the ShowOn provided and data. ProcessShowOn: function(field, showon, data) { // If the data contains a property that matches the show-on property, we are in business! if(showon && data && field) { var show = showon.show; var property = showon.property; var value = showon.value; if(Ext.isDefined(data[property])) { var eq = false; if(Ext.isBoolean(data[property]) && !Ext.isBoolean(value)) { if(value == 'true' || value == '1') value = true; else if (value == 'false' || value == '0') value = false; eq = data[property] == value; } else eq = (data[property] == value) if(eq === true) { // We only care about when they are equal, // so since they are equal, return a show/hide indicator. if(show === true) { return 'show'; } else { if(field.getEl) { var el = field.getEl(); if(el && el.findParent) { var form_item = el.findParent('.x-form-item'); if(form_item) Ext.get(form_item).applyStyles({ display: 'none' }); } field.hide(); if(field.label && field.label.hide) field.label.hide(); return 'hide'; } else return; } } } } return null; }, ProcessDisableOn: function(field, disableon, data) { // If the data contains a property that matches the show-on property, we are in business! if(disableon && data && field) { var disable = disableon.show; var property = disableon.property; var value = disableon.value; if(Ext.isDefined(data[property])) { var eq = false; if(Ext.isBoolean(data[property]) && !Ext.isBoolean(value)) { // Derp.. Boolean('false') return true. Nice one, javascript. if(value == 'true' || value == '1') value = true; else if (value == 'false' || value == '0') value = false; eq = data[property] == value; } else eq = (data[property] == value) if(eq === true) { // We only care about when they are equal, // so since they are equal, return a show/hide indicator. if(disable === true) { field.disable(); return 'disable'; } else { return 'enable'; } } } } return null; }, // Use as the function for an Ajax.request({ failure }) and the failure response will be processed accordingly. // If callback is a function it will be called afterwards with response as the lone parameter. processRequestFailure: function(response, callback) { if(response.msg) Ext.Msg.alert('Technical Problem', response.msg); else Ext.Msg.alert('Technical Problem', 'A technical problem has occurred and provided no information for me to explain the problem!

Check that your internet connection is still up and contact Tech Support if you want.'); if(Ext.isFunction(callback)) callback(); }, // // config: // // view: The view to use // code: Field change code to send back. // command: The command that the view is CURRENTLY using. This is used to capture a ViewLayout on the server when building new fields. // viewParams: A set of parameters to send back with this request. // callback: Function is invoked when the field change object is successfully returned. fieldChange: function(config) { Ext.Ajax.request({ method: 'POST', url: Trakkware.Handlers.ViewHandler, params: { view: config.view, command: Trakkware.Handlers.FieldChangeCommand, fieldchange: config.code, fieldcommand: config.command, paramarray: Ext.encode(config.viewParams) }, success: function(response) { // Parse the response. response = Ext.decode(response.responseText); // Send the new object array along to the callback. config.callback(response); }, failure: function(response) { Trakkware.ViewFramework.processRequestFailure(response, failureCallback); } }); } }; Trakkware.ViewFramework.keyMap = new Ext.KeyMap(document); Trakkware.ViewFramework.keyMap.accessKey = function(key, handler, pass_along) { var h = function(n, e) { e.preventDefault(); handler(pass_along, n, e); }; this.on(key, h); }; Ext.ns('Trakkware'); // Expected config values: // ViewName: The name of this view. // ControlID: A unique identifier that indicates which HTML control this view belongs to. // Parameters: An object in the form { // Control: { n1:v1, n2:v2, ... }, // View: {x1: y1, x2: y2, ... }, // InitialQueryModifiers: { sort: x, sort_dir: y, groupbys: [], filters: [], search: z } // } // These are the parameters used to initialize the view. // Parent: The parent view if this view is a subview. // Actions: An action definition object in the form: { COMMAND1: { n1:v1, n2:v2, etc }, COMMAND2: { n4: v4, n5: v5, etc } } // SubviewMap: A map that indicates action commands in subviews that are mapped to actions in this view. // Needs to be in this form: { PropertyName: { parameter_map: {}, action_map: {} }, PropertyName2: { parameter_map: {}, action_map: {} ) ) // PropertyName: A view property name used to identify this view if it is a subview. // // GroupHeaders: An object filled with group headers, accessible by property name: { PropertyName: 'group header', propertyName: 'group header' } // // ParentCommandMap: A map of commands that the parent is mapping to this subview. // // isSubview: Indicates this is a subview. // Sizing: A Sizing object that will set height, width, and auto_height automatically. Trakkware.View = function(apply_to, config) { // Enable some events and allow them to bubble. apply_to.addEvents( 'modifierchanged', 'registersubview', 'preregistersubview', 'registerdirtyable', 'registerreactdirty', 'actionhandler', 'resetdirty', 'dirty', 'reloadview', 'cancelview', 'reloadsubview', 'closeviewandreloadparent', 'reloadparentview', 'registerdatafield', 'mask', 'broadcastmodifiers', 'performactionondirties', 'validations', 'picklistreaction', 'controlsloaded', 'broadcast', 'emptydataset', 'registersemimodalwindow', 'semimodal', 'fullreload' ); apply_to.enableBubble('reloadparentview', 'cancelview', 'registersubview', 'mask', 'resetdirty', 'registersemimodalwindow', 'semimodal'); // If an undefiend apply_to is suppled, just return it as is. if (!Ext.isDefined(apply_to)) return apply_to; apply_to.getCurrentCommand = function() { return config.Command }; // Private // Registered subviews. apply_to._registered_subviews = []; // dirtyable forms. apply_to._registered_dirtyable = []; // controls that react to the form being dirty. apply_to._registered_reactdirty = []; // pending transactions apply_to._pending_transactions = []; // Hidden transactional actionhandler-firing things. apply_to._registered_transactionals = []; // Register ed picklists. apply_to._registered_picklists = []; // Fields that are data. apply_to._registered_datafields = []; // Pre-registered subviews. apply_to._preregistered_subviews = []; var cancel_object = null; var reload_object = null; var reload_view = null; var title_object = null; var passing_state = false; apply_to._window_mgr = null; var _ControlID = config.ControlID; // React to events. apply_to.on('preregistersubview', function(subview) { apply_to._preregistered_subviews.push(subview); subview.on('afterrender', function(subview) { subview.setWindowMgr(apply_to.getWindowMgr()); }); }); // Register subviews. apply_to.on('registersubview', function(subview) { // subview is a Trakkware.View which has no xtype. // Validate the incoming subview. if (!Ext.isDefined(subview) || Ext.isEmpty(subview)) { alert('An empty subview was provided to registersubview!'); return false; } // When the subview is not THIS view, register it and prevent it from bubbling. if (subview != apply_to) { apply_to._registered_subviews.push(subview); subview.on('afterrender', function(subview) { subview.setWindowMgr(apply_to.getWindowMgr()); }); return false; } // When a view catches its OWN registersubview, return true so that this event bubbles up to the parent and it can register the subview. return true; }); // Register dirtyable controls. apply_to.on('registerdirtyable', function(control) { // If an empty control is provided, bail. if (!Ext.isDefined(control)) { alert('An undefined control was provided to Trakkware.View.registerDirtyable'); return false; } // do not register trakkware_buttons or hiddens. var xtype = control.getXType ? control.getXType() : null; if (xtype != 'hidden') { if (control.isDirty) { apply_to._registered_dirtyable.push(control); } else { if (xtype == null) xtype = 'unknown xtype'; Trakkware.ViewFramework.log('A dirtyable was provided and yet it has no .isDirty method and was subsequently ignored. (' + xtype + ')'); } } return false; }); apply_to.on('causesfieldchange', function(control, new_value, change_code) { var viewparams = apply_to.actionDataProvider(); Trakkware.ViewFramework.fieldChange({ view: apply_to.getViewName(), code: change_code, command: config.Command, viewParams: viewparams, callback: function(item_array) { var owner = control.ownerCt; // get index of control. var ii = 0; owner.items.each(function(item) { if(item.id == control.id) { ii++; // we want AFTER the control. return false; } ii++; }); // Now, get the values in existing field-change fields for later use.. var existing_values = {}; if(control.existing_field_changes) { Ext.each(control.existing_field_changes, function(old) { existing_values[old.datafield] = old.getValue(); apply_to.removeRegisteredDatafield(old); owner.remove(old); }); } // Don't forget to remove initial dynamics. owner.items.each(function(item) { if(item.isInitialDynamic == true) { owner.remove(item); } }); control.existing_field_changes = []; var focus = null; if(item_array && item_array.length > 0) { Ext.each(item_array, function(new_item) { var item = owner.insert(ii, new_item); control.existing_field_changes.push(item); if(focus == null) focus = item; ii++; }); owner.doLayout(); focus.focus(); // Now replace old values which match datafields on new items. Ext.each(control.existing_field_changes, function(item) { if(existing_values[item.datafield]) item.setValue(existing_values[item.datafield]); }); } } }); }); // Register a picklist. apply_to.on('registerpicklist', function(picklist) { apply_to._registered_picklists.push(picklist); // When a picklist reaction occurs, find registered picklists that might care. picklist.on('picklistreaction', function(from_property_name, new_value, reactions) { Ext.each(apply_to._registered_picklists, function(check_picklist) { if (reactions.indexOf(check_picklist.datafield) > -1) { var data = {}; data[from_property_name] = new_value; check_picklist.fireEvent('react', data); } }); return false; }); return false; }); // Register datafields. apply_to.on('registerdatafield', function(control) { if (control) { if (!Ext.isDefined(control.getValue)) { alert('A datafield has been passed to registerdatafield event on Trakkware.View that has no .getValue method!'); return false; } apply_to._registered_datafields.push(control); // Setting a reference back to this view for masking purposes. control.ViewObject = apply_to; } return false; }); // Register controls that react to dirtiness apply_to.on('registerreactdirty', function(control) { }); apply_to.on('reloadsubview', function(datafield_name, data) { var subviews = apply_to.getRegisteredSubviews(); Ext.each(subviews, function(subview) { if(subview.datafield == datafield_name) { subview.fireEvent('reloadview', data); } }); }); // Arises when a view must change its data but needs to commit the current changes on the view. apply_to.on('performactionondirties', function(dirty_config) { // Validate config. if (Trakkware.ViewFramework.requireOption(dirty_config, 'Command', 'Trakkware.View.on.performactionondirties') == false) return; // Get transactions that are waiting or apply to the command supplied. var transaction_array = apply_to.getTransactionsFor(dirty_config.Command, true); if (transaction_array) { Trakkware.ViewFramework.commitTransaction(dirty_config.ViewName, dirty_config.Command, transaction_array, dirty_config, function() { if (Ext.isFunction(dirty_config.Callback)) { // reset dirty! apply_to.fireEvent('resetdirty', apply_to); dirty_config.Callback(true); } }); } return false; }); // Listen for the emptydataset event. If the view is supposed to hide when this // happens, have it hide itself. apply_to.on('emptydataset', function() { if (config.HideIfEmptyDataSet === true && apply_to.hide) { apply_to.hide(); } }); // Register a transactional action. apply_to.on('registertransactional', function(command, parent_command, control) { apply_to._registered_transactionals.push({ ParentCommand: parent_command, Command: command, Control: control }); return false; }); // Attend to an action handler. apply_to.on('actionhandler', function(control, config) { apply_to.actionHandler(control, config); return false; }); // Hookup resetdirty. apply_to.on('resetdirty', function(originating_view) { // Un-dirty anything in the dirtyable list. Ext.each(apply_to._registered_dirtyable, function(item) { // Ext.util.Observable.hasEvents would be nice.... var evt = item.events['resetdirty']; var hasevent = Ext.isObject(evt) || (evt === true); // Any dirtyable that has the reset dirty event, pass it on! if (hasevent == true) { // For some reason the subview type is swallowing resetdirty... so, doing it the wrong way. if(item.view_object) { item.view_object.fireEvent('resetdirty'); } else { // Fire the items event with down == true so resetdirty won't bubble back up if item is a subview. item.fireEvent('resetdirty', apply_to, true); } } else if (item.originalValue && item.getValue) { // Things like textfields and combos have originalValue and getValue, so // use them to trick themselves in to thinking they are no longer dirty. item.originalValue = item.getValue(); // property helps do quick-dirty. See the listener in ExtHelper. if(item.pre_emptive_dirty) item.pre_emptive_dirty = false; } }); // Also tell the react-to-dirty crowd that dirty has been reset. Ext.each(apply_to._registered_reactdirty, function(react) { //UNUSED... react.fireEvent('reactdirty', false); }); // Have toolbar buttons, etc reset themselves.3 apply_to.performDirtyDuties(apply_to, true); return false; }); // Do on-dirty tasks for this form. apply_to.on('dirty', function(control, new_value, old_value) { apply_to.performDirtyDuties(apply_to, false); }); // Listen for event which causes this entire view to reload itself. apply_to.on('fullreload', function() { var title = apply_to.title; var newconfig = { TitleTemplate: title, launch: 'inline', launchingView: apply_to, view: config.ViewName, command: config.Command, viewParams: apply_to.getViewParameters(), isSubview: config.isSubview } var view = Trakkware.ViewFramework.launchView(newconfig); }); // When this event is fired, fire reloadview on the parent and then destroy this view. apply_to.on('closeviewandreloadparent', function() { apply_to.fireEvent('reloadparentview'); return false; }); // Mask listener. // mask_config: { Activate: (true/false), ViewName: Name of the view the mask lives in, Command: Command of the action causing this mask, Text: Explicit text to mask with ignores ViewName and Commnad } apply_to.on('mask', function(mask_config) { var el = apply_to.el; if (mask_config.Activate != true) { el.unmask(); } else { if(config.Text) { el.mas(config.Text); } else { if (mask_config.ViewName == apply_to.getViewName()) { var action = apply_to.getActionDefinition(mask_config.Command); if (mask_config.Activate == true && action && !Ext.isEmpty(action.mask_text)) { el.mask(action.mask_text); } } } } return false; }); // Listen for broadcasts. apply_to.on('broadcast', function(broadcast_config) { apply_to.Listen(broadcast_config); }); // Listen for validations and pass them out to subviews. apply_to.on('validations', function(validations) { // TEST CODE: What validations did we receive? //alert('got validations: ' + Ext.encode(validations)); // holds validation messages that cannot be attached to a field. var nonfield = ''; // holds the first field we encounter that has a validation error. Cheap way to set focus to the first bad item. Won't always work and we should redo. var first = null; // On each validation message, try and find its control. Ext.each(validations, function(item) { // Get the form (could be a subview) that this validation belongs to. var parent_form_id = item.control_id; var parent_view = Ext.getCmp(parent_form_id); if (parent_view) { var field = Trakkware.ViewFramework.findFieldByDatafield(parent_view, item.property); if (field && field.markInvalid) { if (first == null) first = field; field.markInvalid(item.msg); } else { nonfield += item.msg + '
'; } } else { nonfield += item.msg + '
'; } }); // Sets focus to the first field that failed validation. function setFocusToFirst() { if (first != null) { first.focus(true); } } if (nonfield != '') { Ext.Msg.alert('Validation Error', 'Could not complete the action because:
' + nonfield, function() { setFocusToFirst(); }); } else { setFocusToFirst(); } return; // Pass the validations on to subviews! It's SO EASY! Ext.each(apply_to._registered_subviews, function(subview) { subview.fireEvent('validations', validations); }); }); // React to a store loading for the first time. apply_to.on('controlsloaded', function(data) { // Fire react on each picklist. It will react if it needs to. Ext.each(apply_to._registered_picklists, function(picklist) { picklist.fireEvent('react', data); }); // Important this event does not bubble. return false; }); // Public // apply these methods to the apply to object. Ext.apply(apply_to, { // Returns true if the event name exists for this object. hasEvent: function(event_name) { var evt = apply_to.events[event_name]; return Ext.isObject(evt) || (evt === true); }, // // Parameter and Parent setup // // Access to the view's name. getViewName: function() { if (config.ViewName) return config.ViewName; return null; }, // Parameters and their access methods. getControlParameters: function() { if (config.Parameters) return Ext.apply({}, config.Parameters.Control); else return {}; }, getViewParameters: function() { if (config.Parameters) return Ext.apply({}, config.Parameters.View); else return {}; }, getParameters: function() { return { View: this.getViewParameters(), Control: this.getControlParameters(), Interal: this.getInternalParameters() } }, getInternalParameters: function() { return Ext.apply({}, config.Parameters.Internal); }, getInitialQueryModifiers: function() { if (config.Parameters) return config.Parameters.InitialQueryModifiers; else return {}; }, // Returns subview property names of the subviews with with a command specified mapped to them. getSubviewMapsForCommand: function(parent_command) { var results = []; var maps = config.SubviewMaps; if (maps) { Ext.iterate(maps, function(property) { var action_map = maps[property].action_map; if (Ext.isArray(action_map[parent_command]) && action_map[parent_command].length > 0) { results.push(property); } }); } return results; }, // Returns the action array in its entirety. getActionArray: function() { return config.ActionArray; }, // Returns a bool indicating whether this view has a parent. isSubview: function() { if (!Ext.isEmpty(config.Parent)) return true; return false; }, // Returns the property name that was provided in config. getPropertyName: function() { if (!Ext.isEmpty(config.PropertyName)) return config.PropertyName; return null; }, // Returns the matching parent command for the local command provided or null if none. getParentCommandMapTo: function(local_command) { var pcm = config.ParentCommandMap; if (pcm) { var results = []; Ext.iterate(pcm, function(parent_command) { if (pcm[parent_command].indexOf(local_command) > -1) { results.push(parent_command); } }); return results; } return null; }, // // Actions // // Access to the view's action definition object. getActionDefinition: function(command) { if (config.ActionArray && config.ActionArray[command]) return config.ActionArray[command]; else return null; }, // Access to the unique control identifier. getControlIdentifier: function() { if (_ControlID) return _ControlID; else return null; }, // Registers this control for broadcasting and listening. registerForState: function() { // Register this view as a stateful one if ControlID is existing. if (_ControlID) { Trakkware.StateHash.registerListeningView(_ControlID, this); } }, // Returns the data held in the registered datafields. actionDataProvider: function() { var fields = apply_to._registered_datafields; var data = {}; Ext.each(fields, function(field) { if (!Ext.isEmpty(field.datafield) || !field.isUIMarkerType === true) { var field_value = field.getValue(); if (field.getXType() == 'datepicker' || field.is_date === true) { // Format Date values. field_value = new Date(field_value); } data[field.datafield] = field_value; } }); Ext.each(apply_to._registered_subviews, function(subview) { var list = subview.getValue && subview.getValue(); if (list) { data[subview.datafield] = list; } }); return data; }, // Returns the array of fields registered as datafields. getRegisteredDatafields: function() { return apply_to._registered_datafields; }, removeRegisteredDatafield: function(control) { apply_to._registered_datafields.pop(control); }, getRegisteredSubviews: function() { return apply_to._registered_subviews; }, getTransactionals: function() { return apply_to._registered_transactionals; }, getPreRegisteredSubviews: function() { return apply_to._preregistered_subviews; }, resetTransactionals: function() { apply_to._registered_transactionals = []; }, resetDirtyables: function() { apply_to._registered_dirtyable = []; }, // // Group-related // // Returns the group header tied to the property name supplied. getGroupHeader: function(property_name) { if (config.GroupHeaders && config.GroupHeaders[property_name]) return config.GroupHeaders[property_name]; return null; }, // // Query Modifying controls // // controls should call this function when they change. modifierChanged: function(control) { apply_to.fireEvent('modifierchanged', control); }, // // Subview-related: // // Gets parameter maps for a subview. getSubviewMap: function(property_name) { if (!Ext.isEmpty(property_name) && config.SubviewMap && config.SubviewMap[property_name]) { return config.SubviewMap[property_name]; } return null; }, // // Dirty and Form-related: // // Indicates if this view is considered dirty. isDirty: function(include_subviews) { var result = false; Ext.each(apply_to._registered_dirtyable, function(dirty) { // When include_subviews is false, do not consider trakkware_subview for isDirty. if (include_subviews != false || dirty.getXType() != 'trakkware_subview') { var is_dirty = dirty.isDirty(); if (is_dirty === true) { result = true; return false; } } }); return result; }, // performs the things that need to occur when dirtiness is encountered. // Changes button text // Enables/Disables button performDirtyDuties: function(form, reset) { // alert(form.getViewName() + ' has performDirtyDuties called on it with reset = ' + reset); // Check for required options. if (Trakkware.ViewFramework.requireOption(config, 'onDirtyArray', 'Trakkware.View.performDirtyDuties') == false) return; // Get an array of things that should change when dirty happens. var changes = config.onDirtyArray; var tbar = (form.getTopToolbar ? form.getTopToolbar() : null); var bbar = (form.getBottomToolbar ? form.getBottomToolbar() : null); // Inefficient.. do this a different way in the future for speed gains. Ext.each(changes, function(action) { var property_name = action['property_name']; var changeText = action['changeText']; var enable = action['enable']; //alert(form.getViewName() + ' property = ' + property_name + ' :: This is an iteration of the changes array'); // Holds a button that we are looking for. var button = undefined; // First check the topbar, if there was one. if (tbar) { Ext.each(tbar.findBy(function(thing) { if (thing && thing.PropertyName) return true; }), function(tbar_item) { if (tbar_item.PropertyName == property_name) { button = tbar_item; return false; } }); } // Next check the bottom bar. if (!button && bbar) { Ext.each(bbar.findBy(function(thing) { if (thing && thing.PropertyName) return true; }), function(bbar_item) { if (bbar_item.PropertyName == property_name) { button = bbar_item; return false; } }); } // Lastly, check the form items. if (!button && form.items) { button = Trakkware.ViewFramework.findFieldByPropertyName(form, property_name); } // When a button is found, perform if (button) { if (reset == true) { // very important to set change_back_to something. // When a button is clicked, it uses existence of change_back_to // to indicate whether a confirm-on-dirty should be shown if applcable. var changeback = button.changebackto; if (changeback) button.setText(changeback); if (enable == true) button.disable(); } else { if (!Ext.isEmpty(changeText)) { // Set the button's change-back-to text so the logic above this can know to change text back on reset. var current_text = button.getText(); if (current_text !== changeText) { button.changebackto = current_text; button.setText(changeText); } } if (enable == true) { button.enable(); } } } }); }, // // ACTION PROCESSING including TRANSACTIONS // // Processes actions for buttons, view-links, anything that needs an action to perform. // Expected config options: // ViewName: The view to use for this command. If none is specified then the current view is used. // Command: The command related to this button. // Parameters: A parameters object from the view's config. Needs to have // .Control and .Internal already intact. // Callback: Called when the action handler is complete. A success bool is the only parameter of the callback function. // NoBroadcast: Handle this action without broadcasting it to the world! // DontAdjustParams: (true/false) When true, the parameters provided will not be adjusted by constructActionParameters // Map: A map to apply to view params before using them. // PassControl: (true/false) Indicates this action should pass control to the new view being launched or inlined. // RequiresSelectedRow: (true/false) Override for action.require_row or for viewlinks which have no action associated. actionHandler: function(control, config) { // Several easy-reference vars. var that = this; var current_viewname = this.getViewName(); // Validate options if (Trakkware.ViewFramework.requireOption(config, 'Command', 'Trakkware.View.actionHandler') == false) { if(Ext.isEmpty(config.subview_reload)) { return; } } // If ViewName is not provided, use the current view. if (Ext.isEmpty(config.ViewName)) config.ViewName = this.getViewName(); // Get the action for this button's command var action = null; // Only set action if it is a locally known action for this view. if(config.ViewName == this.getViewName()) action = this.getActionDefinition(config.Command); if (Ext.isEmpty(action) && current_viewname == config.ViewName) { // This would be nice to have, but action is empty for ViewLinks that go to the view currently. //alert(this.getViewName() + ':\r\nTrakkware.View.actionHandler was called with an action that does not exist: ' + Ext.encode(config)); //return; } // If we are passing control in one way or another, set the passing state to true // so that semimodality all works out. if(config.PassControl == true || (action && Ext.isEmpty(action.success_command) == false)) { passing_state = true; } // If this action requires a selected row, check for one. if (config.RequiresSelectedRow == true || (action && action.require_row == true)) { if (this.hasSelectedRow && this.hasSelectedRow() == false) { return; } } // Check if this control is in a transactionally-invoked state. If so, and the button is clicked again, // it means to revoke the transactional behavior that is linked to the button. if (control.revoke_transaction) { // Revoke the transaction held in revoke_transaction. this.removePendingTransaction(control.revoke_transaction); // If there is a form attached and it has a transaction revoke method, use it! if (control.attachedToForm && control.attachedToForm.transactionRevoke) { var behavior = null; if (action) behavior = action.transaction_invoke; // Pass the behavior to the attached form's transaction revoke method so it can put things back to normal. control.attachedToForm.transactionRevoke(behavior, control); delete control.revoke_transaction; } } else { // Test Code: What are the config parameters before being through parameter construction? // alert('pre-built = ' + Ext.encode(config.Parameters)); // Get parameters for the action. var full_parameter_object = {}; if(config.DontAdjustParams !== true) { full_parameter_object = this.constructActionParameters(control.attachedToForm, this.getParameters()); } else { full_parameter_object = config.Parameters; } // When an explicit map is supplied, apply it before doing expected. if(config.Map) { //alert('expected = ' + Ext.encode(action.expected) + '\r\n and the view parameter is ' + Ext.encode(parameter_object.View)); var expected = (action && action.expected) ? action.expected : null; full_parameter_object.View = Trakkware.ViewFramework.applyMapAndExpected(config.Map, expected, full_parameter_object.View); } var parameter_object = { View: {}, Control: {}, Internal: {} }; Ext.apply(parameter_object.Internal, full_parameter_object.Internal); // Test Code: What came back from the construct method? // alert('before pairing down: ' + Ext.encode(full_parameter_object)); // Added new logic to only use expected when it exists and has a length. if (action && config.DontAdjustParams != true) { // Apply expected filter unless instructed otherwise. if(action.ignore_expected !== true) { // Pare down View and Controls parameters using action.expected. Ext.each(action.expected, function(expected_name) { if (Ext.isDefined(full_parameter_object.View[expected_name])) parameter_object.View[expected_name] = full_parameter_object.View[expected_name]; if (Ext.isDefined(full_parameter_object.Control[expected_name])) parameter_object.Control[expected_name] = full_parameter_object.Control[expected_name]; }); } else { // Use it all if ignore_expected is set. parameter_object = full_parameter_object; } if(!Ext.isEmpty(action.dynamic_property) && config.Parameters.View) { // Check for a dynamic command. if(action.dynamic_command !== null) { config.command = action.dynamic_command; } // find properties that are not in the new .View but exist in the sent-in one. Ext.iterate(config.Parameters.View, function(pn) { if(!parameter_object.View[pn]) { parameter_object.View[pn] = config.Parameters.View[pn]; } }); } } else { parameter_object = full_parameter_object; } // Test Code: What are the config parameters after being through parameter construction? // alert(config.Command + ' built = ' + Ext.encode(parameter_object)); // Check if this action launches a different view. // The trigger is if a non-empty view name different from the current view name is provided. // or if action.launch is not set to 'none'. // First check if there is a subview that needs to reload. if(action && !Ext.isEmpty(action.reload_subview)) { that.fireEvent('reloadsubview', action.reload_subview, full_parameter_object); } if (!action || (current_viewname != config.ViewName || (config.launch && config.launch != 'none')) || (action && action.launch && action.launch != 'none')) { // get how we are going to launch this view.. var launch = null; if(config.launch) launch = config.launch; if(Ext.isEmpty(launch) || launch == 'none') launch = (action && action.launch ? action.launch : 'window'); // If there is a performSimpleViewChange function defined for this // call it instead of launchView. This is for layouts that can // perform view state changes without having to reload themselves // such as the map. var skip_launch = false; if (this.performSimpleViewChange) { skip_launch = this.performSimpleViewChange(command, parameter_object.View); } var broadcast_params = Ext.apply({}, parameter_object.View); // Attach a broadcast object. var broadcast_object = { Command: config.Command, RawData: parameter_object.View, ActionDefinition: action, ControlID: _ControlID } // When the simple view change returns true, do not launch a view. if (skip_launch != true) { var windowMgr = apply_to.getWindowMgr(); if(launch == 'window' && windowMgr != null) { var view = Trakkware.ViewFramework.createView({ view: config.ViewName, command: config.Command, viewParams: parameter_object.View, controlParams: parameter_object.Control, internalParams: parameter_object.Internal, callback: function(viewobject) { windowMgr.addView({ view: viewobject, launch: launch, modalParent: that, replace: config.PassControl, parentRefreshView: that }); } }); } else { Trakkware.ViewFramework.launchView({ view: config.ViewName, command: config.Command, Broadcast: broadcast_object, ControlID: _ControlID, viewParams: parameter_object.View, launch: launch, launchingView: this, controlParams: parameter_object.Control, internalParams: parameter_object.Internal, sm: function(final_result) { if (Ext.isFunction(config.Callback)) { config.Callback(final_result); } }, PassControl: config.PassControl, NoBroadcast: config.NoBroadcast }); } } } else { function final_cleanup() { // Unmask.. that.fireEvent('mask', { Activate: false }); } // calculate if the form is dirty var dirty = this.isDirty(); /* // Start a mask.. if (!Ext.isEmpty(action.mask_text)) { this.fireEvent('mask', { Activate: true, ViewName: this.getViewName(), Command: config.Command }); } */ // Perform a normal action and get a transaction back if that was the case. var transaction = this.performAction({ Command: config.Command, Parameters: parameter_object, IsDirty: dirty, ActionDefinition: action, NoBroadcast: config.NoBroadcast, ControlID: _ControlID, failureCallback: final_cleanup, successCallback: final_cleanup }); var transaction_invoke = action ? action.transaction_invoke : null; var special_ten = false; if (action && transaction_invoke == 10) special_ten = true; // define function used in transactioning. function do_invokes(data) { var invoke_parameters = Ext.isDefined(data) ? data : parameter_object.View; if (control.attachedToForm && control.attachedToForm.specialInvoke) { result = control.attachedToForm.specialInvoke(control, config.Command, action.transaction_invoke, invoke_parameters, revoke_text); finish(result); } else if (that.specialInvoke) { // call the special invoke method. If true is returned, do not continue on with this action. result = that.specialInvoke(control, config.Command, action.transaction_invoke, invoke_parameters, revoke_text); finish(result); } else { final_cleanup(); } } function finish(success) { // If result was true, fire dirtiness and do not continue with this action. if (success === true) { that.enableBubble('dirty'); that.fireEvent('dirty', control); } // Figure out the absolute final success of this action and call // the callback with its value. var final_result = true; if (result === false) final_result = false; if (Ext.isFunction(config.Callback)) { config.Callback(final_result); } final_cleanup(); } // Transaction invokes.. if (transaction_invoke && (transaction || special_ten == true)) { var result = false; if (transaction != false || special_ten == true) { // Get revoke info. var revoke_text = action.transactional_revoke; // Attach this transaction to the control unless it is the very special case of // behavior 10. We should improve the localized behavior section. if (action.transaction_invoke != 10) { control.revoke_transaction = transaction; do_invokes(); } else { // When a #10 occurs, make a special call out and then fill the new form with its results. Trakkware.ViewFramework.performMethodCall(that, { view: config.ViewName, JustResults: true, command: config.Command, actionParams: parameter_object.View }, function(used_config, data) { // Get the list from data response. if (data.list) data = data.list; // This data should be in an array since it is a list, so take the first one if so. if (Ext.isArray(data) && data.length > 0) data = data[0]; do_invokes(data); }, final_cleanup); } } else { result = transaction; finish(result); } } } } }, // Fires when a broadcast has occured. // Expected options: // Command: The new command // Data: Additional parameters. broadcastHandler: function(broadcast_config) { if (Trakkware.ViewFramework.requireOption(broadcast_config, 'Command', 'Trakkware.View.broadcastHandler') == false) return; if (Trakkware.ViewFramework.requireOption(broadcast_config, 'Data', 'Trakkware.View.broadcastHandler') == false) return; // When NULL:NULL is broadcast, reset the view parameters to what they were initially. if (broadcast_config.Data.NULL) { config.Parameters.View = Ext.apply({}, config.Parameters.Control); } else { // Set the view parameters to include broadcast params. config.Parameters.View = Ext.apply(config.Parameters.View, broadcast_config.Data); } // Test code to see what is being handled. //alert('in ' + _ControlID + ' and config params are ' + Ext.encode(config.Parameters)); // Signal to stores that modifiers have changed and get a result of whether any were actually changed. var reload = apply_to.fireEvent('broadcastmodifiers', broadcast_config); // Check if the new command differs from this new one. If so, we need to do a performAction. if (broadcast_config.Command != config.Command) { // Get the params to send along. var view_parameters = this.getViewParameters(); // First, check if the view has a simple state changer and use it instead. if (this.performSimpleViewChange) { this.performSimpleViewChange(broadcast_config.Command, this.getViewParameters()); } else { var action_config = { ViewName: this.getViewName(), Command: broadcast_config.Command, Parameters: Ext.apply({}, this.getParameters()), NoBroadcast: true }; // Test code to see what perform action is getting. //alert('Broadcast handler giving this action config to View.actionHandler:\r\n' + Ext.encode(action_config)); // don't fire reload, the action handler should take care of it. reload = false; // Let the action handler deal with what should happen due to hearing this broadcast. // I'm sending {} as control so the actionHandler is happy. this.actionHandler({}, action_config); } } else { // When the commands match, do a refresh on the view. this.fireEvent('reloadview'); } // This only happens if the view layout has defined .reloadForBroadcast if (reload == true) { this.fireEvent('reload'); } }, // Constructs a .Parameters object for actions and view launchings to use. // parameters should be the .Parameters object from a config constructActionParameters: function(form, parameters) { // Start with the Parameters object from config. if (!Ext.isDefined(parameters)) parameters = {}; // Start with an empty object and apply Control and then View parameters. var view_parameters = Ext.apply({}, parameters.Control); Ext.apply(view_parameters, parameters.View); // If there is a form to get data from, get that data and apply it to the view params. if (form) { if (form.getData) { var data = form.getData(); view_parameters = Ext.apply(view_parameters, data); } else if (form.actionDataProvider) { var data = form.actionDataProvider(); view_parameters = Ext.apply(view_parameters, data); } } else if (this.actionDataProvider) { // If no form is available to get data from, try the view's actionDataProvider method. var data = this.actionDataProvider(); view_parameters = Ext.apply(view_parameters, data); } // Set the View property to this new set of params and off we go! parameters.View = view_parameters; return parameters; }, // Performs a view action. Expected config options: // // ViewName: The name of the view that this action applies to. // Command: Indicates the action that should take place. // ChildTransactions: An array of child transactions. Used when a transactional action is taking place. // Parameters: A parameters object with .View set. // IsDirty: true/false indicating whether dirtiness is currently in effect. // NoBroadcast: Indicates not to perform broadcasts during this action. // failureCallback: Function invoked when the action fails. // successCallback: function invoked when the action succeeds performAction: function(config) { var me = this; // Validate incoming options if (Trakkware.ViewFramework.requireOption(config, 'Command', 'Trakkware.View.performAction') == false) return; // Use the action state to fill config. If the method parameter // is true, then send in this view's name as the view. This will // trigger the view action method to occur. If anything is returned, then this was // a transactional action and needs to be passed up or stored. var action = this.getActionDefinition(config.Command); // Check if this is a transactional action. var maps_to_parent_command = me.getParentCommandMapTo(config.Command); // THIS IS WHERE IT IS DECIDED IF AN ACTION IS TRANSACTIONAL! // If an array came back from getParentCommandMapTo AND it has values, then this is a transactional value. var transactional = (Ext.isArray(maps_to_parent_command) && maps_to_parent_command.length > 0); // Indicates this action is a special invoke #10 if transactional. var special_ten = false; if (action.transaction_invoke && action.transaction_invoke == 10) special_ten = true; // Get child transactions that need to go along with this action, but // not when transactional and there is a transactional invoke behavior. var child_transactions = []; var get_children = true; if (transactional == true) { if (action.transaction_invoke) get_children = false; } if (get_children == true) { child_transactions = me.getTransactionsFor(config.Command); } // Capture the is dirty value for JUST this thing, not its children also. // This must be provided to performAction so that the top-level action does not get included // in a transaction just because it has dirty children. var is_dirty = this.isDirty ? this.isDirty(false) : false; var config = { ControlID: _ControlID, command: config.Command, view: (Ext.isDefined(action.method) && action.method == true ? this.getViewName() : null), ActionDefinition: action, IsDirty: is_dirty, IsTransactional: transactional, TransactionParentCommand: maps_to_parent_command, ChildTransactions: child_transactions, TransactionFormID: this.id, NoBroadcast: config.NoBroadcast, actionParams: config.Parameters.View, reloadOnSuccess: action.reloadOnSuccess, cancelOnSuccess: action.cancelOnSuccess, useConfirmation: action.confirm, confirmationMessage: action.confirm_msg, confirmationTitle: action.confirm_title, successMessage: action.success_msg, resetDirtyOnSuccess: action.reset_dirty_on_success, confirmOnDirty: action.confirm_on_dirty, dirtyConfirmationMessage: action.dirty_msg, dirtyConfirmationTitle: action.dirty_title, successCommand: action.success_command, isDirty: config.IsDirty, form: me, failureCallback: config.failureCallback, successCallback: config.successCallback, ViewObject: me }; // Perform this action and try to receive a transaction back. var transaction = Trakkware.ViewFramework.performAction(config, me); // When a transaction is returned, add it to the pending list. if (transaction) { // The special case of a number ten should not add pending transactions. // There should be an action on the newly added form that is mapped to the parent's save if (special_ten != true) { this.addPendingTransaction(transaction); return transaction; } } else if (transactional == true) { // When this action was transactional but did not produce a transaction, we still // need to alert the caller that they should continue. return true; } // No further processing is required, return false. return false; }, // // Transactions // // Adds a transaction to this view's list of pendings. addPendingTransaction: function(transaction) { if (transaction) { var t = Ext.apply({}, transaction) apply_to._pending_transactions.push(t); } }, // Removes the transaction from the list of pendings. removePendingTransaction: function(transaction) { if (transaction) apply_to._pending_transactions.pop(transaction); }, // Returns the list of pending transactions for this view. getAllPendingTransactions: function() { // Retrieve pending transactions for this view and all of its subviews. return apply_to._pending_transactions; }, // Gets the transactions for this view and its subviews for the command provided. // Its not perfect, but if get_local = true, then transactions are merely gathered for this // view for the command specified by parent_command. getTransactionsFor: function(parent_command, get_local) { var that = this; //alert('getting transactions for ' + that.getViewName() + '\r\nreg trans: ' + apply_to._registered_transactionals.length + ' and pending trans: ' + _pending_transactions.length); // Our final results array. var results = []; // First get the pending transactions in this view that match. Ext.each(apply_to._pending_transactions, function(transaction) { // Include pending transactions if their parent command matches or if // get_local is set to true since getting transactions for this view should // always include any pendings. if (transaction.ParentCommand == parent_command || get_local === true) { results.push(transaction); } }); // Next test registered hidden actions. These will be things such as Save button that are per-row in a formlist. Ext.each(apply_to._registered_transactionals, function(hidden) { var command = hidden.Command; // reget the control so we can check its revoke transaction. var control = hidden.Control; // Get the array of parent commands that are mapped to this button. var parent_command_array = hidden.ParentCommand; // Need to see if any of the forms buttons are in revoke.. var in_revoke = control.attachedToForm.InRevoke(); // The hidden's parent command must match the current parent command. // or get local is true and the parent command matches this hidden's command. if ((get_local == true && parent_command == command) || (in_revoke != true && parent_command_array.indexOf(parent_command) > -1)) { // Get the action for this command. var action = that.getActionDefinition(command); if (action) { // If it is only to be added when dirty, check if dirty. if (action.transactional_only_on_dirty == true) { if (control.attachedToForm && control.attachedToForm.isDirty) { // Look for dirty. When it is false, return. This causes the Ext.each to move to the next registered hidden control var dirty = control.attachedToForm.isDirty(); if (dirty == false) return; } } // Try to derive view params for this action. var data = {}; if (control.attachedToForm && control.attachedToForm.getData) { data = control.attachedToForm.getData(); } // Setup parameters for this action. var parameters = Ext.apply(that.getViewParameters(), data); // Cause the action to return a transaction. var transaction = { view: that.getViewName(), command: command, data: parameters, ParentCommand: parent_command, control_id: control.attachedToForm.id } results.push(transaction); } } }); // Get subviews that are mapped to this parent command. var mapped = this.getSubviewMapsForCommand(parent_command); // Try to get child transactions if there are mappings for this command. if (Ext.isArray(mapped) && mapped.length > 0) { // Check each subview that has been registered. Ext.each(apply_to._registered_subviews, function(subview) { // If the subview's property name (datafield) exists in the mapped array, then get its transactions. var index = mapped.indexOf(subview.datafield); if (index > -1) { // Get pending transactions from the subview for this command and add them to the child_transactions array. var pending_subview_transactions = subview.getTransactionsFor(parent_command); if (Ext.isArray(pending_subview_transactions)) { Ext.each(pending_subview_transactions, function(t) { results.push(t); }); } } }); } return results; }, // Method that is provided to subviews for them to call when a transactional action is invoked or revoked. listenForSubviewTransaction: function(how, transaction) { if (how == 'add') { // Add the transaction to the pendings list. If this is a subview, this call // will cause the transaction to be passed up to a parent, if applicable. addPendingTransaction(transaction); } else if (how == 'revoke') { // revoke the transaction provided. revokeTransaction(transaction); } }, // Called by the StateHash when an other control broadcasts data. // Expected config options: // Command: The command that was broadcast. // Data: Data broadcast. Listen: function(config) { var action_array = this.getActionArray(); var me = this; // Validate incoming options. if (Trakkware.ViewFramework.requireOption(config, 'Command', 'Trakkware.View.Listen') == false) return; if (Trakkware.ViewFramework.requireOption(config, 'Data', 'Trakkware.View.Listen') == false) return; // Ease of use vars. var broadcast_params = config.Data; var command = config.Command; // Ensure we always have something to work on. if (!Ext.isDefined(broadcast_params)) broadcast_params = {}; // Holds the action states that can possibly be triggered by this broadcast. var possible_states = {}; // Get filters that are listening. var filters = me.getListeningModifierNames ? me.getListeningModifierNames() : []; // If the empty token is being broadcast and something is listening for that, use it. if (broadcast_params && broadcast_params['NULL'] == 'NULL') { // When empty is broadcast and heard, ignore everything else. Ext.iterate(action_array, function(action_name, action_value) { var listenfor = action_value.listenfor; if (listenfor) { if (listenfor['NULL']) { possible_states[action_name] = action_value; return false; } } }); } else { // Check each broadcast_param and see if it should trigger based on the data Ext.iterate(broadcast_params, function(broadcast_name, broadcast_value) { // if an action's listen_for has a matching parameter, look into it. // ALL parameters for the action's listen_for must be fulfilled in order to invoke it. Ext.iterate(action_array, function(action_name, action_value) { var listenfor = action_value.listenfor; if (listenfor) { if (listenfor) { if (listenfor[broadcast_name]) { possible_states[action_name] = action_value; } } else { // Check if any filters are listening for this broadcast name. if (filters && filters[broadcast_name]) { possible_states[action_name] = action_value; } } } }); }); } //for(var v in possible_states) alert(ControlID + ' has a possible state change to ' + v); // Iterate each state and try to fill it. If it successfully filled, put it into final_candidates. var final_candidate = null; var final_command = null; var high_score = 0; Ext.iterate(possible_states, function(state_name, state) { // Attempt to fill each listenfor. If the fill is successful, make note // of the state's param count. The highest one will be invoked. var listenfor = state.listenfor; var candidate = {}; var add = true; var count = 0; if (listenfor['NULL'] == 'NULL' && broadcast_params['NULL'] == 'NULL') { count++; candidate['NULL'] = 'NULL'; } else { Ext.iterate(listenfor, function(name, value) { // MAPPING: broadcast value is mapped to a listenfor name. //alert(ControlID + ' trying to listen for parameter ' + name + ' and found the value ' + broadcast_params[name]); if (Ext.isDefined(broadcast_params[name])) { count++; candidate[value] = broadcast_params[name]; } else { add = false; return false; } }); } Ext.each(filters, function(name) { // MAPPING: broadcast value is mapped to a listening_filter name. //alert(ControlID + ' trying to listen for filter ' + name + ' and found the value ' + broadcast_params[name]); if (Ext.isDefined(broadcast_params[name])) { count++; candidate[name] = broadcast_params[name]; } }); if (add == true && count > high_score) { final_candidate = {}; for (var value in candidate) final_candidate[value] = candidate[value]; final_command = state_name; high_score = count; //for(var fc in final_candidate) alert(ControlID + ' new final candidate has ' + fc + ' = ' + final_candidate[fc]); } }); //for(var fc in final_candidate) alert(ControlID + ' has a final candidate with ' + fc + ' = ' + final_candidate[fc]); //alert(_ControlID + ': Final candidate is ' + Ext.encode(final_candidate) + ' and final command is ' + final_command); // If something was found, invoke it! if (final_candidate != null && final_command != null) { Trakkware.StateHash.applyExistingState(_ControlID, final_command, final_candidate); // signal to this view that a broadcast state change has occured. this.broadcastHandler({ Command: final_command, Data: final_candidate }); } }, // // Confirmation wrappers // // Performs a confirmation using the configuration msg and title. // The handler function is called with the result of the confirmation. // config = { title: '', msg: '', handler: function(result) {} // Since we are using Ext.Msg.confirm, you must keep in mind: // THIS METHOD IS NON-BLOCKING!!!! confirm: function(config) { if (config) { var title = config.title ? config.title : ''; var msg = config.msg ? config.msg : ''; var handler = config.handler; if (title && msg && handler) { Ext.Msg.confirm(title, msg, handler); } } }, // // Titling // // Takes a title, which is an XTemplate template string, and applys data to it and sets this's title applyTitle: function(title, data) { if (this.setTitle) { var text = Trakkware.ViewFramework.applyTemplate(title, data); this.setTitle(text); } }, getPassingState: function() { return passing_state; }, setPassingState: function(value) { passing_state = value; }, getWindowMgr: function() { return apply_to._window_mgr; }, setWindowMgr: function(mgr) { apply_to._window_mgr = mgr; }, // // Toolbars // // Takes a toolbar config object and turns it into a query modifiers toolbar. constructToolbar: function(toolbar_config) { if (toolbar_config) { var toolbar = []; Ext.each(toolbar_config, function(option) { if(option.xtype != 'trakkware_button') { // Get view name from the config supplied way up above. option.ViewName = apply_to.getViewName(); option.rm = apply_to.registerQueryModifier; option.mc = apply_to.modifierChanged; option.gm = apply_to.getQueryModifiers; } toolbar.push(option); }); return toolbar; } return null; }, whatAmI: function() { return config.ViewName + '\r\n' + config.Command; } }); return apply_to; }; Ext.ns('Trakkware', 'Trakkware.View'); // config options: // ViewName: The view the store will use to get data. // Command: The command used to get data. // Parameters: The base parameters this store will use when loading, along with the query modifiers // gathered from its registered modifiers. // UseFullViewRefresh: (true/false) When true, a refresh of this store causing the entire view to be reloaded // instead of just reloading the data. Had to put this in because of dynamic fields. // The reload will fire the 'fullreload' event on StoreOwner if it is set. // StoreOwner: The view that owns this store. // NOTE: Parameters.View is used as the store's base parameters. // ModifierConfirmation: // Config object that indicates how to handly dirty forms when query modifiers change. // See ExtViewBuilder.getViewJavascript for definition. // ds: A datastore definition object. // qm: A query modifier object to use during first load. // ib: An initial broadcast state object that will be checked for initial modifier values. // Fires: // title(data): The data parameter is record.data from the first row returned. // Listens For: // registermodifier({ // control, // type, // getValue }): registers a modifier as something to gather when the store reloads. // modifierchanged(control): The store reloads when it hears a modifier change. Trakkware.View.Store = Ext.extend(Ext.data.Store, { constructor: function(config) { this.addEvents('registermodifier', 'modifierchanged', 'mask', 'broadcastmodifiers', 'emptydataset'); // Validate required options. Trakkware.ViewFramework.requireOption(config, 'ViewName', 'Trakkware.View.Store.constructor'); var me = this; this.my_id = Ext.id(); // region: Query Modifier // Query modifiers registered with this store, and a way to get them. var _registered_modifiers = []; this.getRegisteredModifiers = function() { return _registered_modifiers; } this.pushModifier = function(modifier) { _registered_modifiers.push(modifier); } // Returns a list of query modifiers that have a PropertyName. Those are the ones listening for broadcasts. this.getListeningModifierNames = function() { var array = []; Ext.each(_registered_modifiers, function(modifier) { if (modifier.PropertyName) array.push(modifier.PropertyName); }); return array; } // Method invoked when the registermodifier event occurs. // config options: // control: The actual control. // type: 'groupby', 'sort', 'filter', search', 'pager' // getValue: A function that takes the control and returns its value. If nothing is supplied // then control.getValue() is called function registerQueryModifier(modifier_config) { // Validate require options. if (Trakkware.ViewFramework.requireOption(modifier_config, 'control', 'Trakkware.View.Store.registerQueryModifier') == false) return; if (Trakkware.ViewFramework.requireOption(modifier_config, 'type', 'Trakkware.View.Store.registerQueryModifier') == false) return; if (Trakkware.ViewFramework.requireOption(modifier_config, 'getValue', 'Trakkware.View.Store.registerQueryModifier') == false) return; // When registering a modifier, add a listener so we can hear when it changes. var control = modifier_config.control; var confirm = config.ModifierConfirmation; control.on('modifierchanged', function(control) { //When the store's owner is dirty, check if we should do a confirmation before continuing with the modifierchanged event. if (config.StoreOwner.isDirty && config.StoreOwner.isDirty() == true) { var command = confirm.Command; if (!Ext.isEmpty(command)) { // Confirm this modifier change. Ext.Msg.confirm(confirm.Title, confirm.Message, function(result) { if (result == 'yes') { me.fireEvent('performactionondirties', { ViewName: config.ViewName, Command: command, Callback: function(success) { reload_the_store(); } }); } }); } } else { reload_the_store(); } // reload the store.. function reload_the_store() { me.load() } }); // Check if this modifier should have its value set from initial state params. if (config.ib && modifier_config.PropertyName) { var paramobject = config.ib.paramobject; if (paramobject) { if (paramobject[modifier_config.PropertyName] && control.changeForModifier) control.changeForModifier(paramobject[modifier_config.PropertyName]); } } me.pushModifier(modifier_config); } // Return the current group being used. this.getCurrentGroup = function() { var result = null; Ext.each(_registered_modifiers, function(modifier) { if (modifier.type == 'groupby') { result = modifier.getValue(); return false; } }); return result; } // Returns the query modifier object ready to be encoded. this.getQueryModifierObject = function() { var result = {}; Ext.each(this.getRegisteredModifiers(), function(qm) { var modifiers = qm.getValue(); if (modifiers != null) { if (qm.type == 'filter') { if (!result.filter) result.filter = []; result.filter.push(modifiers); } else { Ext.apply(result, modifiers); } } }); return result; } // If initial modifiers are supplied, try to stuff a sort into sort info. if (config.qm) { if (config.qm.sort) { config.sortInfo = { field: config.qm.sort, direction: config.qm.dir }; } } var first_load = true; var my_base_params = null; config = Ext.apply({ remoteSort: true, proxy: new Ext.data.HttpProxy({ method: 'POST', url: Trakkware.Handlers.MethodHandler, listeners: { exception: function(proxy, type, action, options, response, arg) { response = Ext.decode(response.responseText); if (response && response.result) { if (response.result == '0') { Ext.Msg.alert('Data loading error', 'Unable to load or change pages because: ' + response.msg); } else if (response.result == '1') { Ext.Msg.alert('A data reader error has occured, sorry but I cannot display your data because of it.'); } } me.fireEvent('mask', { Activate: false }); }, // Before reloading data, modifiers must be checked for values and included. beforeload: function(store, options) { if(first_load !== true && config.UseFullViewRefresh === true) { config.StoreOwner.fireEvent('fullreload'); return false; } // TESTING // alert('Options before meddling: ' + Ext.encode(options)); // allow controls using this store to mask themselves. me.fireEvent('mask', { Activate: true, ViewName: config.ViewName, Command: config.Command }); // Paramarray is the store owner's view parameters. var p = {}; p.paramarray = Ext.encode((config.StoreOwner && config.StoreOwner.getViewParameters ? config.StoreOwner.getViewParameters() : {})); // Apply initial query modifiers on first load if they exist. if (first_load == true) { // Turn off first-load. first_load = false; // Apply initial query modifiers if they were passed in. if (config.qm) { Ext.apply(p, config.qm); } // Apply initial broadcast as paramarray they were passed in. if (config.ib) { // This is where initial state params are added in to the first call. Ext.apply(options.paramarray, config.ib.paramobject); } } else { // Not first time thru. Get the query modifier object and apply it to p. var query_modifiers = me.getQueryModifierObject(); // We need to encode filters.. if (query_modifiers.filter) { query_modifiers.filter = Ext.encode(query_modifiers.filter); } // Get the current start/limit since the one in query_modifiers will be wrong. var real_start = options['start']; var real_limit = options['limit']; Ext.apply(p, query_modifiers); if (Ext.isDefined(real_start)) p['start'] = real_start; if (Ext.isDefined(real_limit)) p['limit'] = real_limit; } // Apply reload params if found. if(Ext.isDefined(me.reload_params)) { p.paramarray = Ext.encode(me.reload_params.View); } // Apply p to the options. options = Ext.apply(options, p); // TESTING: // alert('the beforeload options are ' + Ext.encode(options)); // Trakkware.ViewFramework.log(Ext.encode(options)); } } }), baseParams: { view: config.ViewName, command: config.Command, paramarray: Ext.encode(config.Parameters.View), viewparam: Ext.encode(config.Parameters.Internal) }, reader: new Ext.data.JsonReader({ root: 'list', successProperty: 'success', totalProperty: 'count', fields: config.ds }), listeners: { broadcastmodifiers: function(broadcast_config) { // TEST CODE: What was broadcast to the modifiers? // alert('heard broadcast modifiers in store.' + Ext.encode(broadcast_config)); var data = broadcast_config.Data; // Check for modifiers that need to change. var result = false; Ext.each(me.getRegisteredModifiers(), function(modifier) { // We only care about modifiers that have a property name assigned to them. if (!Ext.isEmpty(modifier.PropertyName)) { // If the broadcast params have a matching propertyname, change this modifier! if (data[modifier.PropertyName] && modifier.control.changeForModifier) { result = true; modifier.control.changeForModifier(data[modifier.PropertyName]); } } }); if (result == true) { this.load(); } }, registermodifier: function(modifier_config) { registerQueryModifier(modifier_config); }, load: function(store, data, options) { // When loading is complete, unmask! me.fireEvent('mask', { Activate: false, ViewName: config.ViewName, Command: config.Command }); // When an empty data set is loaded, fire an event to let the owning view know this fact. if (!data || data.length == 0) { this.fireEvent('emptydataset'); } } } }, config); Trakkware.View.Store.superclass.constructor.call(this, config); } }); Ext.ns('Trakkware', 'Trakkware.View'); // // BUTTON // // Expected config options: // ViewName: The viewname related to this button. Used only for ViewLinks. // Command: The command for the action that this button triggers. // Template: A template to use for the link/button's text. // ShowAsHyperlink: Indicates this button should display itself as a hyperlink, not a button. // ParentCommandMap: A map from a parent view that maps to this button's action. Used to know whether this button // should hide itself. // RenderAsSubview: Indicates the view is being rendered as a subview. // HideIfSubview: Indicates whether to hide this button if it is being rendered as a subview. // HideIfParentCommandIsMappedTo: Indicates that this button should hide if its parent view has a command mapped to it. // OnlyShowOnMouseover: Indicates this button should hide until a mouseover occurs. // AccessKeyAlt: The alt key to map to this button. // AccessKeyCode: A keycode that will trigger this button. // DynamicViewNameProperty: Property name of the property to use to get ViewName when launching a view from this action. // RequiresRow: Override to indicate this button requires a selected row or item in order to perform its action. // Map: An explicit map that will be applied to parameters before they are used. // text: Button text (from Ext.Button) // PassControl: (true/false) Indicates if this action causes the current view to cancel and its control objects passed on to the new view. Trakkware.View.ActionButton = Ext.extend(Ext.Button, { initComponent: function() { Trakkware.View.ActionButton.superclass.initComponent.call(this); this.addEvents('actionhandler', 'cancelview', 'registertransactional', 'reactdirty', 'resetdirty', 'registerdatafield'); this.enableBubble('actionhandler', 'cancelview', 'registertransactional', 'registerdatafield'); }, constructor: function(config) { // An easy reference var. var this_button = this; // Validate incoming. var method_name = 'ActionButton constructor'; Trakkware.ViewFramework.requireOption(config, 'Command', method_name); var dynamic_view_name = null; function click_action() { // Fire the action handler event when this button is clicked. this_button.fireEvent('actionhandler', this_button, { ViewName: dynamic_view_name || config.ViewName, Command: config.Command, launch: config.launch, Map: config.Map, PassControl: config.PassControl, RequiresSelectedRow: config.RequiresRow, Callback : function() { } }); } // apply additional button-related properties. config = Ext.apply(config, { getValue: function() { }, setValue: function(data) { // Check for a dynamic viewlink property. if(config.DynamicViewNameProperty !== null && data[config.DynamicViewNameProperty]) { dynamic_view_name = config.DynamicViewNameProperty; } // Check for show-on calculations. if(config.ShowOn != null) { var showon = Trakkware.ViewFramework.ProcessShowOn(config.ShowOn, data); if(showon == 'hide') this.hide(); } // If a template exists, use the data and template to replace this button's text. if (!Ext.isEmpty(config.Template)) { var text = Trakkware.ViewFramework.applyTemplate(config.Template, data); this_button.setText(text); } }, handler: function(button) { click_action(button); }, // A button is dirty if it has a transaction attached to it. isDirty: function() { if (this_button.revoke_transaction) return true; return false; }, listeners: { afterrender: function(button) { if(button.datafield) button.fireEvent('registerdatafield', button); }, beforerender: function(button) { var hide_after_render = false; if (config.RenderAsSubview == true) { if (config.HideIfSubview == true) { hide_after_render = true; } if (config.HideIfParentCommandIsMappedTo == true) { if (config.ParentCommandMap) { var this_buttons_command = config.Command; var pcm = config.ParentCommandMap; // Make an array of the parent commands that will trigger this button so that // we can quickly check the button against a parent command over in Trakkware.View.getTransactionsFor() var parent_commands = []; Ext.iterate(pcm, function(parent_command_name) { if (pcm[parent_command_name].indexOf(this_buttons_command) > -1) { parent_commands.push(parent_command_name); } }); if (parent_commands.length > 0) { hide_after_render = true; //alert(this_buttons_command + ' pcm = ' + Ext.encode(pcm) + ' parent commands = ' + Ext.encode(parent_commands)); // Fire the registertransactional event when this is a hidden, mapped button. button.fireEvent('registertransactional', this_buttons_command, parent_commands, button); } } } } if (config.OnlyShowOnMouseover == true) { button.on('afterrender', function(b) { b.getEl().fadeOut(); }); button.attachedToForm.getEl().on('mouseover', function() { button.getEl().show(); }); button.attachedToForm.getEl().on('mouseout', function() { button.getEl().hide(); }); } if (hide_after_render == true) { button.hide(); button.on('afterrender', function(the_button) { // If this button is in a formpanel, try to hide the entire formitem. var el = button.getEl(); var formitem = el.findParent('.x-form-item'); var formelement = el.findParent('.x-form-element'); if (formitem) { var fly = Ext.fly(formitem); fly.setHeight(0); fly.setStyle({ margin: 0, padding: 0 }); } }); } if (!Ext.isEmpty(config.AccessKeyAlt)) { /* temporarily turn off access keys. Trakkware.ViewFramework.keyMap.accessKey({ key: config.AccessKeyAlt, alt: true }, click_action, button); */ } //if(config.AccessKeyCode) { // var map = Ext.getBody().addKeyListener(Ext.EventObject.ENTER, function(e, target) { click_action();}); // map.stopEvent = true; //} } } }); Trakkware.View.ActionButton.superclass.constructor.call(this, config); } }); Ext.reg('trakkware_button', Trakkware.View.ActionButton); // // TREE PANEL // Trakkware.View.TreePanel = Ext.extend(Ext.tree.TreePanel, { initComponent: function(config) { // Call the superclass init first. Trakkware.View.TreePanel.superclass.initComponent.call(this, config); // Setup events this.addEvents('actionhandler', 'registertransactional', 'reactdirty', 'resetdirty', 'registerdatafield', 'registersemimodalwindow'); this.enableBubble('actionhandler', 'registertransactional', 'registerdatafield', 'registersemimodalwindow'); }, constructor: function(config) { var me = this; config.root = new Ext.tree.AsyncTreeNode({ expanded: false, children: [] }); function setKids(parent_node, data_list) { if(parent_node.hasChildNodes() == true) { Ext.each(parent_node.childNodes, function(child) { // only do this once. if(!child.data) { Ext.each(data_list, function(data) { if(data.id == child.id) { if(data.viewparams) data.viewparams = Ext.decode(data.viewparams); child.data = data; setKids(child, data.children); return false; } }); } }); } } Ext.apply(config, { border: false, rootVisible: false, autoScroll: true, containerScroll: true, loader: new Ext.tree.TreeLoader({ preloadChildren: true, baseAttrs: { singleClickExpand: true }, dataUrl: Trakkware.Handlers.MethodHandler, listeners: { beforeload: function(loader, node) { var viewparams = {}; if(node.data && node.data.viewparams) viewparams = node.data.viewparams; var parameters = Ext.apply(viewparams, { id: node.id }); if(node.data && node.data.pos) Ext.apply(parameters, { pos: node.data.pos }); loader.baseParams.command = config.loadercommand; loader.baseParams.view = config.loaderview; loader.baseParams.paramarray = Ext.encode(parameters); }, load: function(loader, node, response) { var list = Ext.decode(response.responseText); setKids(node, list); } } }) }); Trakkware.View.TreePanel.superclass.constructor.call(this, config); this.setValue = function(data) { var root = new Ext.tree.AsyncTreeNode({ expanded: false }); root.id = data; me.setRootNode(root); root.expand(); } this.getValue = function() {} this.isDirty = function() { return false; } // Refresh the tree. this.refreshTree = function() { var selected = me.getSelectionModel().getSelectedNode(); if(selected) { var data = selected.data; var parent = selected.parentNode; if(parent) { } } } this.on('dblclick', function(node, e) { var data = node.data; if(!Ext.isEmpty(data.view) && !Ext.isEmpty(data.command)) { var owner = me.ownerCt; var windowMgr = owner.getWindowMgr(); if(windowMgr != null) { var view = Trakkware.ViewFramework.createView({ view: data.view, command: data.command, viewParams: data.viewparams, callback: function(viewobject) { windowMgr.addView({ view: viewobject, launch: 'window', modalParent: me.ownerCt, replace: config.PassControl, parentRefreshView: me.ownerCt }); } }); } else { Trakkware.ViewFramework.launchView({ view: data.view, command: data.command, launch: 'window', viewParams: data.viewparams, launchingView: me.ownerCt // i don't trust this, could cause issues. }); } } }); this.on('expandnode', function(node) { // The node was loaded but its data not set if there is no .data property. if(node.data && node.hasChildNodes() == true) { setKids(node, node.data.children); } }); } }); Ext.reg('trakkware_tree', Trakkware.View.TreePanel); // // SUBVIEW // // Expected config options: // // ViewName: Name of the view for this subview. // Command: The command that this subview will start in. // Parameters: The parameters object. Specifically, Parameters.View // PropertyName: The propertyname of the field that represents this subview. Used to reference the subview map. // AsData: When true, this subview will return its data to the parent. // SubviewMaps The subview maps array. // lpt: Method that is passed on as the listen-for-subview-transaction method when creating this subview. // CaptureSubviewDirty: Indicates this subview should pass its dirties up to the calling view. // height: Height of the subview in pixels. Trakkware.View.Subview = Ext.extend(Ext.Panel, { initComponent: function(config) { // Call the superclass init first. Trakkware.View.Subview.superclass.initComponent.call(this, config); // Setup events this.addEvents('registersubview', 'preregistersubview', 'dirty', 'resetdirty', 'validations', 'deferredrendersubview', 'reloadsubview', 'registersemimodalwindow', 'semimodal'); this.enableBubble('registersubview', 'preregistersubview', 'dirty', 'registersemimodalwindow', 'semimodal'); }, constructor: function(config) { // Check for required options. var method_name = 'Subview constructor'; Trakkware.ViewFramework.requireOption(config, 'ViewName', method_name); Trakkware.ViewFramework.requireOption(config, 'Command', method_name); Trakkware.ViewFramework.requireOption(config, 'SubviewMaps', method_name); // A nice reference to this form. var the_form = this; // Holds a reference to the view object is contained in this subview. var internal_view_object = null; // Need this to exist to get the subview registered. The actual method will be implemented after view is created. this.isDirty = function() { } // Used to indicate the subview has already been constructed. var already_constructed = false; function constructSubview(data, is_deferred_tab) { if(already_constructed === true) return; already_constructed = true; var subview_map = config.SubviewMaps[config.PropertyName]; if (!Ext.isDefined(subview_map)) subview_map = { parameter_map: null, action_map: null }; var view_parameters = Ext.apply({}, config.Parameters.View); view_parameters = Ext.apply(view_parameters, data); var internal_parameters = Ext.apply({}, config.Parameters.Internal); internal_parameters = Ext.apply(internal_parameters, data); var control_parameters = Ext.apply({}, config.Parameters.Control); var view = Trakkware.ViewFramework.createView({ view: config.ViewName, command: config.Command, viewParams: view_parameters, controlParams: control_parameters, internalParams: internal_parameters, isSubview: true, map: subview_map.parameter_map, actionMap: subview_map.action_map, ControlID: config.ControlID, SubviewSizing: config.SubviewSizing, callback: function(view_object) { if (view_object) { // Important to have this datafield set. view_object.datafield = config.PropertyName; the_form.view_object = view_object view_object.setWindowMgr(_window_mgr); // Pass validations down to the view object. the_form.on('validations', function(validations) { view_object.fireEvent('validations', validations); }); // Register this subview with its parent. the_form.fireEvent('registersubview', view_object); // Set the internal reference for getTransactions. internal_view_object = view_object; // Add the subview to its owner differently for tabs. var ownerCt = the_form.findParentByType('tabpanel'); if (ownerCt) { var ii = 0; ownerCt.items.each(function(item) { if(item === the_form.ownerCt) return false; ii++; }); var item = ownerCt.insert(ii, view_object); ownerCt.remove(the_form.ownerCt); if(is_deferred_tab === true) ownerCt.activate(item); if(item.setTitle) item.setTitle(config.title || ''); } else { // Non-tab parents: ownerCt = the_form.ownerCt; if(ownerCt) { // Get the index of the_form so we can replace it with the view. var ii = 0; var found = false; ownerCt.items.each(function(item) { if (item == the_form) { found = true; return false; } ii++; }); if (found === true) { ownerCt.insert(ii, view_object); ownerCt.remove(the_form); } else { ownerCt.add(view_object); ownerCt.remove(the_form); } ownerCt.doLayout(); } } // Set a title to what the parent provided if it WAS provided. if(config.title !== null) { view_object.applyTitle(config.title, {}); } // Arrange .isDirty passing. the_form.isDirty = function() { return view_object.isDirty(); } view_object.getValue = function() { // When this subview has been indicated as data, return its data. if (config.AsData === true) { return view_object.actionDataProvider(); } } } } }); } // Apply additional panel-related options config = Ext.apply(config, { items: [], unstyled: true, hideBorders: true, getValue: function() { }, autoScroll: true, datafield: config.PropertyName, layout: 'fit', hide: true, closable: false, setValue: function(data) { // Check for show-hide-on before constructing. if(config.ShowOn != null) { var showhide = Trakkware.ViewFramework.ProcessShowOn(config.ShowOn, data); if(showhide === 'hide') // When hide comes back, don't bother constructing the view. return; } constructSubview(data); }, // Gets the transactions for this subview that correspond to the parent command provided. getTransactionsFor: function(parent_command) { return internal_view_object.getTransactionsFor(parent_command); } }); //delete config.height; //delete config.autoHeight; //delete config.width; Trakkware.View.Subview.superclass.constructor.call(this, config); // Register this subview with its parent. the_form.fireEvent('preregistersubview', the_form); this.on('resetdirty', function(form, down) { view_object.fireEvent('resetdirty', form); }); this.on('deferredrendersubview', function(control) { // Only call construct if deferred_data is set. If it is not defined, it means the subview has not been through the proper // processing to the constructed. if(Ext.isDefined(the_form.deferred_data)) { constructSubview(the_form.deferred_data, true); } }); this.on('reloadsubview', function(data) { internal_view_object.fireEvent('reload', data); }); _window_mgr = null; this.setWindowMgr = function(mgr) { _window_mgr = mgr; } } }); Ext.reg('trakkware_subview', Trakkware.View.Subview); // Used to house templates in form panels. Trakkware.View.TemplateField = Ext.extend(Ext.Panel, { // Expected config options: // // template: The template text to use. // text: Label text for this field. Leave blank to hide. // sv: An additional method that overriders can provide that will be invoked // when setValue is called on this TemplateField. constructor: function(config) { // Validate incoming. //if (Trakkware.ViewFramework.requireOption(config, 'template', 'Trakkware.View.TemplateField.constructor') == false) return; // Convenience reference. var panel = this; // Apply additional container properties then call the superclass constructor. config = Ext.apply(config, { unstyled: true, fieldLabel: config.text, autoHeight: true, hideBorders: true, setValue: function(value, component) { function render() { // need the panel's parent component. var owner = panel.ownerCt; // Render the field's template. var html = ''; try { var template = config.useData === true ? value[component.datafield] : config.template; //alert('templating with:\r\n' + template); if(value.json) value = Ext.apply(value, value.json); var xt = new Ext.XTemplate(template); xt.overwrite(panel.getEl(), value); delete xt; } catch (ex) { alert(ex + 'A bad template was supplied to XTemplate: ' + template); } // IE is freakin nuts.. With out this crazy mask/unmask, Internet Explorer // will put a bunch of space around the overwritten el from above.. if (Ext.isIE == true) { panel.getEl().mask(''); var t = function(c) { panel.getEl().unmask(); }; t.defer(10); } // After templating, do apply-tos. Ext.select('.x-trakkware-auto-collapse').each(function(div) { var title = div.getAttribute('title'); var parent = div.findParent('.x-trakkware-render-to'); var panel = new Ext.Panel({ collapsible: true, collapsed: false, contentEl: div, applyTo: parent, autoHeight: true, title: title, hidden: true, listeners: { afterrender: function(control) { control.show(true); } } }); }); // If a setValue callback is in place, call it with the data provided to setValue. if (config.sv) config.sv(component, value); } if (panel.rendered == true) { render(); } else { panel.on('afterrender', function(cmp) { render(); }); } }, getValue: function() { }, isDirty: function() { return false; } }); Trakkware.View.TemplateField.superclass.constructor.call(this, config); } }); Ext.reg('trakkware_template', Trakkware.View.TemplateField); // // POPUP FIELD // // Expected config options: // PopupTemplate: Template used to populate the popup field. // LinkTemplate: Template used to fill the link template. // PopupStyle: 'onmouseover', 'onclick' // PopupCloseStyle: 'outsideclick', 'anyclick', 'closebutton', 'windowclosexonly' // PopupModal: (true/false) Indicates the popup will be shown modal or not. // PopupStyled: (true/false) Indicates whether to show this popup window as styled or plain. Trakkware.View.PopupField = Ext.extend(Trakkware.View.TemplateField, { constructor: function(config) { // Set a default value if (!config.PopupStyle) config.PopupStyle = 'onclick'; if (!config.PopupCloseStyle) config.PopupCloseStyle = 'anyclick'; // Store the popup window out here so it doesn't get recreated on reloads. var popup_window = null; var styled = config.Styled || true; // Adjust config before sending it on to the TemplateField constructor. config = Ext.apply(config, { text: null, template: config.LinkTemplate, sv: function(panel, data) { var content = Trakkware.ViewFramework.applyTemplate(config.PopupTemplate, data); // Delete old popup window and create a new one. if(popup_window !== null) Ext.destroy(popup_window); popup_window = new Ext.Window({ html: content, closeAction: 'hide', y: panel.getEl().getTop() + config.TopOffset, x: panel.getEl().getLeft() + config.LeftOffset, modal: (config.PopupModal || false), unstyled: !styled, hideBorders: !styled, header: styled, shadow: false, closable: styled, draggable: true, resizable: false, cls: (config.cls || '') }); function finish(rendered_panel) { var el = rendered_panel.el; el.setStyle({ cursor: 'pointer' }); // holds state of mouse over the popup and target el. var over = false; var trigger = 'click'; if (config.PopupStyle) { if (config.PopupStyle == 'onmouseover') trigger = 'mouseover'; else if (config.PopupStyle == 'onclick') trigger = 'click'; } el.on(trigger, function(e, clicked_panel, o) { e.preventDefault(); var close = config.PopupCloseStyle; var hide_window = function(e, target, options) { over = false; function try_hide() { if(over === false && popup_window.el.hasActiveFx() === undefined) { Ext.get(target).un(e.type, hide_window); Ext.getBody().un('click', hide_window); if(styled === true) { popup_window.hide(); } else { popup_window.el.fadeOut({duration: 0.2}); } } } if(styled === true) try_hide(); else try_hide.defer(700); } // Anyclick: Attach a click handler to body so when ANYTHING is clicked this window will close. if (close == 'outsideclick') { function miss_click() { Ext.getBody().on('click', hide_window); } miss_click.defer(200); } // MouseOut: When the mouse goes outside of the target template or the popup window, hide the window. else if (close == 'mouseout') { var attach_to_window = function() { el.on('mouseover', function() { over = true; }); popup_window.el.on('mouseover', function() { over = true; }); el.on('mouseout', hide_window); popup_window.el.on('mouseout', hide_window); } if (popup_window.rendered === true) { attach_to_window(); } else { popup_window.on('afterrender', attach_to_window); } } popup_window.show(); if(popup_window.el) popup_window.el.fadeIn({ duration: 0.2 }); return false; }); } if (panel.rendered === true) { finish(panel); } else { panel.on('afterrender', function(rendered_panel) { finish(rendered_panel); }); } }, getPopupWindow: function() { return popup_window; } }); Trakkware.View.PopupField.superclass.constructor.call(this, config); } }); Ext.reg('trakkware_popup', Trakkware.View.PopupField); Trakkware.View.HtmlEditor = Ext.extend(Ext.form.HtmlEditor, { constructor: function(config) { this.original_value = null; var timer_id = null; var htmleditor = this; var ii = 0; var me = this; var check_html_isdirty = function() { // If this editor gets destroyed and somehow the timer keeps going, do away with the time. if(htmleditor.getDoc() == null) { clearInterval(timer_id); return; } var current = htmleditor.getValue(); var orig = htmleditor.original_value; if(orig == null) { orig = current; htmleditor.original_value = current; } if(current != orig) { clearInterval(timer_id); htmleditor.fireEvent('dirty', htmleditor); } } this.setValue = function(value) { var result = Trakkware.View.HtmlEditor.superclass.setValue.call(this, value); timer_id = setInterval(check_html_isdirty, 500); return result; } this.isDirty = function() { var value = this.getValue(); return value != htmleditor.original_value; } Trakkware.View.HtmlEditor.superclass.constructor.call(this, config); this.addEvents('dirty', 'resetdirty'); this.on('destroy', function() { clearInterval(timer_id); }); this.on('resetdirty', function() { me.original_value = null; }); } }); Ext.reg('trakkware_html', Trakkware.View.HtmlEditor); Trakkware.View.RepeatForm = function(config) { var _data = {}; this.datafield = config.datafield; // This is vital. Since UI Markers are not part of the View, they will not be in an action's expected array and will be // skipped when getting data. this.isUIMarkerType = true; this.setValue = function(data) { // Convert to the format myCalendar can read. var my_data = {}; my_data.eventId = data.EventID; var beginDate = data.BeginDate; if (beginDate && beginDate.indexOf('Date') > -1) { beginDate = eval('new ' + beginDate.replace('/', '').replace('/', '')); } var untilDate = data.UntilDateTime; if (untilDate && untilDate.indexOf('Date') > -1) { untilDate = eval('new ' + untilDate.replace('/', '').replace('/', '')); } // Build the repeattype. var repeatType = { beginDay: beginDate, endDay: untilDate, rtype: data.Frequency, rtime: data.Count, rday: {}, intervalSlot: data.Interval } my_data.repeatType = repeatType; _data = my_data; this.resetRepeatSetting(data.Frequency, my_data); // Set other fields that aren't set in resetRepeatSetting. this.startDayField.setValue(beginDate); this.repeatEndDateField.setValue(untilDate); this.startTimeField.setValue(data.BeginTime); this.endTimeField.setValue(data.EndTime); // Deal with the byday object. var byday = Ext.decode(data.ByDay); if (byday) { var cg = this.weekCheckGroup.items; Ext.iterate(byday, function(day) { day = day - 1; cg.items[day].setValue(1); }); } } this.getValue = function() { var day = this.startDayField.getValue(); var event = { day: day, eday: day } var repeat_data = this.handleRepeatType(event); //alert(Ext.encode(repeat_data)); var data = { BeginDate: repeat_data.day, EndDate: repeat_data.eday, BeginTime: this.startTimeField.getValue(), EndTime: this.endTimeField.getValue(), Frequency: repeat_data.repeatType.rtype, Interval: repeat_data.repeatType.intervalSlot, UntilDateTime: repeat_data.repeatType.endDay, ByDay: Ext.encode(repeat_data.repeatType.rday || ''), Count: repeat_data.repeatType.rtime || 0 } return data; } this.getData = function() { return _data; } this.isDirty = function() { return true; } function getTimeStore() { var picklist_type = 'Trakkware.Platform.Lib.Picklists.TimePickList, Trakkware.Platform.Lib'; var picklist_command = '____PICKLIST____'; var store = new Ext.data.Store({ proxy: new Ext.data.HttpProxy({ method: 'POST', url: Trakkware.Handlers.MethodHandler, listeners: { exception: function(proxy, type, action, options, response, arg) { response = Ext.decode(response.responseText); if (response && response.result) { if (response.result == '0') { Ext.Msg.alert('Data loading error', 'Unable to load or change pages because: ' + response.msg); } else if (response.result == '1') { Ext.Msg.alert('A data reader error has occured, sorry but I cannot display your data because of it.'); } } } } }), baseParams: { view: picklist_type, command: picklist_command, paramarray: [] }, reader: new Ext.data.JsonReader({ root: 'list', successProperty: 'success', fields: ['text', 'value'] }) }); store.load(); return store; } this.startDayField = new Ext.form.DateField({ fieldLabel: 'Begins', value: new Date(), format: 'Y-m-d', allowBlank: false, anchor: '95%', editable: false, disabled: this.singleDay }); //this.startDayField.on('select', this.onStartEndDayCheckFn, this); this.startTimeField = new Ext.form.ComboBox({ hideLabel: true, labelSeparator: '', store: getTimeStore(), displayField: 'text', valueField: 'value', typeAhead: true, mode: 'local', triggerAction: 'all', selectOnFocus: true, allowBlank: false, editable: true, anchor: '95%', forceSelection: true }); //this.startTimeField.on('select', this.onStartTimeSelectFn, this); this.endTimeField = new Ext.form.ComboBox({ hideLabel: true, labelSeparator: '', store: getTimeStore(), displayField: 'text', valueField: 'value', typeAhead: true, mode: 'local', triggerAction: 'all', selectOnFocus: true, allowBlank: false, editable: true, anchor: '95%', forceSelection: true }); this.repeatIntervalField = new Ext.form.NumberField({ fieldLabel: 'Recur Every', labelSeparator: '', value: 1, allowBlank: false, anchor: '99%' }); this.repeatIntervalField.on('valid', this.onRepeatIntervalValidFn, this); this.intervalUnitLabel = new Ext.util.LabelField({ hideLabel: true, labelSeparator: '' }); this.repeatStartField = new Ext.form.DateField({ fieldLabel: 'Begin Date', format: 'Y-m-d', allowBlank: false, anchor: '90%', value: new Date() }); this.repeatStartField.on('select', this.onRepeatStartSelectFn, this); this.repeatNoEndRG = new Ext.form.Radio({ boxLabel: 'No end RG?', name: 'repeat-end-type' }); this.repeatEndTimeRG = new Ext.form.Radio({ boxLabel: 'Repeat End Time RG', name: 'repeat-end-type' }); this.repeatEndTimeField = new Ext.form.NumberField({ width: 50, value: 10, allowBlank: false, disabled: true }); this.repeatEndDateRG = new Ext.form.Radio({ boxLabel: 'Repeat End Date RG', name: 'repeat-end-type' }); this.repeatEndDateField = new Ext.form.DateField({ hideLabel: false, labelSeparator: '', label: 'Repeat Until', format: 'Y-m-d', allowBlank: false, anchor: '99%', disabled: true, value: (new Date()).add(Date.DAY, 365), margins: '0 0 0 75' }); this.repeatInfoPanel = new Ext.Panel({ border: false, html: '

' }); this.repeatTypeField = new Ext.form.ComboBox({ fieldLabel: 'Repeat field type', store: new Ext.data.ArrayStore({ fields: ['display', 'value'], data: [['Daily', 'day'], ['Weekly', 'week'], ['Monthly', 'month'], ['Yearly', 'year']] }), displayField: 'display', valueField: 'value', typeAhead: true, mode: 'local', triggerAction: 'all', selectOnFocus: true, allowBlank: false, editable: false, anchor: '99%' }); var checkListener = { 'check': { fn: this.refreshRepeatInfo, scope: this } }; var items = []; var nd = new Date(); var n = nd.format('N'); var mon = nd.add(Date.DAY, 1 - n); for (var i = 0; i < 7; i++) { items.push({ boxLabel: mon.add(Date.DAY, i).format('D'), listeners: checkListener }); } this.weekCheckGroup = new Ext.form.CheckboxGroup({ fieldLabel: 'Week', items: items, anchor: '100%' }); this.monthRadioGroup = new Ext.form.RadioGroup({ fieldLabel: 'Month', hidden: true, // TRAKKWARE CHANGE hideLabel: true, // TRAKKWARE CHANGE items: [{ boxLabel: 'Repeat by date', name: 'repeat-month-group', checked: true }, { boxLabel: 'Repeat by day', name: 'repeat-month-group', listeners: checkListener }], anchor: '60%' }); var cws; if (Ext.isIE) { if ('3.0.3' == Ext.version) { cws = [0.4, 0.2, 0.38, 0.4, 0.6]; } else { cws = [0.2, 0.1, 0.3, 0.2, 0.3]; } } else { cws = [0.4, 0.2, 0.38, 0.4, 0.6]; } this.timepanel = new Ext.Panel({ border: false, layout: 'column', labelWidth: 40, items: [{ columnWidth: .4, border: false, layout: 'form', items: [this.startDayField] }, { columnWidth: .2, border: false, layout: 'form', items: [this.startTimeField] }, { html: 'until', style: 'padding: 5px;' }, { columnWidth: .2, border: false, layout: 'form', items: [this.endTimeField] }] }); config = { border: false, style: 'padding:10px;', frame: true, autoHeight: true, labelWidth: 80, items: [ this.timepanel, this.repeatTypeField, { border: false, style: 'padding-left:85px;', layout: 'column', items: [{ border: false, columnWidth: .35, layout: 'form', items: [this.repeatIntervalField] }, { border: false, columnWidth: .2, items: [this.intervalUnitLabel] }] }, this.repeatInfoPanel, { border: false, style: 'padding-left:85px;', layout: 'form', items: [this.weekCheckGroup] }, { border: false, style: 'padding-left:85px;', layout: 'form', items: [this.monthRadioGroup] }, { border: false, style: 'padding-left:85px;', layout: 'column', items: [this.repeatEndDateField] } ] } Ext.apply(this, config); Trakkware.View.RepeatForm.superclass.constructor.call(this, config); this.addEvents( 'showdetailsetting' ); this.repeatTypeField.on('select', this.onRepeatTypeSelectFn, this); //this.calendarField.on('select', this.onCalendarSelectFn, this); this.repeatNoEndRG.on('check', this.onRepeatNoEndCheckFn, this); this.repeatEndTimeRG.on('check', this.onRepeatEndTimeCheckFn, this); this.repeatEndDateRG.on('check', this.onRepeatEndDateCheckFn, this); this.addEvents('registerdatafield', 'dirty', 'causesfieldchange'); this.enableBubble('registerdatafield', 'dirty', 'causesfieldchange') this.on('afterrender', function(control) { control.fireEvent('registerdatafield', control); }); }; Ext.extend(Trakkware.View.RepeatForm, Ext.Panel, { layout: 'form', onRepeatIntervalValidFn: function() { this.refreshRepeatInfo(); }, onRepeatStartSelectFn: function(df) { this.refreshRepeatInfo(); }, refreshRepeatInfo: function() { var beginDate = this.repeatStartField.getValue(); var intervalSlot = this.repeatIntervalField.getValue(); var getIntervalText = Ext.ux.calendar.Mask.getIntervalText; //var lan = Ext.ux.calendar.Mask.Editor; var v = this.repeatTypeField.getValue(); var str = ''; if ('day' == v) { this.updateRepeatInfo(getIntervalText(v, intervalSlot)); } else if ('week' == v) { var monday = beginDate.add(Date.DAY, 1 - beginDate.format('N')); var cbs = this.weekCheckGroup.items; var num = 0; for (var i = 0, len = cbs.getCount(); i < len; i++) { var cb = cbs.get(i); if (cb.checked) { num++; str += monday.add(Date.DAY, i).format('l') + ' '; } } if (7 == num) { str = 'Repeat Day Info'; } else if (0 == num) { str = beginDate.format('l') } this.updateRepeatInfo(getIntervalText(v, intervalSlot) + str); } else if ('month' == v) { var rds = this.monthRadioGroup.items; if (rds.get(1).checked) { str = Ext.ux.calendar.Mask.getWeekDayInMonth(beginDate); } else { str = beginDate.format('d'); } this.updateRepeatInfo(getIntervalText(v, intervalSlot) + str); } else if ('year' == v) { this.updateRepeatInfo(getIntervalText(v, intervalSlot) + beginDate.format('m-d')); } }, updateRepeatInfo: function(html) { var div = this.repeatInfoPanel.body.dom.firstChild.firstChild; div.innerHTML = html; }, onRepeatTypeSelectFn: function(combo, rd, index) { var v = combo.getValue(); this.resetRepeatSetting(v, this.getData()); }, resetRepeatSetting: function(v, event) { var rt = event.repeatType || 'no'; if (!Ext.isDefined(v)) { v = rt.rtype; } if (this.repeatTypeField.getValue() != v) this.repeatTypeField.setValue(v); // var lan = Ext.ux.calendar.Mask.Editor; var items = this.items; if ('no' == v || 'exception' == v) { items.get(2).hide(); items.get(3).hide(); items.get(4).hide(); items.get(5).hide(); items.get(6).hide(); } else { items.get(2).show(); items.get(3).show(); if ('day' == v || 'year' == v) { if ('day' == v) { this.intervalUnitLabel.setText('days'); } else { this.intervalUnitLabel.setText('years'); } items.get(4).hide(); items.get(5).hide(); } else if ('week' == v) { this.intervalUnitLabel.setText('weeks'); items.get(4).show(); this.weekCheckGroup.reset(); var cbs = this.weekCheckGroup.items; cbs.each(function(it) { it.checked = false; }); if ('string' != Ext.type(rt)) { var rday = rt.rday; for (var p in rday) { cbs.get(p - 1).setValue(true); } } items.get(5).hide(); } else if ('month' == v) { this.intervalUnitLabel.setText('months'); items.get(4).hide(); items.get(5).show(); this.monthRadioGroup.reset(); var rds = this.monthRadioGroup.items; rds.each(function(it) { it.checked = false; }); if ('string' != Ext.type(rt)) { var rby = rt.rby; if ('day' == rby) { rds.get(1).setValue(true); } else { rds.get(0).setValue(true); } } } items.get(6).show(); this.doLayout(); this.repeatNoEndRG.checked = false; this.repeatEndTimeRG.checked = false; this.repeatEndDateRG.checked = false; if ('string' != Ext.type(rt)) { this.repeatIntervalField.setValue(rt.intervalSlot); this.repeatStartField.setValue(rt.beginDay); if ('no' == rt.endDay) { if (false != Ext.type(rt.rtime)) { this.repeatEndTimeRG.setValue(true); } else { this.repeatNoEndRG.setValue(true); } } else { this.repeatEndDateRG.setValue(true); this.repeatEndDateField.setValue(rt.endDay); } } else { if ('day' == v) { this.repeatIntervalField.setValue(Ext.ux.calendar.Mask.getDayOffset(event.day, event.eday) + 1); } else { this.repeatIntervalField.setValue(1); } this.repeatStartField.setValue(event.day); this.repeatNoEndRG.setValue(true); } this.refreshRepeatInfo(); } }, onRepeatNoEndCheckFn: function(cb, checked) { if (checked) { this.repeatEndTimeField.disable(); this.repeatEndDateField.disable(); } }, onRepeatEndTimeCheckFn: function(cb, checked) { if (checked) { this.repeatEndTimeField.enable(); this.repeatEndDateField.disable(); } }, onRepeatEndDateCheckFn: function(cb, checked) { if (checked) { this.repeatEndTimeField.disable(); this.repeatEndDateField.enable(); } }, onStartEndDayCheckFn: function(df) { }, handleRepeatType: function(e) { var event = Ext.apply({}, e); var nrt = this.repeatTypeField.getValue(); if ('no' == nrt) { event.repeatType = 'no'; } else { var o = { rtype: nrt, intervalSlot: this.repeatIntervalField.getValue(), dspan: Ext.ux.calendar.Mask.getDayOffset(e.day, e.eday), beginDay: this.repeatStartField.getValue().format('Y-m-d') }; if (this.repeatNoEndRG.checked) { o.endDay = 'no'; } else if (this.repeatEndTimeRG.checked) { o.endDay = 'no'; o.rtime = this.repeatEndTimeField.getValue(); } else if (this.repeatEndDateRG.checked) { o.endDay = this.repeatEndDateField.getValue().format('Y-m-d'); } if ('week' == nrt) { var obj = {}; var items = this.weekCheckGroup.items; var flag = false; for (var i = 0, len = items.getCount(); i < len; i++) { var it = items.get(i); if (it.checked) { flag = true; obj[i + 1] = true; } } if (!flag) { var n = event.day.format('N'); //Date.parseDate(event.day, 'Y-m-d').format('N'); obj[n] = true; } o.rday = obj; } else if ('month' == nrt) { var items = this.monthRadioGroup.items; if (true == items.get(0).checked) { o.rby = 'date'; } else { o.rby = 'day'; } } event.repeatType = o; } return event; } }); Ext.reg('trakkware_repeatform', Trakkware.View.RepeatForm); Trakkware.View.MoneyField = Ext.extend(Ext.form.NumberField, { constructor: function(config) { Ext.apply(config, { allowDecimals: true, allowNegative: false, minValue: 1 }); Trakkware.View.MoneyField.superclass.constructor.call(this, config); } }); Ext.reg('trakkware_moneyfield', Trakkware.View.MoneyField);Ext.ns('Trakkware', 'Trakkware.View'); Trakkware.View.ComboPicklist = Ext.extend(Ext.form.ComboBox, { initComponent: function(config) { Trakkware.View.ComboPicklist.superclass.initComponent.call(this, config); this.addEvents('picklistreaction', 'react', 'registerpicklist', 'resetdirty', 'mask'); this.enableBubble('registerpicklist', 'picklistreaction', 'mask'); }, constructor: function(config) { var me = this; // Keeps track of whether a load is due to a JIT combo load. var jit_reload = false; var last_jit_value = null; // function that checks the combo for dirtiness. function testForDirty(combo) { var value = combo.getRawValue(); if(combo.last_keypress_value != value) { combo.last_keypress_value = value; combo.fireEvent('dirty', combo); } } // When this picklist is a simple combo, grab its StoreItems and use them // as the combo's store item. var store = null; if (config.LocalData === true) { store = config.StoreItems; } else { store = new Ext.data.Store({ proxy: new Ext.data.HttpProxy({ method: 'POST', url: Trakkware.Handlers.MethodHandler, listeners: { exception: function(proxy, type, action, options, response, arg) { response = Ext.decode(response.responseText); if (response && response.result) { if (response.result == '0') { Ext.Msg.alert('Data loading error', 'Unable to load or change pages because: ' + response.msg); } else if (response.result == '1') { Ext.Msg.alert('A data reader error has occured, sorry but I cannot display your data because of it.'); } } else { Ext.Msg.alert('Unknown error', 'An unknown error has occurred. The picklist failed to load.'); } me.fireEvent('mask', { Activate: false }); } } }), baseParams: { view: config.PicklistType, command: config.PicklistCommand, paramarray: [] }, reader: new Ext.data.JsonReader({ root: 'list', successProperty: 'success', fields: ['text', 'value'] }), listeners: { load: function(store) { if(jit_reload === true) { jit_reload = false; } else { // necessary for combo picklists that do not have data when they are .setValue()-ed the first time. var value = me.getValue(); // Check that the old value exists in the store data and reset to null if not. var store = me.getStore(); if(store) { var found = false; var has_items = false; store.each(function(record) { has_items = true; if(record.data.value == value) { found = true; return false; } }); if(found === true) { me.setValue(value); } else { if(has_items == true) { me.setValue(''); } } } } } } }); } config.store = store; config.valueField = 'value'; config.displayField = 'text'; config.minListWidth = 160; config.enableKeyEvents = true; //config.valueNotFoundText = config.emptyText || 'select...'; //config.tpl = '

{field2:htmlDecode}

'; // Turn on key events when using JIT combos. if(config.JustInTime === true) { var timeout_id = null; config.listeners.keypress = function(textfield, e) { var keycode = e.getKey(); if(keycode != 13 && keycode != 9 && keycode != 40 && keycode != 37 && keycode != 38 && keycode != 39) { // If we are already waiting, clear that wait and start a new one. if(timeout_id != null) clearTimeout(timeout_id); function do_search() { var value = textfield.getRawValue(); if(value != last_jit_value && value != '' && value != null) { store.load({ params: { paramarray: Ext.encode({ Search: value })}}); last_jit_value = value; jit_reload = true; } timeout_id = null; } timeout_id = do_search.defer(500); } } } Trakkware.View.ComboPicklist.superclass.constructor.call(this, config); this.setValue = function(value) { Trakkware.View.ComboPicklist.superclass.setValue.call(this, value); if(config.JustInTime === true) { var raw = me.getRawValue(); var current = me.getValue(); // Trakkware.ViewFramework.log(raw + ' : ' + current); } } this.on('afterrender', function(picklist) { // This override forces the selected value into a combo when tab is hit. var keynav = new Ext.KeyNav(picklist.el, { "tab": function(e) { if(config.forceSelection == true) { var raw = picklist.getRawValue(); // this if statement allows blank values to exist in our fancy dropdown lists. if(config.allowBlank == true && raw == '') { picklist.setValue(''); } else { var value = picklist.getValue(); picklist.onViewClick(false); } picklist.fireEvent('dirty', picklist); } return true; } }); picklist.fireEvent('registerpicklist', picklist); }); this.on('keypress', function(combo, e) { testForDirty(combo); }); this.on('collapse', function(combo) { if(combo) testForDirty(combo); }); // Fire when the combo value changes. this.on('change', function(combo, new_value, old_value) { // When this value changes, check if anything else should reload. if (config.OtherReactions) { combo.fireEvent('picklistreaction', combo.datafield, new_value, config.OtherReactions); } last_jit_value = combo.getRawValue(); }); // React to other picklist changing. this.on('react', function(data) { if (config.LocalData !== true && config.JustInTime !== true) { //var bp = store.baseParams.paramarray; var bp = Ext.apply({}, data); store.setBaseParam('paramarray', Ext.encode(bp)); store.load(); } }); this.on('resetdirty', function() { me.originalValue = me.getValue(); }); } }); Ext.reg('trakkware_combopicklist', Trakkware.View.ComboPicklist);Ext.ns('Trakkware', 'Trakkware.View'); // A Trakkware sort field that registers as a query modifier. Trakkware.View.Sort = Ext.extend(Ext.form.ComboBox, { initComponent: function() { this.addEvents('registermodifier', 'modifierchanged'); this.enableBubble('registermodifier', 'modifierchanged'); }, // config options: // // dataArray: The data to use for the combo's array store. Must be in the form [{ value: x, text: y}, {value: x, text: y}] // width: The width in pixels of this sort combo. // defaultValue: The default value to set this sort to. constructor: function(config) { // Validate several expected values. if (!Ext.isDefined(config.dataArray)) { alert('Config.dataArray is not defined in a config provided to Trakkware.View.Sort.'); return; } // Create a data store.. var store = new Ext.data.ArrayStore({ autoDestroy: true, fields: ['value', 'text'], data: [] }); // This is the object that is returned when this modifier changes. var sort_by_data_object = { sort: null, dir: null }; // Apply additional information for the combo box. config = Ext.apply(config, { store: store, id: Ext.id(), displayField: 'text', valueField: 'value', typeAhead: true, mode: 'local', forceSelection: true, triggerAction: 'all', width: config.width ? config.width : 100, iconCls: 'no-icon', value: config.defaultValue, disableKeyFilter: true, minListWidth: 100, listeners: { select: function(combo, record, index) { combo.fireEvent('modifierchanged', combo, record.data); }, afterrender: function(control) { if (config.dataArray.length > 0) { store.loadData(config.dataArray); control.fireEvent('registermodifier', { control: control, type: 'sort', getValue: function() { return { sort: control.getValue(), dir: 'asc' }; } }); } } } }); Trakkware.View.Sort.superclass.constructor.call(this, config); this.changeForModifier = function(new_value) { this.setRawValue(new_value); this.originalValue = this.getValue(); } } }); Ext.reg('trakkware_sort', Trakkware.View.Sort); // A grouping that registers as a query modifier. // // Expected config options: // // dataArray: The data to use for the combo's array store. Must be in the form [{ value: x, text: y}, {value: x, text: y}] // width: The width in pixels of this sort combo. // defaultValue: The default value to set this sort to. // rm: The function to call that registers this modifier. // mc: A function that is called when this modifier changes. Trakkware.View.GroupBy = Ext.extend(Ext.form.ComboBox, { initComponent: function() { this.addEvents('registermodifier', 'modifierchanged', 'broadcast'); this.enableBubble('registermodifier', 'modifierchanged'); }, constructor: function(config) { // Validate several expected values. if (!Ext.isDefined(config.dataArray)) { alert('Config.dataArray is not defined in a config provided to Trakkware.View.GroupBy.'); return; } // Start a datastore for this combo. var store = new Ext.data.ArrayStore({ autoDestroy: true, fields: ['value', 'text'] }); // Apply additional combo box properties before calling superclass constructor. Ext.apply(config, { store: store, id: Ext.id(), displayField: 'text', valueField: 'value', typeAhead: true, mode: 'local', forceSelection: true, triggerAction: 'all', width: 150, iconCls: 'no-icon', value: config.defaultText, disableKeyFilter: true, minListWidth: 100, listeners: { select: function(combo, record, index) { combo.fireEvent('modifierchanged', combo, record.data); }, afterrender: function(control) { if (config.dataArray.length > 0) { store.loadData(config.dataArray); // set the default value.. Important for getting the current group on form lists! control.setRawValue(config.defaultValue); control.fireEvent('registermodifier', { control: control, type: 'groupby', getValue: function() { return control.getValue(); } }); } } } }); Trakkware.View.GroupBy.superclass.constructor.call(this, config); this.changeForModifier = function(new_value) { this.setRawValue(new_value); this.originalValue = this.getValue(); } } }); Ext.reg('trakkware_groupby', Trakkware.View.GroupBy); // A filter combo that registers as a query modifier. // // Expected config options: // // ViewName: The view this filter belongs to. // propertyName: The propertyname assigned to this filter data. // Parameters: The config.Parameters object. // width: The width (in pixels) of this combo // emptyText: Text to display when the filter is empty. // dataType: The type of data that this filter deals with. Important for Ext and the backend systems. // rm: The function to call that registers this modifier. // mc: A function that is called when this modifier changes. Trakkware.View.ColumnFilter = Ext.extend(Ext.form.ComboBox, { initComponent: function() { this.addEvents('registermodifier', 'modifierchanged'); this.enableBubble('registermodifier', 'modifierchanged'); }, constructor: function(config) { // validate that certain config options exist. if (!Ext.isDefined(config.ViewName)) { alert('config.view is not defined in a config supplied to Trakkware.View.ColumnFilter'); return; } if (!Ext.isDefined(config.propertyName)) { alert('A config without .propertyName was supplied to Trakkware.View.ColumnFilter'); return; } // Convenience reference. var this_filter = this; // setup parameters to give the filter when it loads data. var parameters = Ext.apply(config.Parameters.Control, config.Parameters.View); if (config.Parameters.InitialState) parameters = Ext.apply(parameters, config.Parameters.InitialState.paramobject); // set up a store that will retrieve this filter's options. var store = new Ext.data.Store({ proxy: new Ext.data.HttpProxy({ method: 'POST', url: Trakkware.Handlers.MethodHandler, listeners: { exception: function(proxy, type, action, options, response, arg) { response = Ext.decode(response.responseText); if (response && response.result) { if (response.result == '0') { Ext.Msg.alert('Data loading error', 'Unable to load or change pages because: ' + response.msg); } else if (response.result == '1') { Ext.Msg.alert('A data reader error has occured, sorry but I cannot display your data because of it.'); } } } } }), baseParams: { view: config.ViewName, command: Trakkware.Handlers.FilterCommandPlaceHolder + config.propertyName, paramarray: Ext.encode(parameters) }, reader: new Ext.data.JsonReader({ root: 'list', successProperty: 'success', fields: ['text', 'value'] }) }); // Apply combo-related config options. config = Ext.apply(config, { store: store, id: Ext.id(), displayField: 'text', valueField: 'value', typeAhead: false, mode: 'local', forceSelection: true, width: config.width ? config.width : 100, iconCls: 'no-icon', value: '', disableKeyFilter: false, emptyText: config.emptyText, allowBlank: true, minListWidth: config.width ? config.width : 100, listWidth: config.width ? config.width * 2 : 200, triggerAction: 'all', listeners: { select: function(combo, record, index) { combo.fireEvent('modifierchanged', combo, record.data); }, afterrender: function(control) { store.load(); control.fireEvent('registermodifier', { control: control, type: 'filter', PropertyName: config.propertyName, getValue: function() { var value = control.getValue(); if (!Ext.isEmpty(value)) { return { type: config.dataType, field: config.propertyName, value: control.getValue() } } else { return null; } } }); } } }); // call the superclass constructor with this updated config. Trakkware.View.Filter.superclass.constructor.call(this, config); this.changeForModifier = function(new_value) { this.setValue(new_value); } } }); Ext.reg('trakkware_columnfilter', Trakkware.View.ColumnFilter); // A search box for use with data sets. Registers as a query modifier. // // Expected config options: // // textfield: The text field (or id of the field) that supplies the search term when this search is clicked. // text: Text that will show on the search button. Defaults to "search" // // rm: The function to call that registers this modifier. // mc: A function that is called when this modifier changes. Trakkware.View.Search = Ext.extend(Ext.Button, { initComponent: function() { this.addEvents('registermodifier', 'modifierchanged'); this.enableBubble('registermodifier', 'modifierchanged'); }, constructor: function(config) { var me = this; // validate some expected values from config. if (Ext.isEmpty(config.textfield)) { alert('The config.textfield option does not exist in a config provided to Trakkware.View.Search'); return; } // Get the textfield being referred to. If config.textfield is a string that means it is an id used to get the text. var textfield = (Ext.type(config.textfield) == 'string' ? Ext.getCmp(config.textfield) : config.textfield); if (!Ext.isDefined(textfield)) { alert('The textfield provided to Trakkware.View.Search is not defined or could not be found. (' + config.textfield + ')'); return; } // Add this method so that outside controls can reset the search. Specifically so that there can be a "clear search" button // which causes a modifier change. textfield.resetSearch = function() { // Empty out the search field first. if (textfield.setValue) textfield.setValue(''); else textfield.value = ''; me.fireEvent('modifierchanged', me, {}); } // This method allows the textbox to fire a search when a key is pressed. textfield.triggerSearch = function() { me.fireEvent('modifierchanged', me, {}); } // Registers this search control. function register(control) { control.fireEvent('registermodifier', { type: 'search', control: control, getValue: function() { var value = textfield.getValue(); if (!Ext.isEmpty(value)) return { search: textfield.getValue() }; else return null; } }); } // apply config values needed by the button. config = Ext.apply(config, { id: Ext.id(), text: (config.text ? config.text : 'search'), listeners: { click: function(control) { control.fireEvent('modifierchanged', control, null); }, afterrender: function(button) { register(button); } } }); Trakkware.View.Search.superclass.constructor.call(this, config); this.changeForModifier = function(new_value) { this.setRawValue(new_value); this.originalValue = this.getValue(); } } }); Ext.reg('trakkware_search', Trakkware.View.Search); // A filter combo filled with pre-built Filters that can be used to changed viewed data. Registers as a query modifier. // // Expected config options: // // ViewName: The view this filter belongs to. // width: The width (in pixels) of this combo // emptyText: Text to display when the filter is empty. // items: Array of prebuilt Filters to show. // rm: The function to call that registers this modifier. // mc: A function that is called when this modifier changes. Trakkware.View.Filter = Ext.extend(Ext.form.ComboBox, { initComponent: function() { this.addEvents('registermodifier', 'modifierchanged'); this.enableBubble('registermodifier', 'modifierchanged'); }, constructor: function(config) { // validate that certain config options exist. if (!Ext.isDefined(config.ViewName)) { alert('config.view is not defined in a config supplied to Trakkware.View.Filter'); return; } if (!Ext.isDefined(config.items)) { alert('A config without .items was supplied to Trakkware.View.Filter'); return; } // Convenience reference. var this_filter = this; // Create a data store.. var store = new Ext.data.ArrayStore({ autoDestroy: true, fields: ['value', 'text'], data: config.items }); // Apply combo-related config options. config = Ext.apply(config, { store: store, id: Ext.id(), displayField: 'text', valueField: 'value', typeAhead: false, mode: 'local', forceSelection: true, width: config.width ? config.width : 200, iconCls: 'no-icon', value: '', disableKeyFilter: false, emptyText: (config.emptyText || 'select filter'), allowBlank: true, minListWidth: config.width ? config.width : 100, listWidth: config.width ? config.width * 2 : 200, triggerAction: 'all', listeners: { select: function(combo, record, index) { combo.fireEvent('modifierchanged', combo, record.data); }, afterrender: function(control) { control.fireEvent('registermodifier', { control: control, type: 'builtfilter', PropertyName: '', getValue: function() { return { builtfilter: control.getValue() }; } }); } } }); // call the superclass constructor with this updated config. Trakkware.View.Filter.superclass.constructor.call(this, config); this.changeForModifier = function(new_value) { } } }); Ext.reg('trakkware_filter', Trakkware.View.Filter); // A combo box of reports that can be run. // // Expected config options: // // dataArray: The data to use for the combo's array store. Must be in the form [ [ value, text], [value, text] ] // width: The width in pixels of this sort combo. // defaultValue: The default value to set this sort to. // rm: The function to call that registers this modifier. // mc: A function that is called when this modifier changes. Trakkware.View.ReportCombo = Ext.extend(Ext.form.ComboBox, { constructor: function(config) { // Validate several expected values. if (!Ext.isDefined(config.dataArray)) { alert('Config.dataArray is not defined in a config provided to Trakkware.View.ReportCombo.'); return; } // Start a datastore for this combo. var store = new Ext.data.ArrayStore({ autoDestroy: true, fields: ['value', 'text'] }); // Apply additional combo box properties before calling superclass constructor. Ext.apply(config, { store: store, id: config.id, displayField: 'text', valueField: 'value', typeAhead: true, mode: 'local', forceSelection: true, triggerAction: 'all', width: 200, iconCls: 'no-icon', value: config.defaultText, disableKeyFilter: true, minListWidth: 100, listeners: { afterrender: function(control) { if (config.dataArray.length > 0) { store.loadData(config.dataArray); } control.runReport = function(data) { var viewparams = { AdditionalParameters: Ext.apply({}, data), ReportID: control.getValue() }; var report_config = { view: 'Trakkware.Platform.Lib.Reporting.ReportControl, Trakkware.Platform.Lib', command: 'VIEWRESULTS', viewParams: viewparams, launch: 'window', DefaultSizing: { Height: 800 } }; Trakkware.ViewFramework.launchView(report_config); } } } }); Trakkware.View.ReportCombo.superclass.constructor.call(this, config); } }); Ext.reg('trakkware_reportcombo', Trakkware.View.ReportCombo); Ext.ns('Trakkware', 'Trakkware.View'); Trakkware.View.FormLayout = Ext.extend(Ext.Panel, { initComponent: function(config) { Trakkware.View.FormLayout.superclass.initComponent.call(this, config); // Setup events. this.addEvents('registermodifier', 'modifierchanged', 'broadcast', 'registersemimodalwindow'); this.enableBubble('registersemimodalwindow'); }, // // Expected config options: // // Parameters: The parameters object. Parameters.View is used to load forms. // fields: A data definition for this form's data reader. // items: The form's ui items. // // hasUploads: Indicates that this form contains upload fields and therefore must be submitted differently. // toolbar: A toolbar config object. // labelAlign: Indicates how labels should be aligned for this form's items. // DefaultSizing, SubviewSizing: How to size this form. constructor: function(config) { // Immediately attach Trakkware.View functionality. Trakkware.View(this, config); // Construct a toolbar if provided. var toolbar = null if (config.toolbar) toolbar = this.constructToolbar(config.toolbar); // Nice references: var this_form = this; var sizing = config.SubviewSizing || config.DefaultSizing; config = Trakkware.ViewFramework.ApplySizing(config, sizing); // Indicates the dirties on this form are already registered. var dirties = false; // Loads the form. var loadform = function(data) { // If data was provided, apply if to config.Parameters.View if(Ext.isDefined(data)) { config.Parameters.View = Ext.apply(config.Parameters.View, data); } // Create an ajax request and load the form's controls on success. Ext.Ajax.request({ method: 'POST', url: Trakkware.Handlers.MethodHandler, params: { view: config.ViewName, command: config.Command, paramarray: Ext.encode(config.Parameters.View), viewparams: Ext.encode(config.Parameters.Internal) }, reader: new Ext.data.JsonReader({ root: 'list', totalProperty: 'count' }, config.fields), success: function(record) { json_result = Ext.decode(record.responseText); if (Ext.isDefined(json_result.result) && json_result.result == '0') { if (Ext.isDefined(json_result.msg)) { error = json_result.msg; } if (error !== null) { Ext.Msg.alert('Error: Cannot load view data', error); } else { Ext.Msg.alert('Error: Cannot load view data', 'An unspecified error has prevented this view from getting its data. (The failure response object was malformed so I can\'t tell you the actual problem...*sigh*)'); } } else { // Store sub views off to load after everything else is loaded. var subs = {}; // I'm doing each here but it should only ever be for one form. Maybe in the future we will have a form list view // and this first .each will become more useful. Ext.each(json_result.list, function(item, index, all) { // Data that will be sent to subviews. var subview_data = {}; // Template data has internal params applied. var template_data = item; // Apply internal view parameters that don't already exist in the dataset. if (config.Parameters && config.Parameters.Internal) { Ext.iterate(config.Parameters.Internal, function(p) { if (!item[p]) { item[p] = config.Parameters.Internal[p]; } }); } // Try to fill each data field on the form. var fields = this_form.getRegisteredDatafields(); Ext.each(fields, function(field) { var datafield = field['datafield']; if(dirties === false) { // Register this thing as dirtyable. this_form.fireEvent('registerdirtyable', field); } var xtype = field.getXType ? field.getXType() : null; var requires_all = Trakkware.ViewFramework.requiresAllData(xtype); // If the field is a subview, just save it for after we are done with the other fields. // Also listen for formdirty since this is a subview. if (xtype == 'trakkware_subview') { subs[datafield] = field; } else { var the_value = item[datafield]; if (requires_all == true || Ext.isDefined(the_value) || the_value === null) { if (Ext.isDefined(the_value) && the_value) { // hack for the massive confusion of javascript + extJS + Microsoft JSON serializer. if (the_value.indexOf && the_value.indexOf('Date(') > -1) { the_value = eval('new ' + the_value.replace('/', '').replace('/', '')); // Set this for later.. I'm having trouble getting dates in a format that .NET and Ext/JS are all happy with. field.is_date = true; } } // Checkbox needs to be set specially so dirty stuff doesn't fire. if (xtype == 'checkbox') { field.originalValue = null; field.setValue(the_value); field.originalValue = field.getValue(); } else { // Some fields need ALL data given to them. if (requires_all == true) { field.setValue(template_data, field); field.originalValue = field.getValue(); } else { // Setting null to textfields causes them to report isDirty() true before they are dirty // probably because '' and null are not equal and therefore the field is dirty. // The tree is an exception.. i want it to have setValue called no matter what. if (the_value != null || xtype == 'trakkware_tree') { // I don't like doing this here.. :/ Convert true/false to string "true" or "false" since that is what all my picklists use as values: string. if(xtype == 'trakkware_combopicklist' || xtype == 'combo') { if(Ext.isBoolean(the_value) || Ext.isNumber(the_value)) the_value = the_value + ''; } field.setValue(the_value, field); field.originalValue = field.getValue(); } } } if (xtype !== 'trakkware_template' && xtype !== 'trakkware_popup') { subview_data[datafield] = the_value; } // I had to do this here.. not sure how to do it correct in the picklist object. if(field.ShowOn != null) { Trakkware.ViewFramework.ProcessShowOn(field, field.ShowOn, template_data); } if(field.DisableOn != null) { Trakkware.ViewFramework.ProcessDisableOn(field, field.DisableOn, template_data); } // lastly, remove the inner-label class just in case this is a text field with inner labelling field.removeClass('trakkware-textfield-inner-label'); } } }); // calling .setValue() on subviews causes them to load. for (var c in subs) { var this_subview = subs[c]; this_subview.setValue(subview_data); } dirties = true; // Set the preregistered subview's deferred data. var pres = this_form.getPreRegisteredSubviews(); Ext.each(pres, function(pre) { pre.deferred_data = subview_data; }); }); // Controls are all loaded, so fire an event. this_form.fireEvent('controlsloaded', json_result.list[0]); // Apply a title var title_data = null; if (json_result.list.length > 0) title_data = json_result.list[0]; if(config.isSubview != true) this_form.applyTitle(config.TitleTemplate, title_data); // Get a field to focus on/ var focus_field = Trakkware.ViewFramework.findTextOrCombo(this_form); if (config.isSubview !== true && focus_field) { var f = function() { focus_field.focus(); } f.defer(50); } } }, failure: function(response) { Trakkware.ViewFramework.processRequestFailure(response); } }); } // Listen for reloads. this.on('reloadview', function(data) { if(config.PassReloadToTreeChildren != true) { loadform(data); } else { this_form.items.each(function(item) { if(item.refreshTree) item.refreshTree(); }); } }); // Takes a command and data and reloads this view with them. // Expected config options: // Command: The new command // Data: Additional data to include function reload(reload_config) { if (Trakkware.ViewFramework.requireOption(config, 'Command', 'Trakkware.View.FormLayout.reload') == false) return; if (Trakkware.ViewFramework.requireOption(config, 'Data', 'Trakkware.View.FormLayout.reload') == false) return; // Apply config.Data to the view config. config = Ext.apply(config.Parameters.View, reload_config.Data); loadform(); } // Given a property, returns the control associated with it. function findControl(property_name) { Ext.each(this.findBy(function(thing) { return (Ext.isDefined(thing.datafield) && Ext.isFunction(thing.getValue)); }), function(field) { if (field.datafield == property_name) return field; }); return null; } // add formpanel-related config options. config = Ext.apply(config, { layout: 'form', id: (config.ControlID ? config.ControlID : Ext.id()), autoScroll: true, fileUpload: config.hasUploads, labelAlign: config.labelAlign ? config.labelAlign : 'top', monitorValid: false, tbar: toolbar, unstyled: (config.unstyled || false), hideBorders: (config.unstyled || false), items: config.items, findControl: findControl, padding: '0 0 0 5px', listeners: { // Load the form and register it for broadcasting after this control renders. afterrender: function(form) { loadform(); this.registerForState(); } }, reloadForBroadcast: reload }); // Call the superclass' constructor. Trakkware.View.FormLayout.superclass.constructor.call(this, config); } }); Ext.reg('trakkware_form', Trakkware.View.FormLayout); Ext.ns('Trakkware', 'Trakkware.View'); if(!Trakkware.View.GridLayout) { Trakkware.View.GridLayout = Ext.extend(Ext.grid.GridPanel, { // config options: (See Trakkware.View for base config options) // // ds: An Ext datastore data definition. // cm: An Ext.ColumnModel object. example: new Ext.grid.ColumnModel({columns: { } }); // toolbar: An Ext Toolbar filled with view actions. // Paging related: // usePaging: (true/false) Indicates whether to use paging on this grid. // pageSize: (int) A valid pagesize to start at (5/10/25/50 for now) // gridFilters: A grid filter array indicating which columns to allow filtering on. // DoubleClick: An object describing rowdblclick behavior. // use { ViewName: '', Command: '' } // title: A title template to use for this grid. constructor: function(config) { this.addEvents('registermodifier', 'modifierchanged', 'broadcastmodifiers', 'registersemimodalwindow'); this.enableBubble('registersemimodalwindow'); // add on view functionality to the config.. looks silly doesnt it? Trakkware.View(this, config); // Nice reference var this_grid = this; // Create grid filters.. var filters = new Ext.ux.grid.GridFilters({ encode: true, local: false, filters: config.gridFilters }); // Set initial modifiers for store. config.qm = config.Parameters.InitialQueryModifiers; config.ib = config.Parameters.InitialState; config.StoreOwner = this_grid; // Create a datastore. var datastore = new Trakkware.View.Store(config); // Relay these store events. this.relayEvents(datastore, ['emptydataset', 'performactionondirties', 'afterfirstload', 'mask']); // When the store is loaded, re-apply title. datastore.on('load', function(store, records, options) { var data = {}; if(config.isSubview != true) { if (records.length > 0) data = records[0].data; // Title is the first row of data with View parameters applied on top of them. Ext.apply(data, config.Parameters.View); this_grid.applyTitle(config.TitleTemplate, data); } }); // Pass on modifier events to the store. this.on('registermodifier', function(config) { datastore.fireEvent('registermodifier', config); return false; }); this.on('modifierchanged', function(control, data) { datastore.fireEvent('modifierchanged', control, data); return false; }); // Catch broadcasts and give them to the store. this.on('broadcastmodifiers', function(broadcast_config) { return datastore.fireEvent('broadcastmodifiers', broadcast_config); }); // A paging toolbar will be created is usePaging is specified in config. var paging_toolbar = config.usePaging != true ? null : new Ext.PagingToolbar({ id: Ext.id(), store: datastore, pageSize: config.pageSize, displayInfo: true, prependButtons: true, totalProperty: 'count', plugins: [filters], items: ['Page Size:', { xtype: 'combo', width: 40, mode: 'local', store: new Ext.data.ArrayStore({ id: 0, fields: ['DisplayPage', 'page_count'], data: [['5', 5], ['10', 10], ['25', 25], ['50', 50]] }), valueField: 'page_count', displayField: 'DisplayPage', editable: false, typeAhead: false, allowBlank: false, mode: 'local', disableKeyFilter: true, triggerAction: 'all', value: config.pageSize, listeners: { scope: this, 'select': function(combo, record, index) { paging_toolbar.pageSize = record.get('page_count'); paging_toolbar.doLoad(paging_toolbar.cursor); } } } ] }); // register the pager. if (paging_toolbar != null) { // Register the pager. this.fireEvent('registermodifier', { control: paging_toolbar, type: 'pager', getValue: function() { var limit = paging_toolbar.pageSize; var t = paging_toolbar; start = (Math.ceil((t.cursor + t.pageSize) / t.pageSize) - 1) * t.pageSize; return { start: start, limit: limit }; } }); } // Listen for reloads. this.on('reloadview', function() { datastore.reload(); }); // Reloads the grid when a broadcast is heard. function reload(reload_config) { if (Trakkware.ViewFramework.requireOption(reload_config, 'Command', 'Trakkware.View.GridLayout.reload') == false) return; if (Trakkware.ViewFramework.requireOption(reload_config, 'Data', 'Trakkware.View.GridLayout.reload') == false) return; // Apply all broadcast params to the view parameters config.Parameters.View = Ext.apply(config.Parameters.View, reload_config.Data); // delete the NULL parameter if it exists. delete config.Parameters.NULL; // Tell the grid's store to reload itself. datastore.load(); } var mask = null; var last_row = 0; // Construct a toolbar from config settings. var toolbar = null if (config.toolbar) toolbar = this.constructToolbar(config.toolbar); var grid_config = { id: Ext.id(), ds: datastore, cm: config.cm, fbar: config.usePaging == true ? paging_toolbar : null, tbar: toolbar, plugins: [filters], sm: new Ext.grid.RowSelectionModel({ singleSelect: true }), buttonAlign: 'left', title: 'loading...', onLoad: Ext.emptyFn, listeners: { load: function(store, records, options) { // Try to reselect the last row that was selected. if (last_row != null) { this.getSelectionModel().selectRow(last_row); last_row = null; } //alert(last_left + ' and ' + last_top); }, afterrender: function(grid) { // This is necessary to have the grid remember its scroll position. // I spent way too much time trying to figure this out.. NONE of the Ext solutions work. var view = grid.getView(); view.scrollToTop = function() { } // Load data.. datastore.load(); //Register for broadcasting. this.registerForState(); // register an event for when a query modifier control changes. grid.addEvents('modifierchanged'); }, click: function(e) { var el = Ext.get(e.getTarget()); if(Ext.isDefined(el)) { if(el.hasClass && el.findParent && !el.hasClass('.x-btn-text')) { var new_el = el.findParent('.x-btn-text'); if(new_el != null) el = new_el; } // a grid link must contain at least the command attribute. // if a view attribute is provided, then the link will launch the // view using the command provided. The map and expected attributes are // used to map values from config.viewParams to property names that the // view-being-launched is expecting. var command = el.getAttribute('command'); var view = el.getAttribute('view'); if (Ext.isEmpty(view)) view = config.view; var data = config.viewParams || {}; var row = this_grid.getSelectionModel().getSelected(); if(row) { Ext.apply(data, row.data); } if (command) { var map = el.getAttribute('map'); if (map) { map = Ext.decode(map); } var expected = el.getAttribute('expected'); if (expected) { expected = Ext.decode(expected); } // map the view parameters from this view's parameters. var view_params = Trakkware.ViewFramework.applyMapAndExpected(map, expected, data); this_grid.actionHandler(el, { Command: command, ViewName: view, Parameters: { View: view_params }, DontAdjustParams: true }); } } }, rowdblclick: function(grid, index, e) { if(config.DoubleClick) { var row = grid.getSelectionModel().getSelected(); var viewname = config.DoubleClick.ViewName; var map_to = ''; if(config.DoubleClick.Dynamic != null && row) { viewname = row.data[config.DoubleClick.Dynamic]; } var parameters = Ext.apply({}, config.Parameters); if(config.DoubleClick.MapTo) { Ext.iterate(config.DoubleClick.MapTo, function(from) { var to = config.DoubleClick.MapTo[from]; if(row.data[from] && row.data[to]) parameters.View[row.data[to]] = row.data[from]; }); } this.actionHandler(grid, { ViewName: viewname, Command: config.DoubleClick.Command, Parameters: parameters }); last_row = index; } }, // Event fires when a query modifier's value has changed locally. modifierchanged: function(control) { datastore.reload(); } } } var sizing = config.SubviewSizing || config.DefaultSizing; grid_config = Trakkware.ViewFramework.ApplySizing(grid_config, sizing); // When grid is a subview, set sizing info. if (config.isSubview === true) { grid_config.anchor = '95%'; } // Apply methods that the view will use. Ext.apply(this, { hasSelectedRow: function() { if (this.getSelectionModel().getCount() > 0) { return true; } return false; }, actionDataProvider: function() { if (this.getSelectionModel().getCount() > 0) { return this.getSelectionModel().getSelected().data; } }, onActionReload: function() { datastore.reload(); }, isSelected: function() { return (datastore.getSelectionModel().getCount() > 0); }, getListeningModifierNames: datastore.getListeningModifierNames }); Trakkware.View.GridLayout.superclass.constructor.call(this, grid_config) } }); } Ext.ns('Trakkware', 'Trakkware.View'); Trakkware.View.MapLayout = Ext.extend(Ext.ux.GMapPanel, { initComponent: function(config) { Trakkware.View.MapLayout.superclass.initComponent.call(this, config); this.addEvents('broadcast', 'registermodifier', 'modifierchanged'); }, // Expected config options: // ds: A data store object for the json reader. // Parameters.Internal:The map looks for width and height in the Control parameters. // mapOptions: Google Map options such as 'enableDoubleClickZoom', 'enableDragging' // mapControls: Google Map control options such as 'GSmallMapControl', 'GMapTypeControl' // zoomLevel: The zoom level to start on. // autoCenter: (true/false) Indicates that this map should auto-center on its pins when they are loaded. // centerLng: A center longitude to set this map to. This value overrides the autoCenter value if autoCenter is true. // centerLat: A center latitude to set this map to. The value overrides the autoCenter value if autoCenter is true. // longitudeProperty: The property name used to gather longitude from data items. // latitudeProperty: The property name used to gather latitude values from data items. // zoomLevelProperty: The property name used to get a zoom level from data items. // titleTemplate: The template used to title pins for when people mouse-over them. // pinTemplate: The template that is used to template pin popups. // pinImageUrl: Url to an image to use for pins. // pinClickCommand: A command to put this map into when a pin is clicked instead of showing a popup. // titleCallback: A callback that is invoked after data is loaded so that the parent can set its title. // mapInfo: An object that contains each command for the map, whether the command causes simple view changes, // the commands title and pin templates, and pin urls that are used when simple view changes occur. constructor: function(config) { // add trakkware view functionality. Trakkware.View(this, config); // make a nice reference to this map. var this_map = this; config.ViewObject = this; // Ensure that parameters is an object if (!config.Parameters) config.Parameters = {}; // marker arrays var markers_dict = []; var hidden_markers = []; var original_view_params = Ext.apply({}, config.Parameters ? config.Parameters.View : {}); // load the map... function load_map(leave_pins, causing_marker) { // Show a mask.. //this_map.fireEvent('mask', { Activate: true, ViewName: config.ViewName, Command: config.Command }); // Request the map's data. The data items that come back are mapped as pins. Ext.Ajax.request({ method: 'POST', url: Trakkware.Handlers.MethodHandler, params: { view: config.ViewName, command: config.Command, paramarray: Ext.encode(config.Parameters.View) }, reader: new Ext.data.JsonReader({ root: 'list', totalProperty: 'count' }, config.ds ), success: function(record) { json_result = Ext.decode(record.responseText); if (Ext.isDefined(json_result.result) && json_result.result == '0') { if (Ext.isDefined(json_result.msg)) { error = json_result.msg; } if (error !== null) { Ext.Msg.alert('Error: Cannot load view data', error); } else { Ext.Msg.alert('Error: Cannot load view data', 'An unspecified error has prevented this view from getting its data. (The failure response object was malformed so I can\'t tell you the actual problem...*sigh*)'); } } else { // Got data successfully. Call the title callback, then add pins. if (config.titleCallback) config.titleCallback(json_result.list[0]); // Set up pin templating. var template = null; var xtemplate = null; var title_template = null; var title_xtemplate = null; try { template = config.pinTemplate; // template can have %22s still at this point, so replace them. template = template.replace(/%22/g, '"'); xtemplate = new Ext.XTemplate(template); title_template = config.titleTemplate; title_template = title_template.replace('%22', '"'); title_xtemplate = new Ext.XTemplate(title_template); } catch (e) { Ext.Msg.alert('Invalid Template', 'An invalid template was provided to a map control! Hint: its either Template or TitleTemplate'); } if (title_xtemplate && xtemplate) { // Get the map info for this command. var info = config.mapInfo[config.Command]; // clear pins (unless otherwise indicated) if (leave_pins == true && info.leave_pins) { var the_map = this_map.getMap(); // Get the command for the pins that are to be left on. var leave = info.leave_pins; var leave_props = info.leave_properties; var new_markers_dict = []; // Check each existing marker for whether to leave it or destroy it. Ext.each(markers_dict, function(marker) { var keep = false; Ext.each(info.leave_pins, function(leave_command) { if (marker.set_by_command == leave_command) { keep = true; // If a leave property array exists, check that this marker's value matches a // value in the data. Ext.each(leave_props, function(property) { if (!config.Parameters.View[property] || config.Parameters.View[property] != marker.data_item[property]) { keep = false; return false; } }); return false; } }); if (keep == true) { new_markers_dict.push(marker); } else { the_map.removeOverlay(marker); delete marker; } }); // Set the markers dict to the new one that now contains only the pins that we left on the map. markers_dict = new_markers_dict; } else { // If leave pins was not true, clear out all current pins and reset the marker dictionary. this_map.getMap().clearOverlays(); markers_dict = []; } // Before added this data, check if the dataset returned is valid but empty. // If it is empty, check if this state forwards itself. // SPECIAL NOTE: This check is performed AFTER the pin manipulation bits above because // we want to maintain the same kind of pin hiding that would occur if the current state was instituted. if (config.mapInfo && json_result.count < config.mapInfo[config.Command].empty_trigger_count && config.mapInfo[config.Command] && config.mapInfo[config.Command].if_empty_command) { var forwarded_command = config.mapInfo[config.Command].if_empty_command; // A causing marker might not exist here because a broadcast may be responsible for this load_map. // Create a fake marker that has the properties that are needed by simple state change. // I'm not a big fan of this.. it will cause problems in the future. if (!causing_marker) { causing_marker = { data_item: json_result.list[0], set_by_command: config.Command }; } performSimpleStateChange(forwarded_command, causing_marker); return; } // Start an average lat and lng. var lng_avg = 0; var lat_avg = 0; Ext.each(json_result.list, function(item, index, all) { // Get lng/lat and apply them to the average for autoCentering. var lat = item[config.latitudeProperty]; var lng = item[config.longitudeProperty]; if (lat && lat != 0 && lng && lng != 0) { if (lat_avg == 0) lat_avg = lat; else lat_avg = (lat_avg + lat) / 2; if (lng_avg == 0) lng_avg = lng; else lng_avg = (lng_avg + lng) / 2; } // Create a new pin, assign the pinImageUrl if defined, and set templates. var mkr_point = new GLatLng(lat, lng); var data = item; // Figure out which pin graphics to use. var icon = new GIcon(G_DEFAULT_ICON); // Special case: When UseFlagPins has been specified, use the flag graphic if a CountryCode field is available. if (info && info['use_flag_pins'] == true) { icon.image = '/MapData/flags/' + data['CountryCode'] + '.png'; icon.iconSize = new GSize(22, 16); icon.iconAnchor = new GPoint(5, 32); } else if (Ext.isDefined(config.pinImageUrl)) icon.image = config.pinImageUrl; // Template the pin's html.. var pin_html = xtemplate.apply(item); // Assign data and pin html along with standard GMarker stuff. var marker_data = { icon: icon, title: title_xtemplate.apply(item), id: index, data_item: data, pin_html: pin_html, command: config.pinClickCommand, set_by_command: config.Command }; marker = new GMarker(mkr_point, marker_data); this_map.getMap().addOverlay(marker); Ext.apply(marker, marker_data); // push this marker onto the marker dictionary. markers_dict.push(marker); }); // this bool indicates whether center-to-pin-average is on or off. if (config.autoCenter) { //alert('setting center to ' + lat_avg + ', ' + lng_avg); this_map.getMap().setCenter(new GLatLng(lat_avg, lng_avg)); } // Set the map's initial zoom manually. var zoom = config.zoomLevel; if (config.zoomLevelProperty && !Ext.isEmpty(config.zoomLevelProperty) && causing_marker && causing_marker.data_item && causing_marker.data_item[config.zoomLevelProperty]) { zoom = causing_marker.data_item[config.zoomLevelProperty]; } this_map.getMap().setZoom(zoom); // Show a mask.. //this_map.fireEvent('mask', { Activate: false }); } } }, failure: function(response) { Trakkware.ViewFramework.processRequestFailure(response); } }); } // Takes a command and data and reloads the map with them. // Expected config options: // Command: The new command // Data: Additional data to include function reload(reload_config) { if (Trakkware.ViewFramework.requireOption(reload_config, 'Command', 'Trakkware.View.FormLayout.reload') == false) return; if (Trakkware.ViewFramework.requireOption(reload_config, 'Data', 'Trakkware.View.FormLayout.reload') == false) return; // Get the command that caused this.. var old_command = config.Command; // Apply config.Data to the view config. config = Ext.apply(config.Parameters.View, reload_config.Data); // Do a simple state change and tell it not to broadcast. var marker = { set_by_command: old_command, data_item: config.Parameters.View }; performSimpleStateChange(reload_config.command, marker, true); } // Apply additional map panel properties to config. config = Ext.apply(config, { id: Ext.id(), mapConfOpts: config.mapOptions, mapControls: config.mapControls, reloadForBroadcast: reload, listeners: { beforerender: function(map) { // Before rendering, derive a size for this map. // NOTE: SIZE IS REQUIRED. var width = null; var height = null; if (config.Parameters && config.Parameters.Internal) { if (config.Parameters.Internal.WidthInPixels) width = config.Parameters.Internal.WidthInPixels; if (config.Parameters.Internal.HeightInPixels) height = config.Parameters.Internal.HeightInPixels; } if ((width == null || height == null) && config.width && config.height) { width = config.width; height = config.height; } if (width == null || height == null) { alert('A width and height were not fully provided to a map. (' + config.ControlID + ': w=' + width + ',h=' + height + ')'); return; } // Before rending the map, set its absolute size. This is // required for map. map.setSize(width, height); }, afterrender: function() { // Get the map to load itself and then attach a click handler // to the google map. load_map(); // Register this map for stateful-ness. this.registerForState(); var map = this_map.getMap(); if (map) { GEvent.addListener(map, 'click', markerClick); } } } }); // Called when the map gets a click. function markerClick(marker, point) { if (marker) { // Get the command that this pin click causes var command_change_to = marker.command; // If there is a command, figure out what to do.. if (!Ext.isEmpty(command_change_to)) { // Look in map info if there is any for this change-to command. var info = (config.mapInfo ? config.mapInfo[command_change_to] : null); if (info) { // Found the command's info. See if we should do a simple change. if (info.simple_change == true) { // Change map state to this new command. performSimpleStateChange(command_change_to, marker); // Bail out after reloading the map. return; } } // If we get this far, then check if an action method exists in config // and use it to trigger an action change. if (Ext.isFunction(config.action)) { config.action(command_change_to, config.view, marker.data_item); } } else { // Check that an actual marker was clicked. The check for openInfoWindow indicates that a // marker was clicked, not something else (like the marker's info window) // Also check that no pin click command is specified. var command = marker.command; var mapinfo = config.mapInfo[command]; if (marker && marker.openInfoWindow && !Ext.isEmpty(marker.pin_html)) { var html = marker.pin_html; var info = Ext.DomHelper.createDom({ tag: 'div', html: html }); marker.openInfoWindow(info); } } } } this.performSimpleViewChange = function(command, actionParams) { // Create a fake causing_marker to send into simple state change.. var marker = { set_by_command: config.Command, data_item: actionParams }; performSimpleStateChange(command, marker, true); return true; } // change the config command to put this view into a new command state function performSimpleStateChange(command, causing_marker, no_broadcast) { // Get map info for this new state. var info = config.mapInfo[command]; // and then reload the map to put it into that state. config.Command = command; // Change our config's zoom level andtemplates to that of the new command state. config.zoomLevel = info.zoom; config.pinTemplate = info.pin_template; config.titleTemplate = info.title_template; config.pinClickCommand = info.pin_command; config.pinImageUrl = info.pin_image; config.zoomLevelProperty = info.zoom_level_property; // When the map is reloading in this way, we must overwrite viewParam data with // data that has been provided by the pin click. config.Parameters.View = Ext.apply({}, original_view_params); config.Parameters.View = Ext.apply(config.Parameters.View, causing_marker.data_item); // TESTING: //alert(' in map layout, performing simple state change, config.Parameters = \r\n' + Ext.encode(config.Parameters)); // Get an action for the broadcaster var action = this_map.getActionDefinition(command); // broadcast the change unless otherwise specified. if (no_broadcast != true) { //alert(config.ControlID + ' broadcasting ' + command + ' with\r\n' + Ext.encode(action) + '\r\nand\r\n' + Ext.encode(config.Parameters.View)); Trakkware.ViewFramework.Broadcast({ ControlID: config.ControlID, Command: command, ActionDefinition: action, RawData: config.Parameters.View }); } // Reload the map with the new command and viewParams! var send_leave_pins = (info.leave_pins && info.leave_pins.length > 0); // Before setting the hidden marker, check if the existing hidden marker should be re-shown. if (hidden_markers && hidden_markers.length > 0) { Ext.each(hidden_markers, function(marker) { // If this hidden pin has a command which is indicated as a command to leave, then show it! if (info.leave_pins && info.leave_pins.length > 0 && info.leave_pins.indexOf(marker.set_by_command) > -1) { marker.show(); } else { delete marker; } }); } // when leave pins is set to true, remove this pin.. if (send_leave_pins && causing_marker.hide) { causing_marker.hide(); hidden_markers = [causing_marker]; } // Reload the map.. load_map(send_leave_pins, causing_marker); } Trakkware.View.MapLayout.superclass.constructor.call(this, config); } }); Ext.ns('Trakkware', 'Trakkware.View'); if(!Trakkware.View.TemplatedListLayout) { Trakkware.View.TemplatedListLayout = function(config) { // TemplatedListLayout config options: // view: Name of the view // command: The view command used to load the form. // viewParams: An object of values that is used to load the form. These params are sent to the method handler everytime. // action: Method is invoked when the form needs to perform a view action. // ds: An Ext datastore data definition. // rs: A method that is invoked when a row selection occurs. It is invoked with the signature (enable, data) // dblclick: A function that will get invoked when a template row is double clicked. The function is invoked with the same parameters as the templates's dblclick event. // Paging related: // usePaging: (true/false) Indicates whether to use paging on this list. // pageSize: (int) A valid pagesize to start at (5/10/25/50 for now) // toolbar: A toolbar of actions. // titleCallback: Callback function that is called when it is time to set the title. // Modifier registration and retrieval // rm: A method which is called that returns a modifiers object ready to be used for data method calls. // pager: A method that takes a paging control's id and registers it for use with the method provided in rm. // qm: An initial query modifiers parameter object to use when making the first load // height: Absolute height of this list. AutoScroll is set to true when an autoHeight is false. // width: Absolute width of the list, in pixels. // autoHeight: (true/false) indicates the list should use autoHeight. var first_load = true; var dataview_store = new Ext.data.Store({ remoteSort: true, proxy: new Ext.data.HttpProxy({ method: 'GET', url: Trakkware.Handlers.MethodHandler, listeners: { exception: function(proxy, type, action, options, response, arg) { response = Ext.decode(response.responseText); if (response && response.result) { if (response.result == '0') { Ext.Msg.alert('Data loading error', 'Unable to load or change pages because: ' + response.msg); } else if (response.result == '1') { Ext.Msg.alert('A data reader error has occured, sorry but I cannot display your data because of it.'); } } }, // Before reloading data, modifiers must be checked for values and included. beforeload: function(store, options) { // Ensure query modifier data is added to the parameters being sent back. var p = null; if (config.rm) { // Get modifier data and use it to override and add values in the options // parameter. Values added to the options param will be send back when // the data store continues loading. p = config.rm(); } if (p) { if (!options) options = {}; for (var ps in p) { // only assign values to the use_object if the value's property name // does not already exist. The main reason for this is start/limit on // paging. if (!Ext.isDefined(options[ps])) { options[ps] = p[ps]; } } } //for(var v in options) alert('before load in the template, ' + v + ' = ' + options[v]); } } }), baseParams: { view: config.view, command: config.command, paramarray: Ext.encode(config.viewParams) }, reader: new Ext.data.JsonReader({ root: 'list', successProperty: 'success', totalProperty: 'count', fields: config.ds }) }); dataview_store.on('load', function(store, records, options) { // When data loads, send the first row's data off to the title callback. if (config.titleCallback && records.length > 0) { config.titleCallback(records[0].data); } }); // A paging toolbar will be created is usePaging is specified in config. var paging_toolbar = config.usePaging != true ? null : new Ext.PagingToolbar({ id: Ext.id(), store: dataview_store, pageSize: config.pageSize, displayInfo: true, prependButtons: true, width: config.width, totalProperty: 'count', items: ['Page Size:', { xtype: 'combo', width: 40, mode: 'local', store: new Ext.data.ArrayStore({ id: 0, fields: ['DisplayPage', 'page_count'], data: [['5', 5], ['10', 10], ['25', 25], ['50', 50]] }), valueField: 'page_count', displayField: 'DisplayPage', editable: false, typeAhead: false, allowBlank: false, mode: 'local', disableKeyFilter: true, triggerAction: 'all', value: config.pageSize, listeners: { scope: this, 'select': function(combo, record, index) { paging_toolbar.pageSize = record.get('page_count'); paging_toolbar.doLoad(paging_toolbar.cursor); } } }] }); // The paging toolbar needs to be registered immediately so that its paging information // can be sent on the first load. if (paging_toolbar != null) { config.pager(paging_toolbar.id); } // adjust a few values if they weren't provided. Ext.applyIf(config, { autoHeight: true, width: 500 }); // Instantiate the data view. var dataview = new Ext.DataView({ id: Ext.id(), autoScroll: true, singleSelect: true, tpl: new Ext.XTemplate(config.template), store: dataview_store, itemSelector: 'div.x-trakkware-selector', overClass: 'trakkware-dataview-item-hover', selectedClass: 'trakkware-dataview-item-selected', width: config.width }); // data view is wrapped in a panel since it is not panel-like. var panel = new Ext.Panel({ tbar: (Ext.isDefined(config.toolbar) ? config.toolbar : null), bbar: (paging_toolbar == null ? null : paging_toolbar), items: dataview, //layout: 'fit', unstyled: true, width: config.width + Trakkware.ViewFramework.getScrollBarWidth(), height: (config.autoHeight == true ? 'auto' : config.height), autoHeight: config.autoHeight, autoScroll: true }); // Perform selection change action if one is set. dataview.on('selectionchange', function(dv, selections) { var selected = selections[0]; if (selected) { var command = selected.getAttribute('command'); var data = Ext.decode(selected.getAttribute('params')); if (command && !Ext.isEmpty(command)) { config.action(command, config.view, data); } config.rs(true, data); } else { config.rs(false, data); } }); // Show a mask when loading. var mask = null; dataview.on('afterrender', function() { mask = new Ext.LoadMask(dataview.id, { msg: 'Loading...', store: dataview_store }); }); // Call the dblclick config method when a row is double clicked. dataview.on('dblclick', function(the_data_view, index, e) { if (config.dblclick) config.dblclick(the_data_view, index, e); }); dataview_store.load(); // Apply methods that the view will use. Ext.apply(panel, { actionDataProvider: function() { var rows = dataview.getSelectedRecords(); // im only allowing for single select currently. if (rows && rows.length > 0) return rows[0].data; }, filterChanged: function(field, value) { // If the filter values is set to empty, // try and eliminate it from the store's // paramarray. This is an artifact of broadcasting // filters. // If the value is not empty, we must replace it in the param array var paramarray_string = dataview_store.baseParams['paramarray']; if (paramarray_string) { var paramarray = Ext.decode(paramarray_string); if (paramarray && paramarray[field]) { if (!Ext.isDefined(value) || value == '' || Ext.isEmpty(value) || value == 'None' || value == 'none') { delete paramarray[field]; } else { paramarray[field] = value; } } paramarray_string = Ext.encode(paramarray); dataview_store.setBaseParam('paramarray', paramarray_string); } //for(var v in dataview_store.baseParams) alert(v + ' = ' + dataview_store.baseParams[v]); dataview_store.load(); }, sortChanged: function() { dataview_store.load(); }, onSearch: function() { dataview_store.load(); }, onActionReload: function() { dataview_store.reload(); }, isSelected: function() { var rs = dataview.getSelectedRecords(); if (rs && rs.length && rs.length > 0) { return true; } return false; } }); return panel; }; }Ext.ns('Trakkware', 'Trakkware.View'); Trakkware.View.FormListLayout = Ext.extend(Ext.Panel, { initComponent: function(config) { Trakkware.View.FormListLayout.superclass.initComponent.call(this, config); // Setup events. this.addEvents('registermodifier', 'modifierchanged', 'broadcast', 'registersemimodalwindow'); this.enableBubble('registersemimodalwindow'); }, // Expected config options: // // items: An items object, Ext-form-style. // Parameters: The parameters object. Specifically .View and .InitialQueryModifiers. // labelAlign: How to align labels on each form item. // ds: An Ext datastore data definition. // Paging related: // usePaging: (true/false) Indicates whether to use paging on this list. // pageSize: (int) A valid pagesize to start at (5/10/25/50 for now) // DoubleClick: An object describing the behavior that occurs when a form item is double clicked. // use { ViewName: '', Command: '' } // ModifierConfirmation: // An object that indicates what to do when there are dirty forms and a query modifier changes. // UseFullViewRefresh: Will be passed to the store. Indicates that refreshs cause the entire view to reload not just data. constructor: function(config) { // easy access var. var panel = this; config.ViewObject = this; // Adjust view size. var sizing=config.SubviewSizing||config.DefaultSizing; config=Trakkware.ViewFramework.ApplySizing(config,sizing); // add trakkware view functionality. Trakkware.View(this, config); // Set initial modifiers for the store. config.qm = config.Parameters.InitialQueryModifiers; config.ib = config.Parameters.InitialState; config.StoreOwner = this; // Get a store for this list. var datastore = new Trakkware.View.Store(config); // When the data is loaded, redo title. datastore.on('load', function(store, records, option) { if (records.length > 0) { if(config.isSubview != true) { var title_data = records[0].data; panel.applyTitle(config.TitleTemplate, title_data); } } }); // Relay these store events. this.relayEvents(datastore, ['emptydataset']); // Listen for reloadview. this.on('reloadview', function(data) { datastore.reload_params = data; datastore.reload(); }); // Catch broadcasts and give them to the store. this.on('broadcast', function(broadcast_config) { var result = datastore.fireEvent('broadcast', broadcast_config); }); // Get mask from the datastore and fire it on this. datastore.on('mask', function(mask_config) { panel.fireEvent('mask', mask_config); }); // pass performactionondirties on to this view. datastore.on('performactionondirties', function(dirty_config) { panel.fireEvent('performactionondirties', dirty_config); }); // Store config.items here so it can be reused when creating form items. var formitems = config.items; // A paging toolbar will be created is usePaging is specified in config. var paging_toolbar = config.usePaging != true ? null : new Ext.PagingToolbar({ id: Ext.id(), store: datastore, pageSize: config.pageSize, displayInfo: true, prependButtons: true, totalProperty: 'count', items: ['Page Size:', { xtype: 'combo', width: 40, mode: 'local', store: new Ext.data.ArrayStore({ id: 0, fields: ['DisplayPage', 'page_count'], data: [['5', 5], ['10', 10], ['25', 25], ['50', 50]] }), valueField: 'page_count', displayField: 'DisplayPage', editable: false, typeAhead: false, allowBlank: false, mode: 'local', disableKeyFilter: true, triggerAction: 'all', value: config.pageSize, listeners: { scope: this, 'select': function(combo, record, index) { paging_toolbar.pageSize = record.get('page_count'); paging_toolbar.doLoad(paging_toolbar.cursor); } } } ] }); // register the pager. if (paging_toolbar != null) { datastore.fireEvent('registermodifier', { control: paging_toolbar, type: 'pager', getValue: function() { var limit = paging_toolbar.pageSize; var t = paging_toolbar; start = (Math.ceil((t.cursor + t.pageSize) / t.pageSize) - 1) * t.pageSize; return { start: start, limit: limit }; } }); } // Takes a command and data and reloads this view with them. // Expected config options: // Command: The new command // Data: Additional data to include function reload(reload_config) { if (Trakkware.ViewFramework.requireOption(reload_config, 'Command', 'Trakkware.View.FormListLayout.reload') == false) return; if (Trakkware.ViewFramework.requireOption(reload_config, 'Data', 'Trakkware.View.FormListLayout.reload') == false) return; // Apply config.Data to the view config. config = Ext.apply(config.Parameters.View, reload_config.Data); datastore.load(); } // Method that gets called when the store loads. function onStoreLoad(store, records, options) { // When data loads, send the first row's data to the title setter. var title_data = {}; if (records.length > 0) title_data = records[0].data; if(config.isSubview != true) panel.applyTitle(config.TitleTemplate, title_data); // Remove all existing items from the listing panel and add the new ones. panel.removeAll(true); // dump old transactions. panel.resetTransactionals(); panel.resetDirtyables(); // If there was data, fill it. Otherwise show the empty text. if (records && records.length > 0) { var group = store.getCurrentGroup(); var group_val = null; var index = 0; Ext.each(records, function(record) { // Get data from the record. var data = record.data; data.json = record.json; if(config.ReportMode === true) { var d = []; Ext.each(records, function(r) { d.push(Ext.apply(r.data, r.json)); }); data.data = d; } // Insert list information into the data. data.__list_count = records.length; // Insert the current group into data. data.CurrentGroup = group; if (config.GroupHeaders && group != null && config.GroupHeaders[group] && data[group] != group_val) { group_val = data[group]; var xt = new Ext.XTemplate(config.GroupHeaders[group]); var template_panel = new Ext.Panel({ unstyled: true, border: false, autoHeight: true, listeners: { afterrender: function(cmp) { xt.overwrite(cmp.getEl(), data); } } }); template_panel.isDirty = function() { return false; } template_panel.getData = function() { return {} } template_panel.findControl = function() { return null; } template_panel.transactionRevoke = function() { } panel.add(template_panel); } // Creates and adds a new form item to the panel. panel.addFormItemToPanel(data, index); index++; if(config.ReportMode === true) return false; }); } else { // Create a panel with the empty dataset text and add it to this control. var empty_panel = new Ext.Panel({ html: config.EmptyDatasetText, anchor: '99%, 99%', datafield: 'empty text panel' }); panel.add(empty_panel); } panel.doLayout(); } // Takes a new formitem and adds it to this panel at the end. panel.addFormItemToPanel = function(data, index) { // Check if there is an empty text panel and remove if so. if (panel.items.length == 1) { var remove_all = false; panel.items.each(function(item) { if (item.datafield == 'empty text panel') { remove_all = true; return false; } }); if (remove_all === true) { panel.removeAll(true); } } // Create a new and add it.. var form = createFormItem(config, data, index); // Check for alternate coloring. if(!Ext.isEmpty(config.AlternateRowColor) && index %2 == 0) { form.on('afterrender', function(f) { f.el.setStyle({ 'background-color': config.AlternateRowColor}); }); } panel.add(form); panel.doLayout(); // Register this new form.. panel.fireEvent('registerdirtyable', form); return form; } function createFormItem(config, data, index) { if (!Ext.isDefined(data['index'])) data['index'] = index; var form = new Ext.Container({ layout: 'form', id: Ext.id(), hideBorders: (config.unstyled || false), unstyled: (config.unstyled || false), autoHeight: true, labelAlign: config.labelAlign ? config.labelAlign : 'left', items: formitems, cls: (config.cls || ''), listeners: { controlsloaded: function(data) { Ext.each(form._registered_picklists, function(picklist) { picklist.fireEvent('react', data); }); }, picklistreaction: function(property_name, new_value, reactions) { Ext.each(form._registered_picklists, function(picklist) { if (reactions.indexOf(picklist.datafield) > -1) { var data = {}; data[property_name] = new_value; picklist.fireEvent('react', data); } }); return false; }, resetdirty: function(originating_view) { // NOTE: Taken from the 'resetdirty' handler in Trakkware.View. // Un-dirty anything in the dirtyable list. Ext.each(form._registered_dirtyables, function(item) { // Ext.util.Observable.hasEvents would be nice.... var evt = item.events['resetdirty']; var hasevent = Ext.isObject(evt) || (evt === true); // Any dirtyable that has the reset dirty event, pass it on! if (hasevent == true) { item.fireEvent('resetdirty', form); } else if (item.getValue) { // Things like textfields and combos have originalValue and getValue, so // use them to trick themselves in to thinking they are no longer dirty. item.originalValue = item.getValue(); } }); }, registerdirtyable: function(control) { form._registered_dirtyables.push(control); return false; }, registersubview: function(subview) { form._registered_subviews.push(subview); return false; }, registerdatafield: function(control) { form._registered_datafields.push(control); if (control.getXType && control.getXType() == 'trakkware_combopicklist') { form._registered_picklists.push(control); } return false; }, afterrender: function() { form.getEl().addClassOnOver('trakkware-select-row'); // Store this form's data off for later use. form.DataItem = data; // Fill the cloned fields with values. setFieldValues(form, form.findBy( function(cmp, container) { if (cmp.datafield) { form.fireEvent('registerdatafield', cmp); return true; } } ), data ); // Get buttons and attach this form to them. Ext.each( form.findBy( function(cmp, container) { if (cmp.datafield) { return true; } } ), function(control) { attachControlToForm(control, form); } ); // Let picklists load. form.fireEvent('controlsloaded', data); // Finally, register a dbl click event. form.getEl().addListener('dblclick', function(e) { if (config.DoubleClick) { // Need to make a "control" here that contains an attachedToForm that is THIS form item. var control = { attachedToForm: form }; panel.actionHandler(control, { ViewName: config.DoubleClick.ViewName, Command: config.DoubleClick.Command, Parameters: config.Parameters }); } }); } } }); // Takes a control and form, and sets the control's .attachedToForm property to the form. // This is necessary because we have many forms and many cobntrols and when a button is clicked or a control dirtied (when autosave), // it needs to get data from the correct form. function attachControlToForm(control, form) { if (control && form) { control.attachedToForm = form; } } var _in_revoke = false; form.InRevoke = function(in_revoke) { if (in_revoke) _in_revoke = in_revoke; return _in_revoke; } form._registered_dirtyables = []; form._registered_datafields = []; form._registered_picklists = []; form._registered_subviews = []; // Keeps us from re-registering dirties on reload. form.dirties = false; // Enable dirty events and allow them to bubble up to the containing view. form.addEvents('dirty', 'causesfieldchange'); form.enableBubble('dirty', 'causesfieldchange'); // Checks if this form item is currently dirty. form.isDirty = function() { var result = false; Ext.each(form._registered_dirtyables, function(control) { var is_dirty = control.isDirty(); if (is_dirty == true) { result = true; return false; } }); return result; } // Add a method for getting data from this form. form.getData = function() { // Get data fields from this form. These are fields with a property called // datafield set to a propertyname and having a method called getValue(); // The data STARTS as the data that was provided TO the form originally, so values // will be overwritten with newer data in the form's controls. var data = form.DataItem ? form.DataItem : {}; Ext.each(form._registered_datafields, function(field) { var xtype = field.getXType ? field.getXType() : 'unknown'; if (xtype != 'trakkware_template' && xtype !== 'trakkware_popup') { var datafield = field['datafield']; try { var value = field.getValue(); } catch(e) { alert('got an error trying to get value:\r\n' + field.getValue); } // If the fields value is the same as an innerLabel value, then it is actually empty. if (value == field.innerLabel) value = ''; // The getValue method for radiogroups returns the radio button that is checked. else if (field.getXType && field.getXType() == 'radiogroup') value = value.inputValue; // Format date fields. if (field.is_date === true) { value = new Date(value); } data[datafield] = value; } } ); Ext.each(form._registered_subviews, function(subview) { var list = subview.getValue(); if (list) data[subview.datafield] = list; }); return data; } form.findControl = function(property_name) { Ext.each(form.findBy(function(thing) { return (Ext.isDefined(thing.datafield) && Ext.isFunction(thing.getValue)); }), function(field) { if (field.datafield == property_name) return field; }); return null; } // Performs local duties for special action invocation. // This is the method that INVOKES special behaviors. The one that REVOKES these // behaviors (for undoing) is down below.. transactionRevoke() form.specialInvoke = function(control, command, invoke_behavior, invoke_parameters, revoke_text) { // add a new record. if (invoke_behavior == 10) { // Add a new form to the panel. var newform = panel.addFormItemToPanel(invoke_parameters, 0); panel.doLayout(); var focus_field = Trakkware.ViewFramework.findTextOrCombo(newform); if (focus_field != null) { var f = function() { focus_field.focus(); }; f.defer(50); } } else if (invoke_behavior == 20) { _in_revoke = true; form.hide(); } else if (invoke_behavior == 30) { _in_revoke = true; form.disable(true); } else if (invoke_behavior == 40) { _in_revoke = true; // Disable all items on the form with the exception of the button that caused the action if revoke text is specified. Ext.each(form.findBy(function(control) { if (control && control.datafield) return true; return false; }), function(item) { if (item == control && !Ext.isEmpty(revoke_text)) { // When we find the button, and revoke text has been specified, set the button's text and DO NOT // disable it. Instead, set .causes_revoke to true so next time its clicked it will revoke the // behavior it caused. var width = control.getWidth(); control.text_on_revoke = control.getText(); control.setText(revoke_text); control.causes_revoke = true; control.setWidth(width); } else if (item.disable) { item.disable(true); } }); } return true; } form.transactionRevoke = function(invoke_behavior, button) { _in_revoke = false; if (invoke_behavior == 10) { alert('Undoing add new is not supported.'); } else if (invoke_behavior == 20) { form.show(); } else if (invoke_behavior == 30) { form.enable(true); } else if (invoke_behavior == 40) { // Disable all items on the form with the exception of the button that caused the action if revoke text is specified. Ext.each(form.findBy(function(control) { if (control && control.datafield) return true; return false; }), function(item) { if (item == button) { var width = button.getWidth(); button.causes_revoke = undefined; // Change the button text back.. if (button.text_on_revoke) { button.setText(button.text_on_revoke); button.text_on_revoke = undefined; } button.setWidth(width); } else if (item.enable) { item.enable(true); } }); } // Important to return the fact that everything was cool. return true; } return form; } // private method: Gets an array of the fields on this form that are datafields. function getDataFields(form) { var fields = []; Ext.each(form.findBy(function(thing) { return (Ext.isDefined(thing.datafield) && Ext.isFunction(thing.getValue)); }), function(field) { fields.push(field); }); return fields; } // Takes a set of fields and sets them with data using each field's datafield property to get the property from the provided data object. function setFieldValues(form, fields, data) { // Keeps track of sub views. var subs = []; // Template data has internal params applied. var template_data = data; // Apply internal view parameters that don't already exist in the dataset. if (config.Parameters && config.Parameters.Internal) { Ext.iterate(config.Parameters.Internal, function(p) { if (!data[p]) { data[p] = config.Parameters.Internal[p]; } }); } // Holds data that will be passed to subviews. var subview_data = {}; // Fill the cloned fields with values. Ext.each(fields, function(field) { // Get several pieces of info about this field.. var datafield = field.datafield; // Deal with show on and hide this control if necessary. if(field.ShowOn !== null) { var showon = Trakkware.ViewFramework.ProcessShowOn(field.ShowOn, data); if(showon === 'hide') { // Try to hide.. if all else fails, forget it and move on. Wasn't meant to be. if(Ext.isFunction(field.hide)) field.hide(); else if(Ext.isFunction(field.setStyles)) field.setStyles({ display: 'none' }); return; } } // Register this thing as dirtyable. var xtype = field.getXType ? field.getXType() : null; if(xtype == 'hidden') { // do nothing } else { if(form.dirties === false) { form.fireEvent('registerdirtyable', field); } } // Register events on the field. field.addEvents('dirty', 'causesfieldchange'); field.enableBubble('dirty', 'causesfieldchange'); var xtype = (field.getXType ? field.getXType() : null); if (xtype == 'trakkware_subview') { subs.push(field); } else { if(Ext.isDefined(data[datafield]) === true || xtype == 'trakkware_button') { var the_value = data[datafield]; var requires_all = Trakkware.ViewFramework.requiresAllData(xtype); if (requires_all == true || Ext.isDefined(the_value) || the_value === null) { if (Ext.isDefined(the_value) && the_value) { // hack for the massive confusion of javascript + extJS + Microsoft JSON serializer. if (the_value.indexOf && the_value.indexOf('Date(') > -1) { the_value = eval('new ' + the_value.replace('/', '').replace('/', '')); // Set this for later.. I'm having trouble getting dates in a format that .NET and Ext/JS are all happy with. field.is_date = true; } } // Checkbox needs to be set in a specific manner so dirty stuff doesn't fire. if (xtype == 'checkboxgroup') { field.originalValue = null; field.setValue(the_value); } else { // Templated fields need ALL data given to them. if (requires_all == true) { field.setValue(template_data, field); field.originalValue = field.getValue(); } else { // I don't like doing this here.. :/ Convert true/false to string "true" or "false" since that is what all my picklists use as values: string. if(xtype == 'trakkware_combopicklist' || xtype == 'combo') { if(Ext.isBoolean(the_value) || Ext.isNumber(the_value)) the_value = the_value + ''; } // Setting null to textfields causes them to report isDirty() true before they are dirty // probably because '' and null are not equal and therefore the field is dirty. if (the_value != null || xtype == 'trakkware_tree') { field.setValue(the_value, field); field.originalValue = field.getValue(); } } } // I had to do this here.. not sure how to do it right in the picklist object. if(field.ShowOn != null) { Trakkware.ViewFramework.ProcessShowOn(field, field.ShowOn, template_data); } if(field.DisableOn != null) { Trakkware.ViewFramework.ProcessDisableOn(field, field.DisableOn, template_data); } if (xtype !== 'trakkware_template' && xtype !== 'trakkware_popup') { subview_data[datafield] = the_value; } // lastly, remove althe inner-label class just in case this is a text field with inner labelling field.removeClass('trakkware-textfield-inner-label'); } } } }); Ext.each(subs, function(subview) { subview.setValue(subview_data); }); form.dirties = true; } // used to keep paging confirmation changes from forming infinite "Are you sure?" loops. var in_confirmation = false; // Construct a toolbar from config settings. var toolbar = null if (config.toolbar) toolbar = this.constructToolbar(config.toolbar); // Apply additional config options for the panel. config = Ext.apply(config, { // This is why I store the var 'formitems' at the top.. items sent to the panel needs to be empty array. items: [], ui: Ext.id(), tbar: toolbar, bbar: paging_toolbar, collapsible: false, closable: false, layout: 'fit', unstyled: (config.unstyled || false), hideBorders: (config.unstyled || false), autoScroll: true, border: false, anchor: '95%', listeners: { broadcastmodifiers: function(broadcast_config) { datastore.fireEvent('broadcastmodifiers', broadcast_config); }, registermodifier: function(modifier_config) { datastore.fireEvent('registermodifier', modifier_config); return false; }, afterrender: function(panel) { // If this list is inside a tabpanel, hide it's title. if (panel.ownerCt && panel.ownerCt.ownerCt && panel.ownerCt.ownerCt.ownerCt && panel.ownerCt.ownerCt.ownerCt.getXType() == 'tabpanel') { panel.header.setHeight(0); panel.header.hide(); } } } }); // I don't want the entire form to take this class, just the individual form list items. var cls = config.cls; delete config.cls; Trakkware.View.FormListLayout.superclass.constructor.call(this, config); config.cls = cls; // Apply methods that the view will use. Ext.apply(panel, { specialInvoke: function(control, command, invoke_behavior, invoke_parameters, revoke_text) { // add a new record. if (invoke_behavior == 10) { // Add a new form to the panel. var newform = panel.addFormItemToPanel(invoke_parameters, 0); panel.doLayout(); var focus_field = Trakkware.ViewFramework.findTextOrCombo(newform); if (focus_field != null) { var f = function() { focus_field.focus(); }; f.defer(50); } } // Return true so that dirty happens!~!! return true; }, // Given a property, returns the control associated with it. findControl: function(property_name) { Ext.each(form.findBy(function(thing) { return (Ext.isDefined(thing.datafield) && Ext.isFunction(thing.getValue)); }), function(field) { if (field.datafield == property_name) return field; }); return null; }, isSelected: function() { /*var rs = formlist.getSelectedRecords(); if (rs && rs.length && rs.length > 0) { return true; } return false; */ }, actionDataProvider: function() { var data = []; panel.items.each(function(formitem) { if(formitem.getData) data.push(formitem.getData()); }); return data; }, performActionOnDirtyRecords: function(command) { var ii = 0; panel.items.each(function(form_item) { if (form_item && form_item.isDirty() == true) { var data = form_item.getData(); config.action(command, config.view, data, true, null, function(transactions) { if (transactions && transactions.length) { Trakkware.ViewFramework.commitTransaction(config.view, null, transactions, config, function() { // for now do nothing on success? }); } }); } }); }, getListeningModifierNames: datastore.getListeningModifierNames }); // Attach a load listener. datastore.on('load', onStoreLoad); // Finally, register and load this view. panel.on('afterrender', function() { datastore.load(); panel.registerForState(); }); } }); Ext.ns('Trakkware', 'Trakkware.View'); Trakkware.View.PieChartLayout = Ext.extend(Ext.Panel, { initComponent: function(config) { Trakkware.View.PieChartLayout.superclass.initComponent.call(this, config); // Set up events. this.addEvents('registermodifier', 'modifierchanged', 'broadcast', 'registersemimodalwindow'); this.enableBubble('registersemimodalwindow'); }, // // Expected config options: // // Parameters: The parameters object. Parameters.View is used to load forms. // fields: A data definition for this form's data reader. // items: The form's ui items. // // hasUploads: Indicates that this form contains upload fields and therefore must be submitted differently. // toolbar: A toolbar config object. // labelAlign: Indicates how labels should be aligned for this form's items. // DefaultSizing, SubviewSizing: How to size this form. constructor: function(config) { // Immediately attach Trakkware.View functionality. Trakkware.View(this, config); // Construct a toolbar if provided. var toolbar = null if (config.toolbar) toolbar = this.constructToolbar(config.toolbar); // Nice references: var this_chart = this; // A couple store settings. config.qm = config.Parameters.InitialQueryModifiers; config.ib = config.Parameters.InitialState; config.StoreOwner = this; var sizing = config.SubviewSizing || config.DefaultSizing; config = Trakkware.ViewFramework.ApplySizing(config, sizing); // Create a store. var datastore = new Trakkware.View.Store(config); datastore.on('load', function(store, records, options) { if(records.length > 0) { // Get colors. var colors = []; Ext.each(records, function(record) { var data = record.data; if(data.Color) colors.push(data.Color); }); var piechart = { xtype: 'piechart', data: records, store: datastore, dataField: config.DataPropertyName, categoryField: config.CategoryPropertyName, series: [{ style: { colors: colors } }], extraStyle: { legend: { display: 'bottom', padding: 5, font: { family: 'Tahoma', size: 13 } } } } this_chart.add(piechart); } else { this_chart.add({ xtype: 'panel', html: config.EmptyText, unstyled: true, hideBorders: true }); } this_chart.doLayout(); }); // add formpanel-related config options. config = Ext.apply(config, { id: (config.ControlID ? config.ControlID : Ext.id()), autoScroll: true, items: [], labelAlign: config.labelAlign ? config.labelAlign : 'top', tbar: toolbar, unstyled: (config.unstyled || false), hideBorders: (config.unstyled || false), padding: '0 0 0 5px', closable: false, listeners: { // Load the form and register it for broadcasting after this control renders. afterrender: function(form) { datastore.load(); this.registerForState(); } } }); // Call the superclass' constructor. Trakkware.View.PieChartLayout.superclass.constructor.call(this, config); } }); Ext.reg('trakkware_piechart', Trakkware.View.PieChartLayout); //Ext.ns('Trakkware', 'Trakkware.View'); Trakkware.View.WindowManager=Ext.extend(Ext.util.Observable,{ // config options // // DefaultSizing: Sizing options to use to determine window sizing. // cascade (true/false) When set to true, windows will be cascaded from the active window out. // cascadePositionContainer: A container which is used to get a starting position for cascading windows. constructor: function(config) { var me=this; // PRIVATE // The window group used to do the heavy lifting of this window manager. var mgr = new Ext.WindowGroup(); // Ensure the global window manager has a very high zseed. Otherwise Msg alerts appear behind our windows. Ext.WindowMgr.zseed = 15000; // Takes a rendered view object and adjusts the window it is using to its size. function makeWindowAdjustment(window,rendered_view,top,left) { var x=left; var y=top; // Perform cascade positioning first. if(config.cascade==true) { var active=mgr.getActive(); if(active) { var pos=active.getPosition(); x=pos[0]+4; y=pos[1]+26; } else { // When either top or left is unknown and we have a positioning object, use it! if((!x||!y)&&config.cascadePositionContainer) { // Derive a starting position. Made to work with TabManager currently. var pos=config.cascadePositionContainer.getPosition(); x=pos[0]+3; y=pos[1]+28; } } } var width=rendered_view.getWidth(); //Trakkware.ViewFramework.SCROLLBAR_WIDTH; var height=rendered_view.getHeight(); // +Trakkware.ViewFramework.SCROLLBAR_WIDTH; // Sometimes we have a view which likes to autoheight, but gets stuffed into a window. In this case, height will come // back as zero, so use the Height value. //alert(Ext.encode(config.DefaultSizing)); if(height==0&&config.DefaultSizing) height=config.DefaultSizing.Height; var body_size=Ext.getBody().getViewSize(); if(x) body_size.width+= -x; if(y) body_size.height+= -y; var auto_scroll=false; if(width>body_size.width) { width=body_size.width-Trakkware.ViewFramework.SCROLLBAR_WIDTH; auto_scroll=true; } if(height>body_size.height) { height=body_size.height-Trakkware.ViewFramework.SCROLLBAR_WIDTH; auto_scroll=true; } if(x&&y) { window.setPosition(x,y); } window.setSize({ width: width,height: height }); if(auto_scroll===true) window.setAutoScroll(true); } Trakkware.View.WindowManager.superclass.constructor.call(this,config); // Create an event for alerting the user of WindowManager when a window is added or removed. me.addEvents('windowchange'); Ext.apply(this,{ // config: // // view: The view object to use. // launch: How to launch this view. // modalParent: A parent object to modalize. // header: (true/false) Whether to show a header for this window. // closable: Indicates this window should show a closing X. // replace: (true/false) Indicates this window should replace the currently active window. // Basically, this just closes the currently active window and shows this one. // parentRefreshView: A view object that 'refresh' will be passed to when this view object hears refresh. // Used for passing around a view who launched a window which passed control to another window, which then needs to refresh a parent after an action. addView: function(config) { config.view.setWindowMgr(me); // Get the active window so i can be modalized after render. var modal_parent = mgr.getActive(); if(modal_parent == null) modal_parent = config.modalParent; // Capture the parent object which will get refresh events if they come through. var refresh_parent = config.parentRefreshView; // Houses the mask which is currently active on this window. var mask = null; var window=new Ext.Window({ width: 0, height: 0, autoHeight: false, layout: 'fit', items: [config.view], manager: mgr, title: (config.header == true ? null : 'loading...'), header: config.header, closable: (config.header == false ? false : (config.closable || true)), listeners: { cancelview: function(view) { // Close the window when a view cancels itself. window.close(); }, activate: function(activated) { // When a semimodal window is activated, reorder windows. function sendback() { if(mask) { mgr.sendToBack(activated); } } sendback.defer(250); }, afterrender: function(rendered_window) { // Check for replacement option. if(config.replace == true) { // We need to try to get the modal parent for this window's modal parent. // This parent replaces this window's parent so we demodalize the correct thing on destroy. var new_parent = null; if(modal_parent.getModalParent) new_parent = modal_parent.getModalParent(); // Remove the parent's parent so it doesn't de-modalize and then close. modal_parent.setModalParent(null); modal_parent.close(); // Pass this view's parent refresh object on to this replacement view. rendered_window.setParentRefreshObject(modal_parent.getParentRefreshObject()); // And replace it. modal_parent = new_parent; } else { if(modal_parent) { // Semimodalize the window that was active before this one or the parent provided in config. if(Ext.isFunction(modal_parent.makeSemimodal)) modal_parent.makeSemimodal(true); else modal_parent.el.mask(null); } } // Once the window is rendered, wait for the view object to finish // rendering and then call the window size adjustment bits. if(config.view.rendered===true) { makeWindowAdjustment(rendered_window, config.view); } else { config.view.on('afterrender',function(rendered_view) { makeWindowAdjustment(rendered_window, rendered_view); }); } // Since we added a window, throw the event. me.fireEvent('windowchange', me); }, beforedestroy: function(destroyed_window) { // Modal parent might be gone if we did a replace. if(modal_parent != null) { // Revoke the modalizations on this window's predecessor. if(modal_parent.makeSemimodal) modal_parent.makeSemimodal(false); else modal_parent.el.unmask(); } // Unregister the window. mgr.unregister(destroyed_window); // Alert others that our windows have changed. me.fireEvent('windowchange', me); // Reset mask. mask = null; } } }); // Returns true if this window is masked. window.makeSemimodal = function(option) { if(option == true) { mask = window.el.mask(null); } else { window.el.unmask(); mask = null; } } // Returns the thing which is considered the modal parent of this window. // Usually this is the window which launched this window window.getModalParent = function() { return modal_parent; } // Sets the modal parent for this window. Used for control passing. window.setModalParent = function(parent) { modal_parent = parent; } // Sets the view object that will have refresh called on it when this window // receives a "refresh and close" event. window.setParentRefreshObject = function(view) { refresh_parent = view; } // Gets the view object that parent refresh should be passed to. window.getParentRefreshObject = function() { return refresh_parent; } // // Additional window listeners. // // Attach a title listener on this view so when the view sets // its title, this window can set its title to that value. config.view.on('titlechange', function(panel, title) { if(config.header != false) window.setTitle(title); }); // Listen for parent reload and close. This event name is not explicit enough. config.view.on('reloadparentview',function() { refresh_parent.fireEvent('reloadview'); //window.close(); return false; }); window.show(); }, hideAll: function() { mgr.hideAll(); }, showAll: function() { mgr.each(function(window) { window.show(); }); }, // Returns the window count. getCount: function() { var ii = 0; mgr.each(function(window) { ii++; }); return ii; }, destroy: function() { // Destroy each window belonging to this manager. mgr.each(function(window) { delete window; }); delete mgr; } }); } }); Ext.reg('trakkware_windowmgr',Trakkware.View.WindowManager);//Ext.ns('Trakkware', 'Trakkware.View'); Trakkware.View.TabManager = Ext.extend(Ext.TabPanel, { // config options // // homeHtml: HTML to display on the home tab. // dashboardView: The view type of a dashboard to show instead of homeHtml. // cascadeWindows: (true/false) Set to true and windows will be cascaded using the last window's top,left as a starting point. // parentForNonTabs: A tabpanel which will act as the parent for non-tab window launches. constructor: function(config) { var me = this; // PRIVATE // Indicates whether the Tab Manager is busy launching views or not. Used to prevent // the user from building up a huge queue of launches. var _busy = false; // An object used to reference window managers. _manager[tab.id] = WindowManager object. var _managers = {}; // Creates a view from config.dashboardView and inserts it into the panel provided. function createDashboard(panel) { createView({ view: config.dashboardView, command: 'POPULATE', launch: 'inline', callback: function(viewobject) { panel.removeAll(); panel.add(viewobject); panel.setTitle('Dashboard'); panel.doLayout(); } }); } // Looks for a tab with the id specified and activates it if found. // Returns true if found, false if not found. function switchToExistingTab(tabid) { var found = false; me.items.each(function(item) { if(item.tabid == tabid) { found = true; me.activate(item); return false; } }); return found; } // config: // view: name of the view to start with. // command: command to indicates the view's initial state. // parameters: A set of parameters to send to the view when it is created. // launch: ('window'/'inline') Indicates how to launch this initial view it is created. // callback: function is invoked with the viewobject when the object is done being created. function createView(config) { return Trakkware.ViewFramework.createView({ view: config.view, command: config.command, viewParams: config.parameters, callback : config.callback }); } // Takes a view object and launches it accordingly, while also starting a tab // and associated window manager for that tab. function createTab(tabid, viewobject, launch) { // Make launch consistent. launch = (launch || '').toLowerCase(); // setup a panel that will be used for windowed launches. var panel = { html: 'Place Holder', title: '????' }; if(launch === 'inline') { panel = viewobject; } // Add the panel to tabs. // Create a window manager to be used by this tab. var window_manager = new Trakkware.View.WindowManager({ cascade: true, cascadePositionContainer: me }); // Add this view to the window manager. // for now only window launch is handled by the window manager. inlines will sometimes // soon hopefully. if(launch == 'window') { window_manager.addView({ view: viewobject, launch: launch }); } else { var newtab = me.add(panel); newtab.tabid = tabid; // once window manager handles all adds, this line will become obsolete. viewobject.setWindowMgr(window_manager); // activate the new tab. me.activate(newtab); // Clean up when the tab is destroyed. newtab.on('destroy', function(destroyed_tab) { // Remove the reference in the managers list. delete _managers[tabid]; // Get rid of the manager and the panel. window_manager.destroy(); delete window_manager; delete panel; }); // Listen for windowchanges. window_manager.on('windowchange', function(mgr) { var el = me.getTabEl(newtab); var count = mgr.getCount(); // Hide the tab's closing X when there are outstanding windows. if(count == 0) { Ext.get(el).addClass('x-tab-strip-closable'); } else { Ext.get(el).removeClass('x-tab-strip-closable'); } }); // Tie this tab and manager together in the managers array. _managers[tabid] = window_manager; } } // config: // tabid: An identifier that can be used by users of the tab manager to identify tabs. // see createView() for the rest. // returns: A status string: // 'busy' = The manager is busy. // anything else means success. function startNewTab(config) { if(_busy === true) { return 'busy'; } // set the busy status during the creation phase of things. _busy = true; // Create the new view and deal with it. Ext.apply(config, { callback: function(view) { createTab(config.tabid, view, config.launch); _busy = false; } }); createView(config); } Ext.apply(config, { id: Ext.id(), items: [{ xtype: 'panel', items: [{ html: 'Loading Dashboard...' }], listeners: { afterrender: function(panel) { createDashboard(panel); } } }], activeTab: 0, enableTabScroll:true, defaults: { autoScroll:true, closable: true, layout: 'fit', title: 'loading...' }, listeners: { tabchange: function(tabpanel, tab) { // Hide all window managers except the one tied to activated tab. Ext.iterate(_managers, function(id) { if(tab.tabid != id) _managers[id].hideAll(); else _managers[id].showAll(); }); } } }); Trakkware.View.TabManager.superclass.constructor.call(this, config); Ext.apply(this, { // Switches the focus to the id provided if it is already a tab, // otherwise creates a tab based on the information in config. // config: // see launchNewTab() switchTo: function(tabid, config) { if(switchToExistingTab(tabid) == false) { Ext.apply(config, { tabid: tabid }); startNewTab(config); } } }); } }); Ext.reg('trakkware_tabmgr', Trakkware.View.TabManager);/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.Mask = { repeatType:[ ['no', 'Not Repeat'], ['day', 'Daily'], ['week', 'Weekly'], ['month', 'Monthly'], ['year', 'Yearly'] ], colors: ['668CD9', 'D96666', '59BFB3', 'F2A442', '4CB052', 'B373B3'], colorIndex: ["blue", "red", "cyan", "orange", "green", "purple"], getColorByIndex:function(colorIndex){ var mask = Ext.ux.calendar.Mask; for(var i = 0, len = mask.colorIndex.length; i < len; i++){ if(colorIndex == mask.colorIndex[i]){ return mask.colors[i]; } } return null; }, getIndexByColor:function(color){ var mask = Ext.ux.calendar.Mask; for(var i = 0, len = mask.colors.length; i < len; i++){ if(color == mask.colors[i]){ return mask.colorIndex[i]; } } return null; }, getRepeatTypeStore:function() { var store = new Ext.data.SimpleStore({ fields:['value', 'display'], data:Ext.ux.calendar.Mask.repeatType }); return store; }, getEventStore:function(url){ var store = new Ext.data.GroupingStore({ proxy: new Ext.data.HttpProxy({ url: url }), reader:new Ext.data.JsonReader({ root: 'list', //'results', // TRAKKWARE id: 'id', totalProperty: 'count'//'total' // TRAKKWARE }, [ {name: "id"}, {name: "calendarId"}, {name: "startTime"}, {name: "endTime"}, {name: "subject"}, {name: "description"}, {name: "ymd"}, {name: "eymd"}, {name: "color"}, {name: "isShared"}, {name: "alertFlag"}, {name: "locked"}, {name: "repeatType"} ]), sortInfo:{field: 'ymd', direction: "DESC"}, groupField:'ymd' }); return store; }, getCalendarStore:function(){ var store = new Ext.data.SimpleStore({ fields:['id', 'title', 'description', 'color'], data:[] }); return store; }, getHourFormatStore:function(){ var lan = Ext.ux.calendar.Mask.Mask; var store = new Ext.data.SimpleStore({ fields:['id', 'text'], data:[ ['12', lan['12Hours']], ['24', lan['24Hours']] ] }); return store; }, getLanguageConfig:function(){ /* * you can change the data here, add/substract languages. But notice you need have the related file under multi-language folder first; * For example, ['en_US', 'American English'], this means there is a file named en_US.js under multi-language folder */ var lan = Ext.ux.calendar.Mask.Mask; var data = [ ['en_US', lan['en_US']], ['fr', lan['fr']], ['it', lan['it']], ['nl', lan['nl']], ['pl', lan['pl']], ['pt', lan['pt']], ['zh_CN', lan['zh_CN']] ]; var store = new Ext.data.SimpleStore({ fields:['name', 'display'], data:data }); return { data:data, store:store }; }, parseHM:function(hm){ var h, m; var parts = hm.split(':'); h = parts[0]; if('0' == h.charAt(0)){ h = h.charAt(1); } h = parseInt(h); m = parts[1]; if('0' == m.charAt(0)){ m = m.charAt(1); } m = parseInt(m); return { h:h, m:m }; }, calculateActiveRow:function(cs){ var obj = {}; var hm = this.parseHM(cs.activeStartTime); var st = hm.h*60+hm.m; hm = this.parseHM(cs.activeEndTime); var et = hm.h*60+hm.m; obj.intervalSlot = parseInt(cs.intervalSlot); obj.rowCount = 24*60/obj.intervalSlot; obj.activeStartRow = Math.floor(st/obj.intervalSlot); obj.activeEndRow = Math.floor(et/obj.intervalSlot); obj.numInHour = Math.floor(60/obj.intervalSlot); delete(cs['id']); delete(cs['class']); obj = Ext.apply(obj, cs); obj.startDay = parseInt(obj.startDay); obj.startRow = 0; obj.endRow = obj.rowCount; if(obj.hideInactiveRow){ obj.startRow = obj.activeStartRow; obj.endRow = obj.activeEndRow; } return obj; }, getTimeStore:function(){ var store = new Ext.data.SimpleStore({ fields:['row', 'hour'], data:[] }); return store; }, getHMFromRow:function(intervalSlot, row, hourFormat){ var m = intervalSlot*row; var h = Math.floor(m/60); m = m%60; if(10 > m){ m = '0'+m; } if(10 > h){ h = '0'+h; } var s = h+':'+m; if('12' == hourFormat){ var dt = Date.parseDate(h+':'+m, 'H:i'); s = dt.format('h:i A'); } return s; }, generateIntervalData:function(intervalSlot, start, end, hourFormat){ var num = Math.floor(24*60/intervalSlot); start = start || 0; end = end || num; var data = []; for(var i = start; i <= end; i++){ var o = []; o.push(i); var s = this.getHMFromRow(intervalSlot, i, hourFormat); o.push(s); data.push(o); } return data; }, getIntervalFromRow:function(intervalSlot, row, hourFormat){ var m = intervalSlot*row; var h = Math.floor(m/60); m = m%60; if(10 > m){ m = '0'+m; } if(10 > h){ h = '0'+h; } var s = h+':'+m; if('12' == hourFormat){ var dt = Date.parseDate(h+':'+m, 'H:i'); s = dt.format('h:i A'); } return s; }, getRowFromHM: function(hm, intervalSlot) { if('23:59' == hm){ hm = '24:00'; } hm = Ext.ux.calendar.Mask.parseHM(hm); var row = Math.round(hm.h*60/intervalSlot+hm.m/intervalSlot); return row; }, getEDStore:function(){ var lan = Ext.ux.calendar.Mask.Mask; var store = new Ext.data.SimpleStore({ fields:['value', 'display'], data:[ [true, lan['enable']], [false, lan['disable']] ] }); return store; }, getStartDayStore:function(){ var lan = Ext.ux.calendar.Mask.Mask; var store = new Ext.data.SimpleStore({ fields:['value', 'display'], data:[ [0, lan['sunday']], [1, lan['monday']] ] }); return store; }, getIntervalStore:function(){ var lan = Ext.ux.calendar.Mask.Mask; var store = new Ext.data.SimpleStore({ fields:['value', 'display'], data:[ [10, '10 '+lan['minute']], [15, '15 '+lan['minute']], [20, '20 '+lan['minute']], [30, '30 '+lan['minute']], [60, '60 '+lan['minute']] ] }); return store; }, getDayOffset:function(sday, eday){ if(!(sday instanceof Date)){ sday = Date.parseDate(sday, 'Y-m-d'); } if(!(eday instanceof Date)){ eday = Date.parseDate(eday, 'Y-m-d'); } var offset = sday.getElapsed(eday); offset = Math.round(offset/(3600000*24)); return offset; }, getWeekDayInMonth:function(date){ var n = date.format('N'); var d = date.format('d'); var w = Math.floor((d-n)/7)+1; var wd = date.format('l'); var str = 'the '+w; if(1 == w){ str += 'st'; }else if(2 == w){ str += 'nd'; }else if(3 == w){ str += 'rd'; }else{ str += 'th'; } return str+' '+wd; }, getIntervalText:function(rtype, intervalSlot){ var str = ''; if('day' == rtype){ if(1 == intervalSlot){ str = 'Everyday'; }else{ str = 'Every '+intervalSlot+' days'; } }else if('week' == rtype){ if(1 == intervalSlot){ str = 'Every week at '; }else{ str = 'Every '+intervalSlot+' weeks at '; } }else if('month' == rtype){ if(1 == intervalSlot){ str = 'Every month at '; }else{ str = 'Every '+intervalSlot+' months at '; } }else if('year' == rtype){ if(1 == intervalSlot){ str = 'Every year at '; }else{ str = 'Every '+intervalSlot+' years at '; } } return str; }, getPermitStore:function(){ var lan = Ext.ux.calendar.Mask.Mask; var store = new Ext.data.SimpleStore({ fields:['value', 'display'], data:lan['permitData'] }); return store; }, getUserStore:function(){ var store = new Ext.data.Store({ proxy:new Ext.data.HttpProxy({ url:Ext.ux.calendar.CONST.listUserURL }), reader:new Ext.data.JsonReader({ root: 'results', id: 'id', totalProperty: 'total' }, [ {name: "id"}, {name: "username"}, {name: "email"} ]) }); return store; } };/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.Language = { // please help to transfer words after :. Thanks 'CalendarWin':{ 'title':'FeyaSoft MyCalendar 2.0.0', 'loadMask.msg':'Please wait...' }, 'SharingPopup':{ 'title':'Sharing Calendar' }, 'MainPanel': { 'loadMask.msg': 'Loading...' }, 'CalendarContainer':{ 'todayBtn.text':'Today', 'dayBtn.text':'Day view', 'weekBtn.text':'Week view', 'monthBtn.text':'Month view', 'weekMenu.showAll.text':'Show All', 'weekMenu.onlyWeek.text':'Only Weekday', 'monthMenu.showAll.text':'Show All', 'monthMenu.onlyWeek.text':'Only Weekday', 'moreMenu.setting.text':'Setting', 'moreMenu.about.text':'About FeyaSoft MyCalendar', 'moreBtn.text':'More', 'searchCriteria.text':'Search', 'moreMenu.showAlert.text':'Activate Alert Function', 'moreMenu.language.text':'Language Setting' }, 'WestPanel':{ 'myCalendarPanel.title':'My Calendar', 'otherCalendarPanel.title':'Other Calendar', 'myShowAllBtn.text':'Show All', 'myAddBtn.text':'New' }, 'EventHandler':{ 'showOnlyItem.text':'Show this only', 'viewItem.hide.text':'Hide calendar', 'viewItem.show.text':'Show calendar', 'editItem.text':'Edit calendar', 'deleteItem.text':'Delete calendar', 'clearItem.text':'Empty calendar', 'wholeDay':'Whole day', 'untitled':'Untitled', 'unlockItem.text':'Unlock', 'lockItem.text':'Lock', 'editEvent.title':'Edit Event', 'deleteEvent.title':'Delete Event', 'more':'More', 'deleteRepeatPopup.title':'Confirm', 'deleteRepeatPopup.msg':'Click "Yes" to delete all this repeat events, or click "No" to only delete the current event?', 'updateRepeatPopup.title':'Confirm', 'updateRepeatPopup.msg':'Click "Yes" to update for all this repeat events, or click "No" to only update for the current event?', 'shareItem.text':'Share Calendar' }, 'Editor':{ 'startDayField.label':'Time', 'endDayField.label':'To', 'wholeField.label':'Whole day', 'subjectField.label':'Subject', 'contentField.label':'Content', 'calendarField.label':'Calendar', 'alertCB.label':'Alert when actived', 'lockCB.label':'Locked', 'deleteBtn.text':'Remove', 'saveBtn.text':'Save', 'cancelBtn.text':'Cancel', 'new.title':'New Event', 'edit.title':'Edit Event', 'repeatTypeField.label':'Repeat Type', 'repeatIntervalField.label':'Recur every ', 'intervalUnitLabel.day.text':' Day(s) ', 'intervalUnitLabel.week.text':' Week(s) ', 'intervalUnitLabel.month.text':' Month(s) ', 'intervalUnitLabel.year.text':' Year(s) ', 'detailSetting':'Modify Detail...', 'returnBtn.text':'Back', 'startAndEnd':'Start and End', 'repeatStartField.label':'Start', 'repeatNoEndRG.label':'No end date', 'repeatEndTimeRG.label':'End after', 'repeatEndDateRG.label':'End by', 'repeatEndTimeUnit':'occurrence(s)', 'weekCheckGroup.label':'Repeat Day', 'monthRadioGroup.label':'Repeat By', 'repeatByDate':'Date', 'repeatByDay':'Day' }, 'CalendarEditor':{ 'new.title':'New Calendar', 'edit.title':'Edit Calendar', 'nameField.label':'Name', 'descriptionField.label':'Description', 'clearBtn.text':'Clear', 'saveBtn.text':'Save', 'cancelBtn.text':'Cancel', 'returnBtn.text':'Back', 'shareCalendar':'Share Calendar With People', 'shareColumns.user':'User', 'shareColumns.permit':'Permit', 'shareColumns.add':'Add User to Share', 'shareColumns.remove':'Remove', 'userField.emptyText':'Please input username or email address' }, 'ExpirePopup':{ 'hideCB.label':'Don\'t popup any more', 'title':'Alerted Events', 'tpl.calendar':'Calendar', 'tpl.subject':'Subject', 'tpl.content':'Content', 'tpl.leftTime':'Left time', 'hour':'Hour(s)', 'minute':'Minute(s)', 'untitled':'Untitled', 'noContent':'No Content' }, 'SettingPopup':{ 'title':'feyaCalendar Setting', 'hourFormatField.label':'Hour Format', 'dayFormatField.label':'Day Format of DayView', 'weekFormatField.label':'Day Format of WeekView', 'monthFormatField.label':'Day Format of MonthView', 'applyBtn.text':'Apply', 'resetBtn.text':'Reset', 'closeBtn.text':'Close', 'fromtoFormatField.label':'FromTo Format', 'scrollStartRowField.label':'Scroll Start Row', 'languageField.label':'Language', 'generalForm.title':'General', 'dwViewForm.title':'DayView|WeekView', 'monthViewForm.title':'MonthView', 'createByDblClickField.label':'Create Event by Double click', 'singleDayField.label':'Cross Day Event', 'weekStartDayField.label': 'Start Week Day', 'activeStartTimeField.label':'Active Start Time', 'activeEndTimeField.label':'Active End Time', 'hideInactiveTimeField.label':'Hide Inactive Time', 'intervalField.label':'Interval Slot', 'startEndInvalid':'Active Start Time should be earlier than Active End Time!', 'formatInvalid':'Example: 09:00' }, 'ResultView':{ 'cm.date':'Date', 'cm.calendar':'Calendar', 'cm.time':'Time', 'cm.subject':'Subject', 'cm.content':'Content', 'cm.expire':'Left time', 'groupBtn.group.text':'Group', 'groupBtn.unGroup.text':'Ungroup', 'returnBtn.text':'Back', 'hour':'Hour(s)', 'noSubject':'(No Subject)', 'noContent':'(No Content)', 'loadMask.msg':'Please wait...' }, 'DayView':{ 'loadMask.msg':'Please wait...', 'addItem.text':'New Event', 'events':'events' }, 'MonthView':{ 'loadMask.msg':'Please wait...', 'overview':'Overview', 'showingEvents':'Showing Events', 'totalEvents':'Total Events', 'dayPre':'', 'addItem.text':'New Event', 'clearItem.text':'Clean Event', 'cutItem.text':'Cut', 'copyItem.text':'Copy', 'pasteItem.text':'Paste', 'events':'events' }, 'Mask':{ '12Hours':'12 Hours', '24Hours':'24 Hours', 'ar': 'Arabic', 'de': 'German', 'en_US':'American English', 'es': 'Spanish', 'fr': 'Français', 'it': 'Italiano', 'ja': 'Japanese', 'nl': 'Nederlandse', 'pl': 'Polski', 'pt': 'Portuguese', 'ru': 'Russian', 'zh_CN':'简体中文', 'enable':'Enable', 'disable':'Disable', 'minute':'Minutes', 'monday':'Monday', 'sunday':'Sunday', 'permitData':[ [0, 'Read, Write and Share'], [1, 'Read and Write'], [2, 'Read only'] ] }, repeatType:[ ['no', 'Not Repeat'], ['day', 'Daily'], ['week', 'Weekly'], ['month', 'Monthly'], ['year', 'Yearly'] ], getWeekDayInMonth:function(date){ var n = date.format('N'); var d = date.format('d'); var w = Math.floor((d-n)/7)+1; var wd = date.format('l'); var str = 'the '+w; if(1 == w){ str += 'st'; }else if(2 == w){ str += 'nd'; }else if(3 == w){ str += 'rd'; }else{ str += 'th'; } return str+' '+wd; }, getIntervalText:function(rtype, intervalSlot){ var str = ''; if('day' == rtype){ if(1 == intervalSlot){ str = 'Everyday'; }else{ str = 'Every '+intervalSlot+' days'; } }else if('week' == rtype){ if(1 == intervalSlot){ str = 'Every week at '; }else{ str = 'Every '+intervalSlot+' weeks at '; } }else if('month' == rtype){ if(1 == intervalSlot){ str = 'Every month at '; }else{ str = 'Every '+intervalSlot+' months at '; } }else if('year' == rtype){ if(1 == intervalSlot){ str = 'Every year at '; }else{ str = 'Every '+intervalSlot+' years at '; } } return str; } }; Ext.apply(Ext.ux.calendar.Mask, Ext.ux.calendar.Language);/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.LanManager = { addJavaScript:function(lan){ var flag = true; var exist = false; var id = 'x-calendar-language'; var lanel = document.getElementById(id); if(lanel){ if(lanel.name == lan){ flag = false; exist = true; }else{ Ext.get(lanel).remove(); } } if(!exist){ var js = document.createElement('script'); js.id = id; js.name = lan; js.setAttribute('type', 'text/javascript'); var url = Ext.ux.calendar.CONST.CALENDAR_LANGUAGE_PATH+lan+'.js'; js.setAttribute('src', url); document.getElementsByTagName("head")[0].appendChild(js); } exist = false; id = 'ext-language'; lanel = document.getElementById(id); if(lanel){ if(lanel.name == lan){ exist = true; }else{ Ext.get(lanel).remove(); } } if(!exist){ js = document.createElement('script'); js.id = id; js.setAttribute('type', 'text/javascript'); url = Ext.ux.calendar.CONST.EXT_LANGUAGE_PATH+'ext-lang-'+lan+'.js'; js.setAttribute('src', url); document.getElementsByTagName("head")[0].appendChild(js); } return flag; } };/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.RepeatType = { getEvent:function(re, day){ var rt = re.repeatType; var rtype = rt.rtype; var eps = rt.exceptions; if(rt.beginDay <= day && ('no' == rt.endDay || day <= rt.endDay) && (!eps || !eps[day])){ var e; if('day' == rtype){ e = Ext.ux.calendar.RepeatType.getRepeatDayEvent(day, re); }else if('week' == rtype){ e = Ext.ux.calendar.RepeatType.getRepeatWeekEvent(day, re); }else if('month' == rtype){ e = Ext.ux.calendar.RepeatType.getRepeatMonthEvent(day, re); }else if('year' == rtype){ e = Ext.ux.calendar.RepeatType.getRepeatYearEvent(day, re); } return e; } }, getRepeatDayEvent:function(day, re){ var rt = re.repeatType; var beginDay = rt.beginDay; var intervalSlot = rt.intervalSlot; var dspan = rt.dspan; var rtime = rt.rtime; var dnum = Ext.ux.calendar.Mask.getDayOffset(beginDay, day); var r = dnum%intervalSlot; var t = Math.floor(dnum/intervalSlot); if(0 == r && (!rtime || t < rtime)){ var e = Ext.apply({}, re); e.day = day; var date = Date.parseDate(day, 'Y-m-d'); e.eday = date.add(Date.DAY, dspan).format('Y-m-d'); delete(e.lflag); delete(e.rflag); return e; } }, getRepeatWeekEvent:function(day, re){ var rt = re.repeatType; var beginDay = rt.beginDay; var beginDate = Date.parseDate(beginDay, 'Y-m-d'); var bn = beginDate.format('N'); var date = Date.parseDate(day, 'Y-m-d'); var n = date.format('N'); var rday = rt.rday; if('{}' == Ext.encode(rday)){ rday[bn] = true; } if(rday[n]){ var intervalSlot = rt.intervalSlot; var dspan = rt.dspan; var rtime = rt.rtime; var dnum = Math.floor((Ext.ux.calendar.Mask.getDayOffset(beginDay, day)-n-bn)/7)+1; var r = dnum%intervalSlot; var t = Math.floor(dnum/intervalSlot); if(0 == r && (!rtime || t < rtime)){ var e = Ext.apply({}, re); e.day = day; var date = Date.parseDate(day, 'Y-m-d'); e.eday = date.add(Date.DAY, dspan).format('Y-m-d'); delete(e.lflag); delete(e.rflag); return e; } } }, getRepeatMonthEvent:function(day, re){ var rt = re.repeatType; var beginDay = rt.beginDay; var parts = beginDay.split('-', 3); var by = parseInt(parts[0]); var bm = parseInt(parts[1]); var bd = parseInt(parts[2]); parts = day.split('-', 3); var y = parseInt(parts[0]); var m = parseInt(parts[1]); var d = parseInt(parts[2]); var rby = rt.rby; var beginDate = Date.parseDate(beginDay, 'Y-m-d'); var bn = beginDate.format('N'); var bw = Math.floor((bd-bn)/7)+1; var date = Date.parseDate(day, 'Y-m-d'); var n = date.format('N'); var w = Math.floor((d-n)/7)+1; if(('date' == rby && bd == d) || ('day' == rby && w == bw && n == bn)){ var intervalSlot = rt.intervalSlot; var dspan = rt.dspan; var rtime = rt.rtime; var dnum = 12*y+m-12*by-bm; var r = dnum%intervalSlot; var t = Math.floor(dnum/intervalSlot); if(0 == r && (!rtime || t < rtime)){ var e = Ext.apply({}, re); e.day = day; var date = Date.parseDate(day, 'Y-m-d'); e.eday = date.add(Date.DAY, dspan).format('Y-m-d'); delete(e.lflag); delete(e.rflag); return e; } } }, getRepeatYearEvent:function(day, re){ var rt = re.repeatType; var beginDay = rt.beginDay; var parts = beginDay.split('-', 3); var by = parseInt(parts[0]); var bm = parts[1]; var bd = parts[2]; parts = day.split('-', 3); var y = parseInt(parts[0]); var m = parts[1]; var d = parts[2]; if(bm == m && bd == d){ var intervalSlot = rt.intervalSlot; var dspan = rt.dspan; var rtime = rt.rtime; var dnum = y-by; var r = dnum%intervalSlot; var t = Math.floor(dnum/intervalSlot); if(0 == r && (!rtime || t < rtime)){ var e = Ext.apply({}, re); e.day = day; var date = Date.parseDate(day, 'Y-m-d'); e.eday = date.add(Date.DAY, dspan).format('Y-m-d'); delete(e.lflag); delete(e.rflag); return e; } } } };/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.onReady(function() { Ext.ux.calendar.CONST = { /* *true to show the language submenu in myCalendar, or not */ SHOW_LANGUAGE_MENU: true, BLANK_IMAGE_URL: '../../../../extjs/resources/images/default/s.gif', /* *define the main path of myCalendar */ MAIN_PATH: '', /* *define the multi-language path of myCalendar */ CALENDAR_LANGUAGE_PATH: '/js/ext/calendar/', /* *define the multi-language path of EXT */ EXT_LANGUAGE_PATH: '../../../../extjs/src/locale/', /* * define the some url here for datasource */ searchURL: 'un used', showAllCalendarURL: Trakkware.Handlers.MethodHandlerUrl + '?action=showAllCalendar', showOnlyCalendarURL: 'php/db-proxy.php?action=showOnlyCalendar', createUpdateCalendarURL: 'php/db-proxy.php?action=createUpdateCalendar', deleteEventsByCalendarURL: 'php/db-proxy.php?action=deleteEventsByCalendar', deleteCalendarURL: 'php/db-proxy.php?action=deleteCalendar', loadCalendarURL: 'php/db-proxy.php?action=loadCalendar', loadEventURL: 'php/db-proxy.php?action=loadEvent', loadRepeatEventURL: 'php/db-proxy.php?action=loadRepeatEvent', createEventURL: 'php/db-proxy.php?action=createEvent', updateEventURL: 'php/db-proxy.php?action=updateEvent', deleteEventURL: 'php/db-proxy.php?action=deleteEvent', deleteRepeatEventURL: 'php/db-proxy.php?action=deleteRepeatEvent', changeDayURL: 'php/db-proxy.php?action=changeDay', deleteDayURL: 'php/db-proxy.php?action=deleteDay', loadSettingURL: 'php/db-proxy.php?action=loadSetting', updateSettingURL: 'php/db-proxy.php?action=updateSetting', createUpdateRepeatEventURL: 'php/db-proxy.php?action=createUpdateRepeatEvent', initialLoadURL: 'unused' }; });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns('Ext.util'); Ext.util.DatePicker = Ext.extend(Ext.DatePicker, { onRender : function(container, position){ Ext.util.DatePicker.superclass.onRender.call(this, container, position); }, updateRange : function(){ if(this.startDate && this.endDate){ var st = this.startDate.clearTime().getTime(); var et = this.endDate.clearTime().getTime(); this.cells.each(function(c){ var dt = c.dom.firstChild.dateValue; if(st <= dt && dt <= et){ c.addClass('x-date-selected'); }else{ c.removeClass('x-date-selected'); } }); } }, setRange : function(startDate, endDate){ this.startDate = startDate; this.endDate = endDate; }, update : function(date, forceRefresh){ Ext.util.DatePicker.superclass.update.call(this, date, forceRefresh); this.updateRange(); } }); /** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns('Ext.util'); Ext.util.LabelField = Ext.extend(Ext.form.Field, { onRender:function(ct, position){ Ext.util.LabelField.superclass.onRender.call(this, ct, position); this.wrap = this.el.wrap({cls: this.wrapClass}); if(Ext.isIE) this.wrap.setHeight(20); this.el.addClass('x-hidden'); this.labelEl = Ext.DomHelper.append(this.wrap, '

', true); this.labelEl.dom.innerHTML = this.text; }, setText:function(v){ if(this.labelEl){ this.labelEl.dom.innerHTML = v; }else{ this.text = v; } }, getText:function(){ return this.labelEl.dom.innerHTML; } }); Ext.ns('Ext.ux.calendar'); Ext.ux.calendar.CommentTip = Ext.extend(Ext.Tip, { closable:true, closeAction:'hide', showTip:function(title, text, bEl, pos, during){ this.setTitle(title); if(this.rendered){ this.body.update(text); }else{ this.html = text; } this.showBy(bEl, pos); during = during || 5000; (function(){ this.hide(); }).defer(during, this); } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.BasicView = Ext.extend(Ext.Panel, { daySet:[], checkLayout:Ext.emptyFn, renderEvent:Ext.emptyFn, resetSCover:Ext.emptyFn, resizePort:Ext.emptyFn });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.Block = function(config){ var obj = {}; obj.id = 0; obj.colNum = 0; obj.startRow = 100; obj.endRow = -1; obj.eventList = new Array(); obj.addEvent = function(event){ if(event.startRow < obj.startRow){ obj.startRow = event.startRow; } if(event.endRow > obj.endRow){ obj.endRow = event.endRow; } obj.eventList[obj.eventList.length] = event; } Ext.apply(obj, config); return obj; }/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.BlockMap = function(event, block){ var obj = {}; obj.event = event; obj.block = block; return obj; }/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.Line = function(config){ var obj = {}; obj.areaList = new Array(); obj.block = null; Ext.apply(obj, config); return obj; }/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.LayoutGrid = function(config){ Ext.apply(this, config); this.CALENDAR_ROW_NUM = this.ehandler.rowCount; this.blockId = 0; this.grid = new Array(); this.wholeList = []; this.heventList = []; this.hwholeList = []; this.visited = {}; this.crossVisited = {}; }; Ext.ux.calendar.LayoutGrid.prototype = { getAllEvents: function(){ var events = this.getEventList(); events = this.owner.getWholeList(this.cview, this.day, true, true).concat(events); return events; }, getEventList: function(){ var eventList = new Array(); var blockId = -1; for(var i = 0; i < this.CALENDAR_ROW_NUM; i++){ var line = this.grid[i]; if(-1 == blockId){ if(null != line.block){ blockId = line.block.id; eventList = eventList.concat(line.block.eventList); } }else if(null != line.block){ if(blockId != line.block.id){ blockId = line.block.id; eventList = eventList.concat(line.block.eventList); } } } return eventList; }, removeOutDeletedCalendar:function(eventList){ /* * remove out event of deleted calendar */ var eh = this.ehandler; var i, len, arr = []; for(i = 0, len = this.heventList.length; i < len; i++){ var event = this.heventList[i]; if(eh.calendarSet[event.calendarId]){ arr.push(event); } } this.heventList = arr; arr = []; for(i = 0, len = eventList.length; i < len; i++){ var event = eventList[i]; if(eh.calendarSet[event.calendarId]){ arr.push(event); } } return arr; }, refreshRepeatEvent:function(eventList){ /* * remove out repeat event from eventlist and heventlist */ var i, len, arr = []; for(i = 0, len = this.heventList.length; i < len; i++){ var event = this.heventList[i]; if('string' == Ext.type(event.repeatType)){ arr.push(event); } } this.heventList = arr; arr = []; for(i = 0, len = eventList.length; i < len; i++){ var event = eventList[i]; if('string' == Ext.type(event.repeatType)){ arr.push(event); } } var res = this.owner.getRepeatEvent(this.cview, this.day); arr = this.owner.combine2List(res, arr); return arr; }, filterEvent:function(eventList){ var eh = this.ehandler; var selist = []; var arr = []; var i, j, len; if(this.deleteCalendar){ this.deleteCalendar = false; eventList = this.removeOutDeletedCalendar(eventList); } if(this.hideCalendar){ this.hideCalendar = false; for(i = 0, len = this.heventList.length; i < len; i++){ var event = this.heventList[i]; if(!eh.calendarSet[event.calendarId].hide){ selist.push(event); }else{ arr.push(event); } } this.heventList = arr; arr = []; for(i = 0, len = eventList.length; i < len; i++){ var event = eventList[i]; if(!eh.calendarSet[event.calendarId].hide){ arr.push(event); }else{ this.heventList.push(event); } } eventList = this.owner.combine2List(arr, selist); eventList = this.refreshRepeatEvent(eventList); } if(this.updateRepeat){ this.updateRepeat = false; eventList = this.refreshRepeatEvent(eventList); } return eventList; }, reLayout: function(single, nowhole){ return this.generateLayout(this.getEventList(), true, single, nowhole); }, increaseLine: function(line, lstArea, lstIndex){ while(lstIndex > line.areaList.length){ line.areaList[line.areaList.length] = null; } line.areaList[line.areaList.length] = lstArea; }, addArea: function(line, area, colIndex){ if(line.areaList.length < colIndex + 1){ this.increaseLine(line, area, colIndex); }else{ line.areaList[colIndex] = area; } }, generateArea: function(event, block, colIndex){ for(var i = event.startRow; i < event.endRow; i++){ var line = this.grid[i]; line.block = block; this.addArea(line, event, colIndex); } }, getColIndex: function(line){ var colIndex, size; for(colIndex = 0, size = line.areaList.length; colIndex < size; colIndex++){ var event = line.areaList[colIndex]; if(null == event){ break; } } return colIndex; }, generateLayout: function(eventList, reload, single, nowhole){ var elist = [], wlist = []; if(!reload){ this.heventList = []; elist = eventList; }else{ elist = eventList; } if(!nowhole){ wlist = this.owner.getWholeList(this.cview, this.day, null, single); } elist = this.filterEvent(elist); if(!this.layouted){ this.visited = {}; if(this.cview){ this.visited[this.cview.id] = true; } this.layouted = true; //clear grid first for(var i = 0; i < this.CALENDAR_ROW_NUM; i++){ this.grid[i] = new Ext.ux.calendar.Line(); } this.blockId = 0; //Layouting events elist = this.Layouting(elist); }else{ this.visited[this.cview.id] = true; } this.inited = true; return { elist:elist, wlist:wlist }; }, Layouting: function(eventList){ var eh = this.ehandler; var b2eMap = new Array(); var block = null; for(var i = 0, size = eventList.length; i < size; i++){ var event = eventList[i]; var line = this.grid[event.startRow]; //get the free postion in line for the event var colIndex = this.getColIndex(line); //for check whether the value changed if(event.colIndex != colIndex){ event.colIndex = colIndex; event.changed = true; } //generate or update a block if(0 == line.areaList.length){ block = new Ext.ux.calendar.Block(); block.id = this.blockId++; }else if(null != block){ if(block.colNum < colIndex) block.colNum = colIndex; } line.block = block; //bind the event with a block b2eMap[b2eMap.length] = new Ext.ux.calendar.BlockMap(event, block); block.addEvent(event); //generate the areas covered by event this.generateArea(event, block, colIndex); } //calculate the span for every event for(var i = 0, size = b2eMap.length; i < size; i++){ var b2e = b2eMap[i]; var span = b2e.block.colNum + 1; if(span != b2e.event.span){ b2e.event.span = span; b2e.event.changed = true; } } var arr = []; for(var i = 0, len = eventList.length; i < len; i++){ var event = eventList[i]; if(!eh.calendarSet[event.calendarId].hide){ arr[arr.length] = event; } } eventList = arr; //for get max colIndex for every line var cols = {}; for(var i = 0, len = eventList.length; i < len; i++){ var event = eventList[i]; var startRow = event.startRow; var endRow = event.endRow; for(var j = startRow; j < endRow; j++){ if(!cols[j]){ cols[j] = event; }else if(cols[j].colIndex < event.colIndex){ cols[j] = event; } } } for(var i = 0, len = eventList.length; i < len; i++){ var event = eventList[i]; var startRow = event.startRow; var endRow = event.endRow; var last = true; for(var j = startRow; j < endRow; j++){ if(cols[j] && event.colIndex < cols[j].colIndex && cols[j].startRow >= event.startRow){ last = false; break; } } if(true === last){ if(true !== event.last){ event.last = true; event.changed = true; } }else{ if(true === event.last){ event.changed = true; } delete(event.last); } } return eventList; }, updateLayout: function(event, action, force){ this.visited = {}; this.visited[this.cview.id] = true; if((0 == event.startRow && this.CALENDAR_ROW_NUM == event.endRow) || (event.day != event.eday)){ var arr = [event]; this.owner.updateWholeList(arr, action); return this.owner.getWholeList(this.cview, this.day); }else{ var eventList = new Array(); var startRow = event.startRow; var endRow = event.endRow; var i, size, colIndex = -1; /* * get the start line and end line of changed event */ for(i = 0, size = this.grid.length; i < size; i++){ var line = this.grid[i]; if(colIndex == -1){ for(var j = 0, colNum = line.areaList.length; j < colNum; j++){ var area = line.areaList[j]; if(null == area) continue; if(area.eventId == event.eventId){ colIndex = j; if(startRow > i){ startRow = i; } if(endRow < i+1){ endRow = i+1; } } } }else{ if(line.areaList.length > colIndex){ if(null != line.areaList[colIndex]){ if(line.areaList[colIndex].eventId == event.eventId){ if(endRow < i+1){ endRow = i+1; } } }else{ break; } }else{ break; } } } /* * get all events inside the area */ var blockId = -1; for(i = startRow; i < endRow; i++){ var line = this.grid[i]; if(-1 == blockId){ if(null != line.block){ blockId = line.block.id; eventList = eventList.concat(line.block.eventList); } }else if(null != line.block){ if(blockId != line.block.id){ blockId = line.block.id; eventList = eventList.concat(line.block.eventList); } } } /* * update the event */ //remove old one if((action == 'update') || (action == 'delete')){ for(i = 0, size = eventList.length; i < size; i++){ var be = eventList[i]; if(event.eventId == be.eventId){ if('update' == action && true !== force && event.startRow == be.startRow && event.endRow == be.endRow){ Ext.apply(be, event); return { elist:[event] }; } eventList.splice(i, 1); break; } } } //add new one if((action == 'update') || (action == 'add')){ for(i = 0, size = eventList.length; i < size; i++){ var sId = eventList[i].startRow; var eId = eventList[i].endRow; if(sId > event.startRow){ eventList.splice(i, 0, event); break; }else if(sId == event.startRow && eId <= event.endRow){ eventList.splice(i, 0, event); break; } } if(i == size){ eventList[eventList.length] = event; } } /* * get the areas which's layout will change */ if(eventList[0]){ if(startRow > eventList[0].startRow){ startRow = eventList[0].startRow; } } if(null != this.grid[endRow-1].block){ if(endRow < this.grid[endRow-1].block.endRow){ endRow = this.grid[endRow-1].block.endRow; } } //reset changing areas and block for(i = startRow; i < endRow; i++){ if(this.grid[i].areaList.length > 0){ this.grid[i].areaList.length = 0; } this.grid[i].block = null; } //set changed falg to false for(i = 0, size = eventList.length; i < size; i++){ eventList[i].changed = false; } event.changed = true; //update layout for eventList = this.Layouting(eventList); //only return position or width changed event to js var backList = new Array(); for(i = 0, size = eventList.length; i < size; i++){ event = eventList[i]; if(event.changed == true){ backList.push(event); } } return { elist:backList }; } } };/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.CalendarLayout = function(config){ Ext.apply(this, config); this.layoutSet = {}; this.wholeList = []; this.repeatSet = {}; Ext.ux.calendar.CalendarLayout.superclass.constructor.call(this); }; Ext.extend(Ext.ux.calendar.CalendarLayout, Ext.util.Observable, { getWholeList: function(cview, day, all, single) { var eh = this.ehandler; var cs = eh.calendarSet; var wlist = []; var arr = []; var sday, eday; if (single) { sday = day; eday = day; } else { if (1 == cview.dayNum) { sday = day; eday = day; } else { var colNum = cview.colNum || cview.dayNum; var cd = Date.parseDate(day, 'Y-m-d'); var sd = eh.getStartDateInWeek(cd, cview); sday = sd.format('Y-m-d'); eday = sd.add(Date.DAY, colNum - 1).format('Y-m-d'); } } for (var i = 0, len = this.wholeList.length; i < len; i++) { var e = this.wholeList[i]; if (cs[e.calendarId]) { if (!cs[e.calendarId].hide || all) { if (e.day == day || (sday == day && e.day < day && e.eday >= day)) { if (e.day < sday) { e.lflag = true; } else { delete (e.lflag); } if (e.eday > eday) { e.rflag = true; } else { delete (e.rflag); } wlist.push(e); } } arr.push(e); } } this.wholeList = arr; wlist = this.combine2List(this.getRepeatEvent(cview, day, true, all, single), wlist); return wlist; }, updateWholeList: function(arr, action) { if (arr) { if ('add' == action) { this.wholeList = this.combine2List(this.wholeList, arr); } else if ('update' == action) { for (var i = 0, len = arr.length; i < len; i++) { this.deleteFromList(this.wholeList, arr[i]); } this.wholeList = this.combine2List(this.wholeList, arr); } else if ('delete' == action) { for (var i = 0, len = arr.length; i < len; i++) { this.deleteFromList(this.wholeList, arr[i]); } } } }, deleteFromList: function(arr, e) { for (var i = 0, len = arr.length; i < len; i++) { var w = arr[i]; if (w.eventId == e.eventId) { arr.splice(i, 1); break; } } }, deleteDayFromWholeList: function(day, eday, prevent) { var cs = this.ehandler.calendarSet; eday = eday || day; var i, j, len = this.wholeList.length, wlist = []; ; for (i = 0; i < len; i++) { var w = this.wholeList[i]; if (w.day > day) { return wlist; } else if (!cs[w.calendarId].hide && w.day >= day && w.eday <= eday) { break; } } for (j = i; j < len; j++) { var w = this.wholeList[j]; if (!cs[w.calendarId].hide && w.day >= day && w.eday <= eday) { wlist.push(Ext.apply({}, w)); } else { break; } } if (!prevent) { this.wholeList.splice(i, j - i); } return wlist; }, changeDayInWholeList: function(oday, tday, keep) { var cs = this.ehandler.calendarSet; var i, j, len = this.wholeList.length; for (i = 0; i < len; i++) { var w = this.wholeList[i]; if (w.day > oday) { i = len; break; } else if (!cs[w.calendarId].hide && w.day >= oday && w.eday <= oday) { break; } } var arr = []; for (j = i; j < len; j++) { var w = this.wholeList[j]; if (!cs[w.calendarId].hide && w.day >= oday && w.eday <= oday) { var o = Ext.apply({}, w); o.day = tday; o.eday = tday; arr.push(o); } else { break; } } if (!keep) { this.wholeList.splice(i, j - i); } this.wholeList = this.combine2List(this.wholeList, arr); }, getLayout: function(day, cview, eventList, newFlag, refresh) { if (day instanceof Date) { day = day.format('Y-m-d'); } var fn = function() { var eh = this.ehandler; var layout = new Ext.ux.calendar.LayoutGrid({ owner: this, ehandler: eh, cview: cview, day: day, hideCalendar: true }); layout.viewChanged = true; layout.generateLayout(eventList || []); this.layoutSet[day] = layout; }; if (refresh) { fn.call(this); } else { if (!this.layoutSet[day]) { if (true == newFlag) { fn.call(this); } else { return null; } } else { if (this.layoutSet[day].cview !== cview) { this.layoutSet[day].viewChanged = true; } else { this.layoutSet[day].viewChanged = false; } this.layoutSet[day].cview = cview; } } return this.layoutSet[day]; }, resetSingleLayout: function(layout, config, reLayout) { layout.hideCalendar = config.hideCalendar; layout.deleteCalendar = config.deleteCalendar; layout.updateRepeat = config.updateRepeat; delete (layout.layouted); var v = layout.visited; if (reLayout) { layout.reLayout(); } if (layout.hideCalendar) { for (var p in v) { v[p] = 'hideCalendar'; } layout.visited = v; } else if (layout.deleteCalendar) { for (var p in v) { v[p] = 'deleteCalendar'; } layout.visited = v; } else if (layout.updateRepeat) { for (var p in v) { v[p] = 'updateRepeat'; } layout.visited = v; } else { layout.visited = {}; } }, resetLayout: function(config, reLayout) { for (var p in this.layoutSet) { var layout = this.layoutSet[p]; this.resetSingleLayout(layout, config, reLayout); } }, checkRepeat: function(c, list, i) { for (var len = list.length; i < len; i++) { var e = list[i]; if (!(e.day == c.day && e.eday == c.eday && e.startRow == c.startRow && e.endRow == c.endRow)) { return false; } if (e.eventId == c.eventId) { return true; } } return false; }, combine2List: function(alist, blist) { var nlist = []; var alen = 0, blen = 0; if (alist) { alen = alist.length; } if (blist) { blen = blist.length } var i, j; for (i = 0, j = 0; i < alen && j < blen; ) { var a = alist[i]; var b = blist[j]; var ast = a.day + '-' + a.startRow, aet = a.eday + '-' + a.endRow; var bst = b.day + '-' + b.startRow, bet = b.eday + '-' + b.endRow; if (ast < bst || (ast == bst && aet > bet)) { nlist.push(a); i++; } else { if (!this.checkRepeat(b, alist, i)) { nlist.push(b); } j++; } } if (i == alen) { for (; j < blen; j++) { var b = blist[j]; nlist.push(b); } } if (j == blen) { for (; i < alen; i++) { var a = alist[i]; nlist.push(a); } } return nlist; }, updateRepeatEventList: function(cview, arr, action) { if ('add' == action || 'update' == action) { for (var i = 0, len = arr.length; i < len; i++) { var e = arr[i]; this.repeatSet[e.eventId] = e; } } else if ('delete' == action) { for (var i = 0, len = arr.length; i < len; i++) { var e = arr[i]; delete (this.repeatSet[e.eventId]); } } this.resetLayout({ hideCalendar: false, deleteCalendar: false, updateRepeat: true }, true); cview.checkLayout(); }, getRepeatEvent: function(cview, day, whole, all, single) { var eh = this.ehandler; var cd, sday, eday; if (whole) { cd = Date.parseDate(day, 'Y-m-d'); if (single) { sday = day; eday = day; } else { if (1 == cview.dayNum) { sday = day; eday = day; } else { var colNum = cview.colNum || cview.dayNum; var sd = eh.getStartDateInWeek(cd, cview); sday = sd.format('Y-m-d'); eday = sd.add(Date.DAY, colNum - 1).format('Y-m-d'); } } } var arr = [], newset = {}; var rset = this.repeatSet, cs = eh.calendarSet; for (var p in rset) { var re = rset[p]; var c = cs[re.calendarId]; if (c) { if (!c.hide || all) { var e; var rt = re.repeatType; var dspan = rt.dspan; if (!whole) { if (0 == dspan && (0 != re.startRow || eh.rowCount != re.endRow)) { /* * handle in-day event */ e = Ext.ux.calendar.RepeatType.getEvent(re, day); if (e) { arr = this.combine2List(arr, [e]); } } } else if (0 < dspan || (0 == re.startRow && eh.rowCount == re.endRow)) { /* * handle whole day event */ if (sday == day) { /* * handle the left-join event */ for (var i = 0; i <= dspan; i++) { var d = cd.add(Date.DAY, -i).format('Y-m-d'); e = Ext.ux.calendar.RepeatType.getEvent(re, d); if (e) { if (e.day < sday) { e.lflag = true; } else { delete (e.lflag); } if (e.eday > eday) { e.rflag = true; } else { delete (e.rflag); } arr = this.combine2List(arr, [e]); } } } else { e = Ext.ux.calendar.RepeatType.getEvent(re, day); if (e) { if (e.day < sday) { e.lflag = true; } else { delete (e.lflag); } if (e.eday > eday) { e.rflag = true; } else { delete (e.rflag); } arr = this.combine2List(arr, [e]); } } } } newset[re.eventId] = re; } } this.repeatSet = newset; return arr; }, showWeek: function(cview, tbody, week, eventSet, stop) { var eh = this.ehandler; cview.cleanup(week, true); var colNum = cview.colNum || cview.dayNum, dayNum = cview.shiftDay || cview.dayNum, daySet = cview.daySet; var table = [], mline = []; for (var j = 0; j < dayNum; j++) { mline.push(0); } var sdate = eh.getStartDateInWeek(cview.daySet[week * dayNum], cview); var sday = sdate.format('Y-m-d'); var si = cview.startColIndex, ei = cview.endColIndex; for (var j = 0; j < colNum; j++) { var index = week * dayNum + j + si; var day = daySet[index]; var dayStr = day.format('Y-m-d'); var eventList = eventSet[dayStr]; /* * if stop is true, then no need relayout */ if (!stop) { var layout = this.getLayout(dayStr, cview, eventList || [], true); var rs = layout.reLayout(); eventList = rs.wlist.concat(rs.elist); } for (var k = 0, len = eventList.length; k < len; k++) { var e = Ext.apply({}, eventList[k]); var dnum = Ext.ux.calendar.Mask.getDayOffset((sday < e.day) ? e.day : sday, e.eday); var epos = j + dnum; if (epos >= colNum) { epos = colNum - 1; } this.insert2Table(table, j, epos, e, mline, cview.lineNum); } } /* * need relayout for weekend too, or will have exception * */ for (var j = 0; j < si; j++) { var index = week * dayNum + j; var day = daySet[index]; var dayStr = day.format('Y-m-d'); var eventList = eventSet[dayStr]; if (!stop) { var layout = this.getLayout(dayStr, cview, eventList || [], true); var rs = layout.reLayout(); eventList = rs.wlist.concat(rs.elist); } } for (var j = ei; j < cview.dayNum; j++) { var index = week * dayNum + j; var day = daySet[index]; var dayStr = day.format('Y-m-d'); var eventList = eventSet[dayStr]; if (!stop) { var layout = this.getLayout(dayStr, cview, eventList || [], true); var rs = layout.reLayout(); eventList = rs.wlist.concat(rs.elist); } } this.checkMore(cview, mline, table); var tr = this.generateTR(cview, table, week); if (tr && 0 < tr.length) { if (tbody.insertAdjacentHTML && !Ext.isIE) { tr = tr.join(''); tbody.insertAdjacentHTML('beforeEnd', tr); } else { for (var k = 0, len = tr.length; k < len; k++) { Ext.DomHelper.append(tbody, tr[k]); } } this.bindEvent2Table(cview, table, tbody); } }, insert2Table: function(table, spos, epos, e, mline, limit) { var flag = false, tr; for (var i = 0, len = table.length; i < len; i++) { tr = table[i]; flag = true; for (var j = spos; j <= epos; j++) { if (tr[j]) { flag = false; break; } } if (flag) { break; } } if (!flag) { if (!limit || table.length < limit) { tr = {}; table.push(tr); flag = true; } else { for (var j = spos; j <= epos; j++) { mline[j]++; } } } if (flag) { var span = epos - spos + 1; for (var j = spos; j <= epos; j++) { tr[j] = { span: span, event: e }; } } return flag; }, checkMore: function(cview, mline, table) { if (0 < table.length) { var colNum = cview.colNum || cview.dayNum; var tr = table[table.length - 1]; for (var i = 0; i < colNum; ) { var td = tr[i]; if (td) { var span = td.span; var flag = false; for (var j = 0; j < span; j++) { if (0 < mline[i + j]) { flag = true; break; } } if (flag) { for (var j = 0; j < span; j++) { var index = i + j; var t = tr[index]; t.span = 1; t.event = (0 >= mline[index]) ? 1 : mline[index] + 1; } } i += span; } else { if (0 < mline[i]) { tr[i] = { span: 1, event: mline[i] }; } i++; } } } return table; }, generateTR: function(cview, rows, w) { var eh = this.ehandler; var lan = Ext.ux.calendar.Mask.EventHandler; var colNum = cview.colNum || cview.dayNum, dayNum = cview.shiftDay, daySet = cview.daySet; var si = cview.startColIndex; var tr = []; var rowNum = rows.length; for (var i = 0; i < rowNum; i++) { var row = rows[i]; var str = ''; for (var j = 0; j < colNum; ) { if (!row[j]) { str += ''; j++; } else { var span = row[j].span; var e = row[j].event; var html; if ('number' == Ext.type(e)) { var day = daySet[w * dayNum + j + si].format('Y-m-d'); html = '

' + ' ' + e + ' ' + lan['more'] + '...' + '

'; } else { html = eh.generateLegend(cview, e); } str += '' + html + ''; j += span; } } str = '' + str + ''; tr.push(str); } if (0 < tr.length) { return tr; } }, bindEvent2Table: function(cview, rows, root) { var colNum = cview.colNum || cview.dayNum; var rowNum = rows.length; for (var i = 0; i < rowNum; i++) { var row = rows[i]; for (var j = 0; j < colNum; ) { if (!row[j]) { j++; } else { var span = row[j].span; var e = row[j].event; var els = Ext.DomQuery.select('div[name=x-event-' + e.day + '-' + e.eday + '-' + e.eventId + ']', root); for (var k = 0, len = els.length; k < len; k++) { var El = Ext.get(els[k]); El.bindEvent = e; El.cview = cview; } j += span; } } } } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. * * @class Ext.ux.calendar.DataSource * @extends Ext.util.Observable * This class represents the primary interface of Server request. * You may need use your own backend, so you need rewrite this file, here we only define the input/output, * once your backend can work with these input/output, it will be fine */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.DataSource = Ext.extend(Ext.util.Observable, { constructor: function(master_config) { //Ext.apply(this, master_config); Ext.ux.calendar.DataSource.superclass.constructor.call(this, master_config); var trakkware_config = Ext.apply({}, master_config); Ext.apply(this, { /* * For show all calendars * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ showAllCalendar: function(sucessFn, scope) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.showAllCalendarURL, params: { userId: this.mainPanel.userId }, success: function(response, options) { /* * The back json string should have a param "success", when it equal "false" means fail to create/update in server side */ var backObj = Ext.decode(response.responseText); if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For hide all calendars but only show this one * @param {int} calendarId: the id of the calendar * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ showOnlyCalendar: function(calendarId, sucessFn, scope) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.showOnlyCalendarURL, params: { id: calendarId, userId: this.mainPanel.userId }, success: function(response, options) { /* * The back json string should have a param "success", when it equal "false" means fail to create/update in server side */ var backObj = Ext.decode(response.responseText); if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For create/update a calendar * @param {Obj} calendar: the object of a calendar, should contain all field of calendar table in db * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ createUpdateCalendar: function(calendar, sucessFn, scope) { // We are not doing calendar update/creation from the calendar control. return; }, /* * For delete all events belong to a calendar * @param {int} calendarId: the id of a calendar * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ deleteEventsByCalendar: function(calendarId, sucessFn, scope) { // deleting events by calendar not supported. }, /* * For delete a calendar and all events belong to it * @param {int} calendarId: the id of a calendar * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ deleteCalendar: function(calendarId, sucessFn, scope) { // we are not deleting calendars from the calendar control }, /* * For load all calendars of a user * @param {int} userId: the id of a user * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ loadCalendar: function(successFn, scope) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.loadCalendarURL, params: { userId: this.mainPanel.userId }, success: function(response, options) { /* * The back json string should like below: * { * "total":2, * "results":[{ * "id":"1", * "color":"blue", * "description":null, * "hide":false, * "name":"Demo" * },{ * "id":"2", * "color":"red", * "description":null, * "hide":false, * "name":"df" * }] * } */ var backObj = Ext.decode(response.responseText); if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { successFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For load all events from a day to another day * @param {Date} startData: the start date * @param {Date} endData: the end date * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ loadEvent: function(startDate, endDate, sucessFn, scope) { var that = this; startDate = startDate || new Date(); endDate = endDate || new Date(); var startDay = startDate.format('Y-m-d'); var endDay = endDate.format('Y-m-d'); var action_params = { UserID: '981957F2-3B04-4992-9BD6-69E3B8060F12', StartDate: startDate, EndDate: endDate } if (trakkware_config.Parameters && trakkware_config.Parameters.Internal && Ext.isDefined(trakkware_config.Parameters.Internal.CalendarID)) action_params['CalendarID'] = trakkware_config.Parameters.Internal.CalendarID; if (trakkware_config.Parameters && trakkware_config.Parameters.Internal && Ext.isDefined(trakkware_config.Parameters.Internal.CalendarGroupID)) action_params['CalendarGroupID'] = trakkware_config.Parameters.Internal.CalendarGroupID; var load_config = { view: trakkware_config.ViewName, command: 'LOADEVENTS', actionParams: action_params, JustResults: true }; Trakkware.ViewFramework.performMethodCall(null, load_config, function(config_used, backObj) { //alert('got back ' + Ext.encode(backObj) + ' events'); var rs = backObj.list; var eventSet = {}; eventSet['whole'] = []; var getRowFromHM = Ext.ux.calendar.Mask.getRowFromHM; for (var i = 0, len = rs.length; i < len; i++) { var data = rs[i]; var startRow = getRowFromHM(data.startTime, this.intervalSlot); var endRow = getRowFromHM(data.endTime, this.intervalSlot); if (!this.hideInactiveRow || (this.activeStartRow <= startRow && endRow <= this.activeEndRow) || (0 == startRow && this.rowCount == endRow)) { // Figure out which cal this event belongs on. var cal = data.calendarId; if (that.existing_calendars.indexOf(cal) < 0) { Ext.each(data.possible_cals, function(possible_cal) { if (that.existing_calendars.indexOf(possible_cal) > -1) { cal = possible_cal; return false; } }); } var day = data.ymd; var eday = data.eymd; eventSet[day] = eventSet[day] || []; var e = { eventId: data.id, calendarId: cal, color: data.color, startRow: startRow, endRow: endRow, subject: data.subject, content: data.description, day: day, starttime: data.startTime, eday: eday, endtime: data.endTime, alertFlag: data.alertFlag, locked: data.locked, repeatType: data.repeatType }; if (day != eday || (0 == startRow) && (this.rowCount == endRow)) { eventSet['whole'].push(e); } else { eventSet[day] = eventSet[day] || []; eventSet[day].push(e); } } } sucessFn.call(scope, eventSet); }); }, loadRepeatEvent: function(sucessFn, scope) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.loadRepeatEventURL, params: { userId: this.mainPanel.userId }, success: function(response, options) { var backObj = Ext.decode(response.responseText); if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { var rs = backObj['results']; var eventSet = {}; var getRowFromHM = Ext.ux.calendar.Mask.getRowFromHM; for (var i = 0, len = rs.length; i < len; i++) { var data = rs[i]; var startRow = getRowFromHM(data.startTime, this.intervalSlot); var endRow = getRowFromHM(data.endTime, this.intervalSlot); var e = { eventId: data.id, calendarId: data.calendarId, color: data.color, startRow: startRow, endRow: endRow, subject: data.subject, content: data.description, repeatType: Ext.decode(data.repeatType), alertFlag: data.alertFlag, locked: data.locked }; eventSet[e.eventId] = e; } sucessFn.call(scope, eventSet); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For create an event * @param {Obj} event: the object of event * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ createEvent: function(event, sucessFn, scope) { var day = event.day || new Date().format('Y-m-d'); var eday = event.eday || day; Ext.Ajax.request({ url: Ext.ux.calendar.CONST.createEventURL, /* * the params pass to server should contain: * calendarId: int, the id of the calendar this event belong to * selectedDay: string, 'Y-m-d' format, the day of this event * startHMTime: string, 'H:i' format, the start time of this event * endHMTime: string, 'H:i' format, the end time of this event * repeatType: boolean, not use yet, always false in this version * allDay: boolean, if true means this event is a whole event * flag: boolean, if true mean this event need alert a window when it's activing * locked: boolean, if true mean this event is locked, can not be changed * subject: string, the subject of this event * description: string, the description of this event */ params: { 'calendarId': event.calendarId, 'startDay': day, 'endDay': eday, 'startHMTime': Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, event.startRow), 'endHMTime': Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, event.endRow), 'repeatType': event.repeatType, 'alertFlag': event.alertFlag, 'locked': event.locked, 'subject': event.subject, 'description': event.content, 'userId': this.mainPanel.userId }, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * The back json string should contain a param "id", which is the id of the event just created, * it should also have a param "success", when it equal "false" means fail to create/update in server side, * for example: {"success":"true","info":"Your have successful created event","id":17} */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { } }); }, /* * For update an event * @param {Obj} event: the object of event * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ updateEvent: function(event, sucessFn, scope) { var day = event.day || new Date().format('Y-m-d'); var eday = event.eday || day; Ext.Ajax.request({ url: Ext.ux.calendar.CONST.updateEventURL, /* * the params pass to server should contain: * id: int, the id of the event * calendarId: int, the id of the calendar this event belong to * selectedDay: string, 'Y-m-d' format, the day of this event * startHMTime: string, 'H:i' format, the start time of this event * endHMTime: string, 'H:i' format, the end time of this event * repeatType: boolean, not use yet, always false in this version * allDay: boolean, if true means this event is a whole event * flag: boolean, if true mean this event need alert a window when it's activing * locked: boolean, if true mean this event is locked, can not be changed * subject: string, the subject of this event * description: string, the description of this event */ params: { 'id': event.eventId, 'calendarId': event.calendarId, 'startDay': day, 'endDay': eday, 'startHMTime': Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, event.startRow), 'endHMTime': Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, event.endRow), 'repeatType': event.repeatType, 'alertFlag': event.alertFlag, 'locked': event.locked, 'subject': event.subject, 'description': event.content }, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * The back json string should have a param "success", when it equal "false" means fail to create/update in server side */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For delete an event * @param {Obj} event: the object of event * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ deleteEvent: function(event, sucessFn, scope) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.deleteEventURL, /* * pass the id of event to delete */ params: { 'id': event.eventId }, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * The back json string should have a param "success", when it equal "false" means fail to delete in server side */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, deleteRepeatEvent: function(event, makeException, sucessFn, scope) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.deleteRepeatEventURL, /* * pass the id of event to delete */ params: { 'id': event.eventId, 'makeException': makeException, 'repeatType': Ext.encode(event.repeatType) }, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * The back json string should have a param "success", when it equal "false" means fail to delete in server side */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For change all events in a day to another day * @param {string} oday: the old day, all events belong to this day need be changed * @param {string} nday: the new day, all events belong to old day will change to this day * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function * @param {boolean} keep: if true will keep the events for old day, if false then delete events for old day */ changeDay: function(oday, nday, sucessFn, scope, keep) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.changeDayURL, params: { 'dragDay': oday, 'dropDay': nday, 'keep': keep }, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * If keep is true, the back json string should contain a param "ids", which is an array keeps the id of the events just created for new day, * for example: {"success":"true","info":"You have success update those events","backids":[18,19]}; * if keep is false, the back json is like: {"success":"true","info":"You have success update those events","backids":[]}; * it should also have a param "success", when it equal "false" means fail to change in server side */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For delete all events in a day * @param {string} day: all events belong to this day need be deleted * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ deleteDay: function(day, sucessFn, scope) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.deleteDayURL, /* * pass the day to server, it's a string, 'Y-m-d' format */ params: { 'day': day }, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * The back json string should have a param "success", when it equal "false" means fail to delete in server side */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For load setting of feyaCalendar * @param {int} userId: the ID of current user * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ loadSetting: function(userId, sucessFn, scope) { Ext.Ajax.request({ url: Ext.ux.calendar.CONST.loadSettingURL, /* * pass the userId to server */ params: { 'userId': userId }, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * The back json string should have a param "success", when it equal "false" means fail to delete in server side */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, /* * For save setting of feyaCalendar * @param {obj} obj: the obj of current setting * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ updateSetting: function(obj, sucessFn, scope) { var params = { 'userId': this.mainPanel.userId }; Ext.apply(params, obj); Ext.Ajax.request({ url: Ext.ux.calendar.CONST.updateSettingURL, /* * pass the userId to server */ params: params, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * The back json string should have a param "success", when it equal "false" means fail to delete in server side */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { }, scope: scope || this }); }, createUpdateRepeatEvent: function(event, oevent, sucessFn, scope) { var stime = Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, event.startRow); var etime = Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, event.endRow); var params = { 'calendarId': event.calendarId, 'startDay': event.day, 'endDay': event.eday, 'startHMTime': stime, 'endHMTime': etime, 'repeatType': ('string' == Ext.type(event.repeatType)) ? event.repeatType : Ext.encode(event.repeatType), 'alertFlag': event.alertFlag, 'locked': event.locked, 'subject': event.subject, 'description': event.content, 'userId': this.mainPanel.userId }; if ('prepare' != event.eventId) { params.id = event.eventId; } if (oevent) { if ('string' == Ext.type(oevent.repeatType)) { params.oldRepeatType = oevent.repeatType; } else { params.oldRepeatType = Ext.encode(oevent.repeatType); } } Ext.Ajax.request({ url: Ext.ux.calendar.CONST.createUpdateRepeatEventURL, /* * the params pass to server should contain: * calendarId: int, the id of the calendar this event belong to * selectedDay: string, 'Y-m-d' format, the day of this event * startHMTime: string, 'H:i' format, the start time of this event * endHMTime: string, 'H:i' format, the end time of this event * repeatType: boolean, not use yet, always false in this version * allDay: boolean, if true means this event is a whole event * flag: boolean, if true mean this event need alert a window when it's activing * locked: boolean, if true mean this event is locked, can not be changed * subject: string, the subject of this event * description: string, the description of this event */ params: params, success: function(response, options) { var backObj = Ext.decode(response.responseText); /* * The back json string should contain a param "id", which is the id of the event just created, * it should also have a param "success", when it equal "false" means fail to create/update in server side, * for example: {"success":"true","info":"Your have successful created event","id":17} */ if (backObj.success == 'false') { Ext.Msg.show({ title: 'Error', msg: backObj.errorInfo, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } else { sucessFn.call(scope, backObj); } }, failure: function(response, options) { } }); }, /* * For load setting and calendar from db * @param {int} userId: the ID of current user * @param {function} sucessFn: the callback function when request completed successfully * @param {obj} scope: the scope of sucessFn function */ initialLoad: function(ControlID, sucessFn, scope) { var that = this; var action_params = { UserID: '981957F2-3B04-4992-9BD6-69E3B8060F12' } if (trakkware_config.Parameters && trakkware_config.Parameters.Internal && Ext.isDefined(trakkware_config.Parameters.Internal.CalendarID) && !Ext.isEmpty(trakkware_config.Parameters.Internal.CalendarID)) action_params['CalendarID'] = trakkware_config.Parameters.Internal.CalendarID; if (trakkware_config.Parameters && trakkware_config.Parameters.Internal && Ext.isDefined(trakkware_config.Parameters.Internal.CalendarGroupID) && !Ext.isEmpty(trakkware_config.Parameters.Internal.CalendarGroupID)) action_params['CalendarGroupID'] = trakkware_config.Parameters.Internal.CalendarGroupID; var load_config = { view: trakkware_config.ViewName, command: 'INITIALLOAD', JustResults: true, actionParams: action_params, ControlID: ControlID }; Trakkware.ViewFramework.performMethodCall(null, load_config, function(orig_config, backObj) { // Due to everything going into an array coming back from the server, get first value as a valid backObj for the cal. backObj = backObj.list[0]; var cs = backObj.cs; //alert('back obj is ' + Ext.encode(backObj)); cs = Ext.ux.calendar.Mask.calculateActiveRow(cs); Ext.apply(this, cs); backObj.cs = cs; var re = []; var eventSet = {}; var getRowFromHM = Ext.ux.calendar.Mask.getRowFromHM; for (var i = 0, len = re.length; i < len; i++) { var data = re[i]; var startRow = getRowFromHM(data.startTime, this.intervalSlot); var endRow = getRowFromHM(data.endTime, this.intervalSlot); var e = { eventId: data.id, calendarId: data.calendarId, color: data.color, startRow: startRow, endRow: endRow, starttime: data.startTime, endtime: data.endTime, subject: data.subject, content: data.description, repeatType: Ext.decode(data.repeatType), alertFlag: data.alertFlag, locked: data.locked }; eventSet[e.eventId] = e; } backObj.re = eventSet; that.existing_calendars = []; Ext.each(backObj.owned, function(cal) { that.existing_calendars.push(cal.id); }); // TRAKKWARE: Add colors to the mask color index. // NOT working :( Ext.each(backObj.owned, function(calendar) { var color = calendar.color; if (color) { var color_no_hex = color.replace('#', ''); Ext.ux.calendar.Mask.colorIndex.push(color); Ext.ux.calendar.Mask.colors.push(color_no_hex); } }); sucessFn.call(scope, backObj); }); } }); } }); /** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.BackThread = function(config){ Ext.apply(this, config); this.runner = new Ext.util.TaskRunner(); this.timelineTask = { run:function(eh){ var mp = eh.mainPanel; var cview = mp.calendarContainer.getLayout().activeItem; if(cview instanceof Ext.ux.calendar.DayView){ cview.setToday(); cview.updateTimeline(); }else if(cview instanceof Ext.ux.calendar.MonthView){ cview.setToday(); } eh.checkExpireEvents(); }, args:[this.ehandler], interval:60000 }; this.expireTask = { run:function(eh){ var mp = eh.mainPanel; var cview = mp.calendarContainer.getLayout().activeItem; if(cview instanceof Ext.ux.calendar.ResultView){ cview.list.getView().refresh(); } }, args:[this.ehandler], interval:1800000 }; Ext.ux.calendar.BackThread.superclass.constructor.call(this); this.runner.start(this.timelineTask); }; Ext.extend(Ext.ux.calendar.BackThread, Ext.util.Observable, { destroy:function(){ this.runner.stopAll(); } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.ExpirePopup = function(config){ Ext.apply(this, config); var lan = Ext.ux.calendar.Mask.ExpirePopup; var p; if(Ext.isIE){ p = 96; }else{ p = 100; } this.tpl = new Ext.XTemplate( '' + '

' + '

' + '' + '' + '

From: {startDate}
To: {endDate}

'+lan['tpl.calendar']+': {calendar}

' + lan['tpl.subject']+': {subject}
' + lan['tpl.content']+': {content}
' + lan['tpl.leftTime']+': {left}' + '

' + '' ); this.tpl.compile(); this.viewpanel = new Ext.Panel({ region:'center', autoScroll:true, bodyStyle:'background:transparent;', border:false }); this.hideCB = new Ext.form.Checkbox({ boxLabel:lan['hideCB.label'] }); Ext.ux.calendar.ExpirePopup.superclass.constructor.call(this, { iconCls:'icon_feyaCalendar_clock', title:lan['title'], width:300, height:200, closable:true, plain:false, draggable:false, resizable:false, closeAction:'hide', layout:'border', animCollapse:false, tools:[{ id:'down', handler:this.onDownFn, scope:this }, { id:'up', hidden:true, handler:this.onUpFn, scope:this }], items:[ this.viewpanel, { border:false, region:'south', height:25, bodyStyle:'background:transparent;padding:5px;', items:[this.hideCB] } ] }); this.on('show', this.onShowFn, this); }; Ext.extend(Ext.ux.calendar.ExpirePopup, Ext.Window, { manager:{ register:Ext.emptyFn, unregister:Ext.emptyFn, bringToFront:Ext.emptyFn, sendToBack:Ext.emptyFn }, changeTool:function(id){ if('up' == id){ this.tools['down'].hide(); this.tools['up'].show(); }else{ this.tools['up'].hide(); this.tools['down'].show(); } }, onUpFn:function(event, tEl, p){ this.changeTool('down'); var ch = this.getSize().height; this.expand(); var eh = this.getSize().height; var pos = this.getPosition(true); this.setPosition(pos[0], pos[1]+ch-eh); }, onDownFn:function(event, tEl, p){ this.changeTool('up'); var eh = this.getSize().height; this.collapse(); var ch = this.getSize().height; var pos = this.getPosition(true); this.setPosition(pos[0], pos[1]+eh-ch); }, sortEvents:function(events){ var arr = []; for(var k = 0, count = events.length; k < count; k++){ var e = events[k]; var len = arr.length; for(var i = len-1; i >= 0; i--){ var a = arr[i]; if(a.endRow > e.endRow){ arr[i+1] = a; }else{ break; } } arr[i+1] = e; } return arr; }, isChanged:function(events){ if(this.activedEvents){ var len = events.length; if(len == this.activedEvents.length && 0 != len){ for(var i = 0; i < len; i++){ var e = events[i]; var a = this.activedEvents[i]; if(!(e.eventId == a.eventId && e.day == a.day && e.eday == a.eday && e.startRow == a.startRow && e.endRow == a.endRow)){ return true; } } }else{ return true; } }else{ return true; } return false; }, popup:function(events){ var eh = this.ehandler; var lan = Ext.ux.calendar.Mask.ExpirePopup; var now = new Date(); for(var i = 0, len = events.length; i < len; i++){ var event = events[i]; var time = Date.parseDate(event.endDate, 'Y-m-d H:i'); var left = Math.round(now.getElapsed(time)/60000); var hour = Math.floor(left/60); var minute = left%60; event['subject'] = event['subject'] || lan['untitled']; event['content'] = event['content'] || lan['noContent']; event['calendar'] = eh.calendarSet[event.calendarId].name; event['left'] = hour+' '+lan['hour']+' '+minute+' '+lan['minute']; } var sFlag = !this.hideCB.getValue() && this.isChanged(events); if(this.isVisible()){ this.activedEvents = events; if(this.collapsed){ this.onUpFn(); } this.onShowFn(); }else if(sFlag){ this.activedEvents = events; this.show(); this.expand(); this.changeTool('down'); var taskBar = Ext.get('ux-taskbar'); if(taskBar){ this.el.alignTo(taskBar, "br-tr", [ -1, -1]); }else{ this.el.alignTo(Ext.getBody(), "br-br", [ -10, -10]); } this.el.slideIn('b', { duration:.7 }); } }, onShowFn:function(p){ var len = this.activedEvents.length; if(0 < len){ this.setTitle(Ext.ux.calendar.Mask.ExpirePopup['title']+'('+len+')'); var html = this.tpl.apply(this.activedEvents); this.viewpanel.body.update(html); this.viewpanel.body.highlight('#c3daf9', {block:true}); }else{ this.hide(); } } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.SettingPopup = function(config){ Ext.apply(this, config); var lan = Ext.ux.calendar.Mask.SettingPopup; this.hourFormatField = new Ext.form.ComboBox({ fieldLabel:lan['hourFormatField.label'], store:Ext.ux.calendar.Mask.getHourFormatStore(), typeAhead:true, mode:'local', triggerAction:'all', valueField:'id', displayField:'text', selectOnFocus:true, editable:false, allowBlank:false, anchor:'95%' }); this.dayFormatField = new Ext.form.TextField({ fieldLabel:lan['dayFormatField.label'], allowBlank:false, anchor:'95%' }); this.weekFormatField = new Ext.form.TextField({ fieldLabel:lan['weekFormatField.label'], allowBlank:false, anchor:'95%' }); this.monthFormatField = new Ext.form.TextField({ fieldLabel:lan['monthFormatField.label'], allowBlank:false, anchor:'95%' }); this.fromtoFormatField = new Ext.form.TextField({ fieldLabel:lan['fromtoFormatField.label'], allowBlank:false, anchor:'95%' }); this.languageField = new Ext.form.ComboBox({ hideLabel:!Ext.ux.calendar.CONST.SHOW_LANGUAGE_MENU, hidden:!Ext.ux.calendar.CONST.SHOW_LANGUAGE_MENU, fieldLabel:lan['languageField.label'], editable:false, store: Ext.ux.calendar.Mask.getLanguageConfig().store, displayField:'display', valueField:'name' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, anchor:'95%' }); this.createByDblClickField = new Ext.form.ComboBox({ fieldLabel:lan['createByDblClickField.label'], editable:false, store: Ext.ux.calendar.Mask.getEDStore(), displayField:'display', valueField:'value' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, anchor:'95%' }); this.singleDayField = new Ext.form.ComboBox({ fieldLabel:lan['singleDayField.label'], editable:false, store: Ext.ux.calendar.Mask.getEDStore(), displayField:'display', valueField:'value' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, anchor:'95%' }); this.activeStartTimeField = new Ext.form.TextField({ fieldLabel:lan['activeStartTimeField.label'], allowBlank:false, anchor:'95%', validator:this.timeValidator, sender:this }); this.activeEndTimeField = new Ext.form.TextField({ fieldLabel:lan['activeEndTimeField.label'], allowBlank:false, anchor:'95%', validator:this.timeValidator, sender:this }); this.hideInactiveTimeField = new Ext.form.ComboBox({ fieldLabel:lan['hideInactiveTimeField.label'], editable:false, store: Ext.ux.calendar.Mask.getEDStore(), displayField:'display', valueField:'value' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, anchor:'95%' }); this.readOnlyField = new Ext.form.ComboBox({ fieldLabel:lan['readOnlyField.label'], editable:false, store: Ext.ux.calendar.Mask.getEDStore(), displayField:'display', valueField:'value' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, anchor:'95%' }); this.intervalField = new Ext.form.ComboBox({ fieldLabel:lan['intervalField.label'], editable:false, store: Ext.ux.calendar.Mask.getIntervalStore(), displayField:'display', valueField:'value' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, anchor:'95%' }); this.startDayField = new Ext.form.ComboBox({ fieldLabel:lan['weekStartDayField.label'], editable:false, store: Ext.ux.calendar.Mask.getStartDayStore(), displayField:'display', valueField:'value' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, anchor:'95%' }); // was formpanel this.generalForm = new Ext.Panel({ layout: 'form', title:lan['generalForm.title'], frame:true, border:false, style:'padding:10px;', bodyStyle:'background:transparent;', labelWidth:180, items:[ this.hourFormatField, this.fromtoFormatField, this.startDayField, this.readOnlyField, this.languageField ] }); // was formpanel this.dwViewForm = new Ext.Panel({ layout: 'form', title:lan['dwViewForm.title'], frame:true, border:false, style:'padding:10px;', bodyStyle:'background:transparent;', labelWidth:180, items:[ this.dayFormatField, this.weekFormatField, this.createByDblClickField, this.singleDayField, this.activeStartTimeField, this.activeEndTimeField, this.hideInactiveTimeField, this.intervalField ] }); //was formpanel this.monthViewForm = new Ext.Panel({ layout: 'form', title:lan['monthViewForm.title'], frame:true, border:false, style:'padding:10px;', bodyStyle:'background:transparent;', labelWidth:180, items:[ this.monthFormatField ] }); this.tabs = new Ext.TabPanel({ border:false, activeTab:0, deferredRender:true, resizeTabs:true, tabWidth:1000, minTabWidth:0, layoutOnTabChange:true, hideMode:'offsets', items:[ this.generalForm, this.dwViewForm, this.monthViewForm ] }); this.applyBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_accept', text:lan['applyBtn.text'], handler:this.onApplyFn, scope:this }); this.resetBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_cancel', text:lan['resetBtn.text'], handler:this.onResetFn, scope:this }); this.closeBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_door_out', text:lan['closeBtn.text'], handler:this.onCloseFn, scope:this }); Ext.ux.calendar.SettingPopup.superclass.constructor.call(this, { iconCls:'icon_feyaCalendar_setting', title:lan['title'], width:500, height:360, closable:true, resizable:false, closeAction:'hide', modal:true, layout:'fit', items:[this.tabs], buttons:[this.resetBtn, this.applyBtn, this.closeBtn] }); }; Ext.extend(Ext.ux.calendar.SettingPopup, Ext.Window, { timeValidator: function(v) { var lan = Ext.ux.calendar.Mask.SettingPopup; var pattern = new RegExp(/[0-2]\d:[0-5]\d/); v = v.toString(); if (5 == v.length && pattern.test(v)) { var sender = this.sender; if (sender.activeStartTimeField && sender.activeEndTimeField) { if (sender.activeStartTimeField.getValue() >= sender.activeEndTimeField.getValue()) { return lan['startEndInvalid']; } } return true; } else { return lan['formatInvalid']; } }, popup: function(data) { this.hourFormatField.setValue(data.hourFormat); this.dayFormatField.setValue(data.dayFormat); this.weekFormatField.setValue(data.weekFormat); this.monthFormatField.setValue(data.monthFormat); this.fromtoFormatField.setValue(data.fromtoFormat); this.languageField.setValue(data.language); this.createByDblClickField.setValue(data.createByDblclick); this.singleDayField.setValue(!data.singleDay); this.activeStartTimeField.setValue(data.activeStartTime); this.activeEndTimeField.setValue(data.activeEndTime); this.hideInactiveTimeField.setValue(data.hideInactiveRow); this.intervalField.setValue(data.intervalSlot); this.startDayField.setValue(data.startDay); this.readOnlyField.setValue(data.readOnly); this.show(); }, onApplyFn: function() { var flag = true; if (!this.generalForm.getForm().isValid()) { flag = false; this.tabs.setActiveTab(this.generalForm); } else if (!this.dwViewForm.getForm().isValid()) { flag = false; this.tabs.setActiveTab(this.dwViewForm); } else if (!this.monthViewForm.getForm().isValid()) { flag = false; this.tabs.setActiveTab(this.monthViewForm); } if (flag) { var cc = this.calendarContainer; var wp = cc.ownerCt.westPanel; var eh = cc.ehandler; var hourFormat = this.hourFormatField.getValue(); var dayFormat = this.dayFormatField.getValue(); var weekFormat = this.weekFormatField.getValue(); var monthFormat = this.monthFormatField.getValue(); var fromtoFormat = this.fromtoFormatField.getValue(); var language = this.languageField.getValue(); var createByDblclick = this.createByDblClickField.getValue(); var singleDay = !this.singleDayField.getValue(); var activeStartTime = this.activeStartTimeField.getValue(); var activeEndTime = this.activeEndTimeField.getValue(); var hideInactiveRow = this.hideInactiveTimeField.getValue(); var intervalSlot = this.intervalField.getValue(); var startDay = this.startDayField.getValue(); var readOnly = this.readOnlyField.getValue(); var params = { hourFormat: hourFormat, dayFormat: dayFormat, weekFormat: weekFormat, monthFormat: monthFormat, fromtoFormat: fromtoFormat, language: language, createByDblclick: createByDblclick, singleDay: singleDay, activeStartTime: activeStartTime, activeEndTime: activeEndTime, hideInactiveRow: hideInactiveRow, readOnly: readOnly, intervalSlot: intervalSlot, startDay: startDay }; eh.ds.updateSetting(params, function(backObj) { if (eh.language != language || eh.createByDblclick != createByDblclick || eh.singleDay != singleDay || eh.activeStartTime != activeStartTime || eh.activeEndTime != activeEndTime || eh.hideInactiveRow != hideInactiveRow || eh.intervalSlot != intervalSlot || eh.startDay != startDay || eh.readOnly != readOnly) { window.location = window.location.href; return; } var cs = eh.calendarSetting; Ext.apply(cs, params); eh.applyCalendarSetting(eh); var de = cc.detailEditor; de.reloadStartTimeStore(); var sv = de.startTimeField.getValue(); de.startTimeField.setValue(sv); de.reloadEndTimeStore(sv); de.endTimeField.setValue(de.endTimeField.getValue()); var cv = cc.currentView; eh.checkExpireEvents(); eh.applyCalendarSetting(wp); wp.changeDateLabel(cv.daySet[0], cv.daySet[cv.daySet.length - 1]); var dv = cc.dayView; dv.dayFormat = dayFormat; eh.applyCalendarSetting(dv); dv.refreshLefter(); dv.refreshDate(); var wv = cc.weekView; wv.dayFormat = weekFormat; eh.applyCalendarSetting(wv); wv.refreshLefter(); wv.refreshDate(); var wov = cc.weekOnlyView; wov.dayFormat = weekFormat; eh.applyCalendarSetting(wov); wov.refreshLefter(); wov.refreshDate(); var mv = cc.monthView; mv.dayFormat = monthFormat; eh.applyCalendarSetting(mv); mv.refreshDate(); cv.checkLayout(true); }, this); this.onCloseFn(); } }, onCloseFn: function() { this.hide(); }, onResetFn: function() { this.generalForm.getForm().reset(); this.dwViewForm.getForm().reset(); this.monthViewForm.getForm().reset(); } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns('Ext.ux.calendar'); Ext.ux.calendar.Editor = function(config){ Ext.apply(this, config); this.ehandler.applyCalendarSetting(this); var lan = Ext.ux.calendar.Mask.Editor; this.timeField = new Ext.util.LabelField({ fieldLabel:lan['startDayField.label'], anchor:'99%' }); this.subjectField = new Ext.form.TextField({ fieldLabel:lan['subjectField.label'], anchor:'99%' }); this.contentField = new Ext.form.TextField({ fieldLabel:lan['contentField.label'], anchor:'99%' }); var tpl = '' + '

' + this.ehandler.cTplStr + '

' + ''; this.calendarField = new Ext.form.ComboBox({ fieldLabel:lan['calendarField.label'], store:Ext.ux.calendar.Mask.getCalendarStore(), displayField:'title', valueField:'id' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, anchor:'99%', editable:false, tpl:tpl, initList:function(){ Ext.form.ComboBox.prototype.initList.call(this); this.list.setZIndex(999999); } }); this.alertCB = new Ext.form.Checkbox({ anchor:'99%', boxLabel:lan['alertCB.label'] }); this.deleteBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_delete', text:lan['deleteBtn.text'], disabled:true, handler:this.onRemoveFn, scope:this }); this.saveBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_accept', text:lan['saveBtn.text'], handler:this.onSaveFn, scope:this }); this.detailBtn = new Ext.Button({ text:lan['detailSetting'], handler:this.onDetailFn, scope:this }); this.cancelBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_cancel', minWidth:80, text:lan['cancelBtn.text'], handler:this.onCancelFn, scope:this }); // was formpanel this.formpanel = new Ext.Panel({ border:false, style:'padding:10px;', labelWidth:75, frame:true, items:[ this.timeField, this.subjectField, this.contentField, { border:false, layout:'column', items:[{ columnWidth:.7, border:false, layout:'form', items:[this.calendarField] }, { columnWidth:.3, border:false, items:[this.alertCB] }] } ], buttonAlign:'center', buttons:[this.detailBtn, this.deleteBtn, this.saveBtn, this.cancelBtn] }); Ext.ux.calendar.Editor.superclass.constructor.call(this, { style:'left:-1000px;top:-1000px;', title:' ', width:460, height:180, baseCls:'x-tip', closable:true, closeAction:'onCancelFn', resizable:false, frame:true, floating:{shadow:true,shim:true,useDisplay:true,constrain:false}, items:[this.formpanel] }); this.addEvents( 'showdetailsetting', 'hided', 'hideeditor', 'showed' ); this.on('render', this.onRenderFn, this); this.on('showed', this.onShowFn, this); this.on('hided', this.onHideFn, this); this.on('hideeditor', this.onHideEditorFn, this); this.calendarField.on('select', this.onCalendarSelectFn, this); }; Ext.extend(Ext.ux.calendar.Editor, Ext.Panel, { initComponent:function(){ Ext.ux.calendar.Editor.superclass.initComponent.call(this); if(this.closable && !this.title){ this.elements += ',header'; } }, afterRender:function(){ Ext.ux.calendar.Editor.superclass.afterRender.call(this); if(this.closable){ this.addTool({ id:'close', handler:this[this.closeAction], scope:this }); } }, onRenderFn:function(p){ p.getEl().on('mousedown', function(e){ this.mdFlag = true; }, this); p.getEl().on('mouseup', function(e){ delete(this.mdFlag); e.stopPropagation(); }, this); }, onDetailFn:function(){ this.hideEditor(); this.fireEvent('showdetailsetting', this.obj); }, onCalendarSelectFn:function(combo, rd, index){ var coverEl = this.bindEl; if(coverEl && !coverEl.hold){ var event = coverEl.bindEvent; var cview = coverEl.cview; var eh = cview.ehandler; var color = eh.calendarSet[rd.data.id].color; var arr = Ext.DomQuery.select('div[name=x-event-'+event.day+'-'+event.eday+'-'+event.eventId+']', cview.body.dom); for(var i = 0, len = arr.length; i < len; i++){ coverEl = Ext.get(arr[i]); if(0 == event.startRow && this.rowCount == event.endRow){ if(this.oldColor != color){ eh.changeWholeColor(coverEl, this.oldColor, color); } }else{ if(this.oldColor != color){ if(cview instanceof Ext.ux.calendar.DayView){ eh.changeEventColor(coverEl, this.oldColor, color); }else{ eh.changeLegendColor(coverEl, this.oldColor, color); } } } } } this.oldColor = color; }, onRemoveFn:function(){ var lan = Ext.ux.calendar.Mask.EventHandler; var coverEl = this.bindEl; var be = coverEl.bindEvent; var cview = coverEl.cview; var eh = cview.ehandler; var col = coverEl.col; if(coverEl){ if('string' == Ext.type(be.repeatType)){ eh.freeEventEl(coverEl); eh.deleteEvent(be, cview, col); }else{ Ext.Msg.show({ title:lan['deleteRepeatPopup.title'], msg:lan['deleteRepeatPopup.msg'], buttons: Ext.Msg.YESNOCANCEL, fn: function(bid, text){ if('yes' == bid){ eh.freeEventEl(coverEl); eh.deleteRepeatEvent(be, cview); }else if('no' == bid){ eh.freeEventEl(coverEl); eh.deleteRepeatEvent(be, cview, true); } }, icon: Ext.MessageBox.QUESTION }); } } cview.fireEvent('canceldetail'); this.hideEditor(); }, onSaveFn:function(){ if(this.formpanel.form.isValid()){ var eh = this.ehandler; var cview = this.cview; if(this.bindEl){ var coverEl = this.bindEl; var event = coverEl.bindEvent; var oevent = Ext.apply({}, event); if('add' == this.action && !coverEl.hold){ coverEl.remove(); } event.repeatType = event.repeatType || 'no'; event.allDay = false; event.alertFlag = this.alertCB.checked; if(!event.locked){ event.locked = false; } event.subject = this.subjectField.getValue(); event.content = this.contentField.getValue(); event.calendarId = this.calendarField.getValue(); event.color = eh.calendarSet[event.calendarId].color; if('add' == this.action){ if('string' == Ext.type(event.repeatType)){ eh.createEvent(event, cview); }else{ eh.createRepeatEvent(event, cview); } }else if('update' == this.action){ if('string' == Ext.type(oevent.repeatType) && 'string' == Ext.type(event.repeatType)){ eh.updateEvent(event, cview, null, oevent, this.noLayout); }else{ if('string' == Ext.type(event.repeatType)){ /* * need ask user to choose apply all or just current one */ var lan = Ext.ux.calendar.Mask.EventHandler; Ext.Msg.show({ title:lan['updateRepeatPopup.title'], msg:lan['updateRepeatPopup.msg'], buttons: Ext.Msg.YESNOCANCEL, fn: function(bid, text){ if('yes' == bid){ eh.updateRepeatEvent(event, cview, oevent); }else if('no' == bid){ event.repeatType = 'exception'; eh.updateRepeatEvent(event, cview, oevent); } }, icon: Ext.MessageBox.QUESTION }); }else{ eh.updateRepeatEvent(event, cview, oevent); } } } } cview.fireEvent('canceldetail'); this.hideEditor(); } }, onCancelFn:function(){ var coverEl = this.bindEl; if(coverEl){ var cview = this.cview; var event = coverEl.bindEvent; var eh = this.ehandler; if(!coverEl.hold){ if('add' == this.action){ coverEl.remove(); }else{ var color = eh.calendarSet[event.calendarId].color; if(0 == event.startRow && this.rowCount == event.endRow){ if(this.oldColor != color){ eh.changeWholeColor(coverEl, this.oldColor, color); } }else{ if(this.oldColor != color){ if(cview instanceof Ext.ux.calendar.DayView){ eh.changeEventColor(coverEl, this.oldColor, color); }else{ eh.changeLegendColor(coverEl, this.oldColor, color); } } } } } this.hideEditor(); } }, popup:function(obj){ var eh = this.ehandler; eh.floating = true; this.obj = obj; this.noLayout = obj.noLayout; this.bindEl = obj.bindEl; this.cview = obj.cview; this.action = obj.action; var lan = Ext.ux.calendar.Mask.Editor; if('add' == this.action){ this.deleteBtn.disable(); this.setIconClass('x-event-editor-title-add'); this.setTitle(lan['new.title']); }else{ this.deleteBtn.enable(); this.setTitle(lan['edit.title']); this.setIconClass('x-event-editor-title-edit'); } this.showAt(this.adjustXY(this.bindEl)); }, adjustXY:function(pn){ var pxy = pn.getXY(); var cview = pn.cview; var xy = [0, 0]; var w = this.width, h = this.height; var r = pxy[0]+w; xy[0] = pxy[0]; var right = cview.body.getRight(); if(r > right){ xy[0] = right-w; } xy[1] = pxy[1]-h; var top = cview.body.getTop(); if(xy[1] < top){ if(pxy[1] > top){ xy[1] = pxy[1]+20; }else{ xy[1] = top+20; } } return xy; }, reloadCalendar:function(eh){ var store = this.calendarField.store; store.removeAll(); for(var p in eh.calendarSet){ var calendar = eh.calendarSet[p]; if(true !== calendar.hide){ var rd = new (store.recordType)({ id:calendar.id, title:calendar.name, description:calendar.description, color:calendar.color }); store.add(rd); } } }, onShowFn:function(){ var eh = this.ehandler; if(this.bindEl){ var coverEl = this.bindEl; if(!coverEl.hold){ eh.setEditingStatus(coverEl, true); } var bindEvent = coverEl.bindEvent; var time = ''+eh.generateInfo(bindEvent)+''; this.timeField.setText(time); this.subjectField.setValue(bindEvent.subject); this.contentField.setValue(bindEvent.content); if(bindEvent.alertFlag){ this.alertCB.setValue(true); }else{ this.alertCB.setValue(false); } this.reloadCalendar(eh); this.calendarField.setValue(bindEvent.calendarId); this.oldColor = eh.calendarSet[bindEvent.calendarId].color; }else{ } }, onHideFn:function(){ var eh = this.ehandler; eh.floating = false; var cview = this.cview; if(this.bindEl){ //cview.resizePort(); cview.resetSCover(); } delete(this.bindEl); delete(this.cview); delete(this.noLayout); delete(this.action) }, hideEditor:function(){ if(!this.hided){ this.hided = true; this.showAt([-1000, -1000], true); this.fireEvent('hided'); } }, showAt:function(xy, hold){ if(!hold){ this.fireEvent('showed'); delete(this.hided); } this.setPagePosition(xy[0], xy[1]); }, onHideEditorFn:function(){ if(!this.mdFlag){ this.onCancelFn(); } } }); /** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns('Ext.ux.calendar'); Ext.ux.calendar.DetailEditor = function(config){ Ext.apply(this, config); this.ehandler.applyCalendarSetting(this); var lan = Ext.ux.calendar.Mask.Editor; this.startDayField = new Ext.form.DateField({ fieldLabel:lan['startDayField.label'], value:new Date(), format:'Y-m-d', allowBlank: false, anchor:'95%', editable:false, disabled:this.singleDay }); this.startDayField.on('select', this.onStartEndDayCheckFn, this); this.startTimeField = new Ext.form.ComboBox({ hideLabel:true, labelSeparator:'', store:Ext.ux.calendar.Mask.getTimeStore(), displayField:'hour', valueField:'row' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, editable:false, anchor:'95%' }); this.startTimeField.on('select', this.onStartTimeSelectFn, this); this.endDayField = new Ext.form.DateField({ fieldLabel:lan['endDayField.label'], labelSeparator:'', format:'Y-m-d', value:new Date(), allowBlank: false, anchor:'95%', editable:false, disabled:this.singleDay }); this.endDayField.on('select', this.onStartEndDayCheckFn, this); this.endTimeField = new Ext.form.ComboBox({ hideLabel:true, labelSeparator:'', store: Ext.ux.calendar.Mask.getTimeStore(), displayField:'hour', valueField:'row' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, editable:false, anchor:'95%' }); this.wholeField = new Ext.form.Checkbox({ hideLabel:true, labelSeparator:'', boxLabel:lan['wholeField.label'] }); this.wholeField.on('check', this.onWholeCheck, this); this.repeatTypeField = new Ext.form.ComboBox({ fieldLabel:lan['repeatTypeField.label'], store: Ext.ux.calendar.Mask.getRepeatTypeStore(), displayField:'display', valueField:'value' , typeAhead:true, mode:'local', triggerAction:'all', selectOnFocus:true, allowBlank: false, editable:false, anchor:'99%' }); this.subjectField = new Ext.form.TextField({ fieldLabel:lan['subjectField.label'], anchor:'99%' }); this.contentField = new Ext.form.TextArea({ fieldLabel:lan['contentField.label'], height:70, anchor:'99%' }); var tpl = '' + '

' + this.ehandler.cTplStr + '

' }); var cws; if(Ext.isIE){ if('3.0.3' == Ext.version){ cws = [0.4, 0.2, 0.38, 0.4, 0.6]; }else{ cws = [0.2, 0.1, 0.3, 0.2, 0.3]; } }else{ cws = [0.4, 0.2, 0.38, 0.4, 0.6]; } // was formpanel this.repeatForm = new Ext.Panel({ layout: 'form', border:false, style:'padding:10px;', frame:true, autoHeight:true, labelWidth:80, items:[ this.repeatTypeField, { border:false, style:'padding-left:85px;', layout:'column', items:[{ border:false, columnWidth:.25, layout:'form', items:[this.repeatIntervalField] }, { border:false, columnWidth:.2, items:[this.intervalUnitLabel] }] }, this.repeatInfoPanel, { border:false, style:'padding-left:85px;', layout:'form', items:[this.weekCheckGroup] }, { border:false, style:'padding-left:85px;', layout:'form', items:[this.monthRadioGroup] }, { border:false, style:'padding-left:85px;', layout:'column', items:[{ border:false, columnWidth:.5, layout:'form', labelWidth:75, items:[this.repeatStartField] }, { border:false, columnWidth:.5, items:[ this.repeatNoEndRG, { border:false, layout:'column', items:[{ border:false, columnWidth:cws[0], items:[this.repeatEndTimeRG] }, { border:false, columnWidth:cws[1], items:[this.repeatEndTimeField] }, { border:false, columnWidth:cws[2], layout:'form', labelWidth:95, items:[{ xtype:'textfield', fieldLabel:lan['repeatEndTimeUnit'], labelSeparator:'', hidden:true }] }] }, { border:false, layout:'column', items:[{ border:false, columnWidth:cws[3], items:[this.repeatEndDateRG] }, { border:false, columnWidth:cws[4], layout:'form', items:[this.repeatEndDateField] }] } ] }] } ] }); Ext.ux.calendar.DetailEditor.superclass.constructor.call(this, { border:false, autoScroll:true, items:[{ border:false, width:650, layout:'form', items:[ this.generalForm, this.repeatForm ] }], buttonAlign:'center', buttons:[this.returnBtn, this.saveBtn, this.cancelBtn] }); this.addEvents( 'showdetailsetting' ); this.repeatTypeField.on('select', this.onRepeatTypeSelectFn, this); this.calendarField.on('select', this.onCalendarSelectFn, this); this.repeatNoEndRG.on('check', this.onRepeatNoEndCheckFn, this); this.repeatEndTimeRG.on('check', this.onRepeatEndTimeCheckFn, this); this.repeatEndDateRG.on('check', this.onRepeatEndDateCheckFn, this); }; Ext.extend(Ext.ux.calendar.DetailEditor, Ext.ux.calendar.BasicView, { onRepeatIntervalValidFn:function(){ this.refreshRepeatInfo(); }, onRepeatStartSelectFn:function(df){ this.refreshRepeatInfo(); }, refreshRepeatInfo:function(){ var beginDate = this.repeatStartField.getValue(); var intervalSlot = this.repeatIntervalField.getValue(); var getIntervalText = Ext.ux.calendar.Mask.getIntervalText; var lan = Ext.ux.calendar.Mask.Editor; var v = this.repeatTypeField.getValue(); var str = ''; if('day' == v){ this.updateRepeatInfo(getIntervalText(v, intervalSlot)); }else if('week' == v){ var monday = beginDate.add(Date.DAY, 1-beginDate.format('N')); var cbs = this.weekCheckGroup.items; var num = 0; for(var i = 0, len = cbs.getCount(); i < len; i++){ var cb = cbs.get(i); if(cb.checked){ num++; str += monday.add(Date.DAY, i).format('l')+' '; } } if(7 == num){ str = lan['repeatDayInfo']; }else if(0 == num){ str = beginDate.format('l') } this.updateRepeatInfo(getIntervalText(v, intervalSlot)+str); }else if('month' == v){ var rds = this.monthRadioGroup.items; if(rds.get(1).checked){ str = Ext.ux.calendar.Mask.getWeekDayInMonth(beginDate); }else{ str = beginDate.format('d'); } this.updateRepeatInfo(getIntervalText(v, intervalSlot)+str); }else if('year' == v){ this.updateRepeatInfo(getIntervalText(v, intervalSlot)+beginDate.format('m-d')); } }, updateRepeatInfo:function(html){ var div = this.repeatInfoPanel.body.dom.firstChild.firstChild; div.innerHTML = html; }, onRepeatTypeSelectFn:function(combo, rd, index){ var v = combo.getValue(); this.resetRepeatSetting(v, this.bindEl.bindEvent); }, resetRepeatSetting:function(v, event){ var rt = event.repeatType || 'no'; var lan = Ext.ux.calendar.Mask.Editor; var items = this.repeatForm.items; if('no' == v || 'exception' == v){ items.get(1).hide(); items.get(2).hide(); items.get(3).hide(); items.get(4).hide(); items.get(5).hide(); }else{ items.get(1).show(); items.get(2).show(); if('day' == v || 'year' == v){ if('day' == v){ this.intervalUnitLabel.setText(lan['intervalUnitLabel.day.text']); }else{ this.intervalUnitLabel.setText(lan['intervalUnitLabel.year.text']); } items.get(3).hide(); items.get(4).hide(); }else if('week' == v){ this.intervalUnitLabel.setText(lan['intervalUnitLabel.week.text']); items.get(3).show(); this.weekCheckGroup.reset(); var cbs = this.weekCheckGroup.items; cbs.each(function(it){ it.checked = false; }); if('string' != Ext.type(rt)){ var rday = rt.rday; for(var p in rday){ cbs.get(p-1).setValue(true); } } items.get(4).hide(); }else if('month' == v){ this.intervalUnitLabel.setText(lan['intervalUnitLabel.month.text']); items.get(3).hide(); items.get(4).show(); this.monthRadioGroup.reset(); var rds = this.monthRadioGroup.items; rds.each(function(it){ it.checked = false; }); if('string' != Ext.type(rt)){ var rby = rt.rby; if('day' == rby){ rds.get(1).setValue(true); }else{ rds.get(0).setValue(true); } } } items.get(5).show(); this.repeatForm.doLayout(); this.repeatNoEndRG.checked = false; this.repeatEndTimeRG.checked = false; this.repeatEndDateRG.checked = false; if('string' != Ext.type(rt)){ this.repeatIntervalField.setValue(rt.intervalSlot); this.repeatStartField.setValue(rt.beginDay); if('no' == rt.endDay){ if(false != Ext.type(rt.rtime)){ this.repeatEndTimeRG.setValue(true); }else{ this.repeatNoEndRG.setValue(true); } }else{ this.repeatEndDateRG.setValue(true); this.repeatEndDateField.setValue(rt.endDay); } }else{ if('day' == v){ this.repeatIntervalField.setValue(Ext.ux.calendar.Mask.getDayOffset(event.day, event.eday)+1); }else{ this.repeatIntervalField.setValue(1); } this.repeatStartField.setValue(event.day); this.repeatNoEndRG.setValue(true); } this.refreshRepeatInfo(); } }, onRepeatNoEndCheckFn:function(cb, checked){ if(checked){ this.repeatEndTimeField.disable(); this.repeatEndDateField.disable(); } }, onRepeatEndTimeCheckFn:function(cb, checked){ if(checked){ this.repeatEndTimeField.enable(); this.repeatEndDateField.disable(); } }, onRepeatEndDateCheckFn:function(cb, checked){ if(checked){ this.repeatEndTimeField.disable(); this.repeatEndDateField.enable(); } }, onReturnFn:function(){ var calendarContainer = this.ownerCt; var cview = this.bview; calendarContainer.getLayout().setActiveItem(cview); cview.checkLayout(true); }, onStartEndDayCheckFn:function(df){ var sdate = this.startDayField.getValue(); var sday = sdate.format('Y-m-d'); var edate = this.endDayField.getValue(); var eday = edate.format('Y-m-d'); if(sday >= eday){ if(df == this.startDayField){ this.endDayField.setValue(sdate); }else if(df == this.endDayField){ this.startDayField.setValue(edate); } var sv = this.startTimeField.getValue(); var ev = this.endTimeField.getValue(); this.reloadEndTimeStore(sv); if(sv > ev){ ev = sv+this.numInHour; if(ev >= this.activeEndRow){ ev = this.activeEndRow-1; } this.endTimeField.setValue(ev); } } }, reloadStartTimeStore:function(all){ var store = this.startTimeField.store; store.removeAll(); var data; if(all){ data = Ext.ux.calendar.Mask.generateIntervalData(this.intervalSlot, 0, this.rowCount-1, this.ehandler.hourFormat); }else{ data = Ext.ux.calendar.Mask.generateIntervalData(this.intervalSlot, this.activeStartRow, this.activeEndRow-1, this.ehandler.hourFormat); } store.loadData(data); }, reloadEndTimeStore:function(sIndex, all){ var store = this.endTimeField.store; store.removeAll(); var data; if(all){ data = Ext.ux.calendar.Mask.generateIntervalData(this.intervalSlot, 0, this.rowCount, this.ehandler.hourFormat); }else{ if(false == Ext.type(sIndex)){ sIndex = this.activeStartRow; }else{ sIndex++; } data = Ext.ux.calendar.Mask.generateIntervalData(this.intervalSlot, sIndex, this.activeEndRow, this.ehandler.hourFormat); } store.loadData(data); }, onStartTimeSelectFn:function(combo, rd, index){ var v = combo.getValue(); var eIndex; var sday = this.startDayField.getValue().format('Y-m-d'); var eday = this.endDayField.getValue().format('Y-m-d'); if(this.bindEl){ var event = this.bindEl.bindEvent; if(sday != eday){ this.reloadEndTimeStore(); }else{ var span = event.endRow-event.startRow; eIndex = v+span; this.reloadEndTimeStore(v); } } if(false != Ext.type(eIndex)){ if(this.activeEndRow >= eIndex){ this.endTimeField.setValue(eIndex); }else{ this.endTimeField.setValue(this.activeEndRow); } } }, onCalendarSelectFn:function(combo, rd, index){ var coverEl = this.bindEl; if(coverEl && !coverEl.hold){ var event = coverEl.bindEvent; var cview = coverEl.cview; var eh = cview.ehandler; var color = eh.calendarSet[rd.data.id].color; var arr = Ext.DomQuery.select('div[name=x-event-'+event.day+'-'+event.eday+'-'+event.eventId+']', cview.body.dom); for(var i = 0, len = arr.length; i < len; i++){ coverEl = Ext.get(arr[i]); if(coverEl instanceof Ext.Element){ if(0 == event.startRow && this.rowCount == event.endRow){ if(this.oldColor != color){ eh.changeWholeColor(coverEl, this.oldColor, color); } }else{ if(this.oldColor != color){ if(cview instanceof Ext.ux.calendar.DayView){ eh.changeEventColor(coverEl, this.oldColor, color); }else{ eh.changeLegendColor(coverEl, this.oldColor, color); } } } } } } this.oldColor = color; }, onWholeCheck:function(){ var sday = this.startDayField.getValue().format('Y-m-d'); var eday = this.endDayField.getValue().format('Y-m-d'); if(this.bindEl){ var event = this.bindEl.bindEvent; if(this.wholeField.checked){ var getHMFromRow = Ext.ux.calendar.Mask.getHMFromRow; this.reloadStartTimeStore(true); this.reloadEndTimeStore(null, true); this.startTimeField.setRawValue(getHMFromRow(this.intervalSlot, 0, this.hourFormat)); this.endTimeField.setRawValue(getHMFromRow(this.intervalSlot, this.rowCount, this.hourFormat)); this.startTimeField.disable(); this.endTimeField.disable(); }else{ var startRow, endRow; startRow = (this.activeStartRow <= event.startRow)?event.startRow:this.activeStartRow; endRow = (this.activeEndRow >= event.endRow)?event.endRow:this.activeEndRow-1; this.reloadStartTimeStore(); this.startTimeField.setValue(startRow); if(sday == eday && this.rowCount != event.endRow){ this.reloadEndTimeStore(startRow); }else{ this.reloadEndTimeStore(); } this.endTimeField.setValue(endRow); this.startTimeField.enable(); this.endTimeField.enable(); } this.startDayField.setValue(event.day); this.endDayField.setValue(event.eday); } }, onSaveFn:function(){ if(this.generalForm.form.isValid()){ if(this.bindEl){ var coverEl = this.bindEl; var event = coverEl.bindEvent; var oevent = Ext.apply({}, event); var cview = coverEl.cview; var eh = cview.ehandler; if('add' == this.action && !coverEl.hold){ coverEl.remove(); } // check whether this is all day if(this.wholeField.checked){ event.allDay = true; event.startRow = 0; event.endRow = this.rowCount; }else{ event.startRow = parseInt(this.startTimeField.getValue()); event.endRow = parseInt(this.endTimeField.getValue()); } event.day = this.startDayField.getValue().format('Y-m-d'); var edate = this.endDayField.getValue(); if(0 == event.endRow){ edate = edate.add(Date.DAY, -1); event.endRow = this.rowCount; } event.eday = edate.format('Y-m-d'); event.subject = this.subjectField.getValue(); event.content = this.contentField.getValue(); event.calendarId = this.calendarField.getValue(); event.color = eh.calendarSet[event.calendarId].color; event.alertFlag = this.alertCB.checked; event.locked = this.lockCB.checked; // continue in repeat type event = this.handleRepeatType(event); if('add' == this.action){ if('string' == Ext.type(event.repeatType)){ eh.createEvent(event, cview); }else{ eh.createRepeatEvent(event, cview); } }else if('update' == this.action){ if('string' == Ext.type(oevent.repeatType) && 'string' == Ext.type(event.repeatType)){ event.repeatType = oevent.repeatType; eh.updateEvent(event, cview, null, oevent, this.noLayout); }else{ if('string' == Ext.type(event.repeatType)){ /* * need ask user to choose apply all or just current one */ var lan = Ext.ux.calendar.Mask.EventHandler; Ext.Msg.show({ title:lan['updateRepeatPopup.title'], msg:lan['updateRepeatPopup.msg'], buttons: Ext.Msg.YESNOCANCEL, fn: function(bid, text){ if('yes' == bid){ eh.updateRepeatEvent(event, cview, oevent); }else if('no' == bid){ event.repeatType = 'exception'; eh.updateRepeatEvent(event, cview, oevent); } }, icon: Ext.MessageBox.QUESTION }); }else{ eh.updateRepeatEvent(event, cview, oevent); } } } } cview.fireEvent('canceldetail'); this.onReturnFn(); } }, handleRepeatType:function(e){ var event = Ext.apply({}, e); var nrt = this.repeatTypeField.getValue(); if('no' == nrt){ event.repeatType = 'no'; }else{ var o = { rtype:nrt, intervalSlot:this.repeatIntervalField.getValue(), dspan:Ext.ux.calendar.Mask.getDayOffset(e.day, e.eday), beginDay:this.repeatStartField.getValue().format('Y-m-d') }; if(this.repeatNoEndRG.checked){ o.endDay = 'no'; }else if(this.repeatEndTimeRG.checked){ o.endDay = 'no'; o.rtime = this.repeatEndTimeField.getValue(); }else if(this.repeatEndDateRG.checked){ o.endDay = this.repeatEndDateField.getValue().format('Y-m-d'); } if('week' == nrt){ var obj = {}; var items = this.weekCheckGroup.items; var flag = false; for(var i = 0, len = items.getCount(); i < len; i++){ var it = items.get(i); if(it.checked){ flag = true; obj[i+1] = true; } } if(!flag){ var n = Date.parseDate(event.day, 'Y-m-d').format('N'); obj[n] = true; } o.rday = obj; }else if('month' == nrt){ var items = this.monthRadioGroup.items; if(true == items.get(0).checked){ o.rby = 'date'; }else{ o.rby = 'day'; } } event.repeatType = o; } return event; }, onCancelFn:function(){ var coverEl = this.bindEl; var coverEl = this.bindEl; if(coverEl){ var cview = coverEl.cview; var event = coverEl.bindEvent; var eh = cview.ehandler; if(!coverEl.hold){ if('add' == this.action){ this.bindEl.remove(); }else{ var color = eh.calendarSet[event.calendarId].color; if(0 == event.startRow && this.rowCount == event.endRow){ if(this.oldColor != color){ eh.changeWholeColor(coverEl, this.oldColor, color); } }else{ if(this.oldColor != color){ if(cview instanceof Ext.ux.calendar.DayView){ eh.changeEventColor(coverEl, this.oldColor, color); }else{ eh.changeLegendColor(coverEl, this.oldColor, color); } } } } } this.onReturnFn(); } }, setup:function(obj){ this.noLayout = obj.noLayout; this.bindEl = obj.bindEl; this.action = obj.action; this.bview = obj.cview; if(this.bindEl){ var coverEl = this.bindEl; var cview = coverEl.cview; var eh = cview.ehandler; if(coverEl instanceof Ext.Element){ eh.setEditingStatus(coverEl, true); } var bindEvent = coverEl.bindEvent; // check whether it is whole day if(bindEvent.endRow == this.rowCount && bindEvent.startRow == 0){ this.wholeField.setValue(true); }else{ if(this.wholeField.getValue()){ this.wholeField.setValue(false); }else{ this.reloadStartTimeStore(); if(bindEvent.day != bindEvent.eday){ this.reloadEndTimeStore(); }else{ this.reloadEndTimeStore(bindEvent.startRow); } } } this.repeatStartField.setValue(bindEvent.day); this.startTimeField.setValue(bindEvent.startRow); this.endTimeField.setValue(bindEvent.endRow); this.subjectField.setValue(bindEvent.subject); this.contentField.setValue(bindEvent.content); this.startDayField.setValue(bindEvent.day); this.endDayField.setValue(bindEvent.eday); var v = 'no'; var rt = bindEvent.repeatType; if(rt && 'string' != Ext.type(rt)){ v = rt.rtype; } if('exception' == v){ v = 'no'; } this.repeatTypeField.setValue(v); this.resetRepeatSetting(v, bindEvent); if(bindEvent.alertFlag){ this.alertCB.setValue(true); }else{ this.alertCB.setValue(false); } if(bindEvent.locked){ this.lockCB.setValue(true); }else{ this.lockCB.setValue(false); } this.reloadCalendar(eh); this.calendarField.setValue(bindEvent.calendarId); this.oldColor = eh.calendarSet[bindEvent.calendarId].color; } else { this.wholeField.setValue(true); } this.generalForm.doLayout(); this.repeatForm.doLayout(); }, reloadCalendar:function(eh){ var store = this.calendarField.store; store.removeAll(); for(var p in eh.calendarSet){ var calendar = eh.calendarSet[p]; if(true !== calendar.hide){ var rd = new (store.recordType)({ id:calendar.id, title:calendar.name, description:calendar.description, color:calendar.color }); store.add(rd); } } } }); /** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns('Ext.ux.calendar'); Ext.ux.calendar.CalendarEditor = function(config){ Ext.apply(this, config); var lan = Ext.ux.calendar.Mask.CalendarEditor; this.nameField = new Ext.form.TextField({ name:'name', fieldLabel:lan['nameField.label'], allowBlank:false, anchor:'99%' }); this.descriptionField = new Ext.form.TextField({ name:'description', fieldLabel:lan['descriptionField.label'], anchor:'99%' }); this.colorField = new Ext.ColorPalette({}); this.colorField.on('select', this.onColorSelectFn, this); this.colorField.colors = Ext.ux.calendar.Mask.colors; this.clearBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_delete', minWidth:80, text:lan['clearBtn.text'], handler:this.onClearFn, scope:this }); this.saveBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_accept', minWidth:80, text:lan['saveBtn.text'], handler:this.onSaveFn, scope:this }); this.cancelBtn = new Ext.Button({ iconCls:'icon_feyaCalendar_cancel', minWidth:80, text:lan['cancelBtn.text'], handler:this.onCancelFn, scope:this }); // was formpanel this.formpanel = new Ext.Panel({ cls: 'x-calendar-menu', layout: 'form', border:false, style:'padding:10px;', labelWidth: 70, items:[ this.nameField, this.descriptionField, { border:false, style:'padding-left:60px;', items:[this.colorField] } ], buttonAlign:'right', buttons:[this.clearBtn, this.saveBtn, this.cancelBtn] }); Ext.ux.calendar.CalendarEditor.superclass.constructor.call(this, { width:500, height:160, closable:false, closeAction:'hide', layout:'fit', modal: true, resizable:false, items:[{ border:false, layout:'fit', items:[this.formpanel] }] }); }; Ext.extend(Ext.ux.calendar.CalendarEditor, Ext.Window, { onColorSelectFn:function(cp, color){ this.color = Ext.ux.calendar.Mask.getIndexByColor(color); }, popup:function(obj){ this.action = obj.action; this.show(); var lan = Ext.ux.calendar.Mask.CalendarEditor; if('add' == obj.action){ this.setTitle(lan['new.title']); this.setIconClass('icon_feyaCalendar_calendar'); }else{ this.setTitle(lan['edit.title']); this.setIconClass('icon_feyaCalendar_calendar_edit'); } if(obj.cEl){ this.calendarEl = obj.cEl; }else{ this.calendarEl = null; } var mask = Ext.ux.calendar.Mask; if(obj.data){ this.calendar = obj.data; var data = obj.data; this.nameField.setValue(data.name); this.descriptionField.setValue(data.description); var color = data.color; var cl = Ext.ux.calendar.Mask.getColorByIndex(color); if(cl){ this.colorField.select(cl); }else{ this.colorField.select(mask.colors[0]); } }else{ this.nameField.reset(); this.descriptionField.reset(); this.colorField.select(mask.colors[0]); } }, onClearFn:function(){ this.formpanel.form.reset(); }, onSaveFn:function(){ if(this.formpanel.form.isValid()){ var params = {}; if(this.calendar){ params.id = this.calendar.id; params.hide = this.calendar.hide; }else{ params.hide = false; } params.name = this.nameField.getValue(); params.description = this.descriptionField.getValue(); params.color = this.color; var eh = this.ehandler; eh.ds.createUpdateCalendar(params, function(backObj){ var cEl = this.calendarEl; if(cEl){ var oldColor = cEl.calendar.color; var oldName = cEl.calendar.name; Ext.apply(cEl.calendar, params); var color = cEl.calendar.color; eh.calendarSet[cEl.calendar.id] = cEl.calendar; var titleEl = cEl.child('.x-calendar-title-b'); if(titleEl){ titleEl.dom.innerHTML = ''+params.name+''; } if(oldColor != color){ cEl.calendar.color = oldColor; eh.changeColor(cEl.calendar, color); }else if(oldName != params.name){ eh.checkExpireEvents(); } }else if(backObj.id){ var calendar = Ext.apply({}, params); calendar.id = backObj.id; eh.calendarSet[calendar.id] = calendar; var mc = eh.mainPanel.westPanel.myCalendarPanel; eh.createCalendar(mc.body, null, null, calendar); var css = '.'+eh.id+'-x-calendar-'+calendar.id+'{}'; eh.ss[eh.ss.length] = Ext.util.CSS.createStyleSheet(css, Ext.id()); } }, this); this.hide(); } }, onCancelFn:function(){ this.hide(); } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. * * @class Ext.ux.calendar.EventHandler * @extends Ext.util.Observable * This class represents the primary interface of render, add/edit/delete, drag/drop calendar Event function. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.EventHandler = function(config) { Ext.apply(this, config); this.applyCalendarSetting(this); this.calendarSet = {}; this.dayCache = {}; this.id = Ext.id(); this.ControlID = config.ControlID; Ext.ux.calendar.EventHandler.superclass.constructor.call(this); this.calendarLayout = new Ext.ux.calendar.CalendarLayout({ ehandler: this }); var initobj = this.ds.initialObj; if (initobj) { for (var i = 0, len = initobj.owned.length; i < len; i++) { var c = initobj.owned[i]; this.calendarSet[c.id] = c; } for (var i = 0, len = initobj.shared.length; i < len; i++) { var c = initobj.shared[i]; this.calendarSet[c.id] = c; } this.calendarLayout.repeatSet = initobj.re; } this.detailTpl = new Ext.XTemplate( '

' + '

' + '' + '' + '' + '

' + '{title}' + '

' + '

' + '' + '' + '' + '

' + '

' + '' + '

' + '

' ); /* * The XTemplate for an event render in Ext.ux.calendar.DayView */ this.eventTpl = new Ext.XTemplate( '

' + '

' + '' + '' + '' + '' + '

' + '

' + '{title}' + '

' + '

' + '' + '

' + '' + '' + '

' + '' + '{subject}
{content}' + '

' + '

' + '' + '' + '' + '' + '

' + '

', { isRepeat: function(repeatType) { return ('string' != Ext.type(repeatType)); }, isException: function(repeatType) { return ('exception' == repeatType); }, isAlert: function(alertFlag) { return alertFlag; }, isLocked: function(locked) { return locked; } } ); this.eventTpl.compile(); /* * The XTemplate for an event render in Ext.ux.calendar.MonthView */ this.legendTpl = new Ext.XTemplate( '

' + '' + '{subject}, {title}' + '' + '

', { isRepeat: function(repeatType) { return ('string' != Ext.type(repeatType)); }, isException: function(repeatType) { return ('exception' == repeatType); }, isAlert: function(alertFlag) { return alertFlag; }, isLocked: function(locked) { return locked; } } ); this.legendTpl.compile(); /* * The XTemplate for a whole day event render in both Ext.ux.calendar.DayView and Ext.ux.calendar.MonthView */ this.wholeTpl = new Ext.XTemplate( '

' + '' + '' + '' + '' + '

' + '

' + '' + '

' + '' + '' + ' ' + '' + '' + ' ' + '' + '' + ' ' + '' + '' + ' ' + '' + '{subject}' + '' + '

' + '

' + '' + '

' + '

', { isLeftJoin: function(lflag) { return lflag; }, isRightJoin: function(rflag) { return rflag; }, isRepeat: function(repeatType) { return ('string' != Ext.type(repeatType)); }, isException: function(repeatType) { return ('exception' == repeatType); }, isAlert: function(alertFlag) { return alertFlag; }, isLocked: function(locked) { return locked; } } ); this.wholeTpl.compile(); /* * The XTemplate for a calendar with drop menu, which render in Ext.ux.calendar.WestPanel */ this.cTplStr = '

' + '

{title}

' + '' + '' + '' + '' + '

' + '

' + ' ' + '

' + '

'; this.calendarDropTpl = new Ext.XTemplate( '

' + '' + '' + // TRAKKWARE //'' + '

' + this.cTplStr + '

' + // '

' + //'

' + '

' ); this.calendarDropTpl.compile(); /* * The XTemplate for a calendar, which render in Ext.ux.calendar.Editor and Ext.ux.calendar.ResultView */ this.calendarTpl = new Ext.XTemplate(this.cTplStr); this.calendarTpl.compile(); this.initMenu(); this.initContextMenu(); /* * add some private events */ this.addEvents( 'calendarloaded', 'reloadCalendar', 'createEvent', 'updateEvent', 'deleteEvent', /* * for change all events from one day to another */ 'changeDay', 'deleteCalendar', /* * for clear all events belong to a calendar */ 'clearCalendar', 'changeEventCache', 'changeCalendarColor' ); this.on('reloadCalendar', this.reloadCalendar, this); this.on('changeCalendarColor', this.onChangeCalendarColorFn, this); this.on('changeEventCache', this.onChangeEventCacheFn, this); }; Ext.extend(Ext.ux.calendar.EventHandler, Ext.util.Observable, { /* * for save the css element */ ss: [], hourFormat: '', /* * The basic z-index for events */ baseIndex: 100, /* * widthRatio and posRatio are for caculate the overlap of events */ widthRatio: 0.95, posRatio: 1.05, applyCalendarSetting: function(source) { var cs = this.calendarSetting; var o = Ext.apply({}, cs); delete (o.dayFormat); delete (o.weekFormat); delete (o.monthFormat); Ext.apply(source, o); }, onChangeCalendarColorFn: function() { this.checkExpireEvents.defer(1, this); }, onChangeEventCacheFn: function() { this.checkExpireEvents.defer(1, this); }, showMenu: function(cEl, dEl) { if (this.menu) { this.menu.calendarEl = cEl; var calendar = cEl.calendar; var lan = Ext.ux.calendar.Mask.EventHandler; if (true === this.calendarSet[calendar.id].hide) { this.viewItem.setText(lan['viewItem.show.text']); this.viewItem.setIconClass('icon_feyaCalendar_calendar_show'); } else { this.viewItem.setText(lan['viewItem.hide.text']); this.viewItem.setIconClass('icon_feyaCalendar_calendar_hide'); } var c = 0; for (var p in this.calendarSet) { c++; } if (1 >= c) { this.deleteItem.hide(); } else { this.deleteItem.show(); } if (this.readOnly) { for (var i = 2, len = this.menu.items.getCount(); i < len; i++) { var it = this.menu.items.get(i); it.hide(); } } this.menu.bindEl = dEl; this.menu.show(dEl, this.menuAlign); } return this; }, onMenuShowFn: function(menu) { var calendar = menu.calendarEl.calendar; var color = Ext.ux.calendar.Mask.getColorByIndex(calendar.color); if (color) { menu.palette.still = true; menu.palette.select('#' + color); delete (menu.palette.still); } }, hideMenu: function() { if (this.menu) { this.menu.hide(); } return this; }, showContextMenu: function(e, eEl) { e.stopEvent(); if (this.cmenu) { this.cmenu.eventEl = eEl; var event = eEl.bindEvent; if (event.locked) { this.editItem.hide(); this.lockItem.hide(); this.unlockItem.show(); } else { this.editItem.show(); this.lockItem.show(); this.unlockItem.hide(); } this.cmenu.showAt(e.getXY()); } }, hideContextMenu: function() { if (this.cmenu) { this.cmenu.hide(); } return this; }, /* * Init the drop menu for calendar */ initMenu: function() { var lan = Ext.ux.calendar.Mask.EventHandler; this.showOnlyItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_calendar_show', text: lan['showOnlyItem.text'], handler: this.onShowOnlyFn, scope: this }); this.viewItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_calendar_hide', text: lan['viewItem.hide.text'], handler: this.onViewFn, scope: this }); this.editItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_calendar_edit', text: lan['editItem.text'], handler: this.onEditFn, scope: this }); this.deleteItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_delete', text: lan['deleteItem.text'], handler: this.onDeleteFn, scope: this }); this.clearItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_clear_event', text: lan['clearItem.text'], handler: this.onClearFn, scope: this }); var palette = new Ext.ColorPalette({ }); this.menu = new Ext.menu.Menu({ cls: 'x-calendar-menu', items: [ this.showOnlyItem, this.viewItem, this.editItem, this.deleteItem, this.clearItem, '-', palette ] }); this.menu.palette = palette; this.menu = Ext.menu.MenuMgr.get(this.menu); this.menu.palette.colors = Ext.ux.calendar.Mask.colors; this.menu.palette.on('select', this.onCalendarColorChangedFn, this); this.menu.on('show', this.onMenuShowFn, this); }, /* * Init the contextmenu for event */ initContextMenu: function() { var lan = Ext.ux.calendar.Mask.EventHandler; this.lockItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_event_lock', text: lan['lockItem.text'], handler: this.onLockEventFn, scope: this }); this.unlockItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_event_unlock', text: lan['unlockItem.text'], handler: this.onUnlockEventFn, scope: this }); this.editItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_event_edit', text: lan['editEvent.title'], handler: this.onEditEventFn, scope: this }); this.deleteItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_delete', text: lan['deleteEvent.title'], handler: this.onDeleteEventFn, scope: this }); this.cmenu = new Ext.menu.Menu({ items: [ this.lockItem, this.unlockItem, this.editItem, this.deleteItem ] }); this.cmenu = Ext.menu.MenuMgr.get(this.cmenu); }, onLockEventFn: function(item) { var menu = item.parentMenu; var eEl = menu.eventEl; var cview = eEl.cview; var eh = cview.ehandler; var event = eEl.bindEvent; var oevent = Ext.apply({}, event); event.locked = true; if ('string' == Ext.type(event.repeatType)) { eh.updateEvent(event, cview); } else { /* * need ask user to choose apply all or just current one */ var lan = Ext.ux.calendar.Mask.EventHandler; Ext.Msg.show({ title: lan['updateRepeatPopup.title'], msg: lan['updateRepeatPopup.msg'], buttons: Ext.Msg.YESNOCANCEL, fn: function(bid, text) { if ('yes' == bid) { eh.updateRepeatEvent(event, cview, oevent); } else if ('no' == bid) { event.repeatType = 'exception'; eh.updateRepeatEvent(event, cview, oevent); } else { event.locked = false; } }, icon: Ext.MessageBox.QUESTION }); } }, onUnlockEventFn: function(item) { var menu = item.parentMenu; var eEl = menu.eventEl; var cview = eEl.cview; var eh = cview.ehandler; var event = eEl.bindEvent; var oevent = Ext.apply({}, event); event.locked = false; if ('string' == Ext.type(event.repeatType)) { eh.updateEvent(event, cview); } else { /* * need ask user to choose apply all or just current one */ var lan = Ext.ux.calendar.Mask.EventHandler; Ext.Msg.show({ title: lan['updateRepeatPopup.title'], msg: lan['updateRepeatPopup.msg'], buttons: Ext.Msg.YESNOCANCEL, fn: function(bid, text) { if ('yes' == bid) { eh.updateRepeatEvent(event, cview, oevent); } else if ('no' == bid) { event.repeatType = 'exception'; eh.updateRepeatEvent(event, cview, oevent); } else { event.locked = true; } }, icon: Ext.MessageBox.QUESTION }); } }, onEditEventFn: function(item) { var menu = item.parentMenu; var eEl = menu.eventEl; var cview = eEl.cview; var eh = cview.ehandler; eh.showEditor(eEl, cview, 'update'); }, onDeleteEventFn: function(item) { var lan = Ext.ux.calendar.Mask.EventHandler; var menu = item.parentMenu; var eEl = menu.eventEl; var cview = eEl.cview; var eh = cview.ehandler; var event = eEl.bindEvent; if ('string' == Ext.type(event.repeatType)) { eh.freeEventEl(eEl); eh.deleteEvent(event, cview, eEl.col); } else { Ext.Msg.show({ title: lan['deleteRepeatPopup.title'], msg: lan['deleteRepeatPopup.msg'], buttons: Ext.Msg.YESNOCANCEL, fn: function(bid, text) { if ('yes' == bid) { eh.freeEventEl(eEl); eh.deleteRepeatEvent(event, cview); } else if ('no' == bid) { eh.freeEventEl(eEl); eh.deleteRepeatEvent(event, cview, true); } }, icon: Ext.MessageBox.QUESTION }); } }, /* * For clear all events belong a calendar */ onClearFn: function(item) { Ext.Msg.confirm('Hint', 'Do you really want to delete all events of this calendar?', function(btn) { if (btn == 'yes') { var menu = item.parentMenu; var cEl = menu.calendarEl; var calendar = cEl.calendar; var calendarId = calendar.id; this.ds.deleteEventsByCalendar(calendarId, function(backObj) { delete (this.calendarSet[calendarId]); var cc = this.mainPanel.calendarContainer; var cview = cc.currentView; this.calendarLayout.resetLayout({ hideCalendar: false, deleteCalendar: true }, true); cview.checkLayout(); this.fireEvent('changeEventCache', this); this.calendarSet[calendarId] = calendar; }, this); } }, this ); }, /* * For delete a calendar and all events belong to it */ onDeleteFn: function(item) { Ext.Msg.confirm('Hint', 'Do you really want to delete this calendar?', function(btn) { if (btn == 'yes') { var menu = item.parentMenu; var cEl = menu.calendarEl; var calendar = cEl.calendar; var calendarId = calendar.id; this.ds.deleteCalendar(calendarId, function(backObj) { delete (this.calendarSet[calendarId]); var cc = this.mainPanel.calendarContainer; var cview = cc.currentView; this.calendarLayout.resetLayout({ hideCalendar: false, deleteCalendar: true }, true); cview.checkLayout(); this.fireEvent('changeEventCache', this); cEl.remove(); }, this); } }, this ); }, copyCalendarSet: function() { var o = {}, cs = this.calendarSet; for (var p in cs) { o[p] = Ext.apply({}, cs[p]); } return o; }, /* * For check event cache to see whether any event is actived or expired, * if yes where popup a window to show the actived events */ checkExpireEvents: function() { var now = new Date(); var nowday = now.format('Y-m-d'); var nowTime = now.format('Y-m-d H:i'); var expire = []; var layout = this.calendarLayout.layoutSet[nowday]; if (layout) { var events = layout.getAllEvents(); var getHM = Ext.ux.calendar.Mask.getIntervalFromRow; for (var i = 0, len = events.length; i < len; i++) { var event = events[i]; var startHi = getHM(this.intervalSlot, event.startRow); var endHi = getHM(this.intervalSlot, event.endRow); var startTime = event.day + ' ' + startHi; var endTime = event.eday + ' ' + endHi; var eday = event.eday; if (this.rowCount == event.endRow) { eday = Date.parseDate(event.eday, 'Y-m-d').add(Date.DAY, 1).format('Y-m-d'); endTime = eday + ' ' + endHi; } if (event.alertFlag && startTime <= nowTime && nowTime < endTime) { expire[expire.length] = Ext.applyIf({ color: '#' + Ext.ux.calendar.Mask.getColorByIndex(this.calendarSet[event.calendarId].color), startDate: event.day + ' ' + getHM(this.intervalSlot, event.startRow, this.hourFormat), endDate: eday + ' ' + getHM(this.intervalSlot, event.endRow, this.hourFormat) }, event); } } if (!this.epopup) { this.epopup = new Ext.ux.calendar.ExpirePopup({ ehandler: this }); } if (0 < expire.length) { if (this.epopup) { this.epopup.popup(expire); } // for support extjs 2.2 } else { this.epopup.activedEvents = null; try { this.epopup.hide(); } catch (err) { } // for support extjs 2.2 } } }, /* * For show all calendars belong to current user */ onShowAllFn: function(item) { var cview = this.mainPanel.calendarContainer.getLayout().activeItem; this.ds.showAllCalendar(function(backObj) { var cs = this.calendarSet; for (var p in cs) { var c = cs[p]; c.hide = false; var calendarEl = Ext.get(this.id + '-x-calendar-' + p); this.showCalendarColor(calendarEl, c.color); } this.calendarLayout.resetLayout({ hideCalendar: true, deleteCalendar: false }, true); cview.checkLayout(); }, this); }, /* * For only show a calendar and hide all other calendars */ onShowOnlyFn: function(item) { var cview = this.mainPanel.calendarContainer.getLayout().activeItem; var menu = item.parentMenu; var cEl = menu.calendarEl; var calendar = cEl.calendar; var id = calendar.id; calendar.hide = false; this.ds.showOnlyCalendar(id, function(backObj) { this.showCalendarColor(cEl, calendar.color); var cs = this.calendarSet; for (var p in cs) { if (p != id) { var c = cs[p]; c.hide = true; var calendarEl = Ext.get(this.id + '-x-calendar-' + p); this.hideCalendarColor(calendarEl, c.color); } } this.calendarLayout.resetLayout({ hideCalendar: true, deleteCalendar: false }, true); cview.checkLayout(); }, this); }, /* * For show/hide a calendar and all events belong to it */ onViewFn: function(item) { var menu = item.parentMenu; var cEl = menu.calendarEl; var calendar = cEl.calendar; var lan = Ext.ux.calendar.Mask.EventHandler; calendar.hide = !calendar.hide; this.ds.createUpdateCalendar(calendar, function(backObj) { if (lan['viewItem.hide.text'] == item.text) { item.setText(lan['viewItem.show.text']); this.hideCalendar(calendar, true); this.hideCalendarColor(cEl, calendar.color); } else { item.setText(lan['viewItem.hide.text']); this.hideCalendar(calendar, false); this.showCalendarColor(cEl, calendar.color); } }, this); }, /* * For show/hide a calendar and all events belong to it * @param {Boolean} flag, true for hide, false for show */ hideCalendar: function(calendar, flag) { var id = calendar.id; var cview = this.mainPanel.calendarContainer.currentView; calendar.hide = flag; this.calendarSet[id].hide = flag; this.calendarLayout.resetLayout({ hideCalendar: true, deleteCalendar: false }, true); cview.checkLayout(); }, /* * show the editor to edit an event */ onEditFn: function(item) { var menu = item.parentMenu; var cEl = menu.calendarEl; var calendar = cEl.calendar; this.ceditor.popup({ data: calendar, cEl: cEl }); }, prepareLegend: function(pn, spos, epos, cview) { var eh = cview.ehandler; var sindex = spos.x * cview.shiftDay + spos.y; var eindex = epos.x * cview.shiftDay + epos.y; var tmp = sindex; if (sindex > eindex) { sindex = eindex; eindex = tmp; } var calendar; for (var p in eh.calendarSet) { calendar = eh.calendarSet[p]; if (true !== calendar.hide) { break; } } var event = { eventId: 'prepare', calendarId: calendar.id, color: calendar.color, startRow: 0, endRow: this.rowCount, day: cview.daySet[sindex].format('Y-m-d'), eday: cview.daySet[eindex].format('Y-m-d'), repeatType: 'no' }; pn.hold = true; pn.cview = cview; pn.bindEvent = event; this.showEditor(pn, cview, 'add'); }, prepareEvent: function(pn, cview) { var id = pn.dom.id; var pos = cview.getCellIndex(id); var eh = cview.ehandler; var x = pos.x, y = pos.y; var calendar; for (var p in eh.calendarSet) { calendar = eh.calendarSet[p]; if (true !== calendar.hide) { break; } } var event = { eventId: 'prepare', calendarId: calendar.id, color: calendar.color, startRow: x, endRow: x + this.numInHour, day: cview.daySet[y].format('Y-m-d'), eday: cview.daySet[y].format('Y-m-d'), span: 1, colIndex: 0, repeatType: 'no' }; return this.renderEvent(cview, [event], y, true); }, generateInfo: function(event) { var startRow = event.startRow; var endRow = event.endRow; var hm; if (0 == startRow && this.rowCount == endRow) { hm = event.day; if (event.day != event.eday) { hm += ' to ' + event.eday; } hm += ' ' + Ext.ux.calendar.Mask.EventHandler['wholeDay']; return hm; } else { // TRAKKWARE CHANGE: Use real time, not slot time. var starttime = event.starttime; var s = starttime.split(':'); var sam = 'am'; if(s.length == 2) { if(s[0] > 12) { s[0] = s[0]-12; sam = 'pm'; } starttime = s[0] + ':' + s[1]; } starttime += sam; var endtime = event.endtime; var e = endtime.split(':'); var eam = 'am'; if(e.length == 2) { if(e[0] > 12) { e[0] = e[0]-12; eam = 'pm'; } endtime = e[0] + ':' + e[1]; } endtime += eam; hm = event.day + ' ' + starttime + ' to ';//+ Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, startRow, this.hourFormat) + ' to '; if (event.day != event.eday) { hm += event.eday + ' '; } hm += endtime; //Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, endRow, this.hourFormat); return hm; } }, generateTitle: function(event) { var startRow = event.startRow; var endRow = event.endRow; if (0 == startRow && this.rowCount == endRow) { return Ext.ux.calendar.Mask.EventHandler['wholeDay']; } else { var hm = Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, startRow, this.hourFormat) + '-' + Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, endRow, this.hourFormat); return hm; } }, getContentEl: function(coverEl) { return coverEl.child('.x-event-content-default'); }, getTitleEl: function(coverEl) { return coverEl.child('.x-event-title-default'); }, getBottomEl: function(coverEl) { return coverEl.child('.x-event-bottom-default'); }, getLeftTopEl: function(coverEl) { return coverEl.child('.x-event-lt-default'); }, getRightTopEl: function(coverEl) { return coverEl.child('.x-event-rt-default'); }, /* * this function is for render Event * @param {Class} cview: an instance of DayView or MonthView; the container where these events to render * @param {Array} rs: an array of events to render * @param {int} col: the index of column in cview to render the events, * for DayView, it's always 0, for WeekView, it's from 0 to 6, for MonthView, it's from 0 to 27 */ renderEvent: function(cview, rs, col, full) { var bl = cview.cbody.getLeft(), bt = cview.cbody.getTop(); var coverEl; for (var i = 0, len = rs.length; i < len; i++) { var e = rs[i]; var arr = Ext.DomQuery.select('div[eid=' + e.eventId + ']', cview.body.dom); for (var j = 0, size = arr.length; j < size; j++) { var eEl = Ext.get(arr[j]); if (eEl.col == col || eEl.nol == col) { if (this.editingId == eEl.dom.id) { delete (this.editingId); this.editDisabled = false; } this.freeEventEl(eEl); } } } for (var i = 0, len = rs.length; i < len; i++) { var e = rs[i]; var pn = Ext.get(cview.id + '-x-dayview-viewer-' + e.startRow + '-' + col); var cl = pn.getLeft(); var tw = pn.getWidth(); var offset = Math.round(tw * cview.offsetPercent); var cw = tw - offset; if (full) { cw = tw; } var ct = pn.getTop(); var ch = (pn.getHeight() + 1) * (e.endRow - e.startRow) - 24; var r = cw / Math.pow(e.span, this.posRatio) * e.colIndex; var rest = cw - r; var x = Math.round(cl - bl + offset + r); if (full) { x = Math.round(cl - bl + r); } var y = Math.round(ct - bt); if (true == e.last && 0 != e.colIndex) { r = 1; } else { r = Math.pow(this.widthRatio, e.span - 1 - e.colIndex); } var w = Math.floor(rest * r); var leftStyle = 5, rightStyle = 5; var mw = w - leftStyle - rightStyle; var zindex = this.baseIndex + e.colIndex; var coverStyle = 'top:' + y + 'px;left:' + x + 'px;width:' + w + 'px;z-index:' + zindex + ';'; var contentStyle = 'height:' + ch + 'px;'; if (Ext.isIE) { contentStyle += 'width:' + w + 'px;'; } var titleStyle = 'width:' + mw + 'px;'; var bottomStyle = 'width:' + mw + 'px;'; var subject = e.subject || ''; if ('' === subject.trim()) { subject = Ext.ux.calendar.Mask.EventHandler['untitled']; } var color = e.color; if (this.calendarSet) { color = this.calendarSet[e.calendarId].color; } var html = this.eventTpl.apply({ 'id': e.eventId, 'calendarId': e.calendarId, 'color': color, 'cover-style': coverStyle, 'content-style': contentStyle, 'title-style': titleStyle, 'bottom-style': bottomStyle, 'left-style': 'width:' + leftStyle + 'px;', 'right-style': 'width:' + rightStyle + 'px;', 'title': this.generateTitle(e), 'time': this.generateInfo(e), 'subject': subject, 'content': e.content || '', 'day': e.day, 'eday': e.eday, 'repeatType': e.repeatType, 'alertFlag': e.alertFlag, 'locked': e.locked }); var coverel = Ext.DomHelper.insertHtml('beforeEnd', pn.dom, html); coverEl = Ext.get(coverel); if (coverEl) { var contentEl = this.getContentEl(coverEl); var titleEl = this.getTitleEl(coverEl); var bottomEl = this.getBottomEl(coverEl); var ltEl = this.getLeftTopEl(coverEl); var rtEl = this.getRightTopEl(coverEl); e.eId = coverEl.id; coverEl.bindEvent = Ext.apply({}, e); coverEl.cview = cview; coverEl.col = col; coverEl.cEl = pn; coverEl.titleEl = titleEl; coverEl.contentEl = contentEl; coverEl.bottomEl = bottomEl; coverEl.ltEl = ltEl; coverEl.rtEl = rtEl; coverEl.leftStyle = leftStyle; coverEl.rightStyle = rightStyle; contentEl.coverEl = coverEl; contentEl.bindEvent = Ext.apply({}, e); contentEl.cview = cview; contentEl.cEl = pn; contentEl.col = col; } } cview.resizePort(); this.floating = false; return coverEl; }, getIndexFromDay: function(cview, day) { return cview.getIndexFromDay(day); }, /* * For create an event and add it in LayoutGrid * @param {Object} event: the event config to create * @param {Class} cview: an instance of DayView or MonthView; the container where these events to render * @param {int} col: the index of column in cview to render the events, * for DayView, it's always 0, for WeekView, it's from 0 to 6, for MonthView, it's from 0 to 27 */ createEvent: function(event, cview, col) { this.ds.createEvent(event, function(backObj) { event.eventId = backObj.id; this.createEventToLayout(event, cview, col); this.fireEvent('changeEventCache', this); }, this); }, createEventToLayout: function(event, cview, col) { if (false === Ext.type(col)) { col = this.getIndexFromDay(cview, event.day); } var glayout = this.calendarLayout; var all = (0 == event.startRow && this.rowCount == event.endRow) || (event.day != event.eday); if (all) { glayout.updateWholeList([event], 'add'); cview.checkLayout(Ext.isIE); } else { var layout = glayout.getLayout(event.day, cview); if (layout) { var rs = layout.updateLayout(event, 'add'); if (cview instanceof Ext.ux.calendar.DayView) { this.renderEvent(cview, rs.elist, col); } else { cview.checkLayout(); } } } }, createRepeatEvent: function(event, cview, col) { this.ds.createUpdateRepeatEvent(event, null, function(backObj) { event.eventId = backObj.id; var gLayout = this.calendarLayout; gLayout.updateRepeatEventList(cview, [event], 'add'); this.fireEvent('changeEventCache', this); }, this); }, /* * For update an event and update it in LayoutGrid * @param {Object} event: the event config to create * @param {Class} cview: an instance of DayView or MonthView; the container where these events to render * @param {int} col: the index of column in cview to render the events, * for DayView, it's always 0, for WeekView, it's from 0 to 6, for MonthView, it's from 0 to 27 * @param {Object} oevent: the old event config * @param {boolean or function} noLayout: if not null means no need update LayoutGrid, also can be a callback function */ updateEvent: function(event, cview, ocol, oevent, noLayout) { this.ds.updateEvent(event, function(backObj) { if ('function' === Ext.type(noLayout)) { noLayout(event); } var all = ((0 == event.startRow && this.rowCount == event.endRow) || (event.day != event.eday)), oall = false; var col; var glayout = this.calendarLayout; if (oevent) { if (false === Ext.type(ocol)) { ocol = this.getIndexFromDay(cview, oevent.day); } oall = ((0 == oevent.startRow && this.rowCount == oevent.endRow) || (oevent.day != oevent.eday)); var olayout = this.calendarLayout.getLayout(oevent.day, cview); if (oevent.day != event.day) { col = this.getIndexFromDay(cview, event.day); var rs = olayout.updateLayout(oevent, 'delete'); if (rs.elist && cview instanceof Ext.ux.calendar.DayView) { var arr = Ext.DomQuery.select('div[name=x-event-' + oevent.day + '-' + oevent.eday + '-' + oevent.eventId + ']', cview.body.dom); for (var i = 0, len = arr.length; i < len; i++) { this.freeEventEl(Ext.get(arr[i])); } this.renderEvent(cview, rs.elist, ocol); } } else { col = ocol; if (oall != all) { var rs = olayout.updateLayout(oevent, 'delete'); if (rs.elist && cview instanceof Ext.ux.calendar.DayView) { var arr = Ext.DomQuery.select('div[name=x-event-' + oevent.day + '-' + oevent.eday + '-' + oevent.eventId + ']', cview.body.dom); for (var i = 0, len = arr.length; i < len; i++) { this.freeEventEl(Ext.get(arr[i])); } this.renderEvent(cview, rs.elist, ocol); } } } } else { if (false == Ext.type(ocol)) { col = this.getIndexFromDay(cview, event.day); } else { col = ocol; } } if (all) { glayout.updateWholeList([event], 'update'); } else { var layout = glayout.getLayout(event.day, cview); if (layout) { var rs = layout.updateLayout(event, 'update'); if (false != Ext.type(col) && rs.elist && cview instanceof Ext.ux.calendar.DayView) { this.renderEvent(cview, rs.elist, col); } } } if ((oall || all) && cview instanceof Ext.ux.calendar.DayView) { cview.checkLayout(Ext.isIE); } if (cview instanceof Ext.ux.calendar.MonthView) { cview.checkLayout(true); } this.fireEvent('changeEventCache', this); }, this); }, /* * For delete an event and delete it in LayoutGrid * @param {Object} event: the event config to create * @param {Class} cview: an instance of DayView or MonthView; the container where these events to render * @param {int} col: the index of column in cview to render the events, * for DayView, it's always 0, for WeekView, it's from 0 to 6, for MonthView, it's from 0 to 27 * @param {boolean} keep: whether keep the edit status for the editing event */ deleteEvent: function(event, cview, col, keep) { this.ds.deleteEvent(event, function(backObj) { this.deleteEventFromLayout(event, cview, col); if (Ext.isIE && (event.day != event.eday || (0 == event.startRow) && (this.rowCount == event.endRow))) { cview.checkLayout(true); } this.fireEvent('changeEventCache', this); }, this); }, deleteEventFromLayout: function(event, cview, col) { var glayout = this.calendarLayout; var all = (0 == event.startRow && this.rowCount == event.endRow) || (event.day != event.eday); if (all) { glayout.updateWholeList([event], 'delete'); cview.checkLayout(); } else { var layout = glayout.getLayout(event.day, cview); if (layout) { var rs = layout.updateLayout(event, 'delete'); if (false != Ext.type(col) && cview instanceof Ext.ux.calendar.DayView) { this.renderEvent(cview, rs.elist, col); } } } }, deleteRepeatEvent: function(event, cview, makeException) { if (makeException) { var eps = event.repeatType.exceptions || {}; eps[event.day] = true; event.repeatType.exceptions = eps; } this.ds.deleteRepeatEvent(event, makeException, function(backObj) { var gLayout = this.calendarLayout; if (makeException) { gLayout.updateRepeatEventList(cview, [event], 'update'); } else { gLayout.updateRepeatEventList(cview, [event], 'delete'); } this.fireEvent('changeEventCache', this); }, this); }, /* * For create an event and add it in LayoutGrid * @param {Element} eEl: the event element where the editor align to * @param {Class} cview: the view container * @param {boolean or function} noLayout: if not null means no need update the LayoutGrid, also can be a callback function */ showEditor: function(eEl, cview, action, noLayout) { this.editor.popup({ bindEl: eEl, cview: cview, action: action, noLayout: noLayout }); }, /* * for set the pin-on class for event element */ setPinOn: function(coverEl) { var pinEl = coverEl.child('img'); pinEl.removeClass('x-calendar-event-pin-off'); pinEl.addClass('x-calendar-event-pin-on'); }, /* * for set the pin-off class for event element */ setPinOff: function(coverEl) { var pinEl = coverEl.child('img'); pinEl.removeClass('x-calendar-event-pin-on'); pinEl.addClass('x-calendar-event-pin-off'); }, onPinElClickFn: function(e) { e.stopEvent(); var target = e.getTarget(); var tgEl = Ext.get(target); if (tgEl.hasClass('x-calendar-event-pin-off')) { tgEl.removeClass('x-calendar-event-pin-off'); tgEl.addClass('x-calendar-event-pin-on'); this.editDisabled = true; } else { tgEl.removeClass('x-calendar-event-pin-on'); tgEl.addClass('x-calendar-event-pin-off'); this.editDisabled = false; } }, /* * set the editing status for an event */ setEditingStatus: function(coverEl, forceFlag, pinFlag) { var coverFlag = null; if (coverEl.hasClass('x-event-cover')) { coverFlag = 'event'; } var editCover = Ext.get(this.editingId); var bindEvent = coverEl.bindEvent; var titleEl = coverEl.titleEl; var contentEl = coverEl.contentEl; var bottomEl = coverEl.bottomEl; var flag = false; if (true != this.floating) { if (true !== this.editDisabled) { flag = true; } else if (true === forceFlag) { flag = true; if (this.editingId != coverEl.dom.id) { this.editDisabled = false; } if (editCover) { this.setPinOff(editCover); } } } if (flag) { if (editCover) { this.removeEditingStatus(editCover); } this.editingId = coverEl.dom.id; coverEl.setStyle('z-index', 3009); if (coverFlag) { coverEl.addClass('x-event-editing'); } var color = this.calendarSet[bindEvent.calendarId].color; if (coverEl.hasClass('x-event-cover')) { if (titleEl) { titleEl.addClass('x-calendar-' + color + '-event-top'); titleEl.removeClass('x-calendar-' + color + '-event-top-clear'); } var ltEl = coverEl.ltEl; if (ltEl) { ltEl.addClass('x-calendar-' + color + '-event-ltcorner'); ltEl.removeClass('x-calendar-' + color + '-event-ltcorner-clear'); } var rtEl = coverEl.rtEl; if (rtEl) { rtEl.addClass('x-calendar-' + color + '-event-rtcorner'); rtEl.removeClass('x-calendar-' + color + '-event-rtcorner-clear'); } } } var cw = coverEl.getWidth(); var w = cw; if (coverEl.leftStyle && coverEl.rightStyle) { w = cw - coverEl.leftStyle - coverEl.rightStyle; } if (titleEl && coverFlag) { titleEl.setWidth(w); } if (Ext.isIE && contentEl && coverFlag) { contentEl.setWidth(cw); } if (bottomEl) { bottomEl.setWidth(w); } if (false !== Ext.type(pinFlag)) { this.editDisabled = pinFlag; } if (this.editDisabled) { this.setPinOn(coverEl); } }, removeEditingStatus: function(coverEl) { var bindEvent = coverEl.bindEvent; var index = this.baseIndex; if (bindEvent.colIndex) { index += bindEvent.colIndex; } coverEl.setStyle('z-index', index.toString()); coverEl.removeClass('x-event-editing'); var color = this.calendarSet[bindEvent.calendarId].color; var titleEl = coverEl.titleEl; if (titleEl) { titleEl.removeClass('x-calendar-' + color + '-event-top'); if (coverEl.cview instanceof Ext.ux.calendar.DayView && !(0 == bindEvent.startRow && this.rowCount == bindEvent.endRow)) { titleEl.addClass('x-calendar-' + color + '-event-top-clear'); } } var ltEl = coverEl.ltEl; if (ltEl) { ltEl.removeClass('x-calendar-' + color + '-event-ltcorner'); ltEl.addClass('x-calendar-' + color + '-event-ltcorner-clear'); } var rtEl = coverEl.rtEl; if (rtEl) { rtEl.removeClass('x-calendar-' + color + '-event-rtcorner'); rtEl.addClass('x-calendar-' + color + '-event-rtcorner-clear'); } }, generateLegend: function(cview, e) { var subject = e.subject || ''; if ('' === subject.trim()) { subject = Ext.ux.calendar.Mask.EventHandler['untitled']; } var html; var color = e.color; if (this.calendarSet) { color = this.calendarSet[e.calendarId].color; } if ((0 == e.startRow && this.rowCount == e.endRow) || (e.day != e.eday)) { html = this.wholeTpl.apply({ 'id': e.eventId, 'lflag': e.lflag || false, 'rflag': e.rflag || false, 'calendarId': e.calendarId, 'color': color, 'title': this.generateTitle(e), 'time': this.generateInfo(e), 'subject': subject, 'content': e.content || '', 'day': e.day, 'eday': e.eday, 'repeatType': e.repeatType, 'alertFlag': e.alertFlag, 'locked': e.locked }); } else { html = this.legendTpl.apply({ 'id': e.eventId, 'calendarId': e.calendarId, 'color': color, 'title': this.generateTitle(e), 'time': this.generateInfo(e), 'subject': subject, 'content': e.content || '', 'day': e.day, 'eday': e.eday, 'repeatType': e.repeatType, 'alertFlag': e.alertFlag, 'locked': e.locked }); } return html; }, /* * for delete an event from monthView or the pool of DayView * @param {Class} cview: an instance of DayView or MonthView; the container where these events to render * @param {Array} rs: an array of events to render * @param {Element} pn: the parent node where this event Element belong to */ deleteLegend: function(event, cview, pn) { var pos = cview.getCellIndex(pn.dom.id); var index = pos.x * cview.dayNum + pos.y; var layout = this.calendarLayout.getLayout(cview.daySet[index], cview); var rs = layout.updateLayout(event, 'delete'); }, /* * for create a calendar * @param {Element} pn: the parent node where this event Element belong to * @param {Class} cview: an instance of DayView or MonthView; the container where these events to render * @param {string} pos: the postition to insert * @param {Class} calendar: the calendar ready to create */ createCalendar: function(pnode, cview, pos, calendar) { var legendStyle = 'height:9px;'; var html = this.calendarDropTpl.apply({ 'legend-style': legendStyle, 'title': calendar.name, 'calendarId': calendar.id, 'color': calendar.color }); var nel, calendarEl; if ('beforeBegin' == pos) { nel = Ext.DomHelper.insertHtml('beforeBegin', pnode.dom.firstChild, html); } else { nel = Ext.DomHelper.insertHtml('beforeEnd', pnode.dom, html); } calendarEl = Ext.get(nel); if (calendarEl) { calendarEl.addClassOnOver('x-calendar-over'); calendarEl.calendar = calendar; this.initCalendar(calendarEl); } return calendarEl; }, initCalendar: function(calendarEl) { calendarEl.on('click', this.onCalendarElClickFn, { cEl: calendarEl, sp: this }); calendarEl.on('dblclick', this.onCalendarElDblClickFn, { cEl: calendarEl, sp: this }); }, onCalendarElDblClickFn: function(e) { // TRAKKWARE return; // END TRAKKWARE var sp = this.sp; var cEl = this.cEl; var calendar = cEl.calendar; sp.ceditor.popup({ data: calendar, cEl: cEl }); }, onCalendarElClickFn: function(e) { var sp = this.sp; var cEl = this.cEl; var calendar = cEl.calendar; var tgEl = Ext.get(e.getTarget()); // TRAKKWARE: added false. I want to show/hide on click, regardless of the situation. if (false && tgEl.hasClass('x-legend-tool')) { sp.menu.palette.calendar = calendar; sp.showMenu(cEl, tgEl); } else { calendar.hide = !calendar.hide; // TRAKKWARE numerous changes here. The method that was being called is a stub. if (calendar.hide === true) { sp.hideCalendar(calendar, true); sp.hideCalendarColor(cEl, calendar.color); } else { sp.hideCalendar(calendar, false); sp.showCalendarColor(cEl, calendar.color); } } }, /* * for change the color of a calendar */ onCalendarColorChangedFn: function(cp, color) { if (true !== cp.still) { color = Ext.ux.calendar.Mask.getIndexByColor(color); if (color) { this.changeColor(cp.calendar, color); } this.menu.hide(); } }, /* * for change the color of an event Element */ changeEventColor: function(eEl, oldColor, color) { var ltEl = eEl.child('.x-calendar-' + oldColor + '-event-ltcorner-clear'); if (ltEl) { ltEl.removeClass('x-calendar-' + oldColor + '-event-ltcorner-clear'); ltEl.addClass('x-calendar-' + color + '-event-ltcorner-clear'); } ltEl = eEl.child('.x-calendar-' + oldColor + '-event-ltcorner'); if (ltEl) { ltEl.removeClass('x-calendar-' + oldColor + '-event-ltcorner'); ltEl.addClass('x-calendar-' + color + '-event-ltcorner'); } var rtEl = eEl.child('.x-calendar-' + oldColor + '-event-rtcorner-clear'); if (rtEl) { rtEl.removeClass('x-calendar-' + oldColor + '-event-rtcorner-clear'); rtEl.addClass('x-calendar-' + color + '-event-rtcorner-clear'); } rtEl = eEl.child('.x-calendar-' + oldColor + '-event-rtcorner'); if (rtEl) { rtEl.removeClass('x-calendar-' + oldColor + '-event-rtcorner'); rtEl.addClass('x-calendar-' + color + '-event-rtcorner'); } var tEl = eEl.child('.x-calendar-' + oldColor + '-event-top-clear'); if (tEl) { tEl.removeClass('x-calendar-' + oldColor + '-event-top-clear'); tEl.addClass('x-calendar-' + color + '-event-top-clear'); } tEl = eEl.child('.x-calendar-' + oldColor + '-event-top'); if (tEl) { tEl.removeClass('x-calendar-' + oldColor + '-event-top'); tEl.addClass('x-calendar-' + color + '-event-top'); } var lrEl = eEl.child('.x-calendar-' + oldColor + '-event-lr'); if (lrEl) { lrEl.removeClass('x-calendar-' + oldColor + '-event-lr'); lrEl.addClass('x-calendar-' + color + '-event-lr'); } var lbEl = eEl.child('.x-calendar-' + oldColor + '-event-lbcorner'); if (lbEl) { lbEl.removeClass('x-calendar-' + oldColor + '-event-lbcorner'); lbEl.addClass('x-calendar-' + color + '-event-lbcorner'); } var rbEl = eEl.child('.x-calendar-' + oldColor + '-event-rbcorner'); if (rbEl) { rbEl.removeClass('x-calendar-' + oldColor + '-event-rbcorner'); rbEl.addClass('x-calendar-' + color + '-event-rbcorner'); } var bEl = eEl.child('.x-calendar-' + oldColor + '-event-bottom'); if (bEl) { bEl.removeClass('x-calendar-' + oldColor + '-event-bottom'); bEl.addClass('x-calendar-' + color + '-event-bottom'); } }, changeWholeColor: function(wEl, oldColor, color) { var titleEl = wEl.child('.x-whole-title-' + oldColor); if (titleEl) { titleEl.removeClass('x-whole-title-' + oldColor); titleEl.addClass('x-whole-title-' + color); } var leftEl = wEl.child('.x-calendar-' + oldColor + '-whole-left'); if (leftEl) { leftEl.removeClass('x-calendar-' + oldColor + '-whole-left'); leftEl.addClass('x-calendar-' + color + '-whole-left'); } var rightEl = wEl.child('.x-calendar-' + oldColor + '-whole-right'); if (rightEl) { rightEl.removeClass('x-calendar-' + oldColor + '-whole-right'); rightEl.addClass('x-calendar-' + color + '-whole-right'); } }, changeCalendarColor: function(cEl, oldColor, color) { var hide; var titleEl = cEl.child('.x-whole-title-' + oldColor); if (titleEl) { hide = false; titleEl.removeClass('x-whole-title-' + oldColor); titleEl.addClass('x-whole-title-' + color); } else { hide = true; var bEl = cEl.child('.x-calendar-title-b'); if (bEl) { bEl.setStyle('color', '#' + Ext.ux.calendar.Mask.getColorByIndex(color)); } } if (false == hide) { var leftEl = cEl.child('.x-calendar-' + oldColor + '-whole-left'); if (leftEl) { leftEl.removeClass('x-calendar-' + oldColor + '-whole-left'); leftEl.addClass('x-calendar-' + color + '-whole-left'); } var rightEl = cEl.child('.x-calendar-' + oldColor + '-whole-right'); if (rightEl) { rightEl.removeClass('x-calendar-' + oldColor + '-whole-right'); rightEl.addClass('x-calendar-' + color + '-whole-right'); } } }, hideCalendarColor: function(cEl, oldColor) { var leftEl = cEl.child('.x-calendar-' + oldColor + '-whole-left'); if (leftEl) { leftEl.removeClass('x-calendar-' + oldColor + '-whole-left'); } var rightEl = cEl.child('.x-calendar-' + oldColor + '-whole-right'); if (rightEl) { rightEl.removeClass('x-calendar-' + oldColor + '-whole-right'); } var titleEl = cEl.child('.x-whole-title-' + oldColor); if (titleEl) { titleEl.removeClass('x-whole-title-' + oldColor); } var bEl = cEl.child('.x-calendar-title-b'); if (bEl) { var color = Ext.ux.calendar.Mask.getColorByIndex(oldColor); bEl.setStyle('color', '#' + color); } }, showCalendarColor: function(cEl, oldColor) { var leftEl = cEl.child('.x-whole-left'); if (leftEl) { leftEl.addClass('x-calendar-' + oldColor + '-whole-left'); } var rightEl = cEl.child('.x-whole-right'); if (rightEl) { rightEl.addClass('x-calendar-' + oldColor + '-whole-right'); } var titleEl = cEl.child('.x-calendar-title'); if (titleEl) { titleEl.addClass('x-whole-title-' + oldColor); } var bEl = cEl.child('.x-calendar-title-b'); if (bEl) { bEl.setStyle('color', 'white'); } }, changeLegendColor: function(lEl, oldColor, color) { var bEl = lEl.child('.x-legend-title-' + oldColor); if (bEl) { bEl.removeClass('x-legend-title-' + oldColor); bEl.addClass('x-legend-title-' + color); } }, /* * for change color of a calendar and all events belong to it * @param {Obj} calendar: the obj of calendar * @param {int} index: the index of the color */ changeColor: function(calendar, index) { var oldColor = calendar.color; calendar.color = index; this.ds.createUpdateCalendar(calendar, function(backObj) { if ("true" == backObj.success) { this.calendarSet[calendar.id].color = index; var calendarEl = Ext.get(this.id + '-x-calendar-' + calendar.id); if (calendarEl) { this.changeCalendarColor(calendarEl, oldColor, calendar.color); } var mainBody = this.mainPanel.body; var events = Ext.DomQuery.select('.' + this.id + '-x-calendar-' + calendar.id + '-event', mainBody.dom); if (events) { for (var i = 0, len = events.length; i < len; i++) { var eEl = Ext.get(events[i]); this.changeEventColor(eEl, oldColor, calendar.color); } } var wholes = Ext.DomQuery.select('.' + this.id + '-x-calendar-' + calendar.id + '-whole', mainBody.dom); if (wholes) { for (var i = 0, len = wholes.length; i < len; i++) { var wEl = Ext.get(wholes[i]); this.changeWholeColor(wEl, oldColor, calendar.color); } } var legends = Ext.DomQuery.select('.' + this.id + '-x-calendar-' + calendar.id + '-legend', mainBody.dom); if (legends) { for (var i = 0, len = legends.length; i < len; i++) { var lEl = Ext.get(legends[i]); this.changeLegendColor(lEl, oldColor, calendar.color); } } var cview = this.mainPanel.calendarContainer.getLayout().activeItem; if (cview instanceof Ext.ux.calendar.ResultView) { cview.list.getView().refresh(); } this.fireEvent('changeCalendarColor', this, calendar, oldColor, calendar.color); } }, this); }, /* * For destory an Event and its Element */ freeEventEl: function(El) { El.remove(); }, pushDayCache: function(startDate, endDate) { var day = startDate.format('Y-m-d'); var date = startDate; var endDay = endDate.format('Y-m-d'); while (day <= endDay) { this.dayCache[day] = date; date = date.add(Date.DAY, 1); day = date.format('Y-m-d'); } }, isInDayCache: function(startDate, endDate) { var flag = true; var day = startDate.format('Y-m-d'); var date = startDate; var endDay = endDate.format('Y-m-d'); while (day <= endDay) { if (!this.dayCache[day]) { flag = false; break; } date = date.add(Date.DAY, 1); day = date.format('Y-m-d'); } return flag; }, bindEvent2Detail: function(cview, events, detailCt) { var html = ''; for (var i = 0, len = events.length; i < len; i++) { var e = events[i]; html += this.generateLegend(this, e); } detailCt.dom.innerHTML = html; for (var i = 0, len = detailCt.dom.childNodes.length; i < len; i++) { var e = Ext.apply({}, events[i]); var el = detailCt.dom.childNodes[i]; var El = Ext.get(el); El.bindEvent = e; El.cview = cview; } }, updateRepeatEvent: function(event, cview, oevent) { if ('string' == Ext.type(event.repeatType)) { var eps = oevent.repeatType.exceptions || {}; eps[oevent.day] = true; oevent.repeatType.exceptions = eps; } this.ds.createUpdateRepeatEvent(event, oevent, function(backObj) { var gLayout = this.calendarLayout; if (backObj.id) { event.eventId = backObj.id; } if ('string' == Ext.type(oevent.repeatType)) { this.deleteEventFromLayout(oevent, cview); gLayout.updateRepeatEventList(cview, [event], 'update'); } else if ('string' == Ext.type(event.repeatType)) { this.createEventToLayout(event, cview); if ('exception' == event.repeatType) { gLayout.updateRepeatEventList(cview, [oevent], 'update'); } else { gLayout.updateRepeatEventList(cview, [oevent], 'delete'); } } else { gLayout.updateRepeatEventList(cview, [event], 'update'); } this.fireEvent('changeEventCache', this); }, this); }, loadRepeatEvent: function(fn, scope) { this.ds.loadRepeatEvent(function(eventSet) { this.calendarLayout.repeatSet = eventSet; fn.call(scope); }, this); }, getStartDateInWeek: function(date, cview) { var sDate; if (1 == this.startDay) { var n = date.format('N'); sDate = date.add(Date.DAY, 1 - n); } else { var w = -date.format('w'); if ((5 == cview.dayNum && cview instanceof Ext.ux.calendar.DayView) || (5 == cview.colNum && cview instanceof Ext.ux.calendar.MonthView)) { w++; } sDate = date.add(Date.DAY, w); } return sDate; }, loadCalendar: function(ownedCt, sharedCt) { this.ds.loadCalendar(function(backObj) { var owned = backObj.owned; var shared = backObj.shared; this.calendarSet = {}; if (0 < owned.length || 0 < shared.length) { var calendar; for (var i = 0, len = owned.length; i < len; i++) { calendar = owned[i]; this.calendarSet[calendar.id] = calendar; } for (var i = 0, len = shared.length; i < len; i++) { calendar = shared[i]; this.calendarSet[calendar.id] = calendar; } this.loadRepeatEvent(function() { this.fireEvent('calendarloaded'); }, this); if (ownedCt) { this.renderOwnedCalendar(ownedCt); } if (sharedCt) { this.renderSharedCalendar(sharedCt); } } }, this); }, renderOwnedCalendar: function(container) { var cs = this.calendarSet; container.dom.innerHTML = ''; for (var q in cs) { var calendar = cs[q]; if (!calendar.isShared) { var cEl = this.createCalendar(container, null, null, calendar); if (calendar.hide) { this.hideCalendarColor(cEl, calendar.color); } } } }, renderSharedCalendar: function(container) { var cs = this.calendarSet; container.dom.innerHTML = ''; for (var q in cs) { var calendar = cs[q]; if (calendar.isShared) { var cEl = this.createCalendar(container, null, null, calendar); if (calendar.hide) { this.hideCalendarColor(cEl, calendar.color); } } } }, reloadCalendar: function(ownedCt, sharedCt, cflag) { this.dayCache = {}; this.calendarLayout.layoutSet = {}; this.calendarLayout.wholeList = []; if (cflag) { this.loadCalendar(ownedCt, sharedCt); } else { this.loadRepeatEvent(function() { this.fireEvent('calendarloaded'); }, this); } } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.DayView = Ext.extend(Ext.ux.calendar.BasicView, { createByDblclick: false, hideInactiveRow: false, activeStartRow: 0, activeEndRow: 48, startRow: 0, endRow: 48, cls: 'x-dayview-ct', lineNum: 3, border: false, weekNum: 1, dayNum: 1, dayFormat: 'm/d(D)', thin: 4, leftWidth: 70, scrollOffset: 17, offsetPercent: 0.1, headerHeight: 30, rowHeight: 26, poolMaxDepth: 4, poolDepth: 0, generateCSS: function() { var cssText = '.' + this.id + '-x-dayview-viewer-row-height{}' + '.' + this.id + '-x-dayview-pool{overflow:hidden;}' + '.' + this.id + '-x-dayview-pool-height{}' + '.' + this.id + '-x-dayview-pool-width{}' + '.' + this.id + '-x-dayview-pool-viewer-width{}' + '.' + this.id + '-x-dayview-lefter-width{width:' + this.leftWidth + 'px;}'; var cid = Ext.id(); this.ss = Ext.util.CSS.createStyleSheet(cssText, cid); }, updateTimeline: function() { var now = new Date(); var day = now.format('Y-m-d'); for (var j = 0, len = this.daySet.length; j < len; j++) { if (day == this.daySet[j].format('Y-m-d')) { break; } } if (this.timelinePn && this.timeindexPn) { this.timeindexPn.removeClass('x-dayview-timeindex'); this.timelinePn.removeClass('x-dayview-timeline'); } if (j != len) { var col = j % this.dayNum; var h = parseInt(now.format('G')); var s = now.format('i'); if ('0' == s[0]) { s = s.slice(1); } var i = parseInt(s); var intervalSlot = this.intervalSlot; var numInHour = this.numInHour; var startRow = h * numInHour + Math.floor(i / intervalSlot); var r = i % intervalSlot; var pn = Ext.get(this.id + '-x-dayview-viewer-' + startRow + '-' + col); var lefter = Ext.get(this.id + '-x-dayview-lefter-' + startRow + '-0'); if (pn && lefter) { var p = Math.floor(r / intervalSlot * 100); pn.addClass('x-dayview-timeline'); pn.setStyle('background-position', '0% ' + p + '%'); lefter.addClass('x-dayview-timeindex'); lefter.setStyle('background-position', '0% ' + p + '%'); this.timelinePn = pn; this.timeindexPn = lefter; } } }, generateHTML: function(data) { this.generateCSS(); var lefter = ''; var hnum = this.numInHour; for (var i = this.startRow; i < this.endRow; i++) { lefter += ''; for (var j = 0; j < 1; j++) { var hour = Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, i, this.hourFormat); var rest = i % hnum; if (0 != rest && i != this.activeStartRow) { hour = '

' + '' + hour + '' + '

'; } else { hour = '

' + '' + hour + '' + '

'; } lefter += '' + hour + ''; } lefter += ''; } var viewer = ''; for (var i = this.startRow; i < this.endRow; i++) { viewer += ''; for (var j = 0; j < this.dayNum; j++) { viewer += '' + '

' + '

' + ''; } viewer += ''; } var port = '

' + '

' + '' + '' + '' + '' + '' + '

' + '' + lefter + '

' + '

' + '' + viewer + '

' + '

'; var days = ''; this.dayTpl = new Ext.XTemplate( '' + '' + '

{day}

' + '' + '' ); var d = []; for (var j = 0; j < this.dayNum; j++) { d[d.length] = { idx: j, day: this.daySet[j].format(this.dayFormat) }; } days = this.dayTpl.apply(d); var week = this.daySet[0].getWeekOfYear(); if (1 == this.dayNum) { week = '' + week + ''; } else { week = '' + week + ''; } var header = '

' + '' + '' + '' + '' + '' + '' + '

' + '

' + week + '

' + '

' + '' + '' + days + '' + '

' + '

'; var bg = ''; for (var i = 0; i < this.dayNum; i++) { bg += ' '; } bg = '' + '' + bg + '' + '

'; var pool = '

' + '' + '' + '' + '' + '' + '

' + '

' + bg + '' + '' + '

' + '

'; var html = header + pool + port; return html; }, setToday: function() { var today = (new Date()).format('Y-m-d'); var len = this.daySet.length; var t; for (var i = 0; i < len; i++) { var day = this.daySet[i].format('Y-m-d'); if (day === today) { t = i; break; } } for (var i = 0; i < this.dayNum; i++) { var pbk = Ext.get(this.id + '-x-dayview-bg-0-' + i); if (pbk) { pbk.setStyle('background-color', 'white'); } } var flag = (false != Ext.type(t)); if (flag) { var pbk = Ext.get(this.id + '-x-dayview-bg-0-' + t); if (pbk) { pbk.setStyle('background-color', 'rgb(255,255,214)'); } } for (var i = this.activeStartRow; i < this.activeEndRow; i++) { for (var j = 0; j < this.dayNum; j++) { var div = Ext.get(this.id + '-x-dayview-viewer-' + i + '-' + j); if (div) { var td = Ext.get(div.dom.parentNode); if (flag && j == t) { td.setStyle('background-color', 'rgb(255,255,214)'); } else { td.setStyle('background-color', 'white'); } } } } }, getStartDate: function(date) { var sDate; if (1 == this.dayNum) { sDate = date; } else if (5 == this.dayNum) { var n = date.format('N'); if (7 == n) { n = 0; } n = 1 - n; sDate = date.add(Date.DAY, n); } else { if (1 == this.startDay) { var n = date.format('N'); n = 1 - n; sDate = date.add(Date.DAY, n); } else { var w = date.format('w'); sDate = date.add(Date.DAY, -w); } } return sDate; }, initComponent: function() { this.id = Ext.id(); this.daySet = []; this.ehandler.applyCalendarSetting(this); var sDate = this.getStartDate(new Date()); for (var i = 0, len = this.dayNum; i < len; i++) { this.daySet[this.daySet.length] = sDate.add(Date.DAY, i); } this.html = this.generateHTML(); Ext.ux.calendar.DayView.superclass.initComponent.call(this); this.addEvents( 'checklayout', 'sizechanged', 'afterresize', 'beforeremoteload', 'remoteload', 'canceldetail', 'viewDay', 'viewWeek' ); this.on('afterrender', this._onAfterRenderFn, this); this.on('checklayout', this.checkLayout, this); this.on('canceldetail', this.onCancelDetailFn, this); this.on('afterlayout', this._onReSizingFn, this); this.on('bodyresize', this._onReSizingFn, this); this.on('sizechanged', this.onSizeChangedFn, this, { buffer: 50 }); Ext.EventManager.on(document, 'mouseup', this._onMouseUpFn, this); }, _onReSizingFn: function() { this.fireEvent('sizechanged'); }, onSizeChangedFn: function() { this.handleResize(this.body.getWidth(), this.body.getHeight()); }, onCancelDetailFn: function() { if (this.detailing) { this.detailing = false; this.detailCt.setStyle('display', 'none'); } }, resetDragEventEl: function() { if (this.dragEventEl) { var eh = this.ehandler; delete (this.dragEventEl.row); delete (this.dragEventEl); delete (this.moving); eh.floating = false; } }, resetPrepareEl: function() { if (this.preEl) { var eh = this.ehandler; eh.showEditor(this.preEl, this, 'add'); delete (this.preEl); } }, resetSCover: function() { delete (this.startPos); delete (this.endPos); this.hideSCovers(); }, endDragEventEl: function(coverEl, e) { var cview = coverEl.cview; var eh = this.ehandler; eh.floating = false; var event = coverEl.bindEvent; var col = coverEl.col; var nol = coverEl.nol; if (false == Ext.type(nol)) { nol = col; coverEl.nol = nol; } var row = coverEl.row || event.startRow; var slot = event['endRow'] - event['startRow']; if (nol == col) { event['startRow'] = row; event['endRow'] = row + slot; if ('string' == Ext.type(event.repeatType)) { eh.updateEvent(event, cview, col); } else { var oevent = Ext.apply({}, event); event.repeatType = 'exception'; oevent.startRow = oevent.oldStartRow; oevent.endRow = oevent.oldEndRow; eh.updateRepeatEvent(event, this, oevent); } } else { var oevent = Ext.apply({}, event); event.startRow = row; event.endRow = row + slot; var day = cview.daySet[nol]; var dnum = Ext.ux.calendar.Mask.getDayOffset(event.day, event.eday); event.day = day.format('Y-m-d'); day = day.add(Date.DAY, dnum); event.eday = day.format('Y-m-d'); if ('string' == Ext.type(oevent.repeatType)) { eh.ds.updateEvent(event, function() { var layout = eh.calendarLayout.getLayout(cview.daySet[col], cview); var rs = layout.updateLayout(oevent, 'delete'); eh.renderEvent(cview, rs.elist, col); layout = eh.calendarLayout.getLayout(day, cview); rs = layout.updateLayout(event, 'add'); eh.renderEvent(cview, rs.elist, nol); eh.fireEvent('changeEventCache', eh); }, this); } else { event.repeatType = 'exception'; oevent.startRow = oevent.oldStartRow; oevent.endRow = oevent.oldEndRow; eh.updateRepeatEvent(event, this, oevent); } } }, endResizeEventEl: function(eventEl) { var eh = this.ehandler; eh.floating = false; var event = eventEl.bindEvent; if ('string' == Ext.type(event.repeatType)) { eh.updateEvent(event, this, eventEl.col); } else { var oevent = Ext.apply({}, event); event.repeatType = 'exception'; oevent.startRow = oevent.oldStartRow; oevent.endRow = oevent.oldEndRow; eh.updateRepeatEvent(event, this, oevent); } }, _onMouseUpFn: function(e) { var eh = this.ehandler; this.resetPrepareEl(); if (this.dragEventEl && this.moving) { this.endDragEventEl(this.dragEventEl, e); } this.resetDragEventEl(); if (!this.dragging) { if (this.startPos) { var spos = Ext.apply({}, this.startPos), epos = Ext.apply({}, this.endPos); this.startPos = null; eh.prepareLegend(Ext.get(this.id + '-x-dayview-bg-0-' + epos.y), spos, epos, this); } } if (this.resizeEventEl) { this.endResizeEventEl(this.resizeEventEl); } this.resetResizeEventEl(); }, getCellIndex: function(cellId) { var parts = cellId.toString().split('-'); var len = parts.length; var colIndex = parts[len - 1]; var rowIndex = parts[len - 2]; return { x: parseInt(rowIndex), y: parseInt(colIndex) }; }, _onAfterRenderFn: function(p) { this.initEls(); this.setToday(); }, _onPortClickFn: function(e) { var eh = this.ehandler; var target = e.getTarget(); var tgEl = Ext.get(target); if (tgEl.hasClass('x-event-pin')) { if (tgEl.hasClass('x-calendar-event-pin-off')) { tgEl.removeClass('x-calendar-event-pin-off'); tgEl.addClass('x-calendar-event-pin-on'); eh.editDisabled = true; } else { tgEl.removeClass('x-calendar-event-pin-on'); tgEl.addClass('x-calendar-event-pin-off'); eh.editDisabled = false; } } else { var cEl; if (tgEl.hasClass('x-event-content-link')) { cEl = tgEl.parent('.x-event-cover'); if (!cEl.bindEvent.locked) { eh.showEditor(cEl, this, 'update'); } } else { if (tgEl.hasClass('x-event-cover')) { cEl = tgEl; } else { cEl = tgEl.parent('.x-event-cover'); } if (cEl) { eh.setEditingStatus(cEl, true, false); } } } }, _onPortMouseOverFn: function(e) { var target = e.getTarget(); var tgEl = Ext.get(target); var flag = false; if (tgEl.hasClass('x-event-cover')) { flag = true; } else if ((tgEl = tgEl.parent('.x-event-cover'))) { flag = true; } if (flag) { var eh = this.ehandler; if (!eh.editDisabled) { eh.setEditingStatus(tgEl, true); } } }, _onBodyClickFn: function(e) { var data = {}; var target = e.getTarget(); var tgEl = Ext.get(target); var eh = this.ehandler; if (tgEl.hasClass('x-dayview-pool-collapse')) { tgEl.removeClass('x-dayview-pool-collapse'); tgEl.addClass('x-dayview-pool-expand'); this.lineNum = Math.floor(this.body.getHeight() / 17) - 5; this.checkLayout(Ext.isIE); } else if (tgEl.hasClass('x-dayview-pool-expand')) { tgEl.addClass('x-dayview-pool-collapse'); tgEl.removeClass('x-dayview-pool-expand'); this.lineNum = 3; this.checkLayout(Ext.isIE); } else if (tgEl.hasClass('x-event-detail-tool-close')) { this.fireEvent('canceldetail'); } else { var titleEl; // TRAKKWARE data = tgEl.bindEvent; if (tgEl.hasClass('x-event-title-default')) { titleEl = tgEl; } else { titleEl = tgEl.parent('.x-event-title-default'); if (!titleEl) { titleEl = tgEl.parent('.x-event-content-default'); } } if (titleEl) { var lEl = titleEl.parent('.x-calendar-event'); data = lEl.bindEvent; } // END TRAKKWARE if (!this.readOnly && (tgEl.hasClass('x-whole-title-b') || tgEl.hasClass('x-legend-title-b'))) { var wEl = tgEl.parent('.x-whole-cover'); if (wEl && !wEl.bindEvent.locked) { eh.showEditor(wEl, this, 'update'); } } else if (tgEl.hasClass('x-dayview-header-day-link')) { var pos = this.getCellIndex(tgEl.dom.id); var day = this.daySet[pos.y]; this.fireEvent('viewDay', this, day); } else if (tgEl.hasClass('x-dayview-wn-link')) { var sdate = this.daySet[0]; this.fireEvent('viewWeek', sdate, sdate); } } // Only show an event if one was actually clicked on. if (data) { var id = data.eventId; if (Ext.isDefined(id)) { Trakkware.ViewFramework.launchView({ view: 'Trakkware.Common.NopCommerce.Views.CommerceEventCalendarDetailView, Trakkware.Common.NopCommerce', command: 'POPULATE', viewParams: { EventOccurrenceID: id }, launch: 'window', width: 500, height: 500, header: true, title: eh.subject, ControlID: eh.ControlID }); } } return; }, _onBodyContextMenuFn: function(e) { e.stopEvent(); var eh = this.ehandler; var target = e.getTarget(); var tgEl = Ext.get(target); if (!tgEl.hasClass('x-calendar-event')) { tgEl = tgEl.parent('.x-calendar-event'); } if (tgEl) { eh.showContextMenu(e, tgEl); this.menu.hide(); } else if (this.createByDblclick) { var pvEl = Ext.get(target); ; if (!pvEl.hasClass('x-dayview-pool-viewer')) { pvEl = pvEl.parent('.x-dayview-pool-viewer') } if (pvEl) { this.menu.pn = this.calculatePos(e); this.menu.showAt(e.getXY()); eh.cmenu.hide(); } } }, _onBodyDblclickFn: function(e) { var eh = this.ehandler; var target = e.getTarget(); var tgEl = Ext.get(target); if (!tgEl.hasClass('x-calendar-event')) { tgEl = tgEl.parent('.x-calendar-event'); } if (tgEl && !tgEl.bindEvent.locked) { eh.showEditor(tgEl, this, 'update'); } else if (this.createByDblclick) { var pvEl = Ext.get(target); if (!pvEl.hasClass('x-dayview-pool-viewer')) { pvEl = pvEl.parent('.x-dayview-pool-viewer') } if (pvEl) { var pos = this.calculatePos(e); var epos = Ext.apply({}, pos); this.selectRange(pos, epos); this.startPos = null; eh.prepareLegend(Ext.get(this.id + '-x-dayview-bg-0-' + pos.y), pos, epos, this); } } }, resetResizeEventEl: function() { if (this.resizeEventEl) { delete (this.resizeEventEl); } }, _onPortMouseDownFn: function(e) { e.stopEvent(); this.fireEvent('hideeditor'); this.fireEvent('canceldetail'); if (0 == e.button) { var target = e.getTarget(); var tgEl = Ext.get(target); var eh = this.ehandler; if (tgEl.hasClass('x-dayview-viewer-cell')) { if (!this.createByDblclick) { this.preEl = eh.prepareEvent(tgEl, this); this.preEl.base = this.preEl.bindEvent.startRow; eh.setEditingStatus(this.preEl, true); eh.floating = true; } } else if (tgEl.hasClass('x-event-bottom-default')) { var eEl = tgEl.parent('.x-event-cover'); var event = eEl.bindEvent; if (!event.locked) { event.oldStartRow = event.startRow; event.oldEndRow = event.endRow; this.resizeEventEl = eEl; } else { this.resetResizeEventEl(); } } else if (!tgEl.hasClass('x-event-pin') && !tgEl.hasClass('x-event-content-link')) { delete (this.preEl); var eEl = tgEl; if (!eEl.hasClass('x-event-cover')) { eEl = tgEl.parent('.x-event-cover'); } if (eEl) { var event = eEl.bindEvent; if (!event.locked) { event.oldStartRow = event.startRow; event.oldEndRow = event.endRow; eEl.span = event.endRow - event.startRow; this.dragEventEl = eEl; } else { this.resetDragEventEl(); } } } } }, movePrepareEl: function(prepareEl, e) { var event = prepareEl.bindEvent; var base = prepareEl.base; var baseEl = Ext.get(this.id + '-x-dayview-viewer-' + base + '-0'); var top = baseEl.getTop(); var bottom = baseEl.getBottom(); var y = e.getXY()[1]; if (y >= top) { var h = y - top; var plot = Math.round(h / 26); h = plot * 26; event.startRow = base; event.endRow = base + plot + 1; if (this.endRow < event.endRow) { event.endRow = this.endRow; h = 26 * (this.endRow - base - 1); } prepareEl.contentEl.setHeight(h); prepareEl.titleEl.dom.innerHTML = '' + this.ehandler.generateTitle(event) + ''; prepareEl.setY(top); } else { var h = bottom - y; var plot = Math.round(h / 26); h = plot * 26; event.startRow = base - plot; event.endRow = base + 1; if (this.startRow > event.startRow) { event.startRow = this.startRow; h = 26 * (event.endRow - event.startRow - 1); } prepareEl.contentEl.setHeight(h); prepareEl.titleEl.dom.innerHTML = '' + this.ehandler.generateTitle(event) + ''; var t = bottom - prepareEl.getHeight(); prepareEl.setY(t); } }, resizingEventEl: function(eventEl, e) { eventEl.setStyle('cursor', 's-resize'); var event = eventEl.bindEvent; var eh = this.ehandler; eh.floating = true; var xy = e.getXY(); var bl = this.cbody.getLeft(); var fn = Ext.get(this.id + '-x-dayview-viewer-' + this.startRow + '-0'); var lt = fn.getXY(), cw = fn.getWidth(), ch = fn.getHeight() + 1; var y = xy[1] - lt[1]; var row = this.startRow + Math.ceil(y / ch); if (this.endRow < row) { row = this.endRow; } var r = (this.endRow == row) ? this.endRow - 1 : row; var pn = Ext.get(this.id + '-x-dayview-viewer-' + r + '-' + eventEl.col); var left = pn.getLeft() - bl; event.endRow = row; if (this.endRow < event.endRow) { event.endRow = this.endRow; } if (event.endRow <= event.startRow) { event.endRow = event.startRow + 1; } var h = ch * (event.endRow - event.startRow) - 24; eventEl.setStyle('left', left + 'px'); eventEl.setStyle('width', cw + 'px'); eventEl.contentEl.setHeight(h); eventEl.titleEl.dom.innerHTML = '' + eh.generateTitle(event) + ''; eh.setEditingStatus(eventEl, true); }, moveEventEl: function(eventEl, e) { var eh = this.ehandler; var xy = e.getXY(); var bl = this.cbody.getLeft(), bt = this.cbody.getTop(); var fn = Ext.get(this.id + '-x-dayview-viewer-' + this.startRow + '-0'); var lt = fn.getXY(), cw = fn.getWidth(), ch = fn.getHeight() + 1; var x = xy[0] - lt[0], y = xy[1] - lt[1]; var row = this.startRow + Math.ceil(y / ch), col = Math.floor(x / cw); row -= 1; if (this.startRow > row) { row = this.startRow; } else if (this.endRow <= row) { row = this.endRow - 1; } if (0 > col) { col = 0; } else if (this.dayNum <= col) { col = this.dayNum - 1; } var pn = Ext.get(this.id + '-x-dayview-viewer-' + row + '-' + col); var left = pn.getLeft() - bl; var top = pn.getTop() - bt; eventEl.setStyle('left', left + 'px'); eventEl.setStyle('top', top + 'px'); eventEl.setStyle('width', cw + 'px'); eh.floating = true; eh.setEditingStatus(eventEl, true); var event = eventEl.bindEvent; var span = eventEl.span || event['endRow'] - event['startRow']; event['startRow'] = row; event['endRow'] = event['startRow'] + span; if (this.endRow - 1 < event['startRow']) { event['startRow'] = this.endRow - 1; } if (this.endRow < event['endRow']) { event['endRow'] = this.endRow; } var h = 26 * (event.endRow - event.startRow - 1); eventEl.contentEl.setHeight(h); eventEl.titleEl.dom.innerHTML = '' + eh.generateTitle(event) + ''; eventEl.nol = col; eventEl.row = row; }, _onPortMouseMoveFn: function(e) { if (0 == e.button) { if (this.preEl) { this.movePrepareEl(this.preEl, e); } else if (this.dragEventEl) { this.moving = true; this.moveEventEl(this.dragEventEl, e); } else if (this.resizeEventEl) { this.resizingEventEl(this.resizeEventEl, e); } } else { this.resetResizeEventEl(); this.resetDragEventEl(); this.resetPrepareEl(); } }, initEls: function() { this.port = Ext.get(this.id + '-x-dayview-port'); this.cbody = Ext.get(this.id + '-x-dayview-body'); this.lefter = Ext.get(this.id + '-x-dayview-lefter'); this.cheader = Ext.get(this.id + '-x-dayview-header'); this.cpool = Ext.get(this.id + '-x-dayview-pool'); this.cptable = Ext.get(this.id + '-x-dayview-pool-ct'); this.pviewer = Ext.get(this.id + '-x-dayview-pool-viewer'); this.pswitch = Ext.get(this.id + '-x-dayview-pool-switch'); this.port.un('mouseover', this._onPortMouseOverFn, this); this.port.on('mouseover', this._onPortMouseOverFn, this); this.body.un('mousedown', this._onBodyMouseDownFn, this); this.body.on('mousedown', this._onBodyMouseDownFn, this); this.body.un('click', this._onBodyClickFn, this); this.body.on('click', this._onBodyClickFn, this); if (!this.ehandler.readOnly) { this.body.un('contextmenu', this._onBodyContextMenuFn, this); this.body.un('dblclick', this._onBodyDblclickFn, this); this.body.un('mousemove', this._onBodyMouseMoveFn, this); this.port.un('mousedown', this._onPortMouseDownFn, this); this.port.un('mousemove', this._onPortMouseMoveFn, this); this.body.on('mousemove', this._onBodyMouseMoveFn, this); this.body.on('contextmenu', this._onBodyContextMenuFn, this); this.body.on('dblclick', this._onBodyDblclickFn, this); this.port.on('mousedown', this._onPortMouseDownFn, this); this.port.on('mousemove', this._onPortMouseMoveFn, this); if (this.createByDblclick) { this.port.un('dblclick', this._onPortDblclickFn, this); this.port.on('dblclick', this._onPortDblclickFn, this); } this.port.un('click', this._onPortClickFn, this); this.port.un('contextmenu', this._PortContextMenuFn, this); this.port.on('click', this._onPortClickFn, this); this.port.on('contextmenu', this._PortContextMenuFn, this); this.initMenu(); if (1 < this.dayNum) { this.initDragZone(this.body); } } this.initSelectCover(); this.initDetailCt(); }, _PortContextMenuFn: function(e) { e.preventDefault(); var target = e.getTarget(); var tgEl = Ext.get(target); if (tgEl.hasClass('x-dayview-viewer-cell')) { this.menu.pn = tgEl; this.menu.showAt(e.getXY()); this.ehandler.cmenu.hide(); } }, initMenu: function() { var lan = Ext.ux.calendar.Mask.DayView; this.addItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_event_add', text: lan['addItem.text'], handler: this.onAddFn, scope: this }); this.menu = new Ext.menu.Menu({ items: [ this.addItem ] }); this.menu = Ext.menu.MenuMgr.get(this.menu); }, onAddFn: function(item) { var pn = item.parentMenu.pn; if (pn) { if (pn instanceof Ext.Element) { this.addEvent2Row(pn); } else { this.startPos = pn; this.endPos = pn; this.ehandler.prepareLegend(null, this); } } }, addEvent2Row: function(pn) { var eh = this.ehandler; eh.floating = true; this.preEl = eh.prepareEvent(pn, this); this.preEl.base = this.preEl.bindEvent.startRow; eh.showEditor(this.preEl, this, 'add'); eh.floating = false; delete (this.preEl); }, _onPortDblclickFn: function(e) { var target = e.getTarget(); var tgEl = Ext.get(target); var eh = this.ehandler; if (tgEl.hasClass('x-dayview-viewer-cell')) { this.addEvent2Row(tgEl); } }, initDetailCt: function() { var eh = this.ehandler; var html = eh.detailTpl.apply({}); this.detailCt = Ext.DomHelper.append(this.body, html, true); this.detailCt.setStyle('display', 'none'); this.detailTitle = this.detailCt.child('.x-event-detail-title-td'); this.detailViewer = this.detailCt.child('.x-event-detail-viewer'); this.detailFoot = this.detailCt.child('.x-event-detail-foot-text'); }, initDragZone: function(bindEl) { var proxy = new Ext.dd.StatusProxy({ dropNotAllowed: 'x-dd-drop-ok' }); bindEl.dragzone = new Ext.dd.DragZone(bindEl, { cview: this, ddGroup: 'x-mycalendar', proxy: proxy, onStartDrag: function() { this.cview.dragging = true; (function() { var event = this.dragData.bindEvent; var arr = Ext.DomQuery.select('div[name=x-event-' + event.day + '-' + event.eday + '-' + event.eventId + ']', this.cview.body.dom); for (var i = 0, len = arr.length; i < len; i++) { Ext.get(arr[i]).setOpacity(0.3); } }).defer(1, this); }, getDragData: function(e) { var target = e.getTarget(); var tgEl = Ext.get(target); if (!tgEl.hasClass('x-calendar-event')) { tgEl = tgEl.parent('.x-calendar-event'); } if (tgEl) { var event = tgEl.bindEvent; if (!event.locked) { var ddel = tgEl.dom.cloneNode(true); var w = tgEl.getWidth(); if (200 < w) { ddel.style.width = '200px'; } else { ddel.style.width = w + 'px'; } return { ddel: ddel, bindEvent: event }; } } return false; }, getRepairXY: function() { return null; }, onDrag: function(e) { var event = this.dragData.bindEvent; var cview = this.cview; var eh = cview.ehandler; var span = Ext.ux.calendar.Mask.getDayOffset(event.day, event.eday); var pos = cview.calculatePos(e); var epos = cview.addSpan2Pos(pos, span); cview.selectRange(pos, epos); }, endDrag: function(e) { var event = this.dragData.bindEvent; var oevent = Ext.apply({}, event); var cview = this.cview; var spos = cview.startPos; var eh = cview.ehandler; var dnum = Ext.ux.calendar.Mask.getDayOffset(event.day, event.eday); var date = cview.daySet[spos.y]; var day = date.format('Y-m-d'); if (event.day != day) { event.eday = date.add(Date.DAY, dnum).format('Y-m-d'); event.day = day; delete (cview.startPos); if ('string' == Ext.type(event.repeatType)) { eh.updateEvent(event, cview, spos.y); } else { event.repeatType = 'exception'; eh.updateRepeatEvent(event, cview, oevent); } } else { var arr = Ext.DomQuery.select('div[name=x-event-' + event.day + '-' + event.eday + '-' + event.eventId + ']', this.cview.body.dom); for (var i = 0, len = arr.length; i < len; i++) { var eEl = Ext.get(arr[i]); eEl.setOpacity(1); } } cview.dragging = false; cview.resetSCover(); cview.fireEvent('canceldetail'); } }); }, addSpan2Pos: function(pos, span) { var o = Ext.apply({}, pos); o.y += span; if (o.y >= this.dayNum) { o.y = this.dayNum - 1; } return o; }, alignDetailCt: function() { if (this.detailing) { var x = this.detailing.x, y = this.detailing.y, events = this.detailing.events; this.detailCt.setStyle('display', ''); var cEl = Ext.get(this.id + '-x-dayview-bg-' + x + '-' + y); var h = events.length * 17, mh = this.port.getBottom() - cEl.getTop() - 30; var roffset = this.port.getRight() - cEl.getRight(); var hpos; var offset = [0, 0]; if (h > mh) { this.detailViewer.setHeight(mh); } else { this.detailViewer.setStyle('height', ''); } if (1 < this.dayNum && roffset < this.detailCt.getWidth()) { hpos = 'r'; offset[0] = -1; } else { hpos = 'l'; } var cw = cEl.getWidth(); if (200 < cw) { this.detailCt.setWidth(cw); } else { this.detailCt.setWidth(200); } var str = 't' + hpos; this.detailCt.alignTo(cEl, str + '-' + str, offset); } }, showDetails: function(day) { var lan = Ext.ux.calendar.Mask.DayView; var eh = this.ehandler; var glayout = eh.calendarLayout; var events = glayout.getWholeList(this, day, false, true); var index = this.getIndexFromDay(day); var x = 0; var y = index % this.shiftDay; this.detailing = { x: x, y: y, events: events }; this.detailTitle.dom.innerHTML = '' + day + ''; this.detailFoot.dom.innerHTML = events.length + ' ' + lan['events']; eh.bindEvent2Detail(this, events, this.detailViewer); this.alignDetailCt(); }, _onBodyMouseDownFn: function(e) { e.stopEvent(); this.fireEvent('hideeditor'); var target = e.getTarget(); var tgEl = Ext.get(target); var eEl; if (tgEl.hasClass('x-event-more')) { var day = tgEl.dom.getAttribute('name'); this.showDetails(day); } else { if (this.detailing) { if (!(tgEl.hasClass('x-event-detail-ct') || tgEl.parent('.x-event-detail-ct'))) { this.fireEvent('canceldetail'); } else { return; } } if (!this.createByDblclick && !this.ehandler.readOnly) { if (tgEl.hasClass('x-calendar-event')) { eEl = tgEl; } else { eEl = tgEl.parent('.x-calendar-event'); } if (!eEl) { eEl = tgEl.parent('.x-dayview-pool-viewer'); if (eEl) { var pos = this.calculatePos(e); this.selectRange(pos, pos); } } } } }, calculatePos: function(e) { var xy = e.getXY(); var lt = this.pviewer.getXY(); var y = Math.floor((xy[0] - lt[0]) / this.cw); if (0 > y) { y = 0; } else if (y >= this.dayNum) { y = this.dayNum - 1; } return { x: 0, y: y }; }, _onBodyMouseMoveFn: function(e) { if (0 == e.button) { if (this.startPos) { var pos = this.calculatePos(e); this.selectRange(null, pos); } } else { this.resetSCover(); } }, hideSCovers: function() { this.scover.dom.style.display = 'none'; }, selectRange: function(spos, epos) { this.hideSCovers(); if (spos) { this.startPos = spos; } else { spos = this.startPos; } this.endPos = epos; var sy, ey; if (this.startPos.y > this.endPos.y) { sy = this.endPos.y; ey = this.startPos.y; } else { ey = this.endPos.y; sy = this.startPos.y; } var cw = this.cw; var ch = this.pviewer.getHeight(); var w, l = cw * sy; var sc = this.scover; sc.dom.style.display = ''; w = cw * (ey - sy + 1); sc.setWidth(w); sc.setHeight(ch); sc.setLeft(l + 'px'); sc.setTop('0px'); }, initSelectCover: function() { var div = document.createElement('div'); div.className = 'x-event-select-cover'; div = Ext.get(div); this.pviewer.appendChild(div); this.scover = div; }, resizePort: function(relayout) { var bh = this.body.getHeight(); var ph = this.cpool.getHeight(); var ah = bh - this.cheader.getHeight() - ph - 1; if (ah != this.port.getHeight()) { this.port.setHeight(ah); } if (true == relayout) { var eh = this.ehandler; var glayout = eh.calendarLayout; for (var i = 0, len = this.dayNum; i < len; i++) { var layout = glayout.getLayout(this.daySet[i], this); if (layout) { var rs = layout.reLayout(); eh.renderEvent(this, rs.elist, i); } } this.adjustScroller(); } }, handleResize: function(bw, bh, still) { if (typeof bw == 'number') { this.cheader.setWidth(bw); if (!Ext.isIE) { bw -= 2; } var pw = bw - this.scrollOffset; var r = pw % 7; this.leftWidth = 70 + r; Ext.util.CSS.updateRule('.' + this.id + '-x-dayview-lefter-width', 'width', this.leftWidth + 'px'); this.port.setWidth(bw); bw = pw - this.leftWidth; this.cw = Math.round(bw / this.dayNum); } if (typeof bh == 'number') { this.resizePort(true); } this.alignDetailCt(); this.updateTimeline(); this.fireEvent('afterresize', this, bw, bh); }, adjustScroller: function() { if (!this.hideInactiveRow) { var rh = Ext.get(this.id + '-x-dayview-viewer-' + this.activeStartRow + '-0'); rh = Ext.get(rh.dom.parentNode); this.port.dom.scrollTop = rh.getHeight() * this.activeStartRow; } }, checkLayout: function(force, refresh) { var eh = this.ehandler; var startDate = this.daySet[0]; var endDate = this.daySet[this.daySet.length - 1]; if (eh.isInDayCache(startDate, endDate) && !refresh) {/* if it in the eventCache, we don't need request server*/ var glayout = eh.calendarLayout; var layoutSet = {}; var whole = {}; for (var i = 0, len = this.dayNum; i < len; i++) { var day = this.daySet[i].format('Y-m-d'); var layout = glayout.getLayout(day, this); whole[day] = glayout.getWholeList(this, day); if (true !== layout.visited[this.id] || force) { layoutSet[i] = layout; this.cleanup(i); } } glayout.showWeek(this, this.cptable.dom.firstChild, 0, whole, true); this.resizePort(); for (var p in layoutSet) { var layout = layoutSet[p]; var rs = layout.reLayout(false, true); eh.renderEvent(this, rs.elist, p); } this.adjustScroller(); } else { this.fireEvent('beforeremoteload'); this.cleanup(); eh.ds.loadEvent(startDate, endDate, function(eventSet) { var glayout = eh.calendarLayout; var wlist = eventSet['whole']; glayout.updateWholeList(wlist, 'add'); this.showEvents(eventSet, refresh); eh.pushDayCache(startDate, endDate); this.adjustScroller(); if (this.firstTime) { this.firstTime = false; eh.checkExpireEvents(); } this.resizePort(Ext.isIE); this.fireEvent('remoteload'); }, this); } this.setToday(); this.updateTimeline(); }, showEvents: function(eventSet, refresh) { var whole = {}; var eh = this.ehandler; var glayout = eh.calendarLayout; for (var i = 0, len = this.dayNum; i < len; i++) { var day = this.daySet[i].format('Y-m-d'); var layout = glayout.getLayout(day, this, eventSet[day] || [], true, refresh); if (layout) { var rs = layout.reLayout(); eh.renderEvent(this, rs.elist, i); whole[day] = rs.wlist; } } glayout.showWeek(this, this.cptable.dom.firstChild, 0, whole, true); }, refreshLefter: function() { var hnum = this.numInHour; for (var i = 0; i < this.rowCount; i++) { for (var j = 0; j < 1; j++) { var hour = Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, i, this.hourFormat); var rest = i % hnum; if (0 != rest && i != this.activeStartRow) { hour = '

' + '' + hour + '' + '

'; } else { hour = '

' + '' + hour + '' + '

'; } var hEl = Ext.get(this.id + '-x-dayview-lefter-' + i + '-' + j); if (hEl) { hEl.dom.firstChild.innerHTML = hour; } } } }, refreshDate: function() { for (var i = 0; i < this.dayNum; i++) { var titleEl = Ext.get(this.id + '-x-dayview-day-link-0-' + i); if (titleEl) { var day = this.daySet[i].format(this.dayFormat); titleEl.dom.innerHTML = day; } } var wEl = Ext.get(this.id + '-x-dayview-wn'); wEl.dom.innerHTML = this.daySet[0].getWeekOfYear(); }, resetView: function() { this.refreshDate(); this.setToday(); }, cleanup: function(col, pool) { if (!pool) { if (false == Ext.type(col)) { for (var i = 0; i < this.rowCount; i++) { for (var j = 0; j < this.dayNum; j++) { var El = Ext.get(this.id + '-x-dayview-viewer-' + i + '-' + j); if (El) { El.dom.innerHTML = ''; } } } } else { for (var i = 0; i < this.rowCount; i++) { var El = Ext.get(this.id + '-x-dayview-viewer-' + i + '-' + col); if (El) { El.dom.innerHTML = ''; } } } } if (this.cptable) { var tbody = this.cptable.dom.firstChild; while (0 < tbody.childNodes.length) { Ext.get(tbody.lastChild).remove(); } } }, getIndexFromDay: function(day) { for (var i = 0, len = this.daySet.length; i < len; i++) { var iday = this.daySet[i]; if (day == iday.format('Y-m-d')) { return i; } } }, locateDay: function(day) { var fd = this.getStartDate(day); this.daySet[0] = fd; for (var i = 1; i < this.dayNum; i++) { this.daySet[i] = fd.add(Date.DAY, i); } }, showDay: function(day) { this.locateDay(day); this.resetView(); this.checkLayout(true); }, goBack: function() { var shiftDay = this.shiftDay || this.dayNum; var dayNum = this.dayNum; var sdate = this.daySet[0]; var fdate = sdate.add(Date.DAY, -1 * shiftDay); var weekNum = this.weekNum || 1; this.daySet = []; for (var i = 0; i < weekNum; i++) { for (var j = 0; j < dayNum; j++) { this.daySet[this.daySet.length] = fdate.add(Date.DAY, i * shiftDay + j); } } this.resetView(); this.checkLayout(true); }, goNext: function() { var shiftDay = this.shiftDay || this.dayNum; var dayNum = this.dayNum; var sdate = this.daySet[0]; var fdate = sdate.add(Date.DAY, shiftDay); var weekNum = this.weekNum || 1; this.daySet = []; for (var i = 0; i < weekNum; i++) { for (var j = 0; j < dayNum; j++) { this.daySet[this.daySet.length] = fdate.add(Date.DAY, i * shiftDay + j); } } this.resetView(); this.checkLayout(true); }, isShift: function(startDate, endDate) { var maxmin, minmax; var day1 = startDate.format('Y-m-d'); var day2 = this.daySet[0].format('Y-m-d') if (day1 < day2) { maxmin = day2; } else { maxmin = day1; } day1 = endDate.format('Y-m-d'); day2 = this.daySet[this.daySet.length - 1].format('Y-m-d'); if (day1 > day2) { minmax = day2; } else { minmax = day1; } if (maxmin > minmax) { var sdate = this.getStartDate(startDate); this.daySet = []; for (var i = 0; i < this.weekNum; i++) { for (var j = 0; j < this.dayNum; j++) { this.daySet[this.daySet.length] = sdate.add(Date.DAY, i * this.shiftDay + j); } } return true; } else { return false; } }, showRange: function(startDate, endDate, force) { if (this.isShift(startDate, endDate)) { force = true; this.resetView(); } this.checkLayout(force); } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.ResultView = function(config) { Ext.apply(this, config); this.ehandler.applyCalendarSetting(this); this.pageSize = 20; var lan = Ext.ux.calendar.Mask.ResultView; var url = Trakkware.Handlers.MethodHandler + '?view=' + config.TrakkwareConfig.ViewName; var store = Ext.ux.calendar.Mask.getEventStore(url); // TRAKKWARE CHANGE: Added hidden:true to some columns. var columns = [ { header: '', hidden: true, sortable: true, menuDisabled: true, width: 20, dataIndex: 'calendarId', renderer: this.hiddenRenderFn.createDelegate(this) }, { header: '', hidden: true, sortable: true, menuDisabled: true, width: 20, dataIndex: 'locked', renderer: this.lockedRenderFn.createDelegate(this) }, { header: lan['cm.time'], dataIndex: 'ymd', sortable: true, width: 140, renderer: this.fromtoRenderFn.createDelegate(this) }, { header: lan['cm.calendar'], sortable: true, menuDisabled: true, width: 100, dataIndex: 'calendarId', renderer: this.calendarRenderFn.createDelegate(this) }, { header: lan['cm.subject'], sortable: true, width: 120, dataIndex: 'subject', renderer: this.subjectRenderFn }, { header: lan['cm.content'], sortable: true, width: 120, dataIndex: 'description', renderer: this.contentRenderFn }, { header: lan['cm.expire'], hidden: true, sortable: true, menuDisabled: true, width: 80, renderer: this.expireRenderFn.createDelegate(this) } ]; this.groupBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_group', text: lan['groupBtn.group.text'], handler: this.onGroupFn, scope: this }); this.returnBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_door_out', text: lan['returnBtn.text'], handler: this.onReturnFn, scope: this }); var pbar = new Ext.PagingToolbar({ pageSize: this.pageSize, store: store }); pbar.on('render', this.onPageToolbarRenderFn, this); this.list = new Ext.grid.GridPanel({ border: false, store: store, columns: columns, view: new Ext.grid.GroupingView({ forceFit: true }), loadMask: { msg: lan['loadMask.msg'] }, bbar: pbar }); Ext.ux.calendar.ResultView.superclass.constructor.call(this, { layout: 'fit', items: [this.list] }); this.on('render', this.onRenderFn, this); this.list.on('rowdblclick', this.onRowDblClickFn, this); this.list.on('rowclick', this.onRowClickFn, this); store.on('beforeload', this.onBeforeLoadFn, this); store.on('load', this.onLoadFn, this); store.clearGrouping(); }; Ext.extend(Ext.ux.calendar.ResultView, Ext.ux.calendar.BasicView, { onBeforeLoadFn: function(store) { store.removeAll(); }, onLoadFn: function(store, rds, options) { for (var i = 0, len = rds.length; i < len; i++) { var rd = rds[i]; var rt = rd.data.repeatType; if ('no' != rt && 'exception' != rt) { rd.data.repeatType = Ext.decode(rt); } } }, onGroupFn: function(btn) { var lan = Ext.ux.calendar.Mask.ResultView; var store = this.list.getStore(); if (lan['groupBtn.group.text'] == btn.getText()) { btn.setText(lan['groupBtn.unGroup.text']); btn.setIconClass('icon_feyaCalendar_ungroup'); store.groupBy('ymd'); } else { btn.setText(lan['groupBtn.group.text']); btn.setIconClass('icon_feyaCalendar_group'); store.clearGrouping(); } }, onReturnFn: function() { var calendarContainer = this.ownerCt; calendarContainer.getLayout().setActiveItem(calendarContainer.currentIdx); calendarContainer.currentView.checkLayout(true); }, onRenderFn: function(p) { p.port = p.body; }, onPageToolbarRenderFn: function(t) { t.add('->', this.groupBtn, '-', this.returnBtn); }, onRowClickFn: function(grid, rowIndex, e) { var target = e.getTarget(); var tgEl = Ext.get(target); var eh = this.ehandler; var store = grid.getStore(); var rd = store.getAt(rowIndex); var event = { eventId: rd.data.id, calendarId: rd.data.calendarId, startRow: parseInt(rd.data.startRow), endRow: parseInt(rd.data.endRow), subject: rd.data.subject, content: rd.data.description, day: rd.data.ymd, eday: rd.data.eymd, isShared: rd.data.isShared, alertFlag: rd.data.alertFlag, repeatType: rd.data.repeatType }; //TRAKKWARE CHANGES // Only show an event if one was actually clicked on. var id = rd.data.id; if (Ext.isDefined(id)) { Trakkware.ViewFramework.launchView({ view: 'Trakkware.Common.NopCommerce.Views.CommerceEventCalendarDetailView, Trakkware.Common.NopCommerce', command: 'POPULATE', viewParams: { EventOccurrenceID: id }, launch: 'window', width: 500, height: 500, header: true, title: eh.subject, ControlID: eh.ControlID }); } return; // TRAKKWARE CHANGES END HERE! var oevent = Ext.apply({}, event); if (tgEl.hasClass('x-calendar-resultview-lock')) { if (tgEl.hasClass('icon_feyaCalendar_event_lock')) { tgEl.removeClass('icon_feyaCalendar_event_lock'); tgEl.addClass('icon_feyaCalendar_event_unlock'); rd.set('locked', false); event['locked'] = false; } else if (tgEl.hasClass('icon_feyaCalendar_event_unlock')) { tgEl.removeClass('icon_feyaCalendar_event_unlock'); tgEl.addClass('icon_feyaCalendar_event_lock'); rd.set('locked', true); event['locked'] = true; } store.commitChanges(); var cc = this.ownerCt; var cview = cc.currentView; if ('string' == Ext.type(rd.data.repeatType)) { eh.updateEvent(event, cview); } else { eh.updateRepeatEvent(event, cview, oevent); } } }, onRowDblClickFn: function(grid, rowIndex, e) { // TRAKKWARE: Return from double clicks without doing anything. return; var cc = this.ownerCt; var cview = cc.currentView; var eh = this.ehandler; var store = grid.getStore(); var rd = store.getAt(rowIndex); if (!rd.data.locked) { var rowEl = grid.getView().getRow(rowIndex); if (rowEl) { rowEl = Ext.get(rowEl); rowEl.bindEvent = { eventId: rd.data.id, calendarId: rd.data.calendarId, startRow: parseInt(rd.data.startRow), endRow: parseInt(rd.data.endRow), subject: rd.data.subject, content: rd.data.description, day: rd.data.ymd, eday: rd.data.eymd, isShared: rd.data.isShared, alertFlag: rd.data.alertFlag, locked: rd.data.locked, repeatType: rd.data.repeatType }; rowEl.cview = cview; var obj = { bindEl: rowEl, cview: this, onLayout: function(event) { rd.set('calendarId', event.calendarId); rd.set('subject', event.subject); rd.set('description', event.content); rd.set('ymd', event.day); rd.set('eymd', event.eday); rd.set('isShared', event.isShared); rd.set('alertFlag', event.alertFlag); rd.set('locked', event.locked); rd.set('repeatType', event.repeatType); store.commitChanges(); }, action: 'update' } eh.editor.fireEvent('showdetailsetting', obj); } } }, calendarRenderFn: function(value, meta, rd, row, col, store) { var legendStyle = 'height:9px;'; var calendarId = rd.data.calendarId; var eh = this.ehandler; var calendar = eh.calendarSet[calendarId]; var html = eh.calendarTpl.apply({ 'calendarId': calendar.id, 'legend-style': legendStyle, 'title': calendar.name, 'color': calendar.color }); return html; }, fromtoRenderFn: function(value, meta, rd, row, col, store) { var data = rd.data; data.startRow = Ext.ux.calendar.Mask.getRowFromHM(rd.data.startTime, this.intervalSlot); data.endRow = Ext.ux.calendar.Mask.getRowFromHM(rd.data.endTime, this.intervalSlot); data.day = data.ymd; data.eday = data.eymd; var html = this.ehandler.generateInfo(data); return html; }, subjectRenderFn: function(value, meta, rd, row, col, store) { var html = value || ''; if ('' == html.trim()) { html = Ext.ux.calendar.Mask.ResultView['noSubject']; } return html; }, contentRenderFn: function(value, meta, rd, row, col, store) { var html = value || ''; if ('' == html.trim()) { html = Ext.ux.calendar.Mask.ResultView['noContent']; } return html; }, generateExpireHTML: function(data) { var lan = Ext.ux.calendar.Mask.ResultView; var hour = data.hour; var html; if (-1 == hour) { html = '

' + 'Out of date' + '

'; } else if (0 <= hour && hour <= 24) { html = '

' + '' + hour + ' ' + lan['hour'] + '' + '

'; } else if (24 < hour && hour <= 72) { html = '

' + '' + hour + ' ' + lan['hour'] + '' + '

'; } else if (72 < hour) { html = '

' + '' + hour + ' ' + lan['hour'] + '' + '

'; } return html; }, expireRenderFn: function(value, meta, rd, row, col, store) { var endRow = Ext.ux.calendar.Mask.getRowFromHM(rd.data.endTime, this.intervalSlot); var str = rd.data.ymd + ' ' + rd.data.endTime; var day = Date.parseDate(str, 'Y-m-d H:i'); if (this.rowCount == endRow) { day = day.add(Date.DAY, 1); str = day.format('Y-m-d H:i'); } var offset = day.getElapsed(); if ((new Date()).format('Y-m-d H:i') >= str) { return this.generateExpireHTML({ hour: -1 }); } else { var hour = Math.round(offset / 3600000); return this.generateExpireHTML({ hour: hour }); } }, hiddenRenderFn: function(value, meta, rd, row, col, store) { var html; var cs = this.ehandler.calendarSet; if (cs[rd.data.calendarId].hide) { html = '

'; } else { html = '

'; } return html; }, lockedRenderFn: function(value, meta, rd, row, col, store) { var html; if (rd.data.locked) { html = '

'; } else { html = '

'; } return html; }, loadEvents: function(text) { var store = this.list.getStore(); store.removeAll(); this.matchText = text; /* var load_config = { view: this.TrakkwareConfig.ViewName, command: 'SEARCH', JustResults: true, actionParams: { UserID: '981957F2-3B04-4992-9BD6-69E3B8060F12' }, ControlID: this.TrakkwareConfig.ControlID }; Trakkware.ViewFramework.performMethodCall(null, load_config, function(orig_config, backObj) { }); */ store.baseParams = { paramarray: Ext.encode({ SearchTerm: text, CalendarID: this.TrakkwareConfig.CalendarID, CalendarGroupID: this.TrakkwareConfig.CalendarGroupID }), userId: this.ehandler.mainPanel.userId, command: 'SEARCH' }; store.load({ params: { start: 0, limit: this.pageSize } }); }, checkLayout: function() { var store = this.list.getStore(); store.reload(); } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.MonthView = Ext.extend(Ext.ux.calendar.BasicView, { legendHeight: 17, border: false, dayFormat: 'm/d', templateRowNum: 6, weekNum: 5, dayNum: 7, rowNum: 6, colNum: 7, menuAlign: "tr-br?", poolDepth: 0, leftWidth: 25, showMenu: function(El) { if (this.menu) { this.menu.bindEl = El; this.menu.show(Ext.get(El.dom.parentNode), this.menuAlign); } return this; }, hideMenu: function() { if (this.menu) { this.menu.hide(); } return this; }, initMenu: function() { var lan = Ext.ux.calendar.Mask.MonthView; this.addItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_new', text: lan['addItem.text'], handler: this.onAddFn, scope: this }); this.clearItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_clear_event', text: lan['clearItem.text'], handler: this.onClearFn, scope: this }); this.cutItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_cut', text: lan['cutItem.text'], handler: this.onCutFn, scope: this }); this.copyItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_copy', text: lan['copyItem.text'], handler: this.onCopyFn, scope: this }); this.pasteItem = new Ext.menu.Item({ iconCls: 'icon_feyaCalendar_paste', text: lan['pasteItem.text'], handler: this.onPasteFn, scope: this }); this.menu = new Ext.menu.Menu({ items: [ this.addItem, this.clearItem, '-', this.cutItem, this.copyItem, this.pasteItem ] }); this.menu = Ext.menu.MenuMgr.get(this.menu); }, getCellIndex: function(cellId) { var parts = cellId.toString().split('-'); var len = parts.length; var colIndex = parts[len - 1]; var rowIndex = parts[len - 2]; return { x: parseInt(rowIndex), y: parseInt(colIndex) }; }, generateHTML: function(data) { this.generateCSS(); this.viewerTpl = new Ext.XTemplate( '

' + '' + '' + '' + '

' + '

' + '' + '

' + '{week}' + '

' + '' + '

' + '

' + '' + '

' + '' + '' + '' + '' + '' + '' + '

' + '

' + '' + '' + (this.ehandler.readOnly ? '' : '') + '

' + '{day}' + '

' + '

' + '' + '

' ); this.viewerTpl.compile(); var obj = []; var sdate = this.daySet[0]; var week = sdate.getWeekOfYear(); for (var i = 0; i < this.templateRowNum; i++) { var arr = []; for (var j = 0; j < this.dayNum; j++) { arr[arr.length] = { idx: j, day: (sdate.add(Date.DAY, i * this.dayNum + j)).format(this.dayFormat) }; } var w = (week + i) % 53; if (0 == w) { w = 53; } obj[obj.length] = { idx: i, week: w, arr: arr } } var viewer = this.viewerTpl.apply(obj); var days = ''; for (var j = 0; j < this.dayNum; j++) { days += '' + '

' + '' + Ext.ux.calendar.Mask.MonthView['dayPre'] + this.daySet[j].format('l') + '' + '

' + ''; } var header = '

' + '' + '' + days + '' + '

' + '

'; var html = header + viewer; return html; }, generateCSS: function() { var cssText = '.' + this.id + '-x-monthview-viewer-row-height{}' + '.' + this.id + '-x-monthview-row{}' + '.' + this.id + '-x-monthview-viewer-list{}'; for (var i = 0; i < this.dayNum; i++) { cssText += '.' + this.id + '-x-monthview-viewer-col-' + i + '{}'; } var cid = Ext.id(); this.ss = Ext.util.CSS.createStyleSheet(cssText, cid); }, setToday: function() { var sdate = this.daySet[0]; var m = sdate.format('n'); if (1 != sdate.format('j')) { m = (m + 1) % 12; if (0 == m) m = 12; } var today = (new Date()).format('Y-m-d'); for (var i = 0, len = this.daySet.length; i < len; i++) { var day = this.daySet[i].format('Y-m-d'); var month = this.daySet[i].format('n'); if (day == today) { var x = Math.floor(i / this.dayNum); var y = i % this.dayNum; var tEl = Ext.get(this.id + '-x-monthview-viewer-title-' + x + '-' + y); if (tEl) { tEl.setStyle('background-color', 'rgb(255,255,200)'); } } else if (m != month) { var x = Math.floor(i / this.dayNum); var y = i % this.dayNum; var tEl = Ext.get(this.id + '-x-monthview-viewer-title-' + x + '-' + y); if (tEl) { tEl.setStyle('background-color', 'rgb(235,235,235)'); } } else { var x = Math.floor(i / this.dayNum); var y = i % this.dayNum; var tEl = Ext.get(this.id + '-x-monthview-viewer-title-' + x + '-' + y); if (tEl) { tEl.setStyle('background-color', 'rgb(241,244,250)'); } } } }, getStartDate: function(date) { var sDate; if (1 == this.startDay) { var n = date.format('N'); n = 1 - n; sDate = date.add(Date.DAY, n); } else { var w = date.format('w'); sDate = date.add(Date.DAY, -w); } return sDate; }, initComponent: function() { this.id = Ext.id(); this.ehandler.applyCalendarSetting(this); var today = new Date(); var first = today.getFirstDateOfMonth(); this.recalculateWeek(first); var sDate = this.getStartDate(first); this.daySet = []; for (var i = 0; i < this.weekNum; i++) { for (var j = 0; j < this.dayNum; j++) { this.daySet[this.daySet.length] = sDate.add(Date.DAY, i * this.shiftDay + j); } } this.html = this.generateHTML(); this.initMenu(); Ext.ux.calendar.MonthView.superclass.initComponent.call(this); this.addEvents( 'checklayout', 'afterresize', 'beforeremoteload', 'remoteload', 'canceldetail', 'viewDay', 'viewWeek' ); this.on('checklayout', this.checkLayout, this); this.on('canceldetail', this.onCancelDetailFn, this); this.on('afterrender', this._onAfterRenderFn, this); this.on('afterlayout', this._onReSizingFn, this); this.on('bodyresize', this._onReSizingFn, this); this.on('sizechanged', this.onSizeChangedFn, this, { buffer: 50 }); Ext.EventManager.on(document, 'mouseup', this._onMouseUpFn, this); }, _onAfterRenderFn: function() { this.initEls(); }, _onReSizingFn: function() { this.fireEvent('sizechanged'); }, onSizeChangedFn: function() { this.handleResize(this.body.getWidth(), this.body.getHeight()); }, onCancelDetailFn: function(e) { if (this.detailing) { this.detailing = false; this.detailCt.setStyle('display', 'none'); } }, resetSCover: function() { delete (this.startPos); delete (this.endPos); this.hideSCovers(); }, _onMouseUpFn: function(e) { if (!this.dragging) { if (this.startPos) { var spos = Ext.apply({}, this.startPos), epos = Ext.apply({}, this.endPos); this.startPos = null; var eh = this.ehandler; if (this.colNum != this.shiftDay && 1 != eh.startDay) { spos.y++; epos.y++; } eh.prepareLegend(Ext.get(this.id + '-x-monthview-viewer-title-' + epos.x + '-' + epos.y), spos, epos, this); } } }, getMinMaxFromStartEnd: function(startPos, endPos) { var stx = startPos.x; var sty = startPos.y; var edx = endPos.x; var edy = endPos.y; if (stx < edx || (stx == edx && sty <= edy)) { return { minPos: startPos, maxPos: endPos }; } else { return { minPos: endPos, maxPos: startPos } } }, hideSCovers: function() { for (var i = 0, len = this.scovers.length; i < len; i++) { this.scovers[i].dom.style.display = 'none'; } }, selectRange: function(spos, epos) { this.hideSCovers(); if (spos) { this.startPos = spos; } else { spos = this.startPos; } this.endPos = epos; var rs = this.getMinMaxFromStartEnd(spos, epos); var sx = rs.minPos.x, sy = rs.minPos.y, ex = rs.maxPos.x, ey = rs.maxPos.y; var cw = this.cw; var ch = this.ch; var sc, fsc = this.scovers[sx]; var w, l = Math.floor(cw * sy); if (sx == ex) { sc = this.scovers[sx]; sc.dom.style.display = ''; w = cw * (ey - sy + 1); sc.setWidth(w); sc.setHeight(ch); sc.setLeft(l + 'px'); } else { sc = this.scovers[sx]; sc.dom.style.display = ''; w = cw * (this.colNum - sy); sc.setWidth(w); sc.setHeight(ch); sc.setLeft(l + 'px'); for (var i = sx + 1; i < ex; i++) { sc = this.scovers[i]; sc.dom.style.display = ''; w = cw * this.colNum; sc.setWidth(w); sc.setHeight(ch); sc.setLeft('0px'); } sc = this.scovers[ex]; sc.dom.style.display = ''; w = cw * (ey + 1); sc.setWidth(w); sc.setHeight(ch); sc.setLeft('0px'); } }, calculatePos: function(e) { var xy = e.getXY(); var lt = this.port.getXY(); var y = Math.floor((xy[0] - lt[0]) / this.cw); var x = Math.floor((xy[1] - lt[1]) / this.ch); if (0 > x) { x = 0; } else if (x >= this.weekNum) { x = this.weekNum - 1; y = this.colNum - 1; } if (0 > y) { y = 0; } else if (y >= this.colNum) { y = this.colNum - 1; } return { x: x, y: y }; }, getIndexFromDay: function(day) { for (var i = 0, len = this.daySet.length; i < len; i++) { var iday = this.daySet[i]; if (day == iday.format('Y-m-d')) { return i; } } }, alignDetailCt: function() { if (this.detailing) { var x = this.detailing.x, y = this.detailing.y, events = this.detailing.events; this.detailCt.setStyle('display', ''); var tEl = Ext.get(this.id + '-x-monthview-viewer-title-' + x + '-' + y); var cEl = Ext.get(this.id + '-x-monthview-viewer-' + x + '-' + y); var tfh = this.detailTitle.getHeight() + this.detailFoot.getHeight() + 20; var h = events.length * 17; var bh = this.port.getBottom() - tEl.getTop() - tfh, th = cEl.getBottom() - this.port.getTop() - tfh; var roffset = this.port.getRight() - tEl.getRight(); var hpos, vpos = 't', mh = bh; var offset = [0, 0]; var cw = cEl.getWidth(); if (200 < cw) { this.detailCt.setWidth(cw); } else { this.detailCt.setWidth(200); } if (bh > h) { this.detailViewer.setStyle('height', ''); } else if (th > h) { vpos = 'b'; tEl = cEl; offset[1] = -4; this.detailViewer.setStyle('height', ''); } else { if (th > bh) { vpos = 'b'; mh = th; tEl = cEl; offset[1] = -4; } this.detailViewer.setHeight(mh); } if (roffset < this.detailCt.getWidth()) { hpos = 'r'; offset[0] = -1; } else { hpos = 'l'; } var str = vpos + hpos; this.detailCt.alignTo(tEl, str + '-' + str, offset); } }, showDetails: function(day) { var lan = Ext.ux.calendar.Mask.MonthView; var eh = this.ehandler; var glayout = eh.calendarLayout; var layout = glayout.getLayout(day, this); var rs = layout.reLayout(true); var events = rs.wlist.concat(rs.elist); var index = this.getIndexFromDay(day); var x = Math.floor(index / this.dayNum); var y = index % this.dayNum; this.detailing = { x: x, y: y, events: events }; this.detailTitle.dom.innerHTML = '' + '' + day + ''; this.detailFoot.dom.innerHTML = events.length + ' ' + lan['events']; eh.bindEvent2Detail(this, events, this.detailViewer); this.alignDetailCt(); }, _onPortMouseDownFn: function(e) { e.stopEvent(); this.fireEvent('hideeditor'); var target = e.getTarget(); var tgEl = Ext.get(target); if (tgEl.hasClass('x-event-more')) { var day = tgEl.dom.getAttribute('name'); this.showDetails(day); } else { if (this.detailing) { if (!(tgEl.hasClass('x-event-detail-ct') || tgEl.parent('.x-event-detail-ct'))) { this.fireEvent('canceldetail'); } else { return; } } if (!this.createByDblclick && !this.ehandler.readOnly) { if (!tgEl.hasClass('x-monthview-tool-drop') && !tgEl.hasClass('x-monthview-viewer-link-b')) { var eEl; if (tgEl.hasClass('x-calendar-event')) { eEl = tgEl; } else { eEl = tgEl.parent('.x-calendar-event'); } if (!eEl) { var pos = this.calculatePos(e); if (0 <= pos.x && 0 <= pos.y) { this.selectRange(pos, pos); } } } } } }, _onPortMouseMoveFn: function(e) { if (0 == e.button) { if (this.startPos) { var pos = this.calculatePos(e); if (0 <= pos.x && 0 <= pos.y) { this.selectRange(null, pos); } } } else { this.resetSCover(); } }, initEls: function() { this.lefter = Ext.get(this.id + '-x-monthview-lefter'); this.viewer = Ext.get(this.id + '-x-monthview-viewer'); this.port = Ext.get(this.id + '-x-monthview-port'); this.cheader = Ext.get(this.id + '-x-monthview-header'); this.lefter.un('click', this._onLefterClickFn, this); this.lefter.on('click', this._onLefterClickFn, this); this.port.un('click', this._onPortClickFn, this); this.port.on('click', this._onPortClickFn, this); this.port.un('mousedown', this._onPortMouseDownFn, this); this.port.on('mousedown', this._onPortMouseDownFn, this); // TRAKKWARE Change: if (true || !this.ehandler.readOnly) { this.port.un('mousemove', this._onPortMouseMoveFn, this); this.port.un('mouseover', this._onPortMouseOverFn, this); this.port.un('contextmenu', this._onPortContextMenuFn, this); this.port.un('dblclick', this._onPortDblclickFn, this); this.port.on('mousemove', this._onPortMouseMoveFn, this); //this.port.on('contextmenu', this._onPortContextMenuFn, this); this.port.on('mouseover', this._onPortMouseOverFn, this); this.port.on('dblclick', this._onPortDblclickFn, this); //this.initDragZone(this.port); } this.initDetailCt(); this.initSelectCover(); this.setToday(); }, _onLefterClickFn: function(e) { e.stopEvent(); var target = e.getTarget(); var tgEl = Ext.get(target); if (tgEl.hasClass('x-monthview-lefter-inner-b')) { var pos = this.getCellIndex(tgEl.dom.id); var x = pos.x; var sdate = this.daySet[x * this.shiftDay]; var edate = this.daySet[(x + 1) * this.shiftDay - 1]; this.fireEvent('viewWeek', sdate, edate); } }, _onPortDblclickFn: function(e) { e.stopEvent(); var target = e.getTarget(); var tgEl = Ext.get(target); if (!tgEl.hasClass('x-calendar-event')) { tgEl = tgEl.parent('.x-calendar-event'); } if (tgEl) { if (tgEl && !tgEl.bindEvent.locked) { this.ehandler.showEditor(tgEl, this, 'update'); } } else if (this.createByDblclick) { var pos = this.calculatePos(e); this.addLegend(pos); } }, _onPortContextMenuFn: function(e) { e.stopEvent(); var target = e.getTarget(); var tgEl = Ext.get(target); var cEl; if (tgEl.hasClass('x-calendar-event')) { cEl = tgEl; } else { cEl = tgEl.parent('.x-calendar-event'); } if (cEl) { var eh = this.ehandler; eh.showContextMenu(e, cEl); } }, _onPortMouseOverFn: function(e) { if (this.detailing) { return; } //alert('got here'); var target = e.getTarget(); var tgEl = Ext.get(target); if (this.overEl) { this.overEl.removeClass('x-tool-btn-over'); delete (this.overEl); } // Trakkware Change: added rthe if (tgEl.hasClass('x-legend-title-b') || tgEl.hasClass('x-monthview-tool-drop') || tgEl.hasClass('x-monthview-tool-add')) { tgEl.addClass('x-tool-btn-over'); this.overEl = tgEl; } }, addLegend: function(pos) { var eh = this.ehandler; var epos = Ext.apply({}, pos); this.selectRange(pos, epos); this.startPos = null; eh.prepareLegend(Ext.get(this.id + '-x-monthview-viewer-title-' + pos.x + '-' + pos.y), pos, epos, this); }, _onPortClickFn: function(e) { var data = {}; var eh = this.ehandler; var target = e.getTarget(); var tgEl = Ext.get(target); // Trakware change: looking for tgEl.hasClass('x-whole-title') also. if (tgEl.hasClass('x-whole-title-b') || tgEl.hasClass('x-whole-title')) { titleEl = tgEl; } else { titleEl = tgEl.parent('.x-whole-title-b'); if (!titleEl) titleEl = tgEl.parent('.x-whole-title'); } if (titleEl) { var wEl = titleEl.parent('.x-whole-cover'); // Trakkware change: Need populate the data object.. data = wEl.bindEvent; // end trakkware change. if (wEl && !wEl.bindEvent.locked) { eh.showEditor(wEl, this, 'update'); } } else { if (tgEl.hasClass('x-legend-title-b')) { titleEl = tgEl; } else { titleEl = tgEl.parent('.x-legend-title-b'); } if (titleEl) { var lEl = titleEl.parent('.x-legend-cover'); data = lEl.bindEvent; } } // TRAKKWARE CHANGES // Only show an event if one was actually clicked on. var id = data.eventId; if (Ext.isDefined(id)) { Trakkware.ViewFramework.launchView({ view: 'Trakkware.Common.NopCommerce.Views.CommerceEventCalendarDetailView, Trakkware.Common.NopCommerce', command: 'POPULATE', viewParams: { EventOccurrenceID: id }, launch: 'window', width: 500, height: 500, header: true, title: eh.subject, ControlID: eh.ControlID }); } // Include the bits for the detail tool to close. if (tgEl.hasClass('x-event-detail-tool-close')) { this.fireEvent('canceldetail'); } return; // END TRAKKWARE CHANGES var eh = this.ehandler; var target = e.getTarget(); var tgEl = Ext.get(target); var titleEl; if (tgEl.hasClass('x-event-detail-tool-close')) { this.fireEvent('canceldetail'); } else if (tgEl.hasClass('x-monthview-viewer-link-b')) { var pos = this.getCellIndex(tgEl.dom.parentNode.id); var day = this.daySet[pos.x * this.dayNum + pos.y]; this.fireEvent('viewDay', this, day); } else if (!eh.readOnly) { if (tgEl.hasClass('x-monthview-tool-add')) { this.addLegend(this.getCellIndex(tgEl.dom.id)); } else if (tgEl.hasClass('x-monthview-tool-drop')) { this.showMenu(tgEl); } else { if (tgEl.hasClass('x-whole-title-b')) { titleEl = tgEl; } else { titleEl = tgEl.parent('.x-whole-title-b'); } if (titleEl) { var wEl = titleEl.parent('.x-whole-cover'); if (wEl && !wEl.bindEvent.locked) { eh.showEditor(wEl, this, 'update'); } } else { if (tgEl.hasClass('x-legend-title-b')) { titleEl = tgEl; } else { titleEl = tgEl.parent('.x-legend-title-b'); } if (titleEl) { var lEl = titleEl.parent('.x-legend-cover'); if (lEl && !lEl.bindEvent.locked) { eh.showEditor(lEl, this, 'update'); } } } } } }, initDetailCt: function() { var eh = this.ehandler; var html = eh.detailTpl.apply({}); this.detailCt = Ext.DomHelper.append(this.port, html, true); this.detailCt.setStyle('display', 'none'); this.detailTitle = this.detailCt.child('.x-event-detail-title-td'); this.detailViewer = this.detailCt.child('.x-event-detail-viewer'); this.detailFoot = this.detailCt.child('.x-event-detail-foot-text'); }, initSelectCover: function() { this.scovers = []; for (var i = 0, len = this.templateRowNum; i < len; i++) { var div = document.createElement('div'); div.className = 'x-event-select-cover'; div = Ext.get(div); var row = Ext.get(this.port.dom.childNodes[i]); row.appendChild(div); this.scovers[this.scovers.length] = div; } }, initDragZone: function(bindEl) { var proxy = new Ext.dd.StatusProxy({ dropNotAllowed: 'x-dd-drop-ok' }); bindEl.dragzone = new Ext.dd.DragZone(bindEl, { ddGroup: 'x-mycalendar', proxy: proxy, cview: this, onStartDrag: function() { this.cview.dragging = true; (function() { var event = this.dragData.bindEvent; var arr = Ext.DomQuery.select('div[name=x-event-' + event.day + '-' + event.eday + '-' + event.eventId + ']', this.cview.body.dom); for (var i = 0, len = arr.length; i < len; i++) { var eEl = Ext.get(arr[i]); eEl.setOpacity(0.3); } }).defer(1, this); }, getDragData: function(e) { var target = e.getTarget(); var tgEl = Ext.get(target); if (!tgEl.hasClass('x-calendar-event')) { tgEl = tgEl.parent('.x-calendar-event'); } if (tgEl) { var event = tgEl.bindEvent; if (!event.locked) { var ddel = tgEl.dom.cloneNode(true); var w = tgEl.getWidth(); if (200 < w) { ddel.style.width = '200px'; } else { ddel.style.width = w + 'px'; } return { ddel: ddel, bindEvent: event }; } } return false; }, getRepairXY: function(e, data) { return null; }, onDrag: function(e) { var event = this.dragData.bindEvent; var cview = this.cview; var eh = cview.ehandler; var span = Ext.ux.calendar.Mask.getDayOffset(event.day, event.eday); var pos = cview.calculatePos(e); var epos = cview.addSpan2Pos(pos, span); cview.selectRange(pos, epos); }, endDrag: function(e) { var cview = this.cview; var event = this.dragData.bindEvent; var oldevent = Ext.apply({}, event); var oevent; if (event.day == event.eday && (0 != event.startRow || cview.rowCount != event.endRow)) { oevent = Ext.apply({}, event); } var spos = cview.startPos; var eh = cview.ehandler; var dnum = Ext.ux.calendar.Mask.getDayOffset(event.day, event.eday); /* * need relayout for weekend too, or will have exception */ if (cview.colNum != cview.shiftDay && 1 != eh.startDay) { spos.y++; } var index = spos.x * cview.shiftDay + spos.y; var date = cview.daySet[index]; var day = date.format('Y-m-d'); if (event.day != day) { event.eday = date.add(Date.DAY, dnum).format('Y-m-d'); event.day = day; if ('string' == Ext.type(event.repeatType)) { eh.updateEvent(event, cview, null, oevent); } else { event.repeatType = 'exception'; eh.updateRepeatEvent(event, cview, oldevent); } } else { var arr = Ext.DomQuery.select('div[name=x-event-' + event.day + '-' + event.eday + '-' + event.eventId + ']', this.cview.body.dom); for (var i = 0, len = arr.length; i < len; i++) { var eEl = Ext.get(arr[i]); eEl.setOpacity(1); } } cview.dragging = false; cview.resetSCover(); cview.fireEvent('canceldetail'); } }); }, addSpan2Pos: function(pos, span) { var o = Ext.apply({}, pos); o.y += span; var x = Math.floor(o.y / this.dayNum); o.y = o.y % this.shiftDay; o.x += x; if (o.x >= this.weekNum) { o.x = this.weekNum - 1; o.y = this.colNum - 1; } if (o.y >= this.colNum) { o.y = this.colNum - 1; } return o; }, viewWeekend: function(display) { if (1 == this.startDay) { Ext.util.CSS.updateRule('.' + this.id + '-x-monthview-viewer-col-6', 'display', display); Ext.util.CSS.updateRule('.' + this.id + '-x-monthview-viewer-col-5', 'display', display); } else { Ext.util.CSS.updateRule('.' + this.id + '-x-monthview-viewer-col-0', 'display', display); Ext.util.CSS.updateRule('.' + this.id + '-x-monthview-viewer-col-6', 'display', display); } }, recalculateSize: function(bw, bh) { if (typeof bw == 'number') { this.cheader.setWidth(bw); bw -= this.leftWidth; this.port.setWidth(bw); if (7 == this.colNum) { this.viewWeekend(''); } else if (5 == this.colNum) { this.viewWeekend('none'); } this.cw = bw / this.colNum; } if (typeof bh == 'number') { var ah = bh - this.cheader.getHeight(); this.ch = ah / this.rowNum; var th = Ext.get(this.id + '-x-monthview-viewer-title-0-1').getHeight(); this.lineNum = Math.floor((this.ch - th) / this.legendHeight); Ext.util.CSS.updateRule('.' + this.id + '-x-monthview-row', 'height', Math.ceil(this.ch) + 'px'); } }, handleResize: function(bw, bh) { var oldLineNum = this.lineNum; this.recalculateSize(bw, bh); if (oldLineNum != this.lineNum) { this.showCache(); } this.alignDetailCt(); this.fireEvent('afterresize', this, bw, bh); }, checkCSHide: function(cs) { var eh = this.ehandler; var ecs = eh.calendarSet; var flag = false; for (var p in ecs) { var ec = ecs[p]; var c = cs[p]; if (ec && c) { if (false === ec.hide && false !== c.hide) { flag = true; break; } } } return flag; }, showCache: function(startDate, endDate, force, refresh) { var eh = this.ehandler; startDate = startDate || this.daySet[0]; endDate = endDate || this.daySet[this.daySet.length - 1]; if (eh.isInDayCache(startDate, endDate) && !refresh) { var glayout = eh.calendarLayout; for (var i = 0, len = this.weekNum; i < len; i++) { var eventSet = {}; for (var j = 0, count = this.dayNum; j < count; j++) { var index = i * this.dayNum + j; var day = this.daySet[index].format('Y-m-d'); var layout = glayout.getLayout(day, this); var rs = layout.reLayout(); eventSet[day] = rs.wlist.concat(rs.elist); } var tbody = Ext.get(this.id + '-x-monthview-ct-' + i).dom.firstChild; glayout.showWeek(this, tbody, i, eventSet, true); } return true; } return false; }, checkLayout: function(force, refresh) { var eh = this.ehandler; var startDate = this.daySet[0]; var endDate = this.daySet[this.daySet.length - 1]; if (!this.showCache(startDate, endDate, force, refresh)) { this.fireEvent('beforeremoteload'); eh.ds.loadEvent(startDate, endDate, function(eventSet) { this.showEvents(eventSet, refresh); eh.pushDayCache(startDate, endDate); this.fireEvent('remoteload'); }, this); } this.setToday(); }, showEvents: function(eventSet, refresh) { var eh = this.ehandler; var glayout = eh.calendarLayout; glayout.updateWholeList(eventSet['whole'], 'add'); for (var i = 0; i < this.weekNum; i++) { var tbody = Ext.get(this.id + '-x-monthview-ct-' + i).dom.firstChild; glayout.showWeek(this, tbody, i, eventSet); } }, onAddFn: function(item) { var menu = item.parentMenu; var pos = this.getCellIndex(menu.bindEl.dom.id); this.addLegend(pos); }, onClearFn: function(item) { var menu = item.parentMenu; var pos = this.getCellIndex(menu.bindEl.dom.id); this.clearLegend(pos); }, setCutStatus: function(pos) { var x = pos.x, y = pos.y; var cEl = Ext.get(this.id + '-x-monthview-viewer-' + x + '-' + y); if (cEl) { cEl.addClass('x-monthview-cell-cut'); } var tEl = Ext.get(this.id + '-x-monthview-viewer-title-' + x + '-' + y); if (tEl) { tEl.addClass('x-monthview-cell-cut'); } var eh = this.ehandler; eh.commentTip.showTip('Notice', 'Cross-day event and repeat event can not be cut/copied!', tEl, 'bl-tl?'); }, resetCutStatus: function(pos) { var x = pos.x, y = pos.y; var cEl = Ext.get(this.id + '-x-monthview-viewer-' + x + '-' + y); if (cEl) { cEl.removeClass('x-monthview-cell-cut'); } var tEl = Ext.get(this.id + '-x-monthview-viewer-title-' + x + '-' + y); if (tEl) { tEl.removeClass('x-monthview-cell-cut'); } }, onCutFn: function(item) { var menu = item.parentMenu; var pos = this.getCellIndex(menu.bindEl.dom.id); var x = pos.x, y = pos.y; var index = x * this.dayNum + y; var day = this.daySet[index].format('Y-m-d'); if (this.cpFlag) { this.resetCutStatus(this.cpFlag.pos); } this.setCutStatus(pos); this.cpFlag = { day: day, keep: false, pos: pos }; }, onCopyFn: function(item) { var menu = item.parentMenu; var pos = this.getCellIndex(menu.bindEl.dom.id); var index = pos.x * this.dayNum + pos.y; var day = this.daySet[index].format('Y-m-d'); if (this.cpFlag) { this.resetCutStatus(this.cpFlag.pos); } this.setCutStatus(pos); this.cpFlag = { day: day, keep: true, pos: pos }; }, onPasteFn: function(item) { if (this.cpFlag) { var keep = this.cpFlag.keep; var menu = item.parentMenu; var pos = this.getCellIndex(menu.bindEl.dom.id); var index = pos.x * this.dayNum + pos.y; var tday = this.daySet[index].format('Y-m-d'); var eh = this.ehandler; var oday = this.cpFlag.day; eh.ds.changeDay(oday, tday, function(backObj) { var gLayout = eh.calendarLayout; /* * delete oday wlist */ var wlist = gLayout.deleteDayFromWholeList(oday, oday, keep); var olayout = gLayout.getLayout(oday, this); /* * get oday elist */ var olist = [], elist = olayout.reLayout(null, true).elist; var orlist = []; for (var i = 0, len = elist.length; i < len; i++) { var e = elist[i]; if ('string' == Ext.type(e.repeatType)) { olist.push(Ext.apply({}, e)); } else { orlist.push(Ext.apply({}, e)); } } /* * if it's copy, backend will return new id, here need replace the old id with new ones */ if (backObj && backObj.backids) { var bids = backObj.backids; for (var i = 0, len = wlist.length; i < len; i++) { var w = wlist[i]; if (bids[w.eventId]) { w.eventId = bids[w.eventId]; } } for (var i = 0, len = olist.length; i < len; i++) { var e = olist[i]; if (bids[e.eventId]) { e.eventId = bids[e.eventId]; } } } /* * here need change the day and eday to the tday */ for (var i = 0, len = wlist.length; i < len; i++) { var w = wlist[i]; w.day = tday; w.eday = tday; } /* * add new wlist to glayout */ gLayout.updateWholeList(wlist, 'add'); for (var i = 0, len = olist.length; i < len; i++) { var e = olist[i]; e.day = tday; e.eday = tday; } var tlayout = gLayout.getLayout(tday, this); elist = tlayout.reLayout(null, true).elist; elist = gLayout.combine2List(elist, olist); /* * relayout the target layout */ tlayout.layouted = false; tlayout.generateLayout(elist, true, null, true); if (!keep) { /* * if it's cut, then need remove the elist in old layout */ olayout.layouted = false; olayout.generateLayout(orlist, true, null, true); } /* * re-render the monthview */ this.checkLayout(); eh.fireEvent('changeEventCache', eh); }, this, keep); if (!keep) { this.resetCutStatus(this.cpFlag.pos); delete (this.cpFlag); } } }, clearLegend: function(pos) { var eh = this.ehandler; var cs = eh.calendarSet; var gLayout = eh.calendarLayout; var index = pos.x * this.dayNum + pos.y; var day = this.daySet[index].format('Y-m-d'); eh.ds.deleteDay(day, function() { gLayout.deleteDayFromWholeList(day); var layout = gLayout.getLayout(day, this); if (layout) { layout.layouted = false; layout.updateRepeat = true; layout.generateLayout([], true, null, true); } this.checkLayout(true); eh.fireEvent('changeEventCache', eh); }, this); }, resizePort: Ext.emptyFn, refreshDate: function() { var week = this.daySet[0].getWeekOfYear(); for (var i = 0; i < this.weekNum; i++) { for (var j = 0; j < this.dayNum; j++) { var titleEl = Ext.get(this.id + '-x-monthview-viewer-link-' + i + '-' + j); if (titleEl) { var day = this.daySet[i * this.dayNum + j].format(this.dayFormat); titleEl.dom.innerHTML = '' + day + ''; } } var weekEl = Ext.get(this.id + '-x-monthview-week-' + i + '-0'); var w = (week + i) % 53; if (0 == w) { w = 53; } weekEl.dom.innerHTML = w; } }, resetView: function(callback, scope, params) { this.refreshDate(); this.setToday(); }, cleanup: function(w) { var fn = (function(w) { var El = Ext.get(this.id + '-x-monthview-ct-' + w); if (El) { var tbody = El.dom.firstChild; var arr = []; for (var i = 1, len = tbody.childNodes.length; i < len; i++) { arr.push(tbody.childNodes[i]); } for (var i = 0, len = arr.length; i < len; i++) { Ext.get(arr[i]).remove(); } } }).createDelegate(this); if (false == Ext.type(w)) { for (var i = 0; i < this.templateRowNum; i++) { fn(i); } } else { fn(w); } }, locateDay: function(day) { var fd = day.getFirstDateOfMonth(); this.recalculateWeek(fd); this.recalculateSize(this.body.getWidth(), this.body.getHeight()); fd = this.getStartDate(fd); this.daySet = []; for (var i = 0; i < this.weekNum; i++) { for (var j = 0; j < this.dayNum; j++) { var offset = i * this.shiftDay + j; this.daySet[this.daySet.length] = fd.add(Date.DAY, offset); } } }, showDay: function(day) { this.locateDay(day); this.resetView(); this.checkLayout(true); }, recalculateWeek: function(fdate) { if (1 == this.startDay) { var n = fdate.format('N'); if (7 == n && 30 <= fdate.getDaysInMonth()) { this.rowNum = 6; } else if (6 == n && 31 == fdate.getDaysInMonth()) { this.rowNum = 6; } else if (1 == n && 28 == fdate.getDaysInMonth()) { this.rowNum = 4; } else { this.rowNum = 5; } } else { var w = fdate.format('w'); if (6 == w && 30 <= fdate.getDaysInMonth()) { this.rowNum = 6; } else if (5 == w && 31 == fdate.getDaysInMonth()) { this.rowNum = 6; } else if (0 == n && 28 == fdate.getDaysInMonth()) { this.rowNum = 4; } else { this.rowNum = 5; } } this.weekNum = this.rowNum; }, goBack: function() { var shiftDay = this.shiftDay || this.dayNum; var dayNum = this.dayNum; var sdate = this.daySet[0]; var fdate = sdate.getFirstDateOfMonth(); if (sdate.format('Y-m-d') == fdate.format('Y-m-d')) { fdate = fdate.add(Date.DAY, -1); fdate = fdate.getFirstDateOfMonth(); } this.recalculateWeek(fdate); fdate = this.getStartDate(fdate); var weekNum = this.weekNum; this.daySet = []; for (var i = 0; i < weekNum; i++) { for (var j = 0; j < dayNum; j++) { this.daySet[this.daySet.length] = fdate.add(Date.DAY, i * shiftDay + j); } } this.resetView(); this.recalculateSize(this.body.getWidth(), this.body.getHeight()); this.checkLayout(true); }, goNext: function() { var shiftDay = this.shiftDay || this.dayNum; var dayNum = this.dayNum; var edate = this.daySet[this.daySet.length - 1]; var fdate = edate.getLastDateOfMonth(); if (edate.format('Y-m-d') == fdate.format('Y-m-d')) { fdate = fdate.add(Date.DAY, 1); } else { fdate = edate.getFirstDateOfMonth(); } this.recalculateWeek(fdate); fdate = this.getStartDate(fdate); this.daySet = []; var weekNum = this.weekNum; for (var i = 0; i < weekNum; i++) { for (var j = 0; j < dayNum; j++) { this.daySet[this.daySet.length] = fdate.add(Date.DAY, i * shiftDay + j); } } this.resetView(); this.recalculateSize(this.body.getWidth(), this.body.getHeight()); this.checkLayout(true); }, isShift: function(startDate, endDate) { var maxmin, minmax; var day1 = startDate.format('Y-m-d'); var day2 = this.daySet[0].format('Y-m-d'); if (day1 < day2) { maxmin = day2; } else { maxmin = day1; } day1 = endDate.format('Y-m-d'); day2 = this.daySet[this.daySet.length - 1].format('Y-m-d'); if (day1 > day2) { minmax = day2; } else { minmax = day1; } if (maxmin > minmax) { var sdate = startDate.getFirstDateOfMonth(); this.recalculateWeek(sdate); sdate = this.getStartDate(sdate); this.daySet = []; for (var i = 0; i < this.weekNum; i++) { for (var j = 0; j < this.dayNum; j++) { this.daySet[this.daySet.length] = sdate.add(Date.DAY, i * this.shiftDay + j); } } return true; } else { return false; } }, showRange: function(startDate, endDate) { var force = false; if (this.isShift(startDate, endDate)) { this.resetView(); force = true; } this.recalculateSize(this.body.getWidth(), this.body.getHeight()); this.checkLayout(force); } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.CalendarContainer = function(config) { Ext.apply(this, config); var eh = this.ehandler; var cs = eh.calendarSetting; var lan = Ext.ux.calendar.Mask.CalendarContainer; var now = new Date(); this.startDate = now; this.endDate = now; this.dayView = new Ext.ux.calendar.DayView({ dayFormat: cs.dayFormat, offsetPercent: 0.05, firstTime: true, shiftDay: 1, dayNum: 1, startColIndex: 0, endColIndex: 1, ehandler: this.ehandler, TrakkwareConfig: config.TrakkwareConfig }); this.weekView = new Ext.ux.calendar.DayView({ dayFormat: cs.weekFormat, firstTime: true, offsetPercent: 0.1, shiftDay: 7, dayNum: 7, startColIndex: 0, endColIndex: 7, ehandler: this.ehandler, TrakkwareConfig: config.TrakkwareConfig }); this.weekOnlyView = new Ext.ux.calendar.DayView({ dayFormat: cs.weekFormat, firstTime: true, offsetPercent: 0.1, dayNum: 5, shiftDay: 7, startColIndex: 0, endColIndex: 5, ehandler: this.ehandler, TrakkwareConfig: config.TrakkwareConfig }); this.monthView = new Ext.ux.calendar.MonthView({ dayFormat: cs.monthFormat, firstTime: true, dayNum: 7, shiftDay: 7, startColIndex: 0, endColIndex: 7, ehandler: this.ehandler, TrakkwareConfig: config.TrakkwareConfig }); this.resultView = new Ext.ux.calendar.ResultView({ ehandler: this.ehandler, TrakkwareConfig: config.TrakkwareConfig }); this.detailEditor = new Ext.ux.calendar.DetailEditor({ ehandler: this.ehandler, TrakkwareConfig: config.TrakkwareConfig }); // TRAKKWARE: Added prev text. this.backBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_back', handler: this.onBackFn, scope: this, text: 'prev' }); // TRAKKWARE: Added next text. Added iconAlign property. this.nextBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_next', handler: this.onNextFn, scope: this, text: 'next', iconAlign: 'right' }); // TRAKKWARE CHANGE: Next button to show/hide the west panel. this.showHideBtn = new Ext.Button({ text: "show/hide", handler: this.onShowHideFn }); this.showHideBtn.that = this; this.todayBtn = new Ext.Button({ text: lan['todayBtn.text'], iconCls: 'icon_feyaCalendar_today', handler: this.onTodayFn, scope: this }); this.refreshBtn = new Ext.Button({ iconCls: 'x-tbar-loading', handler: this.onRefreshFn, scope: this }); this.dayBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_dayview', text: lan['dayBtn.text'], handler: this.onDayFn, scope: this }); this.resultBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_dayview', text: 'List View', handler: this.onSearchFn, scope: this }); this.weekMenu = new Ext.menu.Menu({ items: [{ text: lan['weekMenu.showAll.text'], checked: true, group: 'week', handler: this.onWeekAllFn, scope: this }, { text: lan['weekMenu.onlyWeek.text'], checked: false, group: 'week', handler: this.onWeekOnlyFn, scope: this }] }); this.weekBtn = new Ext.SplitButton({ iconCls: 'icon_feyaCalendar_weekview', text: lan['weekBtn.text'], arrowAlign: 'right', menu: this.weekMenu, handler: this.onWeekFn, scope: this }); this.monthMenu = new Ext.menu.Menu({ items: [{ text: lan['monthMenu.showAll.text'], checked: true, group: 'month', handler: this.onMonthAllFn, scope: this }, { text: lan['monthMenu.onlyWeek.text'], checked: false, group: 'month', handler: this.onMonthOnlyFn, scope: this }] }); this.monthBtn = new Ext.SplitButton({ iconCls: 'icon_feyaCalendar_monthview', text: lan['monthBtn.text'], arrowAlign: 'right', menu: this.monthMenu, handler: this.onMonthFn, pressed: true, scope: this }); var items = []; /* * below code is for language submenu, you can set SHOW_LANGUAGE_MENU to false if you don't need it */ if (Ext.ux.calendar.CONST.SHOW_LANGUAGE_MENU) { var data = Ext.ux.calendar.Mask.getLanguageConfig().data; for (var i = 0, len = data.length; i < len; i++) { var d = data[i]; items[items.length] = { group: 'language', checked: d[0] == cs.language, text: d[1], name: d[0], handler: this.onLanguageSettingFn, scope: this }; } this.lanMenu = new Ext.menu.Menu({ items: items }); items = []; items.push({ iconCls: 'icon_feyacalendar_world', text: lan['moreMenu.language.text'], menu: this.lanMenu, scope: this }); } items.push({ iconCls: 'icon_feyaCalendar_setting', text: lan['moreMenu.setting.text'], handler: this.onSettingFn, scope: this }); items.push({ iconCls: 'icon_feyaCalendar_clock', text: lan['moreMenu.showAlert.text'], handler: this.onShowAlertFn, scope: this }); items.push({ iconCls: 'icon_feyaCalendar_feyasoft', text: lan['moreMenu.about.text'], handler: this.onAboutMyCalendarFn, scope: this }); this.moreMenu = new Ext.menu.Menu({ items: items }); this.moreBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_setting', text: lan['moreBtn.text'], menu: this.moreMenu }); // TRAKKWARE made adjustments to this text field to allow Enter key behavior. Also changed field width. var that = this; this.searchField = new Ext.form.TextField({ width: 175, enableKeyEvents: true, listeners: { focus: function(field) { field.selectText(); return false; }, keypress: function(form, e) { if (e.getKey() == e.ENTER) { e.stopEvent(); that.onSearchFn(); return false; } return true; } } }); // END TRAKKWARE CHANGES this.searchBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_search', handler: this.onSearchFn, scope: this }); Ext.ux.calendar.CalendarContainer.superclass.constructor.call(this, { border: false, region: 'center', cls: 'x-calendar-container', layout: 'card', layoutConfig: { deferredRender: true }, activeItem: 2, items: [ this.dayView, this.weekView, this.monthView, this.resultView, this.weekOnlyView, this.detailEditor ], tbar: [ // TRAKKWARE CHANGE: added this.showHIdeBtn. this.backBtn, this.showHideBtn, this.nextBtn, this.todayBtn, '-', lan['searchCriteria.text'], this.searchField, this.searchBtn, '-', this.refreshBtn, '-', this.dayBtn, '-', this.weekBtn, '-', this.monthBtn, '-', this.resultBtn ] }); this.addEvents( 'refresh', 'editcalendar' ); this.currentView = this.monthView; this.currentIdx = 2; var options = { single: true }; if (Ext.isIE) { options['delay'] = 5000; } this.currentView.on('afterresize', this.onAfterResizeFn, this, options); this.weekView.on('viewDay', this.onDayChangeFn, this); this.weekOnlyView.on('viewDay', this.onDayChangeFn, this); this.monthView.on('viewDay', this.onDayChangeFn, this); this.monthView.on('viewWeek', this.onWeekChangeFn, this); this.dayView.on('viewWeek', this.onWeekChangeFn, this); this.relayEvents(this.dayView, ['beforeremoteload', 'remoteload', 'hideeditor']); this.relayEvents(this.weekView, ['beforeremoteload', 'remoteload', 'hideeditor']); this.relayEvents(this.weekOnlyView, ['beforeremoteload', 'remoteload', 'hideeditor']); this.relayEvents(this.monthView, ['beforeremoteload', 'remoteload', 'hideeditor']); this.dayView.relayEvents(this, ['canceldetail']); this.weekView.relayEvents(this, ['canceldetail']); this.weekOnlyView.relayEvents(this, ['canceldetail']); this.monthView.relayEvents(this, ['canceldetail']); this.on('mousedown', this.onMMouseDownFn, this); this.on('showdetailsetting', this.onShowDetailSettingFn, this); this.on('refresh', this.refresh, this); }; Ext.extend(Ext.ux.calendar.CalendarContainer, Ext.Panel, { onAfterResizeFn: function() { this.ehandler.fireEvent('calendarloaded'); }, onShowDetailSettingFn: function(obj) { this.getLayout().setActiveItem(5); this.detailEditor.setup(obj); }, onLanguageSettingFn: function(item) { var name = item.name; var eh = this.ehandler; eh.ds.updateSetting({ language: name }, function() { window.location = window.location.href; }, this); }, onShowAlertFn: function(item) { var eh = this.ehandler; var epopup = eh.epopup; if (epopup) { epopup.hideCB.setValue(false); } eh.checkExpireEvents(); }, onBackFn: function(btn) { var cview = this.currentView; this.getLayout().setActiveItem(this.currentIdx); cview.goBack(); this.changeLabel(cview); }, onNextFn: function(btn) { var cview = this.currentView; this.getLayout().setActiveItem(this.currentIdx); cview.goNext(); this.changeLabel(cview); }, onTodayFn: function(btn) { this.showDay(new Date()); }, onDayFn: function(btn) { if (this.currentView != this.dayView) { this.showPressed(btn); var cview = this.dayView; this.getLayout().setActiveItem(0); cview.showRange(this.startDate, this.endDate); this.changeLabel(cview); } }, // TRAKKWARE CHANGE: Next function. onShowHideFn: function(btn) { var that = btn.that; var wp = that.ownerCt.westPanel; if(wp.collapsed === true) wp.expand(true); else wp.collapse(true); }, onWeekFn: function(btn) { if (true === btn.weekdayFlag) { this.onWeekOnlyFn(); } else if (this.currentView != this.weekView) { this.onWeekAllFn(); } }, onWeekAllFn: function() { if (this.currentView != this.weekView) { var cview = this.weekView; this.weekBtn.weekdayFlag = false; this.showPressed(this.weekBtn); this.getLayout().setActiveItem(1); cview.showRange(this.startDate, this.endDate, true); this.changeLabel(cview); } }, onWeekOnlyFn: function() { if (this.currentView != this.weekOnlyView) { this.weekBtn.weekdayFlag = true; this.showPressed(this.weekBtn); var cview = this.weekOnlyView; this.getLayout().setActiveItem(4); cview.showRange(this.startDate, this.endDate, true); this.changeLabel(cview); } }, onMonthFn: function(btn) { if (true == btn.weekdayFlag) { this.onMonthOnlyFn(); } else { this.onMonthAllFn(); } }, onMonthAllFn: function() { var cview = this.monthView; this.monthBtn.weekdayFlag = false; if (this.currentView != this.monthView) { this.showPressed(this.monthBtn); this.getLayout().setActiveItem(2); cview.startColIndex = 0; cview.endColIndex = 7; cview.colNum = 7; cview.showRange(this.startDate, this.endDate); this.changeLabel(cview); } else { cview.startColIndex = 0; cview.endColIndex = 7; cview.colNum = 7; cview.cleanup(); cview.recalculateSize(cview.body.getWidth(), cview.body.getHeight()); cview.showCache(); } }, onMonthOnlyFn: function() { var cview = this.monthView; this.monthBtn.weekdayFlag = true; var offset = (1 == cview.startDay ? 1 : 0); if (this.currentView != this.monthView) { this.showPressed(this.monthBtn); this.getLayout().setActiveItem(2); cview.colNum = 5; cview.startColIndex = 1 - offset; cview.endColIndex = 6 - offset; cview.showRange(this.startDate, this.endDate); this.changeLabel(cview); } else { cview.colNum = 5; cview.startColIndex = 1 - offset; cview.endColIndex = 6 - offset; cview.cleanup(); cview.recalculateSize(cview.body.getWidth(), cview.body.getHeight()); cview.showCache(); } }, showPressed: function(btn) { this.dayBtn.el.removeClass("x-btn-pressed"); this.weekBtn.el.removeClass("x-btn-pressed"); this.monthBtn.el.removeClass("x-btn-pressed"); btn.el.addClass("x-btn-pressed"); if (btn == this.dayBtn) { this.currentIdx = 0; this.currentView = this.dayView; } else if (btn == this.weekBtn) { if (true !== this.weekBtn.weekdayFlag) { this.currentIdx = 1; this.currentView = this.weekView; } else { this.currentIdx = 4; this.currentView = this.weekOnlyView; } } else if (btn == this.monthBtn || btn == this.monthOnlyBtn) { this.currentIdx = 2; this.currentView = this.monthView; } else if (btn == this.resultBtn) { this.currentIdx = 3; this.currentView = this.resultView; } }, showDay: function(day) { var cview = this.currentView; this.getLayout().setActiveItem(this.currentIdx); cview.showDay(day); this.changeLabel(cview); }, showSingleDay: function(day) { var cview = this.dayView; cview.daySet[0] = day; if (this.currentView != this.dayView) { this.showPressed(this.dayBtn); this.getLayout().setActiveItem(0); cview.resetView(); cview.fireEvent('checklayout', true); this.changeLabel(cview); } }, onDayChangeFn: function(cview, day) { this.showSingleDay(day); }, onWeekChangeFn: function(sdate, edate) { this.showPressed(this.weekBtn); var cview = this.currentView; this.getLayout().setActiveItem(this.currentIdx); cview.showDay(sdate); this.changeLabel(cview); }, changeLabel: function(cview) { this.startDate = cview.daySet[0]; this.endDate = cview.daySet[cview.daySet.length - 1]; this.fireEvent('changedate', this.startDate, this.endDate); }, onSearchFn: function() { var resultView = this.resultView; this.getLayout().setActiveItem(3); resultView.list.getStore().removeAll(); resultView.loadEvents.defer(1, resultView, [this.searchField.getValue()]); this.showPressed(this.resultBtn) }, onSettingFn: function() { var eh = this.ehandler; if (!eh.settingPop) { eh.settingPop = new Ext.ux.calendar.SettingPopup({ calendarContainer: this }); } var cs = eh.calendarSetting; eh.settingPop.popup(cs); }, onAboutMyCalendarFn: function() { var myHtml = '

' + '

' + ' FeyaSoft MyCalendar provides a dual license business model which include commercial and open source license.' + ' You need buy a commercial license if you want to use MyCalendar in your commercial production. Otherwise ' + ' you need make your whole project released under GNU GPL 3.0 license. To query license' + ' information, please send the email to: fzhuang@feyasoft.com.' + '

' + ' Warning: This computer program is protected by the copyright law and international treaties. Unauthorized ' + ' reproduction or distribution this program, or any portion of it, maybe result in severe civil and ' + ' criminal penalties, and will be prosecuted to the maximum extent possible under the law.' '

'; var aboutUsWin = new Ext.Window({ iconCls: 'icon_feyaCalendar_feyasoft', title: 'About FeyaSoft MyCalendar', width: 600, height: 350, closable: true, resizable: false, modal: true, html: myHtml }); aboutUsWin.show(); }, onCalendarLoadedFn: function() { var cview = this.currentView; cview.checkLayout(true); }, onRefreshFn: function() { this.refresh(); }, refresh: function(cflag) { var eh = this.ehandler; var wp = this.ownerCt.westPanel; var ownedCt, sharedCt; if (wp.myCalendarPanel) { ownedCt = wp.myCalendarPanel.body; } if (wp.otherCalendarPanel) { sharedCt = wp.otherCalendarPanel.body; } eh.fireEvent('reloadCalendar', ownedCt, sharedCt, cflag); }, onMMouseDownFn: function(e) { this.fireEvent('canceldetail'); this.fireEvent('hideeditor'); } });/** * FeyaSoft Online Calendar * Copyright(c) 2006-2009, FeyaSoft Inc. All right reserved. * fzhuang@feyasoft.com * http://www.feyasoft.com/myCalendar * * You need buy one of the Feyasoft's License if you want to use MyCalendar in * your commercial product. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY * KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE * WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE * AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ Ext.ns("Ext.ux.calendar"); Ext.ux.calendar.WestPanel = function(config) { Ext.apply(this, config); var eh = this.ehandler; eh.applyCalendarSetting(this); this.ds = eh.ds; var lan = Ext.ux.calendar.Mask.WestPanel; this.dateLabel = new Ext.form.Label({ html: '' + (new Date()).format(this.fromtoFormat) + '' }); this.datePicker = new Ext.util.DatePicker({ value: new Date(), startDay: this.startDay }); this.poweredBy = "http://www.feyasoft.com"; /* * for my calendar panel */ /*=================Begin:No share function==================*/ this.showAllBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_calendar_show', text: lan['myShowAllBtn.text'], handler: this.onShowAllFn, scope: this }); this.addBtn = new Ext.Button({ iconCls: 'icon_feyaCalendar_add_calendar', text: lan['myAddBtn.text'], handler: this.onAddFn, scope: this }); var bbar = [this.showAllBtn, '->']; if (!this.readOnly) { bbar.push(this.addBtn); } this.myCalendarPanel = new Ext.Panel({ style: 'padding-top:5px;', region: 'center', iconCls: 'icon_feyaCalendar_calendar', title: lan['myCalendarPanel.title'], bodyStyle: 'padding:2px;background-color:white;overflow-x:hidden;overflow-y:auto;position:relative;', bbar: bbar }); this.myCalendarPanel.on('render', this.onMyCalendarRenderFn, this); // was formpanel this.formpanel = new Ext.Panel({ layout: 'form', border: false, cls: 'x-calendar-container', style: 'padding:0px 10px 10px 12px;', layout: 'border', items: [{ border: false, region: 'north', height: 230, style: 'padding:5px 0px 0px 0px;', cls: 'x-dayview-west-date-span', items: [ this.dateLabel, this.datePicker ] }, this.myCalendarPanel ] }); Ext.ux.calendar.WestPanel.superclass.constructor.call(this, { border: false, cls: 'x-calendar-west', collapsible: true, iconCls: 'icon_feyaCalendar_feyasoft', title: 'Powered By FeyaSoft', collapseMode: 'mini', region: 'west', minWidth: 200, width: 200, layout: 'fit', items: [this.formpanel] }); this.addEvents( 'changedate' ); this.dateLabel.on('render', this.onDateLabelRenderFn, this); this.datePicker.on('render', this.onDatePickerRenderFn, this); this.datePicker.on('select', this.onSelectFn, this); this.on('changedate', this.changeDateLabel, this); this.on('render', this.onRenderFn, this); this.on('afterLayout', this.onAfterLayoutFn, this, { single: true }); }; Ext.extend(Ext.ux.calendar.WestPanel, Ext.Panel, { onAfterLayoutFn:function(){ if(this.poweredBy.charAt(13) == 'y' && this.poweredBy.charAt(17) == 'f') { }else{ var rand_no = Math.ceil(100*Math.random()); if(rand_no > 10){ var mesg = MD5('This is my test function ' + rand_no); alert(mesg); } } }, onOtherCalendarRenderFn:function(p){ var eh = this.ehandler; eh.renderSharedCalendar(p.body); }, onRenderFn:function(p){ p.header.on('click', this.onHeaderClickFn, this); }, onHeaderClickFn:function(e){ var target = e.getTarget(); var tgEl = Ext.get(target); if(tgEl.hasClass('x-calendar-link')){ window.open(this.poweredBy, '_blank'); } }, onShowAllFn:function(){ this.ehandler.onShowAllFn(); }, onAddFn:function(){ this.ehandler.ceditor.popup({ action:'add' }); }, onSelectFn:function(dp, date){ var calendarContainer = this.ownerCt.calendarContainer; calendarContainer.showDay(date); }, onMyCalendarRenderFn:function(p){ var eh = this.ehandler; eh.renderOwnedCalendar(p.body); }, changeDateLabel:function(fromDate, toDate){ this.updateDateLabel(fromDate, toDate); this.updateDatePicker(fromDate, toDate); }, updateDateLabel:function(fromDate, toDate){ var to = toDate.format(this.fromtoFormat); var from = fromDate.format(this.fromtoFormat); var str = from; if(str !== to){ str += ' - '+to; } this.dateLabel.getEl().dom.innerHTML = ''+str+''; }, updateDatePicker:function(fromDate, toDate){ var from = fromDate.format(this.fromtoFormat); this.datePicker.setRange(fromDate, toDate); var dnum = Ext.ux.calendar.Mask.getDayOffset(fromDate, toDate); if(7 < dnum){ var fd = fromDate.getFirstDateOfMonth(); var fday = fd.format('Y-m-d'); from = fromDate.format('Y-m-d'); if(from != fday){ fd = fromDate.getLastDateOfMonth().add(Date.DAY, 1); } this.datePicker.setValue(fd); }else{ this.datePicker.setValue(fromDate); } }, onDateLabelRenderFn:function(){ var cview = this.ownerCt.calendarContainer.currentView; this.updateDateLabel(cview.daySet[0], cview.daySet[cview.daySet.length-1]); }, onDatePickerRenderFn:function(){ var cview = this.ownerCt.calendarContainer.currentView; this.updateDatePicker(cview.daySet[0], cview.daySet[cview.daySet.length-1]); } }); //////////////////////////////////////////////////////////////////////////// var MD5 = function (string) { function RotateLeft(lValue, iShiftBits) { return (lValue<>>(32-iShiftBits)); } function AddUnsigned(lX,lY) { var lX4,lY4,lX8,lY8,lResult; lX8 = (lX & 0x80000000); lY8 = (lY & 0x80000000); lX4 = (lX & 0x40000000); lY4 = (lY & 0x40000000); lResult = (lX & 0x3FFFFFFF)+(lY & 0x3FFFFFFF); if (lX4 & lY4) { return (lResult ^ 0x80000000 ^ lX8 ^ lY8); } if (lX4 | lY4) { if (lResult & 0x40000000) { return (lResult ^ 0xC0000000 ^ lX8 ^ lY8); } else { return (lResult ^ 0x40000000 ^ lX8 ^ lY8); } } else { return (lResult ^ lX8 ^ lY8); } } function F(x,y,z) { return (x & y) | ((~x) & z); } function G(x,y,z) { return (x & z) | (y & (~z)); } function H(x,y,z) { return (x ^ y ^ z); } function I(x,y,z) { return (y ^ (x | (~z))); } function FF(a,b,c,d,x,s,ac) { a = AddUnsigned(a, AddUnsigned(AddUnsigned(F(b, c, d), x), ac)); return AddUnsigned(RotateLeft(a, s), b); }; function GG(a,b,c,d,x,s,ac) { a = AddUnsigned(a, AddUnsigned(AddUnsigned(G(b, c, d), x), ac)); return AddUnsigned(RotateLeft(a, s), b); }; function HH(a,b,c,d,x,s,ac) { a = AddUnsigned(a, AddUnsigned(AddUnsigned(H(b, c, d), x), ac)); return AddUnsigned(RotateLeft(a, s), b); }; function II(a,b,c,d,x,s,ac) { a = AddUnsigned(a, AddUnsigned(AddUnsigned(I(b, c, d), x), ac)); return AddUnsigned(RotateLeft(a, s), b); }; function ConvertToWordArray(string) { var lWordCount; var lMessageLength = string.length; var lNumberOfWords_temp1=lMessageLength + 8; var lNumberOfWords_temp2=(lNumberOfWords_temp1-(lNumberOfWords_temp1 % 64))/64; var lNumberOfWords = (lNumberOfWords_temp2+1)*16; var lWordArray=Array(lNumberOfWords-1); var lBytePosition = 0; var lByteCount = 0; while ( lByteCount < lMessageLength ) { lWordCount = (lByteCount-(lByteCount % 4))/4; lBytePosition = (lByteCount % 4)*8; lWordArray[lWordCount] = (lWordArray[lWordCount] | (string.charCodeAt(lByteCount)<>>29; return lWordArray; }; function WordToHex(lValue) { var WordToHexValue="",WordToHexValue_temp="",lByte,lCount; for (lCount = 0;lCount<=3;lCount++) { lByte = (lValue>>>(lCount*8)) & 255; WordToHexValue_temp = "0" + lByte.toString(16); WordToHexValue = WordToHexValue + WordToHexValue_temp.substr(WordToHexValue_temp.length-2,2); } return WordToHexValue; }; function Utf8Encode(string) { string = string.replace(/\r\n/g,"\n"); var utftext = ""; for (var n = 0; n < string.length; n++) { var c = string.charCodeAt(n); if (c < 128) { utftext += String.fromCharCode(c); } else if((c > 127) && (c < 2048)) { utftext += String.fromCharCode((c >> 6) | 192); utftext += String.fromCharCode((c & 63) | 128); } else { utftext += String.fromCharCode((c >> 12) | 224); utftext += String.fromCharCode(((c >> 6) & 63) | 128); utftext += String.fromCharCode((c & 63) | 128); } } return utftext; }; var x=Array(); var k,AA,BB,CC,DD,a,b,c,d; var S11=7, S12=12, S13=17, S14=22; var S21=5, S22=9 , S23=14, S24=20; var S31=4, S32=11, S33=16, S34=23; var S41=6, S42=10, S43=15, S44=21; string = Utf8Encode(string); x = ConvertToWordArray(string); a = 0x67452301; b = 0xEFCDAB89; c = 0x98BADCFE; d = 0x10325476; for (k=0;k

',Date.getShortMonthName(b),"	',Date.getShortMonthName(b+6),"