Implement sRGB color conversion (#510)

* Add sRGB -> RGB conversion before resize

* Add clamping for color space conversions

* Clip for demultiplication as well

* Fixing linear <-> srgb conversion

* Update benchmark

* Decouple srgb calculations

* Generate lookup tables

* Update src/codecs/resize/options.tsx

* Defaulting on, renaming, removing redundant state
This commit is contained in:
Surma
2019-03-12 14:09:35 +00:00
committed by Jake Archibald
parent 496896e36e
commit bf4d4b78cb
13 changed files with 157 additions and 36 deletions

View File

@@ -19,13 +19,11 @@ interface Props {
interface State {
maintainAspect: boolean;
premultiply: boolean;
}
export default class ResizerOptions extends Component<Props, State> {
state: State = {
maintainAspect: true,
premultiply: true,
};
form?: HTMLFormElement;
@@ -43,6 +41,7 @@ export default class ResizerOptions extends Component<Props, State> {
height: inputFieldValueAsNumber(height),
method: form.resizeMethod.value,
premultiply: inputFieldChecked(form.premultiply, true),
linearRGB: inputFieldChecked(form.linearRGB, true),
// Casting, as the formfield only returns the correct values.
fitMethod: inputFieldValue(form.fitMethod, options.fitMethod) as ResizeOptions['fitMethod'],
};
@@ -95,7 +94,7 @@ export default class ResizerOptions extends Component<Props, State> {
<option value="lanczos3">Lanczos3</option>
<option value="mitchell">Mitchell</option>
<option value="catrom">Catmull-Rom</option>
<option value="triangle">Triangle</option>
<option value="triangle">Triangle (bilinear)</option>
<option value="browser-pixelated">Browser pixelated</option>
<option value="browser-low">Browser low quality</option>
<option value="browser-medium">Browser medium quality</option>
@@ -138,6 +137,17 @@ export default class ResizerOptions extends Component<Props, State> {
</label>
: null
}
{isWorkerOptions(options) ?
<label class={style.optionInputFirst}>
<Checkbox
name="linearRGB"
checked={options.linearRGB}
onChange={this.onChange}
/>
Linear RGB
</label>
: null
}
</Expander>
<label class={style.optionInputFirst}>
<Checkbox