A better way to add custom buttons to fancybox

So a few people contacted me that the earlier method doesn't work with the new fancybox. The method was a hack into fancybox anyways, and I've (along with our html/css designer and other developers) have a better way to do this. Here it is:

function formatTheTitle(title) {
return ''<div id="fancy-title"><div id="newWindow" class="fancyPopupDivNewWindow" onclick="newWindow()">&nbsp;</div>' + title + '</div>';
}

$("#theDiv").fancybox({
'centerOnScroll': true,
'showCloseButton': true,
'titlePosition': 'inside',
'padding': 0,
'scrolling': 'yes',
'showNavArrows': false,
'titleFormat': formatTheTitle
'title': '',
'type': 'iframe',
});

Basically you can ride on the format title property to add another button to the fancybox. This is the css you require

/* open in new window icon */
.fancyPopupDivNewWindow {
position: absolute;
height: 30px;
width: 30px;
cursor: pointer;
z-index: 800;
display: inline-block;
top: -15px;
right: 18px;
background: transparent url(../images/fancybox/newwindow.png) 0 0 no-repeat;
}

Another reason for the Flex #2032 error

So I came across another reason for the Flex #2032 error. In my case, it wasn't the crossdomain.xml that was the problem. This was an IE7/8 specific issue, Firefox was working fine. After a lot of head banging I found out this about Flex:
Flex strips the request of headers if you make a GET request. So if for some reason the server requires headers (like in my case), you will get a #2032 error. Just change it to a POST request if you have headers to send.

Adding custom buttons to jQuery's fancybox

The fancybox is a really cool way of displaying images, divs, etc. I really love its simplicity and coolness. I have started using it in many places now. But I had a problem. I wanted to add buttons next to the close button. Just like Windows has the maximize and minimize buttons next to the close button, I wanted a button that would open in a new window the contents of the fancybox.

I tried to figure out ways to do it without changing the code or the css, but it proved difficult. I would have had to use the onStart function and make changes to the outer div of fancybox dynamically. And also have to add functions for onClick, etc. So I decided that the best way would be to customize the fancybox.

So here is what needs to be done:

Add this to jquery.fancybox-1.3.1.css
#fancybox-customButton1 {
position: absolute;
top: -15px;
right: 15px;
width: 30px;
height: 30px;
background-position: 0px 0px;
cursor: pointer;
z-index: 1103;
display: none;
}


Add all of the following red lines to jquery-fancybox.1.3.1.js

Add var customButton1 on line 19
(function($) {
var tmp, loading, overlay, wrap, outer, inner, close, nav_left, nav_right, customButton1,


Add function on line 173
$('#fancybox-title').appendTo( outer ).hide();
},

fancybox_process_customButton1 = function() {
$('#fancybox-customButton1').css("background-image", "url(" + currentOpts.customButton1Image + ")");
}


Add this to _finish = function () around line 268
if (currentOpts.showCloseButton) {
close.show();
}
if (currentOpts.showCustomButton1) {
customButton1.show();
}

Add this around line 400,
fancybox_process_title();

fancybox_process_customButton1();

Around line 603, add the defaults
selectedOpts.showCloseButton = false;
selectedOpts.showCustomButton1 = false;

Around line 785, add the div
outer.append(
inner = $('

'),
close = $(''),
customButton1 = $(''),

nav_left = $(''),
nav_right = $('')
);

close.click($.fancybox.close);
customButton1.click($.fancybox.onCustomButton1Click);



Around line 995
} else {
wrap.fadeOut( currentOpts.transitionOut == 'none' ? 0 : currentOpts.speedOut, _cleanup);
}
};

