Sitemap: Baum aufklappen

[Andreas]

Hallo, habe hier ein Javascript (nicht von mir) das mir eine Sitemap aufbaut. klappe ich den Baum auf und klicke auf einen Eintrag, wird der Eintrag geladen, aber jedesmal wird ja der Baum auch neu geladen. Also müsste man den Baum aufklappen können, je nach Parameter im Link. Oder hat mir jemand ein Tipp für ein anderes Script wo dies schon enthalten ist? Hier mal das Script. Ist zwar ein bisschen lang aber ohne bringt es wohl wenig Hoffe es kommt einigermaßen strukturiert rüber.

Gruß Andreas

[code]   window.onError=null;

var idx=0   var treeId = new Array();   var treeP_id = new Array();   var treeIsOn = new Array();   var treeTyp = new Array();   var treeName = new Array();   var treeUrl = new Array();   var treeWasOn = new Array();   var treeDeep = new Array();   var treeLastY = new Array();   var treeIsShown = new Array();

function Note( id,p_id,name,url ) {     treeId[ idx ] = id     treeP_id[ idx ] = p_id     treeIsOn[ idx ] = false     treeTyp[ idx ] = 'f'     treeName[ idx ] = name     treeUrl[ idx ] = url     treeWasOn[ idx ] = false     treeDeep[ idx ] = 0     treeLastY[ idx ] = 0     treeIsShown[ idx ] = false     idx++   }

function initDiv ( )   {     if ( isDOM || isDomIE )     {       divPrefix='<DIV CLASS="SiteMap" style="position:absolute; left:2; top:0; visibility:hidden;" ID="SiteMap'       divInfo='<DIV CLASS="SiteMap" style="position:absolute; visibility:visible" ID="SiteMap'     }     else     {       divPrefix='<DIV CLASS="SiteMap" ID="SiteMap'       divInfo='<DIV CLASS="SiteMap" ID="SiteMap'     }     document.writeln( divInfo +  'info">Bitte haben Sie etwas Geduld.<BR>&nbsp;<BR>Es werden die Eintr&auml;ge aus<BR>&nbsp;<BR>der Datenbank initialisiert.</DIV> ' );

for ( var i=1; i<idx; i++ )     {       // linked Name ?       if ( treeUrl[i] != '' )         linkedName = '<A HREF="' + treeUrl[i] + '" TARGET="' + defaultTarget + '">' + treeName[i] + '</A>'

else         linkedName =  '<A HREF="javascript:SiteMapClick(' + treeId[i] + ')">' + treeName[i] + '</A>'       // don't link folder icon if node has no sons       if ( i == idx-1 || treeP_id[i+1] != treeId[i] ) {         if ( treeDeep[ i ] == 0 )           folderImg = '<IMG ALIGN="BOTTOM" SRC="SiteMap/file_empty.gif" BORDER="0" HEIGHT="16" WIDTH="1" HSPACE="0">'         else           folderImg = ''       } else {         folderImg = '<A HREF="javascript:SiteMapClick(' + treeId[i] + ')"><IMG ALIGN="BOTTOM" SRC="SiteMap/folder_off.gif" BORDER="0" NAME="folder' + treeId[i] + '" HEIGHT="16" WIDTH="30" HSPACE="0"></A>'       }       // which type of file icon should be displayed?       if ( treeP_id[i] != 0 )       {         if ( lastEntryInFolder( treeId[i] ) )           fileImg = '<IMG ALIGN="BOTTOM" SRC="SiteMap/file_last.gif" BORDER="0" NAME="file'             + treeId[i] + '" HEIGHT="16" WIDTH="30" HSPACE="0">'         else           fileImg = '<IMG ALIGN="BOTTOM" SRC="SiteMap/file.gif" BORDER="0" NAME="file'             + treeId[i] + '" HEIGHT="16" WIDTH="30" HSPACE="0">'       }       else         fileImg = ''       // traverse parents up to root and show vertical lines if parent       // is not the last entry on this layer       verticales = ''       for( var act_id=treeId[i] ; treeDeep[ id2treeIndex[ act_id ] ] > 1;  )       {         act_id = treeP_id[ id2treeIndex[ act_id ]]         if ( lastEntryInFolder( act_id ) )         { verticales = '<IMG ALIGN="BOTTOM" SRC="SiteMap/file_empty.gif" BORDER="0" HEIGHT="16" WIDTH="30" HSPACE="0">' + verticales         }         else         { verticales = '<IMG ALIGN="BOTTOM" SRC="SiteMap/file_vert.gif" BORDER="0" HEIGHT="16" WIDTH="30" HSPACE="0">' + verticales         }       }

document.writeln( divPrefix + treeId[i] + '"><NOBR>&nbsp;' + verticales + fileImg + folderImg + linkedName + '</NOBR></DIV><BR>'    )     }   }

