Page 1 of 1

[old] - Web Interface Fixes + IE 7/8 Full Support - 1.1

Posted: Fri May 01, 2009 3:06 am
by mitch
All of the below changes have been merged into trunk, this patch and no longer needed.

Current version: 1.1
V1.1 Changes
Added scaling for Montage view
Added waiting on the backend for sockets to get setup (should fix issues where people would not have the stats for a video loaded consistantly and other issues)
Fixed zm_monitor/zm_image bug where the detection for if the writing of an image to a stream was not correct so even if it failed it would think it succeeded. This should fix where zms processes can run forever as they think they are still sending frames even though the stream is dead.
Added a safety check to zm_monitor so that if it doesn't send a frame for 10 seconds or more it will kill itself off. Keeping in mind that even when paused a keep alive frame is sent every 5 seconds. This will also catch a bug where if a camera was offline (so reading frames was invalid) zms would just run forever in a loop.
Note: You can no longer apply the patch directly to the web directory if you want all the changes as there are backend changes too now.

Initial Post:
While I am sure many of you hate on IE some of us (atleast myself) use it, and ZM is not exactly 100% IE friendly/compatible. Even those who use other browsers or the mobile version can gain something from this. Please note that this does add some additional error handling, that normally would be swept under the rug. If you are having problems in zone minder with things not working look at your javascript error console (control + shift + J in firefox, or F12 in IE8 and turn on script debugging then look at the javascript console) it may contain some very useful error messages about server side errors. Another option that may be easier is to just open up: skins/classic/includes/functions.php and right before </head> put:

Code: Select all

<script>console.error = alert;</script>
it will popup a box any time there is an error, which is certainly helpful in catching server side issues. Overall I find the web interface less buggy after these fixes. If you know of anything else in the web interface that doesn't work in all browsers (or even just in IE) let me know how to reproduce the error and I am happy to look at it.

This patch is against trunk and should do the following:
*IE: Fix zooming/scaling of events/live streams
*On event pages checks all server responses for errors and doesn't continue if there are any
*IE: Still thumb image popup box would sometimes appear off screen so you would have to scroll, no longer should happen
*Stills would sometimes not auto show up and rather require clicking on timeline bar
*MOST of the time clicking on a still image thumb to pop it up and zoom it would NOT work, not clicking the image will always zoom it.
*IE: Still thumbs would show up VERY wide and not at correct size, now they show proper thumb size
*IE (possibly others): skin.js overwrote console debugger even when it existed so debug messages would not properly log
*Mobile skin fix, for those who couldn't get the mobile skin to even load it should probably now work properly with index.php?skin=mobile


The patch is at: http://mitchcapper.com/zm_web_fixes.patch
To apply this patch in your ZM checkout folder just do patch -p0 < zm_web_fixes.patch if you want to check if it will work against the dryrun option like: patch -p0 --dry-run < zm_web_fixes.patch . If you are daring you can just apply it direct to your web folder (may work on 4.21) in your web folder just do: patch -p1 --dry-run < zm_web_fixes.patch if you are lucky no failed merges. Note if you do it in your web folder it will get overwritten next time you do a make install. There is no reason this can't be applied to trunk officially if someone wants to do that. Note that 1.1 and greater includes some changes to the backend that will not work if directly applied to the web folder.



For those who want the technical details quickly:
*IE thumbs were too wide as it would take the width from the transparent placeholder image then when swapped the CSS would properly set the height but unlike FF IE does not keep the ratio, so IE needed the height also in CSS
*Clicking a still thumb to zoom it would only work if not loaded, if already loaded it wouldn't pass the loadImage var so wouldn't do anything when clicked.
*skin.js was overwriting the console debugger due to faulty logic, it did if (! window.console) var console= except in javascript there is NO scope except function level scope, so that var console= would actually always be global and thus IE8 (and maybe others) that only add the console debugger if its not in the global scope would not add it
*While most of the ajax page libs (montagejs/watch.js) have proper error handling if the server returns an error, event.js had next to none. Added a function to skin.js to handle the checking of a returned server object to make sure its valid.
*the mobile console page had a php warning which would break the markup due to using $_REQUEST['view'] instead of $view(like classic console) in a variable output.
*IE for scaling we try to get the liveStream object/img however for one in IE8 atleast it is actually an "APPLET" not an object. Secondly as cambozola is a JAVA applet most javascript calls can't be used on it, so using moo tools $() to get it causes it to break. I used standard calls on the zooming items to fix that.

Posted: Mon May 04, 2009 11:09 pm
by mitch
updated to 1.1 with the largest changes being some backend stream error detection so if you run into many zms processes hanging around even though you arn't using them this should resolve most if not all of those.

Posted: Mon May 04, 2009 11:38 pm
by cordel
Thanks for that and good show :D
It's not that we hate IE, we just don't use it :lol:
Besides it's not like they make it available in Linux now do they even though they seem keen to run and use it in M$ :lol: :lol: :lol:

[edit] I should clarify that I meant that M$ is keen on running Linux on quiet a few of their servers.

Posted: Mon May 04, 2009 11:47 pm
by henriquejf
very complete and useful! Great work man !!!

Posted: Tue May 05, 2009 8:47 am
by timcraig
Thank you for this patch!

The montage scaling is very helpful.

Posted: Fri May 08, 2009 9:37 am
by zoneminder
Thanks for this. I am going through and merging what I can into the trunk.

The only thing I have foudn that I won't apply directly is the stills explictly set width in event.css. The reason for this is that the 107px you have chosen as the width works for 320x240 ratio images and will just about do for 352x288 images which is the default ratio for non-NTSC analog cameras, and which would really need a width of 97px or so.

However if you have a camera reoriented as 240x320 for instance then the height needs to be greater than the width to avoid distortion. It is a bit of a PITA that IE doesn't keep the ratio so to get around that I have had to change things slightly so that the height in event.css is actually used as a %ge scaling factor and the real heights and widths are calculated from applying that to the full size image dimensions. Not a pretty solution but I think it avoids the issue when cameras have more unusual aspect ratios.

I am curious as to why the mootools selectors and functions won't apply to applets, is that documented somewhere as I would like to research it a little further?

Cheers, and thatnks again for taking the time to do the patch.