PDA

View Full Version : creating all classes from sencha sdk



Anthony.Hall
7 Feb 2012, 9:02 AM
I'm trying to use the sencha sdk to generate my minified file.


I have my page set up on


http://www.mysite.localhost/ext/jobs/index.html


reading from just index.html is not easily possible. When i enter


sencha create jsb -a http://www.mysite.localhost/ext/jobs/index.html -p app.jsb3
I get the following jsb file.



{
"projectName": "Project Name",
"licenseText": "Copyright(c) 2011 Company Name",
"builds": [
{
"name": "All Classes",
"target": "all-classes.js",
"options": {
"debug": true
},
"files": []
},
{
"name": "Application - Production",
"target": "app-all.js",
"compress": true,
"files": [
{
"path": "",
"name": "all-classes.js"
},
{
"path": "",
"name": "app.js"
}
]
}
],
"resources": []
}
ie it's not included all my classes. If i update



"path": "app/", "name": "app.js"


app-all.js is created correctly. But how can i get the controllers and views. There are a lot of files. Does any one have any example mvc application jsb. My app is base on pandora.


app/app.js



Ext.Loader.setConfig({ enabled: true });
Ext.application({


name: 'Pandora',
models: ['Part', 'Material', 'Job', 'Process', 'Invoice', 'InvoiceDetail', 'PurchaseOrder'],
stores: ['SalesContact', 'Parts', 'Materials', 'Jobs', 'AccountHandlers', 'JobTypes', 'Processs', 'Artwork', 'Varnish', 'VarnishType', 'PrintType', 'ProofRequired', 'InvoiceDetails', 'PurchaseOrders'],

controllers: ['Part', 'Material', 'Job', 'Process', 'Invoice']
launch: function () {


Ext.QuickTips.init();
var cmp1 = Ext.create('App.view.Jobs', {
renderTo: "form-job"
});
cmp1.show();
}


});
index.html



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="ext-all-debug.js"></script>
<script type="text/javascript" src="app/app.js"></script>
</head>
<body></body>
</html>

mitchellsimoens
7 Feb 2012, 11:14 AM
You app.js should be in the root folder. That should allow the create jsb command to find it and all your classes.

Anthony.Hall
7 Feb 2012, 12:09 PM
Hi, can you clarify.

option a ) Do you mean that app.js needs to reside here

http://www.mysite.localhost/a (http://www.mysite.localhost/ext/jobs/index.html)pp.js

option b) or that it can be in another directory as log as the app.js is in the same directory as index.html

mitchellsimoens
7 Feb 2012, 12:15 PM
It should be at the same level as index.html

Anthony.Hall
7 Feb 2012, 12:15 PM
also. i have the following properties in my app.js. Will there effect it

Ext.Loader.setPath('App', '/ext/jobs/app');
Ext.application({

name: 'Pandora',
appFolder: '/ext/jobs/app',

mitchellsimoens
7 Feb 2012, 12:19 PM
You Ext.application will add the path for your application automatically so you don't have too.

Anthony.Hall
7 Feb 2012, 12:20 PM
additional note, I've removed the app paths. But my store is now looking for the following url

/ext/jobs/app/app/store/SalesContact.js?_dc=1328645916282[

ie it's put app in twice. where is there path generated. the file should be

/ext/jobs/app/store/SalesContact.js?_dc=1328645916282[

marogalli
20 Apr 2012, 12:34 PM
I tried make my app.js and index in the same level, in root or my app/ directory and keep getting the jsb file empty. Do you have some code that works and can give me as example?

Tks

YomeKitsuma
25 Apr 2012, 1:11 AM
additional note, I've removed the app paths. But my store is now looking for the following url

/ext/jobs/app/app/store/SalesContact.js?_dc=1328645916282[

ie it's put app in twice. where is there path generated. the file should be

/ext/jobs/app/store/SalesContact.js?_dc=1328645916282[

I've encountered the same issue will try to "compile" all the application for production.

Things i can say du to my own experiences :

A) Look at this app.'s declaration



// Set up loader
Ext.Loader.setConfig({
enabled: true,
paths: {
'FooApplication' : 'app'
}
});


// Required source files
Ext.require([
'FooApplication.view.AView',
'FooApplication.view.Logo',
'FooApplication.view.APanel',
'FooApplication.view.Messagebar',
'FooApplication.chart.Dynamic',
'FooApplication.store.Series'
]);


// Application
Ext.application({
name : 'FooApplication',
appFolder : 'app',


controllers : ['FooController'],
views : [
'APanel',
'AView',
'Logo',
'Messagebar',
'Viewport' // maybe not needed :D
],


autoCreateViewport: true,

launch: function() {
this.getController('FooController').start();
}
});


Where I've followed the "standard structure off an MVC application" given in the Sencha "getting started (http://docs.sencha.com/ext-js/4-0/#!/guide/getting_started)"

B)
In The controller take attention to the Models/Views/Stores declaration :



views : [
'APanel', // NOT FooApplication.view.APanel
'AView',
'Logo',
'Messagebar',
'Viewport'

],
stores : ['Charts'], // NOT FooApplication.store.Charts
models : ['Chart'], // NOT FooApplication.model.Chart



C) Take a look at this post (http://www.sencha.com/forum/showthread.php?142768-Using-the-SDK-tools)

This is the ULTIMA How To for compiling your production application ;-)