How do I re-use JavaScript code in Spotfire? - javascript

How do I call other JavaScript in Spotfire.
For example, JS written on Page 1 has to be called in Page 10.
Earlier I used to write the same function on both pages, I know how to call/reuse python script which written already, and in a similar manner, I would like to re-use JS Function.

Is your JS on page 1 in a text area? If so, you can create a reusable script, just like IPython in Spotfire. To do this, edit the HTML where you want JS (you need to have a text area somewhere), then select insert JavaScript. You can create a new script here that can be called across the entire document.

Related

Javascript: are some things too simple to link externally? [duplicate]

This question already has answers here:
When to use onclick in HTML?
(3 answers)
Closed 4 years ago.
I'm really new to JavaScript. So this might be a basic question? I would just like some explanation, if possible.
I'm working on some web development that has JS. However, I have the requirement that all files (JS and CSS) have to be linked through external sheets, and with complex functions that makes sense, but with some of the simple JS I'm a little confused as to what that means.
With CSS, you can do inline styling, or in the header in style tags, or in an external sheet. There are some JS interactions where I can't tell if it has to be where it is, or if there is a way to move it to an external sheet.
For Example, this basic "bulb on/off"
The js here is onclick=document.getElementById(...) (Changing an image by clicking on it/on a button)
Is this kind of code stuff that can even go in an external sheet? is my internal analogy of inline/tags/external CSS fitting to apply to Javascript, too, or does JS work differently? I just don't want to get counted off for not having stuff in the right place.
What you need to understand is that the "scope" of what you are working with when you use JavaScript, is the user's viewport. Internally represented as a tree of objects which we call the DOM (document object model). The browser fetches these external sheets, JavaScript files, html etc. and then loads them into the DOM.
JavaScript is all about just one thing: manipulating the DOM.
Depending on when your JavaScript is executed, it will manipulate the DOM in the state it is in at that exact moment.
The usual moment that programmers choose to execute their code is right after DOM-ready. This is a moment in time after which all external pieces of code/styling etc. have been fetched and initialized into the DOM, therefore allowing you to be sure, that your code is working against the full scope of content that you'd also see while browsing the page right after it loads.
Zooming in on your question about placing code in an external file: sure, its possible. As at one point this file would be imported and loaded into the DOM. The code inside would be executed at the point where this file is loaded, or when you hook into the DOM-ready event to start up the code inside this file.
You have a legitimate question here (apologies for the opinion - but good on you for giving it a go!).
This is from the Mozilla developer page (https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/JavaScript_basics)
Next, in your index.html file enter the following element on a new
line just before the closing tag:
<script src="scripts/main.js"></script>
This is basically doing the same job as the element for CSS — it applies the JavaScript to the page,
so it can have an effect on the HTML (along with the CSS, and anything else on the page).
In your sample code you wrote onclick=document.getElementById(...).
This should actually be written as
onclick=function() {
document.getElementById(...)...
}

How to run on the page typed js

I'm currently working on a project which requires me to run by the user typed javascript in the form of a string.
I've tried adding an empty <script> tag to the html and appending the string (containing the users freshly typed (after the page was loaded) javascript) to this script tag but this doesn't work. (since the code inside the script tag will be run immediately after the page is loaded).
So I tried a different approach. I wrapped the js string inside of a function like so:
function runCode() { userString }
This is what the string I now append to the empty script tag looks like:
var code = "function runCode() { "+ userString +" }"
However this still doesn't work. The code (userString) shows up in the script tag according to the chrome dev tools, but trying to run the function causes the following error:
Uncaught ReferenceError: runCode is not defined
Does somebody know how this works? What is the proper way for me to do this?
Some background:
The project I'm working on is an online tool to draw using js. The goal here is to use the two.js library and link it to a modified textarea. (codemirror) Clicking the button will take your typed in code and use it to modify the two.js canvas on the other half of the screen.
This will make it easier to draw using the library, since you don't have to set up all the html, css and js files yourself, but instead you can focus on the code.
Note: The js you type into the textarea can by any valid js, so simple things as alerts, or even jQuery lines will work just fine.
Use eval() function.
However be aware that this is by design a HUGE hole of security.
You have to use eval(). Extract the user input from an onclick event and pass it into eval like so:
eval(userString)

PHP / Javascript - how to locate suitable place for code?

