I’m re-coding an old web site from scratch, but the client wants to keep the design more or less unchanged. I’ve got as far as a basic HTML5 template with the Home Page content. I have converted the banner Flash file using Google’s Swiffy, so that it will work on iPads etc (not tested yet, but that’s the intention).
The Swiffy file is a JSON object, and much easier to ‘embed’ (using script tags) than SWF or video. It may have a great future, but I’m having a problem.
I have uploaded this page (mainly so the client can see it). It’s at http://webadit.co.uk/torrbuan. Using that link it works OK, the banner ‘movie’ displays properly, and the rest of the content is there. The ‘Home’ link is the only one I’ve put in so far.
However, if you click http://webadit.co.uk/torrbuan/index.php (or the ‘Home’ link), there’s a problem. The banner movie displays, but without its background. I refer to the background of the movie, not the background image of the <div>. The rest of the page looks fine.
This does NOT happen on my local server, no matter which form of the link I use. In any case they should surely be functionally the same ? (the .htaccess selects index.php first, and there are no other index files). The first link MUST be calling index.php because that’s the only way to load the template.
I’ve tried reverting to the original SWF, and that displays OK in both instances.
I cannot understand what would cause only part of the Swiffy file to function. It’s possible of course that the problem lies elsewhere, but I’m at a loss as to what it could be. Every test I’ve tried so far shows the versions of the page to be identical. It’s just that one lacks the background to the movie.
I can’t see a difference between those two pages. What am I missing? Is the “video” the moving bit at the top?
Thanks for your reply.
Yes. Top centre. What I’m seeing with the second link is just the moving text, and no hills in the background. What browser were you using ?
I’m developing with Firefox. Since my initial post I’ve discovered it’s OK in IE9, Safari and Chrome. So it’s a Firefox problem, and I get the same on another computer.
I’d understand a bit better if NEITHER link worked correctly in Firefox. What perplexes me is that we all know (dont’ we ?) that http://webadit.co.uk/torrbuan and [URL=“http://webadit.co.uk/torrbuan/index.php”]http://webadit.co.uk/torrbuan/index.php are functionally one and the same. There’s not even anything complex in ‘index.php’ yet:
/* Control script for Torrbuan web site 23 April 2013 */
// require_once "templates/wildlifeTemplate.html.php";
and there are no other ‘index’ files. I’ll try removing the commented line, but that smacks of desperation.
If it is a Firefox problem, why would it be OK on my local server, but not when I access remote files. Same browser in both cases.
These are largely rhetorical questions, which I’m trying to answer myself. But maybe I am not seeing the wood for the trees.
Hm, I was using Chrome. That Swiffy code looks too complicated to me. Obviously it doesn’t play well with FF. How about using <video> instead, with a Flash fallback?
Thanks for your reply.
I agree the Swiffy code looks complex, but it’s ‘only’ a JSON object, and it was very simple to embed (not that it used the <embed> tags, rather a pair of <script> tags). As I understand it, it uses SVG etc. to create the moving images. But there’s clearly an issue with Firefox, as yet unexplained.
I was going to use <video>, but that would mean getting the SWF file converted to video, and I found Swiffy before I found a free video converter that worked well. The one I did find (on a free trial) not only inserted a huge watermark, it also added a red cast to the image.
Is there one you’d recommend, please ?
Two really good ones I’ve used are Miro video converter and [URL=“http://handbrake.fr/”]Handbrake.
Thanks. I’ll give them a try.
LATER: I had a quick look. Neither seem to take SWF as input. Unfortunately that’s all I’ve got to work with.
I found one called pixelplant which did an on line conversion and sent back a set of files for embedding. I was even able to edit one of the background images. I’ve not yet done the embedding bit, so can’t comment further until later today.
Seems a shame that Google’s Swiffy doesn’t work reliably, though, it was so easy. I can’t find anything on Google’s web site about it. Perhaps another thing they’ve quietly abandoned.
O, sorry about that. I thought they did.
I found one called pixelplant
Looks like a good find. Bookmarked.
I didn’t see ‘SWF’ or ‘flash’ listed in the list of possible input files, but i suppose it might be worth trying.
pixelplant worked, but so far I’ve not been able to stop the result from looping endlessly.
I have a problem with Swiffy as well:
I’ve noticed HTML5 outputs from Swiffy don’t run if you’re offline, meaning that you sample won’t run in an offline ipad. Is there a way to make it work offline?
I can’t immediately answer that question as I run a local Apache server on my computers. Next time I run the site with the Swiffy component I’ll investigate.