Dynamic sorted gamestudio manual

Posted By: KDuke

Dynamic sorted gamestudio manual - 02/16/10 07:08

Hello people. I somehow got fedup with the navigation-structure of the Online Manual so I wrote a small javascript-Tool which rebuilds the navigation structure dynamically and provides a foldable navigation.

I tested it successfully with Firefox 3.6, 3.0.15, 2.0.0.20 and Internet Explorer 8 which works flawlessly.

Follow this link for the guide

Now you should be able to unfold and fold the menus by clicking on the book-images in front of the links.

Here is the code again in readable form.
Code:
function AttachEvent(obj,evt,fnc,useCapture){
	if (!useCapture) useCapture=false;
	if (obj.addEventListener){
		obj.addEventListener(evt,fnc,useCapture);
		return true;
	} else if (obj.attachEvent) return obj.attachEvent("on"+evt,fnc);
	else{
		MyAttachEvent(obj,evt,fnc);
		obj['on'+evt]=function(){ MyFireEvent(obj,evt) };
	}
} 


function CreateTree(TreeData, Level) {
 var Counter = 0;
 var SearchString = '\\n';
 for(Counter = 0; Counter < Level; Counter++) {
  SearchString += '\\s\\s\\s';
 }
 SearchString += '\\<';
 var RegularExp = new RegExp(SearchString, '');
 var NewTree = TreeData.split(RegularExp);
 var Length = NewTree.length;
 
 var SearchString = '\\n';
 for(Counter = 0; Counter < Level+1; Counter++) {
  SearchString += '\\s\\s\\s';
 }
 SearchString += '\\<';
 RegularExp = new RegExp(SearchString, '');
 
 for (Counter = 0; Counter < Length; Counter++) {
  if(typeof(NewTree) == 'object') {
   if(NewTree[Counter].charAt(0) != '<') {
    NewTree[Counter] = '<'+NewTree[Counter];
   }
   if(NewTree[Counter].match(RegularExp)) {
    NewTree[Counter] = CreateTree(NewTree[Counter], Level + 1);
   }
  } else {
   if(NewTree.charAt(0) != '<') {
    NewTree = '<'+NewTree;
   }
  }
 }
 return NewTree;
}

function genTreeHTML(Tree, Level) {
 var Output = '<ul style=\'display:none\' class=\'Cat'+Level+'\' id=\'Cat'+Level+'\'>';
 var Element;
 var Counter = 0;
 for(Counter = 0; Counter <  Tree.length; Counter++) {
  if(typeof(Tree[Counter]) != 'object') {
   Output += '<li class=\'Ebene'+Level+'\' id=\'Menu'+Level+'.'+Counter+'\'>'+Tree[Counter]+'</li>';
  } else {
   Output += '<li class=\'Ebene'+Level+'\' id=\'Menu'+Level+'.'+Counter+'\'>'+Tree[Counter][0];
   Tree[Counter].splice(0,1);
   Output += genTreeHTML(Tree[Counter], Level+'.'+Counter)+'</li>';
  }
 }
 Output += '</ul>';
 return Output;
}

function HandleMouse(evt) {
	var pointer;
	if(evt.target) { var MyTarget = evt.target;}
	else { var MyTarget = evt.srcElement;}
	if(MyTarget.tagName == 'IMG') {
		var MenuTarget = MyTarget.parentNode.lastChild;
		if(MenuTarget.tagName == 'UL') {
			if(MenuTarget.style.display == 'none') {
				MenuTarget.style.display = 'inline';
			} else {
				MenuTarget.style.display = 'none';
			}
		}
	} 
}

function GenTree() {
	var Test = document.getElementsByName('menue')[0];
	var UsingIE = false;
	if(Test.contentDocument != null) {
		Test = Test.contentDocument;
	} else {
		Test = Test.contentWindow.document;
	}
    
	var MyStyle = document.createElement('link');
	MyStyle.setAttribute('type','text/css');
	MyStyle.setAttribute('rel','stylesheet');
	MyStyle.setAttribute('href','http://gpi-studios.com/3dgs/gsdynmenu.css');
	Test.getElementsByTagName('head')[0].appendChild(MyStyle);
	var preObj = Test.getElementsByTagName('pre')[0];
	var MyTree = CreateTree(preObj.innerHTML, 0);
	var MenuContainer = Test.createElement('div');
	MenuContainer.setAttribute('id','Menu');
	Test.body.appendChild(MenuContainer);
	preObj.style.display = 'none';
	Test.getElementById('Menu').innerHTML = genTreeHTML(MyTree, '0');
	AttachEvent(Test, 'click', HandleMouse, false);
	Test.getElementById('Cat0').style.display = 'inline';
}



