extjs/build/examples/classic/rtl/rtl.js

   1 Ext.require([
   2     'Ext.container.Viewport',
   3     'Ext.grid.Panel',
   4     'Ext.grid.plugin.RowEditing',
   5     'Ext.layout.container.Border'
   6 ]);
   7
   8 Ext.onReady(function() {
   9     var text = '\u0635\u0650\u0641 \u062E\u064E\u0644\u0642\u064E \u062E\u064E\u0648\u062F\u0650 \u0643\u064E\u0645\u0650\u062B\u0644\u0650 \u0627\u0644\u0634\u064E\u0645\u0633\u0650 \u0625\u0650\u0630 \u0628\u064E\u0632\u064E\u063A\u064E\u062A \u2014 \u064A\u064E\u062D\u0638\u0649 \u0627\u0644\u0636\u064E\u062C\u064A\u0639\u064F \u0628\u0650\u0647\u0627 \u0646\u064E\u062C\u0644\u0627\u0621\u064E \u0645\u0650\u0639\u0637\u0627\u0631\u0650',
  10         i = 50,
  11         sentences = [],
  12         words = text.split(' '),
  13         edCfg = {
  14             xtype: 'textfield'
  15         },
  16         paragraph;
  17
  18     while (i--) {
  19         sentences.push(text);
  20     }
  21     paragraph = sentences.join(' ');
  22
  23     Ext.define('Fubar', {
  24         extend: 'Ext.data.Model',
  25         fields: [ 'foo', 'bar', 'baz', 'zork', 'gork', 'bork' ]
  26     });
  27
  28     // Hide the RTL Button as we already are RTL
  29     Ext.ComponentManager.onAvailable('options-toolbar', function(toolbar){
  30
  31         var rtlButton = toolbar.down('button');
  32         if (rtlButton) {
  33             rtlButton.hide();
  34         }
  35     });
  36
  37
  38     Ext.create('Ext.container.Viewport', {
  39         layout: 'border',
  40         rtl: true,
  41         items: [{
  42             region: 'north',
  43             title: '\u0634\u0645\u0627\u0644',
  44             height: 100,
  45             html: paragraph,
  46             scrollable: true,
  47             collapsible: true,
  48             split: true
  49         },{
  50             region: 'west',
  51             id: 'west-region',
  52             title: '\u0627\u0644\u0645\u0646\u0637\u0642\u0629 \u0627\u0644\u063a\u0631\u0628\u064a\u0629',
  53             width: 200,
  54             collapsible: true,
  55             split: true,
  56             tbar: {
  57                 enableOverflow: true,
  58                 items: [{
  59                     text: words[9]
  60                 }, {
  61                     text: words[3]
  62                 }, {
  63                     text: words[4]
  64                 }, {
  65                     text: words[0]
  66                 }, {
  67                     text: words[12]
  68                 }]
  69             }
  70         }, {
  71             region: 'center',
  72             xtype: 'grid',
  73             plugins: [new Ext.grid.plugin.RowEditing()],
  74             title: '\u0645\u0631\u0643\u0632 \u0627\u0644\u0645\u0646\u0637\u0642\u0629',
  75             columns: [
  76                 { dataIndex: 'foo', text: words[0], field: edCfg},
  77                 { dataIndex: 'bar', text: words[1], field: edCfg },
  78                 { dataIndex: 'baz', text: words[2], field: edCfg },
  79                 { dataIndex: 'zork', text: words[3], field: edCfg },
  80                 { dataIndex: 'gork', text: words[4], field: edCfg },
  81                 { dataIndex: 'bork', text: words[5], field: edCfg, flex: 1 }
  82             ],
  83             store: Ext.create('Ext.data.Store', {
  84                 model: 'Fubar',
  85                 data: [
  86                     [words[6], words[8], words[9], words[10], words[11], words[12]],
  87                     [words[5], words[4], words[3], words[2], words[1], words[0]],
  88                     [words[12], words[11], words[10], words[9], words[8], words[6]],
  89                     [words[0], words[1], words[2], words[3], words[4], words[5]],
  90                     [words[6], words[8], words[9], words[10], words[11], words[12]],
  91                     [words[5], words[4], words[3], words[2], words[1], words[0]],
  92                     [words[12], words[11], words[10], words[9], words[8], words[6]],
  93                     [words[0], words[1], words[2], words[3], words[4], words[5]],
  94                     [words[6], words[8], words[9], words[10], words[11], words[12]],
  95                     [words[5], words[4], words[3], words[2], words[1], words[0]],
  96                     [words[12], words[11], words[10], words[9], words[8], words[6]],
  97                     [words[0], words[1], words[2], words[3], words[4], words[5]],
  98                     [words[6], words[8], words[9], words[10], words[11], words[12]],
  99                     [words[5], words[4], words[3], words[2], words[1], words[0]],
 100                     [words[12], words[11], words[10], words[9], words[8], words[6]],
 101                     [words[0], words[1], words[2], words[3], words[4], words[5]],
 102                     [words[6], words[8], words[9], words[10], words[11], words[12]],
 103                     [words[5], words[4], words[3], words[2], words[1], words[0]],
 104                     [words[12], words[11], words[10], words[9], words[8], words[6]],
 105                     [words[0], words[1], words[2], words[3], words[4], words[5]]
 106                 ]
 107             })
 108         }, {
 109             region: 'east',
 110             title: '\u0627\u0644\u0645\u0646\u0637\u0642\u0629 \u0627\u0644\u0634\u0631\u0642\u064a\u0629',
 111             width: 200,
 112             collapsible: true,
 113             split: true
 114         }, {
 115             region: 'south',
 116             title: '\u062c\u0646\u0648\u0628 \u0627\u0644\u0645\u0646\u0637\u0642\u0629',
 117             height: 100,
 118             collapsible: true,
 119             split: true
 120         }]
 121     });
 122 });