[Ext] userChrome.js

[Coce]

Sorry, I don't understand anything about these codes. How do I create a statusbarpanel id? Do I have to consider any special things when creating a userChrome.xul?
But even with this modification it is not possible to show the clock and the URL of a hovered link in the statusbar simultaneously?

[pile0nades]

Code: Select all

function Clock() {
    var title = content.document.title;
    var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
    var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var D = new Date();
    var day = days[D.getDay()];
    var month = months[D.getMonth()];
    var year = D.getFullYear();
    var hours = D.getHours();
    var min = D.getMinutes();
    var sec = D.getSeconds();
    var formHours = (hours > 12 ? hours - 12 : hours == 0 ? 12 : hours);
    var Time = ((formHours < 10) ? "0" : "") + formHours;
    Time += ((min < 10) ? ":0" : ":") + min;
    Time += ((sec < 10) ? ":0" : ":") + sec;
    Time += ((hours >= 12) ? " PM" : " AM");
    var date = "*   Greg's Firefox 1.5   *   " + day + ", " + month + " " + D.getDate() + ", " + year;
    var timestr = date + "   " + Time;
    var status = document.getElementById("statusbar-clock-display");
    status.setAttribute("value", timestr);
    setTimeout("Clock()", 100);
  }

var ClockStatus = document.getElementById("statusbar-display");
var ClockLabel = document.createElement("label");
ClockLabel.setAttribute("id", "statusbar-clock-display");
ClockLabel.setAttribute("class", "statusbarpanel-text");
ClockLabel.setAttribute("style", "padding-top: 3px;");
ClockStatus.parentNode.insertBefore(ClockLabel, ClockStatus.nextSibling);

Clock();

This will add a label to the right of the status bar with the time in it. Also, the hour has the leading 0.

[Old Greg S]

This will add a label to the right of the status bar with the time in it. Also, the hour has the leading 0.

Nice pile0nades! Less paper work too then creating the statubarpanel id with xul.
Back to my button problem, If I had a dialog which had a button in it with label of "Click for Time" and when clicked ran a script to show the clock within the buttons label, can that button be toggled back to the original label of "Click for Time"?

[pile0nades]

Code: Select all

var ClockTimer;

function Clock() {
    var title = content.document.title;
    var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
    var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var D = new Date();
    var day = days[D.getDay()];
    var month = months[D.getMonth()];
    var year = D.getFullYear();
    var hours = D.getHours();
    var min = D.getMinutes();
    var sec = D.getSeconds();
    var formHours = (hours > 12 ? hours - 12 : hours == 0 ? 12 : hours);
    var Time = ((formHours < 10) ? "0" : "") + formHours;
    Time += ((min < 10) ? ":0" : ":") + min;
    Time += ((sec < 10) ? ":0" : ":") + sec;
    Time += ((hours >= 12) ? " PM" : " AM");
    var date = "*   Greg's Firefox 1.5   *   " + day + ", " + month + " " + D.getDate() + ", " + year;
    var timestr = date + "   " + Time;
    var status = document.getElementById("statusbar-clock-display");
    status.setAttribute("value", timestr);
    ClockTimer = window.setTimeout("Clock()", 100);
  }

function clearbutton() {
  window.clearTimeout(ClockTimer);
  var button = document.getElementById("button");
  button.setAttribute("label", "Click for Time");
  button.setAttribute("onclick", "Clock();document.getElementById('button').setAttribute('onclick', 'clearbutton();')");
}



Code: Select all

<button id="button" label="Click for Time" onclick="Clock();document.getElementById('button').setAttribute('onclick', 'clearbutton();')">

I haven't tested this but it should work.

[Old Greg S]

I haven't tested this but it should work.

I couldn't make it work

[Coce]

Code: Select all

function Clock() {
    var title = content.document.title;
    var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
    var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var D = new Date();
    var day = days[D.getDay()];
    var month = months[D.getMonth()];
    var year = D.getFullYear();
    var hours = D.getHours();
    var min = D.getMinutes();
    var sec = D.getSeconds();
    var formHours = (hours > 12 ? hours - 12 : hours == 0 ? 12 : hours);
    var Time = ((formHours < 10) ? "0" : "") + formHours;
    Time += ((min < 10) ? ":0" : ":") + min;
    Time += ((sec <10>= 12) ? " PM" : " AM");
    var date = "*   Greg's Firefox 1.5   *   " + day + ", " + month + " " + D.getDate() + ", " + year;
    var timestr = date + "   " + Time;
    var status = document.getElementById("statusbar-clock-display");
    status.setAttribute("value", timestr);
    setTimeout("Clock()", 100);
  }

