first
This commit is contained in:
@@ -0,0 +1,54 @@
|
||||
#logo {
|
||||
display: block;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
margin: auto;
|
||||
padding: 10% 0 0;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-origin: content-box;
|
||||
}
|
||||
|
||||
.result {
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
margin: 1.5rem auto;
|
||||
}
|
||||
|
||||
.input-box .btn {
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
border-radius: 3px;
|
||||
border: none;
|
||||
margin: 0 0 0 20px;
|
||||
padding: 0 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.input-box .btn:hover {
|
||||
background-image: linear-gradient(to top, #cfd9df 0%, #e2ebf0 100%);
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.input-box .input {
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
outline: none;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
padding: 0 10px;
|
||||
background-color: rgba(240, 240, 240, 1);
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.input-box .input:hover {
|
||||
border: none;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.input-box .input:focus {
|
||||
border: none;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
Copyright 2016 The Nunito Project Authors (contact@sansoxygen.com),
|
||||
|
||||
This Font Software is licensed under the SIL Open Font License, Version 1.1.
|
||||
This license is copied below, and is also available with a FAQ at:
|
||||
http://scripts.sil.org/OFL
|
||||
|
||||
|
||||
-----------------------------------------------------------
|
||||
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
|
||||
-----------------------------------------------------------
|
||||
|
||||
PREAMBLE
|
||||
The goals of the Open Font License (OFL) are to stimulate worldwide
|
||||
development of collaborative font projects, to support the font creation
|
||||
efforts of academic and linguistic communities, and to provide a free and
|
||||
open framework in which fonts may be shared and improved in partnership
|
||||
with others.
|
||||
|
||||
The OFL allows the licensed fonts to be used, studied, modified and
|
||||
redistributed freely as long as they are not sold by themselves. The
|
||||
fonts, including any derivative works, can be bundled, embedded,
|
||||
redistributed and/or sold with any software provided that any reserved
|
||||
names are not used by derivative works. The fonts and derivatives,
|
||||
however, cannot be released under any other type of license. The
|
||||
requirement for fonts to remain under this license does not apply
|
||||
to any document created using the fonts or their derivatives.
|
||||
|
||||
DEFINITIONS
|
||||
"Font Software" refers to the set of files released by the Copyright
|
||||
Holder(s) under this license and clearly marked as such. This may
|
||||
include source files, build scripts and documentation.
|
||||
|
||||
"Reserved Font Name" refers to any names specified as such after the
|
||||
copyright statement(s).
|
||||
|
||||
"Original Version" refers to the collection of Font Software components as
|
||||
distributed by the Copyright Holder(s).
|
||||
|
||||
"Modified Version" refers to any derivative made by adding to, deleting,
|
||||
or substituting -- in part or in whole -- any of the components of the
|
||||
Original Version, by changing formats or by porting the Font Software to a
|
||||
new environment.
|
||||
|
||||
"Author" refers to any designer, engineer, programmer, technical
|
||||
writer or other person who contributed to the Font Software.
|
||||
|
||||
PERMISSION & CONDITIONS
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of the Font Software, to use, study, copy, merge, embed, modify,
|
||||
redistribute, and sell modified and unmodified copies of the Font
|
||||
Software, subject to the following conditions:
|
||||
|
||||
1) Neither the Font Software nor any of its individual components,
|
||||
in Original or Modified Versions, may be sold by itself.
|
||||
|
||||
2) Original or Modified Versions of the Font Software may be bundled,
|
||||
redistributed and/or sold with any software, provided that each copy
|
||||
contains the above copyright notice and this license. These can be
|
||||
included either as stand-alone text files, human-readable headers or
|
||||
in the appropriate machine-readable metadata fields within text or
|
||||
binary files as long as those fields can be easily viewed by the user.
|
||||
|
||||
3) No Modified Version of the Font Software may use the Reserved Font
|
||||
Name(s) unless explicit written permission is granted by the corresponding
|
||||
Copyright Holder. This restriction only applies to the primary font name as
|
||||
presented to the users.
|
||||
|
||||
4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
|
||||
Software shall not be used to promote, endorse or advertise any
|
||||
Modified Version, except to acknowledge the contribution(s) of the
|
||||
Copyright Holder(s) and the Author(s) or with their explicit written
|
||||
permission.
|
||||
|
||||
5) The Font Software, modified or unmodified, in part or in whole,
|
||||
must be distributed entirely under this license, and must not be
|
||||
distributed under any other license. The requirement for fonts to
|
||||
remain under this license does not apply to any document created
|
||||
using the Font Software.
|
||||
|
||||
TERMINATION
|
||||
This license becomes null and void if any of the above conditions are
|
||||
not met.
|
||||
|
||||
DISCLAIMER
|
||||
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
|
||||
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
|
||||
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
||||
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
|
||||
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
|
||||
OTHER DEALINGS IN THE FONT SOFTWARE.
|
||||
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 136 KiB |
@@ -0,0 +1,123 @@
|
||||
import {
|
||||
CheckConnection,
|
||||
SetFrequency,
|
||||
Quit,
|
||||
} from "../wailsjs/go/main/App";
|
||||
|
||||
(function() {
|
||||
// === Переключение вкладок ===
|
||||
const tabButtons = document.querySelectorAll('.tab-button');
|
||||
const tabContents = document.querySelectorAll('.tab-content');
|
||||
|
||||
tabButtons.forEach(button => {
|
||||
button.addEventListener('click', () => {
|
||||
tabButtons.forEach(btn => btn.classList.remove('active'));
|
||||
tabContents.forEach(content => content.classList.remove('active'));
|
||||
button.classList.add('active');
|
||||
const tabId = button.getAttribute('data-tab');
|
||||
document.getElementById(`tab-${tabId}`).classList.add('active');
|
||||
});
|
||||
});
|
||||
|
||||
// === Элементы интерфейса ===
|
||||
const btnCheck = document.getElementById('btn-check');
|
||||
const btnFreq = document.getElementById('btn-freq');
|
||||
const btnQuit = document.getElementById('btn-quit');
|
||||
const statusIndicator = document.getElementById('status-indicator');
|
||||
const statusText = document.getElementById('status-text');
|
||||
const freqLabel = document.getElementById('frequency-label');
|
||||
const freqValue = document.getElementById('frequency-value');
|
||||
|
||||
// Модальное окно
|
||||
const modal = document.getElementById('freq-modal');
|
||||
const closeModal = document.getElementById('close-modal');
|
||||
const freqInput = document.getElementById('freq-input');
|
||||
const btnMinus = document.getElementById('btn-minus');
|
||||
const btnPlus = document.getElementById('btn-plus');
|
||||
const btnSetFreq = document.getElementById('btn-set-freq');
|
||||
const modalError = document.getElementById('modal-error');
|
||||
|
||||
// === Проверка подключения ===
|
||||
btnCheck.addEventListener('click', () => {
|
||||
CheckConnection()
|
||||
.then((response) => {
|
||||
// Обновление индикатора соединения
|
||||
statusIndicator.classList.remove('indicator-red');
|
||||
statusIndicator.classList.add('indicator-green');
|
||||
statusText.textContent = `Соединение установлено! ${response.status}`;
|
||||
|
||||
// Обновление панели частоты (текущая)
|
||||
freqLabel.textContent = 'Текущая частота:';
|
||||
freqValue.textContent = response.frequency;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error('Ошибка CheckConnection:', err);
|
||||
statusText.textContent = 'Ошибка: не удалось выполнить проверку';
|
||||
});
|
||||
});
|
||||
|
||||
// === Установка частоты (открытие модального окна) ===
|
||||
btnFreq.addEventListener('click', () => {
|
||||
modal.classList.remove('hidden');
|
||||
// Показываем текущую частоту из панели (или 145)
|
||||
const current = freqValue.textContent !== '---' ? freqValue.textContent : '145';
|
||||
freqInput.value = current;
|
||||
modalError.classList.add('hidden');
|
||||
});
|
||||
|
||||
// Закрытие модального окна
|
||||
closeModal.addEventListener('click', () => {
|
||||
modal.classList.add('hidden');
|
||||
});
|
||||
window.addEventListener('click', (e) => {
|
||||
if (e.target === modal) {
|
||||
modal.classList.add('hidden');
|
||||
}
|
||||
});
|
||||
|
||||
// Кнопки +/- для изменения значения на 1
|
||||
btnMinus.addEventListener('click', () => {
|
||||
let val = parseInt(freqInput.value, 10) || 1;
|
||||
val = Math.max(1, val - 1); // минимум 1
|
||||
freqInput.value = val.toString();
|
||||
});
|
||||
btnPlus.addEventListener('click', () => {
|
||||
let val = parseInt(freqInput.value, 10) || 1;
|
||||
val += 1;
|
||||
freqInput.value = val.toString();
|
||||
});
|
||||
|
||||
// Кнопка "Установить"
|
||||
btnSetFreq.addEventListener('click', () => {
|
||||
const inputVal = freqInput.value.trim();
|
||||
// Проверка: только цифры
|
||||
if (!/^\d+$/.test(inputVal)) {
|
||||
modalError.textContent = 'Вводимое значение должно быть целым положительным числом';
|
||||
modalError.classList.remove('hidden');
|
||||
return;
|
||||
}
|
||||
const num = parseInt(inputVal, 10);
|
||||
if (num <= 0) {
|
||||
modalError.textContent = 'Вводимое значение должно быть целым положительным числом';
|
||||
modalError.classList.remove('hidden');
|
||||
return;
|
||||
}
|
||||
|
||||
SetFrequency(inputVal)
|
||||
.then((newFreq) => {
|
||||
// Обновляем панель частоты
|
||||
freqLabel.textContent = 'Установленная частота:';
|
||||
freqValue.textContent = newFreq;
|
||||
modal.classList.add('hidden');
|
||||
})
|
||||
.catch((err) => {
|
||||
modalError.textContent = err;
|
||||
modalError.classList.remove('hidden');
|
||||
});
|
||||
});
|
||||
|
||||
// === Закрыть приложение ===
|
||||
btnQuit.addEventListener('click', () => {
|
||||
Quit();
|
||||
});
|
||||
})();
|
||||
@@ -0,0 +1,240 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html, body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #f0f0f0;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
|
||||
#app {
|
||||
width: 400px;
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Панель вкладок */
|
||||
.tabs {
|
||||
display: flex;
|
||||
background: #e9e9e9;
|
||||
}
|
||||
|
||||
.tab-button {
|
||||
flex: 1;
|
||||
padding: 12px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
.tab-button:hover {
|
||||
background: #dcdcdc;
|
||||
}
|
||||
|
||||
.tab-button.active {
|
||||
background: white;
|
||||
border-bottom: 3px solid #3498db;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Содержимое вкладок */
|
||||
.tab-content {
|
||||
display: none;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.tab-content.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Вертикально расположенные кнопки */
|
||||
.buttons-vertical {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.action-button {
|
||||
padding: 12px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
border: 1px solid #bbb;
|
||||
border-radius: 6px;
|
||||
background-color: #f8f8f8;
|
||||
transition: background-color 0.2s, border-color 0.2s;
|
||||
}
|
||||
|
||||
.action-button:hover {
|
||||
background-color: #e2e6ea;
|
||||
border-color: #999;
|
||||
}
|
||||
|
||||
.close-button {
|
||||
background-color: #e74c3c;
|
||||
color: white;
|
||||
border-color: #c0392b;
|
||||
}
|
||||
|
||||
.close-button:hover {
|
||||
background-color: #c0392b;
|
||||
}
|
||||
|
||||
/* Панель частоты */
|
||||
#frequency-panel {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 10px 14px;
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 6px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#frequency-label {
|
||||
font-weight: bold;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
#frequency-value {
|
||||
font-size: 18px;
|
||||
color: #2c3e50;
|
||||
}
|
||||
|
||||
/* Панель статуса */
|
||||
#status-panel {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 10px 14px;
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.indicator {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.indicator-red {
|
||||
background-color: #e74c3c;
|
||||
}
|
||||
|
||||
.indicator-green {
|
||||
background-color: #2ecc71;
|
||||
}
|
||||
|
||||
#status-text {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* Модальное окно */
|
||||
.modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0,0,0,0.4);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.modal.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background: white;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
width: 300px;
|
||||
box-shadow: 0 5px 15px rgba(0,0,0,0.3);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.close-modal {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 15px;
|
||||
font-size: 22px;
|
||||
cursor: pointer;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.close-modal:hover {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.modal-content h3 {
|
||||
margin-bottom: 15px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.freq-input-group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.freq-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
font-size: 20px;
|
||||
background: #3498db;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
.freq-btn:hover {
|
||||
background: #2980b9;
|
||||
}
|
||||
|
||||
#freq-input {
|
||||
width: 100px;
|
||||
padding: 8px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
#btn-set-freq {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.error-msg {
|
||||
color: #e74c3c;
|
||||
margin-top: 8px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.error-msg.hidden {
|
||||
display: none;
|
||||
}
|
||||
Reference in New Issue
Block a user