I'd like to modify WP plugin's code.
This plugin dynamically creates table, assigns color to cells of this table.
I'd like to put a JavaScript code in this plugin, so the color of cells with a certain text inside is changed.
I have the code, it should work as it has been tested before.
I just don't know where to put this code to make it work. I tried to put it in the PHP file which creates the table but code in this file is not ended with "?>" which I suppose means that somewhere else is the rest of the code which is being added in the proces of creating the table.
It's possible that the table is being loaded via AJAX.
I have access to all the files so I can provide if necessary.
Would anyone be so kind and helped me locate suitable place for my code?
To add more javascript functionality to the third party plugin you should add your additional javascript code with wordpress' own function wp_enqueue_script. Somewhere in the third party plugin code the plugin is initialized. There you can add your file with the additional javascript code.

How do I use small html markup repeatedly?

I am working on standalone JavaScript application which is being coded in HTML 5.
It has almost 50-60 html pages including repetitive markup such as header, footer and nav.
But if I have to make change in header then I have to make changes in 56-60 pages.
Is there any solution to use reusable html markup so if I did changes in one page it will reflect to other pages?
I can't even use php.
Prepare one javascript function. Write your html elements through javascript or jquery function. run it in page load event. and call the function in html by div.
Put this javascript function in separate .js file. And call this js file in wherever you want. And just place the div wherever you want in the html page.
See this jsfiddle DEMO
I Hope this demo will useful to you in this situation.
If you are using HTML (.html) pages and do not have Server-Side-Includes option then you can use a JavaScript template (which is not too difficult).
Second option : use of iframe.
Write the whole javascript code in common_layout.js
Add every statement using id of that div and add this file with main layout.
$( document ).ready(function() {
$('#header').html('<b>Header</b><ul><li>First Link</li><li>Second Link</li></ul> ');
});
UPDATE: One of my favorite post from TutsPlus : Best practices when working with JS Templates
If you are just started with this application. You can think of using client side java script frameworks like - AngularJS. It would be lot easier to maintain the code and solve such trivial issues.
You can use object tag like this:
<object name="header" type="text/html" data="header.html"></object>

Inserting Text Into HTML

What I Want: Very simply I have a C program that generates a variable periodically, I want to be able to display this value on a website.
Restrictions: The webpage is HTML, php does not work, javascript does [I have tried a few javascript solutions but they have all been long, tedious and in the end ineffective] I want it to be able to format the text so that it matches the rest of the webpage. Above all I'd really like to find something simple that works.
Freedoms: I can output the variable from my C program to just about any file type and content that I want, the file is hosted so is available locally to the server or online for the client.
Preferred Solutions: I am currently playing around with the object and iframe tags native to html. They give a nice simple input:
<object height=20 width=75 type='text/plain' border=0 data="URL/filename.txt"></object>
inserts the contents of my file, but it can't be formatted so I am stuck with 12pt Courier font which is not acceptable. Using
<iframe seamless height=20 width=75 scrolling='no' src="URL/filename.htm"></iframe>
and adding my desired font/colour/size etc to the htm file gets me the right text style, but htm has a large amount of white padding around it which I can't seem to get rid of so I have to make my iframe quite large for the text to be displayed, but then it doesn't fit smoothly with other text.
So anyone that can answer one of four questions:
How to remove excess padding from htm
How to format the style of a html object
Is there anything in Java as simple as the php [so apparently it doesn't show php code even when you quote it as code. But basically using echo and get_file_contents to insert the contents of a txt file into a html page]
Propose an alternate solution
Padding and style can be handled by css.
By java I assume you mean javascript - google-ing will help you. Without details of what your server is running and what is dispatching your pages we can't give you an exact answer. You might want something with ajax to keep it updating in the background.
Try googling your question, you'd be surprised how often this helps.
I'm not sure what you're trying to do once you get the variable into your web page, but I think something like the following could be useful.
Create a hidden div on your page
Have your C application write the variable to some file
Use jquery to execute an ajax call to pull that value into the div ( or whatever other container you want to use
using some type of timer, execute the ajax call every X period of time, which will then get your up to date variable
on your main page, have another timer that will then come in to that container, grab your value and then you are free to do what you want with it.
This is all off the top of my head without knowing much about what you're trying to accomplish. If you provide some further details we may be able to help you a little more.
You need AJAX... that's just a fancy buzz-word. It means you can tell JavaScript can get a file from the server without reloading the page and you can insert data from that file into your HTML.
AJAX is made much simpler by using a JavaScript library like jQuery, but it can be done without jQuery. There's a pretty decent Getting Started tutorial at Mozilla Developer Network if you want to do it the hard way, but I really recommend jQuery.
As far as formatting... any formatting... you need to use CSS. Just about everything about the appearance of anything on a web page is controlled by CSS. MDN has a Learn CSS section, too.
load jquery on you main html file
put a div with some id (example id="newvalue")
make you c program to write the output in a file (for example value.html)
on main html page header, after jquery include code add some javascript like
$( document ).ready(function() {
$("#newvalue").load('yoursiteurl/value.html');
});

Categories

Resources