If you are looking for the decompiler itself, visit https://github.com/jindrapetrik/jpexs-decompiler
NEW : We have got a new blog where we post some interesting SWF internals info.
List of issues#558 Frames as SVG
Author: 
psykauze
psykauzeDate created:
Type: feature
Visibility: Everybody
Assigned to: 
honfika
honfikaLabels: SVG
State: closed 
Hello,
My utopic hope is to convert Flash files as animated SVG+CSS3 files for being HTML5
compliant.
But for now, I will explain my feature proposal:
- A frame is a combination of multiples shapes and other advanced features. Maybe you
could at least combining the shapes together with one single svg for each frame like
this:
<svg version="1.2" width="551" height="401" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<image x="-213" y="-6" width="800" height="500" xlink:href="1.svg"/>
<image x="166" y="-36" width="800" height="500" xlink:href="2.svg"/>
<image x="-28" y="45" width="800" height="500" xlink:href="4.svg"/>
</svg>
Sincerely.
I'll implement a basic SVG export now (as it is in your example). It won't support the
filters, cropping, animations and maybe some other "extra" features.
Assigned: → honfika
honfikaImplemented in the latest nighty build.
Filters, cropping, animations and text exports will be implemented later (maybe) if you
need them.
State: new→upgraded
There is a small problem with this external image refenreces. It is working only in
Internet Explorer.
So when you embed the generated svg to an html file, it won't work in FF and Chrome.
Reason is: https://bugzilla.mozilla.org/show_bug.cgi?id=739726
In chrome the reason is probably the same.
So I'd prefer to embed the files, so generate only 1 svg. What so you think?
Btw: static text export is implemented in the latest nightly.
Yes, maybe they are true to not implement this feature for security reason (svg bombing
perhaps?)
I will try the latest nightly build later and will report bugs if I found any.
Ok, I have tested the nightly build and I see the issue. You are including svg shapes in
svg shapes and Firefox/chrome engines do not allow (yet?) this feature.
I think this should be resolved by linking only original svg shapes and put all the
transform in the root svg files.
It wont solve the problem. When you open the svg directly in FF then the images will be
wicible, but when you put this svg file to an html: <image src="root.svg" /> then the
referenced images wont be visible...
So the only solution is to embed everything to 1 svg.
wicible = visible
Ok, you are right. Seems the firefox/chrome engine do not allow reference links on more
than 1 depth.
Maybe you should embed the referenced svg datas directly in a <defs> element.
I have tried to embed manually all the shapes in the first frame by using the <defs> tag
and it works.
In this sample I do not have embedded the text shapes because I think it should be more
interresting to use the <text> tag.
0.svg
Text75.svg
Text84.svgYes, sometimes it would be better to use text tags (svg would be smaller), but the problem
is that in swf all character has its own shape. So it is possible that there is a font
called "Times New Roman" in the swf, but the shapes are from a diffrent font. Maybe JPEXS
can tell more about it.
So when we use text tags, then it is possible that the result will be diffrent in the
generated svg.
I think the fonts are embedded in the SWF maybe you can embed the font used in the SVG.
I do not try it yet but it may possible to use a custom font in svg with a CSS style like
this:
<style>
@font-face {
font-family: "ITCGothicBold";
src: url('fonts/ITCGothicBold.ttf') format("truetype");
}
</style>
Ok, and it should be embedded in the svg, otherwise probably it wont work in FF.
btw:you can try html5 canvas export. It was implemented by JPEXS, and it is very cool:)
I have tested it and you are right. You can embed datas in base64. For TTF font you can do
it in this way:
<style>
@font-face {
font-family: "Juice ITC";
src: url('data:font/truetype;base64,[AAEAAAAR*...*ysdAAA=]') format("truetype");
}
</style>
I send you a modification of the previously sended files.
0.svg
Text75.svg
Text84.svg
According to this:
http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp
TTF embed is not supported in Internet Explorer.
WOFF format is needed.
honfika: WOFF file generation was part of Fontastic library which we use for TTF export
but I stripped it out earlier. Maybe we could put it back in...
Ok, I just made manually a svg file with the same frame with svg as font embedded on it.
Each defined characters as named like id="font_name-char" and used as shapes.
Here a list of new ideas:
1) I see that the 'space' character as written in the svg file, I do not think that should
be useful.
2) Maybe you should make different exporters for frames, shapes and sprite, one is
Full-SVG with each text chars converted to SVG, the other (Embed-SVG) with searchable text
and WOFF? font embedded
Frame0-fullsvg.svg (66 KiB)
index.html (235 B)About space character: It is just a char as other characters, so we should not
differentiate it from the others. (I think it can have a shape in some fonts, for example
i can imagine a font, where a space is "_")
But it is a good idea not to add a "g" tag, when it is empty. In this case all whitespaces
will be removed from the svg.
Please check the latest nightly build. Is it ok now?
I have checked the latest nightly build and there is some differences with shapes
positioning comparing my manually-writed file.
Here after 2 version of the same frame. Frame0-truesvg.svg is my file, the 0.svg is the
exported file from the latest nightly build.
I do not wich one is more true.
Frame0-truesvg.svg (67 KiB)
0.svg (70 KiB)Fixed. TTF export also added. You can turn it on in advanced settings
(textExportExportFontFace).
When this settings is used, the result can be slightly diffrent. For example when the text
has letter spacing, it is not applied to the "searchable text" export. Please accept it.
Is it ok now?
+TTF export will be changed to WOFF export later to support IE.
Yes, this is great. I have tried the both exporters and bugs I have reported are fixed.
For the TTF embedded version there is 2 bugs:
1) The font-color is not implemented yet (You can use the *fill="#FFFFFF"* parameter)
2) The letter-spacing is to high for the sample I use, I don't know how to make the text
condensed in the same way (My sample use the textLength parameter to condense text)
I see an other bug in sprite 112 frame 55 to 93:
The circle containing the picture is missing. The picture is still square.
AprilFools-Frame0-svg.svg (70 KiB)
AprilFools-Frame0-ttf.svg (59 KiB)
AprilFools-Frame0.png (161 KiB)
AprilFool-Frame0-ttfmod.svg (59 KiB)
Sprite112-Frame92.png (169 KiB)
Sprite112-Frame92-svg.svg (81 KiB)Please try the latest version. Letter spacing information is not available in the font tag
as i mentioned it earlier, so you should set it manually:(.
And about the sprite problem. I mentioned earlier: "It won't support the filters,
cropping..."
I've modified the text length, as you suggedted. Now it looks much better, but it never
will be exactly the same as the original:
http://www.screenshotcomparison.com/comparison/72233
Maybe only when i create a text tag for each character. But then i think it is better to
use the first export mode.
I think you can just stay with this until we found a better way to ajust letter spacing
according to the swf data.
Cropping is implemented in the latest nightly build. I'm not sure if it is wokring
everywhere, but in your sprite 112 it should work.
State: upgraded→closed