function initStyles ( )   {     document.writeln( '<STYLE TYPE="text/css">' + "\n" + '<!--' )     for ( var i=1,y=y0; i<idx; i++ )     {       document.writeln( '#SiteMap' + treeId[i] + ' {POSITION: absolute; VISIBILITY: hidden;}' )       if ( treeIsOn[ id2treeIndex[ treeP_id[i] ] ] )         y += deltaY     }     document.writeln( '#SiteMapinfo {POSITION: absolute; VISIBILITY: visible;}' )     document.writeln( '//-->' + "\n" + '</STYLE>' )   }

function SiteMapClick( id )   { var i = id2treeIndex[ id ]

if ( treeIsOn[ i ] )     // close directory     {       // mark node as invisible       treeIsOn[ i ]=false       // mark all sons as invisible       actDeep = treeDeep[ i ]       for( var j=i+1; j<idx && treeDeep[j] > actDeep; j++ )       { treeWasOn[ j ] = treeIsOn[ j ]         treeIsOn[ j ]=false       }       gif_off( id )     }     else     // open directory     {       treeIsOn[ i ]=true       // remember and restore old status       actDeep = treeDeep[ i ]       for( var j=i+1; j<idx && treeDeep[j] > actDeep; j++ )       { treeIsOn[ j ] = treeWasOn[ j ]       }       gif_on( id )     }     showTree()   }

function knotDeep( id )   { var deep=0     while ( true )       if ( treeP_id[ id2treeIndex[id] ] == 0 )         return deep       else       { ++deep         id = treeP_id[ id2treeIndex[id] ]       }     return deep   }

function initTree( id )   { treeIsOn[ id2treeIndex[id] ] = true     if ( treeTyp[ id2treeIndex[id] ] != 'b' )       gif_on( id )     while ( treeP_id[ id2treeIndex[id] ] != 0 )     { id = treeP_id[ id2treeIndex[id] ]       treeIsOn[ id2treeIndex[id] ] = true       if ( treeTyp[ id2treeIndex[id] ] != 'b' )         gif_on( id )     }   }

function lastEntryInFolder( id )   { var i = id2treeIndex[id]     if ( i == idx-1 )       return true     if ( treeTyp[i] == 'b' )     { if ( treeP_id[i+1] != treeP_id[i] )         return true       else         return false     }     else     { var actDeep = treeDeep[i]       for( var j=i+1; j<idx && treeDeep[j] > actDeep ; j++ )       ;       if ( j<idx && treeDeep[j] == actDeep )         return false       else         return true     }   }

function showTree()   { for( var i=1, y=y0, x=x0; i<idx; i++ )     { if ( treeIsOn[ id2treeIndex[ treeP_id[i] ] ] )       {         // show current node         if ( !(y == treeLastY[i] && treeIsShown[i] ) )         { showLayer( "SiteMap"+ treeId[i] )           setyLayer( "SiteMap"+ treeId[i], y )           treeIsShown[i] = true         }         treeLastY[i] = y         y += deltaY       }       else       {         // hide current node and all sons         if ( treeIsShown[ i ] )         { hideLayer( "SiteMap"+ treeId[i] )           treeIsShown[i] = false         }       }     }   }

function initIndex() {     for( var i=0; i<idx; i++ )       id2treeIndex[ treeId[i] ] = i   }

function gif_name (name, width, height) {     this.on = new Image (width, height);     this.on.src = "SiteMap/" + name + "_on.gif"     this.off = new Image (width, height);     this.off.src = "SiteMap/" + name + "_off.gif"   }

function load_gif (name, width, height) {     gif_name [name] = new gif_name (name,width,height);   }

function load_all () {     load_gif ('folder',30,16)     file_last = new Image( 30,16 )     file_last.src = "SiteMap/file_last.gif"     file_middle = new Image( 30,16 )     file_middle.src = "SiteMap/file.gif"     file_vert = new Image( 30,16 )     file_vert.src = "SiteMap/file_vert.gif"     file_empty = new Image( 30,16 )     file_empty = "SiteMap/file_empty.gif"   }

function gif_on ( id ) {     eval("document['folder" + id + "'].src = gif_name['folder'].on.src")   }

function gif_off ( id ) {     eval("document['folder" + id + "'].src = gif_name['folder'].off.src")   }

// global configuration   var deltaX = 3   var deltaY = 16   var x0 = 5   var y0 = 215   var defaultTarget = '_self'

var browserName = navigator.appName;   var browserVersion = parseInt(navigator.appVersion);   var isIE = false;   var isNN = false;   var isDOM = false;   var isDomIE = false;   var isDomNN = false;   var layerok = false;

var isIE = browserName.indexOf("Microsoft Internet Explorer" )==-1?false:true;   var isNN = browserName.indexOf("Netscape")==-1?false:true;   var isOpera = browserName.indexOf("Opera")==-1?false:true;   var isDOM = document.getElementById?true:false;   var isDomNN = document.layers?true:false;   var isDomIE = document.all?true:false;

if ( isNN && browserVersion>=4 ) layerok=true;   if ( isIE && browserVersion>=4 ) layerok=true;   if ( isOpera && browserVersion>=5 ) layerok=true;

function hideLayer(layerName) {     if (isDOM)       document.getElementById(layerName).style.visibility="hidden"     else if (isDomIE)       document.all[layerName].style.visibility="hidden";     else if (isDomNN)       document.layers[layerName].visibility="hidden";   }

function showLayer(layerName) {     if (isDOM)       document.getElementById(layerName).style.visibility="visible"     else if (isDomIE)       document.all[layerName].style.visibility="visible";     else if (isDomNN)       document.layers[layerName].visibility="visible";   }

function setyLayer(layerName, y) {     if (isDOM)       document.getElementById(layerName).style.top=y     else if (isDomIE)       document.all[layerName].style.top=y;     else if (isDomNN)       document.layers[layerName].top=y;   }   var id2treeIndex = new Array()

function initArray() {     Note(0,-1,'','')  Note(1,0,' Access-o-Mania','')     Note(2,1,'News','http://www.access-o-mania.de/index.php?action=news&amp;title=office&amp;sitemap=1')  Note(3,1,'Awardprogramm','http://www.access-o-mania.de/index.php?action=AwardProgramm&amp;title=office&amp;sitemap=1')  Note(4,1,'Downloads','http://www.access-o-mania.de/index.php?action=dload&amp;title=access&amp;sitemap=1')  Note(5,1,'Tipps','http://www.access-o-mania.de/index.php?action=tipps&amp;title=access&amp;sitemap=1')  Note(6,1,'Bücher','http://www.access-o-mania.de/index.php?action=booklist&amp;title=office&amp;sitemap=1')  Note(7,1,'Artikel','http://www.access-o-mania.de/index.php?action=artikelarchiv&amp;title=office&amp;sitemap=1')  Note(8,1,'Weblinks','http://www.access-o-mania.de/index.php?action=weblinks&amp;title=office&amp;sitemap=1')  Note(26,0,'Zurück','http://www.access-o-mania.de')     treeTyp[0] = 'f'     treeIsOn[0] = true     treeWasOn[0] = true   }

var idx=0   initArray()   initIndex()   load_all()   for( i=1; i<idx; i++ )   {     treeDeep[i] = knotDeep( treeId[i] )     if ( treeDeep[i] == 0 )       treeIsShown[i] = true   }   if ( isDomNN )     initStyles(); [/code]

[Andreas]

Ha,
ist ja lustig.
Habe eben bei der Suche festgestellt, dass das Script ja von hier stammt, obwohl ich es definitiv nicht von hier habe.
OK, dann ist es ja euch bekannt, und der eine oder andere hat für mich ein Lösungsansatz.

Gruß Andreas

[Bert Randolf]

Hallo,

äh wo ist denn dein problem?!

Bert

[Andreas]

Ganz einfach.
geh mal auf meine Seite: http://www.access-o-mania.de/index.php?sitemap=1

Links ist die Sitemap. Öffne irgend ein Pfad und klicke auf den Link. Das Ergebnis ist, der Link ist zwar geöffnet, aber der Baum ist zugeklappt, und man sieht nicht wo man sich befindet.

Andreas

[Bert Randolf]

Hallo,

du hast eh ein problem (Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.6) Gecko/20040113)

und zwar überlagern sich:"Bitte haben Sie etwas Geduld.

Es werden die Einträge aus

der Datenbank initialisiert."

und das menü, bzw wird das "bitte warten wir laden" nicht ausgeblendet.
sag doch einfach beim laden dem menü welchen zweig es aufmachen soll.

Bert

[Andreas]

Hi,

sag doch einfach beim laden dem menü welchen zweig es aufmachen soll.

ich hab es mal im Body-Tag so probiert: javascript:SiteMapClick(1)
Damit klappe ich den Hauptknoten auch auf. Aber z.B. Knoten 14 der unterhalb von 1 liegt, kann ich so nicht öffnen da er auf dieser Ebene nicht existiert. Also wie soll ich dem Ding sagen er soll knoten 14 aufklappen?

Andreas

[Bert Randolf]

Hallo,
was würdest du als User tun?

*click* *click* *click* *click* *click* *click* *click*

Bert

[Andreas]

Wie aber kann ich ein JavaScript-Befehl wie zB. javascript:SiteMapClick(1) und javascript:SiteMapClick(14) absetzen? kenne nur die Methode im Body-Tag mit onload().

Andreas

[Bert Randolf]

Hallo,

z.b. body onload="click(1);click(5);click(23445)"

Bert

[Andreas]

Hallo,
hat nun doch super funktioniert.
Hier mein Code:
if ($sitemap == 1){
 if (isset($n1)){
  if (isset($n2))
   echo '<BODY onLoad="if (layerok) showTree();init();SiteMapClick('.$n1.');SiteMapClick('.$n2.')">';
  else
   echo '<BODY onLoad="if (layerok) showTree();init();SiteMapClick('.$n1.')">';
 }
 else
  echo '<BODY onLoad="if (layerok) showTree();init()">';
}
else
 echo '<body onload="init()">';

Und im Sitemap übergebe ich einfach die Parameter n1 und n2 für die Knotennamen.

Gruß und Danke
Andreas

[Bert Randolf]

Hallo,

hat nun doch super funktioniert.

:)

Gruß und Danke

Bitte

Bert

[Ingo Turski]

Hi,

hat nun doch super funktioniert.

aber nur bei aktiviertem Jasvascript - was nicht sein muß.
Du solltest entweder die Überschrift "Sitemap" auch über Javascript auf die Seite schreiben (so daß sich Besucher wie ich nicht wundern) oder eine Script verwenden, das eine bereits im HTML vorhandene Sitemap _zu_klappt und nur die zu öffnenden Punkte aufgeklappt läßt.

freundliche Grüße
Ingo

[Stevie]

Hi,

ist ja ein schönes script...
...
...
nur ohne das entsprechende HTML kann man mit dem reinen Javascript nichts anfangen.
also poste zuerst mal den gesamten Teil mit HTML, und danach hilft dir vielleicht wer.

mfg, stevie

[Andreas]

Hallo,
aber gerne.

Body-Tag:
if ($sitemap == 1)
   echo '<BODY onLoad="if (layerok) showTree();init()">';
else
   echo '<body onload="init()">';

innerhalb des Body in einer Tabellenzelle:
if ($sitemap == 1){
  echo '
    <script language="JavaScript" type="text/javascript"   src="sitemap.js"></script>
    <SCRIPT language="JavaScript1.2">
    <!--
    initDiv()
    hideLayer("SiteMapinfo")
    //-->
    </SCRIPT>';
}

glaube ja nicht dass du damit was anfangen kannst ;)

Gruß Andreas

[Raik]

Hallo, Andreas!

Aurigma - Deep Tree v2.0

freundl. Grüsse aus Berlin, Raik