Possibility of replacing the images directory with Data URIs

[nisharobinson]

Sometimes when using SlickGrid I'll run into issues with pathing such as CheckFormatter, the default code for CheckFormatter is:

function CheckmarkFormatter(row, cell, value, columnDef, dataContext) { return value ? "<img src='../images/tick.png'>" : ""; }

A way around this would be to use Data URIs and I feel like this would increase the portability of SlickGrid a lot, example:

function CheckmarkFormatter(row, cell, value, columnDef, dataContext) { return value ? '<img alt="tick" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABq0lEQVQ4y72T2S5DYRSFe+c472Ju1RhTQqqGVCfq6ClFKY0bqqetVqtDSgzHpRhqjsQUlCASl1rVhmcQL6G6/JVowoUYEhf/3b/W3vvbawsACP7yBP9uoF5r4luW6p2/MlCtNvKmYz36D1hI+CruRwbKYAM/eNSF2Xs3vDdW6LbUqPAU2b4lVqxIeeOhDtNxF6biTnRut6LSW4wSh5BKfzJesjWGM6bns1i+LOVTLU/GnAjEHG+Vy93iRPFYAZUewXjBlvWeMk/ctQnsrnLoXUxg8X37WgTuxuC/s4PdVKHMVZgosudTaYj959ra3lD7oy/MYTo2Ds2WLEFgDckWJVOGPQa+qB3eWw4dGwqUjosSYlse9WGNPSeaTP1hG8xXA5h78MAbtsJ4pIPpRI+JsAXuWwuYdTlKnMKXQutHcXoEZkdOk8owhfRvc/qjNrgiZrjCZmjWWlKwkiIul/oySAQWLVuQoHu3He7IKBw3w2gLykBgJUWWHOpbSZTMV9N1M5WkZQXUK80gsJLC0WzqR1Em+6XLJ8QgsJ4LzNkZv7oFAovOH8nK+JdrfAW+oqk8UgoDSAAAAABJRU5ErkJggg==" />' : ""; }

[ghiscoding]

I would suggest you to create and use your own Custom Formatter. There might not be enough documentation on the subject but it's easy enough to extend Formatter with your own ones. Here's an Example with custom formatter. In the case of the checkmark, I have my own custom formatter using Font-Awesome icons. We all have different implementations and that is the beauty of SlickGrid, almost everything is customizable

[nisharobinson]

@ghiscoding I'm familiar with most of SlickGrid at this point and I definitely could make a Customer Formatter, I just think it would be nicer if SlickGrid worked a little better "out of the box" so to speak. Relative paths don't work so well.

[6pac]

The more I think about this, the more I like the idea. As long as we keep the original icon available and keep the relative path line commented in the formatter, this would provide a number of advantages.
Any disadvantages you can think of @ghiscoding ? It's not going to stop customisation.

I always notice that the image paths break whenever I put SlickGrid into a real life project.

[ghiscoding]

Sure I wouldn't mind seeing a PR so that we can test with. I personally don't use any of the images since I use Font Awesome icons instead but yeah bringing more options is always great. The other benefit would be a much smaller library if we don't need to include images. So sure, that does seem like an improvement.

[6pac]

Yeah, the next logical step is 'skinning', but I'm happy to leave that to someone else to develop!

[ghiscoding]

in SlickGrid 5.0 we replaced all images with SVG Icons and if you are wondering why we chose SVG instead of Data URI, you could read this article for the main reasons Probably Don’t Base64 SVG

see SlickGrid 5.0 Announcement & Migration