Modify

Opened 7 years ago

Closed 2 years ago

#3162 closed enhancement (wontfix)

The code sucks; rewrite suggested

Reported by: kylealanhale Owned by: Alovak
Priority: normal Component: BreadcrumbTrailsScript
Severity: normal Keywords:
Cc: Trac Release: 0.10

Description

I just think the code sucks. Why not do it like this?

$(document).ready(function () {
    var breadcrumb = document.createElement('div');
    breadcrumb.setAttribute('id', 'pathnav');
    breadcrumb.setAttribute('class', 'nav');

    var links = document.location.pathname.split("/");
    var editing = !!document.location.toString().match(/action=edit/);
    var first, last;

    var url = "";
    var crumbs = '<ul>';

    for (i = 1; i < links.length; i++) {
        if (links[i] == "") continue;

        first = i == 1;
        last = i == links.length - 1;

        item = links[i];
        url += item;

        crumbs += '<li' + ( (first) ? ' class="first"' : ( (last && !editing) ? ' class="last"': '' ) ) + '>';
        crumbs += ( (last && !editing) ? '<b>' : '<a href="/' + ( (i == 1) ? '' : url ) + '">' );
        crumbs += ( (first) ? 'Home' : item );
        crumbs += ( (last && !editing) ? '</b>' : '</a>' );
        crumbs += '</li>';

        if (editing && last) crumbs += '<li class="last"><b>(editing)</b></li>';

        url += "/";
    }

    crumbs += '</ul>';

    breadcrumb.innerHTML = crumbs;



    var main = document.getElementById('main');
    main.insertBefore(breadcrumb, main.firstChild);
});

The CSS would look like this:

#pathnav {
    float: left;
    margin-left: -40px;
}
#content {
    padding-top: 2em;
}

These changes effect the following:

  • Waits until the page is loaded before appending the new element.
  • Uses a DOM insertion rather than document.write
  • The breadcrumb is placed on the same level as the other wiki historical links (Index, History, etc.), and pushes down the content a bit to make room
  • Makes the final item in the breadcrumb (the current page) bold instead of a link. It also looks for the 'edit' parameter in the query string and appends a crumb if present.
  • Uses the "first" and "last" CSS classes to better the styling

My probs with my approach:

  • It does use a mixture of DOM functions and innerHTML, which I'm usually against, but it seemed easiest in this case. At least, it was faster to code. Someone who knows dojo better could perhaps clean it up.
  • Unfortunately, previews are done via POST, so the (editing) flag goes away after a preview.

Anyway, this is how I'm using it, and it's fantastic.

Thought others might like this change, even if you don't incorporate it.

Attachments (0)

Change History (2)

comment:1 Changed 7 years ago by kylealanhale

Forgot to mention though: great idea! I'm glad to have found this to begin with. I just think it could be even grander with some work.

comment:2 Changed 2 years ago by rjollos

  • Resolution set to wontfix
  • Status changed from new to closed

Plugin is deprecated. See the BreadCrumbsNavPlugin.

Add Comment

Modify Ticket

Action
as closed The owner will remain Alovak.
The resolution will be deleted. Next status will be 'reopened'.
Author


E-mail address and user name can be saved in the Preferences.

 
Note: See TracTickets for help on using tickets.