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. //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) { 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) { if(Ext.isFunction(failureCallback)) failureCallback(); Ext.Msg.alert('HTTP error','An unknown Http error occured when I tried to launch this view. Are you still connected to the web?'); } }); } }, // 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) { if(Ext.isFunction(failure_callback)) failure_callback(); Ext.Msg.alert('HTTP error','An unknown Http error occured when I tried to commit a transaction. Are you still connected to the web?'); } }); } 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 }); }, failureCallback: function(response) { alert('nothing happening in this failure callback.'); } }); } 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('reloadview'); } // 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) { }, // // 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) { if(Ext.isFunction(failureCallback)) failureCallback(); Ext.Msg.alert('HTTP error','An unknown Http error occured when I tried to launch this view. Are you still connected to the web?'); } }); } }; 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, callback: function(viewobject) { windowMgr.addView({ view: viewobject, launch: launch, modalParent: that, replace: config.PassControl, parentRefreshView: that }); }, failureCallback: function(response) { alert('nothing happening in this failure callback.'); } }); } 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 }); }, failureCallback: function(response) { alert('nothing happening in this failure callback.'); } }); } 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() { //alert('Unable to load the form.'); } }); } // 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 paramters 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() { //alert('Unable to load the form.'); // Show a mask.. //this_map.fireEvent('mask', { Activate: false }); } }); } // 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, failureCallback: function(response) { alert('nothing happening in this failure 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.TagFilterID)) action_params['TagFilterID'] = trakkware_config.Parameters.Internal.TagFilterID; if (trakkware_config.Parameters && trakkware_config.Parameters.Internal && Ext.isDefined(trakkware_config.Parameters.Internal.TagFilterGroupID)) action_params['TagFilterGroupID'] = trakkware_config.Parameters.Internal.TagFilterGroupID; 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, eday: eday, 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.TagFilterID) && !Ext.isEmpty(trakkware_config.Parameters.Internal.TagFilterID)) action_params['TagFilterID'] = trakkware_config.Parameters.Internal.TagFilterID; if (trakkware_config.Parameters && trakkware_config.Parameters.Internal && Ext.isDefined(trakkware_config.Parameters.Internal.TagFilterGroupID) && !Ext.isEmpty(trakkware_config.Parameters.Internal.TagFilterGroupID)) action_params['TagFilterGroupID'] = trakkware_config.Parameters.Internal.TagFilterGroupID; 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, 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 { hm = event.day + ' ' + Ext.ux.calendar.Mask.getIntervalFromRow(this.intervalSlot, startRow, this.hourFormat) + ' to '; if (event.day != event.eday) { hm += event.eday + ' '; } hm += 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, TagFilterID: this.TrakkwareConfig.TagFilterID, TagFilterGroupID: this.TrakkwareConfig.TagFilterGroupID }), 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),"