X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6a7e4474cba9d8be4b2ec445e10f1691f7277c50..6746dc89c47ed01b165cc1152533605f97eb8e8d:/examples/direct/direct.js diff --git a/examples/direct/direct.js b/examples/direct/direct.js index 2553ac23..2e41303e 100644 --- a/examples/direct/direct.js +++ b/examples/direct/direct.js @@ -1,88 +1,124 @@ -/*! - * Ext JS Library 3.2.0 - * Copyright(c) 2006-2010 Ext JS, Inc. - * licensing@extjs.com - * http://www.extjs.com/license - */ -Ext.onReady(function(){ - Ext.Direct.addProvider( - Ext.app.REMOTING_API, - { - type:'polling', - url: 'php/poll.php' - } - ); +/* - var out = new Ext.form.DisplayField({ - cls: 'x-form-text', - id: 'out' - }); +This file is part of Ext JS 4 - var text = new Ext.form.TextField({ - width: 300, - emptyText: 'Echo input' - }); +Copyright (c) 2011 Sencha Inc - var call = new Ext.Button({ - text: 'Echo', - handler: function(){ - TestAction.doEcho(text.getValue(), function(result, e){ - var t = e.getTransaction(); - out.append(String.format('
Successful call to {0}.{1} with response:
Successful call to {0}.{1} with response:
Call to {0}.{1} failed with message:
{2}', + transaction.action, transaction.method, Ext.encode(result)); + + updateMain(content); + field.reset(); + }); + } + + function doMultiply(field){ + TestAction.multiply(field.getValue(), function(result, event){ + var transaction = event.getTransaction(), + content; + + if (event.status) { + content = Ext.String.format('Successful call to {0}.{1} with response:
{2}', + transaction.action, transaction.method, Ext.encode(result)); + } else { + content = Ext.String.format('Call to {0}.{1} failed with message:
{2}', + transaction.action, transaction.method, event.message); + } + updateMain(content); + field.reset(); + }); + } + + function updateMain(content){ + main.update({ + data: content + }); + main.body.scroll('b', 100000, true); + } + + Ext.direct.Manager.addProvider(Ext.app.REMOTING_API, { + type:'polling', + url: 'php/poll.php', + listeners: { + data: function(provider, event){ + updateMain('' + event.data + ''); + } } }); - - var p = new Ext.Panel({ + + var main = Ext.create('Ext.panel.Panel', { + id: 'logger', title: 'Remote Call Log', - //frame:true, + renderTo: document.body, width: 600, height: 300, - layout:'fit', - - items: [out], - bbar: [text, call, '-', num, multiply] - }).render(Ext.getBody()); - - Ext.Direct.on('message', function(e){ - out.append(String.format('
{0}
', e.data)); - out.el.scroll('b', 100000, true); - }); + tpl: '{data}
', + tplWriteMode: 'append', + autoScroll: true, + bodyStyle: 'padding: 5px;', + dockedItems: [{ + dock: 'bottom', + xtype: 'toolbar', + items: [{ + hideLabel: true, + itemId: 'echoText', + xtype: 'textfield', + width: 300, + emptyText: 'Echo input', + listeners: { + specialkey: function(field, event){ + if (event.getKey() === event.ENTER) { + doEcho(field); + } + } + } + }, { + itemId: 'echo', + text: 'Echo', + handler: function(){ + doEcho(main.down('#echoText')); + } + }, '-', { + hideLabel: true, + itemId: 'multiplyText', + xtype: 'textfield', + width: 80, + emptyText: 'Multiply x 8', + listeners: { + specialkey: function(field, event){ + if (event.getKey() === event.ENTER) { + doMultiply(field); + } + } + } + }, { + itemId: 'multiply', + text: 'Multiply', + handler: function(){ + doMultiply(main.down('#multiplyText')); + } + }] + }] + }); }); +