Please let me know how it works for you.

PS: I hope this is the right forum for this. If not please move it to a more appropriate place.

greetings
K-Duke
Posted By: Pappenheimer

Re: Dynamic sorted gamestudio manual - 02/16/10 14:32

Like this?

"http://conitec.net/beta/javascript:"

I tried different ways, but I can't get it working. I always get something like "OMG - You broke the internet.."
I tried it with Netscape, Firefox and Explorer, nothing worked.
I never could paste more than one line in the adress row.
I have Win XP. Do I need to have anything special installed?
Posted By: darkinferno

Re: Dynamic sorted gamestudio manual - 02/16/10 14:42

i tried and did see a format change but wasnt exactly sure what i was to be looking for though laugh
Posted By: TheThinker

Re: Dynamic sorted gamestudio manual - 02/16/10 16:20

I like it.

Firefox 3.6 - no problems
Posted By: Pappenheimer

Re: Dynamic sorted gamestudio manual - 02/16/10 16:46

Firefox 3.0.15 doesn't work, too. At least I can see the whole code in the adress row now.
Posted By: PigHunter

Re: Dynamic sorted gamestudio manual - 02/16/10 16:59

Nice. Working here, Firefox 3.6. Thank you!
Posted By: KDuke

Re: Dynamic sorted gamestudio manual - 02/16/10 18:20

Maybe I didn't explain it quite well. Well I made a small "guide" on using this. I had to put it onto my webserver as a small html-page as the array operators '[' and ']' don't allow me to put the code into ubb url tags here.

Follow this link for the guide

I as well edit the first post to include that.

For those this doesn't work would you please give me a description of what happens on you and which browser you are using as well as its version.
I will try to make this work for every browser.

EDIT: Oh yeah! Please give critics (positive and negative) as well as suggestions for further features. But cross-browser compatabilty is my highest priority right now.
Posted By: Rei_Ayanami

Re: Dynamic sorted gamestudio manual - 02/16/10 18:54

Firefox 3.57.4 - Works laugh
Posted By: Cowabanga

Re: Dynamic sorted gamestudio manual - 02/16/10 19:29

Firefox 3.6, works perfectly. Thanks! laugh
Posted By: Pappenheimer

Re: Dynamic sorted gamestudio manual - 02/16/10 21:18

It works with the last instructions, via bookmark. At least it seems, because I don't see the difference, and therefor the advantage.
But, I'll take a closer look as soon as I have more time.
What do you mean by 'foldable navigation'?
Posted By: KDuke

Re: Dynamic sorted gamestudio manual - 02/16/10 23:49

foldable navigation video
Posted By: KDuke

Re: Dynamic sorted gamestudio manual - 02/17/10 20:22

OK people. I updated the code now and additionally tested it with Firefox 2.0.0.20, Firefox 3.0.15 as well as Internet Explorer 8 which has a minor css issue with the first item being indented. Let me know how it works for you!
Be sure to update your bookmark for the script as well when trying.

For those of you who are more security conscious consider downloading the script from http://gpi-studios.com/3dgs/gsdynmenu.js and substitute the url in the bookmarklet with "file:///<absolute path to where you put the script>"
Posted By: Germanunkol

Re: Dynamic sorted gamestudio manual - 02/23/10 20:54

You asked for critique:
Working very well here, and it's a cool idea. I had no clue you could do something like that. What I'd really like though is a good search function, one that searches the topics' headings and contents, and sorts the hits according to relevance (with those hits that have the word in the heading having a higher relevance).
That would be cool...
Posted By: KDuke

Re: Dynamic sorted gamestudio manual - 03/01/10 20:20

Hi Germanunkol. Well I can try to implement that. Should be pretty feasible by simply using ajax-requests and would be pretty fast if everything is preloaded when starting the script.

I'll give a post as soon as I got some advancement on this.
© 2023 lite-C Forums