I use a lot of Sencha stores in my app. Is there a way to dump them to the Javascript console in Chrome/Firefox so that I can quickly see what I have loaded in any given one while my app is running?
Ext.application({
name: 'Sencha',
models: ['One', 'Two', 'Three', ...],
stores: ['One', 'Two', 'Three', ...],
views: [...],
controllers: [...],
launch: function() {
Ext.Viewport.add(Ext.create('Sencha.view.MainView'));
}
});
You can use Ext.getStore:
Ext.getStore('One');
I suggest you take a look at the Ext.data.StoreManager. From there you can access each store you have created in your app.
Hope this helps
Related
I am not able to find Stream Chat React-Native documentation for Actions or I am not using what I found correct :-)
I am able to find a message example like:
{
'text': 'Wonderful! Thanks for asking.',
'attachments': [
{
'type': 'form',
'title': 'Select your account',
'actions': [
{
'name': 'account',
'text': 'Checking',
'style': 'primary',
'type': 'button',
'value': 'checking'
},
{
'name': 'account',
'text': 'Saving',
'style': 'default',
'type': 'button',
'value': 'saving'
},
{
'name': 'account',
'text': 'Cancel',
'style': 'default',
'type': 'button',
'value': 'cancel'
}
]
}
]
}
Pushing this message result in a OK rendering in the client.
Image: Message in chat client
However, the React-Native client throws an error when clicking any of the 3 buttons.
The error I get is:
WARN Possible Unhandled Promise Rejection (id: 0):
Error: StreamChat error code 4: RunMessageAction failed with error: "invalid or disabled command ``"
I have found some references to documentation like this:
Actions in combination with attachments can be used to build commands.
But the link does not end up describing anything about Commands.
Anyone have any tip. E.g. like a link to some documentation describing how to make clickable predefined answers work? :-D
I just stated a new project in Sencha Touch 2.2.1 from the SenchaCmd. Since this is my first Sencha project I am having problems with some pretty basic stuff. I'm trying to access Ext.data.StoreManager to load a predefined store but Ext.data.StoreManager is undefined, as in it seams like the loader have not loaded this file. I have tried to fix it by adding Ext.require('Ext.data.StoreManager'); but no luck.
The project is mostly what SenchaCmd initialized with the addition of a model, a store and some changes to app/views/Main.js.
Any ideas?
Below is my Main.js:
Ext.define('DRL.view.Main', {
extend: 'Ext.dataview.List',
xtype: 'main',
requires: [
'Ext.data.Store'
],
config: {
items: [{
xtype: 'list',
itemTpl: '{teamName}',
store: Ext.data.StoreManager.lookup('teams')
}],
listeners: {
itemtap: function(self, index, target, record, e, eOpts) {
}
}
}
});
Ext.require loads files asynchronously, as well as the requires block. If you want StoreManager to be loaded before Ext.define, you should use Ext.syncRequire before the class definition.
However, there is are better and cleaner ways to achieve the same end result. For example:
app/store/TeamStore.js:
Ext.define('DRL.store.TeamStore', {
extend: 'Ext.data.Store',
model: 'DRL.model.Team' // change your model
...
});
app/store/Main.js
Ext.define('DRL.view.Main', {
...
store: 'DRL.store.TeamStore'
...
});
Then, add the DRL.store.TeamStore and DRL.view.Main to your Ext.application which should be in app.js.
I have huge application.
I would have a common folder with common extjs files across multiple extensions.
Extension folder will extend basic view from common and add its own components.
My application structure would be
common
-app
--model
--view
--store
--controller
---CommonController.js(controller file)
extension1
-app
--model
--view
--store
--controller
---Extension1Controller.js (This should extend CommonController.js)
app.js
app.js
Code:
Ext.Loader.setConfig({enabled:true});
Ext.Loader.setPath('Ext.ux', 'extjs/ux');
Ext.Loader.setPath('commonapp', '/common/app');
Ext.require([
'Ext.data.*',
'Ext.grid.*',
'Ext.tree.*'
]);
Ext.application({
name: 'NSM',
appFolder: '/extension1/app',
controllers: [
'Extension1Controller'
],
launch: function() {
Ext.create('Ext.panel.Panel', {
layout: 'fit',
renderTo:'contentContainer',
items: [
{
xtype: 'panel'
}
]
});
}
});
Extension1Controller.js
Ext.define('NSM.controller.Extension1Controller', {
extend: 'commonapp.controller.CommonController', //Extending the controller from common
init: function() {
//this.getWPPolicyStoreStore().addListener('write',this.finishedLoading, this);
console.log("in sample controller");
}
});
But extending throws following error
Uncaught Error: The following classes are not declared even if their files have been loaded: 'commonapp.controller.CommonController'. Please check the source code of their corresponding files for possible typos: '/common/app/controller/CommonController.js
Please help.
please replace extend config with 'Ext.app.Controller' instead of 'commonapp.controller.CommonController' . Because extend you are specifying what class are you going to extend. To solve your problem, just add that controller('commonapp.controller.CommonController') in Ext.application block as part of another controllers.
Thanks.
I need my application to be fast so I want to specify exactly what I want in the response rather than having tons of superfluous information in there. I know about ResponseGroups but there isn't a group which limits the information I get back. And if you look at my current implementation it sends back a ton of information that has little to do with the products I'm looking for. The real problem is that it's just bulky.
Is there any way to specify very specific things per product? For example:
Formatted price
Name
Link
Image
Description
I don't care about anything else.
Note: I'm using Node-APAC to handle requests to the Amazon Product API. So it converts the response XML into JSON for me.
Here's what I get back (the bulk):
{
ItemSearchResponse: {
$: {...},
OperationRequest: [...],
Items: [
{
Request: [...],
TotalResults: [...],
TotalPages: [...],
MoreSearchResultsUrl: [...],
Item: [
{
ASIN: [...],
DetailPageURL: [...],
ItemLinks: [...],
SmallImage: [...],
MediumImage: [...],
LargeImage: [...],
ImageSets: [...],
ItemAttributes: [...],
OfferSummary: [...]
},
{...},
{...},
{...},
{...}
]
}
]
}
}
What I would like to get back is:
[
{
FormattedPrice: 12.99,
Name: "The Hitchhiker's Guide to the Galaxy"
Link: "http://www.amazon.com/Hitchhikers-Guide-Galaxy-Douglas-Adams/dp/0345391802"
Image: "http://g-ecx.images-amazon.com/images/G/01/ciu/eb/05/0663124128a0de9c79891010.L._AA300_.jpg"
Description: "<Book-Description>"
},
{...},
{...}
]
I don't think there is a way to specify exactly what you want. You have to go through the ReponseGroup. In your case, I would suggest you to pass "Small,OfferSummary" for the ResponseGroup value. It should return what you need while keeping the response size reasonable.
hey i was wondering about the following problem a long time:
In my previous app i specified an xtype to my classes like so:
Ext.define('Sencha.view.Home', {
extend: 'Ext.Panel',
xtype: 'homepanel',
then in my Viewport i added in the items the xtype of 'homepanel' and of course this worked fine and the homepanel and others were displayed in my view. But after upgrading to 2.0 final i can't do this anymore? No i have to use it like this to include my homepanel in the view:
xclass: 'Sencha.view.Home'
Was this a change in the version? Do i now always must call the xclass, or am i doing something wrong with my xtype? Thanks for help!
The Sencha Framework has an alias keyword instead of xtype for the declaration
http://docs.sencha.com/touch/2-0/#!/api/Ext.Class-cfg-alias
Ext.define('MyApp.CoolPanel', {
extend: 'Ext.panel.Panel',
alias: ['widget.coolpanel'],
title: 'Yeah!'
});
// Using Ext.create
Ext.widget('widget.coolpanel');
// Using the shorthand for widgets and in xtypes
Ext.widget('panel', {
items: [
{xtype: 'coolpanel', html: 'Foo'},
{xtype: 'coolpanel', html: 'Bar'}
]
});
Which is also how EXTJS does it nowadays:
https://stackoverflow.com/a/5608766/330417
I have a Sencha Touch 2.0 app and my viewport is set up like this:
Ext.define('example.view.Viewport', {
extend: 'Ext.Container',
config: {
fullscreen: true,
id: 'mainContainer',
layout: {
type: 'card',
animation: {}//we manually set this throughout the app
},
items: [
/*
* This is a list of all of the "cards" in our app that are preloaded
*/
{ xtype: 'dashboardpanel' },
{ xtype: 'customerlist' },
{ xtype: 'loginpanel' }
]
}
});
So if yours isn't working I'm guessing something else is going on. But its hard to tell without seeing more code.
So i figured out what was wrong with my xtypes: I declared my Views in my Controller not in my App.js, as i had put them into my app.js all worked fine for me!
Thanks for your help!
Ext.define('Sencha.view.Home', {
extend: 'Ext.Panel',
alias: 'widget.homepanel'
when you want to use the alias widget 'homepanel' you just say xtype:'homepanel wherever you want to implement it
just change your container to list from panel and set the list-config as
scrollable: false,
pinHeaders: false,