Javascript file path driving me up the wall and through the roof

[baymarketingco]

Hi,

Trust this message finds you hale and hearty. Need your help, if you'd be so kind.

I just can't seem to get the file paths correct for a template I'm converting to Processwire.

Js folder is inside the site -> templates folder:

In this folder are calls to js files, in my _head.inc and _foot.inc files:

In the _head.inc file:

• jquery.js
• jquery-migrate-1.2.1.js
• device.min.js

In the _foot.inc file:

• script.js

Here's the code I use to call these files:

_head.inc
<script src="<?php echo $config->urls->templates; ?>js/jquery.js"></script>
<script src="<?php echo $config->urls->templates; ?>js/jquery-migrate-1.2.1.js"></script>
<script src='<?php echo $config->urls->templates; ?>js/device.min.js'></script>
_foot.inc
<script src="<?php echo $config->urls->templates?>js/script.js"></script>

Inside the script.js file, there are a bunch of includes, like the following:

include('js/jquery.cookie.js');

I'm on Chrome, and the console shows a bunch of 404 errors. The main files don't find the files referenced in script.js.

Here's an example:

http://localhost/surfinn.rocks/js/jquery.cookie.js

http://localhost/surfinn.rocks/js/jquery.cookie.js

That shows an error.

The HTML demo of the site I installed on my Wamp works fine. No errors. Not the case when loaded in Processwire.

Any idea what I'm missing?

Thanks so much for your time.

[tpr]

You would need to set script path by $script.path(), e.g

$script.path('/site/templates/js/')

https://github.com/ded/script.js/#scriptpath

[FrancisChung]

11 hours ago, blommie said:

Hi,

Trust this message finds you hale and hearty. Need your help, if you'd be so kind.

 

I was drinking an ale and was feeling a bit fa...  when I  ....  

... hmm  maybe I  better just stick to being "kind"
 

I went through a similar climbing experience of various walls when I first started out (still starting out).

From what I can gather (correctly or otherwise), 

1) Most Processwire API calls and HTML  expect you to use a path that starts out "/site/templates/... " etc

e.g.

JS Script paths

            <script src="/site/templates/js/min/google-platform.min.js" async defer></script>

Calls to (some) APIs

$pdf->save('/site/templates/test-file.pdf');

 

2) However, in some scenarios you will need to provide a FULL Path to the function or API call.

I think any PHP core functions or API calls, it's better to start off with a full path before reverting to a path that starts with "/site/templates/...."

e.g. PHP Include or Require statements

require_once(__DIR__."/../lib/Lib.php");

___DIR__ is the current full path of where the module or file you're looking at resides, so if the file that has require_once statement lives in /var/usr/tmp/file.php for example , then __DIR__ will return /var/usr/tmp

[baymarketingco]

Thanks for your replies, @tpr and @FrancisChung. I hardcoded the URLs in. Simply don't understand how to do this. Will leave the understanding for another day. Blessings!

[FrancisChung]

Yeah I normally use internal file paths for javascript paths instead of URLs.

Is there a reason for using URLS over file paths?

I haven't used URLs for JS file paths, but I'd imagine there's more chance of things going wrong with that.
(For example, your localhost could point to different servers or sites)

[baymarketingco]

6 minutes ago, FrancisChung said:

Is there a reason for using URLS over file paths?

To be honest, Mr Chung, I don't even know if you're speaking English now 

[FrancisChung]

My bad, for a moment I thought you were using full URLs like below. But I realised you've hardcoded them since. 

http://localhost/surfinn.rocks/js/jquery.cookie.js

I blame lack of sleep and coffee

 

Have you tried $config->paths->templates ? I think that might be what you're looking for?
 

[baymarketingco]

I have. The problem is, inside the script.js file, it calls a bunch of other JS files (I didn't realise the template was so JS heavy, else I would have steered clear; not too fond of goooftymegafters and majiggers that bobble this way and jiggle that way).

So, the calls happening in script.js aren't working. All the files called in that file can't be found, apparently. Throws 404 errors. So I ended up hardcoding all the URLs in the script.js file. If it were a PHP, I'm guessing the $config->paths->templates thingy would have worked fine.

Just on another note: I just figured out (from stalking PW forum posts, of course) how to use repeaters. This system is ridiculously powerful...

If I had sat down years ago and just put my freaking head to it, I would have been a PW pro by now. But noooooooooo, "WordPress is the best CMS in the world!"

Gmf...

(Just thought I'd share this major milestone in my PW journey; it's not coming easy , so every victory is worth a celebration :))

[FrancisChung]

Yeah ... I don't know of JS hooks into Processwire Core APIs. I guess it would be a very nice to have.

I do recall there was a forum post where someone managed to import some of these API results  into Javascript and used it therefore.
I'm guessing you've probably spent too much time on this to warrant searching for it and implementing it.
 

EDIT : I think it was this article.
 

 

[baymarketingco]

15 minutes ago, FrancisChung said:

I'm guessing you've probably spent too much time on this to warrant searching for it and implementing it.

Yup. Moving on. For now. Need to get a website out. Thanks for your input @FrancisChung. Really appreciate the effort.