Map quality slider to RDO when using UASTC

codecs/basis/enc/basis_enc.cpp

@@ -8,7 +8,7 @@ using namespace emscripten;
 using namespace basisu;
 
 struct BasisOptions {
-  uint8_t quality;
+  float quality;
   uint8_t compression;
   bool uastc;
   bool mipmap;
@@ -48,7 +48,6 @@ val encode(std::string image_in, int image_width, int image_height, BasisOptions
   job_pool jpool(1);
   params.m_pJob_pool = &jpool;
 
-  // Needs to be exposed as an option
   params.m_ktx2_uastc_supercompression = basist::KTX2_SS_ZSTANDARD;
 
   params.m_perceptual = opts.perceptual;
@@ -57,10 +56,16 @@ val encode(std::string image_in, int image_width, int image_height, BasisOptions
   params.m_mip_srgb = opts.srgb_mipmap;
   params.m_mip_filter = opts.mipmap_filter;
   params.m_mip_smallest_dimension = opts.mipmap_min_dimension;
-  params.m_quality_level = opts.quality;
   params.m_compression_level = opts.compression;
   params.m_source_images.push_back(img);
 
+  if (opts.uastc) {
+    params.m_rdo_uastc_quality_scalar = opts.quality;
+    params.m_rdo_uastc = opts.quality != 0;
+  } else {
+    params.m_quality_level = static_cast<int>(opts.quality);
+  }
+
   if (!compressor.init(params)) {
     return val(std::string("Well something went wrong during init"));
   }

src/client/lazy-app/util/index.ts

@@ -417,3 +417,13 @@ export async function canvasEncodeTest(mimeType: string): Promise<boolean> {
     return false;
   }
 }
+
+export function clamp(min: number, v: number, max: number): number {
+  if (v < min) {
+    return min;
+  }
+  if (v > max) {
+    return max;
+  }
+  return v;
+}

src/features/encoders/basis/client/index.tsx

@@ -5,6 +5,7 @@ import {
   inputFieldChecked,
   inputFieldValueAsNumber,
   preventDefault,
+  clamp,
 } from 'client/lazy-app/util';
 import * as style from 'client/lazy-app/Compress/Options/style.css';
 import linkState from 'linkstate';
@@ -43,9 +44,18 @@ export class Options extends Component<Props, State> {
     ) as HTMLFormElement;
     const { options } = this.props;
 
+    const uastc = form.mode.value === '1';
+    let quality = inputFieldValueAsNumber(form.quality, options.quality);
+    if (uastc) {
+      quality = clamp(0, quality, 4);
+    } else {
+      quality = Math.floor(clamp(0, quality, 255));
+    }
+
     const newOptions: EncodeOptions = {
       ...this.props.options,
-      uastc: form.mode.value === '1',
+      uastc,
+      quality,
       y_flip: inputFieldChecked(form.y_flip, options.y_flip),
       perceptual: inputFieldChecked(form.perceptual, options.perceptual),
       mipmap: inputFieldChecked(form.mipmap, options.mipmap),
@@ -60,7 +70,6 @@ export class Options extends Component<Props, State> {
           form.mipmap_min_dimension,
           Math.floor(Math.log2(options.mipmap_min_dimension)),
         ),
-      quality: inputFieldValueAsNumber(form.quality, options.quality),
       compression: inputFieldValueAsNumber(
         form.compression,
         options.compression,
@@ -86,8 +95,9 @@ export class Options extends Component<Props, State> {
         <div class={style.optionOneCell}>
           <Range
             name="quality"
-            min="1"
+            min={options.uastc ? '0' : '1'}
-            max="255"
+            max={options.uastc ? '4' : '255'}
+            step={options.uastc ? '0.1' : '1'}
             value={options.quality}
             onInput={this.onChange}
           >
@@ -152,7 +162,7 @@ export class Options extends Component<Props, State> {
                         )}
                         onInput={this.onChange}
                       >
-                        Smallest mipmap (2^x):
+                        Log2 of smallest mipmap:
                       </Range>
                     </div>
                     <label class={style.optionTextFirst}>