 Thanks for coming. My name is Cisco Fauli and today I'm going to talk about the current support of SVG filters in LibreOffice. Previous to 7.6, there was not support of SVG filters at all and then one day I stepped upon an issue talking about reporting one of the missing filters and well I thought well there is a similar feature implemented by Maikagansky for Impress. It was about blue filter so I thought okay let's take a look and see if I can fix it just as a challenge to myself and then after a few hours I could fix it and I decided okay let's move to another filter and so on and so on and then while working on these filters I also identified other SVG related issues so I thought okay let's try to fix those as well and in the end well I fixed a bunch of SVG related issues and I'm gonna talk a bit about in this presentation. So in the standard SVG standard there are 16 filters so some of them already supported in LibreOffice 7.6 and some others are not so we're gonna go through those filters first and then I'll talk about other SVG related fixes. So this is the one I mentioned before this is really a simple example but basically we can see that we have a cycle and basically it's using the attribute filter with the URL to the filter and then well it's basically using a blue filter this is the first one I implemented and in order to do so I use the primitive the existing one soft edge primitive then this is another kind of filter well I forgot to mention that I'm using a lot of screenshots in this presentation so it's easy to understand yeah this is another kind of filter this is for the drop shadow so it basically uses different attributes like the deviation, the color or the opacity so in order to implement this filter I have to use the shadow primitive to the primitive and then the unified transpire primitive. Another one was the flute filter before it was implemented when for this particular example LibreOffice just gave an error that it could be imported because when LibreOffice doesn't have anything to display from a SVG file it basically gives a general error and you cannot open anything and on the right we can see how it looks now it's just a poly polygons color and then I also use unified staff to implement this one same for this one there is a filter where you can basically use an image in this case this is a data image a base 64 so before it was just a blank rectangle and now on the right you can see how it looks in 76 and for that the bitmap primitive was used same for the offset basically this filter just creates well it applies a transform primitive on the object and creates another one with the offset indicated in the filter so we see that on the left no second object was displayed and how it looks now and then well this this color matrix filter which basically you can either use different kind of types for this one this is the luminance to alpha color matrix probably you cannot see much on the right but it should use a great scale and it this did was already implemented in the base graphic module so basically what it does is to apply this equation to the RGB values we have also the same color matrix but in this guide in this in this type is the hue rotate so the same before no color modifier was applied and then on the right we see that this apply in the equation we have there and this was wasn't this was wasn't existing in the code page so I had to add it and yeah the same for the type saturate we also see that well that's the equation that the standard defines and the same for matrix we can pass a matrix of zeros or ones to the as a value when we define the filter so in this case because when we look at the matrix the first row is zero and the second one is once that stands for the green that's why when we apply this color matrix the result is that all the side the circles are green so basically it's applied this equation and yeah those are the filters that are implemented at the moment but there are still 10 remaining ones for those that are already applied it was kind of straightforward straightforward to map those filters from the SVG to the primitives but I think for this one I didn't look deeply but it seems that we missed some of these primitives in you know code base so we we should I mean we would have to create those and that's something that at the moment I am not capable of doing but maybe in the future or someone can maybe know what's going on that can implement some of these missing filters I added a couple of links with with this valuable information a lot of information from Mozilla and also from the standard and yeah this is another part that is missing this is a kind of yeah I forgot to mention that when you apply a filter to an object in or to an element in SVG you like in the examples I gave I was just using one filter but actually you can use different filters for the same object so they apply on top of each other so for instance in this example here we see that it's using two kind of filters so the turbulence and the displaced map and there these three attributes the in into and result that LibreOffice doesn't support at the moment yet basically what we what they are used for when we have the first filter then we can for the second one we can say okay when they in attribute to take the input from in this case source graphic or it means it's using the graph the graphic itself but you could also use the alpha or the background or different elements of the image and then well basically the turbulence is saving the result in turbulence value and then the second filter is using the attribute into turbulence which means I want to the output of the first filter I want to use it so this is not supported at the moment and then for other related SVG issues well so CSS styles were already supported but there were some cases where it was not working for instance in this case when we have if you look at the style element we have a element inside inside another element like G space red which means like every rectangle inside a G element has to apply the field green so that didn't work in the past and now it works so that's why we see the first rectangle on the right to be great the same for the child combinator so when we have for instance we have G1 the child combinator a wreck it means that every wreck that it's inside the element G1 it's gonna apply the this attitude at this style so that didn't work in the past and now it's fixed then related to text layout well there was not support for the attribute dominant baseline so basically before all lines had the same yeah they look the same and now with the fix we can indicate that well we want to use the auto or the middle or handling so then the different lines the text lines are displaying differently and same for text and encore in the past when there was text element with other elements inside it like in this case we have for each line we have a TSPAN element inside text element so the problem was that this encore was not applied to the to the text children so it looks a bit weird and now it looks like it's the same text line so that's that was also fixed and finally the attribute DX was not well basically it was implemented but it didn't work at all basically you can use a vector of positions for the DX element so if we have a world of four letters and then we have the vector of DX is four values we can apply it for each element of the world to every letter so that's how it looked in the past and now well the problem it was that basically every graph was yeah place they were scum ball and put overlapping so it was I mean like reading text was really difficult and yeah so now it looks this is just a basic example but yeah now it looks much better so summary well during this time six filters were supported out of 16 so still a bit away to go but that's a start 71 commits where I did or committed in SVG IO which is the module for the SVG filter for the import part then 30 new unit test were added to this module which makes developing more give you more confident because you know that well there were already some some unit is but it feels safer to work on this because you already know that many cases are already covered and also when when I was working on implementing the color modifiers in the base graphic module I added seven new unit as there as well so in total 27 new bug reports were created but well why why working on it I reported 27 bug reports of all the SVG SVG bugs that we have in Baxilla I fixed 37 and then other were fixed as a duplicate so that's yeah I feel good about it and there is a meta bug at the moment I think that there is still 60 bugs open out of 200 but yeah that's an improvement and that's basically it so thank you and any question yeah Mike Mike is there you mean like I think if you I think if you have the document locally you can use that yeah I have to check I mean actually the SVG filter supports many kinds of images not just this one here this was just an example but it supports other kind of images like I think relative like a face are supported and I don't think you can use a URL for instance like I don't think like for instance in the browser you you can use an SVG with links to a website and then you have the image there but in liberal office I don't think that's working for security reasons thank you