var ClockStatus = document.getElementById("statusbar-display");
var ClockLabel = document.createElement("label");
ClockLabel.setAttribute("id", "statusbar-clock-display");
ClockLabel.setAttribute("class", "statusbarpanel-text");
ClockLabel.setAttribute("style", "padding-top: 3px;");
ClockStatus.parentNode.insertBefore(ClockLabel, ClockStatus.nextSibling);

Clock();

This will add a label to the right of the status bar with the time in it. Also, the hour has the leading 0.

Great, thanks! It's working completely.
How do I make the current day appear with a leading 0? Like Tu, 01.01.2007. The clock shifts to the left, when a page is loades, due to the progress bar, but that's ok.

[edit] Is it possible to display this clock in the toolbar? [/edit]

[pile0nades]

Code: Select all

function Clock() {
    var title = content.document.title;
    var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
    var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var D = new Date();
    var day = days[D.getDay()];
    var month = months[D.getMonth()];
    var year = D.getFullYear();
    var hours = D.getHours();
    var min = D.getMinutes();
    var sec = D.getSeconds();
    var formHours = (hours > 12 ? hours - 12 : hours == 0 ? 12 : hours);
    var Time = ((formHours < 10) ? "0" : "") + formHours;
    Time += ((min < 10) ? ":0" : ":") + min;
    Time += ((sec < 10) ? ":0" : ":") + sec;
    Time += ((hours >= 12) ? " PM" : " AM");
    var date = "*   Greg's Firefox 1.5   *   " + ((day < 10) ? "0" : "") + day + ", " + ((month < 10) ? "0" : "") + month + " " + D.getDate() + ", " + year;
    var timestr = date + "   " + Time;
    var status = document.getElementById("statusbar-clock-display");
    status.setAttribute("value", timestr);
    setTimeout("Clock()", 100);
  }

var ClockStatus = document.getElementById("statusbar-display");
var ClockLabel = document.createElement("label");
ClockLabel.setAttribute("id", "statusbar-clock-display");
ClockLabel.setAttribute("class", "statusbarpanel-text");
ClockLabel.setAttribute("style", "padding-top: 3px;");
ClockStatus.parentNode.insertBefore(ClockLabel, ClockStatus.nextSibling);

Clock();

Here's the day and month with a leading 0. To display it in the toolbar, change the "statusbar-display" to the id of what you want to display it after. That's easily found using the DOM Inspector. In there, under File > Inspect a window, click the current window, then click Search > Find Element by Click and click what you want on the toolbar. Then look for its id on the DOM inspector window. Put that in place of "statusbar-display" for the clock to show to the right of it.

[Coce]

Ok, I managed to display the code in the toolbar, thanks for your help.
But it seems as if I had changed something in the code, when trying to "translate" the code into German, including the time format:

Code: Select all

<Day of the week, only two characters>, <day with leading 0>. <month with leading 0>. <year>

As I don't have any idea of writing these codes, I don't really know, what to change.

Here's my current code:

Code: Select all

function Clock() {
    var title = content.document.title;
    var days = ["Mo", "Di", "Mi", "Do", "Fr", "Sa", "So"];
    var months = ["1.", "2.", "3.", "4.", "5.", "6.", "7.","8.", "9.", "10.", "11.", "12."];
    var D = new Date();
    var day = days[D.getDay()];
    var month = months[D.getMonth()];
    var year = D.getFullYear();
    var hours = D.getHours();
    var min = D.getMinutes();
    var sec = D.getSeconds();
    var formHours = (hours > 12 ? hours - 12 : hours == 0 ? 12 : hours);
    var Time = ((formHours < 10) ? "0" : "") + formHours;
    Time += ((min < 10) ? ":0" : ":") + min;
    Time += ((sec < 10) ? ":0" : ":") + sec;
    Time += ((hours >= 12) ? " PM" : " AM");
    var date =day + ", " + D.getDate() + "." + month + year;
    var timestr = date + " - " + Time + '   ';
    var status = document.getElementById("statusbar-clock-display");
    status.setAttribute("value", timestr);
    setTimeout("Clock()", 100);
  }

