Sinuous Technical Notes

This one had me stumped for a while, I was getting errors like

can't dump File

C:/dev/ruby/current/lib/ruby/gems/1.8/gems/transaction-simple-1.4.0/lib/transaction/simple.rb:132:in `dump'
C:/dev/ruby/current/lib/ruby/gems/1.8/gems/transaction-simple-1.4.0/lib/transaction/simple.rb:132:in `start_transaction'
etc.

Which were thrown when rendering a table in PDF Writer. It turns out that the whole pdfwriter object needs to marshal-able and mine wasn’t. I had inherited pdf writer and added a logging function to help debug some other issues


def logger
@logger ||= Logger.new "#{RAILS_ROOT}/log/debug.log"
end

@logger was now storing a reference to a file which wasn’t marshal-able so it broke the siple table render_on getting rid of the class object (@logger ||= ) fixed the problem even though it made the logging less efficient.

I finally got tired of living without cross browser vertical align property in css and after a bit of searching and trying a few different methods here is the one that I went with in the end. It requires some ie only styles which isn’t ideal but it gets the job done.

In this instance I wanted to center (vertical and horizontally) an image inside a div 80px by 80px - the image was being resized by server side code and I knew that no side would be longer than 80px;

The fix revolves around using table positioning in Firefox, Safari and Opera and relative positioning voodo in Internet Explorer.

html:

<div class='thumbnail'><div class='img_wrapper'><img src='....' /></div></div>

css:

.thumbnail {width:80px;	height:80px; text-align:center;	display:table;}
.thumbnail .img_wrapper { display:table-cell; vertical-align:middle; }

ie-only css:

.thumbnail {position:relative;}
.thumbnail .img_wrapper { position:absolute; top:50%; left:0px; }
.thumbnail .img_wrapper img { position:relative; top:-50%; }

use your favourite method for applying ie only styles- I prefer ie only stylesheets

<!--[if IE]>
<link rel="StyleSheet" href="/css/ie-style.css" type="text/css" media="screen"/>
<![endif]-->

Today a strange rendering bug in adobe flash caught me out today. A small white box would appear in a flash video window - but only on the Apple Mac. I’d tested the video play back on windows and mac in flash version 9.0.28, and all seemed well, however when i watched the entire video through on a mac a strange white box would appear to flicker and flash near the corner of the video window.

I had no shapes in the swf that could be causing this so i thought i’d upgrade the flash player on the mac to version 9.0.115 and suddenly the flickering white box was gone. Note there was no problem displaying with the windows version 9.0.28.

The flash changelog doesn’t show any particular fix for this issue, but it does seem that they have done some heavy development in the video realm (the H.264/HE-AAC codec i’m particularly happy about).

Earlier this week I was testing a site and noticed some weird extra characters being displayed in the page, I checked the html source to see where they were coming from. the characters being displayed were:

-->

ah! easy that’s just an end html comment, I must have left in by accident, but when i checked the source it was not the case, there were no end comment tags that had not been opened by the appropriate begin comment tag. On closer inspection I did notice something funny:

<!--
<tr>
<td>Phone:</td>
<td>--</td>
</tr>
<tr>
<td>Email:</td>
<td> </td>

</tr>
-->


it turns out that the two minus characters were actually ending the html comment, and so the actual end comment tag was seen as extraneous. I thought that was pretty odd, so i checked how things rendered in opera 9.5 - looked fine, IE 7 - looked fine, so then I tried the w3c validator to see if there was anything invalid about having two minus characters inside of an html comment. The validator complained about them - bitterly, so who’s right here? is this merely a parsing bug in the w3c’s validator and the firefox renderer, or are Microsoft and Opera wrong for hiding my mistake?

I was getting this error today when trying to connect to a SOAP service using the built in php5 soap extension, i’m not sure if it had anything to do with it but the soap service offers SOAP 1.1 and 1.2 methods simultaneously. Upgrading to PHP 5.2.4 fixed the issue, and i note in the PHP 5 change log a number of bug fixes in the internal soap classes.

