src/examples/direct/direct.js

   1 Ext.require([
   2     'Ext.direct.*'
   3 ]);
   4
   5 Ext.application({
   6     name: 'Direct',
   7     launch: function() {
   8         function doEcho(field) {
   9             TestAction.doEcho(field.getValue(), function(result, event) {
  10                 var transaction = event.getTransaction(),
  11                     content = Ext.String.format('<b>Successful call to {0}.{1} with response:</b><pre>{2}</pre>',
  12                         transaction.getAction(), transaction.getMethod(), Ext.encode(result));
  13
  14                 updateMain(content);
  15                 field.reset();
  16             });
  17         }
  18
  19         function doMultiply(field){
  20             TestAction.multiply(field.getValue(), function(result, event) {
  21                 var transaction = event.getTransaction(),
  22                     content;
  23
  24                 if (event.getStatus()) {
  25                     content = Ext.String.format('<b>Successful call to {0}.{1} with response:</b><pre>{2}</pre>',
  26                         transaction.getAction(), transaction.getMethod(), Ext.encode(result));
  27                 } else {
  28                     content = Ext.String.format('<b>Call to {0}.{1} failed with message:</b><pre>{2}</pre>',
  29                         transaction.getAction(), transaction.getMethod(), event.getMessage());
  30                 }
  31                 updateMain(content);
  32                 field.reset();
  33             });
  34         }
  35
  36         function updateMain(content){
  37             main.setData({
  38                 data: content
  39             });
  40         }
  41
  42         Ext.direct.Manager.addProvider(Ext.app.REMOTING_API, {
  43             type:'polling',
  44             url: 'php/poll.php',
  45             listeners: {
  46                 data: function(provider, event) {
  47                     updateMain('<i>' + event.getData() + '</i>');
  48                 }
  49             }
  50         });
  51
  52         var main = Ext.create('Ext.Container', {
  53             fullscreen: true,
  54             id: 'logger',
  55             tpl: '<p>{data}</p>',
  56             tplWriteMode: 'append',
  57             styleHtmlContent: true,
  58             scrollable: true,
  59             items: [{
  60                 docked: 'top',
  61                 xtype: 'toolbar',
  62                 title: 'Remote Call Log'
  63             }, {
  64                 docked: 'bottom',
  65                 xtype: 'toolbar',
  66                 items: [{
  67                     itemId: 'echoText',
  68                     xtype: 'textfield',
  69                     width: 300,
  70                     emptyText: 'Echo input'
  71                 }, {
  72                     itemId: 'echo',
  73                     text: 'Echo',
  74                     handler: function(){
  75                         doEcho(main.down('#echoText'));
  76                     }
  77                 }, {xtype: 'spacer'}, {
  78                     itemId: 'multiplyText',
  79                     xtype: 'textfield',
  80                     width: 80,
  81                     emptyText: 'Multiply x 8'
  82                 }, {
  83                     itemId: 'multiply',
  84                     text: 'Multiply',
  85                     handler: function() {
  86                         doMultiply(main.down('#multiplyText'));
  87                     }
  88                 }]
  89             }]
  90         });
  91     }
  92 });