title
This commit is contained in:
parent
a81addc100
commit
f6b89012e5
4
DOCS.md
4
DOCS.md
@ -91,6 +91,8 @@ app.add(['<button>123</button>']);
|
||||
app.correct(0, '<input placeholder="123"></input>')
|
||||
// Удаление
|
||||
app.delete(0);
|
||||
// Заголовок
|
||||
app.title("Мой заголовок");
|
||||
```
|
||||
## Рендер
|
||||
Для рендера группы используется функция render. Для отрисовки текущей группы - draw:
|
||||
@ -118,6 +120,8 @@ app.draw();
|
||||
const map = app.map();
|
||||
map.root // Доступ к элементу DOM
|
||||
map.app(); // Исходный элемент Find
|
||||
map.merge(); // Объединить HTML в элемент
|
||||
map.main(); // Загрузить главный элемент
|
||||
map.select(/* CSS-селектор */); // Вернет экземпляр map для выбранного элемента
|
||||
map.read(); // Прочитать HTML
|
||||
map.text(/* Текст для textContent */); // Без аргументов вернет текст элемента
|
||||
|
||||
105
Find/Find.js
105
Find/Find.js
@ -21,24 +21,23 @@
|
||||
*
|
||||
*/
|
||||
|
||||
const ERROR_CODE = "Find framework error:";
|
||||
|
||||
class FindObjectMap {
|
||||
constructor(_root, app) {
|
||||
constructor(_root, app, num) {
|
||||
this.root = _root;
|
||||
if (typeof this.root !== "object") {
|
||||
PrivateFind.error("Unknown root!");
|
||||
PrivateFind.error("Неизвестный root!");
|
||||
}
|
||||
this._app = app;
|
||||
this._num = num;
|
||||
return this;
|
||||
}
|
||||
select(q) {
|
||||
const o = this.root.querySelector(q);
|
||||
if (typeof o === "undefined") {
|
||||
PrivateFind.error("No objects of selector");
|
||||
PrivateFind.error("Нет обьектов для селектора!");
|
||||
return undefined;
|
||||
}
|
||||
return new FindObjectMap(o, this._app);
|
||||
return new FindObjectMap(o, this._app, this._num + 1);
|
||||
}
|
||||
read() {
|
||||
return this.root.innerHTML;
|
||||
@ -70,7 +69,7 @@ class FindObjectMap {
|
||||
PrivateFind.error("No objects of selector");
|
||||
return undefined;
|
||||
}
|
||||
return new FindObjectMap(o, this._app);
|
||||
return new FindObjectMap(o, this._app, this._num + 1);
|
||||
}
|
||||
tag(q) {
|
||||
const o = this.root.getElementsByTagName(q);
|
||||
@ -78,7 +77,7 @@ class FindObjectMap {
|
||||
PrivateFind.error("No objects of selector");
|
||||
return undefined;
|
||||
}
|
||||
return new FindObjectMap(o, this._app);
|
||||
return new FindObjectMap(o, this._app, this._num + 1);
|
||||
}
|
||||
attach(event, func) {
|
||||
this.root.addEventListener(event, () => {
|
||||
@ -86,9 +85,30 @@ class FindObjectMap {
|
||||
});
|
||||
return this;
|
||||
}
|
||||
merge() {
|
||||
if (this._num != 0) {
|
||||
PrivateFind.error(
|
||||
"Вы можете создавать " +
|
||||
"merge-обьект только из корневого map(), " +
|
||||
"но уровень вложенности данного map() равен " +
|
||||
String(this._num) + "!"
|
||||
);
|
||||
return this;
|
||||
}
|
||||
const addr = this._app.getNumberOfGroupFromId(this._app.__id);
|
||||
this._app.groups[addr].html = new Array(this.read());
|
||||
return this;
|
||||
}
|
||||
app() {
|
||||
return this._app;
|
||||
}
|
||||
main() {
|
||||
return new FindObjectMap(this._app.root, this._app, 0);
|
||||
}
|
||||
}
|
||||
|
||||
const tags = {
|
||||
"mobile" : `<meta name="viewport" content="width=device-width, initial-scale=1"></meta>`
|
||||
}
|
||||
|
||||
export default class {
|
||||
@ -97,12 +117,17 @@ export default class {
|
||||
|
||||
constructor(root) {
|
||||
this.root = root;
|
||||
this.iter = 0;
|
||||
this.groups = new Array();
|
||||
this.groups_count = 0;
|
||||
this._map = new FindObjectMap(this.root, this);
|
||||
this._map = new FindObjectMap(this.root, this, 0);
|
||||
return this;
|
||||
}
|
||||
|
||||
static tags(name) {
|
||||
return tags[name];
|
||||
}
|
||||
|
||||
static attach(x, f) {
|
||||
return `${x}="${f.replace("\"", """)}"`;
|
||||
}
|
||||
@ -131,18 +156,26 @@ export default class {
|
||||
id = id_;
|
||||
html = html_;
|
||||
}
|
||||
|
||||
if (typeof meta_ === "undefined") {
|
||||
meta_ = new Array();
|
||||
let l = false;
|
||||
if (typeof meta_ !== "undefined") {
|
||||
l = true;
|
||||
}
|
||||
|
||||
const addr = this.getNumberOfGroupFromId(id, false);
|
||||
let meta = undefined;
|
||||
if (addr == -1) {
|
||||
meta = meta_;
|
||||
} else {
|
||||
meta = l ? meta_ : this.groups[addr].meta;
|
||||
}
|
||||
if (typeof meta !== "object") {
|
||||
meta = new Array();
|
||||
}
|
||||
if (addr != -1) {
|
||||
let s = this.groups[addr].meta;
|
||||
this.groups[addr] = {
|
||||
id: id,
|
||||
html: html,
|
||||
meta: s
|
||||
meta: meta,
|
||||
title: document.title
|
||||
};
|
||||
return this;
|
||||
}
|
||||
@ -159,7 +192,7 @@ export default class {
|
||||
this.groups[this.groups_count] = {
|
||||
id: id,
|
||||
html: html,
|
||||
meta: meta_
|
||||
meta: meta
|
||||
};
|
||||
this.groups_count ++;
|
||||
return this;
|
||||
@ -224,7 +257,7 @@ export default class {
|
||||
html = html_;
|
||||
}
|
||||
|
||||
if (this.groups.length == 0) {
|
||||
if (this.groups.length == 0 || this.getNumberOfGroupFromId(id, false) == -1) {
|
||||
this.group(id, html);
|
||||
return this;
|
||||
}
|
||||
@ -238,6 +271,25 @@ export default class {
|
||||
return this;
|
||||
}
|
||||
|
||||
title(id_, html_) {
|
||||
let id = undefined;
|
||||
let html = undefined;
|
||||
if (arguments.length == 1) {
|
||||
id = this.__id;
|
||||
html = id_;
|
||||
} else {
|
||||
id = id_;
|
||||
html = html_;
|
||||
}
|
||||
if (this.groups.length === 0 || this.getNumberOfGroupFromId(id, false) === -1) {
|
||||
this.group(id, []);
|
||||
}
|
||||
const title = html;
|
||||
const addr = this.getNumberOfGroupFromId(id);
|
||||
this.groups[addr].title = String(title);
|
||||
return this;
|
||||
}
|
||||
|
||||
meta(id_, html_) {
|
||||
let id = undefined;
|
||||
let html = undefined;
|
||||
@ -249,7 +301,7 @@ export default class {
|
||||
html = html_;
|
||||
}
|
||||
|
||||
if (this.groups.length == 0) {
|
||||
if (this.groups.length == 0 || this.getNumberOfGroupFromId(id, false) == -1) {
|
||||
this.group(id, [], html);
|
||||
return this;
|
||||
}
|
||||
@ -282,10 +334,13 @@ export default class {
|
||||
return this;
|
||||
}
|
||||
this.root.innerHTML = "";
|
||||
if (typeof group.title !== "undefined" && document.title !== group.title) {
|
||||
document.title = group.title;
|
||||
}
|
||||
if (
|
||||
typeof group.meta === "object" &&
|
||||
Array.isArray(group.meta) &&
|
||||
group.meta.length > 0
|
||||
group.meta.length > 0 && this.iter === 0
|
||||
) {
|
||||
for (let i = 0; i < group.meta.length; i ++) {
|
||||
if (typeof group.meta[i] === "string") {
|
||||
@ -298,6 +353,7 @@ export default class {
|
||||
this.root.innerHTML += group.html[i];
|
||||
}
|
||||
}
|
||||
this.iter ++;
|
||||
return this;
|
||||
}
|
||||
|
||||
@ -338,6 +394,13 @@ export default class {
|
||||
}
|
||||
}
|
||||
|
||||
class FindError extends Error {
|
||||
constructor(message) {
|
||||
super(message);
|
||||
this.name = 'Find Framework Error';
|
||||
}
|
||||
}
|
||||
|
||||
class PrivateFind {
|
||||
|
||||
/* Private section */
|
||||
@ -352,11 +415,11 @@ class PrivateFind {
|
||||
}
|
||||
|
||||
static error(text) {
|
||||
console.error(ERROR_CODE, text);
|
||||
throw new FindError(text);
|
||||
}
|
||||
|
||||
static findTypeError(obj, tp) {
|
||||
console.error(ERROR_CODE, "You can't use <" + (typeof obj) + "> as <" + tp + ">!");
|
||||
throw new TypeError(`Вы пытаетесь передать ${typeof obj}, в то время как ожидается ${tp}!`);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
8
test.js
8
test.js
@ -1,5 +1,5 @@
|
||||
import Find from "./Find/Find.js";
|
||||
new Find(Find.search("test")).select("com.example").meta([
|
||||
let app = new Find(Find.search("test")).select("com.example").title("Мой тест").meta([
|
||||
Find.css("bulma.min.css"),
|
||||
'<meta name="viewport" content="width=device-width, initial-scale=1">'
|
||||
]).meta([
|
||||
@ -23,9 +23,11 @@ new Find(Find.search("test")).select("com.example").meta([
|
||||
})()]).draw().map().id("user").html(
|
||||
`<button
|
||||
class="button"
|
||||
id="reload"
|
||||
style="margin-top: 10px;"
|
||||
>Перезагрузить</button>`).attach("click", () => {
|
||||
>Перезагрузить</button>`).id("reload").attach("click", () => {
|
||||
location.reload();
|
||||
});
|
||||
}).main().merge().app().title(2).draw();
|
||||
/*.title(2).draw();*/
|
||||
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user