This is mentioned in the php manual, in php4 the get_class function returns the class name in lower case while in php5 it is returned in the true case the class was defined in. eg: for a class called DateSpan

PHP4: get_class($dateSpan) == ‘datespan’;

PHP5: get_class($dateSpan) == ‘DateSpan’;

We recently moved a substantial application from php4 to php5 and it all went very smoothly, nearly…

The code had been thoroughly tested against php5 and was passing all the tests. We’d had problems with php5 passing objects by reference rather than value which had broken code in the pass and we knew we had that base covered. The problem was that we had tested against php5 on windows and were deploying to php5 on linux. Our code used the old domxml library which you can get as an extension quite easily for windows but for linux it was an absolute nightmare.

Domxml has been removed from php5 for what I’m sure are very good reasons and moved to the pecl library. Fair enough, the new dom library is by all reports far superior. Except the pecl library doesn’t have the actual extension on their website so ‘pecl install domxml’ fails.

I managed to track down the domxml source code in the pecl CVS but the bloody thing wouldn’t compile - and would die on
configure: error: Either use deprecated dom or new dom5 extension.

Now the only useful page with this error message was in german
luckily enough I did quite a bit of german at high school so between my fragmenting memory and google
I managed to get the gist of the post which was - I had the same error and fixed it by reinstalling libxml2. Unfortunately our libxml2 library had 48 dependencies so bugger that for a joke.

We’re now rewriting the part of our app that uses domxml.

Interesting cross browser compatibility problem with safari last night. If the form action was left blank then normally the form should submit to the current page it is on - this worked fine in IE and firefox but wouldn’t work in safari. I suspect this had something to do with the base href meta tag - changing the action to the filename of the current page as a relative path fixed the problem.

Just one more thing to add to the growing list of checks we need to do when building sites for multiple browsers - don’t use empty form actions!

I updated my RDT plugin (version 0.9.0.200704141430RC1) in eclipse this morning and it broke my radrails servers and rake tasks.

My log file looked something like

!ENTRY org.eclipse.core.jobs 4 2 2007-04-19 11:38:16.345
!MESSAGE An internal error occurred during: "Update rake tasks".
!STACK 0
java.lang.NoClassDefFoundError: org/rubypeople/rdt/internal/launching/RubyRuntime
at org.radrails.rails.internal.core.RailsRuntime.rubyExec(RailsRuntime.java:95)
at org.radrails.rails.internal.core.RailsRuntime.rubyExec(RailsRuntime.java:181)
at org.radrails.rails.internal.ui.raketasks.RakeTasksHelper.getTasksText(RakeTasksHelper.java:94)
at org.radrails.rails.internal.ui.raketasks.RakeTasksHelper.getTasks(RakeTasksHelper.java:68)
at org.radrails.rails.internal.ui.raketasks.RakeTasksView$4.run(RakeTasksView.java:192)
at org.eclipse.core.internal.jobs.Worker.run(Worker.java:58)


Reverting to my previous configuration (’Help’ > ‘Software Updates’ > ‘Revert to Previous’) worked like a charm so I’ll wait until the Aptana crew release an update for Radrails as well.

If you have a large collection of elements on a page that you want to change the css properties of you can dynamically change the css rules instead of iterating through every element on the page.

here is an example of how you can get hold of two css rules and manipulate them


if(document.styleSheets){
var sheet = document.styleSheets[0]
}
if(sheet){
var ssRules = sheet.cssRules || sheet.rules;
}
if(ssRules)
{
var result = null;
var common_style = null;
var different_style = null;

for(var c = 0; c < ssRules.length;c++)
{
if(ssRules[c].selectorText == ".different")
{
different_style = ssRules[c];
} else if(ssRules[c].selectorText == ".common")
{
common_style = ssRules[c];
}
if (different_style && common_style) break;
}
}


You can now change their position using common_style.style.display = ‘none’ etc.

Thanks to http://www.thescripts.com/forum/thread90644.html for the snippet