One of the new features (among others) in Exchange 2003 OWA is the ability for the user to now search their own contacts folder when using the address book find in OWA 2003. One other location that can be used to store contacts especially if you want to share contacts among users is in a contacts folder in a public folder tree. So I was asked to look at making this available to search in OWA like the contacts folders.
This brings up the first question of how can I customize OWA I went digging though some old whitepapers and found this one about customizing OWA 2000 which is mostly still relevant to Exchange 2003. The low down from this whitepaper is the core HTML used to render OWA is stored in the wmtemplates.dll file which means that you can’t really mess with it. There are some other warnings in this whitepaper about any changes made to the .js, htc or xml files used by OWA are unsupported. But further on they give you an example of modifying one of the script files used by OWA to change the NAV bar. Siegfried Webber also has a sample on his blog that shows how to add a button to the NAV bar in OWA 2003.
What I learnt from these two sources was that although you can’t modify the OWA core code directly the scripts that contain all the page events that OWA loads can be modified and the document object can be used to insert your own custom code back into what gets rendered to the client.
So the first thing I had to do is work out which script was being used when you click the address book in OWA. This is where Ethereal (or some other packet capture program) is invaluable. Doing a capture I could see that file dlg_gal.js which is in the exchweb/version/controls directory was being used for events on this page and also I found that the ID for the drop down box I wanted to modify was selFindIn.
The next important thing was to come up with a function I could add to the script that would insert another option into this dropdown box. The document object was used to create a HTML Option tag, give it a value of 2 and then create a text node which contains the text that will be displayed in the box. The rest of the function ties the HTML together and then appends it into selFindIn tag block. The function looks like
// -------------------------------------------------------------------------------------------------------------
function addoptionitem()
{
var newoptionvalue = document.createElement("OPTION");
newoptionvalue.value = "2";
var oTextNode = document.createTextNode("Public Folder Contacts");
newoptionvalue.appendChild(oTextNode);
var objselfindin = g_winDocAll.item("selFindIn");
objselfindin.appendChild(newoptionvalue);
}
// -------------------------------------------------------------------------------------------------------------
To ensure this function will run a modification is also needed to the window.onload() event function defined in the script. Basically all that is involved was putting some code after the current last line in the function that would run my custom function in the onload event.
window.document.body.attachEvent("onkeydown", event_window_onkeydown);addMessage("", false);event_FindIn_change();g_winDocAll['DN'].focus();
// ------------------------------------------------------------------------------------------------------------------
addoptionitem();}
// ------------------------------------------------------------------------------------------------------------------
Once this is done I had a piece of functioning code that would add an extra item into the drop drown “find name in” box. The only thing missing is that it won’t do anything because there is nothing defined if the option value is 2 when the find button is pressed. Currently what happens when you select contacts and click find is that it does a WebDAV search of the contacts folder using the parameters entered. The only thing that needs to be changes in the current code to make this search a public contacts folder was the actually folder that is being searched. So I decided to go with reusing the functions that are already there for the contacts search and just modifying them so it would check and change that location it’s searching against if the option value is 2. To do this required editing another 2 existing functions. The first function that need to be modified was the event_button_find() this is the code that is run when someone presses the find button in the Web dialogue. All that I needed to modify was one if statement which currently said if the selFindIn value is 1 run this code so I changed it to if SelFindIn is 1 or 2 run this code. The following change was made
// ------------------------------------------------------------------------------------------------------------------
else if (selFindIn.value == 1 || selFindIn.value == 2)
// ------------------------------------------------------------------------------------------------------------------
Once this change was made this means that if Contacts or Public folder Contacts is selected it will run the same function. The next function in line is the queryGetContactsData() this function builds the webdav query of the contacts folder. Within this function I’ve added a if statement so if the selFindIn.value is 1 it runs the normal code it would usually run but if its two it will run one line different which changes the location it will perform the query from the contacts folder to the public folder contacts folder. There is a variable already defined that holds that URL of the public folder tree for the user so as long as there is a replica of your public contacts folder on this server all you need to do is append the name of the contacts folder you want to use. I defined a variable called g_sPublicContactsFolder to hold this information
// ------------------------------------------------------------------------------------------------------------------
if (selFindIn.value == 2){
var g_sPublicContactsFolder;
g_sPublicContactsFolder = g_sPublic + "PubContacts";
var oReq = new requestFactory(g_sPublicContactsFolder, "SEARCH", null,event_getData);}
else {
var oReq = new requestFactory(g_sContactsFolder, "SEARCH", null,event_getData);}
// ------------------------------------------------------------------------------------------------------------------
This part of the code you need to customize yourself in this example the contacts folder is called PubContacts and its just off the root of the public folder tree. g_sPublic holds the value of the Root public folder tree eg http://server/public/ so you just need to append the rest of the path.
That’s about it, but now you need to think about the problems of actually doing this. Firstly modifying this .js file isn’t supported. One reason for this is pretty obvious the files themselves are held in the /exchweb directory within a versions/controls directory. What version you have of these files is going to depend on what service pack you run and what hotfixes you have applied. For instance I currently have version 6.5.7232.34 of these files which came out of the KB 883543 hotfix. So if you don’t get where I’m going with this if you make changes to your files today apply a hotfix or the next SP your changes are going to get blown away. And because changes to these files don’t get documented when updates are released, you really need to start again and modify the new files sourced from the service pack/hotfix or risk OWA not working because of changes that have been made. Other problems you could have are that you need to have a replica of the public contact folder on the server that’s being uses for OWA. Also IE tends to cache this file so if you make an error modifying the script every time you make a change to the file you need to purge the file cache in IE (e.g. delete temporary internet files) so it will use the new version (It’s very easy to be fooled by this). You need to make sure you have got it right in a dev environment first and even then you may face problems with having the file cached by some clients.
I’ve put a downloadable copy of the 3 functions I modified and the 1 new function (you just need to add this at the bottom of the current script) here this is for illustration purposes only as I mentioned these files change regularly so if you do want to make changes you should make them yourself and understand what your doing. Also before you make any change, make sure you backup the existing dlg_gal.js file as this is your rollback plan.
This brings up the first question of how can I customize OWA I went digging though some old whitepapers and found this one about customizing OWA 2000 which is mostly still relevant to Exchange 2003. The low down from this whitepaper is the core HTML used to render OWA is stored in the wmtemplates.dll file which means that you can’t really mess with it. There are some other warnings in this whitepaper about any changes made to the .js, htc or xml files used by OWA are unsupported. But further on they give you an example of modifying one of the script files used by OWA to change the NAV bar. Siegfried Webber also has a sample on his blog that shows how to add a button to the NAV bar in OWA 2003.
What I learnt from these two sources was that although you can’t modify the OWA core code directly the scripts that contain all the page events that OWA loads can be modified and the document object can be used to insert your own custom code back into what gets rendered to the client.
So the first thing I had to do is work out which script was being used when you click the address book in OWA. This is where Ethereal (or some other packet capture program) is invaluable. Doing a capture I could see that file dlg_gal.js which is in the exchweb/version/controls directory was being used for events on this page and also I found that the ID for the drop down box I wanted to modify was selFindIn.
The next important thing was to come up with a function I could add to the script that would insert another option into this dropdown box. The document object was used to create a HTML Option tag, give it a value of 2 and then create a text node which contains the text that will be displayed in the box. The rest of the function ties the HTML together and then appends it into selFindIn tag block. The function looks like
// -------------------------------------------------------------------------------------------------------------
function addoptionitem()
{
var newoptionvalue = document.createElement("OPTION");
newoptionvalue.value = "2";
var oTextNode = document.createTextNode("Public Folder Contacts");
newoptionvalue.appendChild(oTextNode);
var objselfindin = g_winDocAll.item("selFindIn");
objselfindin.appendChild(newoptionvalue);
}
// -------------------------------------------------------------------------------------------------------------
To ensure this function will run a modification is also needed to the window.onload() event function defined in the script. Basically all that is involved was putting some code after the current last line in the function that would run my custom function in the onload event.
window.document.body.attachEvent("onkeydown", event_window_onkeydown);addMessage("", false);event_FindIn_change();g_winDocAll['DN'].focus();
// ------------------------------------------------------------------------------------------------------------------
addoptionitem();}
// ------------------------------------------------------------------------------------------------------------------
Once this is done I had a piece of functioning code that would add an extra item into the drop drown “find name in” box. The only thing missing is that it won’t do anything because there is nothing defined if the option value is 2 when the find button is pressed. Currently what happens when you select contacts and click find is that it does a WebDAV search of the contacts folder using the parameters entered. The only thing that needs to be changes in the current code to make this search a public contacts folder was the actually folder that is being searched. So I decided to go with reusing the functions that are already there for the contacts search and just modifying them so it would check and change that location it’s searching against if the option value is 2. To do this required editing another 2 existing functions. The first function that need to be modified was the event_button_find() this is the code that is run when someone presses the find button in the Web dialogue. All that I needed to modify was one if statement which currently said if the selFindIn value is 1 run this code so I changed it to if SelFindIn is 1 or 2 run this code. The following change was made
// ------------------------------------------------------------------------------------------------------------------
else if (selFindIn.value == 1 || selFindIn.value == 2)
// ------------------------------------------------------------------------------------------------------------------
Once this change was made this means that if Contacts or Public folder Contacts is selected it will run the same function. The next function in line is the queryGetContactsData() this function builds the webdav query of the contacts folder. Within this function I’ve added a if statement so if the selFindIn.value is 1 it runs the normal code it would usually run but if its two it will run one line different which changes the location it will perform the query from the contacts folder to the public folder contacts folder. There is a variable already defined that holds that URL of the public folder tree for the user so as long as there is a replica of your public contacts folder on this server all you need to do is append the name of the contacts folder you want to use. I defined a variable called g_sPublicContactsFolder to hold this information
// ------------------------------------------------------------------------------------------------------------------
if (selFindIn.value == 2){
var g_sPublicContactsFolder;
g_sPublicContactsFolder = g_sPublic + "PubContacts";
var oReq = new requestFactory(g_sPublicContactsFolder, "SEARCH", null,event_getData);}
else {
var oReq = new requestFactory(g_sContactsFolder, "SEARCH", null,event_getData);}
// ------------------------------------------------------------------------------------------------------------------
This part of the code you need to customize yourself in this example the contacts folder is called PubContacts and its just off the root of the public folder tree. g_sPublic holds the value of the Root public folder tree eg http://server/public/ so you just need to append the rest of the path.
That’s about it, but now you need to think about the problems of actually doing this. Firstly modifying this .js file isn’t supported. One reason for this is pretty obvious the files themselves are held in the /exchweb directory within a versions/controls directory. What version you have of these files is going to depend on what service pack you run and what hotfixes you have applied. For instance I currently have version 6.5.7232.34 of these files which came out of the KB 883543 hotfix. So if you don’t get where I’m going with this if you make changes to your files today apply a hotfix or the next SP your changes are going to get blown away. And because changes to these files don’t get documented when updates are released, you really need to start again and modify the new files sourced from the service pack/hotfix or risk OWA not working because of changes that have been made. Other problems you could have are that you need to have a replica of the public contact folder on the server that’s being uses for OWA. Also IE tends to cache this file so if you make an error modifying the script every time you make a change to the file you need to purge the file cache in IE (e.g. delete temporary internet files) so it will use the new version (It’s very easy to be fooled by this). You need to make sure you have got it right in a dev environment first and even then you may face problems with having the file cached by some clients.
I’ve put a downloadable copy of the 3 functions I modified and the 1 new function (you just need to add this at the bottom of the current script) here this is for illustration purposes only as I mentioned these files change regularly so if you do want to make changes you should make them yourself and understand what your doing. Also before you make any change, make sure you backup the existing dlg_gal.js file as this is your rollback plan.