isekai/sand.html at pages · amirotin/isekai · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>ISL — Песчаное паломничество: подбор соратников</title>
  <script src="https://cdn.tailwindcss.com"></script>
  <link rel="stylesheet" href="./styles.css" />
</head>
<body class="min-h-screen bg-gray-50 text-gray-900">
  <div class="max-w-7xl mx-auto p-4 md:p-8 space-y-6">
    <header class="flex flex-col md:flex-row md:items-end gap-4 md:gap-8">
      <div class="flex-1">
        <h1 class="text-2xl md:text-3xl font-bold">ISL — Песчаное паломничество</h1>
        <p class="text-gray-600 mt-1">Твой штаб логистики: герои — по слотам, очки — по максимуму.</p>
      </div>
      <div class="flex items-center gap-2">
        <button id="saveConfig" class="btn btn-soft">Сохранить</button>
        <button id="loadConfig" class="btn btn-soft">Загрузить</button>
        <button id="exportJson" class="btn btn-soft">Экспорт JSON</button>
        <label class="btn btn-soft cursor-pointer">Импорт JSON <input id="importJson" type="file" accept="application/json" class="hidden" /></label>
      </div>
    </header>

    <section class="grid md:grid-cols-2 gap-6">
      <!-- ЗАКАЗЫ -->
      <div class="card space-y-4">
        <div class="flex items-center justify-between">
          <h2 class="text-xl font-semibold">Типы заказов</h2>
          <div class="text-sm text-gray-500">Очки фиксированы. Укажите порог силы и, при желании, лимит по количеству.</div>
        </div>
        <div class="grid grid-cols-12 gap-2 text-sm font-medium text-gray-600">
          <div class="col-span-2">Вкл</div>
          <div class="col-span-3">Очки</div>
          <div class="col-span-5">Требуемая сила (B)</div>
          <div class="col-span-2">Доступно</div>
        </div>
        <div id="ordersList" class="space-y-2"></div>
      </div>

      <!-- СОРАТНИКИ (без резерва) -->
      <div class="card space-y-4">
        <div class="flex items-center justify-between">
          <h2 class="text-xl font-semibold">Соратники</h2>
          <div class="text-sm text-gray-500">Выбирайте из списка, указывайте силу (B), включайте для расчёта</div>
        </div>
        <div class="flex flex-wrap gap-2 items-center">
          <button id="addHeroRow" class="btn btn-soft">+ Добавить строку</button>
          <button id="clearHeroRows" class="btn btn-soft">Очистить список</button>
        </div>
        <div class="grid grid-cols-12 gap-2 text-sm font-medium text-gray-600">
          <div class="col-span-6">Соратник</div>
          <div class="col-span-4">Сила (B)</div>
          <div class="col-span-2">Вкл</div>
        </div>
        <div id="heroesScroll" class="max-h-96 overflow-y-auto pr-1">
          <div id="heroesList" class="space-y-2"></div>
        </div>
        <div class="flex justify-end">
          <button id="copyHeroList" class="btn btn-soft">Скопировать список имён</button>
        </div>
      </div>
    </section>

    <!-- Массовый импорт -->
    <section class="card space-y-2">
      <div class="flex items-center justify-between">
        <h3 class="font-semibold">Массовый импорт соратников</h3>
        <div class="text-xs text-gray-500">Формат: <code>Имя - 3.777B</code> или <code>Имя - 958M</code>. Только имена из списка.</div>
      </div>
      <div class="grid md:grid-cols-3 gap-2">
        <textarea id="bulkText" class="input md:col-span-2" rows="5" placeholder="Габраэль - 3.777B
Керр, Бел и Росс - 2.838B
Кая - 958M"></textarea>
        <div class="space-y-2">
          <button id="parseBulk" class="btn btn-primary w-full">Импортировать</button>
          <button id="clearBulk" class="btn btn-soft w-full">Очистить поле</button>
          <button id="copyHeroList" class="btn btn-soft w-full" title="Скопировать полный список имён для заполнения силы">Скопировать список имён</button>
        </div>
      </div>
    </section>

    <!-- Настройки / стратегии -->
    <section class="card space-y-4">
      <div class="grid md:grid-cols-3 gap-4">
        <div>
          <label class="block text-sm font-medium mb-1">Стратегия расчёта</label>
          <select id="strategy" class="input">
            <option value="lazy_limits">По лимитам (ленивый режим)</option>
            <option value="max_points">Максимум очков (без реролла)</option>
            <option value="max_points_reroll">Максимум очков + реролл</option>
            <option value="min_clicks">Минимум кликов</option>
            <option value="max_orders">Максимум заказов</option>
          </select>
        </div>
        <div>
          <label class="block text-sm font-medium mb-1">Максимальный размер команды</label>
          <input id="maxTeam" type="number" min="1" max="6" value="4" class="input" />
        </div>
        <div>
          <label class="block text-sm font-medium mb-1">Лимит перелива (B)</label>
          <input id="wasteLimit" type="number" min="0" step="0.01" value="0.25" class="input" />
        </div>
      </div>
      <div class="flex items-center gap-2">
        <button id="run" class="btn btn-primary">Запустить подбор</button>
      </div>
    </section>

    <!-- Результаты -->
    <section class="space-y-4">
      <div id="totals" class="card hidden"></div>
      <div id="resultControls" class="mt-3 flex flex-wrap gap-3 items-center">
        <label class="text-sm flex items-center gap-2">
          Сортировка:
          <select id="sortBy" class="input">
            <option value="none">Без сортировки</option>
            <option value="wasteAsc">Перелив ↑</option>
            <option value="wasteDesc">Перелив ↓</option>
            <option value="sizeAsc">Размер команды ↑</option>
            <option value="sizeDesc">Размер команды ↓</option>
            <option value="pointsDesc">Очки ↓</option>
            <option value="thrAsc">Порог силы ↑</option>
          </select>
        </label>
        <label class="text-sm flex items-center gap-2">
          <input type="checkbox" id="hideSent">
          Скрыть «отправленные»
        </label>
      </div>
      <div id="result" class="grid md:grid-cols-2 lg:grid-cols-3 gap-4"></div>
      <div id="unusedWrap" class="card hidden"></div>
    </section>

    <footer class="text-center text-xs text-gray-500 py-8">v1.7 — считает лучше, чем гоблин-бухгалтер.</footer>
  </div>

  <script src="./app.js" type="module"></script>
</body>
</html>