Javascript files not working? Here's how to fix the issue

by **HalfMoon** » Sun May 22, 2011 3:20 pm

After adding a javascript file to your app you may find that it isn't working as expected. This isn't a NimbleKit issue but rather the way Xcode deals with source code files.

Xcode will treat any source code file that you add to it as needing to be compiled (.c, .m .js & so on…) and hence adds it to the Compile Sources folder under the application target. However, we don't want Xcode to actually do this to our javascript files as it will then throw an error something like the code below:

Code: Select all

warning: no rule to process file '$(PROJECT_DIR)/KillerApp/script.js' of type sourcecode.javascript for architecture i386

--------------------------------------------------------------------------------------
Xcode 4
--------------------------------------------------------------------------------------

You'll know that there's an issue when using Xcode 4 as there will be a yellow warning icon in the central bezel:

: xcodebezelwarning.png (8.59 KiB) Viewed 3256 times

You can also check for issues by clicking the warning icon above your file list:

: showwarningsxcode4.png (31.22 KiB) Viewed 3256 times

This is how to move your .js file from the "Compile Sources" folder to the "Copy Bundle Resources" folder:

: xcode4window.png (144.97 KiB) Viewed 3256 times

And courtesy of Big-O, here's a video demonstration

--------------------------------------------------------------------------------------
Xcode 3
--------------------------------------------------------------------------------------

It's a little easier to find in Xcode 3. Just drag the files from the Compile Sources folder to the Copy Bundle Resources folder. These are found in the Targets folder, in your Groups & Files pane (on the L/H side of Xcode 3)

: xcode3drag.png (183.09 KiB) Viewed 3256 times

by **Big-O** » Mon May 23, 2011 4:56 pm

Glad you posted this. It's a very common problem for new users.

by **shmu** » Thu May 26, 2011 11:42 am

Hello,

I'am using Jquery on my app, during all the test i have no problem, All jquery function worked perfectly.
Five days ago i had submited my app to the app store, and it was accepted, but when you download and launch it, all jquery functions don't working.

I'am not familiar with the new Xcode and build an app for production is always hard for a beginner like me

So if you have an idea or have the same problem ....

Thanks in advance

by **floz** » Fri May 27, 2011 3:01 pm

Wow, that sounds scary! Please keep us posted if you find out anything!!

by **HalfMoon** » Fri May 27, 2011 5:55 pm

TBH I don't know why that would happen... I've not submitted an app built with Xcode 4 yet, so I can't comment on the build for distribution process and if there might be anything there that would cause this issue.

by **rwhg** » Fri Jul 29, 2011 1:48 pm

Thanks, HalfMoon, for sharing this!

I knew how to do it in Xcode 3; this post was very helpful for Xcode 4.

by **Sean2122dd** » Sat Nov 12, 2011 7:30 pm

GRRR I'm going insane here, I've followed your tutorial and it's still not executing the javascript.

Code: Select all

<html>
    <head>
        <meta name = "viewport" content = "initial-scale = 1.0, user-scalable = no" />
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
               
        <script type="text/javascript" src="NKit.js"></script>
        <script type="text/javascript">
            var navController = new NKNavigationController();
            navController.setTitle("Photo Gallery")
            navController.setTintColor(51,87,24);
            navController.show();
            </script>
        
        <script type="text/javascript" src="prototype.js"></script>
        <script type="text/javascript" src="effects.js"></script>
        <script type="text/javascript" src="showcase.js"></script>
        
        <style>
            
            #showcase {
                position: relative;
                width: 700px;
                height:170px;
            }
            
            #showcase li {
                width: 170px;
                height: 170px;
                float: left;
                list-style-type: none;
            }
            
            #showcase li img {
                width: 100%;
                height: 100%;
            }
            </style>
        <script>
            new Showcase.Vertical($$('#showcase li'), $$('a.controls'), {[options]});
            </script>
                   
    </head>
    
    <body>
       <a href="#next" class="controls" rel="next">Next</a>
        <a href="#previous" class="controls" rel="previous">Previous</a>
        <ul id="showcase">
            <li><img src="bowden.png" alt="1" /></li>
            <li><img src="bowden.png" alt="2" /></li>
            </ul>
        
        
        
       
        
   
        
    </body>
</html>

by **Sean2122dd** » Sat Nov 12, 2011 7:56 pm

also using this http://dev.victorstanciu.ro/experimente/prototype-showcase/#download

by **blazeman** » Sat Nov 12, 2011 8:01 pm

You have 16 issues still. One of them could be a reason you are not getting the javascript to run. Until you can rule each of them out... I'd try and fix them.

by **Sean2122dd** » Sun Nov 13, 2011 7:26 pm

blazeman wrote:You have 16 issues still. One of them could be a reason you are not getting the javascript to run. Until you can rule each of them out... I'd try and fix them.

Cleared all the warning issues but still nothing!

Code: Select all

<html>
    <head>
        <meta name = "viewport" content = "initial-scale = 1.0, user-scalable = no" />
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
               
        <script type="text/javascript" src="NKit.js"></script>
        <script type="text/javascript">
            var navController = new NKNavigationController();
            navController.setTitle("Photo Gallery")
            navController.setTintColor(51,87,24);
            navController.show();
            </script>
        
        <script type="text/javascript" src="prototype.js"></script>
        <script type="text/javascript" src="effects.js"></script>
        <script type="text/javascript" src="showcase.js"></script>

        
        <style>
            
            #showcase {
                position: relative;
                width: 700px;
                height:170px;
            }
            
            #showcase li {
                width: 170px;
                height: 170px;
                float: left;
                list-style-type: none;
            }
            
            #showcase li img {
                width: 100%;
                height: 100%;
            }
            </style>
        
    </head>
    
    <body>
       
        <a href="#next" class="controls" rel="next">Next</a>
        <a href="#previous" class="controls" rel="previous">Previous</a>
        <ul id="showcase">
            <li><img src="bowden.png" alt="1" /></li>
            <li><img src="bowden.png" alt="2" /></li>
            </ul>
        
        <script>
            new Showcase.Horizontal($$('#showcase li'), $$('a.controls'), {[options]});
            </script>
        
        
       
        
   
        
    </body>
</html>

Javascript files not working? Here's how to fix the issue

Javascript files not working? Here's how to fix the issue

Re: Javascript files not working? Here's how to fix the issu

Re: Javascript files not working? Here's how to fix the issu

Re: Javascript files not working? Here's how to fix the issu

Re: Javascript files not working? Here's how to fix the issu

Re: Javascript files not working? Here's how to fix the issu

Re: Javascript files not working? Here's how to fix the issu

Re: Javascript files not working? Here's how to fix the issu

Re: Javascript files not working? Here's how to fix the issu

Re: Javascript files not working? Here's how to fix the issu

Who is online