Expand all

ThumbnailWidth

Represents image width information.

To utilize caching as much as possible, we use images which are displayed at a slightly different size than their screen size. The ThumbnailWidth model stores the various types of sizes and helps avoiding accidental incompatible assignments. (Think of it as a slightly overcomplicated Hungarian notation)

Constructor

new ThumbnailWidth(cssWidth, cssHeight, screen, real) #

Parameters:

Name Type Description
cssWidth number

width in CSS pixels

cssHeight number

height in CSS pixels

screen number

width in screen pixels

real number

width in real pixels

Source:

Properties

cssHeight #

Height of the thumbnail on the screen, in CSS pixels. This is the number which can be plugged into UI code like $element.height(x).

Properties:

Type Description
number
Source:
Height of the thumbnail on the screen, in CSS pixels.

cssWidth #

Width of the thumbnail on the screen, in CSS pixels. This is the number which can be plugged into UI code like $element.width(x).

Properties:

Type Description
number
Source:
Width of the thumbnail on the screen, in CSS pixels.

real #

"Real" width of the thumbnail. This is the number you need to use in API requests when obtaining the thumbnail URL. This is usually larger than the screen width, since downscaling images via CSS looks OK but upscaling them looks ugly. However, for images where the full size itself is very small, this can be smaller than the screen width, since we cannot create a thumbnail which is larger than the original image. (In such cases the image is just positioned to the center of the intended area and the space around it is left empty.)

Properties:

Type Description
number
Source:
"Real" width of the thumbnail.

screen #

Width of the thumbnail on the screen, in device pixels. On most devices this is the same as the CSS width, but devices with high pixel density displays have multiple screen pixels in a CSS pixel.

This value is mostly used internally; for most purposes you will need one of the others.

Properties:

Type Description
number
Source:
Width of the thumbnail on the screen, in device pixels.