XOOPS 
Forum
Forum Index General Forums Community Support Modules Support Themes Support Development International Support Module Hack Reviews Theme Designer Talk
  1. Board index / 
  2. XOOPS Community Support forums / 
  3. Q and A 
  4.  / Importing custom JavaScript
Register
1
msch-prv
Importing custom JavaScript

  • 2006/5/31 14:46

  • msch-prv

  • Just popping in

  • Posts: 9

  • Since: 2006/5/22


Hopefully this is the right forum!..

I would like to port a simple DHTML script into Xoops. In essence, the script opens up a pop-up window when clicking on an icon and starts cranking out data. The script works flawlessly outisde of xoops.

I created a module (mod1) with a subdir (code1).

Problems:
1. XOOPS only shows the input field, not the image. Since the smarty variable {$xoops_url} is null, I tried to use absolute referencing (ie file:///.. ) to display the icon w/o success.

2. The url 'Click here!' shows up, but the jscript code does not run.

This is my first attempt at customizing xoops. I tried to adapt some of the code I saw in the FAQ threads but, obviously, some parts of the puzzle ar missing. Thanks for helping me out!

Mark

Procedure used:
a. Created a private module (../modules/mod1) with an index file (../modules/mod1/index.php). Added the following html code:

...

Input date:





Click here!

....

b. Declared the jscript file in 'theme.html' as follows:


2
Will_H
Re: Importing custom JavaScript

  • 2006/5/31 20:19

  • Will_H

  • Friend of XOOPS

  • Posts: 1786

  • Since: 2004/10/10


Well unless you plan on actually making this into a module, you could always get the script functioning outside of XOOPS then use the myiframe module to pull the content in... You could also simply use a block.
3
tcnet
Re: Importing custom JavaScript

  • 2006/6/1 0:46

  • tcnet

  • Friend of XOOPS

  • Posts: 297

  • Since: 2006/5/12


Unless you have a need for this to be a module...

You can do this in theme.html just like on a static html page. With this method the link will display on all pages and all themes in use will need to be modified.

1)Publish code1.js to your xoops/root directory. Publish your image to root/images directory.;

2)declare the script in theme.html head:
<head>
<script type="text/javascript">
<{$xoops_url}>/code1.js
script>
head>


3)Insert the form anywhere in your theme.html body
<body>

<p>Input date:p>
<form name="tstest">
<input type="Text" name="timestamp" value="">
<a href="javascript:show_calendar('document.tstest.timestamp', document.tstest.timestamp.value);">
<img src="<{$xoops_url}>/images/img1.gif" width="16" height="16" border="0" alt= "Click here!"> a>
form>

body>


I do not think you can use scripts or Smarty variables in a custom html block.

If you need the form code on a seperate page or want to make a simple module, take a look at this FAQ: Can I include my own HTML pages in xoops?

Good luck,
TCNet
4
Will_H
Re: Importing custom JavaScript

  • 2006/6/1 1:26

  • Will_H

  • Friend of XOOPS

  • Posts: 1786

  • Since: 2004/10/10


Quote:

tcnet wrote:
I do not think you can use scripts or Smarty variables in a custom html block.


ya you can,

but he is right about 1 thing you need to declare the script in your head.

then you can use a custom block just the same way as you would use it in your theme. Then its alot easier to move around and make invisible, and set permissions.
5
tcnet
Re: Importing custom JavaScript

  • 2006/6/1 4:09

  • tcnet

  • Friend of XOOPS

  • Posts: 297

  • Since: 2006/5/12


As Biteronboard has suggested, an alternative to inserting the form directly into your theme.html would be to place the form in a custom html block. But you will have to use a full url in the link because you can not use Smarty variables in a custom html block.
6
msch-prv
Re: Importing custom JavaScript

  • 2006/6/1 6:46

  • msch-prv

  • Just popping in

  • Posts: 9

  • Since: 2006/5/22


Thanks for your comments. I think the problem may be related to declaring external js files (the inline js code works).

Let me rephrase somewhat my original post. To simplify the discussion, I changed the js code to a simple alert function.

With those changes, the in-line js oode works fine:


But the code fails when the same code is placed in an external js file (the browser prompts for a page error):

Thanks for any advice. (xoops V.: 2.0.13.2)

Mark


1. Theme file js declarations (in-line and external):
----- in line code (works) --------


---- external declaration (fails) ------

-----------------------------


2. Index file (php code snippet):

3. Pick a date:





Pick a date



3. Contents of js file 't1.js' :

function T2(pText) {
alert("You typed:" + pText);
}
7
msch-prv
Re: Importing custom JavaScript

  • 2006/6/1 9:07

  • msch-prv

  • Just popping in

  • Posts: 9

  • Since: 2006/5/22


I posted a somewhat similar question on 'frxoops.org'. Somebody made the point that the external js issue may perhaps be related to xoops' security implementation.

Could that be the case? If so, is there a work-around besides loading all the js files in 'theme.html'?

Thanks for any suggestion.
8
msch-prv
Re: Importing custom JavaScript

  • 2006/6/1 10:59

  • msch-prv

  • Just popping in

  • Posts: 9

  • Since: 2006/5/22


Problem solved!!...

I was too distracted by the smarty variables to realize that the culprit was a spurious html bracket located in the declaration section of the 'theme.html' script.

Substituting for the smarty tag, the correct syntax is:

instead of


To sum it up: yes it is possible to import an external js file into your custom module. Just make sure your html syntax is correct!

Thanks to all for your comments.
9
frankblack
Re: Importing custom JavaScript

  • 2006/6/1 16:00

  • frankblack

  • Just can't stay away

  • Posts: 830

  • Since: 2005/6/13


Maybe OT, maybe not? Here is a code snippet for moving the link to an external javascript to the head-tag:

var js  = document.createElement('script');
js.type    = 'text/javascript';
js.src  = 'the/url/to/the/javascript.js';    
// Add the new object to the HEAD element.
document.getElementsByTagName('head')[0].appendChild(js);


Maybe this is helpful to anyone.

Login

Register now!  |  Lost Password?

Search

Advanced Search

Recent Posts

Who's Online

432 user(s) are online (61 user(s) are browsing Support Forums)

Members: 0

Guests: 432

more...

Donat-O-Meter

Stats
Goal: $100.00
Due Date: Sep 30
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits