svn: /web/doc-editor/trunk/js/ui/component/ EntitiesAcronymsPanel.js

[email protected] (Yannick Torres)
Newsgroups php.doc.web
Message-ID <[email protected]>
yannick                                  Mon, 22 Mar 2010 21:40:24 +0000

Revision: http://svn.php.net/viewvc?view=revision&revision=296639

Log:
Put entities & acronyms panels into a file

Changed paths:
    A   web/doc-editor/trunk/js/ui/component/EntitiesAcronymsPanel.js
svn-diffs-296639.txt (text/x-diff, 8 KB)
Added: web/doc-editor/trunk/js/ui/component/EntitiesAcronymsPanel.js
===================================================================
--- web/doc-editor/trunk/js/ui/component/EntitiesAcronymsPanel.js	                        (rev 0)
+++ web/doc-editor/trunk/js/ui/component/EntitiesAcronymsPanel.js	2010-03-22 21:40:24 UTC (rev 296639)
@@ -0,0 +1,197 @@
+Ext.namespace('ui','ui.component','ui.component._EntitiesAcronymsPanel');
+
+//------------------------------------------------------------------------------
+// EntitiesAcronymsGrid internals
+
+ui.component._EntitiesAcronymsPanel.grid = Ext.extend(Ext.grid.GridPanel,
+{
+    onRowClick: function(grid, rowIdx, e)
+    {
+        var data = grid.getSelectionModel().getSelected().data;
+
+        Ext.getCmp(this.dataType + '-details-' + this.fid).update(data.value);
+
+    },
+    onRowDblClick: function(grid, rowIdx, e)
+    {
+        var data           = grid.getSelectionModel().getSelected().data,
+            cmp            = Ext.getCmp(this.prefix + '-' + this.ftype + '-FILE-' + this.fid),
+            cursorPosition = Ext.util.JSON.decode(cmp.getCursorPosition()),
+            dataInserted   = (this.dataType == 'entities') ? '&' + data.items + ';' : '<acronym>' + data.items + '</acronym>';
+
+        //Insert the entities at the cursor position
+        cmp.insertIntoLine(cursorPosition.line, cursorPosition.caracter, dataInserted);
+    },
+    initComponent : function()
+    {
+       var url;
+
+       if( this.dataType == 'entities' ) {
+           url = "./do/getEntities";
+       } else if( this.dataType == 'acronyms' ) {
+           url = "./do/getAcronyms";
+       }
+
+       Ext.apply(this, {
+           region           : 'center',
+           split            : true,
+           loadMask         : true,
+           autoScroll       : true,
+           bodyBorder       : false,
+           border           : false,
+           autoExpandColumn : this.dataType,
+           columns          : [
+               {id: 'items', header: _('Items'), sortable: true, dataIndex: 'items'},
+               {header: _('From'), sortable: true, dataIndex: 'from', width: 50}
+           ],
+           viewConfig : {
+               forceFit      : true,
+               emptyText     : '<div style="text-align: center">' + _('You must manually load this data.<br>Use the refresh button !') + '<br><br>'+_('(You can change this behavior by setting an option in the configuration window)') + '</div>',
+               deferEmptyText: false
+           },
+           sm         : new Ext.grid.RowSelectionModel({singleSelect: true}),
+           store      : new Ext.data.Store({
+               autoLoad : this.loadStore,
+               proxy    : new Ext.data.HttpProxy({
+                   url : url
+               }),
+               listeners: {
+                   scope: this,
+                   load: function() {
+
+                       if( this.dataType == 'entities' ) {
+                           Ext.getCmp(this.prefix + '-' + this.fid).panEntities = true;
+                       } else if( this.dataType == 'acronyms' ) {
+                           Ext.getCmp(this.prefix + '-' + this.fid).panAcronyms = true;
+                       }
+                       Ext.getCmp('main-panel').fireEvent('tabLoaded', this.prefix, this.fid);
+                   }
+
+               },
+               reader : new Ext.data.JsonReader(
+               {
+                   root          : 'Items',
+                   totalProperty : 'nbItems',
+                   id            : 'id'
+               }, Ext.data.Record.create([
+                   {
+                       name    : 'id',
+                       mapping : 'id'
+                   }, {
+                       name    : 'from',
+                       mapping : 'from'
+                   }, {
+                       name    : 'items',
+                       mapping : 'items'
+                   }, {
+                       name    : 'value',
+                       mapping : 'value'
+                   }
+                   ])
+               )
+           }),
+           tbar: [
+           {
+                scope   : this,
+                tooltip : _('<b>Load/Refresh</b>'),
+                iconCls : 'iconRefresh',
+                handler : function()
+                {
+                    this.store.reload();
+                }
+            },
+               _('Filter: '), ' ',
+               new Ext.form.TwinTriggerField({
+                    width           : 180,
+                    hideTrigger1    : true,
+                    enableKeyEvents : true,
+                    validateOnBlur  : false,
+                    validationEvent : false,
+                    trigger1Class   : 'x-form-clear-trigger',
+                    trigger2Class   : 'x-form-search-trigger',
+                    listeners : {
+                        specialkey : function(field, e)
+                        {
+                            if (e.getKey() == e.ENTER) {
+                                this.onTrigger2Click();
+                            }
+                        }
+                    },
+                    onTrigger1Click: function()
+                    {
+                        this.setValue('');
+                        this.triggers[0].hide();
+                        this.setSize(180,10);
+                        this.ownerCt.ownerCt.store.clearFilter();
+                    },
+                    onTrigger2Click: function()
+                    {
+                        var v = this.getValue();
+
+                        if (v === '' || v.length < 3) {
+                            this.markInvalid(
+                                _('Your filter must contain at least 3 characters')
+                            );
+                            return;
+                        }
+                        this.clearInvalid();
+                        this.triggers[0].show();
+                        this.setSize(180,10);
+                        this.ownerCt.ownerCt.store.filter('entities', v, true);
+                    }
+                })
+           ]
+       });
+       ui.component._EntitiesAcronymsPanel.grid.superclass.initComponent.call(this);
+
+       this.on('rowclick',    this.onRowClick,    this);
+       this.on('rowdblclick', this.onRowDblClick, this);
+
+    }
+});
+
+
+//------------------------------------------------------------------------------
+// EntitiesAcronymsGrid
+// config - {prefix, fid, ftype, loadStore}
+ui.component.EntitiesAcronymsPanel = Ext.extend(Ext.Panel,
+{
+    initComponent : function()
+    {
+        var panelDesc;
+
+        if( this.dataType == 'entities' ) {
+            panelDesc = _('Click on a row to display the content of the entitie.<br>Double-click on it to insert it at the cursor position.');
+        } else if( this.dataType == 'acronyms' ) {
+            panelDesc = _('Click on a row to display the content of the acronym.<br>Double-click on it to insert it at the cursor position.');
+        }
+
+        Ext.apply(this,
+        {
+            layout: 'border',
+            border: false,
+            items : [
+                new ui.component._EntitiesAcronymsPanel.grid({
+                    dataType          : this.dataType,
+                    prefix            : this.prefix,
+                    fid               : this.fid,
+                    ftype             : this.ftype,
+                    loadStore         : this.loadStore
+                }),
+                {
+                    xtype        : 'panel',
+                    id           : this.dataType + '-details-'+this.fid,
+                    region       : 'south',
+                    split        : true,
+                    height       : 100,
+                    autoScroll   : true,
+                    bodyBorder: false,
+                    bodyCssClass : this.dataType + '-details',
+                    html         : panelDesc
+                }
+            ]
+        });
+
+        ui.component.EntitiesAcronymsPanel.superclass.initComponent.call(this);
+    }
+});
\ No newline at end of file
lmpx.com only provides a reader for public news (NNTP) servers. It is not affiliated with the servers or forums shown here and is not responsible for the content of articles, which is written by their respective authors.