search

lgommans / factorio-serverlist

Unofficial server browser for Factorio
https://lgms.nl/p/factorio-serverlist
MIT License
6 stars 5 forks source link

Use icon font instead of images? #5

Open originalfoo opened 7 years ago

originalfoo commented 7 years ago

Icon font allows lossless scaling (particularly when user scales browser text) and easier styling (it's just text).

They can be made free & open source, complete with style sheet and reference card, at http://fontastic.me/

lgommans commented 7 years ago

Sounds like a good idea. I'll take a look later and see for which icons I can find replacements.

lgommans commented 7 years ago

Okay I had higher expectations from this, but I guess I didn't really think about it.

I thought the icons were all in the unicode set -- I mean, if a snowman and a turd are in there, why not a clock, person and lock icon? And perhaps they are, but that's not what this is.

The site you mention links to external sites, often broken ones, with varying licenses. I'd have to compile specific icons I want, either through this site or via a search engine, which is what I was already doing, except with a focus on scalable graphics. I've actually tried to download one of them and it gives me a big sheet, not individual icons, so I'd have to edit the one I want out again. And not just printscreen and be done with it, nope the point was scalable graphics. It's a bit of a pain.

I've tried zooming in and currently that works just fine. I've left most icons at a higher resolution than I'm using them at, which is bad for bandwidth, but good for scaling. I think most are used at 16x16px and the version being loaded is 48x48. You can zoom to 300% or use a DPI setting three times higher than any normal person and it'll still be sharp.

The exception is flags, those were unfortunately not available in a higher resolution. If someone knows a better source, let me know.

For now, this feature is a "maybe later" for me. Anyone who wants to work on it, even upgrade a single icon to svg, is welcome to do so: just send a pull request.

originalfoo commented 7 years ago

I'll create the icon font and gather licensing information, etc. Can you confirm that these are the only required icons:

For free flag icons, see if this is any use: http://365icon.com/icon-styles/ethnic/classic2/

lgommans commented 7 years ago

There is another field in the API for "require user validation", but it seems to be unused. For now, confirmed: these are all icons currently in use.

The flags aren't that high-res (the 48x48 ones are including whitespace around it), but overlaying them, they're a big upgrade from the current set. License looks good and it uses the ISO country codes. I'll upload them tomorrow (might need some adjusting because of the whitespace and it's 4am here).

Thanks!

originalfoo commented 7 years ago

This look ok for an initial set of icons? I've included several variants of some of them:

region capture 7

lgommans commented 7 years ago

Looks good to me. They just need to be colored orange (black on black is not going to be visible).

originalfoo commented 7 years ago

It's just text so they can be colored with CSS. :) I'll tidy up the font settings a bit more and then see if I can do a PR (I'm not sure how to set up a server to test the changes tho).

lgommans commented 7 years ago

Hmm the easiest option might be to get free webhosting at 000webhost.com (they're not very secure btw, don't use a strong password). If they didn't disable the file_get_contents feature, it should work after uploading the files and modifying config.php.

You could also install XAMPP and run it locally, if you don't mind temporarily installing this.

Or just edit the files on Github (this will automatically create a fork for you), then I can clone and run it and see how it looks.

Or if you have any kind of web server locally (no database or php needed), you could just download the data from get-games.php on the server and put it in your local copy of get-games.php (overwrite the file). Then it just loads that instead of running the php code. This would be the easiest option but I've tried it, and at least Firefox refuses to load the data directly from a file, it requires it to be run on a web server. So this works if you have a web server without database or php, but if you install a web server, you might as well install xampp and get a DB and php with it.

Many options. Depending on your OS and knowledge, one might be easier than the other, I don't know.