Annotation of loncom/html/res/adm/pages/bookmarkmenu/bookmarkpal.html, revision 1.4
1.1 tyszkabe 1: <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
2: <html>
1.4 ! tyszkabe 3: <head>
1.2 tyszkabe 4: <title>
1.4 ! tyszkabe 5: Bookmark Tree Viewer/Editor V3
1.2 tyszkabe 6: </title>
7:
8: <script LANGUAGE="JavaScript">
1.4 ! tyszkabe 9: var addressCache = "";
! 10: var dragCache = "";
! 11: var lastDrug = "";
! 12: var lastIcon = "";
! 13: var image_num=0;
1.2 tyszkabe 14:
15:
1.3 tyszkabe 16: function buildUserTree() {
1.4 ! tyszkabe 17: this.dropCache = "";
! 18: this.dragCache = "";
! 19: //-------------------------------------------------------------------------------
! 20: // The following is data that is supplied by the Perl Module
! 21: //-------------------------------------------------------------------------------
! 22: this.bookmarks = new addFolder("Stuff", 6, "bookmarks");
! 23: this.bookmarks.p[1]=new addLink("MSU Engine3ering", "http://www.egr.msu.edu", "bookmarks", 1);
! 24: this.bookmarks.p[2]=new addLink("MSU Engine2ering", "http://www.egr.msu.edu/~tyszkabe", "bookmarks", 2);
! 25: this.bookmarks.p[3]=new addFolder("more crap", 5, "bookmarks.p[3]");
! 26: this.bookmarks.p[3].p[1]=new addLink("more of a test","http://www.transam.com","bookmarks.p[3]",1);
! 27: this.bookmarks.p[3].p[2]=new addLink("ALL CAPS PLEASE!","http://www.bullwinkle.com","bookmarks.p[3]",2);
! 28: this.bookmarks.p[3].p[3]=new addFolder("double nested", 2, "bookmarks.p[3].p[3]");
! 29: this.bookmarks.p[3].p[3].p[1]=new addLink("Test 12","http://www.jealousy.com","bookmarks.p[3].p[3]",1);
! 30: this.bookmarks.p[3].p[3].p[2]=new addFolder("empty folder",1,"bookmarks.p[3].p[3].p[2]");
! 31: this.bookmarks.p[3].p[3].p[2].p[1]=new addLink("bury","http://www.cool.com","bookmarks.p[3].p[3].p[2]",1);
! 32: this.bookmarks.p[3].p[4]=new addLink("simon and Garfunkle","www.inneptitude.com","bookmarks.p[3]",4);
! 33: this.bookmarks.p[3].p[5]=new addLink("garbage in garbage out","www.holy.com","bookmarks.p[3]",5);
! 34: this.bookmarks.p[4]=new addLink("MSU Engin4eering","st4uffcom","bookmarks",4);
! 35: this.bookmarks.p[5]=new addFolder("more x2",3,"bookmarks.p[5]");
! 36: this.bookmarks.p[5].p[1]=new addLink("Whack a holy mole","www.whackamole.com","bookmarks.p[5]",1);
! 37: this.bookmarks.p[5].p[2]=new addLink("molly moldy mole","http://www.molemolemole.com","bookmarks.p[5]",2);
! 38: this.bookmarks.p[5].p[3]=new addLink("Thou art even more holy","www.holymoly.com","bookmarks.p[5]",3);
! 39: this.bookmarks.p[6]=new addLink("Google","http://www.google.com/","bookmarks",6);
! 40: }
1.2 tyszkabe 41:
42:
1.3 tyszkabe 43:
1.4 ! tyszkabe 44: //-------------------------------------------------------------------------------
! 45: // Here are all of the bookmark methods:
! 46: //-------------------------------------------------------------------------------
! 47:
! 48: //-------------------------------------------------------Adds a link to an object
! 49: function addLink(name, link, address, position) {
! 50: this.lname = name;
1.2 tyszkabe 51: this.link = link;
52: this.address = address;
1.4 ! tyszkabe 53: this.position = position;
1.2 tyszkabe 54: this.state = "link";
1.4 ! tyszkabe 55: this.icon = "link.gif";
! 56: this.pressed = "link_pressed.gif";
! 57: this.hover = hover;
! 58: this.remove = remove
! 59: this.exists = true;
! 60: }
1.2 tyszkabe 61:
1.4 ! tyszkabe 62: //-----------------------------------------------------Adds a folder to an object
! 63: function addFolder(name, size, address) {
1.2 tyszkabe 64: this.p = new Array(size);
1.4 ! tyszkabe 65: this.lname = name;
1.2 tyszkabe 66: this.address = address;
67: this.state = "opened";
1.4 ! tyszkabe 68: this.icon = "folder_opened.gif";
! 69: this.pressed = "folder_opened_pressed.gif";
1.3 tyszkabe 70: this.swapState = swapState;
1.4 ! tyszkabe 71: this.clickFolder = clickFolder;
! 72: this.clickLink = clickLink;
! 73: this.hover = hover;
! 74: this.remove = remove;
! 75: this.bump = bump;
! 76: this.insertLink = insertLink;
! 77: this.insertFolder = insertFolder;
! 78: this.exists = true;
! 79: }
1.2 tyszkabe 80:
1.4 ! tyszkabe 81: //-----------------------------------------Swaps folder state from open to closed
! 82: function swapState() {
! 83: if (this.state == "closed") {
! 84: this.state = "opened";
! 85: this.icon = "folder_opened.gif";
! 86: this.pressed = "folder_opened_pressed.gif";
1.2 tyszkabe 87: } else {
1.4 ! tyszkabe 88: this.state = "closed";
! 89: this.icon = "folder_closed.gif";
! 90: this.pressed = "folder_closed_pressed.gif";
1.2 tyszkabe 91: }
92: redrawTree(1, bookmarkpal.bookmarks.p);
93: }
94:
1.4 ! tyszkabe 95: //------------------------------------------swaps the dragged icon into the image
! 96: function hover( object ) {
! 97: if ( dragCache != "" ) {
! 98: object.src = this.pressed;
! 99: parent.frames[4].document.images[lastDrug].src = lastIcon;
! 100: lastIcon = this.icon;
! 101: lastDrug = object.name;
! 102: }
! 103: }
1.2 tyszkabe 104:
1.4 ! tyszkabe 105: //------------------------------------------------------The click on link method
! 106: function clickLink( object, position ) {
! 107: if (dragCache=="") { //---------'pick up' the icon
! 108: dragCache=object.src;
! 109: lastIcon=this.p[position].icon;
! 110: lastDrug=object.name;
! 111: addressCache=new addLink(this.p[position].lname,this.p[position].link,this.p[position].address,position);
! 112: this.p[position].remove();
! 113: } else { //--------'put down' the icon
! 114: dragCache="";
! 115: if ( addressCache.state == "link" ) { //------differently if a link
! 116: this.insertLink( position );
! 117: } else { //--------------than a folder
! 118: this.insertFolder( position );
! 119: }
! 120: redrawTree();
! 121: }
! 122: }
1.2 tyszkabe 123:
1.4 ! tyszkabe 124: //-----------------------------------------------------The click on Folder method
! 125: function clickFolder( object ) {
! 126: if (dragCache=="") { //---------'pick up' the icon
! 127: dragCache=object.src;
! 128: lastIcon=this.icon;
! 129: lastDrug=object.name;
! 130: addressCache=new addFolder("lame_folder",2,"doesnotmatter"); //used to be (this.lname,this.p.length+1,this.address)
! 131: shiftFolder(this,addressCache,1); //this is a whole new line
! 132: this.remove();
! 133: } else { //--------'put down' the icon
! 134: dragCache = "";
! 135: if ( addressCache.state == "link" ) { //-----place link into folder
! 136: this.insertLink( 1 );
! 137: // this.p[ this.p.length ] = new addLink( addressCache.lname, addressCache.link, this.address, this.p.length );
! 138: } else { //---place folder into folder
! 139: this.insertFolder( 1 );
! 140: // this.p[ this.p.length ] = new addFolder( addressCache.lname, addressCache.p.length, this.address+".p["+this.p.length+"]" );
! 141: // this.p[ this.p.length ].p = addressCache.p;
! 142: }
! 143: redrawTree();
1.2 tyszkabe 144: }
1.4 ! tyszkabe 145: }
! 146:
! 147: //---------Folder method to place link in middle of other links (should simplify code)
! 148: function insertLink( position ) {
! 149: this.bump( position );
! 150: this.p[ position ] = new addLink( addressCache.lname, addressCache.link, this.address, position );
! 151: }
1.2 tyszkabe 152:
153:
1.4 ! tyszkabe 154: //---------------------------Recursive folder Method to bump items up one to make room
! 155: // for new item. Currently, bump doesn't always work.
! 156: function bump( position ) {
! 157: // ORIGINAL RECURSIVE VERSION has short-comings but may work better because of 'not exists'
! 158: //
! 159: // if ( this.length >= position ) {
! 160: // this.bump( position + 1 );
! 161: // }
! 162: // position;
! 163: // this.p[ position + 1 ] = this.p[position ];
! 164: //
! 165: // NON RECURSIVE of the same thing (I'll probably stick with this).
! 166: // I can combine the creation and shifting if everything works out nicely
! 167: // Worry about what happens to the first link.
! 168: var i=this.p.length; // First, create a new spot at the top.
! 169: if (this.p[i-1].state=="link") {
! 170: this.p[i]=new addLink(this.p[i-1].lname,this.p[i-1].link,this.address,i);
! 171: } else {
! 172: this.p[i]=new addFolder(this.p[i-1].lname,this.p[i-1].p.length,this.address+".p["+i+"]");
! 173: }
! 174: this.p[i].exists=this.p[i-1].exists; // preserve existance
! 175: i--; // Second, shift others up one
! 176: while ( i >= position + 1 ) {
! 177: if ( this.p[i-1].state == "link" ) {
! 178: this.p[ i ] = new addLink( this.p[ i-1 ].lname, this.p[i-1].link, this.p[i-1].address, i);
! 179: } else {
! 180: this.p[ i ] = new addFolder( this.p[ i-1 ].lname, this.p[i-1].p.length, this.address+".p["+ i +"]" );
! 181: // move all of the inner folder stuff
! 182: shiftFolder( this.p[i-1], this, i);
! 183: }
! 184: // this.p[i].address = this.p[i-1].address;
! 185: // this.p[i].exists = this.p[ i-1 ].exists; // preserve existance
! 186: i--;
! 187: }
! 188: }
! 189:
! 190: //-----------------------------------------------------------Opens the page
! 191: function clickOnBookmark(url) {
! 192: // opener.clientwindow.location(url); // <------THIS IS REAL VERSION
! 193: opener.open(url); // <------THIS IS FAKE VERSION
! 194: }
! 195:
1.2 tyszkabe 196:
197:
198:
1.4 ! tyszkabe 199: //-------------------------------------------------------------------------
! 200: // Now we have standard (non-method) functions
! 201: //-------------------------------------------------------------------------
! 202:
! 203:
! 204: //---------------------------------shifts contents of folder up one position
! 205: function shiftFolder(object1, object2, n) {
! 206: object2.p[n] = new addFolder(object1.lname,object1.length,object2.address+".p["+n+"]");
! 207: for (var i=1; i<object1.p.length; i++) {
! 208: if (object1.p[i].state=="link") {
! 209: object2.p[n].p[i]=new addLink(object1.p[i].lname,object1.p[i].link,object2.p[n].address,i);
! 210: } else {
! 211: object2.p[n].p[i]=new addFolder(object1.p[i].lname,object1.p[i].length,object2.address+".p["+n+"].p["+i+"]");
! 212: shiftFolder(object1.p[i],object2.p[n],i);
! 213: }
! 214: object2.p[n].p[i].state=object1.p[i].state;
! 215: object2.p[n].p[i].icon=object1.p[i].icon;
! 216: object2.p[n].p[i].pressed=object1.p[i].pressed;
! 217: object2.p[n].p[i].exists=object1.p[i].exists;
! 218: }
! 219: object2.p[n].state=object1.state;
! 220: object2.p[n].icon=object1.icon;
! 221: object2.p[n].pressed=object1.pressed;
! 222: object2.p[n].exists=object1.exists;
! 223: }
1.2 tyszkabe 224:
225:
1.4 ! tyszkabe 226: //--------Method to place folder in middle of other links (this simplifies code)
! 227: function insertFolder(position) {
! 228: this.bump(position);
! 229: shiftFolder(addressCache.p[1],this,position);
1.3 tyszkabe 230: }
231:
232:
1.4 ! tyszkabe 233: //---------------------------delete link&folder from within other links&folders
! 234: function remove() {
! 235: this.exists = false;
1.3 tyszkabe 236: }
237:
1.4 ! tyszkabe 238: //---------------------Function that deletes link from dragging it to the trash
! 239: function clickTrash() {
! 240: dragCache = "";
! 241: redrawTree();
1.3 tyszkabe 242: }
243:
1.4 ! tyszkabe 244: //-----------------------------------------------------------------------------
! 245: // These functions should be incorporated as methods
! 246: // and the trash should be a folder. I'll work on this later.
! 247: //-----------------------------------------------------------------------------
! 248: function hoverTrash() {
! 249: // if ( dragCache != "" ) {
! 250: // parent.frames[6].document.images[0].src = lastIcon;
! 251: // lastIcon = "folder_trash.gif";
! 252: // }
! 253: }
! 254: //----------------------------------------------------------------------------
1.2 tyszkabe 255:
256:
257:
1.4 ! tyszkabe 258: //-----------------------------------------------------------------------------
! 259: // The following are construction functions.
! 260: //-----------------------------------------------------------------------------
! 261:
! 262: //--------------------------------------------------generate the Tree HTML code
! 263: function drawTree(depth, folder) {
! 264: for (var i=1; i<folder.length; i++) {
! 265: if (folder[i].exists) {
! 266: if (folder[i].state=="link") {
! 267: drawLink(depth,folder[i]);
! 268: } else {
! 269: drawFolder(depth,folder[i]);
! 270: if (folder[i].state=="opened" && folder[i].p.length>=0) {
! 271: drawTree(depth+1,folder[i].p);
! 272: }
! 273: }
! 274: }
! 275: }
! 276: }
1.2 tyszkabe 277:
1.4 ! tyszkabe 278: //----------------------------------------Writes HTML code for individual folder
! 279: function drawFolder(depth, folder) {
! 280: parent.frames[4].document.write("<TABLE border=0 cellspacing=0 cellpadding=0><TR><TD valign=left nowrap>");
! 281: parent.frames[4].document.write("<a href=\"javascript:top.bookmarkpal."+folder.address+".swapState();\" ><IMG src='folder_pointer_"+folder.state+".gif' width=15 height=25 border=noborder ></a>");
! 282: image_num++;
! 283: if ( depth != 1 ) {
! 284: image_num++;
! 285: parent.frames[4].document.write("<A href=\"javascript:top.bookmarkpal."+folder.address+".clickFolder(document.images["+image_num+"]);\" onmouseover=\"top.bookmarkpal."+folder.address+".hover(document.images["+image_num+"])\" ><IMG src='folder_spacer.gif' width="+ 20*( depth - 1 ) +" height=25 border=noborder></A>");
! 286: }
! 287: parent.frames[4].document.write("<A href=\"javascript:top.bookmarkpal."+folder.address+".clickFolder(document.images["+image_num+"]);\" onmouseover=\"top.bookmarkpal."+folder.address+".hover(document.images["+image_num+"])\" ><IMG src='"+folder.icon+"' width=25 height=25 border=noborder name="+image_num+"></A>");
! 288: image_num++;
! 289: parent.frames[4].document.write("<TD valign=middle align=left nowrap><FONT face='Arial, Helvetica'> "+folder.lname+"</FONT></TABLE>");
! 290: }
1.3 tyszkabe 291:
1.4 ! tyszkabe 292: //--------------------------------------Writes HTML code for individual link
! 293: function drawLink(depth, folder) {
! 294: parent.frames[4].document.write("<TABLE border=0 cellspacing=0 cellpadding=0><TR><TD valign = middle nowrap>");
! 295: image_num++;
! 296: parent.frames[4].document.write("<A href=\"javascript:top.bookmarkpal."+folder.address+".clickLink(document.images["+image_num+"], "+folder.position+");\" onmouseover=\"top.bookmarkpal."+folder.address+".p["+ folder.position +"].hover(document.images["+image_num+"])\" ><IMG src='folder_spacer.gif' width="+ 20 * depth +" height=25 border=noborder></A>");
1.3 tyszkabe 297:
1.4 ! tyszkabe 298: parent.frames[4].document.write("<A href=\"javascript:top.bookmarkpal."+folder.address+".clickLink(document.images["+image_num+"], "+folder.position+");\" onmouseover=\"top.bookmarkpal."+folder.address+".p["+ folder.position +"].hover(document.images["+image_num+"])\" ><IMG src='"+folder.icon+"' width=25 height=25 border=noborder name="+image_num+" ></A>");
! 299: image_num++;
! 300: parent.frames[4].document.write("<TD valign=middle align=left nowrap><FONT size=-1 face='Arial, Helvetica'><A href=\"javascript:top.clickOnBookmark\( '"+folder.link+"\' );\">"+folder.lname+"</a></FONT></TABLE>");
! 301: }
1.3 tyszkabe 302:
1.4 ! tyszkabe 303: //--------------------Calls Build and draws functions. This function also takes
! 304: // care of housekeeping
! 305: function initializeTree() {
! 306: // trash = new addFolder();
! 307: bookmarkpal = new buildUserTree();
! 308: redrawTree();
! 309: // parent.frames[5.document.write("HELLO WORLDS!!");
! 310: }
1.2 tyszkabe 311:
1.4 ! tyszkabe 312: //--------------------------------Redraws screen without initiallizing anything
! 313: function redrawTree() {
1.2 tyszkabe 314: parent.frames[4].document.clear();
1.4 ! tyszkabe 315: image_num = 0;
1.2 tyszkabe 316: parent.frames[4].document.write("<BODY>");
317: drawTree(1, bookmarkpal.bookmarks.p);
318: parent.frames[4].document.write("</BODY>");
1.4 ! tyszkabe 319: }
1.2 tyszkabe 320:
1.4 ! tyszkabe 321: //-------------------------------------PreProcesses bookmarks before submitting
! 322: function saveBookmarks() {
! 323: stuff goes here.
! 324: }
1.2 tyszkabe 325:
326:
327:
328: </script>
1.4 ! tyszkabe 329: </head>
1.1 tyszkabe 330:
331: <FRAMESET rows="25, *, 30, 25" topmargin=0 leftmargin=0 marginheight=0 marginwidth=0 frameborder="0" border="0" framespacing="0" >
1.4 ! tyszkabe 332: <FRAMESET cols="25, *, 25" frameborder="0" borders="0" framespacing="0">
! 333: <FRAME src="annotator_ul.html" marginwidth="0" marginheight="0" scrolling="no">
! 334: <FRAME src="annotator_uu.html" marginwidth="0" marginheight="0" scrolling="no">
! 335: <FRAME src="annotator_ur.html" marginwidth="0" marginheight="0" scrolling="no">
! 336: </FRAMESET>
! 337: <FRAMESET name="contentb" cols="25, *, 25" frameborder="0" borders="0" framespacing="0">
! 338: <FRAME src="annotator_left.html" marginwidth="0" marginheight="0" scrolling="no">
! 339: <FRAME name="content" src="loading_bookmarks.html" marginwidth="0" marginheight="0" scrolling="auto">
! 340: <FRAME src="annotator_right.html" marginwidth="0" marginheight="0" scrolling="no">
! 341: </FRAMESET>
! 342: <FRAMESET cols="25, *, 25" frameborder="0" borders="0" framespacing="0">
! 343: <FRAME src="annotator_left.html" marginwidth="0" marginheight="0" scrolling="no">
! 344: <FRAME name="toolbar" src="annotator_toolbar.html" marginwidth="0" marginheight="0" scrolling="no">
! 345: <FRAME src="annotator_right.html" marginwidth="0" marginheight="0" scrolling="no">
! 346: </FRAMESET>
! 347: <FRAMESET cols="25, *, 25" frameborder="0" borders="0" framespacing="0">
! 348: <FRAME src="annotator_ll.html" marginwidth="0" marginheight="0" scrolling="no">
! 349: <FRAME src="annotator_bb.html" marginwidth="0" marginheight="0" scrolling="no">
! 350: <FRAME src="annotator_lr.html" marginwidth="0" marginheight="0" scrolling="no">
! 351: </FRAMESET>
1.1 tyszkabe 352: </FRAMESET>
1.4 ! tyszkabe 353: </html>
FreeBSD-CVSweb <freebsd-cvsweb@FreeBSD.org>
![[BACK]](/icons/back.gif){kind=icon}
Return to bookmarkpal.html CVS log ![[TXT]](/icons/text.gif){kind=icon}
![[DIR]](/icons/dir.gif){kind=icon}
Up to [LON-CAPA] / loncom / html / res / adm / pages / bookmarkmenu