Widget:Svganimation

    From The Document Foundation Wiki

    This is a widget for terminal recordings rendered to SVG animations with termtosvg. Use it like this:

    {{#widget:svganimation|file=/images/7/74/Termtosvg_test.svg|id=test|width=60%}}

    The width parameter is optional and defaults to 50%. You can use any web units with it.

    Termtosvg records asciinema files. These can be edited using either cirocosta/asciinema-edit or pocc/asciinema-edit.

    Render the SVG like so:

    termtosvg render input_file --template=window_frame_js

    For processing the SVG, so it can be uploaded to MediaWiki, use this Python script:

    # Script for processing animated SVGs rendered by termtosvg in order to
    # use them in a MediaWiki widget. MW does not allow <script> elements in
    # SVGs. The animation data is moved into a comment in the SVG and read
    # by the JavaScript in the MW widget.
    import sys
    import json
    import re
    import xml.etree.ElementTree as ET
    
    if len(sys.argv) != 3:
        print("Please give arguments for input and output files, example: python widgetify.py input.svg output.svg")
    
    inputfile = sys.argv[1]
    outputfile = sys.argv[2]
    
    # for quoting the keys - this is hacky, but works for our data
    class identdict(dict):
        def __missing__(self, key):
            return key
    
    # ElementTree normally drops comments
    class CommentedTreeBuilder(ET.TreeBuilder):
        def comment(self, data):
            self.start(ET.Comment, {})
            self.data(data)
            self.end(ET.Comment)
    
    ET.register_namespace("","http://www.w3.org/2000/svg")
    ET.register_namespace("xlink","http://www.w3.org/1999/xlink")
    ET.register_namespace("termtosvg","https://github.com/nbedos/termtosvg")
    ns = {'': 'http://www.w3.org/2000/svg', 'termtosvg': 'https://github.com/nbedos/termtosvg'}
    parser = ET.XMLParser(target=CommentedTreeBuilder())
    parsed = ET.parse(inputfile, parser)
    root = parsed.getroot()
    scripts = root.findall('script', ns)
    scripttext = scripts[0].text
    termtosvg_vars = re.sub('\n|\s|;', '', scripttext)
    termtosvg_vars = termtosvg_vars.replace('vartermtosvg_vars=', '')
    # change animation to not loop
    termtosvg_vars = termtosvg_vars.replace('Infinity', '1')
    quoted = eval(termtosvg_vars, identdict())
    as_json = json.dumps(quoted)
    for script in scripts:
        root.remove(script)
    defs = root.find('defs', ns)
    # this block in the SVG is not needed
    tplsettings = defs.find('termtosvg:template_settings', ns)
    defs.remove(tplsettings)
    root.append(ET.Comment(as_json))
    parsed.write(outputfile)