AllskyTeam / allsky-website

Web interface displaying an image from an allsky camera.
54 stars 42 forks source link

Thumbnails bigger? #39

Closed Empire4191 closed 3 years ago

Empire4191 commented 3 years ago

How can I make the thumbnails bigger?

Thank you, Daniel

thomasjacquin commented 3 years ago

Hi Daniel,

Change this line https://github.com/thomasjacquin/allsky-website/blob/master/keograms/index.php#L38 It is set to 100px by default.

Thomas

Empire4191 commented 3 years ago

Hi Thomas,

I tried that yesterday. The thumbnail was also uploaded with 200 px, but the smaller one is still displayed.

Daniel

thomasjacquin commented 3 years ago

The thumbnail is only generated if it doesn't exist in order to save processing time. Try deleting the thumbnails directory and refresh the page.

if (!file_exists('thumbnails/'.$file)) {
    make_thumb($file, 'thumbnails/'.$file, 100);
}
thomasjacquin commented 3 years ago

Also, clear your cache if you're still seeing the old ones.

Empire4191 commented 3 years ago

Unfortunately that doesn't work. Could it be that you also have to make changes in allsky.css?

thomasjacquin commented 3 years ago

Ah yeah you're totally right. Try to remove the height on .archived-videos .day-container and set the width to 20% or something else in .archived-videos .day-container.

Empire4191 commented 3 years ago

I have the following code:

foreach ($files as $file) {

        if (!file_exists('thumbnails/'.$file)) {
            make_thumb($file, 'thumbnails/'.$file, 200);
        }
        $day = substr($file, 17, 2);
        $month = substr($file, 15, 2);
        $year = substr($file, 11, 4);
        $date = $day-$month-$year;
        echo "<a href='./$file'><div class='day-container'><div class='image-container'><img id=".$date." src='./thumbnails/$file' title='Startrails-$day-$month-$year'/></div><div>$day-$month-$year</div></div></a>";
    }
    echo `"</div>";`

Where do I have to add the 20%?

thomasjacquin commented 3 years ago

In allsky.css as you correctly pointed out earlier. Find that code and change it to the following.

.archived-videos .day-container{
    width: 20%;
    min-width: 100px;
    float: left;
    padding: 10px;
}

.archived-videos .day-container .image-container {
    height: auto;
}
Empire4191 commented 3 years ago

Now it works :-) Thank you very much!

EricClaeys commented 3 years ago

Empire4191, If this issue is resolved, would you please close it?

THOMAS, should we change the "height: 90px" to "height: auto" in ".archived-videos .day-container .image-container" The config.sh file allows the user to set the thumbnail size, and I'd like to have allsky-website use that info. Eric

thomasjacquin commented 3 years ago

@EricClaeys If height: auto achieves the expected behaviour and there are no side effects when people use the default settings in config.sh, I'd say yes, go ahead.