1. © 2011 LabKey Software ExtJS Migration Plan Ben Bimber, Ph.D. LabKey Software

2. © 2011 LabKey Software What is ExtJS?  ExtJS is a JavaScript framework  Library of widgets, utilities  ExtJS handles many cross-browser compatibility issues  Used in most newer LabKey pages  Creates dynamic, interactive UI –Most study redesign pages, timechart, etc. 2

3. © 2011 LabKey Software Ext3->4 Migration  LabKey includes ExtJS Version 3  ExtJS 4 was released earlier this year  Many new features, not backwards compatible  We are migrating core pages to ExtJS 4  Change will be necessary for support of future browsers 3

4. © 2011 LabKey Software General Timeline  Current state of LabKey Server:  Both Ext3 and Ext4 shipped with LabKey  Ext3 is automatically loaded on every page  Ext4 can be loaded on demand by specific pages  LabKey 13.2 (estimated late summer 2013)  All core pages migrated to use Ext4  Both Ext3 and Ext4 shipped with LabKey  Ext4 is loaded on every page  Ext3 can be loaded on demand by specific pages 4

5. © 2011 LabKey Software How Does This Impact Me?  If you do not have custom pages, this transition should not require any changes  LabKey will migrate and test core pages  If you are unsure, you probably have not used Ext  If you have custom pages that use Ext3, you will need to either update pages to Ext4 or declare Ext3 dependency 5

6. © 2011 LabKey Software How Do I Prepare For This?  Consider writing any new pages using Ext4  For majority of applications, Ext4 has only minor differences  Future-proof existing that use Ext3 pages by declaring that dependency  We now recommend that if a custom page uses Ext, that it explicitly load the proper Ext version  Doing so means your page will continue to work during any Ext version changes 6

7. © 2011 LabKey Software Loading Ext Versions  There are 2 ways to declare Ext dependencies:  Within JavaScript, using: –LABKEY.requiresExt4Sandbox(); –LABKEY.requiresExt3();  If using a file-based module, we now support declaring dependencies in the view.xml file –See online documentation: –https://www.labkey.org/wiki/home/Documentation/page.view?na me=scriptdependhttps://www.labkey.org/wiki/home/Documentation/page.view?na me=scriptdepend 7

8. © 2011 LabKey Software LabKey Client API  Majority of our JavaScript Client API will not change  Classes that extend Ext will change:  LABKEY.ext.EditorGrid  LABKEY.ext.FormPanel  LABKEY.ext.Store  We are developing Ext4 versions  Will publically released in coming versions  Pre-public versions can be used, with the caveat that they may change –Can load using LABKEY.requiresExt4ClientAPI() in JavaScript –Also by declaring dependency on “Ext4ClientApi” in the view.xml file 8

9. © 2011 LabKey Software Suggested Steps  Survey any custom pages in your site  Contact LabKey if you have questions on the process 9

10. © 2011 LabKey Software Additional Resources  Ext4 Development in LabKey:  https://www.labkey.org/wiki/home/Documentation/page. view?name=ext4Development https://www.labkey.org/wiki/home/Documentation/page. view?name=ext4Development  Declaring JS Dependencies:  https://www.labkey.org/wiki/home/Documentation/page. view?name=scriptdepend https://www.labkey.org/wiki/home/Documentation/page. view?name=scriptdepend  ExtJS Docs  http://www.sencha.com/products/extjs/ http://www.sencha.com/products/extjs/  http://docs.sencha.com/ext-js/4-1/#!/api http://docs.sencha.com/ext-js/4-1/#!/api 10