var ClockStatus = document.getElementById("statusbar-display");
//var ClockStatus = document.getElementById("un-toolbarbutton");
var ClockLabel = document.createElement("label");
ClockLabel.setAttribute("id", "statusbar-clock-display");
ClockLabel.setAttribute("class", "statusbarpanel-text");
ClockLabel.setAttribute("style", "padding-top: 3px;");
ClockStatus.parentNode.insertBefore(ClockLabel, ClockStatus.nextSibling);

Clock();

Can you tell me, how to change the code to get the format mentioned above?
Thanks.

________________________________________________________________________________________________

I have another question concerning another script:
The following code

Code: Select all

(function() {
  var menuAttr = [
    { label: "Send Image to...",
      id: "context-sendimageTo",
      before: "context-sendimage",
      url: "imageURL" },
    { label: "Send Background Image To...",
      id: "context-sendbgimageTo",
      before: "context-viewbgimage",
      url: "bgImageURL" }
  ];

  for(var i = 0; i < menuAttr.length; i++) {
    var menu = document.createElement("menu");
    menu.id = menuAttr[i].id;
    menu.setAttribute("label", menuAttr[i].label);

    var beforeId = document.getElementById(menuAttr[i].before);
    beforeId.parentNode.insertBefore(menu, beforeId.nextSibling);

    var mPopup = menu.appendChild(document.createElement("menupopup"));
    mPopup.setAttribute("oncommand",
      "gBrowser.loadOneTab(event.target.getAttribute('url') + " +
      "escape(gContextMenu." + menuAttr[i].url + "), " +
      "null, null, null, false)")

    var imgHosts = [
      { label: "Flickr",
        url: "http://www.flickr.com/tools/sendto.gne?url=" },
      { label: "ImageShack",
        url: "http://imageshack.us/transload.php?url=" }
    ]

    for(var j = 0; j < imgHosts.length; j++) {
      var mItem = mPopup.appendChild(document.createElement("menuitem"));
      mItem.setAttribute("label", imgHosts[j].label);
      mItem.setAttribute("url", imgHosts[j].url);
    }
  }

  var cm = document.getElementById("contentAreaContextMenu");
  cm.addEventListener("popupshowing", function(event) {
    gContextMenu.showItem("context-sendimageTo", gContextMenu.onImage);
    gContextMenu.showItem("context-sendbgimageTo", gContextMenu.hasBGImage);
  }, false);

})();

adds a submenu to the context menu, containing two entries which allow uploading an image directly either to Flickr or to Imageshack. As I have no Flickr account, I don't need this option. How do I have to modify the script, so the Imageshack upload is the only one I can use and this entry is directly in the context menu (no submenu)?

[Namoi]

Sorry to disturb the thread, but i don't know where i could post my question.

I'm a little new to all of this as i'm more a theme developper, but what i want to achieve seems to pass by a Xul modification :
I'm trying to change the behavior of the download button of Firefox to make it toggable as the history or bookmark button.

I digged a little and found a dirty way by directly modifying the browser.xul adding the style:"checkbox" attribute to the downloads-button declaration.
But, i'd like is to create a userchrome.xul as i use a userchrome.css to bypasss the genuine button.So i've installed ChromeEdit Plus and create the specified folder structure inside my chrome dir. Everything works, but i can't make a xul overlay to achieve my goal : i always get a grey bar of the death.
Could someone give me a help.


Thanks

[Old Greg S]

I haven't tested this but it should work.

I couldn't make it work

I change the labels on one of them to see if any of it was working. The label changed when button was clicked but it's not running the Clock script for some reason.

[Coce]

Does anyone have an idea concerning this post ?

[old zeniko]

Does anyone have an idea concerning this post ?

Don't feel ignored, young man. It just seems that your problem isn't motivating enough: the people posting in this thread prefer code snippets which (1) they could use themselves or which (2) at least are a certain challenge to modify.

Both of your problems could easily be solved -- with a little effort even by yourself: first, try to understand what the code you have does; playing around and making a few modifications can help at this point. Then test your understanding by making the changes you actually want (hints: in the first snippet, hours, minutes and seconds are all already displayed with a leading 0; and in the second snippet, you mostly just have to remove code).

