| |
Raistlin
Registered: Mar 2007
Posts: 587 |
C64GFXDb
I'd like to announce C64GFXDb (name is subject to change).
In the simplest terms, I plan for this to be something similar to HVSC but for graphics. Primarily, a ZIP file download of as much C64 scene and non-scene graphics as can be collected - but also backed up by a website presentation.
v0.05 download is here:
https://www.dropbox.com/scl/fi/rk8lhbt5lsaolfc836ql6/C64GFXDb-v..
And a WIP website is here: https://c64graphicsdb.netlify.app/
There's a lot to do to get it all into nice shape .. my todo list is quite long already.. for example:-
Collection (ZIP etc)
====================
- sort something out for sceners who used multiple handles .. these aren't handled well right now .. plus I seem to have a bug in my database code that pushes older names into "unsorted"...
- ensure that duplicates are removed
- favour a single palette for all, and a better compressed image format (eg. GIF) .. it's then easy to convert these to different palettes later
- ensure all images are a consistent size (multi-screeners can be different in size in the direction of scroll of course)
The Website
===========
- I don't have a main page as yet, just a nasty horrible, massive list of artist names ... this will of course improve at some point...
- for scrolling images I want to actually scroll them within their grid entry... so they'd be almost like animated GIFs (except animated GIFs are a bad idea, I've found, since they don't cleverly compress scroll animation (and so end up HUGE)
Questions
=========
For image dimensions I've been aiming for the same as CSDb - 384x272. This means we could lose pixels, though, as of course C64 screen can go up to 408px wide... any preferences here? I want most pictures to match so that I can setup the grid nicely without images being scaled oddly.
For such as interlace images my eventual plan was to use animated GIFs and to simply flip frames at 50fps (however many frames there are). Check out Leon's folder for a single example. Do you think this is better - or should interlace pics be given in a different form? Many of the screenshots on CSDb seem misleading to me...
Some images are animated .. where it makes sense I've added these as animated GIFs. Check out my own folder (the Turn Disk image) and Talent's folder for examples... do you think this is a good way to go?
Please, please let me know your thoughts, whether you like or hate it .. what can be done to make it better, more useful, etc etc.
Cheers! |
|
... 67 posts hidden. Click here to view all posts....
|
| |
Raistlin
Registered: Mar 2007
Posts: 587 |
Re: ZIP: my thinking was that this can continue without me if need be .. because we never know what will happen a few years from now. But, yeah, maybe not needed. I use Assembly64 now and don’t use HVSC’s ZIP/downloads directly.
Re: compos. Yeah, that will be a big part of this. Hosting the compo results in a nice format. But that’s also a great idea re: compo voting. Someone mentioned just today about Sprites Only entries… they get 10 votes during the compo and then people go back and revote relative to CSDb. Generally, CSDb votes really shouldn’t be taken for compo results at all… my site could possibly solve that issue for graphics, anyway. For now, it’s too “volatile” - every picture could change overnight while I play with the formats. |
| |
Raistlin
Registered: Mar 2007
Posts: 587 |
Oh, re: Compo Voting.. maybe someone has an idea here.. but.. it would be good to be able to do that on the site and, in theory, it would be easy enough to do… but…
Scener/User Registration.
You hate down/up votes right now? Without proper scener validation, like CSDb has, you’ll see people using 10 email addresses to upvote their own shit.
Anyone got any ideas how to fix that? Other than asking CSDb to provide some sort of Google-like user authentication, I don’t see how that will work.
Plus, unless the site becomes ridiculously popular (like CSDb), people won’t bother registering. |
| |
Shine
Registered: Jul 2012
Posts: 333 |
What a cool project!
I would add (later) some statistic & sort features like:
Top10 || graphics mode || date || etc.
But for now i would like to have a decent zoom mode.
I think the best would be a 2x zoom without any interpolation. This current "small" zoomer makes the picture a bit buggy imo.
Anyway, go ahead to surprise us! :) |
| |
Raistlin
Registered: Mar 2007
Posts: 587 |
Ah yes.. if anyone knows their way around CSS well enough to get pixel-perfect sizes, I’d be very interested to know how that works.
I had code that supposedly should’ve worked.. but then it looks like the OS is used to scale things - and on a 4K monitor will scale by 1.5x for example. So even when I’m supposedly showing a 384x272px image at exactly that, it’s still showing onscreen as 576x408px.
Some help on that from someone would be awesome :-) .. ChatGPT was no help at all ;-) |
| |
Jetboy
Registered: Jul 2006
Posts: 241 |
Also hovering over images makes them pop, change the size and makes them not being pixel perfect. Possible solution - show images as 320x200 screen area on the list, and show them in full resolution when mouse overed.
As for sizes, giving dimensions in pixels should work, unless you use some other modifiers that could mess that up.
On 4K you need to scale everything indeed, because image that is 320x200 on 1024 screen looks ok, but on 4K screen seems like thumbnail. |
| |
Flotsam
Registered: Jan 2004
Posts: 82 |
Quote: Ah yes.. if anyone knows their way around CSS well enough to get pixel-perfect sizes, I’d be very interested to know how that works.
I had code that supposedly should’ve worked.. but then it looks like the OS is used to scale things - and on a 4K monitor will scale by 1.5x for example. So even when I’m supposedly showing a 384x272px image at exactly that, it’s still showing onscreen as 576x408px.
Some help on that from someone would be awesome :-) .. ChatGPT was no help at all ;-)
For pixelart to appear as it should the images should be resized in multiples (2x, 3x, 4x, etc.) of original size and with "image-rendering: pixelated" applied to them. Otherwise the pics will appear blurry and ugly like they do here @csdb when you zoom a picture (I've left feedback about it a long time ago, but no reaction). For an img to retain its original size, you just omit any size adjustments or apply it's true pixel size. If you show the pictures as background images, you need to define the pixel size for its parent element.
You can fight the funky pixel aspect ratios and screen sizes with CSS media queries. Google if you you're not yet familiar with them.
Also, Javascript is your friend. This is the kind of application that would benefit a lot from some smart use of scripting, lazy loading at minimum. |
| |
Raistlin
Registered: Mar 2007
Posts: 587 |
@Flotsam: cheers! the site should actually already have all of that… it has pixelated, the sizes specified are the size of (most of?) the images (and should eventually be all of them), etc etc… I, with ChatGPT, came to the conclusion that the “system” was doing something - in my case I’m on a 4K monitor (as I’m sure many are) and Windows is just scaling…
Re: lazy loading … I need to check this again. It also is supposed to have that…….
I’m not a web coder at all… ChatGPT’s been my friend here ………..
CSS:
.ic img {
width: 384px;
height: 272px;
image-rendering: -moz-crisp-edges; /* Firefox */
image-rendering: -webkit-optimize-contrast; /* Older Webkit browsers */
image-rendering: crisp-edges;
image-rendering: pixelated; /* Modern browsers */
object-fit: contain;
transition: transform 0.3s;
display: block;
margin: auto;
}
I don’t currently have the @media stuff for this - but I had earlier… I removed it because it just wasn’t working well :-(
And the JavaScript which is meant to make the lazy loading work:-
document.addEventListener("DOMContentLoaded", function () {
const images = document.querySelectorAll('img');
images.forEach(img => img.setAttribute('loading', 'lazy'));
images.forEach(img => img.setAttribute('width', '384'));
images.forEach(img => img.setAttribute('height', '272'));
});
function setContainerWidth() {
const multiple = 400;
const windowWidth = window.innerWidth;
const numColumns = Math.floor(windowWidth / multiple)
if (numColumns > 4)
numColumns = 4;
const maxWidth = numColumns * multiple + 8;
const container = document.querySelector('.container');
container.style.width = maxWidth + 'px';
const pixelTitle = document.querySelector('.pixel-title');
const fontSize = numColumns * 8 + 16;
pixelTitle.style.fontSize = fontSize + 'px';
}
window.addEventListener('resize', setContainerWidth); |
| |
Flotsam
Registered: Jan 2004
Posts: 82 |
Cool, if you're getting funky image sizes, check your pixel aspect ratio. On Chrome, press CTRL + SHIFT + J for console and type window.devicePixelRatio. Is it an integer? |
| |
Moloch
Registered: Jan 2002
Posts: 2905 |
Wasn't there something like this about ten years ago? Only survived a few years if memory serves. |
| |
DanPhillips
Registered: Jan 2003
Posts: 30 |
How complete should the list of entries per artist be?
Rob Levy is missing a few by the looks of it :D
Cheers
Dan |
| Previous - 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 - Next |
