search

rikukissa / node-red-contrib-image-output

🏞 Easy way of previewing and examining images in your flows
MIT License
13 stars 6 forks source link

Adjustable image size #2

Closed bartbutenaers closed 6 years ago

bartbutenaers commented 6 years ago

Hi Riku,

me again ;-) Have tested your contribution, and I'm already a big fan ...

Currently the image width is fixed to '200': img.setAttribute('width', "200")

As a result, the image preview is a little bit small in my flow editor, so I cannot see what is happening in the camera preview:

image

Could you please add an extra input field to the node's config screen, to make the width adjustable? I mean something like this:

    <div class="form-row">
        <label for="node-input-width"><i class="fa fa-arrows-h"></i> Width</label>
        <input type="number" id="node-input-width">
    </div>

Which could then e.g. get your default of 200:

    defaults: {
       width:  {value:200, required:true, validate:RED.validators.number()},
       name: { value: "" }
    },

Thanks again !!!! Bart Butenaers

rikukissa commented 6 years ago

I was actually also thinking about doing this, but decided to just go with MVP version of this node first. What do you think about having the images as resizable, in a way that you could just grab the corner of the image and start dragging to make it larger?

bartbutenaers commented 6 years ago

Hi Riku,

Nice to hear from you ;-)

Well that would be indeed much better. When you have to change the width in the node's config screen, you have no idea how large it will be displayed in the flow. As a result, you probably have to go N times to the config screen to get it right.

When you can grab it, you can draw it so it nicely fits into the existing flow. So if you can manage that, it would be a great addition !!

Greetings from Belgium, Bart

rikukissa commented 6 years ago

I'll see what I can do :)

rikukissa commented 6 years ago

I'll close this one now as well since there's a PR for this https://github.com/rikukissa/node-red-contrib-image-output/pull/6