Example 1:
Define separate new global
class and use them across all views in EXTJS MVC pattern
Ext.define('MyApp.util.Utilities',
{
singleton:
true,
SomeValue:
1,
SomeText:
'First'
});
//override global
instance with new values
MyApp.util.Utilities.SomeValue
= 5;
MyApp.util.Utilities.SomeText
= 'Hello World!';
Example 2 : Use of statics
Ext.define('MyApp.Utilities', {
statics: {
foo: function (a, b) {
return a + b;
}
}
});
Ext.define('MyApp.MyView', {
extends: 'Ext.panel.Panel',
requires: ['MyApp.Utilities'],
initComponent: function () {
MyApp.Utilities.foo(1, 2);
}
});
Example 3: Use of
globals {} scope
//App defined here
Ext.application({
name :
'MyFiddle',
// we can also
define global variables which are used throughout the app
globals:{
myURL:'http://example.com',
myName: 'Raja'
},
requires:
['MyApp.util.Utilities'], //Don't forget to require your class
launch :
function() {
console.log('global var old value:'+ MyApp.util.Utilities.SomeValue);
MyApp.util.Utilities.SomeValue = 2; //variables in singleton are auto static.
console.log('MyFiddle', 'Global Var new value:'+
MyApp.util.Utilities.SomeValue);
//
access global var's
var
somevalue = MyApp.util.Utilities.SomeValue;
var
sometext = MyApp.util.Utilities.SomeText;
var
someurl = MyFiddle.app.globals.myURL;
var
somename = MyFiddle.app.globals.myName;
var
str = 'SomeValue: '+somevalue+' ; SomeText: '+sometext+'; myURL: '+
someurl+'; myName: '+somename;
//panel def
Ext.create('Ext.panel.Panel', {
title: 'Statics Example',
width: 600,
height: 200,
defaults: {
// applied to each contained panel
bodyStyle: 'padding:10px'
},
layout: {
type: 'fit'
},
html: str,
renderTo: Ext.getBody()
});
}
});
http://jsfiddle.net/prajavk/YhuWT/
Example 4:
Ext.define('Wetter.utils.Global',{
singleton: true,
test:
function(params) {
alert("test"+params);
},
});
Wetter.utils.Global.test('hello');
Example 5C:
This
shows the contents of Runtime.js and example 5D shows how to “require” it in
your app.js. You can then “set” and “get” your properties as shown in 5E and 5F
from anywhere in the app.
Ext.define(‘MyApp.config.Runtime’,{
singleton : true,
config : {
myLastCustomer : 0 // initialize to 0
},
constructor :
function(config){
this.initConfig(config);
}
});
Example 5C. Sample
Runtime.js file to hold global properties for an app.
Ext.application({
name : ‘MyApp’,
requires :
[‘MyApp.config.Runtime’],
...
});
Example 5D. Require the
Runtime class in your app.js file.
MyApp.config.Runtime.setMyLastCustomer(12345);
Example 5E. How to set the
last customer.
MyApp.config.Runtime.getMyLastCustomer();
Example 6:
As a rule of thumb, we
should avoid using global variables as much as possible. Though sometimes it's
very convenient to use them. One such global I used to manage frequently used
'Loading...', 'Updating...' type of messages in overlays.
This is how we defined
the global variable 'mask' in app.js
Ext.define('mask', {
singleton: true,
loading: new Ext.LoadMask(Ext.getBody(), {msg:"Loading...."}),
updating: new Ext.LoadMask(Ext.getBody(), {msg:"Updating...."}),
saving: new Ext.LoadMask(Ext.getBody(), {msg:"Saving...."}),
working: new Ext.LoadMask(Ext.getBody(), {msg:"Working...."})
});
Now we can use this
variable anywhere in our code, i.e. in views or in controllers.
//this will show a
loading message in overlay
//can be called in
view or in some controller function
mask.loading.show();
//this will remove the
loading message
//generally called in
a controller function, most probably inside a Ajax request's callback
mask.loading.hide();
This global will save
you to create LoadMasks everytime you want to show some message in overlay.
aye
ReplyDeleteconspi0fau_fu Christina Cooper https://wakelet.com/wake/Ba5Zn-NNdsLzuWr-SOuF6
ReplyDeletetuturazin
terpprocZfiyu Curtis Rasmussen https://www.cuneyttugrul.org/profile/Cst-2010-Crack-Download-Full-HOT/profile
ReplyDeletelangistpaka
synfisVstab_chi Leslie Holloway FonePaw
ReplyDeleteBootstrap Studio
Internet Download Manager
afininhar