Resize image keeping aspect ratio

Is there support in the server for keeping aspect ratio of the images? We sometimes get images (for “spontaneous” events) that bypass post prod and I kept meaning to look into it.


No there isn’t. You could obviously use MIXER to do it (creating something that will do the calculations for you) - or you could create a HTML file to load images with something like this:

<!doctype html>
html, body { background: transparent; margin: 0; padding: 0; width: 100vw; height: 100vh; }
body { display: flex; justify-content: center; align-items: center; }
img { flex: 1 1 auto; width: 100%; max-width: 80vw; max-height: 80vh; object-fit: contain; visibility: none; }
/* max-width and max-height to follow your safe area */
.loaded { visibility: visible; }
function update(i) {
	var img = document.getElementById('img');
	img.classList.remove('loaded'); // Hide image if you are loading a new one with update
	img.src = i;
	img.onload = function(){ this.classList.add('loaded'); };
function play() {}
	<img id="img">

Thanks @hreinnbeck but that seems a bit convoluted. My scenario is this:

  • A person arrives and wants to show some images for their impromptu event. :face_with_raised_eyebrow:
  • We don’t have enough time to run them through the post processing dept. :angry:
  • I throw them into CasparCG and create a rundown using the official Client. :sunglasses:
  • I cross my fingers that all of the images are in landscape format. :grimacing:
  • I cringe every time I put up a portrait image on the screen. :face_vomiting:

Using the MIXER doesn’t always work as we do a lot of cross-dissolves. I haven’t tried your above template, but don’t think it will be as easy as dragging and dropping a bunch of images into the rundown in the Client. Also I’ve patched the Client to give me auto-step function for the images, so I can just run through the rundown using one button.

In a pinch, I do have a bash script that will resize all of the images to 1920x1080 using ImageMagick. That’s really the main reason why I haven’t bothered enough to ask until now.

It would be nice though to just be able to drop the images into the rundown and just be able to show them.

Thanks again.

You better try this template, if such a master as @hreinnbeck writes it for you :smiley:

I once did a similar template (in Flash) to show pictures from a folder. It was for a event and the photographer brought me his memory card of JPEG’s. No processing. The template just grabbed the contents of the folder and showed a new image every 10s or so. With a little effort Hreinn’s template could be adapted to load the pictures one after the other from a folder (I guess they come numbered) and switch to the next, on sending a next command (F5). That would make your workflow even easier.

Yes and no. Even if I made it dissolve to new image on F5 (which I have done for another workflow), it would still be lacking 2 important features compared to the Client:

  1. No preview of the images.
  2. No easy way to skip an image or reorder a few images in the list, etc.


1 Like

I think the advice is not to use images directly in official Client, use them as content in HTML page. As far as I can see in the example @hreinnbeck gave you it will resize the images to 80% keeping the aspect ratio, and place them in the center.

@itod did you read my messages? Or really just the last one? :exploding_head: How do you suggest I would quickly swap the order of any 2 images? Or skip an image if I needed to during the show?

Please be aware, that no one of us is paid to support anybody on that forum.

I think what @itod suggests is, different from my suggestion, that you use one template per image. That gives a little more clicks to build up the playlist, but allows you to play the pics in any order you like.

I would use an Excel spreadsheet to build the playlist, that makes it much easier to add the image filenames in the correct format. See this.

@didikunz sorry if I gave an impression that I am here looking for free support. I was about to start hacking CasparCG code, which I have done several times in the past:

But I figured I’d ask if this functionality is already implemented in some way that I am not aware of.

@hreinnbeck has offered an alternative solution. I thought I’ve explained in detail my workflow and why it wouldn’t work in this particular case. I’ve nothing against templates and we do use them on a regular basis. (I even did a write-up on using them in the old forum). But again, in this case the official Client offers the best functionality in my view.

So, it seems the answer to my question is no and I will have to implement it myself. I appreciate everyone’s responses and I hope ya’ll have a great day. :sunglasses:


PS: As a note I also contribute to the CasparCG community in other ways: