CHM-Like HTML Interface

~ · Post by ~ » Tue Apr 03, 2007 7:55 am

Combuster wrote: @ ~: maybe your imaginary scheme is somewhere down here. If you comment on that we might get a better idea about what you want:
http://wiki.openttd.com/index.php/Development:Main_Page
http://www.postgresql.org/docs/8.2/inte ... index.html
http://www.tortall.net/projects/yasm/re ... files.html
http://java.sun.com/j2se/1.4.2/docs/api/

Well, if you could please give me an advice to a puntual topic you'd like explained in a tutorial-like fashion to demonstrate what I mean. Or, by default, I plan to make a tutorial about Unreal Mode to make a comment on it.

bubach · Post by **bubach** » Thu Apr 05, 2007 9:41 am

is dond't even work for me (IE7), try this:

Code: Select all

<html> 
<head> 
<style type="text/css"> 
   ul ul {display: none} 
   li a {position: absolute; text-decoration: none; margin-left: -30px} 
</style> 
<script language="JavaScript"> 
function check(obj) 
{ 
   var node = obj.parentNode; 
   if (node.childNodes.length > 0) 
   { 
      for (i in node.childNodes) 
      { 
         if ((node.childNodes[i].nodeName != '#text') && (node.childNodes[i] != obj)) 
         { 
            if (node.childNodes[i].style) 
            { 
               if ((node.childNodes[i].style.display == 'none') || (node.childNodes[i].style.display == '')) 
               { 
                  node.childNodes[i].style.display = 'block'; 
                  obj.innerHTML = '-'; 
               } else 
               { 
                  node.childNodes[i].style.display = 'none'; 
                  obj.innerHTML = '+'; 
               } 
            } 
         } 
      } 
      return false; 
   } 
} 
</script> 
</head> 
<body> 
   <ul id="menu"> 
      <li>Ett</li> 
      <li><a href="#" onclick="check(this);">+</a>Tralalalalala 
         <ul> 
            <li>Två.Ett</li> 
            <li>Två.Två</li> 
            <li><a href="#" onclick="check(this);">+</a>lalalalaal 
               <ul> 
                  <li>Två.1.Ett</li> 
                  <li>Två.1.Två</li> 
                  <li>Två.1.Tre</li> 
               </ul> 
               <ul style="list-style-type: disc"> 
                  <li>Ett.2.Ett</li> 
                  <li>Två.2.Två</li> 
                  <li>Två.2.Tre</li> 
               </ul> 
            </li> 
         </ul> 
      </li> 
      <li>Tre</li> 
   </ul> 
</body> 
</html>

~ · Post by ~ » Thu Apr 05, 2007 10:32 am

What do you say? The HTML interface I have exposed doesn't work with Internet Explorer 7??????

That's bad, I don't have it, and cannot test it by now, but it should work in older Internet Explorer and Firefox.

Brynet-Inc · Post by **Brynet-Inc** » Thu Apr 05, 2007 10:44 am

Who in their right mind would use IE anyway?

Windows users are sad... so many (CSS/Javascript.. HTML even..) hacks required for the non-standards complaint browser named Internet Explorer..

I simply block the browser entirely on my sites..

bubach · Post by **bubach** » Thu Apr 05, 2007 1:04 pm

I started using IE7 becasue it has a nicer interface then FF. I admit that IE6 is crap, but IE7 is actually much better, even with w3c standards.

edit: hmm, i must have misunderstood how it's supposed to work, it looks the same in IE6 and FF. i wouldn't call that a collapsable tree, it's just a long list of links to js-popups ?

~ · Post by ~ » Thu Apr 05, 2007 1:23 pm

It's intended to reference anything, from files to websites and HTML files, files to be seen with plugins (like PDF, if configured so), and also Javascript functions, although it could not work and anyway it's not so important.

See the purple closed book icon? If you click its text it will expand, and show further content, and if you click its text again, it will collapse.

If you recall the way traditional "compiled HTML" CHM files work, it's the very same idea from the graphical interface point of view, but with the expected advantage of being able to be seen without actual support for CHM files, and over the web, to be browsed portably under any OS with a standard web browser.

As you can see, the first links (the ones with custom icons) reference their respective websites. The favicons need to be stored locally in the server in which this interface is being used. I have tested it extensively and it works, at least in IE6 and Firefox.

ehird · Post by **ehird** » Sat Apr 07, 2007 6:14 am

Well... tons of people have reinvented CHM in JS...

~ · Post by ~ » Sat Apr 07, 2007 6:29 am

ehird wrote:Well... tons of people have reinvented CHM in JS...

and none of them have explained their methods nicely, as far as I know, to learn what they are doing.

I indeed have explained the logic of that program in detail, and will make it public as soon as I have enough time to brush that program up.