// Copyright (C) 2022 The Android Open Source Project
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//      http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

import m from 'mithril';
import {RecordMode} from './state';
import {Slider} from './record_widgets';
import {RecordingSectionAttrs} from './recording_sections';
import {assetSrc} from '../../base/assets';

export class RecordingSettings
  implements m.ClassComponent<RecordingSectionAttrs>
{
  view({attrs}: m.CVnode<RecordingSectionAttrs>) {
    const S = (x: number) => x * 1000;
    const M = (x: number) => x * 1000 * 60;
    const H = (x: number) => x * 1000 * 60 * 60;

    const recCfg = attrs.recState.recordConfig;

    const recButton = (mode: RecordMode, title: string, img: string) => {
      const checkboxArgs = {
        checked: recCfg.mode === mode,
        onchange: (e: InputEvent) => {
          const checked = (e.target as HTMLInputElement).checked;
          if (!checked) return;
          recCfg.mode = mode;
        },
      };
      return m(
        `label${recCfg.mode === mode ? '.selected' : ''}`,
        m(`input[type=radio][name=rec_mode]`, checkboxArgs),
        m(`img[src=${assetSrc(`assets/${img}`)}]`),
        m('span', title),
      );
    };

    return m(
      `.record-section${attrs.cssClass}`,
      m('header', 'Recording mode'),
      m(
        '.record-mode',
        recButton('STOP_WHEN_FULL', 'Stop when full', 'rec_one_shot.png'),
        recButton('RING_BUFFER', 'Ring buffer', 'rec_ring_buf.png'),
        recButton('LONG_TRACE', 'Long trace', 'rec_long_trace.png'),
      ),

      m(Slider, {
        title: 'In-memory buffer size',
        icon: '360',
        values: [4, 8, 16, 32, 64, 128, 256, 512],
        unit: 'MB',
        set: (cfg, val) => (cfg.bufferSizeMb = val),
        get: (cfg) => cfg.bufferSizeMb,
        recCfg,
      }),

      m(Slider, {
        title: 'Max duration',
        icon: 'timer',
        values: [S(10), S(15), S(30), S(60), M(5), M(30), H(1), H(6), H(12)],
        isTime: true,
        unit: 'h:m:s',
        set: (cfg, val) => (cfg.durationMs = val),
        get: (cfg) => cfg.durationMs,
        recCfg,
      }),
      m(Slider, {
        title: 'Max file size',
        icon: 'save',
        cssClass: recCfg.mode !== 'LONG_TRACE' ? '.hide' : '',
        values: [5, 25, 50, 100, 500, 1000, 1000 * 5, 1000 * 10],
        unit: 'MB',
        set: (cfg, val) => (cfg.maxFileSizeMb = val),
        get: (cfg) => cfg.maxFileSizeMb,
        recCfg,
      }),
      m(Slider, {
        title: 'Flush on disk every',
        cssClass: recCfg.mode !== 'LONG_TRACE' ? '.hide' : '',
        icon: 'av_timer',
        values: [100, 250, 500, 1000, 2500, 5000],
        unit: 'ms',
        set: (cfg, val) => (cfg.fileWritePeriodMs = val),
        get: (cfg) => cfg.fileWritePeriodMs || 0,
        recCfg,
      }),
    );
  }
}