1. #1
    Sencha User
    Join Date
    Aug 2012
    Posts
    23
    Vote Rating
    0
    Lampei is on a distinguished road

      0  

    Default Global Variables

    Global Variables


    I'm having a heck of a time trying to set a global variable and reference it from within a controller. Has anyone done this with Architect?

    I saw a mention of creating a custom class and doing it that way (http://www.sencha.com/forum/showthread.php?260421) but I can't seem to reference it correctly in Architect. I tried adding it as a controller (MyApp.controller.Utils), but then I can't see how you "require" it in the Application itself.

    Any help would be appreciated.
    Thanks.

  2. #2
    Ext JS Premium Member tangix's Avatar
    Join Date
    Mar 2010
    Location
    Stockholm, Sweden
    Posts
    550
    Vote Rating
    50
    tangix is a jewel in the rough tangix is a jewel in the rough tangix is a jewel in the rough

      0  

    Default


    The whole point is to get rid of the global namespace not to clutter JavaScript. Are you trying to set/get an external variable (from another JavaScript library for example) or are you trying to have your own global variables?
    The few global vaiables I have in my projects I add to an object with the same name as the project, for example VPCalcTouch.config and then add properties to that one. Easy to access and debug. I also use this to load up the defaults from the server by inserting a JS snippet in the app.html file.

    HtH,
    /Mattias

  3. #3
    Sencha User
    Join Date
    Aug 2012
    Posts
    23
    Vote Rating
    0
    Lampei is on a distinguished road

      0  

    Default


    I'm all for keeping everything clean. This would be an environment variable (dev, staging, qa, production) that would be set initially passed into the application on initial load. From here, the app then knows which server to get data from. I'm just trying to set this variable so my service calls connect to the correct server. We're not using Sencha cmd, so I'm trying to set this on app load.

  4. #4
    Ext JS Premium Member tangix's Avatar
    Join Date
    Mar 2010
    Location
    Stockholm, Sweden
    Posts
    550
    Vote Rating
    50
    tangix is a jewel in the rough tangix is a jewel in the rough tangix is a jewel in the rough

      0  

    Default


    Just adding the variables to your app's namespace would make them accessible everywhere in your project and keep the namespace clean. Set them initially in Application.init() function to make sure they are available to all components in the application before they start to run their own init().

  5. #5
    Sencha User
    Join Date
    Aug 2012
    Posts
    23
    Vote Rating
    0
    Lampei is on a distinguished road

      0  

    Default


    OK, I guess this is where I'm unsure how to do this from within Sencha Architect.

    In the panel there is not "init" function...there is a launch and Loader Config. I can create an "init" function in the "functions" section, or is there an override needed of "init"? I tried setting MyApp.app.config.environment = "dev"; within the "launch" function and referencing that variable from my controller, but that did not work. I also tried doing MyApp.config.environment = "dev"; which also failed.

    Thanks.

  6. #6
    Ext JS Premium Member tangix's Avatar
    Join Date
    Mar 2010
    Location
    Stockholm, Sweden
    Posts
    550
    Vote Rating
    50
    tangix is a jewel in the rough tangix is a jewel in the rough tangix is a jewel in the rough

      1  

    Default


    You should add a function init to the Application object at the top of the Project Inspector, see:
    http://screencast.com/t/ZVl4sErsMwsY

    The code in init() should be along the lines (remember to create the property "config" before assigning parameters and also remember not to redefine your app's namespace):
    Code:
    VPCalcDesktop.config = VPCalcDesktop.config || {};
    VPCalcDesktop.config.eff_olja = 92.0;
    VPCalcDesktop.config.eff_ved = 75.0;
    VPCalcDesktop.config.eff_flis = 90.0;
    VPCalcDesktop.config.eff_pellets = 85.0;
    VPCalcDesktop.config.eff_fjarrv = 100.0;
    VPCalcDesktop.config.eff_el = 100.0;
    The first line makes this work even if the dynamic config from the server (set in app.html in a <script> block) is not there.

    HtH,
    /Mattias
    Last edited by tangix; 16 May 2013 at 6:33 AM. Reason: typos, typos

  7. #7
    Sencha User
    Join Date
    Aug 2012
    Posts
    23
    Vote Rating
    0
    Lampei is on a distinguished road

      0  

    Default


    Ah, that got it...thanks for the screencast

    Thanks for all the help with this. I've been trying for 6 hours adding and removing variables trying to figure this all out.

  8. #8
    Ext JS Premium Member tangix's Avatar
    Join Date
    Mar 2010
    Location
    Stockholm, Sweden
    Posts
    550
    Vote Rating
    50
    tangix is a jewel in the rough tangix is a jewel in the rough tangix is a jewel in the rough

      0  

    Default


    Yeah, there's more than one way to code in JavaScript. I agree that Mitchell's way in his post is a nice one, and the trick in Sencha Architect to configure this is to click on the menuitem "Class >" in the + menu in the Project Inspector - this generates a clean class (works also with Stores btw). Add the properties in the Config panel or in code. Another trick is then that you need to type the name in as a require on the Application node in Project Inspector - the interface for configuring model, stores, views or controller (with drop-down menus) doesn't work for defined classes for some reason.

    However, in my apps I have configuration coming from the server via app.html and getting that data into a class à la Mitchell would be challenging.

    Anyway, glad to hear you are on your way to the next challenge in your project. Happy Coding!
    /Mattias

  9. #9
    Touch Premium Member BostonMerlin's Avatar
    Join Date
    Aug 2010
    Location
    Boston
    Posts
    520
    Vote Rating
    41
    BostonMerlin has a spectacular aura about BostonMerlin has a spectacular aura about BostonMerlin has a spectacular aura about

      0  

    Default


    FYI, rumor has it, architect will gain built-in dev, qa, prod settings to manage these environmental variables at some point so you'll still need your home-grown settings today.

    John


    Quote Originally Posted by Lampei View Post
    I'm all for keeping everything clean. This would be an environment variable (dev, staging, qa, production) that would be set initially passed into the application on initial load. From here, the app then knows which server to get data from. I'm just trying to set this variable so my service calls connect to the correct server. We're not using Sencha cmd, so I'm trying to set this on app load.
    I love being a dad (5 & 7), flying airplanes (KBED) and writing code (spaghetti).
    BostonMerlin aka John Bond aka JB
    See U @ SenchaCon '13

  10. #10
    Sencha User
    Join Date
    Aug 2012
    Posts
    23
    Vote Rating
    0
    Lampei is on a distinguished road

      0  

    Default


    OK, one last question...how is everyone getting this information into their app initially?

    For the environment, I can just use the host name where the app is being served from, but what if I needed to pass in extra params to the app? When we had this written in Flex, I liked setting these items to the page, then having the app read the params via scripting. Any suggestions for this?

    Thanks all.

Thread Participants: 2