Should that still not work out, you might want to ask your question at a different place:

Note: Please ask code related questions in the Extension Development forum.

[norix]

I found <a href="http://amb.vis.ne.jp/mozilla/?p=73" title="SCRAPBLOG &raquo; [userChrome.js] Mouse Gestures">Mouse Gestures</a>.
It's great!

[max1million]

Coce:
var date =day + ", " + ((D.getDate() < 10) ? "0" : "") + D.getDate() + "." + ((month < 10) ? "0" : "") + month + year;

and the <a href="data:application/x-javascript;charset=utf-8,%28function%28%29%20%7B%0A%20%20var%20menuAttr%20%3D%20%5B%0A%20%20%20%20%7B%20label%3A%20%22Send%20Image%20to%20ImageShack%22%2C%0A%20%20%20%20%20%20id%3A%20%22context-sendimageTo%22%2C%0A%20%20%20%20%20%20before%3A%20%22context-sendimage%22%2C%0A%20%20%20%20%20%20url%3A%20%22imageURL%22%20%7D%2C%0A%20%20%20%20%7B%20label%3A%20%22Send%20Background%20Image%20To%20ImageShack%22%2C%0A%20%20%20%20%20%20id%3A%20%22context-sendbgimageTo%22%2C%0A%20%20%20%20%20%20before%3A%20%22context-viewbgimage%22%2C%0A%20%20%20%20%20%20url%3A%20%22bgImageURL%22%20%7D%0A%20%20%5D%3B%0A%0A%20%20for%28var%20i%20%3D%200%3B%20i%20%3C%20menuAttr.length%3B%20i++%29%20%7B%0A%20%20%20%20var%20menuitem%20%3D%20document.createElement%28%22menuitem%22%29%3B%0A%20%20%20%20menuitem.id%20%3D%20menuAttr%5Bi%5D.id%3B%0A%20%20%20%20menuitem.setAttribute%28%22label%22%2C%20menuAttr%5Bi%5D.label%29%3B%0A%0A%20%20%20%20var%20beforeId%20%3D%20document.getElementById%28menuAttr%5Bi%5D.before%29%3B%0A%20%20%20%20beforeId.parentNode.insertBefore%28menuitem%2C%20beforeId.nextSibling%29%3B%0A%0A%20%20%20%20menuitem.setAttribute%28%22oncommand%22%2C%0A%20%20%20%20%20%20%22gBrowser.loadOneTab%28%27http%3A//imageshack.us/transload.php%3Furl%3D%27%20+%20%22%20+%0A%20%20%20%20%20%20%22escape%28gContextMenu.%22%20+%20menuAttr%5Bi%5D.url%20+%20%22%29%2C%20%22%20+%0A%20%20%20%20%20%20%22null%2C%20null%2C%20null%2C%20false%29%22%29%0A%20%20%7D%0A%0A%20%20var%20cm%20%3D%20document.getElementById%28%22contentAreaContextMenu%22%29%3B%0A%20%20cm.addEventListener%28%22popupshowing%22%2C%20function%28event%29%20%7B%0A%20%20%20%20gContextMenu.showItem%28%22context-sendimageTo%22%2C%20gContextMenu.onImage%29%3B%0A%20%20%20%20gContextMenu.showItem%28%22context-sendbgimageTo%22%2C%20gContextMenu.hasBGImage%29%3B%0A%20%20%7D%2C%20false%29%3B%0A%0A%7D%29%28%29%3B">menu</a>

[paulfox]

I found <a href="http://amb.vis.ne.jp/mozilla/?p=73" title="SCRAPBLOG &raquo; [userChrome.js] Mouse Gestures">Mouse Gestures</a>.
It's great!

norix . . . this is one of the very happiest moments I've ever had on this forum. THAT, my friend, is an awesome find. Thank you. I was using DesertFox's user.js script until now and was so thankful to him for it . . . but this basically is a 5k All In One Gestures. Simply great, and I commented on "Gomita's" blog and credited you with steering us all there!

What a great day. Thank you again, norix! Works like a charm and I've dumped 2 custombuttons. ROCKING. Woo Hoo!!

(small addendum, the "increase and decrease text" entries are reversed; simple typo).