Focal Point
[CLOSED] Add a JS library

This topic can be found at:
http://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/7837036686

June 06, 2017, 09:40 AM
Shingles
[CLOSED] Add a JS library
Hi Folks,

I'm very new to App Studio (I've only had two intro courses so far, but many more are scheduled). I've done some web development and I've worked with COGNOS for many years. I'm sure this question is covered somewhere, but when I try to search it here, I see posts that are way above my current understanding.

I have a JS file that I would like to use (intro.js). Its a great little utility that gives the user the ability to use some help features after they click a help button/graphic. I was hoping I could use it with App Studio reports/procedures.

1) I have already stored it in a common location (Web Applications/common/js) on the server. So my first question is how do I include a JS file? I see there is an 'Embedded JavaScript' tab for html documents in App Studio, I think this is where, but I'm not sure (I'm thinking I do it outside the window_onload function, right?). Normally I would link to the JS by putting the following line in the header of the html document.
<script type='text/javascript' src="/extdoc/js/intro.js"></script>


2) Also, can this only be done in App Studio HTML documents? What about charts or reports?

3a) Also, I will need to add an attribute to certain tags in the HTML. For example, when the user clicks the help button, the table below will highlight and display the message "Hello, this is help". How can this be done?
<table data-intro="Hello, this is help">...</table>


3b) As an alternative, if 3a is difficult or not possible, I could leave the table element alone and just wrap it with a div tag. Can this be done? Where do I do this?
<div data-intro="Hello, this is help">
 <table>...</table>
</div>


Thanks very much for your help. I imagine I'll get questions to better explain myself. Please ask, I'm not sure what information you folks need.

Thank you

This message has been edited. Last edited by: FP Mod Chuck,


WebFOCUS 8201, SP 0.1, Windows 7, HTML
June 06, 2017, 09:56 AM
tomatosauce
1) Open the HTML page in App Studio and Under Utilities - Click on Settings. You could see a panel (Manage CSS and Scripts) on the right side where you can add your CSS and JS Files.

2) You could add external CSS styles and JS scripts to reports and Charts using HTMLFORM. Search the keyword 'HTMLFORM in the forum.

3a) The table you want to highlight should be hidden and when clicked on the help button should be visible. This can be done with basic JS which is nothing but what you mentioned in 3b

element.style.display = 'none'; // Hide
element.style.display = 'block'; // Show
element.style.display = 'inline'; // Show
element.style.display = 'inline-block';

Please go through this documentation for more info. HTML Pages - App studio


Tharun Katanguru
SBOX- 8205 DEV/TEST/PROD : 8105 8205
Linux, All Outputs
June 08, 2017, 06:15 PM
FP Mod Chuck
Hi Shingles

Welcome to Focal Point. I think you will find this forum very useful for getting answers to your development questions.

Hopefully the answer provided by tomatosauce will get you on your way.

I also want to remind you that should you not get an answer here you can open cases with our techsupport group.

Thanks,


Thank you for using Focal Point!

Chuck Wolff - Focal Point Moderator
WebFOCUS 7x and 8x, Windows, Linux All output Formats