SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Making script for sitepoint (greasemonkey) - need help

    Hello..

    I am trying to make a script for Sitepoint (forums) which customizes the forum listings.

    I am using the Trixie plugin for IE7 (very similiar to Greasemonkey in FF).

    It's almost perfect... On the "New posts" page it works perfectly but if I go into an actual forum section (e.g. the JS section) it screws up with a runtime error. I have a feeling that it may be conflicting with another script on the site.

    If anybody has greasemonkey or trixie or anything similiar I would really appreciate some help in figuring out how to make this script work properly.

    Currently, the script is meant to do 3 things:
    - Make TD areas clickable instead of just the <a> linking to a particular thread.
    - Nice mouseover effect for TD areas in forum listings also.
    - Description of thread appears below title and author in forum listings.

    Here is the script, it's a very simple and easy script so if anyone can figure out why it's not working that would be great.

    Code JavaScript:
    // ==UserScript==
    // @name          SPF-ENHANCEMENTS
    // @namespace     James // Username on SP - JimmyP
    // @description   Sitepoint Enhancements
    // @include       [URL]http://www.sitepoint.com/[/URL]*
    // ==/UserScript==
    var TDS = document.getElementsByTagName("TD"); // All TD tags
    for(var i = 0 ; i < TDS.length ; i++) { // Loop through them
     if(TDS[i].id.substr(0,14)=='td_threadtitle') {
     
      // Adding thread description
      var title = TDS[i].title;
      var p = document.createElement("P");
      p.style.margin = 0;
      p.style.padding = 0;
      p.style.fontSize = '0.7em';
      p.innerHTML = title;
      TDS[i].appendChild(p);
      TDS[i].style.cursor = "pointer";
     
      // Defining Thread location
      var ThreadLinks = TDS[i].getElementsByTagName("A");
      for(var x = 0 ; x < ThreadLinks.length ; x++) {
       if(ThreadLinks[x].id.substr(0,12)=='thread_title') var ThisThreadLink = ThreadLinks[x].href;
      }
     
      // Defining events - onmouseover, onmouseout, onclick
      TDS[i].onmouseover = function() {this.style.background = "#E6F3F9";}
      TDS[i].onmouseout = function() {this.style.background = "white";}
      TDS[i].onclick = function() {
       var ThreadLinks = this.getElementsByTagName("A");
       for(var x = 0 ; x < ThreadLinks.length ; x++) {
        if(ThreadLinks[x].id.substr(0,12)=='thread_title') {
         window.location = ThreadLinks[x].href;
        }
       } 
      } // End of onclick function
     
     } // End of IF
     
    } // End of Loop

    Thanks

    Edit:


    Ignore the "URL" bbcode tags around the @include URL.
    Last edited by JimmyP; Apr 19, 2008 at 03:58.
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  2. #2
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,044
    Mentioned
    187 Post(s)
    Tagged
    2 Thread(s)

    GreaseMonkey

    I tried the script with GreaseMonkey on Firefox. I got "Component not available" errors. AFAIK, this is because GreaseMonkey "wraps" DOM elements in XPCNativeWrapper so you are clicking on a copy not the original. Or something like that. Anyway, you can't directly access events. You need to do define a function and an addEventListener like
    Code:
      TDS[i].addEventListener('mouseover', mouseOverFunction, TRUE);

  3. #3
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Awesome Mittineaque!

    It works perfectly now:

    Code JavaScript:
    // ==UserScript==
    // @name           SP EN
    // @namespace      James
    // @description    SPF
    // @include        [url]http://www.sitepoint.com/*[/url]
    // ==/UserScript==
     
    var TDS = document.getElementsByTagName("TD"); // All TD tags
    for(var i = 0 ; i < TDS.length ; i++) { // Loop through them
     if(TDS[i].id.substr(0,14)=='td_threadtitle') {
     
      // Adding thread description
      var title = TDS[i].title;
      var p = document.createElement("P");
      p.style.margin = 0;
      p.style.padding = 0;
      p.style.fontSize = '0.7em';
      p.innerHTML = title;
      TDS[i].appendChild(p);
      TDS[i].style.cursor = "pointer";
     
      // Defining Thread location
      var ThreadLinks = TDS[i].getElementsByTagName("A");
      for(var x = 0 ; x < ThreadLinks.length ; x++) {
       if(ThreadLinks[x].id.substr(0,12)=='thread_title') var ThisThreadLink = ThreadLinks[x].href;
      }
     
      // Defining events - onmouseover, onmouseout, onclick
      function mouseOverFunction() {this.style.background = "#E6F3F9";}
      function mouseOutFunction() {this.style.background = "white";}
      function clickFunction() {
       var ThreadLinks = this.getElementsByTagName("A");
       for(var x = 0 ; x < ThreadLinks.length ; x++) {
        if(ThreadLinks[x].id.substr(0,12)=='thread_title') {
         window.location = ThreadLinks[x].href;
        }
       }
      } // End of onclick function
     
     TDS[i].addEventListener('mouseover', mouseOverFunction, true);
     TDS[i].addEventListener('mouseout', mouseOutFunction, true);
     TDS[i].addEventListener('click', clickFunction, true);
     
     } // End of IF
     
    } // End of Loop

    Thank you!!
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •