Mozilla Thunderbird Addon - Add icon to message header - xul

I would like to add an icon/button next to reply button in MOZILLA THUNDERBIRD. What should I write in XUL file so that icon in message header will be shown?

You should read https://developer.mozilla.org/en/docs/Building_an_Extension which applies to Firefox, but is largely valid for Thunderbird. Once you get to the part where you're supposed to overlay the interface, read https://developer.mozilla.org/en/docs/Building_an_Extension to figure out that you need to look up msgHdrViewOverlay.xul http://mxr.mozilla.org/comm-central/source/mail/base/content/msgHdrViewOverlay.xul . Use the https://addons.mozilla.org/en-US/thunderbird/addon/6622/ DOM inspector addon to find the ID of the element that you need to overlay. Possibly use the demo addon at https://developer.mozilla.org/en-US/Add-ons/Thunderbird?redirectlocale=en-US&redirectslug=Extensions%2FThunderbird to get started, although you will most certainly need to overlay a different part of the Thunderbird interface.

The .xul-file will look something like this:
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css"
href="chrome://YourExtension/content/YourButton.css"?>
<overlay id="YourExtension-overlay"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="application/javascript"
src="chrome://YourExtension/content/YourButton.js"/>
<toolbarpalette id="MsgComposeToolbarPalette"> // Button available in compose message only
<toolbarbutton id="your-button-1"/>
</toolbarpalette>
<toolbarbutton id="your-button-1"
label="Track"
tooltiptext="Description by mouseover"
oncommand="YourJSFunction()"
class="toolbarbutton-1 chromeclass-toolbar-additional YourButton"
/>
</overlay>
Want to know more? You can learn how to create a custom button HERE.

Related

Programmatically inject custom script into page body at runtime - like Browser Link

I'm looking for a way to inject a custom script into the _Layout.cshtml purely from code. _Layout.cshtml cannot know anything about it. Just like Browser Link does it.
You simple write this:
app.UseBrowserLink();
And this gets injected into the body at runtime.
<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
{"requestId":"a717d5a07c1741949a7cefd6fa2bad08","requestMappingFromServer":false}
</script>
<script type="text/javascript" src="http://localhost:54139/b6e36e429d034f578ebccd6a79bf19bf/browserLink" async="async"></script>
<!-- End Browser Link -->
</body>
There is no sign of it in _Layout.cshtml.
Unfortunately Browser Link isn't open source so I can't see how they have implemented it. Browser Link source now available
So I was wondering how it was done?
It's not open source, but you can easily decompile it to see how it works.
From a comment in the source code:
This stream implementation is a passthrough filter. It's job is to add links to the Browser Link connection scripts at the end of HTML content. It does this using a connection to the host, where the actual filtering work is done. If anything goes wrong with the host connection, or if the content being written is not actually HTML, then the filter goes into passthrough mode and returns all content to the output stream unchanged.
The entire thing seems pretty involved, but doesn't seem to use anything not available out of the box, so I guess it can be possible to code a similar thing.
Razor allows you to do this quite easily - you can even use a flag.
Example:
In your controller:
ViewData["RegisterCustomCode"] = "true";
In your View (.cshtml):
#if (ViewData["RegisterCustomCode"] == "true")
{
<text>
<script src="..."></script>
</text>
}

How to add new command to test case

I am using Selenium IDE Record function to create test cases.
I would like to take screenshot at some part of application that I am testing.
Using UI of Selenium IDE it is easy:
Command: captureEntirePageScreenshot,
Target: *path for screenshot*
But it is not convenient to manually type this (or copy paste) every time I want to take a screenshot, so I decided to make a plug-in (a button on the Selenium IDE toolbar) that will add this screenshot command to the testcase, once I click on it.
I created my button, which is visible on the toolbar, but right now it does nothing:
<?xml version="1.0"?>
<?xml-stylesheet href="toolbar.css" type="text/css"?>
<overlay id="toolbar_overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<toolbar id="toolbar2">
<toolbarseparator id="screenshot-separator" insertafter="record-button"/>
<toolbarbutton id="screenshot-button" insertafter="screenshot-separator" label="Take a screenshot" class="icon" tooltiptext="Take a screenshot" command="*problem_is_here*"/>
</toolbar>
</overlay>
I was digging through Selenium IDE source code, but didn't find method that can be used to add new command to the test case...
Did more digging through source code and find required method:
Editor.addCommand(command, target, value, window, insertBeforeLastCommand)
So my final .xul file looks like this:
<?xml version="1.0"?>
<?xml-stylesheet href="toolbar.css" type="text/css"?>
<overlay id="toolbar_overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<toolbar id="toolbar2">
<toolbarseparator id="screenshot-separator" insertafter="record-button"/>
<toolbarbutton id="screenshot-button" insertafter="screenshot-separator" label="Take a screenshot" class="icon" tooltiptext="Take a screenshot" oncommand="window.editor.addCommand('captureEntirePageScreenshot', 'C:/Users/username/screenshot'+window.FileUtils.getTimeStamp()+'.png', '', window.editor.window);"/>
</toolbar>
</overlay>
Look inter user-extensions.js. This is an easy way to add javascript functionality.
To me, it seems silly to reproduce a command that already exists.
With the IDE's autocomplete, I'm not sure why it's complicated to add in this step, unless you want to use it like the right-click menus?

colorbox with address bar

I am a javascript dummy. I downloaded colorbox and jquery. They work great. I followed tutorials and read the example code but I cant figure this out.
When I open a colorbox ,it opens to the correct url, I can then click links in the box and surf other sites. That is all great. I need to have the url show in a address block at the top of the window. When I use a java popup it will work fine. You can goto other urls and the address shows in the address bar at the top of the window.
So I assume that I can do it with colorbox. This would make my page look much better than a plain popup. Can this be done. here is my code.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> </script>
<script src="http://www.mysite.com/colorbox/jquery.colorbox.js"></script>
<link rel="stylesheet" href="http://www.mysite.com/colorbox/colorbox.css" />
<script>
parent.jQuery.colorbox.close();
$(function ()
{
$(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});
})
</script>
and my link to open the box
<a class='iframe' href="http://www.ebay.com">ebay </a></p>
If you chooes to help I beg you to show me where the new code go's. If you tell me to add a line of code I will not understand where to put it. I am trying hard to learn javascript but I am a very newbe. Thanks.
I don't think ColorBox is the right plugin for you to use, given its default design and your skill set. ColorBox is not designed to be "browser like" and let the user surf to other sites.
It is possible to change that design assumption, but it would require more advanced JS skills than you admit to.
Maybe you can achieve your aim by simply opening a new browser instance using a plain HTML anchor tag (<a>) and using the "target=" parameter.
Best,
KJM

dojo dialog background (frame border, close button, etc) not appears

I am facing strange problem with dojo, I am not able to get background of dojo dialog( frame border, close button, etc,.)
I am only getting Title string and Content string, I can able to move the title string along with content string as like dialog, so I confirmed dialog popup is done, but not able to get background things of dialog.
I am using "claro" theme, I am also displaying "Button", it is coming nice with "claro" theme, but dialog is not coming, please help to find out the problem.
Note: I am running dojo from my own server.
You need two things.
1)
You must embed the Claro CSS.
<link rel="stylesheet" type="text/css" href="/path/to/your/dojo/copy/dijit/themes/claro/claro.css"/>
2)
You must add the class claro to your body tag.
<body class="claro">
</body>

Simulating clicks, keyboard input etc in a web view?

I have decided to have some fun with VB.NET and make a bot for some online games.
First of all, I plan on viewing the game through a webview control, which I believe is perfectly possible... unless I can't see Flash/Java content?
If it is possible, I've been wondering how would you "simulate a click" in the web view control? And, of course, keyboard input?
Perhaps a little late and I have no experience with VB.NET but to work with keys on a web page you need to use Javascript. For example:
<html>
<head>
<script>
document.onkeyup = function(event){ console.log(event); };
</script>
</head>
<body>
press a key within this document.
</body>
</html>
Cursor keys don't generate a keypress event hence the use of onkeyup. Also note it's lowercase. onKeyUp is not correct. If you're using Chrome or Firefox console.log will output the object that you can inspect. Not sure about IE but I think later versions support this too. Properties and methods can be used to get the keycode, character and any modifiers.
This code was tested on Chrome 12 beta. There are differences between IE and other browsers (as usual). This page shows an example of some of the differences: http://www.w3schools.com/jsref/event_onkeypress.asp
Not sure what you mean by "simulate a click" but I suspect you're not referring to testing.
Try for WatiN, its like testing a web application