I produced a manual for my Eclipse RCP application using Eclipse help system.
I would like to export this documentation as a browsable offline html documentation.
To do so, I used Eclipse export function from Help System at runtime which produced a plain HTML file with table of content in the top of the document.
My question is, is there an automatic way of separating the table of contents and the contents itself?
Example, specifying an Iframe that use this single document and specify src attribute from the beginning of the document to the end of the table of contents, and a second Iframe with same plain html document as src but which would begin at the beginning of the contents.
For instance, using two iframes, the left hand one for the table of contents and the right hand one for the contents.
I could do it manually or implement a parser using jdom but if you know a better solution...
I also thought about enclosing the whole HTML document with a table with a single row and two columns, one for the table of contents and one for the contents but the bad point is that when selecting an entry in the table of contents, both "sides" will scroll I think. I would like the two parts to be decorrelated, fixed table of contents with a vertical slider if needed and contents in the right part.
Best regards,
Christophe.
Related
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');
});
I have a widget (some html code) that should be loadable on different Websites (which are not under my control) but the widget is hosted on my server.
Until now I had a PHP Script producing javascript code looking someting like this:
document.write('<div> ... some more dynamic html ...</div>');
which then could be loaded on any html page with the tag.
Now I'm planing a redesign and want to do the PHP part with server-side javascript. Do I still need to output document.write() or is there a more clever way now days, as we have handlebarjs, node.js etc. Also: I'd be interested I those new fancy autoupdate features frameworks like meteor or derby provide...
(I wanted to use meteor (meteor.com) to do the job but meteor outputs full html pages and I do not need a whole page)
Thank you for your help/sugestions
Now I'm planing a redesign and want to do the PHP part with server-side javascript. Do I still need to output document.write()
You have to output something that will cause the content to be rendered on the client.
The client side code will be more or less independent of the server side code (although you might get some cross-over if you start using tools such as mojito.
or is there a more clever way now days, as we have handlebarjs, node.js etc.
node.js won't help with what you output, since it is a server and the JS to modify the page has to run in the browser.
You could use a template language like handlebarjs. You could use a library to aid DOM manipulation. The problems are that the more code you load (libraries included), the more likely you are to clash with something used by the third party websites upon which your code is embedded, and the heavier you make their pages (and large increases in page weight are a particularly poor idea for secondary content).
When you want to add a new div to an existing HTML document, you should do so by inserting a new HTML element into the document tree.
// create a new div
var newDiv = document.createElement('div');
// put some text into it
newDiv.innerHTML = 'Hello World!';
// the div won't be displayed yet, because it only exists as a
// variable in limbo outside of the HTML document tree. We need
// to insert it into the document.
// First, we get the HTML node where it should be inserted
var parentDiv = document.getElementById('id_of_the_div_where_the_new_div_belongs_into');
// then we put it into that div
parentDiv.appendChild(newDiv);
When you want to insert the div at the end of the page (useful when the script is supposed to work on many different pages you have no control over) you can also insert document.appendChild().
When the new div doesn't just contain text but also other HTML nodes, you should also create those with document.createElement and attach them to the newly created div with appendChild.
Take a look on these: document.createElement, documentFragment
What I want is to be able to work on context-free HTML elements surrounding 'entry points' (like <script> tags or events) using JavaScript. I have some tight restrictions on what I can do.
Summary
I have multiple user-generated blocks of HTML which need to be processed on their own, as they load.
The content of these blocks can contain similar blocks, with similar behaviour.
The content will also need to be duplicated once, possibly restarting execution of the scripts mentioned in 2.
These blocks are generated from static templates and cannot (initially) contain unique identifying data, like IDs or random attribute values.
These blocks can also be generated through AJAX, which is out of my control. They will need to take care of themselves as they appear, without relying on any order of execution.
Background
This is for a forum software, where certain BBCode tags, say [tag]content[/tag] are replaced with fixed HTML. I have no access to any server-side scripting, so the replacements are context-independent, i.e. always the same.
For example, [tag]{content}[/tag] would turn into something like:
<span ...>
...
{content}
...
<!-- script entry point -->
</span>
I need to do some client-side processing around the time when the data is loaded.
I cannot change the requirements of the problem. The end product is code for generating tabs, like:
[tabspace]
[tab]content 1[/tab]
[tab]
content 2, and
nested tabs:
[tabspace]...[/tabspace]
[/tab]
[/tabspace]
The content that is output by the script consists in the "tab buttons" themselves, which would link to their respective content.
Restrictions
I cannot use IDs. Everything must be or start as a context-free replacement of the template.
[tag]s can be nested.
The script needs to duplicate some of the content, parts of which can be similar scripts and so on. This messes up scripts which are already running on the outer pairs of tags. I have a bottom-up solution to solve this, but it relies on starting scripts at any depth without worrying about similar surroundings. (another way to phrase it)
These tags can be loaded dynamically in any post on the page, at any time, using AJAX.
There can be scripts at any point in the template, to make the problem easier.
What I tried
Using JS to dynamically output a <span id='something random'></span> as it loads, search for the given ID and use its location to find the surrounding elements. It doesn't work when I load pages dynamically and when tags are nested.
Give a class to the surrounding element and find the last element of its kind. This doesn't work because we may have updates in the middle of the page, after it's loaded.
Solutions which I'd rather avoid
Using <img src='bogus' onerror='script entry point'/>, I can run a script and access surrounding tags using this. But I'd rather not use broken links and errors to solve a simple and pertinent problem.
I have a XML which works with an XSLT file that transforms the XML into a table on an HTML page.
I need to be able to update this table based on what the user selects from a drop down. Two options:
send new parameters to XSLT processor, re-transform, clear old HTML content, places new HTML content; do this every time drop down changes value
use javascript function to navigate HTML code directly and unhide/hide table data cells.
What would be better performance-wise?
EDIT: basically trying to apply filters
The second option. There's a difference between modifying HTML and modifying serialized DOM. If you clear the DOM and give the browser a new HTML string to replace it with, it will have to serialize that HTML into DOM. If you use JavaScript to modify parts of the DOM, then not only will you skip that step, but you'll be taking advantage of optimisations in the rendering engine that restrict re-layouts to affected elements in the DOM, rather than the entire document.
I want to know if there is some way to create an independent HTML block .
For more explanation :
My problem is that I have a webpage in which I allow some users can add content (may contain HTML & CSS )
I allow them to add their content inside a certain block , but sometimes their content may not be clean code , and may contain some DIVS with no end , Or even some DIV end with no starting DIV
This sometimes distort my page completely
Is there any way to make their content displayed independently from my parent div , so that my div is first displayed well , and then the content inside it is displayed ?
I'm sorry for long message .
Thanks for any trial to help
sometimes their content may not be clean code , and may contain some
DIVS with no end , Or even some DIV end with no starting DIV This
sometimes distort my page completely
The easiest solution for you is going to be to add the submitted content to your page inside an <iframe>. That way, it doesn't matter if the submitted HTML is invalid.
If you have to worry about users possibly submitting malicious content (such as JavaScript), the problem becomes much harder: you need to sanitize the HTML. I can't tell you how to do this without knowing what server-side language you're using.
My problem is that I have a webpage in which I allow some users can add content (may contain HTML & CSS ) I allow them to add their content inside a certain block , but sometimes their content may not be clean code , and may contain some DIVS with no end , Or even some DIV end with no starting DIV This sometimes distort my page completely
If that is the problem you are trying to solve, then having some markup to say a chunk of code was independent wouldn't help: They might include the "End of independent section" code in the HTML.
If you want to put the code in a page, you need to parse it, sanitise it (using a whitelist) to remove anything potentially harmful and then generate clean markup from the DOM.
you could use Static iframes.
check this out http://www.samisite.com/test-csb2nf/id43.htm
The safest way is to restrict the tags they can submit, and validate/sanitize those that they do, similar to the way we can use markup on here.
Having unchecked HTML injected into your page is asking for trouble.
Failing that, good old iframe will do the trick.
Okay, i belive there is something you can do, but it can require some time. You can use a parser to go through the users html, and get the tags and their content, and recreate the html making it clean.
But, as there are a lot of tags that can be used, or even invented tags, than you can limit the tags that the user are able to use in their html. You put a legend with the acceptable tags.
There are some pretty good html parsers for php, but they may break for some very bad html code, so this is why i suggest you just recreate it based on the parsing with a limited subset of acceptable tags.
I know it's a difficult/time consuming solution, but this is what i have in mind