DataURI
Instead of referring to an image included in an add-on, an image path may also contain the image directly as a Data URI (wikipedia). This can be useful for add-on icons in the PblWML (which may otherwise only contain core images) or for single-file scenarios.
Beyond these cases, Data URIs are less useful, as they are larger than the images themselves, and clutter up the files that include them.
Contents
Format
A Data URI appears as follows: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==
It can be split into the following sections:
data image/png;base64 iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==
Schema
The data: part specifies that this is a Data URI.
Mime type
The image/png part specifies that this is a PNG image. Also supported is image/jpeg.
base64
Technically part of the mime type, this specifies that the image data is encoded using Base64.
Data
The random-looking characters following the comma are the actual image data.
Creating a Data URI
Wesnoth does not yet support generating a Data URI for you, but there are alternatives.
Websites
There are a large number of Data URI generator websites. Googling for data uri generator will find them.
You may be able to directly copy the Data URI with your browser, without going to some strange website. The following works in Firefox 60.1:
- open image.png directly with browser
- open Inspector (Tools > Web Developer > Inspector)
- mouse over the src=file://... data, then select Copy > Image Data-URL
You now have the Data URI in your clipboard
Manually
Creating a data URI by hand can be accomplished by taking your image, Base64-encoding it and formatting it as shown above.