1. #51
    Sencha Premium Member
    Join Date
    Feb 2012
    Location
    North Carolina
    Posts
    307
    Vote Rating
    18
    worthlutz will become famous soon enough

      0  

    Default Architect and Cmd and css??????

    Architect and Cmd and css??????


    Quote Originally Posted by Phil.Strong View Post
    ...
    Update your index.html file
    Update your index.html file to define the locations of the .css and .js files, similar to the definitions given in the app.html file created by Architect. Note that the declarations for the .js source files should be located between the x-compile tags:

    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
        <meta charset="UTF-8">
        <title>fresh</title>
        <link rel="stylesheet" href=".res/default/app.css">
        <!-- <x-compile> -->
            <!-- <x-bootstrap> -->
                <script src="ext/ext-dev.js"></script>
                <script src="bootstrap.js"></script>
            <!-- </x-bootstrap> -->
            <script src="app.js"></script>
        <!-- </x-compile> -->
    </head>
    <body></body>
    </html>

    With the latest version of Cmd, I do not see app.css. My application was using an index.html similar to that shown above as I started this application some time ago. I had an "app.css" in a resource directory.
    At some point this "app.css" was not working correctly. My application would not look right when run from this index.html but look correct after a build. I have been working like this for some time.

    I have now tried to correct this and have some questions.

    Now when I generate an extjs application using Cmd I get the following:

    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
        <meta charset="UTF-8">
        <title>zztest</title>
        <!-- <x-compile> -->
            <!-- <x-bootstrap> -->
                <link rel="stylesheet" href="bootstrap.css">
                <script src="../ext/ext-dev.js"></script>
                <script src="bootstrap.js"></script>
            <!-- </x-bootstrap> -->
            <script src="app.js"></script>
        <!-- </x-compile> -->
    </head>
    <body></body>
    </html>

    What is bootstrap.css? It seems to be importing "theme-classic-all". When I start my application with this index.html it looks more correct. I did seem to find that the following was in the old app.css and not this new file:

    Code:
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }
    Is this new index.html and bootstrap.css the proper starting point for building an extjs application?

    Where do I add the links for custom .css created and added to app.html by Architect?

    Curently I am adding the ".js" lines above the "<!-- <x-compile> -->".
    The ".css" lines I've added below the ending "<!-- </x-compile> -->".

    Is this the best way to do this? I've just tried this but have not run a build yet so I am not sure it works.

    Thanks,
    Worth


  2. #52
    Sencha - Architect Dev Team Phil.Strong's Avatar
    Join Date
    Mar 2007
    Location
    Olney, MD
    Posts
    1,953
    Vote Rating
    65
    Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice

      0  

    Default


    yeah this bootstrap.css is used to pull in the correct theme in dev mode.

    you might have to add your css file to app.json to get it pulled in or simply add it outside the bootstrap comments
    Phil Strong
    @philstrong
    #SenchaArchitect
    Sencha Architect Development Team

  3. #53
    Sencha Premium Member
    Join Date
    Feb 2012
    Location
    North Carolina
    Posts
    307
    Vote Rating
    18
    worthlutz will become famous soon enough

      0  

    Default


    Quote Originally Posted by Phil.Strong View Post
    you might have to add your css file to app.json to get it pulled in or simply add it outside the bootstrap comments
    What does app.json do? Mine looks like this:
    Code:
    {    "name": "MapClick4"
    }
    Is this written by Architect?

    I've added several .css files in Architect and just copied the links from the app.html to index.html.

    Should this happen some other way? The build process is still a black box to me.

    Thanks,
    Worth

  4. #54
    Sencha Premium Member
    Join Date
    Apr 2013
    Location
    France
    Posts
    2
    Vote Rating
    0
    y-ledean is on a distinguished road

      0  

    Default Uncaught TypeError on built version after CMD

    Uncaught TypeError on built version after CMD


    Sencha Architect 2.2.2b991
    ExtJS 4.2.1.833 commercial
    CMD 3.1.2.842
    Windows 7 platform

    I followed the tutorial but I'm having some issues with the output build. Couple of things of note :
    - .sencha/app/sencha.cfg is already corrected in that version of CMD (may need to update the tutorial):
    Code:
    app.classpath=${app.dir}/app,${app.dir}/app.js
    - there is no app/app.js generated, however there's an app/application.js that was generated. I removed it.
    - I also found a Main.js in app/controller, on top of the Main.js in app/view that I did remove (My main controller is called MainController.js). I tried removing it but it had no effect.

    The building process goes through without error but when running the build, I'm getting some Uncaught TypeError : Object [object Object] has no method 'read' when running it. Exact error :
    Code:
    Uncaught TypeError: Object [object Object] has no method 'read' all-classes.js:1
    Ext.cmd.derive.load all-classes.js:1
    b.implement.callParent all-classes.js:1
    Ext.cmd.derive.load all-classes.js:1
    Ext.Ajax.request.success all-classes.js:1
    Ext.apply.callback all-classes.js:1
    Ext.cmd.derive.onComplete all-classes.js:1
    Ext.cmd.derive.onStateChange all-classes.js:1
    (anonymous function)
    I do have an extra global.js javascript file that adds a global variable, I thought that would be the issue but this seems to get handled correctly.

    Original index.html (head section) :
    HTML Code:
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Test</title>
        <script src="../ext-4.2.1/ext-all.js"></script>
        <script type="text/javascript" src="../ext-4.2.1/locale/ext-lang-fr.js"></script>
        <link rel="stylesheet" href="../ext-4.2.1/resources/ext-theme-classic/ext-theme-classic-all.css">
        <link rel="stylesheet" href="test.css">
        <script src="global.js"></script>
        <script type="text/javascript" src="app.js"></script>
    Modified index.html :
    HTML Code:
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Test</title>
        <!-- <x-compile> -->
            <!-- <x-bootstrap> -->
            <script src="../ext-4.2.1/ext-dev.js"></script>
            <script type="text/javascript" src="../ext-4.2.1/locale/ext-lang-fr.js"></script>
            <script src="bootstrap.js"></script>
            <!-- </x-bootstrap> -->
        <script src="global.js"></script>
        <script type="text/javascript" src="app.js"></script>
        <!-- </x-compile> -->
        <link rel="stylesheet" href="../ext-4.2.1/resources/ext-theme-classic/ext-theme-classic-all.css">
        <link rel="stylesheet" href="test.css">
    Is there something wrong in what I'm trying to do that could cause such an error ?

  5. #55
    Sencha - Architect Dev Team Phil.Strong's Avatar
    Join Date
    Mar 2007
    Location
    Olney, MD
    Posts
    1,953
    Vote Rating
    65
    Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice

      0  

    Default


    try building for testing

    $ sencha app build testing

    and see what that produces
    Phil Strong
    @philstrong
    #SenchaArchitect
    Sencha Architect Development Team

  6. #56
    Sencha Premium Member
    Join Date
    Mar 2013
    Posts
    64
    Vote Rating
    0
    kbujold is on a distinguished road

      0  

    Default


    Ia m having similar problems as to where to add some resources so they are build into the build/production/ folder. I am getting lots of errors trying to locate those files into the /build/AppName/common/resources/css/font-awesome.min.css for example

    Here's my index.PHP

    Code:
    <script type="text/javascript" src="../common/store/language/language.php?pageId=ppmlandingpage"></script><script type="text/javascript" src="../common/store/language/language.php?pageId=allpages"></script>
    <!-- <x-compile> -->
      <!-- <x-bootstrap> -->
        <link rel="stylesheet" type="text/css" href="../common/resources/css/font-awesome.min.css" />  
        <link rel="stylesheet" type="text/css" href="../common/resources/css/adtran.css"/>
        <link rel="stylesheet" href="bootstrap.css">
        <script src="../ext/ext-all-dev.js"></script>
        <script src="bootstrap.js"></script>
      <!-- </x-bootstrap> -->
      <script src="app.js"></script>
      </script>
    <!-- </x-compile> -->
    
    
    </head>
    <body>
    </body>
    </html>

  7. #57
    Sencha Premium Member
    Join Date
    May 2010
    Location
    Guatemala, Central America
    Posts
    1,323
    Vote Rating
    186
    ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold

      0  

    Default


    I have been trying to generate a simple mobile application with SA + CMD and has been a PITA!

    The CMD is composed of tool over tool written in java, js, shell and (I guess) C. stbuild is an executable black box program!

    I'm really FRUSTRATED!
    UI: Sencha Architect 3.x / ExtJS 4 & 5
    Server side: JEE / EJB 3.x / CDI / JPA 2.x/ JAX-RS / JasperReports
    Application Server: Glassfish / WildFly
    Databases: Oracle / DB2 / MySQL / Firebird

    If you like my answer please vote!

  8. #58
    Sencha Premium Member
    Join Date
    Mar 2013
    Posts
    64
    Vote Rating
    0
    kbujold is on a distinguished road

      0  

    Default


    Move it up outside the bootstrape comment ... this worked for me.

    Capture.PNG

  9. #59
    Sencha Premium Member
    Join Date
    Feb 2012
    Location
    North Carolina
    Posts
    307
    Vote Rating
    18
    worthlutz will become famous soon enough

      0  

    Default


    Quote Originally Posted by kbujold View Post
    Move it up outside the bootstrape comment ... this worked for me.

    Attachment 45163
    You may have to put it AFTER the bootstrap to get it to work. I had a problem when trying to override classes and moving the link to after the bootstrap worked.

    Worth

  10. #60
    Sencha - Architect Dev Team Phil.Strong's Avatar
    Join Date
    Mar 2007
    Location
    Olney, MD
    Posts
    1,953
    Vote Rating
    65
    Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice

      0  

    Default


    also note you can have it inside the x-compile and outside of x-bootstrap this way it makes it into the build.
    Bootstrap: it's only for dev mode
    Compile no bootstrap: include this in the build output
    Phil Strong
    @philstrong
    #SenchaArchitect
    Sencha Architect Development Team