pseudonymous / better-better-booru

Various tweaks to make Danbooru better.
110 stars 41 forks source link

Images can't be resized by height (Resize Images is not working) #20

Closed Yaze closed 11 years ago

Yaze commented 11 years ago

Well.. for me resize images option is not working, maybe something is broken? Still can't find good 'fit to window' (by height & width) script.

ghost commented 11 years ago

I'm not experiencing any problem with resizing at the moment. In what way is it not working? It mimics Danbooru's current behavior by shrinking down images wider than the allocated space to a size where horizontal scrolling is no longer needed. It makes no attempt to shrink by height or enlarge small images.

What browser, browser version, extension (Greasemonkey, Tampermonkey, etc), and extension version are you using the script with? Are you using any other Danbooru scripts and is your current version of the script up to date?

Yaze commented 11 years ago

Firefox v21.0 Greasemonkey v1.9 better_better_booru v5.4.1

It's not fitting image, as u can see after loading page image is big as it was before. ss 2013-06-09 at 03 07 13 ss 2013-06-09 at 03 06 56

EDIT: Okay! nvm, forgot to enable "Fit images to window" in danbooru settings (it's needed?). Now it's working.

So another question, does script support vertical image fit? if not is this possible to attatch it? I don't know js, but it should be something like this:

if(imageWidth > windowWidth || imageHeight > windowHeight){ aspect = imageWidth / imageHeight; if(imageWidth > imageHeight){ imageWidth = windowWidth; imageHeight = windowHeight / aspect; }else{ imageHeight = windowHeight; imageWidth = imageWidth * aspect; } }

ghost commented 11 years ago

In the Better Better Booru menu settings, the "resize images", "load samples first", and "blacklisted tags" options only take effect for logged out/anonymous users. When logged in, your account settings take priority.

The script doesn't support resizing by height/vertically fitting at this time. Scripting it probably wouldn't be much of a problem unless translation notes throw a fit. Implementing it in a sensible way might be trickier.

From what you said, resizing the image so that the height is just a bit smaller than the total height of the browser window's viewport would be good. With things done that way, viewing the whole image would require scrolling down past Danbooru's title and menu bars to bring it into full view. Not much of a problem as I see it.

For access to the feature, perhaps modifying the sidebar to have a "resize to window width" link and a literal "resize to window" (width & height) link would be good? I believe being able to manually resize the image by width only is a fairly handy option for some images.

For changing how the automatic resizing of images works, an option in the settings menu that sets (dropdown) or changes (checkbox) the default behavior should be sufficient.

Summed up:

Yaze commented 11 years ago

In the Better Better Booru menu settings, the "resize images", "load samples first", and "blacklisted tags" options only take effect for logged out/anonymous users. When logged in, your account settings take priority.

Oh, good to know, thanks for explain.

For access to the feature, perhaps modifying the sidebar to have a "resize to window width" link and a literal "resize to window" (width & height) link would be good? I believe being able to manually resize the image by width only is a fairly handy option for some images.

Indeed it is, but sometimes... sorry have to say it... I'm too lazy to scroll down to see whole image: ) and cause it's js, I can't do anything, still have to lrn C and py.

For changing how the automatic resizing of images works, an option in the settings menu that sets (dropdown) or changes (checkbox) the default behavior should be sufficient.

Imo dropdown should be fine.

When resizing the image to fit height, make it a little smaller than the browser window's viewport. Do not account for the space used above the image and simply have the user scroll down to bring the image into full view.

Hmmm, about scrolling down... how about adding #image after image ID?

P.S Much thanks for really exhaustive reply, I needed a dictionary few times. Have to lrn english soon...

ghost commented 11 years ago

Hmmm, about scrolling down... how about adding #image after image ID?

Just to be clear, I was supporting the normal method of having the user scroll to the image to view it and was not really suggesting automatically scrolling to it. The only reason I mentioned scrolling was to verify that it would not be a good idea to resize the image to a height that would make all of it and everything above it visible at the same time. I want to be sure that keeping the image as large as possible is the preferred concept.

I'm really not sure automatically scrolling the image into view when automatically resizing it is a good idea. If the image is resized to where it will mostly fill the browser viewport height, that means any notices above it (parent/child, pending/flagged, "pool links" when set to top, etc.) will get hidden. In order to know if the notices were even there, you'd actually have to scroll up. This could easily be a less than desirable result for many users that would make the resizing with scrolling a nuisance. Scripting the scrolling bit isn't really an issue (see the bookmarklets below), but I feel just resizing the image and scrolling to it manually would give the resize by height and width feature a wider appeal.

Example scrolling bookmarklets:

javascript:(function(){document.documentElement.scrollTop=document.getElementById("image").offsetTop-5;})()

...or even just...

javascript:(function(){document.getElementById("image").scrollIntoView();})()

EDIT: If you'd like to see how the resizing currently works, you can install a working/test version from here. Just make sure you only have one version of the script running at a time since this copy shouldn't overwrite the copy you have from Userscripts. For the test version, the new resize links under the sidebar "Options" section and the "Resize Images Mode" option in the settings panel are what you'd be looking for.

Yaze commented 11 years ago

Added line with scroll to test version, and everything is fine : )

Much thanks for your help.

EDIT: This is normal case, when post doesn't belong to parent/child etc.. ss 2013-06-14 at 03 35 41 but when it does... ss 2013-06-14 at 03 35 32 image is cut off from top.

test version + javascript:(function(){document.getElementById("image").scrollIntoView();})() at the end.

ghost commented 11 years ago

I've completely missed your edit up until now... Sorry. <_<;

I didn't really intend for you to just put that bookmarklet in the script, but if you're going to add that into the script yourself, use the following:

var bbbScrollTimer = window.setTimeout(function() { document.getElementById("image").scrollIntoView(); }, 0);

The scrolling has to be delayed some in order to give Danbooru's JavaScript a chance to run. That line works fine on your example.

Yaze commented 11 years ago

No problem at all!, wanted to make it work asap ^^

I don't know, how can I add it to your script... how can I use this variable, after declaration?

ghost commented 11 years ago

The variable name is just an ID for the timer that can be used to cancel it later on. The timer starts as soon as setTimeout is assigned to the variable.

I've gone ahead and included the auto-scroll function as a separate option. It'll be in the next major version (6.0?) on UserScripts, but you can go ahead and try it here. The "Auto-scroll Image" option is what you'll be looking for and remember to make sure you only have one script version running at a time.

Yaze commented 11 years ago

Thats it... great job! everything is just like it should be! but! got one more idea for you : )

Don't want to start another post, so I'll write it here...

What do you think about storing last seen image on danbooru pages?

eg 5 hours ago I checked main page for images (script stored id of last uploaded image to db), nothing interesting was here.. after hm... 4 hours I come back here, and start exploring... some post ahead there is mark on last seen image, so I know I seen those images, brilant idead dont you think?: )

Simple: Open db posts - > Store id of last image if(last_image_id > saved_last_image_id) saved_last_image_id = last_image_id;

And simply show a blue,yellow,red whatever border around thumbnail.

ghost commented 11 years ago

I'm rolling the idea around in my head and there are at least a few issues to consider, but I'll post more about that in the new issue I've made for this when I'm not at work.

Yaze commented 11 years ago

Okay, so thanks for help which this one, you can close it : )

ghost commented 11 years ago

You know that I opened up issue #21 for your new suggestion, right?