Compare commits
No commits in common. "7464f8e16dbe5878c978c234a5181c1490a8c268" and "1af867a0bbe186b50203c01787c79c3d9a43166f" have entirely different histories.
7464f8e16d
...
1af867a0bb
128
DOCS.md
128
DOCS.md
@ -1,128 +0,0 @@
|
|||||||
# Документация по Find
|
|
||||||
## Подключение
|
|
||||||
Find подключается как модуль (необходимо свойство ```type="module"```). Пример:
|
|
||||||
```html
|
|
||||||
<!--
|
|
||||||
index.html
|
|
||||||
|
|
||||||
Copyright 2026 Lida <lida@lida-laptol>
|
|
||||||
|
|
||||||
This program is free software; you can redistribute it and/or modify
|
|
||||||
it under the terms of the GNU General Public License as published by
|
|
||||||
the Free Software Foundation; either version 2 of the License, or
|
|
||||||
(at your option) any later version.
|
|
||||||
|
|
||||||
This program is distributed in the hope that it will be useful,
|
|
||||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
||||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
||||||
GNU General Public License for more details.
|
|
||||||
|
|
||||||
You should have received a copy of the GNU General Public License
|
|
||||||
along with this program; if not, write to the Free Software
|
|
||||||
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
|
|
||||||
MA 02110-1301, USA.
|
|
||||||
|
|
||||||
|
|
||||||
-->
|
|
||||||
|
|
||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
|
||||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
|
|
||||||
|
|
||||||
<head>
|
|
||||||
<title>Find</title>
|
|
||||||
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
|
|
||||||
<meta name="generator" content="Geany 2.0" />
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<div id="my_app"></div>
|
|
||||||
<script type="module" src="my_app.js"></script>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
|
||||||
```
|
|
||||||
В JS подключается директивой import:
|
|
||||||
```js
|
|
||||||
import Find from "/home/user/Find_js/Find.js";
|
|
||||||
```
|
|
||||||
## Устойство
|
|
||||||
В Find каждая страница является группой (group) с любым ID. Части, на которые поделен код, называются элементами и нумеруются с нуля. У каждой группы есть мета-свойства, например необходимые библиотеки.
|
|
||||||
## Создание группы
|
|
||||||
Группу можно создать явно, например:
|
|
||||||
```js
|
|
||||||
import Find from "/home/user/Find_js/Find.js";
|
|
||||||
// Поиск по ID
|
|
||||||
const root = Find.search("my_app");
|
|
||||||
const app = new Find(root);
|
|
||||||
app.group("com.example", []);
|
|
||||||
```
|
|
||||||
Этот код создает пустую группу.
|
|
||||||
Также группа создаётся неявно при добавлении данных или мета-свойств.
|
|
||||||
Имя группы можно передавать первым аргументом в функции, но также можно выбрать одну группу и работать с ней:
|
|
||||||
```js
|
|
||||||
import Find from "/home/user/Find_js/Find.js";
|
|
||||||
const root = Find.search("my_app");
|
|
||||||
const app = new Find(root);
|
|
||||||
app.group("com.example", []).select("com.example");
|
|
||||||
app.имя_функции([имя_группы,] данные);
|
|
||||||
```
|
|
||||||
## Мета-свойства
|
|
||||||
Добавляются функцией meta. Например:
|
|
||||||
```js
|
|
||||||
import Find from "/home/user/Find_js/Find.js";
|
|
||||||
const root = Find.search("my_app");
|
|
||||||
const app = new Find(root);
|
|
||||||
app.select("com.example");
|
|
||||||
app.meta([
|
|
||||||
Find.css("bulma.min.css"),
|
|
||||||
'<meta name="viewport" content="width=device-width, initial-scale=1">'
|
|
||||||
]);
|
|
||||||
```
|
|
||||||
## Данные группы
|
|
||||||
```js
|
|
||||||
import Find from "/home/user/Find_js/Find.js";
|
|
||||||
const root = Find.search("my_app");
|
|
||||||
const app = new Find(root);
|
|
||||||
app.select("com.example");
|
|
||||||
// Добавление
|
|
||||||
app.add(['<button>123</button>']);
|
|
||||||
// Изменение
|
|
||||||
app.correct(0, '<input placeholder="123"></input>')
|
|
||||||
// Удаление
|
|
||||||
app.delete(0);
|
|
||||||
```
|
|
||||||
## Рендер
|
|
||||||
Для рендера группы используется функция render. Для отрисовки текущей группы - draw:
|
|
||||||
```js
|
|
||||||
import Find from "/home/user/Find_js/Find.js";
|
|
||||||
const root = Find.search("my_app");
|
|
||||||
const app = new Find(root);
|
|
||||||
app.select("com.example");
|
|
||||||
// Добавление
|
|
||||||
app.add(['<button>123</button>']);
|
|
||||||
app.render("com.example");
|
|
||||||
// Эквивалентно
|
|
||||||
app.draw();
|
|
||||||
```
|
|
||||||
## Map
|
|
||||||
Map - обьект на странице. Использует следующие функции:
|
|
||||||
```js
|
|
||||||
import Find from "/home/user/Find_js/Find.js";
|
|
||||||
const root = Find.search("my_app");
|
|
||||||
const app = new Find(root);
|
|
||||||
app.select("com.example");
|
|
||||||
// Добавление
|
|
||||||
app.add(['<button>123</button>']);
|
|
||||||
app.draw();
|
|
||||||
const map = app.map();
|
|
||||||
map.root // Доступ к элементу DOM
|
|
||||||
map.select(/* CSS-селектор */); // Вернет экземпляр map для выбранного элемента
|
|
||||||
map.read(); // Прочитать HTML
|
|
||||||
map.text(/* Текст для textContent */); // Без аргументов вернет текст элемента
|
|
||||||
map.html(/* html для замены */); // Без аргументов вернет html элемента
|
|
||||||
map.value(/* value для замены */); // Без аргументов вернет значение элемента
|
|
||||||
map.id(/* ID элемента */); // Вернет экземпляр map для выбранного элемента
|
|
||||||
map.tag(/* TAG элемента */); // Вернет экземпляр map для выбранного элемента
|
|
||||||
map.attach(/* событие */, /* функция */); // EventHandler
|
|
||||||
```
|
|
||||||
16
README.md
16
README.md
@ -1,16 +0,0 @@
|
|||||||
# Find
|
|
||||||
Find - это простой framework для Single Page Application. Документация [здесь](https://gitlabor.ru/German/Find/DOCS.md).
|
|
||||||
## Установка
|
|
||||||
```bash
|
|
||||||
cd ~
|
|
||||||
git clone https://gitlabor.ru/German/Find.git
|
|
||||||
cd Find
|
|
||||||
mkdir -p ~/Find_js
|
|
||||||
cp -rv Find/* ~/Find_js
|
|
||||||
```
|
|
||||||
## Тесты
|
|
||||||
```bash
|
|
||||||
cd ~/Find
|
|
||||||
php -S localhost:8000
|
|
||||||
# Откройте http://localhost:8000
|
|
||||||
```
|
|
||||||
Loading…
x
Reference in New Issue
Block a user