$.fancybox.onCustomButton1Click = function() {
currentOpts.onCustomButton1Click();


Around line 1086, add the options that the user can change
showCloseButton : true,
showNavArrows : true,
enableEscapeButton : true,

showCustomButton1 : false,
customButton1Image : null,
customButton1Title : null,
onCustomButton1Click: null,

New laptop screens have lower resolutions

Anyone bought a new laptop recently? Anyone?

My four year old laptop is a 1GB, 2.0 GHz pentium. It has a 15" screen, with a maximum resolution of 1440 x 1024. It works beautifully, but after 4 years of manhandling, it has started to show its age. So began the search for a new laptop.

Technology for laptop screens has changed over the years, but I always expected it to get better and cheaper. Surprisingly, it hasn't. All the major laptop companies (Dell, Lenovo, HP) only have widescreen laptops now. They are advertised as 'HD' screens, and the advertised resolution is 720p and 1080p rather than the usual. The worst part is, a 15.6" 720p laptop screen has a maximum screen resolution of 1336 x 768, a lot worse than my 4 year old laptop!

Since I use my laptop for surfing the web and coding, a widescreen is useless to me. My wife and I hardly watch movies on the laptop, so what do we do with the right 25% the screen, which remains barren all the time?

Curious as to why laptop companies would simply stop caring about how people use their laptop, I searched the web for answers. Seems like now the screens come directly from TV manufacturers, who use the same technology to cut laptop screens that they use for your HD TV. This technology seems to be a lot cheaper than that used for the old screens, but it offers such a low resolution that I wonder if we are back in the 90's?

.reg file created by regasm cannot be ported between 32-bit and 64-bit!

When you create a .reg file using regasm

While working on the WS-Security project, I found out this really weird behavior. I was building my .NET dll on Win XP 64-bit, IIS6, VS2005 machine. But the .NET dll itself was compiled in 32-bit. I used Regasm to create a .reg file, which I then double-clicked to add registry entries.

But it wouldn't work! For some reason the registry entries could not be found! This worked fine on a 32-bit Win XP system. At last, I found out the reason: http://support.microsoft.com/kb/896459

The solution: Don't create a .reg file. Just use regasm .dll. Creating a .reg file for a 32-bit program doesn't add it correctly to a 64-bit system.

Flex Builder 3 leaking memory?

I have been noticing how flex builder 3 keeps on eating memory the longer you keep it open. It starts with around 120 megs of RAM, normal when comparing it with eclipse or visual studio. But the amount of memory keeps on increasing the more you use it. In one day of moderate usage it went to over 677 megs of RAM. Thats a little too much.

Implementing WS-Security in SOAP, for a C++ Dll called by IIS

I know the title is a mouthful, but the task was as complicated. My task was to do SOAP calls using WS-Security. For those who do not know, this means encrypting the SOAP request with the X.509 certificate. It was quite a task, and I'm sad that C++ failed me in this.

I have tried using C/C++ for implementing WS-Security, and failed. The only useful library in C++ is Gsoap, which works well for SOAP without WS-Security. It has a WS-Security plugin, which I tried using. But it was very difficult to use, there were build problems (I was working in VS2005, on Windows XP) and warnings that I had to get rid off, no good examples, support or forums (since hardly anyone was implementing WS-Security), and no transperency on how openssl was reading the certificates, etc.

The other way was using the deprecated MS SOAP Toolkit, but it is never a good idea to use deprecated tools for new technologies.

At last I tried to implement it using C#. To interface with C++, I could have created a Dll and called it as a COM object in c++, or just implemented a web service. I eventually got both done, but the decision was taken to implement the COM dll.

Implementing in C# wasn't without its own share of configuration problems:

• The Dll has to be installed in the Global Assembly Cache (GAC) using gacutil.exe. The Dll also has to be registered using regasm.exe.
• You need to install the X509 certificate. Otherwise you will get a ‘Class not registered’, even though the Dll has been registered and is in the GAC.
  
• Since this is a Dll run by IIS, no configuration file like app.config or web.config can be read by it. This is because IIS will not know where to find the file, or might not have permissions to the directory. The configuration needs to be hard coded.
• IIS needs to read your whole X509 certificate. Without that, IIS can only read the public key, and you will get the message “Object contains only the public half of a key pair. A private key must also be provided.” You need to set the user permissions on the private key by running WseCertificate3.exe. Run WseCertificate3.exe, open the certificate and give permission to the IIS process owner, usually the machine.
  
• The C# compiler (csc.exe) needs access to the C:\Windows\temp directory.
• Do you have custom headers? In that case hard code the configuration files app.config, web.config, etc into your code. In case the configuration is meant to add headers to your web references, make sure to edit the Reference.cs files created by web references to add this information.
  

Hope this helps those who are going down this path.....