<!DOCTYPE html>
<html>
<head>
  <title>Ryzen Controller</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="./node_modules/uikit/dist/css/uikit.min.css" />
  <script src="https://browser.sentry-cdn.com/5.6.1/bundle.min.js" crossorigin="anonymous"></script>
  <script src="./node_modules/uikit/dist/js/uikit.min.js"></script>
  <script src="./node_modules/uikit/dist/js/uikit-icons.min.js"></script>
  <style>
    #release-tab.uk-active {
      position:absolute;display: inline-block;width: 100%;height: calc(100vh - 110px);
    }
    #controller-tab h3 label,
    #experimental-tab h3 label {
      cursor: pointer;
    }
    #donation {
      background: rgb(232, 91, 70);
    }
  </style>
</head>
<body class="uk-animation-fade" uk-height-viewport="expand: true">
  <h1>
    Ryzen Controller
    <span id="version" class="uk-badge"></span>
    <a class="uk-badge" id="donation" title="Buy us some beers ❤️" href="#" onClick="require('electron').shell.openExternal('https://www.patreon.com/ryzencontrollerteam')">Patreon</a>
  </h1>

  <ul uk-switcher="animation: uk-animation-fade" uk-tab uk-sticky class="uk-background-default uk-margin-remove" id="main-container-selector">
    <li><a href="#">Presets</a></li>
    <li><a href="#">Settings</a></li>
    <li><a href="#">Releases</a></li>
    <li><a href="#">Logs</a></li>
  </ul>
  <ul class="uk-switcher uk-margin-remove" id="main-container" uk-height-viewport="expand: true" style="position:relative;">

    <li class="uk-margin-top uk-margin-bottom uk-container">
      <div id="presetTab"></div>
      <p class="uk-margin">
        <button class="uk-button uk-button-secondary" uk-toggle="target: #modal-export-preset" type="button" onClick="preset_export()">
          Export
        </button>
        <button class="uk-button uk-button-secondary" uk-toggle="target: #modal-import-preset" type="button">
          Import
        </button>
      </p>
    </li>

    <li class="uk-margin-top uk-margin-bottom uk-container">
      <h3 class="windows-only">Auto start:</h3>
      <label class="windows-only"><input class="uk-checkbox" type="checkbox" id="start_at_boot"> When checked, Ryzen Controller will start on session start.</label>
      <h3>Auto apply on launch:</h3>
      <label><input class="uk-checkbox" type="checkbox" id="apply_last_settings_on_launch"> When checked, Ryzen Controller will try to apply latest used settings on launch.</label>
      <h3>Minimize to tray:</h3>
      <label><input class="uk-checkbox" type="checkbox" id="minimize_to_tray"> When checked, Ryzen Controller will minimize to tray instead of taskbar.</label><br>
      <label><input class="uk-checkbox" type="checkbox" id="start_minimized"> When checked, Ryzen Controller will start minimized when you launch it.</label>
      <!-- <h3 class="windows-only">HPET:</h3>
      <p class="uk-margin windows-only">
        High Precision Event Timer: Allow application to get time with precision below microseconds, but is slower than most other other timer facilities.<br/>
        Try running benchmark with and without to see if you get any difference.<br/>
        If it doesn't make any difference, it's recommanded to let it enable.<br/>
        <em>You must reboot to apply changes.</em>
      </p>
      <p class="uk-margin windows-only">
        <button class="uk-button uk-button-primary" onClick="toggleHpet('true')">Enable</button>
        <button class="uk-button uk-button-secondary" onClick="toggleHpet('false')">Disable</button>
      </p> -->
      <h3>Re-apply ryzenadj periodically:</h3>
      <p>Ryzen Controller will re-apply ryzenadj every X seconds. Set to 0 to disable.</p>
      <div class="uk-grid-small" uk-grid>
        <div class="uk-width-1-6">
          <input class="uk-input" type="number" min="0" step="10" max="3600" value="0" id="reapply_periodically" repeat="reapply_periodically_range">
        </div>
        <div class="uk-width-expand">
          <input class="uk-range" type="range" min="0" step="10" max="3600" value="0" repeat="reapply_periodically" id="reapply_periodically_range">
        </div>
      </div>
      <h3>Ryzenadj path:</h3>
      <div class="uk-grid-small" uk-grid>
        <div class="uk-width-2-3@s">
          <input class="uk-input" type="text" id="ryzen_adj_path">
        </div>
        <div class="uk-width-1-3@s">
          <button class="uk-button uk-button-default uk-button-small" type="button" onClick="askingForRyzenAdjExecutablePath()">
            Select path to ryzenadj.exe
          </button>
        </div>
      </div>
    </li>

    <li id="release-tab">
      <webview
        style="height:100%;"
        frameborder="0"
        src="https://gitlab.com/ryzen-controller-team/ryzen-controller/releases"
      ></webview>
    </li>

    <li class="uk-margin-top uk-margin-bottom uk-container">
      <textarea class="uk-textarea" rows="20" id="logs" readonly></textarea>
    </li>

  </ul>

  <!-- Add a preset modal -->
  <div id="modal-new-preset" uk-modal>
    <div class="uk-modal-dialog uk-modal-body">
        <h2 class="uk-modal-title">Save current settings to preset</h2>
        <p>The current settings will be saved to a new preset. Give it a name then you'll be able to reapply it fastly from the preset tab.</p>
        <div class="uk-margin">
          <input class="uk-input" type="text" id="new_preset_name" placeholder="Preset name: performance, low energy, unicorn power, ...">
        </div>
        <button class="uk-button uk-button-primary uk-modal-close" type="button" onClick="preset_createNewPreset()">Save</button>
        <button class="uk-button uk-button-secondary uk-modal-close" type="button">Close</button>
    </div>
  </div>

  <!-- Export preset modal -->
  <div id="modal-export-preset" uk-modal>
    <div class="uk-modal-dialog uk-modal-body">
        <h2 class="uk-modal-title">Export presets</h2>
        <p>This is the data to be used by Ryzen Controller to import presets.</p>
        <div class="uk-margin">
          <textarea class="uk-textarea" rows="5" id="modal-export-preset-textarea" readonly></textarea>
        </div>
        <button class="uk-button uk-button-secondary uk-modal-close" type="button">Close</button>
    </div>
  </div>

  <!-- Import preset modal -->
  <div id="modal-import-preset" uk-modal>
    <div class="uk-modal-dialog uk-modal-body">
        <h2 class="uk-modal-title">Import presets</h2>
        <p>Paste here the presets and valid, your current presets will be merged with this.</p>
        <div class="uk-margin">
          <textarea class="uk-textarea" rows="5" id="modal-import-preset-textarea"></textarea>
        </div>
        <button class="uk-button uk-button-primary uk-modal-close" type="button" onClick="preset_import()">Import</button>
        <button class="uk-button uk-button-secondary uk-modal-close" type="button">Close</button>
    </div>
  </div>

  <script type="text/javascript" src="./js/preset.js"></script>
  <script type="text/javascript" src="./js/methods.js"></script>
  <script type="text/javascript" src="./js/app.js"></script>
</body>
</html>