big
2
db.js
|
@ -1,6 +1,6 @@
|
||||||
const mysql = require('mysql');
|
const mysql = require('mysql');
|
||||||
const vars = require('./vars');
|
const vars = require('./vars');
|
||||||
const db_host = "db";
|
const db_host = "localhost";
|
||||||
|
|
||||||
const admin = mysql.createConnection({
|
const admin = mysql.createConnection({
|
||||||
host: db_host,
|
host: db_host,
|
||||||
|
|
|
@ -2,14 +2,15 @@ version: '3.1'
|
||||||
|
|
||||||
services:
|
services:
|
||||||
db:
|
db:
|
||||||
image: mysql:latest
|
image: mysql
|
||||||
restart: always
|
restart: always
|
||||||
ports:
|
ports:
|
||||||
- 3306:3306
|
- 3306:3306
|
||||||
|
command: --default-authentication-plugin=mysql_native_password
|
||||||
environment:
|
environment:
|
||||||
MYSQL_ROOT_PASSWORD: root
|
MYSQL_ROOT_PASSWORD: root
|
||||||
volumes:
|
volumes:
|
||||||
- ./mysql/:/var/lib/mysql
|
- ./mysql:/var/lib/mysql
|
||||||
|
|
||||||
node:
|
node:
|
||||||
build:
|
build:
|
||||||
|
@ -21,10 +22,10 @@ services:
|
||||||
volumes:
|
volumes:
|
||||||
- ./:/usr/src/app
|
- ./:/usr/src/app
|
||||||
|
|
||||||
phpmyadmin:
|
# phpmyadmin:
|
||||||
image: phpmyadmin
|
# image: phpmyadmin
|
||||||
restart: always
|
# restart: always
|
||||||
ports:
|
# ports:
|
||||||
- 2000:80
|
# - 2000:80
|
||||||
environment:
|
# environment:
|
||||||
- PMA_ARBITRARY=1
|
# - PMA_ARBITRARY=1
|
||||||
|
|
40
func.js
|
@ -7,6 +7,9 @@ const fs = require('fs');
|
||||||
const db = require('./db');
|
const db = require('./db');
|
||||||
const moment = require("moment");
|
const moment = require("moment");
|
||||||
const vars = require('./vars');
|
const vars = require('./vars');
|
||||||
|
const replaceColor = require('replace-color');
|
||||||
|
const { escapeXML } = require('ejs');
|
||||||
|
const imageDataURI = require('image-data-uri');
|
||||||
|
|
||||||
module.exports.sendfile = (fileName, response) => {
|
module.exports.sendfile = (fileName, response) => {
|
||||||
const filePath = "./"+fileName;
|
const filePath = "./"+fileName;
|
||||||
|
@ -124,7 +127,7 @@ module.exports.logs_file = (res)=>{
|
||||||
|
|
||||||
|
|
||||||
module.exports.get_uuid = (name = "/") =>{
|
module.exports.get_uuid = (name = "/") =>{
|
||||||
if (name != "/") name = this.encrypt(name,"name");
|
// if (name != "/") name = this.encrypt(name,"name");
|
||||||
let unid = uuid.v4() + '%%'+name+'#e'+(621);
|
let unid = uuid.v4() + '%%'+name+'#e'+(621);
|
||||||
return unid;
|
return unid;
|
||||||
}
|
}
|
||||||
|
@ -141,3 +144,38 @@ module.exports.decrypt = (text,cipher) =>{
|
||||||
return de;
|
return de;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
module.exports.img_recolor = (res,image,color) => {
|
||||||
|
// console.log(color);
|
||||||
|
image = `public/${image}`
|
||||||
|
let name = image.split("/").at(-2);
|
||||||
|
if (fs.existsSync(`public/img/object/${name}/colored/${color}.png`)) {
|
||||||
|
res.send(`/img/object/${name}/colored/${color}.png`)
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
replaceColor({
|
||||||
|
image: image,
|
||||||
|
colors: {
|
||||||
|
type: 'hex',
|
||||||
|
targetColor: "#FFFFFF",
|
||||||
|
replaceColor: `#${color}`
|
||||||
|
},
|
||||||
|
deltaE: 10
|
||||||
|
})
|
||||||
|
.then((jimpObject) => {
|
||||||
|
if (!fs.existsSync(`public/img/object/${name}`)){fs.mkdirSync(`public/img/object/${name}`)}
|
||||||
|
jimpObject.write(`public/img/object/${name}/colored/${color}.png`, (err) => {
|
||||||
|
if (err) return console.log(err)
|
||||||
|
else{
|
||||||
|
imageDataURI.encodeFromFile(`public/img/object/${name}/colored/${color}.png`)
|
||||||
|
.then(data => {
|
||||||
|
res.send(data)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.log(err)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
17
index.js
|
@ -7,6 +7,7 @@ const obj = require('./object');
|
||||||
const proj = require('./project');
|
const proj = require('./project');
|
||||||
const vars = require('./vars');
|
const vars = require('./vars');
|
||||||
const cookieParser = require('cookie-parser');
|
const cookieParser = require('cookie-parser');
|
||||||
|
const CssFilterConverter = require('css-filter-converter');
|
||||||
|
|
||||||
// const {
|
// const {
|
||||||
// response,
|
// response,
|
||||||
|
@ -264,6 +265,14 @@ app.post("/admin/parts/new", (req,res) => {try{
|
||||||
},true,true)
|
},true,true)
|
||||||
} catch (error) {func.log("router object creating error - "+error);}
|
} catch (error) {func.log("router object creating error - "+error);}
|
||||||
})
|
})
|
||||||
|
app.post("/admin/parts/delete", (req,res) => {try{
|
||||||
|
let inp = req.body;
|
||||||
|
let cook = req.cookies;
|
||||||
|
func.sid(cook,res,()=>{
|
||||||
|
obj.del_part(inp,cook,res);
|
||||||
|
},true,true)
|
||||||
|
} catch (error) {func.log("router object creating error - "+error);}
|
||||||
|
})
|
||||||
app.post("/admin/groups/delete", (req,res) => {try{
|
app.post("/admin/groups/delete", (req,res) => {try{
|
||||||
let inp = req.body;
|
let inp = req.body;
|
||||||
let cook = req.cookies;
|
let cook = req.cookies;
|
||||||
|
@ -314,7 +323,13 @@ app.post("/admin/users/find", (req,res) => {try{
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
app.get("/htc/:hex",(req,res) =>{
|
||||||
|
res.send(CssFilterConverter.hexToFilter(`#${req.params["hex"]}`));
|
||||||
|
})
|
||||||
|
app.post("/color",(req,res) =>{
|
||||||
|
let inp = req.body;
|
||||||
|
func.img_recolor(res,inp["img"],inp["hex"]);
|
||||||
|
})
|
||||||
app.all('*', (req, res) => {
|
app.all('*', (req, res) => {
|
||||||
res.status(404).send('<h1>404! Page not</h1> <br> <a href="/">go to main page</a>');
|
res.status(404).send('<h1>404! Page not</h1> <br> <a href="/">go to main page</a>');
|
||||||
});
|
});
|
||||||
|
|
72
object.js
|
@ -1,13 +1,16 @@
|
||||||
const db = require('./db');
|
const db = require('./db');
|
||||||
const func = require('./func');
|
const func = require('./func');
|
||||||
const vars = require('./vars');
|
const vars = require('./vars');
|
||||||
|
const fs = require('fs');
|
||||||
|
const imageDataURI = require('image-data-uri');
|
||||||
|
|
||||||
|
|
||||||
module.exports.loads = (inp,cook,res)=>{
|
module.exports.loads = (inp,cook,res)=>{
|
||||||
try {
|
try {
|
||||||
let gin
|
let gin
|
||||||
if (typeof inp["gid"] == 'undefined' || inp["gid"] == null) gin = "1 OR 1=1"
|
if (typeof inp["gid"] == 'undefined' || inp["gid"] == null) gin = "1 OR 1=1"
|
||||||
else gin = inp["gid"]
|
else gin = inp["gid"]
|
||||||
db.ggv("objects","`name`,`id`,`height`,`width`,`description`,`cost`,`gid`,`colors`","gid",`${gin}`,(odata)=>{
|
db.ggv("objects","`name`,`id`,`height`,`width`,`cost`,`gid`,`colors`","gid",`${gin}`,(odata)=>{
|
||||||
// func.log(odata);
|
// func.log(odata);
|
||||||
res.send({out:"good",body:odata});
|
res.send({out:"good",body:odata});
|
||||||
})
|
})
|
||||||
|
@ -30,25 +33,34 @@ module.exports.load = (inp,cook,res)=>{
|
||||||
|
|
||||||
module.exports.new = (inp,cook,res)=>{
|
module.exports.new = (inp,cook,res)=>{
|
||||||
try {
|
try {
|
||||||
|
if (typeof inp["colors"] != 'undefined'){inp["colors"] = (inp["colors"] == "false")? 0:1;}
|
||||||
db.gv("object_groups","id",`'${inp["gid"]}'`,(gname)=>{gname = gname[0]
|
db.gv("object_groups","id",`'${inp["gid"]}'`,(gname)=>{gname = gname[0]
|
||||||
db.gv("object_partition","id",`'${gname["pid"]}'`,(pname)=>{pname = pname[0]
|
db.gv("object_partition","id",`'${gname["pid"]}'`,(pname)=>{pname = pname[0]
|
||||||
db.ggv("objects","name","gid",`'${inp["gid"]}' AND name = '${inp["name"]}/g/${gname["name"]}'`,(db_name)=>{
|
save_img(inp["img"],`${inp["name"]}~g~${gname["name"]}~p~${pname["name"]}`,(img_path)=>{
|
||||||
if(db_name[0] != null){
|
db.ggv("objects","name","gid",`'${inp["gid"]}' AND name = '${inp["name"]}~g~${gname["name"]}'`,(db_name)=>{
|
||||||
res.send({out:"bad",err:"name"});
|
if(db_name[0] != null){
|
||||||
}
|
res.send({out:"bad",err:"name"});
|
||||||
else if (db_name[0] == null){
|
}
|
||||||
db.nr("objects","`cost`,`name`,`img`,`height`,`width`,`description`,`gid`",`'${inp["cost"]}','${inp["name"]}/g/${gname["name"]}/p/${pname["name"]}','${inp["img"]}','${inp["height"]}','${inp["width"]}','${inp["desc"]}','${inp["gid"]}'`,true);
|
else if (db_name[0] == null){
|
||||||
db.sv("object_groups","count",`(count + 1)`,"id",inp["gid"],()=>{},true,true)
|
db.nr("objects","`cost`,`name`,`img`,`height`,`width`,`gid`,`colors`",`'${inp["cost"]}','${inp["name"]}~g~${gname["name"]}~p~${pname["name"]}','${img_path}','${inp["height"]}','${inp["width"]}','${inp["gid"]}','${inp["colors"]}'`,true);
|
||||||
func.log(`admin object created name:${inp["name"]} group:${gname["name"]}`);
|
db.sv("object_groups","count",`(count + 1)`,"id",inp["gid"],()=>{},true,true)
|
||||||
res.send({out:"good"});
|
func.log(`admin object created name:${inp["name"]} group:${gname["name"]}`);
|
||||||
}
|
res.send({out:"good"});
|
||||||
// console.log(db_name);
|
}
|
||||||
// db.ggv("objects","gid","name",`'${inp["name"]}'`,(db_name)=>{
|
// console.log(db_name);
|
||||||
// })
|
// db.ggv("objects","gid","name",`'${inp["name"]}'`,(db_name)=>{
|
||||||
},true)
|
// })
|
||||||
|
},true)
|
||||||
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
function save_img(data,name,callback) {
|
||||||
|
let img = imageDataURI.decode(data);
|
||||||
|
if (!fs.existsSync(`public/img/object/${name}`)){fs.mkdirSync(`public/img/object/${name}`);fs.mkdirSync(`public/img/object/${name}/colored`);}
|
||||||
|
fs.writeFile(`public/img/object/${name}/main.${img.imageType.split("/").at(-1)}`, img.dataBuffer,()=>{
|
||||||
|
if(callback)callback(`/img/object/${name}/main.${img.imageType.split("/").at(-1)}`);
|
||||||
|
});
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
func.log("backend object creating error - "+error);
|
func.log("backend object creating error - "+error);
|
||||||
}
|
}
|
||||||
|
@ -59,6 +71,8 @@ module.exports.save = (inp,cook,res)=>{
|
||||||
// let changed = [];
|
// let changed = [];
|
||||||
let changes = JSON.parse(inp["changes"]);
|
let changes = JSON.parse(inp["changes"]);
|
||||||
let taken_name = false;
|
let taken_name = false;
|
||||||
|
if (typeof changes["colors"] != 'undefined'){changes["colors"] = (changes["colors"] == "false")? 0:1;}
|
||||||
|
// console.log(changes);
|
||||||
Object.entries(changes).forEach(([key,value]) => {
|
Object.entries(changes).forEach(([key,value]) => {
|
||||||
// console.log(key,value);
|
// console.log(key,value);
|
||||||
// console.log( Object.keys(changes).pop());
|
// console.log( Object.keys(changes).pop());
|
||||||
|
@ -76,6 +90,27 @@ module.exports.save = (inp,cook,res)=>{
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
else if (key == "img"){
|
||||||
|
db.gv("objects","id",`'${inp["id"]}'`,(db_data)=>{db_data = db_data[0]
|
||||||
|
// console.log(db_data);
|
||||||
|
fs.rm(`public/img/object/${db_data["name"]}`, { recursive: true }, () => {
|
||||||
|
// fs.unlink(db_data["img"],()=>{});
|
||||||
|
save_img(value,db_data["name"],(path)=>{
|
||||||
|
db.sv("objects",key,path,"id",inp["id"],()=>{
|
||||||
|
chack_if_last(key)
|
||||||
|
},true);
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
function save_img(data,name,callback) {
|
||||||
|
let img = imageDataURI.decode(data);
|
||||||
|
if (!fs.existsSync(`public/img/object/${name}`)){fs.mkdirSync(`public/img/object/${name}`);fs.mkdirSync(`public/img/object/${name}/colored`);}}
|
||||||
|
fs.writeFile(`public/img/object/${name}/main.${img.imageType.split("/").at(-1)}`, img.dataBuffer,()=>{
|
||||||
|
if(callback)callback(`/img/object/${name}/main.${img.imageType.split("/").at(-1)}`);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})
|
||||||
|
}
|
||||||
else if (key != "name"){
|
else if (key != "name"){
|
||||||
// console.log("not name");
|
// console.log("not name");
|
||||||
db.sv("objects",key,value,"id",inp["id"],()=>{
|
db.sv("objects",key,value,"id",inp["id"],()=>{
|
||||||
|
@ -99,6 +134,7 @@ module.exports.del = (inp,cook,res)=>{
|
||||||
let gid = obj_db["gid"];
|
let gid = obj_db["gid"];
|
||||||
let name = obj_db["name"];
|
let name = obj_db["name"];
|
||||||
db.dl("objects",`id`,`'${inp["id"]}'`,()=>{
|
db.dl("objects",`id`,`'${inp["id"]}'`,()=>{
|
||||||
|
fs.rm(`public/img/object/${obj_db["name"]}`, { recursive: true }, () => {})
|
||||||
db.sv("object_groups","count",`(count - 1)`,"id",`${gid}`,()=>{},true,true)
|
db.sv("object_groups","count",`(count - 1)`,"id",`${gid}`,()=>{},true,true)
|
||||||
func.log(`admin object deleted name:${name} group:${gid}`);
|
func.log(`admin object deleted name:${name} group:${gid}`);
|
||||||
res.send({out:"good"});
|
res.send({out:"good"});
|
||||||
|
@ -236,8 +272,8 @@ module.exports.new_part = (inp,cook,res)=>{
|
||||||
}
|
}
|
||||||
module.exports.del_part = (inp,cook,res)=>{
|
module.exports.del_part = (inp,cook,res)=>{
|
||||||
try {
|
try {
|
||||||
db.ggv("object_partition",`name`,`id`,`'${inp["gid"]}'`,(gname)=>{gname = gname[0]["name"]
|
db.ggv("object_partition",`name`,`id`,`'${inp["pid"]}'`,(gname)=>{gname = gname[0]["name"];
|
||||||
db.dl("object_partition",`id`,`'${inp["gid"]}'`,()=>{
|
db.dl("object_partition",`id`,`'${inp["pid"]}'`,()=>{
|
||||||
func.log(`admin part deleted ${gname}`);
|
func.log(`admin part deleted ${gname}`);
|
||||||
res.send({out:"good"});
|
res.send({out:"good"});
|
||||||
},true);
|
},true);
|
||||||
|
|
1813
package-lock.json
generated
|
@ -4,11 +4,14 @@
|
||||||
"cookie-parser": "^1.4.6",
|
"cookie-parser": "^1.4.6",
|
||||||
"crypto-js": "^4.1.1",
|
"crypto-js": "^4.1.1",
|
||||||
"cryptojs": "^2.5.3",
|
"cryptojs": "^2.5.3",
|
||||||
|
"css-filter-converter": "^1.0.109",
|
||||||
"ejs": "^3.1.9",
|
"ejs": "^3.1.9",
|
||||||
"express": "^4.18.2",
|
"express": "^4.18.2",
|
||||||
|
"image-data-uri": "^2.0.1",
|
||||||
"jquery": "^3.7.0",
|
"jquery": "^3.7.0",
|
||||||
"moment": "^2.29.4",
|
"moment": "^2.29.4",
|
||||||
"mysql": "^2.18.1",
|
"mysql": "^2.18.1",
|
||||||
|
"replace-color": "^2.3.0",
|
||||||
"uuid": "^9.0.0"
|
"uuid": "^9.0.0"
|
||||||
},
|
},
|
||||||
"name": "puzle",
|
"name": "puzle",
|
||||||
|
|
BIN
public/img/object/KeyBoard~g~не$основное/main.jpg
Normal file
After Width: | Height: | Size: 18 KiB |
After Width: | Height: | Size: 848 KiB |
After Width: | Height: | Size: 88 KiB |
After Width: | Height: | Size: 86 KiB |
After Width: | Height: | Size: 85 KiB |
After Width: | Height: | Size: 134 KiB |
BIN
public/img/placeholder.png
Normal file
After Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 802 B After Width: | Height: | Size: 802 B |
|
@ -75,10 +75,11 @@ function check_sid(redirect = true){
|
||||||
}
|
}
|
||||||
|
|
||||||
function logout(redirect = true) {
|
function logout(redirect = true) {
|
||||||
let dialog = confirm(`выйти?`);
|
msg(`Выйти?`,{type:"ask",res:(out)=>{
|
||||||
if(dialog){
|
if(out){
|
||||||
clear_ck(redirect);
|
clear_ck(redirect);
|
||||||
}
|
}
|
||||||
|
}});
|
||||||
}
|
}
|
||||||
|
|
||||||
function ask(text,def = "") {
|
function ask(text,def = "") {
|
||||||
|
@ -119,7 +120,7 @@ function load_groups(callback,groups,admin = false){
|
||||||
group_inp.setAttribute("onchange",`group_check(${group["id"]})`)
|
group_inp.setAttribute("onchange",`group_check(${group["id"]})`)
|
||||||
// group_inp.innerText = group["name"].replaceAll("$"," ");
|
// group_inp.innerText = group["name"].replaceAll("$"," ");
|
||||||
group_inp.setAttribute("group_count",group["count"]);
|
group_inp.setAttribute("group_count",group["count"]);
|
||||||
console.log(group["count"]);
|
// console.log(group["count"]);
|
||||||
group_inp.setAttribute("gid",group["id"]);
|
group_inp.setAttribute("gid",group["id"]);
|
||||||
group_inp.id = `obj_group_${group["id"]}`;
|
group_inp.id = `obj_group_${group["id"]}`;
|
||||||
group_inp.setAttribute("group_name",`${group["name"].replaceAll("$"," ")}`);
|
group_inp.setAttribute("group_name",`${group["name"].replaceAll("$"," ")}`);
|
||||||
|
@ -129,17 +130,17 @@ function load_groups(callback,groups,admin = false){
|
||||||
group_inp.setAttribute("checked","true");
|
group_inp.setAttribute("checked","true");
|
||||||
}
|
}
|
||||||
|
|
||||||
// console.log(document.url);
|
|
||||||
if(admin){
|
if(admin){
|
||||||
let group_del_btn = document.createElement("button");
|
let group_del_btn = document.createElement("button");
|
||||||
group_del_btn.setAttribute("onclick",`delete_group(${group["id"]},${group["pid"]})`)
|
group_del_btn.setAttribute("onclick",`delete_group(${group["id"]},${group["pid"]})`)
|
||||||
group_del_btn.innerText = "удалить";
|
group_del_btn.innerText = "удалить";
|
||||||
group_del_btn.style = "font-size: 1vw;width: 70px;";
|
group_del_btn.classList.add("btn_blue");
|
||||||
|
group_del_btn.style = "font-size: 0.8vw;width: 70px;";
|
||||||
group_div.append(group_del_btn)
|
group_div.append(group_del_btn)
|
||||||
}
|
}
|
||||||
|
|
||||||
group_div.append(group_inp);
|
|
||||||
group_div.append(group_label);
|
group_div.append(group_label);
|
||||||
|
group_div.append(group_inp);
|
||||||
select.append(group_div)
|
select.append(group_div)
|
||||||
}
|
}
|
||||||
// callback(res);
|
// callback(res);
|
||||||
|
@ -175,6 +176,13 @@ function group_check(gid){
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function color_change(hex,img,callback){
|
||||||
|
$.post( `/color`,{hex:hex,img:img})
|
||||||
|
.done(function( res ) {
|
||||||
|
if(callback) callback(res);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function load_parts(callback){
|
function load_parts(callback){
|
||||||
let parts_div = document.getElementById("part_select");
|
let parts_div = document.getElementById("part_select");
|
||||||
$.post( "/object/parts/get", {})
|
$.post( "/object/parts/get", {})
|
||||||
|
@ -250,3 +258,46 @@ var openFile = function(event,callback) {
|
||||||
};
|
};
|
||||||
reader.readAsText(input.files[0]);
|
reader.readAsText(input.files[0]);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
async function removeImageBackground(image) {
|
||||||
|
const backgroundColor = { red: 255, green: 255, blue: 255 };
|
||||||
|
const threshold = 10;
|
||||||
|
|
||||||
|
const imageElement = new Image();
|
||||||
|
imageElement.src = image;
|
||||||
|
await new Promise(function(resolve) { imageElement.addEventListener('load', resolve); });
|
||||||
|
|
||||||
|
var canvas = document.createElement('canvas');
|
||||||
|
canvas.width = imageElement.naturalWidth;
|
||||||
|
canvas.height = imageElement.naturalHeight;
|
||||||
|
|
||||||
|
var ctx = canvas.getContext('2d');
|
||||||
|
ctx.drawImage(imageElement, 0, 0);
|
||||||
|
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
|
||||||
|
for (var i = 0; i < imageData.data.length; i += 4) {
|
||||||
|
const red = imageData.data[i];
|
||||||
|
const green = imageData.data[i + 1];
|
||||||
|
const blue = imageData.data[i + 2];
|
||||||
|
if (Math.abs(red - backgroundColor.red) < threshold &&
|
||||||
|
Math.abs(green - backgroundColor.green) < threshold &&
|
||||||
|
Math.abs(blue - backgroundColor.blue) < threshold) {
|
||||||
|
imageData.data[i + 3] = 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ctx.putImageData(imageData, 0, 0);
|
||||||
|
return canvas.toDataURL(`image/png`);
|
||||||
|
}
|
||||||
|
|
||||||
|
function downloadImg(url, filename) {
|
||||||
|
fetch(url)
|
||||||
|
.then(response => response.blob())
|
||||||
|
.then(blob => {
|
||||||
|
const link = document.createElement("a");
|
||||||
|
link.href = URL.createObjectURL(blob);
|
||||||
|
link.download = filename;
|
||||||
|
link.click();
|
||||||
|
})
|
||||||
|
.catch(console.error);
|
||||||
|
}
|
||||||
|
|
7830
public/lib/html2canvas.js1
Normal file
7830
public/lib/html2canvas.js2
Normal file
|
@ -10,7 +10,7 @@ let objs_forw = [];
|
||||||
let proj_state = "loading";
|
let proj_state = "loading";
|
||||||
let cm_mod = 2;
|
let cm_mod = 2;
|
||||||
|
|
||||||
function create(clas,x,y,body,id,size){
|
function create(clas,x,y,color = null,id,size){
|
||||||
let main_clas = clas.split(" ")[0];
|
let main_clas = clas.split(" ")[0];
|
||||||
// if (body == null || body == "") body = "[]";
|
// if (body == null || body == "") body = "[]";
|
||||||
let obj = document.createElement("img");
|
let obj = document.createElement("img");
|
||||||
|
@ -21,6 +21,7 @@ function create(clas,x,y,body,id,size){
|
||||||
obj.classList.add(cl);
|
obj.classList.add(cl);
|
||||||
});
|
});
|
||||||
get_obj(main_clas,(db_data)=>{
|
get_obj(main_clas,(db_data)=>{
|
||||||
|
// console.log(db_data);
|
||||||
// console.log(db_data);
|
// console.log(db_data);
|
||||||
// db_data.forEach(db_data => {
|
// db_data.forEach(db_data => {
|
||||||
// });
|
// });
|
||||||
|
@ -50,13 +51,20 @@ function create(clas,x,y,body,id,size){
|
||||||
}
|
}
|
||||||
function make(img){
|
function make(img){
|
||||||
obj.src = img;
|
obj.src = img;
|
||||||
obj.title = `${db_data["name"].replaceAll("$"," ").split("/g")[0]}\nцена:${db_data["cost"]}\n${db_data["description"]}\nширина:${db_data["width"]}см высота:${db_data["height"]}см`;
|
obj.title = `${db_data["name"].replaceAll("$"," ").split("/g")[0]}\nцена:${db_data["cost"]}\nширина:${db_data["width"]}см высота:${db_data["height"]}см`;
|
||||||
obj.setAttribute("cost",db_data["cost"])
|
obj.setAttribute("cost",db_data["cost"])
|
||||||
|
obj.setAttribute("colors",Boolean(db_data["colors"]))
|
||||||
|
obj.setAttribute("img",img)
|
||||||
|
obj.setAttribute("gid",db_data["gid"])
|
||||||
|
obj.setAttribute("color",color)
|
||||||
// drag.transform = `translate(${drag.getAttribute("data-y")}px, ${drag.getAttribute("data-y")}px) scale(${db_data["width"] * cm_mod} ${db_data["height"] * cm_mod})`;
|
// drag.transform = `translate(${drag.getAttribute("data-y")}px, ${drag.getAttribute("data-y")}px) scale(${db_data["width"] * cm_mod} ${db_data["height"] * cm_mod})`;
|
||||||
if(size){
|
if(size){
|
||||||
obj.style.width = `${db_data["width"] * cm_mod}px`;
|
obj.style.width = `${db_data["width"] * cm_mod}px`;
|
||||||
obj.style.height = `${db_data["height"] * cm_mod}px`;
|
obj.style.height = `${db_data["height"] * cm_mod}px`;
|
||||||
}
|
}
|
||||||
|
if (color != null){
|
||||||
|
obj_color_change(color,obj)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
calc_total();
|
calc_total();
|
||||||
})
|
})
|
||||||
|
@ -67,18 +75,28 @@ function create(clas,x,y,body,id,size){
|
||||||
|
|
||||||
function obj_click(id){
|
function obj_click(id){
|
||||||
if (cur_obj != id){
|
if (cur_obj != id){
|
||||||
|
let obj = document.getElementById(id);
|
||||||
cur_obj = id;
|
cur_obj = id;
|
||||||
let drags = document.getElementsByClassName("drag");
|
if (obj.getAttribute("colors") == "true"){
|
||||||
Object.values(drags).forEach(element => {
|
document.getElementById("obj_color_div").style.display = "flex";
|
||||||
// console.log(element.id,cur_obj);
|
}
|
||||||
if (element.id != cur_obj){
|
else{
|
||||||
element.style.border = "0px";
|
document.getElementById("obj_color_div").style.display = "none";
|
||||||
}
|
}
|
||||||
else{
|
// console.log(obj.);
|
||||||
element.style.border = "1px black solid";
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
// function obj_selection(){
|
||||||
|
// let drags = document.getElementsByClassName("drag");
|
||||||
|
// Object.values(drags).forEach(element => {
|
||||||
|
// console.log(element.id,cur_obj);
|
||||||
|
// if (element.id != cur_obj){
|
||||||
|
// element.style.border = "0px";
|
||||||
|
// }
|
||||||
|
// else{
|
||||||
|
// element.style.border = "1px black solid";
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
function resize_drags(){
|
function resize_drags(){
|
||||||
|
@ -93,6 +111,7 @@ function wall_size_change(type,value = null){
|
||||||
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
||||||
|
|
||||||
let wall = document.getElementsByClassName("wall")[0];
|
let wall = document.getElementsByClassName("wall")[0];
|
||||||
|
let drags = document.getElementById("drags");
|
||||||
let scroll;
|
let scroll;
|
||||||
if(type != null && type == "width") {
|
if(type != null && type == "width") {
|
||||||
if (value == null) scroll = parseFloat(document.getElementById("wall_width").value);
|
if (value == null) scroll = parseFloat(document.getElementById("wall_width").value);
|
||||||
|
@ -102,6 +121,7 @@ function wall_size_change(type,value = null){
|
||||||
|
|
||||||
// console.log(scroll);
|
// console.log(scroll);
|
||||||
wall.style.width = `${(scroll * 100) * cm_mod}px`;
|
wall.style.width = `${(scroll * 100) * cm_mod}px`;
|
||||||
|
wall.style.left = drags.getBoundingClientRect().left;
|
||||||
objs["width"] = scroll;
|
objs["width"] = scroll;
|
||||||
}
|
}
|
||||||
if(type != null && type == "height") {
|
if(type != null && type == "height") {
|
||||||
|
@ -119,7 +139,7 @@ function wall_size_change(type,value = null){
|
||||||
function calc_total(start = false){
|
function calc_total(start = false){
|
||||||
document.getElementById("cost_list").innerHTML = ""
|
document.getElementById("cost_list").innerHTML = ""
|
||||||
if (start) {
|
if (start) {
|
||||||
document.getElementById("proj_cost_text").innerText = `стоимость: ${objs["total"]} руб.`;
|
document.getElementById("proj_cost_text").innerText = `Стоимость: ${objs["total"]} руб.`;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let total=0;
|
let total=0;
|
||||||
|
@ -128,13 +148,15 @@ function calc_total(start = false){
|
||||||
if(key != "height"&&key!="width"&key!="total"){
|
if(key != "height"&&key!="width"&key!="total"){
|
||||||
// console.log(Object.keys(value).length);
|
// console.log(Object.keys(value).length);
|
||||||
// console.log(objs_store[key]);
|
// console.log(objs_store[key]);
|
||||||
if(objs_store[key] != null){
|
if(objs_store[key] != null && objs_store[key]["cost"] > 0){
|
||||||
// console.log(key,value);
|
// console.log(key,value);
|
||||||
total += parseInt(parseInt(objs_store[key]["cost"]) * Object.keys(value).length);
|
total += parseInt(parseInt(objs_store[key]["cost"]) * Object.keys(value).length);
|
||||||
let obj_cost_div = document.createElement("li");
|
let obj_cost_div = document.createElement("li");
|
||||||
obj_cost_div.innerHTML =
|
obj_cost_div.innerHTML =
|
||||||
`<div style="display:flex;"> <div id='obj_cost_name'>${key.split("/g/")[0].replaceAll("$"," ")}</div>`+
|
`<div style="display:flex;"> ` +
|
||||||
`<div id='obj_cost_count'> ${Object.keys(value).length}x</div> </div>`+
|
`<div id='obj_cost_name' style='font-size:calc(var(--main-font-size)/1);'>${key.split("~g~")[0].replaceAll("$"," ")}`+
|
||||||
|
`<div id='obj_cost_count'> ${Object.keys(value).length}X</div> </div>`+
|
||||||
|
`</div>`+
|
||||||
`<div id='obj_cost'>${parseInt(parseInt(objs_store[key]["cost"]) * Object.keys(value).length)}</div>`;
|
`<div id='obj_cost'>${parseInt(parseInt(objs_store[key]["cost"]) * Object.keys(value).length)}</div>`;
|
||||||
document.getElementById("cost_list").append(obj_cost_div);
|
document.getElementById("cost_list").append(obj_cost_div);
|
||||||
}
|
}
|
||||||
|
@ -153,15 +175,15 @@ function load(objss){
|
||||||
// console.log(objs);
|
// console.log(objs);
|
||||||
objs = objss;
|
objs = objss;
|
||||||
Object.entries(objs).forEach(([keys, values]) => {
|
Object.entries(objs).forEach(([keys, values]) => {
|
||||||
console.log(keys,values);
|
// console.log(keys,values);
|
||||||
if (keys != "width" && keys != "height" && keys != "color"){
|
if (keys != "width" && keys != "height" && keys != "color" && keys != "grided"){
|
||||||
Object.entries(values).forEach(([key, value]) => {
|
Object.entries(values).forEach(([key, value]) => {
|
||||||
if(key != "class"){
|
if(key != "class"){
|
||||||
// console.log(key,keys);
|
// console.log(key,keys);
|
||||||
// console.log(keys,value["x"],value["y"],value["body"]);
|
// console.log(keys,value["x"],value["y"],value["body"]);
|
||||||
// let count = Object.keys(objs[keys]).length;
|
// let count = Object.keys(objs[keys]).length;
|
||||||
// console.log(count);
|
// console.log(count);
|
||||||
create(keys+" drag",value["x"],value["y"],value["body"],key,true);
|
create(keys+" drag",value["x"],value["y"],value["color"],key,true);
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -174,6 +196,9 @@ function load(objss){
|
||||||
if (keys == "color"){
|
if (keys == "color"){
|
||||||
document.getElementById("wall").style.backgroundColor = values;
|
document.getElementById("wall").style.backgroundColor = values;
|
||||||
}
|
}
|
||||||
|
if (keys == "grided"){
|
||||||
|
document.getElementById("wall").style.backgroundColor = values;
|
||||||
|
}
|
||||||
if (keys == Object.keys(objs).at(-1)){
|
if (keys == Object.keys(objs).at(-1)){
|
||||||
loaded();
|
loaded();
|
||||||
proj_state = "loaded";
|
proj_state = "loaded";
|
||||||
|
@ -233,16 +258,9 @@ function save(callback,with_pic = true){
|
||||||
// console.log(objs);
|
// console.log(objs);
|
||||||
proj_from = "cloud";
|
proj_from = "cloud";
|
||||||
if(with_pic){
|
if(with_pic){
|
||||||
html2canvas(document.querySelector("body"),{
|
proj_img((src)=>{
|
||||||
height: document.getElementById("wall").style.height.split("p")[0],
|
|
||||||
width:document.getElementById("wall").style.width.split("p")[0],
|
|
||||||
y:document.getElementById("wall").getBoundingClientRect().top,
|
|
||||||
x:document.getElementById("wall").getBoundingClientRect().left
|
|
||||||
}).then(canvas => {
|
|
||||||
let src = "";
|
|
||||||
src = canvas.toDataURL();
|
|
||||||
make_save(src);
|
make_save(src);
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
make_save();
|
make_save();
|
||||||
|
@ -267,7 +285,7 @@ function load_objs(callback,group){
|
||||||
if(res["out"] == "good"){
|
if(res["out"] == "good"){
|
||||||
// console.log(res["body"]);
|
// console.log(res["body"]);
|
||||||
res["body"].forEach(element => {
|
res["body"].forEach(element => {
|
||||||
objs_store[`${element["name"]}`] = {description:element["description"],height:element["height"],width:element["width"],id:element["id"],name:element["name"],cost:element["cost"]}
|
objs_store[`${element["name"]}`] = {height:element["height"],width:element["width"],id:element["id"],name:element["name"],cost:element["cost"],colors:element["colors"]}
|
||||||
});
|
});
|
||||||
callback(res["body"]);
|
callback(res["body"]);
|
||||||
}
|
}
|
||||||
|
@ -275,7 +293,7 @@ function load_objs(callback,group){
|
||||||
}
|
}
|
||||||
|
|
||||||
function get_obj(clas,callback){
|
function get_obj(clas,callback){
|
||||||
if(objs_store != null && objs_store[clas] != null){
|
if(objs_store[clas] != null){
|
||||||
callback(objs_store[clas]);
|
callback(objs_store[clas]);
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
|
@ -349,6 +367,7 @@ interact('.dropzone').dropzone({
|
||||||
if(drag.id == "none") drag.id = get_id(drag.classList[0]);
|
if(drag.id == "none") drag.id = get_id(drag.classList[0]);
|
||||||
if (objs[drag.classList[0]][drag.id] == null){
|
if (objs[drag.classList[0]][drag.id] == null){
|
||||||
objs[drag.classList[0]][drag.id] = {};
|
objs[drag.classList[0]][drag.id] = {};
|
||||||
|
drag.setAttribute("onclick",`obj_click("${drag.id}")`);
|
||||||
calc_total()
|
calc_total()
|
||||||
}
|
}
|
||||||
zone.classList.add('drop-target');drag.classList.add('can-drop');
|
zone.classList.add('drop-target');drag.classList.add('can-drop');
|
||||||
|
@ -357,9 +376,9 @@ interact('.dropzone').dropzone({
|
||||||
ondrop: function (event) {var drag = event.relatedTarget
|
ondrop: function (event) {var drag = event.relatedTarget
|
||||||
|
|
||||||
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
||||||
objs[drag.classList[0]][drag.id] = {y:drag.getAttribute('data-y'),x:drag.getAttribute('data-x'),body:drag.innerHTML};
|
objs[drag.classList[0]][drag.id] = {y:drag.getAttribute('data-y'),x:drag.getAttribute('data-x'),body:drag.innerHTML,color:drag.getAttribute("color")};
|
||||||
drag.classList.add('in_zone');drag.classList.remove('can-drop');
|
drag.classList.add('in_zone');drag.classList.remove('can-drop');
|
||||||
// console.log(objs["KeyBoard/g/не$основное"]["KeyBoard/g/не$основное_1"]);
|
// console.log(objs["KeyBoard~g~не$основное"]["KeyBoard~g~не$основное_1"]);
|
||||||
|
|
||||||
},
|
},
|
||||||
ondropdeactivate: function (event) {var zone = event.target;zone.classList.remove('drop-active');zone.classList.remove('drop-target');}
|
ondropdeactivate: function (event) {var zone = event.target;zone.classList.remove('drop-active');zone.classList.remove('drop-target');}
|
||||||
|
@ -379,11 +398,12 @@ interact('.createzone').dropzone({
|
||||||
// drag.transform = `translate(${drag.getAttribute("data-y")}px, ${drag.getAttribute("data-y")}px) scale(${db_data["width"] * cm_mod} ${db_data["height"] * cm_mod})`;
|
// drag.transform = `translate(${drag.getAttribute("data-y")}px, ${drag.getAttribute("data-y")}px) scale(${db_data["width"] * cm_mod} ${db_data["height"] * cm_mod})`;
|
||||||
drag.style.width = `${db_data["width"] * cm_mod}px`;
|
drag.style.width = `${db_data["width"] * cm_mod}px`;
|
||||||
drag.style.height = `${db_data["height"] * cm_mod}px`;
|
drag.style.height = `${db_data["height"] * cm_mod}px`;
|
||||||
|
|
||||||
// console.log(db_data);
|
// console.log(db_data);
|
||||||
})
|
})
|
||||||
let x = zone.getBoundingClientRect().left - document.getElementById("drags").getBoundingClientRect().left;
|
let x = zone.getBoundingClientRect().left - document.getElementById("drags").getBoundingClientRect().left;
|
||||||
let y = zone.getBoundingClientRect().top - document.getElementById("drags").getBoundingClientRect().top;
|
let y = zone.getBoundingClientRect().top - document.getElementById("drags").getBoundingClientRect().top;
|
||||||
create(`${zone.classList[0]} spawn drag`,x,y,`${zone.classList[0]}`,`none`);
|
create(`${zone.classList[0]} spawn drag`,x,y,null,`none`);
|
||||||
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
||||||
drag.classList.remove('spawn');
|
drag.classList.remove('spawn');
|
||||||
}
|
}
|
||||||
|
@ -404,7 +424,7 @@ function drag_start() {
|
||||||
Object.entries(zones).forEach(([key, zone]) => {
|
Object.entries(zones).forEach(([key, zone]) => {
|
||||||
let x = zone.getBoundingClientRect().left - document.getElementById("drags").getBoundingClientRect().left;
|
let x = zone.getBoundingClientRect().left - document.getElementById("drags").getBoundingClientRect().left;
|
||||||
let y = zone.getBoundingClientRect().top - document.getElementById("drags").getBoundingClientRect().top;
|
let y = zone.getBoundingClientRect().top - document.getElementById("drags").getBoundingClientRect().top;
|
||||||
create(`${zone.classList[0]} spawn drag`,x,y,`${zone.classList[0]}`,`none`);
|
create(`${zone.classList[0]} spawn drag`,x,y,null,`none`);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
4
user.js
|
@ -93,11 +93,11 @@ module.exports.sid_log=(inp,cook,res,req)=>{
|
||||||
func.sid(cook,res,(include) => {
|
func.sid(cook,res,(include) => {
|
||||||
if (include){
|
if (include){
|
||||||
res.send({out:"good",url:"/main"});
|
res.send({out:"good",url:"/main"});
|
||||||
if(req.headers.referer.split("http://n0rsrv2:3002/")[1] == "login") func.log("good boy "+ id["uuid"]+" logged in by sid logs from " + id["sid"]);
|
if(req.headers.referer.split("https://n0r.su/")[1] == "login") func.log("good boy "+ id["uuid"]+" logged in by sid logs from " + id["sid"]);
|
||||||
}
|
}
|
||||||
else if (!include){
|
else if (!include){
|
||||||
res.send({out:"bad"});
|
res.send({out:"bad"});
|
||||||
if(req.headers.referer.split("http://n0rsrv2:3002/")[1] == "login") func.log("bad boy "+ id["uuid"]+" tried to login by sid but sid expired from " + id["sid"]);
|
if(req.headers.referer.split("https://n0r.su/")[1] == "login") func.log("bad boy "+ id["uuid"]+" tried to login by sid but sid expired from " + id["sid"]);
|
||||||
}
|
}
|
||||||
},false)
|
},false)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
|
|
@ -5,21 +5,25 @@
|
||||||
width: 80vw;
|
width: 80vw;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
body{
|
||||||
|
background-color: #F0F8FF;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<!-- <h1 style="text-align: center;">привет админ</h1> <br> -->
|
<!-- <h1 style="text-align: center;">привет админ</h1> <br> -->
|
||||||
|
|
||||||
<section class="admin_edits" style="display: flex; justify-content: space-evenly;">
|
<section class="admin_edits" style="display: flex; justify-content: space-evenly;">
|
||||||
<button onclick="goto('/admin/objects')">панель управления объектами</button>
|
<button onclick="goto('/admin/objects')" class="btn_white">Панель управления объектами</button>
|
||||||
<button onclick="goto('/admin/users')">панель управления пользователями</button>
|
<button onclick="goto('/admin/users')" class="btn_white">Панель управления пользователями</button>
|
||||||
</section>
|
<div class="logs_div" style="margin: auto 0px;display: flex; margin-left: 20vw;">
|
||||||
|
<button onclick="goto('/get_logs');" class="btn_white">Скачать логи</button>
|
||||||
<section style="display: flex; justify-content: space-between;">
|
|
||||||
<h1>логи</h1> <br>
|
|
||||||
<div class="logs_div" style="margin: auto 0px;display: flex;">
|
|
||||||
<button onclick="goto('/get_logs');">скачать логи</button>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
<br>
|
||||||
|
<section style="display: flex;">
|
||||||
|
<h1 style="width: 7.5vw;height: 600px;">Логи</h1>
|
||||||
|
<div style="background-color: white;width: 70vw;"></div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<%- include('./static/end.ejs') %>
|
<%- include('./static/end.ejs') %>
|
||||||
<script>
|
<script>
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<h1 style="text-align: center;">объект</h1>
|
<!-- <h1 style="text-align: center;">объект</h1> -->
|
||||||
<%- include('../admin/objects/object_groups.ejs') %>
|
<%- include('../admin/objects/object_groups.ejs') %>
|
||||||
<%- include('../admin/objects/object_creation.ejs') %>
|
<%- include('../admin/objects/object_creation.ejs') %>
|
||||||
<%- include('../admin/objects/object_edit.ejs') %>
|
<%- include('../admin/objects/object_edit.ejs') %>
|
||||||
|
|
|
@ -17,8 +17,9 @@
|
||||||
}
|
}
|
||||||
#img_prev{
|
#img_prev{
|
||||||
object-fit: fill;
|
object-fit: fill;
|
||||||
height: 200px;
|
|
||||||
width: 200px;
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
border: 1px black dotted;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
@ -32,116 +33,147 @@
|
||||||
</style>
|
</style>
|
||||||
<div id="img_file_div" >
|
<div id="img_file_div" >
|
||||||
<div class="img_preview">
|
<div class="img_preview">
|
||||||
<label for="img_file">макс. размер 2мб</label><br>
|
<label for="img_file">Изменение изображения</label><br>
|
||||||
<input hidden type="file" id="img_file" onchange="previewFile()" accept="image/*" value="" maxlength="1"><br>
|
<input hidden type="file" id="img_file" onchange="previewFile()" accept="image/*" value="" maxlength="1"><br>
|
||||||
</div>
|
</div>
|
||||||
<div id="img_prev_div" style="width: 200px; height: 200px;" onclick="document.getElementById('img_file').click();">
|
<div id="img_prev_div" style="min-width: 200px;min-height: 200px;margin-block: 2vh;" onclick="document.getElementById('img_file').click();msg('помните что граници обозначают элемент с которым можно взаимодействовать даже если он прозрачный',{time:10,type:'help'});msg('старайтесь не оставлять пустые/прозрачные отступы',{time:15,type:'help'})">
|
||||||
<img src="" id="img_prev" height="100" alt="выбрать изображение">
|
<img src="" id="img_prev" height="100" alt="изображение не выбрано">
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<input type="checkbox" id="obj_color_check">
|
<input type="checkbox" id="obj_color_check" onchange="color_warning()">
|
||||||
<label for="obj_color_check">можно менять цвет</label>
|
<label for="obj_color_check">возможность менять цвет</label>
|
||||||
|
<script>
|
||||||
|
old_prev = document.getElementById("img_prev");
|
||||||
|
function color_warning(){
|
||||||
|
let color_check = document.getElementById("obj_color_check");
|
||||||
|
let old_prev = document.getElementById("img_prev").src;
|
||||||
|
if(color_check.checked == true){
|
||||||
|
removeImageBackground(document.getElementById("img_prev").src).then((out)=>{
|
||||||
|
document.getElementById("img_prev").src = out;
|
||||||
|
})
|
||||||
|
msg("при измении цвета все цвета кроме прозрачного изменятся",{type:"help",time:10});
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
document.getElementById("img_prev").src = old_prev;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<textarea id="nobj_description" cols="30" rows="5" placeholder="описание товара"></textarea>
|
|
||||||
<div>
|
<div>
|
||||||
<div id="object_edit_type" style="display: flex;justify-content: space-between;"><div>creation</div></div>
|
<div id="object_edit_type" style="display: flex;justify-content: space-between;margin-bottom: 2vh;"><div>Добавление</div></div>
|
||||||
<div class="nobj_options">
|
<div class="nobj_options" style="margin-bottom: 3vh;">
|
||||||
<input type="text" id="nobj_name" placeholder="название товара">
|
<input type="text" id="nobj_name" placeholder="название товара" class="btn_white">
|
||||||
<input type="submit" onclick="create_obj()" id="obj_apply_btn" value="создать товар">
|
<input type="submit" onclick="create_obj()" id="obj_apply_btn" value="создать товар" class="btn_blue">
|
||||||
<div id="obj_resp"></div>
|
|
||||||
</div>
|
</div>
|
||||||
<div id="obj_input">
|
<div id="obj_input">
|
||||||
<div>
|
<div>
|
||||||
<div style="display: flex;width: 100%;justify-content: space-between;">
|
<div style="display: flex;width: 40%;justify-content: space-between;">
|
||||||
<label for="obj_height">высота</label>
|
<label for="obj_height">Высота</label>
|
||||||
<div id="obj_height_value">100см</div>
|
<div style="display: flex;"><input type="text" class="btn_white" style="width: 50px;" id="obj_height_value" value="100" oninput="this.value = this.value.replace(/[^0-9.]/g, '0').replace(/(\..*?)\..*/g, '$1').replace(/^0[^.]/, '0');obj_size_change('height','text')">
|
||||||
|
<div class="vc">см</div></div>
|
||||||
</div>
|
</div>
|
||||||
<input style="width: 100%;" type="range" step="1" min="1" max="100" id="obj_height" value="100" oninput="obj_size_change('height')">
|
<input style="width: 100%;" type="range" step="1" min="1" max="300" id="obj_height" value="100" oninput="obj_size_change('height','range')">
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div style="display: flex;width: 100%;justify-content: space-between;">
|
<div style="display: flex;width: 40%;justify-content: space-between;">
|
||||||
<label for="obj_width">ширина</label>
|
<label for="obj_width" class="vc">Ширина</label>
|
||||||
<div id="obj_width_value">100см</div>
|
<div style="display: flex;"><input type="text" class="btn_white" style="width: 50px;" id="obj_width_value" value="100" oninput="this.value = this.value.replace(/[^0-9.]/g, '0').replace(/(\..*?)\..*/g, '$1').replace(/^0[^.]/, '0');obj_size_change('width','text')">
|
||||||
|
<div class="vc">см</div></div>
|
||||||
</div>
|
</div>
|
||||||
<input style="width: 100%;" type="range" step="1" min="1" max="100" id="obj_width" value="100" oninput="obj_size_change('width')">
|
<input style="width: 100%;" type="range" step="1" min="1" max="300" id="obj_width" value="100" oninput="obj_size_change('width','range')">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div style="display: flex;width: 100%;justify-content: space-between;">
|
<div style="display: flex;width: 90%;justify-content: space-between;">
|
||||||
<label for="obj_width">цена</label>
|
<label for="obj_width" class="vc">Цена</label>
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<input style="text-align: right;" id="obj_cost" type="text" oninput="this.value = this.value.replace(/[^0-9.]/g, '0').replace(/(\..*?)\..*/g, '$1').replace(/^0[^.]/, '0');" >
|
<input style="text-align: right; width: 40%;" id="obj_cost" type="text" class="btn_white" oninput="this.value = this.value.replace(/[^0-9.]/g, '0').replace(/(\..*?)\..*/g, '$1').replace(/^0[^.]/, '0');" >
|
||||||
<div>руб.</div>
|
<div class="vc">руб.</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<button onclick="set_obj_edit_params()" style="width: 100%;margin-block:10px;">очистить параметры</button>
|
<button onclick="set_obj_edit_params()" style="width: 100%;margin-block:10px;" class="btn_blue">очистить параметры</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
let cm_mult = 2;
|
||||||
|
let obj_edit_type = "new";
|
||||||
set_obj_edit_params();
|
set_obj_edit_params();
|
||||||
function obj_size_change(type){
|
function obj_size_change(type,inp){
|
||||||
if(type == "height"){
|
if(type == "height"){
|
||||||
let img = document.getElementById('img_prev');
|
let img = document.getElementById('img_prev');
|
||||||
let range = document.getElementById('obj_height');
|
let range = document.getElementById('obj_height');
|
||||||
let text = document.getElementById('obj_height_value');
|
let text = document.getElementById('obj_height_value');
|
||||||
img.style.height = `${range.value * 2}px`;
|
if (inp == "text"){
|
||||||
text.innerHTML = `${range.value}см`;
|
range.value = `${text.value}`;
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
text.value = `${range.value}`;
|
||||||
|
}
|
||||||
|
img.style.height = `${range.value * cm_mult}px`;
|
||||||
}else if (type == "width"){
|
}else if (type == "width"){
|
||||||
let img = document.getElementById('img_prev');
|
let img = document.getElementById('img_prev');
|
||||||
let range = document.getElementById('obj_width');
|
let range = document.getElementById('obj_width');
|
||||||
let text = document.getElementById('obj_width_value');
|
let text = document.getElementById('obj_width_value');
|
||||||
img.style.width = `${range.value * 2}px`;
|
if (inp == "text"){
|
||||||
text.innerHTML = `${range.value}см`;
|
range.value = `${text.value}`;
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
text.value = `${range.value}`;
|
||||||
|
}
|
||||||
|
img.style.width = `${range.value * cm_mult}px`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function set_obj_edit_params(img = "",name = "",description="",height = 100,width = 100,cost = 0,gid = 0, id = null){
|
function set_obj_edit_params(img = "/img/placeholder.png",name = "",height = 100,width = 100,cost = 0,gid = 0,colors = false, id = null){
|
||||||
if(img ==""&&name ==""&&description == ""){
|
// поменять на if id == null усё
|
||||||
|
if(id == null){
|
||||||
|
obj_edit_type = "new";
|
||||||
document.getElementById("object_edit_type").innerText = "добавление";
|
document.getElementById("object_edit_type").innerText = "добавление";
|
||||||
document.getElementById("obj_apply_btn").value = "добавить товар";
|
document.getElementById("obj_apply_btn").value = "добавить товар";
|
||||||
document.getElementById("obj_apply_btn").setAttribute("onclick","create_obj()");
|
document.getElementById("obj_apply_btn").setAttribute("onclick","create_obj()");
|
||||||
}else {
|
}else {
|
||||||
|
obj_edit_type = "edit";
|
||||||
document.getElementById("object_edit_type").innerText = "редактирование";
|
document.getElementById("object_edit_type").innerText = "редактирование";
|
||||||
let del_btn = document.createElement("button");
|
let del_btn = document.createElement("button");
|
||||||
del_btn.setAttribute("onclick",`obj_del(${id})`);
|
del_btn.setAttribute("onclick",`obj_del(${id})`);
|
||||||
del_btn.innerText = "удалить объект";
|
del_btn.innerText = "удалить товар";
|
||||||
|
del_btn.classList.add("btn_blue");
|
||||||
document.getElementById("object_edit_type").append(del_btn);
|
document.getElementById("object_edit_type").append(del_btn);
|
||||||
document.getElementById("obj_apply_btn").value = "сохранить";
|
document.getElementById("obj_apply_btn").value = "сохранить";
|
||||||
document.getElementById("obj_apply_btn").setAttribute("onclick",`save_edited_obj(${id})`);
|
document.getElementById("obj_apply_btn").setAttribute("onclick",`save_edited_obj(${id})`);
|
||||||
// document.getElementById("group_select").selectedIndex = document.getElementById("group_select").options[`obj_group_${gid}`].index;
|
// document.getElementById("group_select").selectedIndex = document.getElementById("group_select").options[`obj_group_${gid}`].index;
|
||||||
gids = [parseInt(gid)]
|
if (gid != 0){gids = [parseInt(gid)]}
|
||||||
console.log(gid);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let img_file = document.getElementById("img_file");
|
let img_file = document.getElementById("img_file");
|
||||||
let img_prev = document.getElementById("img_prev");
|
let img_prev = document.getElementById("img_prev");
|
||||||
let name_div = document.getElementById("nobj_name");
|
let name_div = document.getElementById("nobj_name");
|
||||||
let description_div = document.getElementById("nobj_description");
|
|
||||||
|
|
||||||
let height_slider = document.getElementById("obj_height");
|
let height_slider = document.getElementById("obj_height");
|
||||||
let height_text = document.getElementById("obj_height_value");
|
let height_text = document.getElementById("obj_height_value");
|
||||||
let width_slider = document.getElementById("obj_width");
|
let width_slider = document.getElementById("obj_width");
|
||||||
let width_text = document.getElementById("obj_width_value");
|
let width_text = document.getElementById("obj_width_value");
|
||||||
let cost_text = document.getElementById("obj_cost");
|
let cost_text = document.getElementById("obj_cost");
|
||||||
|
let colors_div = document.getElementById("obj_color_check");
|
||||||
|
|
||||||
name_div.value = name;
|
name_div.value = name;
|
||||||
img_file.value = null;
|
img_file.value = null;
|
||||||
img_prev.src = img;
|
img_prev.src = img;
|
||||||
img_prev.style.height = `${height*2}px`;
|
img_prev.style.height = `${height* cm_mult}px`;
|
||||||
img_prev.style.width = `${width*2}px`;
|
img_prev.style.width = `${width* cm_mult}px`;
|
||||||
description_div.value = description;
|
|
||||||
cost_text.value = cost;
|
cost_text.value = cost;
|
||||||
|
colors_div.checked = JSON.parse(colors);
|
||||||
|
|
||||||
height_slider.value = height;
|
height_slider.value = height;
|
||||||
width_slider.value = width;
|
width_slider.value = width;
|
||||||
height_text.innerText = `${height}см`;
|
height_text.value = `${height}`;
|
||||||
width_text.innerText = `${width}см`;
|
width_text.value = `${width}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
function previewFile() {
|
function previewFile() {
|
||||||
|
@ -156,62 +188,69 @@
|
||||||
if (file) {
|
if (file) {
|
||||||
reader.readAsDataURL(file);
|
reader.readAsDataURL(file);
|
||||||
} else {
|
} else {
|
||||||
preview.src = "";
|
preview.src = "/img/placeholder.png";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function new_obj(cost,name,img,height,width,description,callback){
|
function new_obj(cost,name,img,height,width,gid,colors,callback){
|
||||||
let gid = gids[0];
|
let wait_msg = msg("добавление товара",{type:"wait"});
|
||||||
if(gid != null){
|
if(gid != null){
|
||||||
if(name!=""){
|
if(name!=""){
|
||||||
$.post( "/admin/objects/new", { cost:cost,name:name,img:img,desc:description,height:height,width:width,gid:gid})
|
$.post( "/admin/objects/new", { cost:cost,name:name,img:img,height:height,width:width,gid:gid,colors:colors})
|
||||||
.done(function( res ) {
|
.done(function( res ) {
|
||||||
// if(res["out"] == "good"){
|
// if(res["out"] == "good"){
|
||||||
// console.log(res["body"]);
|
// console.log(res["body"]);
|
||||||
// }
|
// }
|
||||||
|
msg_del(wait_msg.id);
|
||||||
callback(res);
|
callback(res);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
else{
|
||||||
|
msg("название не должно быть пустым",{type:"warning"})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
alert("группа не выбранна")
|
msg("группа не выбранна",{type:"warning"})
|
||||||
let res = {out:"bad"}
|
|
||||||
callback(res);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function create_obj(){
|
function create_obj(){
|
||||||
|
let gid = gids.at(-1);
|
||||||
let name = document.getElementById("nobj_name").value;
|
let name = document.getElementById("nobj_name").value;
|
||||||
let description = document.getElementById("nobj_description").value;
|
|
||||||
let height = document.getElementById("obj_height").value;
|
let height = document.getElementById("obj_height").value;
|
||||||
let width = document.getElementById("obj_width").value;
|
let width = document.getElementById("obj_width").value;
|
||||||
var img = document.querySelector('#img_prev').src;
|
var img = document.querySelector('#img_prev').src;
|
||||||
var cost = document.getElementById("obj_cost").value;
|
var cost = document.getElementById("obj_cost").value;
|
||||||
|
var colors = document.getElementById("obj_color_check").checked;
|
||||||
name = name.replaceAll(" ","$");
|
name = name.replaceAll(" ","$");
|
||||||
if(name != ""){
|
if(gid != null){
|
||||||
if (img != "http://n0rsrv2:3002/admin"){
|
if(name != ""){
|
||||||
document.getElementById("obj_resp").innerHTML = "добавление товара";
|
if (img != "/img/placeholder.png"){
|
||||||
new_obj(cost,name,img,height,width,description,(res)=>{
|
new_obj(cost,name,img,height,width,gid,colors,(res)=>{
|
||||||
if(res["out"] == "bad" && res["err"] == "name"){
|
if(res["out"] == "bad" && res["err"] == "name"){
|
||||||
document.getElementById("obj_resp").innerHTML = "товар уже существует";
|
msg("товар уже существует",{type:"warning"});
|
||||||
}
|
}
|
||||||
else if (res["out"] == "bad" ){
|
else if (res["out"] == "bad" ){
|
||||||
document.getElementById("obj_resp").innerHTML = "ошибка при добавлении товара";
|
msg("ошибка при добавлении товара",{type:"warning"});
|
||||||
}
|
}
|
||||||
else if(res["out"] == "good"){
|
else if(res["out"] == "good"){
|
||||||
document.getElementById("obj_resp").innerHTML = "товар добавлен";
|
msg("товар добавлен");
|
||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
edit_get_objs();
|
edit_get_objs();
|
||||||
},1000)
|
},5000)
|
||||||
}
|
}
|
||||||
setTimeout(()=>{
|
});
|
||||||
document.getElementById("obj_resp").innerHTML = "";
|
}
|
||||||
},3000)
|
else{
|
||||||
});
|
msg("картинка не выбрана",{type:"warning"})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
document.getElementById("obj_resp").innerHTML = "картинка не выбрана";
|
msg("название не должно быть пустым",{type:"warning"})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
else{
|
||||||
|
msg("группа не выбранна",{type:"warning"})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
|
@ -27,15 +27,15 @@
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<div style="display: flex;justify-content: space-between;">
|
<h1>Изменение объектов</h1>
|
||||||
<h1>изменение объектов</h1>
|
|
||||||
<div id="find_obj_btns">
|
|
||||||
<button onclick="edit_get_objs(true)">найти по имени</button>
|
|
||||||
<button onclick='document.getElementById("objs_in_group").innerHTML = "";'>очистить</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
<div>
|
||||||
<div id="objs_in_group"></div>
|
<div id="objs_in_group" style="max-height: 20vh;height: 20vh;"></div>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex;justify-content: space-between;float: right;">
|
||||||
|
<div id="find_obj_btns">
|
||||||
|
<button onclick="edit_get_objs(true)" class="btn_blue">найти по имени</button>
|
||||||
|
<button onclick='gids = [];edit_get_objs();' class="btn_blue">очистить</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
@ -46,18 +46,18 @@
|
||||||
function set_edit(id){
|
function set_edit(id){
|
||||||
let menu = document.getElementById(`object_${id}`);
|
let menu = document.getElementById(`object_${id}`);
|
||||||
set_obj_edit_params(menu.getAttribute("src"),
|
set_obj_edit_params(menu.getAttribute("src"),
|
||||||
menu.getAttribute("name").split("/")[0],
|
menu.getAttribute("name").split("~")[0],
|
||||||
menu.getAttribute("description"),
|
|
||||||
menu.getAttribute("height"),
|
menu.getAttribute("height"),
|
||||||
menu.getAttribute("width"),
|
menu.getAttribute("width"),
|
||||||
menu.getAttribute("cost"),
|
menu.getAttribute("cost"),
|
||||||
menu.getAttribute("gid"),
|
menu.getAttribute("gid"),
|
||||||
|
menu.getAttribute("colors"),
|
||||||
menu.getAttribute("obj_id"));
|
menu.getAttribute("obj_id"));
|
||||||
}
|
}
|
||||||
|
|
||||||
function edit_get_objs(by_name){
|
function edit_get_objs(by_name = false){
|
||||||
document.getElementById("objs_in_group").innerHTML = "";
|
document.getElementById("objs_in_group").innerHTML = "";
|
||||||
set_obj_edit_params();
|
if (obj_edit_type == "edit") set_obj_edit_params();
|
||||||
edit_load_objs((data)=>{
|
edit_load_objs((data)=>{
|
||||||
data.forEach(value => {
|
data.forEach(value => {
|
||||||
// console.log(value);
|
// console.log(value);
|
||||||
|
@ -80,15 +80,19 @@
|
||||||
edit_get_objs();
|
edit_get_objs();
|
||||||
}
|
}
|
||||||
hide_menus();
|
hide_menus();
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function obj_del(id){
|
function obj_del(id){
|
||||||
// let select = document.getElementById("group_select");
|
// let select = document.getElementById("group_select");
|
||||||
let menu = document.getElementById(`object_${id}`);
|
let menu = document.getElementById(`object_${id}`);
|
||||||
if (confirm(`вы точно хотите удалить ${menu.getAttribute("name").split("/")[0]}?`)){
|
if (confirm(`вы точно хотите удалить ${menu.getAttribute("name").split("~")[0]}?`)){
|
||||||
|
let wait_msg = msg("удаление товара",{type:"wait"});
|
||||||
$.post( "/admin/objects/delete", { id:id,})
|
$.post( "/admin/objects/delete", { id:id,})
|
||||||
.done(function( res ) {
|
.done(function( res ) {
|
||||||
if(res["out"] == "good"){
|
if(res["out"] == "good"){
|
||||||
|
msg_del(wait_msg.id);
|
||||||
|
msg("товара удалён");
|
||||||
edit_get_objs();
|
edit_get_objs();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -98,58 +102,64 @@
|
||||||
function save_edited_obj(id){
|
function save_edited_obj(id){
|
||||||
let gid = gids[0];
|
let gid = gids[0];
|
||||||
let menu = document.getElementById(`object_${id}`);
|
let menu = document.getElementById(`object_${id}`);
|
||||||
let attributes = ["name","description","img","height","width","cost"];
|
let attributes = ["name","img","height","width","cost","colors"];
|
||||||
let cur_atts = {
|
let cur_atts = {
|
||||||
name : document.getElementById("nobj_name").value,
|
name : document.getElementById("nobj_name").value,
|
||||||
description : document.getElementById("nobj_description").value,
|
|
||||||
height : document.getElementById("obj_height").value,
|
height : document.getElementById("obj_height").value,
|
||||||
width : document.getElementById("obj_width").value,
|
width : document.getElementById("obj_width").value,
|
||||||
img : document.querySelector('#img_prev').src,
|
img : document.getElementById('img_prev').src,
|
||||||
cost : document.getElementById("obj_cost").value
|
cost : document.getElementById("obj_cost").value,
|
||||||
|
colors : String(document.getElementById("obj_color_check").checked)
|
||||||
}
|
}
|
||||||
let changes = {}
|
let changes = {}
|
||||||
attributes.forEach(element => {
|
attributes.forEach(element => {
|
||||||
// console.log(cur_atts[element],menu.getAttribute(`obj_${element}`));
|
|
||||||
if(element != attributes.at(-1)){
|
if(element != attributes.at(-1)){
|
||||||
check_change(element);
|
check_change(element);
|
||||||
// console.log(element);
|
// console.log(element);
|
||||||
}
|
}
|
||||||
else{
|
else if (element == attributes.at(-1)){
|
||||||
check_change(element);
|
check_change(element);
|
||||||
// console.log(changes);
|
// console.log(changes);
|
||||||
if(Object.keys(changes).length > 0){
|
if(Object.keys(changes).length > 0){
|
||||||
make_obj_save(changes);
|
make_obj_save(changes);
|
||||||
// console.log(changes);
|
// console.log(changes);
|
||||||
}
|
}
|
||||||
|
else{
|
||||||
|
msg("нет изменений")
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
function check_change(element){
|
function check_change(element){
|
||||||
if(element == "name" && cur_atts[element] != menu.getAttribute(`${element}`).split("/")[0]){
|
// console.log(changes[element],cur_atts[element]);
|
||||||
|
if(element == "name" && cur_atts[element] != menu.getAttribute(`${element}`).split("~")[0]){
|
||||||
changes[element] = cur_atts[element];
|
changes[element] = cur_atts[element];
|
||||||
}
|
}
|
||||||
else if (element != "name" && cur_atts[element] != menu.getAttribute(`${element}`)){
|
else if (element == "img" && cur_atts[element] != menu.getAttribute(`src`)){
|
||||||
|
changes[element] = cur_atts[element];
|
||||||
|
}
|
||||||
|
else if ((element != "name" && element != "img") && cur_atts[element] != menu.getAttribute(`${element}`)){
|
||||||
changes[element] = cur_atts[element];
|
changes[element] = cur_atts[element];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function make_obj_save(){
|
function make_obj_save(){
|
||||||
load_group(gid,(group_db)=>{
|
load_group(gid,(group_db)=>{
|
||||||
if(changes["name"]) changes["name"] = (changes["name"]+"/g/"+group_db["name"].replaceAll(" ","$"));
|
if(changes["name"]) changes["name"] = (changes["name"]+"~g~"+group_db["name"]).replaceAll(" ","$");
|
||||||
document.getElementById("obj_resp").innerHTML = "сохранение товара";
|
let wait_msg = msg("сохранение товара",{type:"wait"});
|
||||||
$.post( "/admin/objects/edit", { id:menu.getAttribute(`obj_id`),changes:JSON.stringify(changes),gid:gid})
|
$.post( "/admin/objects/edit", { id:menu.getAttribute(`obj_id`),changes:JSON.stringify(changes),gid:gid})
|
||||||
.done(function( res ) {
|
.done(function( res ) {
|
||||||
// console.log(res);
|
// console.log(res);
|
||||||
|
msg_del(wait_msg.id);
|
||||||
if(res["out"] == "good"){
|
if(res["out"] == "good"){
|
||||||
document.getElementById("obj_resp").innerHTML = "товар сохранён";
|
if(res["name_err"]){
|
||||||
setTimeout(()=>{
|
msg("название товара не было изменино поскольку оно занято",{type:"warning"})
|
||||||
edit_get_objs();
|
}
|
||||||
set_obj_edit_params();
|
else{
|
||||||
if(res["name_err"]){
|
msg("товар сохранён");
|
||||||
document.getElementById("obj_resp").innerHTML = ("название товара не было изменино поскольку оно занято");
|
setTimeout(()=>{
|
||||||
}
|
edit_get_objs();
|
||||||
},1000)
|
set_obj_edit_params();
|
||||||
setTimeout(()=>{
|
},1500)
|
||||||
document.getElementById("obj_resp").innerHTML = "";
|
}
|
||||||
},3000)
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
@ -202,20 +212,21 @@
|
||||||
let obj = document.createElement('div');
|
let obj = document.createElement('div');
|
||||||
let name_text = document.createElement('div');
|
let name_text = document.createElement('div');
|
||||||
let img_elm = document.createElement('img');
|
let img_elm = document.createElement('img');
|
||||||
obj.title = `название:${value["name"].split("/")[0].replaceAll("$"," ")}\nцена:${value["cost"]}\nширина:${value["width"]}\nвысота${value["height"]}\nописание:${value["description"]}`;
|
obj.title = `название:${value["name"].split("~")[0].replaceAll("$"," ")}\nцена:${value["cost"]}\nширина:${value["width"]}\nвысота${value["height"]}\nименение цвета:${Boolean(value["colors"])}\nартикуль:${value["name"]}`;
|
||||||
obj.id = `object_${value["id"]}`;
|
obj.id = `object_${value["id"]}`;
|
||||||
obj.setAttribute("onclick",`set_edit(${value["id"]})`)
|
obj.setAttribute("onclick",`set_edit(${value["id"]})`)
|
||||||
obj.classList.add(value["name"]);
|
obj.classList.add(value["name"]);
|
||||||
obj.classList.add("object");
|
obj.classList.add("object");
|
||||||
obj.setAttribute("name",value["name"].split("/")[0].replaceAll("$"," "))
|
obj.setAttribute("name",value["name"].split("~")[0].replaceAll("$"," "))
|
||||||
obj.setAttribute("description",value["description"])
|
|
||||||
obj.setAttribute("src",img)
|
obj.setAttribute("src",img)
|
||||||
obj.setAttribute("height",value["height"])
|
obj.setAttribute("height",value["height"])
|
||||||
obj.setAttribute("width",value["width"])
|
obj.setAttribute("width",value["width"])
|
||||||
obj.setAttribute("obj_id",value["id"])
|
obj.setAttribute("obj_id",value["id"])
|
||||||
obj.setAttribute("cost",value["cost"])
|
obj.setAttribute("cost",value["cost"])
|
||||||
|
obj.setAttribute("colors",Boolean(value["colors"]))
|
||||||
obj.setAttribute("gid",value["gid"])
|
obj.setAttribute("gid",value["gid"])
|
||||||
name_text.innerText = value["name"].split("/")[0].replaceAll("$"," ");
|
// name_text.innerText = value["name"].split("~")[0].replaceAll("$"," ");
|
||||||
img_elm.src = img;
|
img_elm.src = img;
|
||||||
obj.append(img_elm)
|
obj.append(img_elm)
|
||||||
obj.append(name_text)
|
obj.append(name_text)
|
||||||
|
|
|
@ -4,25 +4,33 @@
|
||||||
/* height: 5vh; */
|
/* height: 5vh; */
|
||||||
margin: auto 0px;
|
margin: auto 0px;
|
||||||
}
|
}
|
||||||
#obj_group {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.obj_group{
|
.obj_group{
|
||||||
display: flex;
|
display: flex;
|
||||||
|
margin-top: 0.5vw;
|
||||||
|
}
|
||||||
|
.obj_group label{
|
||||||
|
width: 100%;
|
||||||
|
padding-inline: 0.3vw;
|
||||||
|
}
|
||||||
|
#obj_group{
|
||||||
|
margin-bottom: 5vh;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<div id="obj_group">
|
<div id="obj_group">
|
||||||
|
<h1>Разделы и группы</h1>
|
||||||
<div style="display: flex;justify-content: space-between;">
|
<div style="display: flex;justify-content: space-between;">
|
||||||
<div style="display: block;">
|
<div style="display: block;">
|
||||||
<h1>группы товаров</h1>
|
|
||||||
<button onclick="create_new_part()">доб. раздел</button>
|
|
||||||
</div>
|
</div>
|
||||||
<style>
|
<style>
|
||||||
.group_drop{
|
.group_drop{
|
||||||
width: 15vw;
|
/* width: 15vw; */
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
min-width: 15vw;
|
min-width: 15vw;
|
||||||
}
|
}
|
||||||
|
.part_div{
|
||||||
|
|
||||||
|
margin-left: 3vw;
|
||||||
|
}
|
||||||
.group_drop *{
|
.group_drop *{
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
@ -33,7 +41,7 @@
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<div id="obj_parts" style="display: flex;justify-content: space-between; overflow: scroll;min-width: 50vw;">
|
<div id="obj_parts" style="display: flex;justify-content: space-between; overflow: scroll;min-width: 50vw;max-width: 70vw;">
|
||||||
</div>
|
</div>
|
||||||
<style>
|
<style>
|
||||||
.group_inp{
|
.group_inp{
|
||||||
|
@ -47,6 +55,8 @@
|
||||||
<ul id="group" class="cmenu"></ul>
|
<ul id="group" class="cmenu"></ul>
|
||||||
<!-- <select name="" id="group_select" onchange="edit_get_objs();"></select>
|
<!-- <select name="" id="group_select" onchange="edit_get_objs();"></select>
|
||||||
<select name="" id="part_select"></select> -->
|
<select name="" id="part_select"></select> -->
|
||||||
|
<button onclick="create_new_part()" class="btn_blue">Добавить раздел</button>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -54,8 +64,29 @@
|
||||||
// load_groups();
|
// load_groups();
|
||||||
function delete_group(gid,pid) {
|
function delete_group(gid,pid) {
|
||||||
let name = document.getElementById("obj_group_"+gid).getAttribute("group_name");
|
let name = document.getElementById("obj_group_"+gid).getAttribute("group_name");
|
||||||
if(confirm(`вы уверены вы хотите удалить группу ${name}`) == true){
|
msg(`вы уверены вы хотите удалить группу ${name}`,{type:"ask",res:(out)=>{
|
||||||
$.post( "/admin/groups/delete", { gid:gid,pid:pid})
|
if (out == true){
|
||||||
|
$.post( "/admin/groups/delete", { gid:gid,pid:pid})
|
||||||
|
.done(function( res ) {
|
||||||
|
if(res["out"] == "good"){
|
||||||
|
// console.log(res["body"]);
|
||||||
|
// load_groups();
|
||||||
|
edit_get_objs();
|
||||||
|
hide_menus();
|
||||||
|
setTimeout(()=>{
|
||||||
|
parts_load();
|
||||||
|
msg(`группа ${name} удалена`)
|
||||||
|
},500)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}})
|
||||||
|
}
|
||||||
|
function delete_part(pid) {
|
||||||
|
let name = document.getElementById("group_drop-"+pid).innerText;
|
||||||
|
msg(`вы уверены вы хотите удалить раздел ${name}`,{type:"ask",res:(out)=>{
|
||||||
|
if(out == true){
|
||||||
|
$.post( "/admin/parts/delete", {pid:pid})
|
||||||
.done(function( res ) {
|
.done(function( res ) {
|
||||||
if(res["out"] == "good"){
|
if(res["out"] == "good"){
|
||||||
// console.log(res["body"]);
|
// console.log(res["body"]);
|
||||||
|
@ -64,11 +95,12 @@
|
||||||
hide_menus();
|
hide_menus();
|
||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
parts_load();
|
parts_load();
|
||||||
alert(`группа ${name} удалена`)
|
msg(`раздел ${name} удалён`)
|
||||||
},500)
|
},500)
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
}})
|
||||||
}
|
}
|
||||||
function create_new_group(pid) {
|
function create_new_group(pid) {
|
||||||
let group_name = ask("название группы");
|
let group_name = ask("название группы");
|
||||||
|
@ -82,7 +114,7 @@
|
||||||
hide_menus();
|
hide_menus();
|
||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
parts_load();
|
parts_load();
|
||||||
alert(`группа ${group_name.replaceAll(" ","$")} создана`)
|
msg(`группа ${group_name.replaceAll(" ","$")} создана`)
|
||||||
},500)
|
},500)
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -100,7 +132,7 @@
|
||||||
hide_menus();
|
hide_menus();
|
||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
parts_load();
|
parts_load();
|
||||||
alert(`раздел ${part_name.replaceAll(" ","$")} создан`)
|
msg(`раздел ${part_name.replaceAll(" ","$")} создан`)
|
||||||
},500)
|
},500)
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -115,6 +147,7 @@
|
||||||
let part = document.createElement("button")
|
let part = document.createElement("button")
|
||||||
let part_text = document.createElement("div")
|
let part_text = document.createElement("div")
|
||||||
let part_drop = document.createElement("img")
|
let part_drop = document.createElement("img")
|
||||||
|
let part_div = document.createElement("div");
|
||||||
|
|
||||||
part_drop.src = "/img/drop.png";
|
part_drop.src = "/img/drop.png";
|
||||||
part_drop.alt = "\/";
|
part_drop.alt = "\/";
|
||||||
|
@ -127,11 +160,23 @@
|
||||||
part.setAttribute("groups",`${value["groups"]}`)
|
part.setAttribute("groups",`${value["groups"]}`)
|
||||||
part.setAttribute("count",`${value["count"]}`)
|
part.setAttribute("count",`${value["count"]}`)
|
||||||
part.setAttribute("pid",`${value["id"]}`)
|
part.setAttribute("pid",`${value["id"]}`)
|
||||||
|
let part_del = document.createElement("button");
|
||||||
|
part_del.id = `del_part-${value["id"]}`;
|
||||||
|
part_del.setAttribute("onclick",`delete_part(${value["id"]})`);
|
||||||
|
part_del.innerHTML = "удалить раздел";
|
||||||
|
part_del.classList.add("btn_blue");
|
||||||
|
part_del.style.minWidth = "15vw";
|
||||||
|
|
||||||
part.append(part_text);
|
part.append(part_text);
|
||||||
part.append(part_drop);
|
part.append(part_drop);
|
||||||
|
|
||||||
parts.append(part);
|
part_div.append(part_del);
|
||||||
|
part_div.append(part);
|
||||||
|
part_div.id = `part_div-${value["id"]}`;
|
||||||
|
part_div.classList.add("part_div")
|
||||||
|
|
||||||
|
|
||||||
|
parts.append(part_div);
|
||||||
console.log(value);
|
console.log(value);
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
|
@ -8,8 +8,9 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<h1 style="text-align: center;">пользователь</h1>
|
<!-- <h1 style="text-align: center;">пользователь</h1> -->
|
||||||
<%- include('../admin/users/user_reg.ejs') %>
|
<%- include('../admin/users/user_reg.ejs') %>
|
||||||
|
<br>
|
||||||
<%- include('../admin/users/user_edit.ejs') %>
|
<%- include('../admin/users/user_edit.ejs') %>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
|
@ -9,7 +9,7 @@
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin: 0px auto;
|
margin: 0px auto;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
background-color:cornsilk;
|
background-color:white;
|
||||||
}
|
}
|
||||||
#users_section li div:not(#first_user div){
|
#users_section li div:not(#first_user div){
|
||||||
/* margin: auto; */
|
/* margin: auto; */
|
||||||
|
@ -18,7 +18,7 @@
|
||||||
}
|
}
|
||||||
#first_user div{
|
#first_user div{
|
||||||
/* text-align: center; */
|
/* text-align: center; */
|
||||||
width: 100px;
|
width: 200px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
#users_section ul{
|
#users_section ul{
|
||||||
|
@ -32,26 +32,27 @@
|
||||||
margin: auto 0px;
|
margin: auto 0px;
|
||||||
/* height: 25px; */
|
/* height: 25px; */
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<div style="display: flex;justify-content: space-between;">
|
<div style="display: flex;justify-content: space-between;">
|
||||||
<h1>пользователи</h1>
|
<h1>пользователи</h1>
|
||||||
<div id="find_user_btns">
|
<div id="find_user_btns">
|
||||||
<button onclick="load_users_data(users_from,true);">найти по имени</button>
|
<button onclick="load_users_data(users_from,true);" class="btn_blue">Найти по имени</button>
|
||||||
<button onclick="load_users_data(users_from)">очистить</button>
|
<button onclick="load_users_data(users_from)" class="btn_blue">Очистить</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<section id="users_section">
|
<section id="users_section">
|
||||||
<div style="display: flex;justify-content: space-between;margin: auto;">
|
<div style="height: 430px;">
|
||||||
<div style="display: flex;"><h1>всего: </h1> <h1 id="users_count">0</h1></div>
|
<li id="first_user"><div>Логин</div><div>Превилегии</div><div>Функции</div></li>
|
||||||
<div style="display: flex;margin: auto 0px;">с <div id="users_from">0</div> по <div id="users_to">10</div></div>
|
|
||||||
<div style="margin: auto 0px;"><button onclick="if(users_from-load_interval>=0){users_from-=load_interval;load_users_data(users_from);}">< 10 назад</button></div>
|
|
||||||
<div style="margin: auto 0px;"><button onclick="users_from+=load_interval;load_users_data(users_from);">даллее ></button></div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<li id="first_user"><div>логин</div><div>превилегии</div><div>функции</div></li>
|
|
||||||
<ul id="user_list"></ul>
|
<ul id="user_list"></ul>
|
||||||
</div>
|
</div>
|
||||||
|
<div style="display: flex;justify-content: space-between;margin: auto;">
|
||||||
|
<div style="display: flex;"><h1>Всего: </h1> <h1 id="users_count">0</h1></div>
|
||||||
|
<div style="display: flex;margin: auto 0px;">с <div id="users_from">0</div> по <div id="users_to">10</div></div>
|
||||||
|
<div style="margin: auto 0px;"><button onclick="if(users_from-load_interval>=0){users_from-=load_interval;load_users_data(users_from);}" class="btn_gray">< 10 назад</button></div>
|
||||||
|
<div style="margin: auto 0px;"><button onclick="users_from+=load_interval;load_users_data(users_from);" class="btn_gray">даллее ></button></div>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
@ -125,7 +126,7 @@
|
||||||
document.getElementById(`${key}_${id}`).innerText = value;
|
document.getElementById(`${key}_${id}`).innerText = value;
|
||||||
}
|
}
|
||||||
if(res["out"] == "bad"){
|
if(res["out"] == "bad"){
|
||||||
alert("this name is in use")
|
msg("пользователь с таким иминем уже есть",{type:"warning"})
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,28 +2,28 @@
|
||||||
.user_reg_form{
|
.user_reg_form{
|
||||||
margin: auto;
|
margin: auto;
|
||||||
/* display: flex; */
|
/* display: flex; */
|
||||||
text-align: center;
|
/* text-align: center; */
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<h1>регистрация пользователя</h1>
|
<h1>Регистрация пользователя</h1>
|
||||||
<form action="#" class="user_reg_form">
|
<form action="#" class="user_reg_form">
|
||||||
<div>
|
<div style="display: flex;justify-content: space-between;">
|
||||||
<input type="text" id="login" name="login" value="" placeholder="логин">
|
<input type="password" id="pass" name="pass" value="" placeholder="Пароль" class="btn_white" style="text-align: center;">
|
||||||
<input type="password" id="pass" name="pass" value="" placeholder="пароль">
|
<input type="text" id="login" name="login" value="" placeholder="Логин" class="btn_white" style="text-align: center; padding-inline: 5vw;">
|
||||||
<input type="submit" onclick='reg();' value="зарегистрировать">
|
<input type="submit" onclick='reg();' value="Зарегистрировать" class="btn_blue">
|
||||||
|
<div>
|
||||||
|
<label for="admin_check">Админ. привелегии</label>
|
||||||
|
<input type="checkbox" name="admin" value='false' id="admin_check" onchange="admin_ch()">
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div id="right_checks" style="display: none;justify-content: space-evenly;">
|
||||||
<label for="admin_check">админ. привелегии</label>
|
<div>
|
||||||
<input type="checkbox" name="admin" value='false' id="admin_check" onchange="admin_ch()">
|
<input type="checkbox" name="admin" value='false' id="admin_user_check" onchange="right_calc()">
|
||||||
<div id="right_checks" style="display: none;justify-content: space-evenly;">
|
<label for="admin_user_check">Право на изменение обьектов</label>
|
||||||
<div>
|
</div>
|
||||||
<input type="checkbox" name="admin" value='false' id="admin_user_check" onchange="right_calc()">
|
<div>
|
||||||
<label for="admin_user_check">право на изменение обьектов</label>
|
<input type="checkbox" name="admin" value='false' id="admin_obj_check" onchange="right_calc()">
|
||||||
</div>
|
<label for="admin_obj_check">Право на изменение пользователей</label>
|
||||||
<div>
|
|
||||||
<input type="checkbox" name="admin" value='false' id="admin_obj_check" onchange="right_calc()">
|
|
||||||
<label for="admin_obj_check">право на изменение пользователей</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="reg_response"></div>
|
<div id="reg_response"></div>
|
||||||
|
|
|
@ -139,6 +139,9 @@
|
||||||
<a href=""><img src="/img/ok.svg" alt=""></a>
|
<a href=""><img src="/img/ok.svg" alt=""></a>
|
||||||
<a href=""><img src="/img/telegram.svg" alt=""></a>
|
<a href=""><img src="/img/telegram.svg" alt=""></a>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="tpanel">
|
||||||
|
<button onclick='logout();'>Выход</button>
|
||||||
|
</div>
|
||||||
</div> <!-- <div><button onclick="logout();">logout</button></div> -->
|
</div> <!-- <div><button onclick="logout();">logout</button></div> -->
|
||||||
</header>
|
</header>
|
||||||
<div id="user_menu" class="cmenu"></div>
|
<div id="user_menu" class="cmenu"></div>
|
||||||
|
@ -160,22 +163,22 @@
|
||||||
let menu = document.getElementById("top_panel_center");
|
let menu = document.getElementById("top_panel_center");
|
||||||
if (res["admin"] == true){
|
if (res["admin"] == true){
|
||||||
menu.innerHTML += `<button id="page_btn_admin" onclick='goto("/admin")'>Админ. панель</button><br>`;
|
menu.innerHTML += `<button id="page_btn_admin" onclick='goto("/admin")'>Админ. панель</button><br>`;
|
||||||
|
switch (document.URL.split("/").at(-1)) {
|
||||||
|
case ("admin"):document.getElementById("page_btn_admin").style.border = "1px solid black";break;
|
||||||
|
case ("objects"):document.getElementById("page_btn_admin").style.border = "1px solid black";break;
|
||||||
|
case ("users"):document.getElementById("page_btn_admin").style.border = "1px solid black";break;
|
||||||
|
default:break;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
// menu.innerHTML += "<button onclick='logout();'>выйти</button><br>";
|
switch (document.URL.split("/").at(-1)) {
|
||||||
document.URL.split("puzzle.n0r.su/").at(-1)
|
|
||||||
switch (document.URL.split("puzzle.n0r.su/").at(-1)) {
|
|
||||||
case ("main"):
|
case ("main"):
|
||||||
document.getElementById("page_btn_main").style.border = "1px solid black";
|
document.getElementById("page_btn_main").style.border = "1px solid black";
|
||||||
break;
|
break;
|
||||||
case ("admin"):document.getElementById("page_btn_admin").style.border = "1px solid black";break;
|
default:break;
|
||||||
case ("admin/objects"):document.getElementById("page_btn_admin").style.border = "1px solid black";break;
|
|
||||||
case ("admin/users"):document.getElementById("page_btn_admin").style.border = "1px solid black";break;
|
|
||||||
default:
|
|
||||||
break;
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
console.log("asd");
|
// console.log("asd");
|
||||||
|
|
||||||
// onscroll = (e)=>{
|
// onscroll = (e)=>{
|
||||||
// hide_menus();
|
// hide_menus();
|
||||||
|
@ -230,27 +233,6 @@
|
||||||
open_menu();
|
open_menu();
|
||||||
|
|
||||||
}
|
}
|
||||||
// else if(e.target.id == "object_menu"){
|
|
||||||
// hide_menus();
|
|
||||||
// let menu = document.getElementById("object_edit_menu");
|
|
||||||
// let obj = e.target;
|
|
||||||
// menu.setAttribute("obj_img",obj.getAttribute("src"));
|
|
||||||
// menu.setAttribute("obj_name",obj.getAttribute("name"));
|
|
||||||
// menu.setAttribute("obj_description",obj.getAttribute("description"));
|
|
||||||
// menu.setAttribute("obj_height",obj.getAttribute("height"));
|
|
||||||
// menu.setAttribute("obj_width",obj.getAttribute("width"));
|
|
||||||
// menu.setAttribute("obj_id",obj.getAttribute("obj_id"));
|
|
||||||
// menu.setAttribute("obj_cost",obj.getAttribute("cost"))
|
|
||||||
// menu.setAttribute("obj_gid",obj.getAttribute("gid"))
|
|
||||||
// menu.style.display = 'block';
|
|
||||||
// // menu.style = `top:${e.target.getBoundingClientRect().top+27}px;left:${e.target.getBoundingClientRect().left-13}px`;
|
|
||||||
// menu.style = `top:${e.target.getBoundingClientRect().top + 40}px;left:${e.target.getBoundingClientRect().left - 5}px`;
|
|
||||||
// // menu.onmouseleave = () => menu.style.display = 'none';
|
|
||||||
// // menu.innerHTML = "<p>Option1</p><p>Option2</p><p>Option3</p><p>Option4</p>"
|
|
||||||
// // document.body.appendChild(menu)
|
|
||||||
// open_menu();
|
|
||||||
|
|
||||||
// }
|
|
||||||
else if(e.target.id == "proj_cost"){
|
else if(e.target.id == "proj_cost"){
|
||||||
hide_menus();
|
hide_menus();
|
||||||
document.getElementById("cost_list").style = `margin-top:2.5vw;left:${e.target.getBoundingClientRect().left}px`;
|
document.getElementById("cost_list").style = `margin-top:2.5vw;left:${e.target.getBoundingClientRect().left}px`;
|
||||||
|
@ -262,20 +244,22 @@
|
||||||
document.getElementById("group").innerHTML = "";
|
document.getElementById("group").innerHTML = "";
|
||||||
|
|
||||||
// console.log(e.target.getAttribute("groups").split(","));
|
// console.log(e.target.getAttribute("groups").split(","));
|
||||||
document.getElementById("group").style = `margin-top:2.9vw;left:${e.target.getBoundingClientRect().left}px;width: 14vw;padding: 0.45vw;display:block;padding-bottom: 0.7vw;`;
|
|
||||||
console.log("group");
|
console.log("group");
|
||||||
open_menu();
|
open_menu();
|
||||||
|
|
||||||
if (document.URL == "https://puzzle.n0r.su/admin/objects"){
|
if (document.URL.split("/").at(-1) == "objects" && document.URL.split("/").at(-2) == "admin"){
|
||||||
|
document.getElementById("group").style = `margin-top:4vw;left:${e.target.getBoundingClientRect().left}px;width: 14vw;padding: 0.45vw;display:block;padding-bottom: 0.7vw;`;
|
||||||
if(e.target.getAttribute("count") != 0)load_groups(()=>{},e.target.getAttribute("groups").split(","),true)
|
if(e.target.getAttribute("count") != 0)load_groups(()=>{},e.target.getAttribute("groups").split(","),true)
|
||||||
let groups = document.getElementById("group");
|
let groups = document.getElementById("group");
|
||||||
let new_grp_btn = document.createElement("button");
|
let new_grp_btn = document.createElement("button");
|
||||||
new_grp_btn.setAttribute("onclick",`create_new_group(${e.target.getAttribute("pid")})`);
|
new_grp_btn.setAttribute("onclick",`create_new_group(${e.target.getAttribute("pid")})`);
|
||||||
new_grp_btn.innerText = "доб. группу";
|
new_grp_btn.innerText = "Добавить группу";
|
||||||
|
new_grp_btn.classList.add("btn_blue");
|
||||||
new_grp_btn.style.width = "14vw";
|
new_grp_btn.style.width = "14vw";
|
||||||
groups.append(new_grp_btn)
|
groups.append(new_grp_btn)
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
|
document.getElementById("group").style = `margin-top:2.5vw;left:${e.target.getBoundingClientRect().left}px;width: 14vw;padding: 0.45vw;display:block;padding-bottom: 0.7vw;`;
|
||||||
if(e.target.getAttribute("count") != 0)load_groups(()=>{},e.target.getAttribute("groups").split(","))
|
if(e.target.getAttribute("count") != 0)load_groups(()=>{},e.target.getAttribute("groups").split(","))
|
||||||
}
|
}
|
||||||
// hide_menus();
|
// hide_menus();
|
||||||
|
|
|
@ -1,6 +1,9 @@
|
||||||
<script>
|
<script>
|
||||||
// document.getElementById("load_div").style.height = `${document.getElementsByTagName("body")[0].scrollHeight}px`;
|
// document.getElementById("load_div").style.height = `${document.getElementsByTagName("body")[0].scrollHeight}px`;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<%- include('./message.ejs') %>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
#load_div{
|
#load_div{
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
|
|
|
@ -150,7 +150,7 @@
|
||||||
if (res["out"] == "bad"){
|
if (res["out"] == "bad"){
|
||||||
console.log(res["err"]);
|
console.log(res["err"]);
|
||||||
if (res["err"] == "user" || res["err"] == "pass"){
|
if (res["err"] == "user" || res["err"] == "pass"){
|
||||||
alert("wrong password or login")
|
msg("wrong password or login",{type:"warning"})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
|
|
|
@ -44,7 +44,7 @@
|
||||||
|
|
||||||
<section class="main">
|
<section class="main">
|
||||||
<div id="projs_div">
|
<div id="projs_div">
|
||||||
<button onclick="new_proj()" class="new_proj"><img class="p_img" src="img/new_proj.png" alt=""><h1>Новый проект</h1></button>
|
<button onclick="new_proj()" class="new_proj"><img class="p_img" src="/img/new_proj.png" alt=""><h1>Новый проект</h1></button>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
@ -64,7 +64,7 @@
|
||||||
let name = ask("please enter project name");
|
let name = ask("please enter project name");
|
||||||
let objs = { height:"2",width:"4"};
|
let objs = { height:"2",width:"4"};
|
||||||
if(name != null && name!= "" && name!=" " && typeof name != "undefined" && name!="undefined"){
|
if(name != null && name!= "" && name!=" " && typeof name != "undefined" && name!="undefined"){
|
||||||
$.post( "/save_proj", {proj:JSON.stringify(objs),name:name,img:"img/img_placeholder.webp"})
|
$.post( "/save_proj", {proj:JSON.stringify(objs),name:name,img:"/img/proj_placeholder.webp"})
|
||||||
.done(function( res ) {
|
.done(function( res ) {
|
||||||
if(res["out"] == "good"){
|
if(res["out"] == "good"){
|
||||||
// console.log(scr)
|
// console.log(scr)
|
||||||
|
|
150
views/message.ejs
Normal file
|
@ -0,0 +1,150 @@
|
||||||
|
<style>
|
||||||
|
#message_div{
|
||||||
|
width: 100vw;
|
||||||
|
height: 90vh;
|
||||||
|
display: block;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 10000;
|
||||||
|
background-color: transparent;
|
||||||
|
transition: background-color 1s;
|
||||||
|
pointer-events: none;
|
||||||
|
top: 10vh;
|
||||||
|
}
|
||||||
|
.message{
|
||||||
|
margin: auto;
|
||||||
|
margin-bottom: 0px;
|
||||||
|
margin-right: 0px;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
min-width: 100px;
|
||||||
|
max-width: 200px;
|
||||||
|
background-color: rgba(255, 255, 255, 0.9);
|
||||||
|
border: 0.2vw rgba(0, 0, 0, 0.2) solid;
|
||||||
|
border-radius: 0.5vw;
|
||||||
|
margin-block: 1vw;
|
||||||
|
text-align: center;
|
||||||
|
pointer-events: all;
|
||||||
|
margin-right: 1vw;
|
||||||
|
font-size: calc(var(--main-font-size)/1.2);
|
||||||
|
padding: 0.5vw;
|
||||||
|
transform: translateX(120%);
|
||||||
|
transition: 300ms;
|
||||||
|
}
|
||||||
|
.yes-ans, .no-ans{
|
||||||
|
background-color: transparent;
|
||||||
|
border: 0px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<div id="message_div"></div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
let msg_int = 0;
|
||||||
|
function msg(text,params = {type:null,time:null,res:null}){
|
||||||
|
params.time = (params.time == null)? 8:params.time;
|
||||||
|
params.type = (params.type == null)? "msg":params.type;
|
||||||
|
msg_int++;
|
||||||
|
params.time = params.time * 700;
|
||||||
|
let msg_div = document.createElement("div");
|
||||||
|
let msg_root = document.getElementById("message_div");
|
||||||
|
msg_div.classList.add("message");
|
||||||
|
msg_div.innerText = text;
|
||||||
|
msg_div.id = `msg_${msg_int}`;
|
||||||
|
msg_root.appendChild(msg_div)
|
||||||
|
// console.log(`msg_${msg_int}`);
|
||||||
|
setTimeout(()=>{
|
||||||
|
msg_div.style.transform = "translateX(0%)";
|
||||||
|
},100)
|
||||||
|
switch (params.type) {
|
||||||
|
case "help":
|
||||||
|
msg_div.style.borderColor = "rgba(255, 255, 0, 0.5)";
|
||||||
|
break;
|
||||||
|
case "ask":
|
||||||
|
msg_div.style.borderColor = "rgba(0, 255, 0, 0.5)";
|
||||||
|
break;
|
||||||
|
case "warning":
|
||||||
|
msg_div.style.borderColor = "rgba(255, 0, 0, 0.5)";
|
||||||
|
break;
|
||||||
|
case "wait":
|
||||||
|
msg_div.style.borderColor = "rgba(0, 0, 255, 0.5)";
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
// console.log(params.type,params.time);
|
||||||
|
|
||||||
|
if (params.type == "ask"){
|
||||||
|
// msg_div.setAttribute("onclick",`msg_del("msg_${msg_int}")`);
|
||||||
|
let yes = document.createElement("button");
|
||||||
|
let no = document.createElement("button");
|
||||||
|
let q_div = document.createElement("div");
|
||||||
|
q_div.style = "display:flex;justify-content: space-between;z-index:20000";
|
||||||
|
yes.innerText = "да";
|
||||||
|
no.innerText = "нет";
|
||||||
|
yes.classList.add("yes-ans")
|
||||||
|
no.classList.add("no-ans")
|
||||||
|
yes.id = `${msg_div.id}-yes`;
|
||||||
|
no.id = `${msg_div.id}-no`;
|
||||||
|
q_div.append(yes)
|
||||||
|
q_div.append(no)
|
||||||
|
msg_div.append(q_div)
|
||||||
|
|
||||||
|
document.getElementById("message_div").style.pointerEvents = "all";
|
||||||
|
document.getElementById("message_div").setAttribute("onclick",`document.getElementById('${msg_div.id}').setAttribute("ans","false")`)
|
||||||
|
|
||||||
|
msg_div.setAttribute("ans","null")
|
||||||
|
yes.setAttribute("onclick",`document.getElementById('${msg_div.id}').setAttribute("ans","true")`)
|
||||||
|
no.setAttribute("onclick",`document.getElementById('${msg_div.id}').setAttribute("ans","false")`)
|
||||||
|
var observer = new MutationObserver(function(mutations) {
|
||||||
|
mutations.forEach(function(mutation) {
|
||||||
|
if (mutation.type = "attributes" && mutation.target.getAttribute("ans") != "null") {
|
||||||
|
console.log(mutation);
|
||||||
|
if(mutation.target.getAttribute("ans") == "true"){
|
||||||
|
params.res(true);fin();
|
||||||
|
}
|
||||||
|
else if (mutation.target.getAttribute("ans") == "false"){
|
||||||
|
params.res(false);fin();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
observer.observe(msg_div, {attributes: true });
|
||||||
|
|
||||||
|
|
||||||
|
function fin(){
|
||||||
|
observer.disconnect();
|
||||||
|
document.getElementById("message_div").style.pointerEvents = "none";
|
||||||
|
if (document.getElementById(msg_div.id) != null){
|
||||||
|
msg_div.style.transform = "translateX(120%)";
|
||||||
|
setTimeout(() => {
|
||||||
|
msg_root.removeChild(msg_div);
|
||||||
|
}, 200);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else if(params.type != "wait" && params.type != "ask"){
|
||||||
|
msg_div.setAttribute("onclick",`msg_del("msg_${msg_int}")`);
|
||||||
|
setTimeout(()=>{
|
||||||
|
if (document.getElementById(msg_div.id) != null){
|
||||||
|
msg_div.style.transform = "translateX(120%)";
|
||||||
|
setTimeout(() => {
|
||||||
|
msg_root.removeChild(msg_div);
|
||||||
|
console.log(params.type);
|
||||||
|
}, 200);
|
||||||
|
}
|
||||||
|
},params.time)
|
||||||
|
}
|
||||||
|
return msg_div;
|
||||||
|
}
|
||||||
|
|
||||||
|
function msg_del(id){
|
||||||
|
let msg_div = document.getElementById(`${id}`);
|
||||||
|
let msg_root = document.getElementById("message_div");
|
||||||
|
msg_div.style.transform = "translateX(120%)";
|
||||||
|
setTimeout(() => {
|
||||||
|
msg_root.removeChild(msg_div);
|
||||||
|
}, 200);
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -35,7 +35,7 @@
|
||||||
width: 400px;
|
width: 400px;
|
||||||
height: 200px;
|
height: 200px;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
background-image: url("/img/bg1red.png");
|
/* background-image: url("/img/bg1red.png"); */
|
||||||
background-size: 200px;
|
background-size: 200px;
|
||||||
background-repeat: repeat;
|
background-repeat: repeat;
|
||||||
background-position: bottom 0px left 0px;
|
background-position: bottom 0px left 0px;
|
||||||
|
@ -107,7 +107,7 @@
|
||||||
margin: auto;
|
margin: auto;
|
||||||
padding-block: 20px;
|
padding-block: 20px;
|
||||||
padding-bottom: 0px;
|
padding-bottom: 0px;
|
||||||
margin-top: 50px;
|
/* margin-top: 50px; */
|
||||||
}
|
}
|
||||||
#group{
|
#group{
|
||||||
display: none;
|
display: none;
|
||||||
|
@ -142,11 +142,11 @@
|
||||||
<label for="wall_width" style="margin: auto;">М.</label>
|
<label for="wall_width" style="margin: auto;">М.</label>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;width: 16vw;justify-content: space-between;">
|
<div style="display: flex;width: 16vw;justify-content: space-between;">
|
||||||
<label for="wall_color" style="margin: auto;">цвет стены</label>
|
<label for="wall_color" style="margin: auto;">Цвет стены</label>
|
||||||
<input type="color" id="wall_color" style="width: 5vw; border-radius: 0.5vw; border: 1px solid gray; min-height: 3.9vw;" value="#FFFFFF" onchange="wall_color_change()">
|
<input type="color" id="wall_color" style="width: 5vw; border-radius: 0.5vw; border: 1px solid gray; min-height: 3.9vw;" value="#FFFFFF" onchange="wall_color_change()">
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;width: 15vw;justify-content: space-between;">
|
<div id="cost_div" style="display: flex;width: 15vw;justify-content: space-between;">
|
||||||
<button id="proj_cost" class="menu_btn" onclick="cost_drop();" style="width: 100%;">
|
<button id="proj_cost" class="menu_btn" style="width: 100%;z-index: 3;">
|
||||||
<div id="proj_cost_text" style="pointer-events: none;">Расчет стоимости</div>
|
<div id="proj_cost_text" style="pointer-events: none;">Расчет стоимости</div>
|
||||||
<img src="/img/drop.png" style="width: 1vw;height: 0.5vw;pointer-events: none;" alt="\/">
|
<img src="/img/drop.png" style="width: 1vw;height: 0.5vw;pointer-events: none;" alt="\/">
|
||||||
</button>
|
</button>
|
||||||
|
@ -155,6 +155,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
width: 14vw;
|
width: 14vw;
|
||||||
|
padding-block: 0.4vw;
|
||||||
}
|
}
|
||||||
#cost_list{
|
#cost_list{
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
|
@ -177,12 +178,35 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="zones" style="position: relative;">
|
<div class="zones" style="position: relative;">
|
||||||
<div id="drags"></div>
|
<div id="drags">
|
||||||
|
|
||||||
|
</div>
|
||||||
<div class="wall dropzone" id="wall"></div>
|
<div class="wall dropzone" id="wall"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="display:flex; justify-content: space-around;"></div>
|
<div style="display:flex; justify-content: space-around;"></div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="inputs" style="display: flex;justify-content: space-between;height: 5vh;">
|
||||||
|
<div id="obj_color_div" style="justify-content: space-evenly; width: 50vw;display: none;transform: translateX(30%);">
|
||||||
|
<label for="obj_color" style="width: 10vw;">цвет объекта</label>
|
||||||
|
<!-- <input id="obj_color" type="color" onchange="obj_color_change(event)"> -->
|
||||||
|
<div style="display: flex;justify-content: space-evenly; width: 30vw;">
|
||||||
|
<div style="background-color: #43368D; border-radius: 50%;height: 2vw;width: 2vw;" color="#43368D" onclick="obj_color_change('43368D')"></div>
|
||||||
|
<div style="background-color: #41AB34; border-radius: 50%;height: 2vw;width: 2vw;" color="#41AB34" onclick="obj_color_change('41AB34')"></div>
|
||||||
|
<div style="background-color: #F7EA55; border-radius: 50%;height: 2vw;width: 2vw;" color="#F7EA55" onclick="obj_color_change('F7EA55')"></div>
|
||||||
|
<div style="background-color: #E5231F; border-radius: 50%;height: 2vw;width: 2vw;" color="#E5231F" onclick="obj_color_change('E5231F')"></div>
|
||||||
|
<div style="background-color: #F39223; border-radius: 50%;height: 2vw;width: 2vw;" color="#F39223" onclick="obj_color_change('F39223')"></div>
|
||||||
|
<div style="background-color: #009FE3; border-radius: 50%;height: 2vw;width: 2vw;" color="#009FE3" onclick="obj_color_change('009FE3')"></div>
|
||||||
|
<div style="background-color: #CEE8EA; border-radius: 50%;height: 2vw;width: 2vw;" color="#CEE8EA" onclick="obj_color_change('CEE8EA')"></div>
|
||||||
|
<div style="background-color: #B9D585; border-radius: 50%;height: 2vw;width: 2vw;" color="#B9D585" onclick="obj_color_change('B9D585')"></div>
|
||||||
|
<div style="background-color: #F4F2C7; border-radius: 50%;height: 2vw;width: 2vw;" color="#F4F2C7" onclick="obj_color_change('F4F2C7')"></div>
|
||||||
|
<div style="background-color: #E699A7; border-radius: 50%;height: 2vw;width: 2vw;" color="#E699A7" onclick="obj_color_change('E699A7')"></div>
|
||||||
|
<div style="background-color: #F9C771; border-radius: 50%;height: 2vw;width: 2vw;" color="#F9C771" onclick="obj_color_change('F9C771')"></div>
|
||||||
|
<div style="background-color: #B7A3C7; border-radius: 50%;height: 2vw;width: 2vw;" color="#B7A3C7" onclick="obj_color_change('B7A3C7')"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="inputs" style="display: flex;justify-content: space-between;">
|
<div class="inputs" style="display: flex;justify-content: space-between;">
|
||||||
<style>
|
<style>
|
||||||
.btn_icon{
|
.btn_icon{
|
||||||
|
@ -204,16 +228,29 @@
|
||||||
<div class="btn_icon" onclick="go_forw()"><img src="/img/icon/forw.png" alt="forw"></div>
|
<div class="btn_icon" onclick="go_forw()"><img src="/img/icon/forw.png" alt="forw"></div>
|
||||||
<div class="btn_icon" onclick="obj_del()"><img src="/img/icon/del.png" alt="del"></div>
|
<div class="btn_icon" onclick="obj_del()"><img src="/img/icon/del.png" alt="del"></div>
|
||||||
</div>
|
</div>
|
||||||
|
<div style="display: flex;justify-content: space-between; width: 15vw;">
|
||||||
|
<div><input type="checkbox" id="grid_checkbox" checked="true" onchange='grid_view(JSON.parse(event.target.checked));'><label for="grid_checkbox">Показывать сетку</label></div>
|
||||||
|
</div>
|
||||||
<div style="display: flex;justify-content: space-between; width: 7vw;">
|
<div style="display: flex;justify-content: space-between; width: 7vw;">
|
||||||
<div id="save_btn_icon" class="btn_icon" onclick="save_proj()"><img src="/img/icon/save.png" alt="save"></div>
|
<div id="save_btn_icon" class="btn_icon" onclick="save_proj()"><img src="/img/icon/save.png" alt="save"></div>
|
||||||
<div class="btn_icon" onclick="document.getElementById('import_file').click();"><img src="/img/icon/download.png" alt="load"></div>
|
<div class="btn_icon" onclick="img_download()"><img src="/img/icon/download.png" alt="load"></div>
|
||||||
<input type='file' id="import_file" style="display: none;" accept="application/JSON" onchange='openFile(event,load_file)'>
|
<!-- <div class="btn_icon" onclick="document.getElementById('import_file').click();"><img src="/img/icon/download.png" alt="load"></div> -->
|
||||||
|
<!-- <input type='file' id="import_file" style="display: none;" accept="application/JSON" onchange='openFile(event,load_file)'> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="inputs" style="display: flex;justify-content: space-between;margin-top: 0px;">
|
<div class="inputs" style="display: flex;justify-content: space-between;margin-top: 0px;">
|
||||||
<div id="obj_group" style="display: flex;justify-content:space-evenly; width: 100vw;">
|
<div id="obj_group" style="display: flex;justify-content:space-evenly; width: 100vw;">
|
||||||
<!-- <button name="" id="group_drop" >Помехи на стене</button> -->
|
<!-- <button name="" id="group_drop" >Помехи на стене</button> -->
|
||||||
<style>
|
<style>
|
||||||
|
.obj_group{
|
||||||
|
/* width: 100%; */
|
||||||
|
display: flex;
|
||||||
|
padding-block: 0.3vw;
|
||||||
|
}
|
||||||
|
.obj_group label{
|
||||||
|
width: 90%;
|
||||||
|
/* padding-inline: 0.3vw; */
|
||||||
|
}
|
||||||
.group_drop{
|
.group_drop{
|
||||||
width: 15vw;
|
width: 15vw;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
|
@ -243,12 +280,85 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="czones"></div>
|
<div class="czones"></div>
|
||||||
|
<button onclick="capture()">cap</button>
|
||||||
|
|
||||||
<script src="/lib/inter.js"></script>
|
<script src="/lib/inter.js"></script>
|
||||||
<script>
|
<script>
|
||||||
let proj_name = "<%= proj_name %>";
|
let proj_name = "<%= proj_name %>";
|
||||||
|
|
||||||
|
if ( $.cookie("grid") != null){
|
||||||
|
document.getElementById("grid_checkbox").checked = JSON.parse($.cookie("grid"));
|
||||||
|
grid_view(JSON.parse($.cookie("grid")))
|
||||||
|
}else{
|
||||||
|
$.cookie("grid",true)
|
||||||
|
document.getElementById("grid_checkbox").checked = true;
|
||||||
|
grid_view(true)
|
||||||
|
}
|
||||||
|
function grid_view(check){
|
||||||
|
let grid = document.getElementsByClassName("wall")[0]
|
||||||
|
console.log(check);
|
||||||
|
if (check == false) {
|
||||||
|
grid.style.backgroundImage = "";
|
||||||
|
$.cookie("grid",false);
|
||||||
|
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
grid.style.backgroundImage = 'url("/img/bg1red.png")';
|
||||||
|
$.cookie("grid",true);
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function img_download(){
|
||||||
|
msg("добавить на фото стоимость ?",{type:"ask",res:(out)=>{
|
||||||
|
let wait_msg = msg("делаем фото",{type:"wait"})
|
||||||
|
proj_img((src)=>{
|
||||||
|
msg("изображение проекта готово",{time:3})
|
||||||
|
msg_del(wait_msg.id)
|
||||||
|
downloadImg(src,`${proj_name}.png`)
|
||||||
|
},out)
|
||||||
|
}})
|
||||||
|
}
|
||||||
|
|
||||||
|
function proj_img(callback,cost = false){
|
||||||
|
let width = (parseInt(document.getElementById("wall").style.width))
|
||||||
|
document.getElementById("drags").append(document.getElementById("wall"));
|
||||||
|
document.getElementById("drags").style.height = document.getElementById("wall").style.height;
|
||||||
|
if(cost == true){
|
||||||
|
width += 252;
|
||||||
|
document.getElementById("drags").append(document.getElementById("cost_div"));
|
||||||
|
document.getElementById("cost_div").style.marginLeft = `${parseInt(document.getElementById("wall").style.width) + 4}px`;
|
||||||
|
document.getElementById("cost_list").style.display = "block";
|
||||||
|
}
|
||||||
|
html2canvas(document.getElementById("drags"),{
|
||||||
|
y:7,
|
||||||
|
width:width,
|
||||||
|
logging:false,
|
||||||
|
scale:5
|
||||||
|
}).then(canvas => {
|
||||||
|
if(cost == true){
|
||||||
|
document.getElementById("cost_div").style.marginLeft = `0`;
|
||||||
|
document.getElementById("cost_list").style.display = "none";
|
||||||
|
document.getElementById("wall_input").append(document.getElementById("cost_div"));
|
||||||
|
}
|
||||||
|
document.getElementsByClassName("zones")[0].append(document.getElementById("wall"));
|
||||||
|
let src = "";
|
||||||
|
src = canvas.toDataURL();
|
||||||
|
// console.log(src);
|
||||||
|
callback(src)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function obj_color_change(color,in_obj = null){
|
||||||
|
if(color != "null"){
|
||||||
|
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
||||||
|
let obj = (in_obj == null)? document.getElementById(cur_obj):in_obj;
|
||||||
|
// console.log(color);
|
||||||
|
color_change(color,obj.getAttribute("img"),(img)=>{
|
||||||
|
obj.src = img;
|
||||||
|
objs[obj.classList[0]][obj.id]["color"] = color;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function load_file(text){
|
function load_file(text){
|
||||||
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
||||||
|
@ -295,14 +405,19 @@
|
||||||
console.log(cur_obj);
|
console.log(cur_obj);
|
||||||
// console.log(drag.classList);
|
// console.log(drag.classList);
|
||||||
if(objs[drag.classList[0]] != null&&objs[drag.classList[0]][drag.id] != null) {
|
if(objs[drag.classList[0]] != null&&objs[drag.classList[0]][drag.id] != null) {
|
||||||
|
console.log(objs[drag.classList[0]]);
|
||||||
delete objs[drag.classList[0]][drag.id];
|
delete objs[drag.classList[0]][drag.id];
|
||||||
|
if (Object.keys(objs[drag.classList[0]]).length < 1){
|
||||||
|
delete objs[drag.classList[0]];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
calc_total()
|
calc_total()
|
||||||
|
|
||||||
drag.remove();
|
drag.remove();
|
||||||
|
document.getElementById("obj_color_div").style.display = "none";
|
||||||
|
cur_obj = null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
catch{alert("объкт не выбран")}
|
catch{msg("объект не выбран")}
|
||||||
}
|
}
|
||||||
|
|
||||||
function group_drop(){
|
function group_drop(){
|
||||||
|
@ -344,6 +459,7 @@
|
||||||
part.classList.add("group_drop")
|
part.classList.add("group_drop")
|
||||||
part.setAttribute("groups",`${value["groups"]}`)
|
part.setAttribute("groups",`${value["groups"]}`)
|
||||||
part.setAttribute("count",`${value["count"]}`)
|
part.setAttribute("count",`${value["count"]}`)
|
||||||
|
part.setAttribute("no-cost",`${value["no-cost"]}`)
|
||||||
part.setAttribute("pid",`${value["id"]}`)
|
part.setAttribute("pid",`${value["id"]}`)
|
||||||
|
|
||||||
part.append(part_text);
|
part.append(part_text);
|
||||||
|
@ -354,27 +470,27 @@
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
function cost_drop(id){
|
// function cost_drop(id){
|
||||||
// let e = document.getElementById("cost")
|
// // let e = document.getElementById("cost")
|
||||||
// setTimeout(()=>{
|
// // setTimeout(()=>{
|
||||||
// document.getElementById("group").style.display = "block";
|
// // document.getElementById("group").style.display = "block";
|
||||||
// // document.getElementById("group").style.left = document.getElementById("group_drop").getBoundingClientRect().left;
|
// // // document.getElementById("group").style.left = document.getElementById("group_drop").getBoundingClientRect().left;
|
||||||
// let childs = document.getElementById("group").getElementsByTagName("input");
|
// // let childs = document.getElementById("group").getElementsByTagName("input");
|
||||||
// let i = 0;
|
// // let i = 0;
|
||||||
// Object.entries(childs).forEach(([key,value]) => {
|
// // Object.entries(childs).forEach(([key,value]) => {
|
||||||
// console.log(key,value);
|
// // console.log(key,value);
|
||||||
// if(value.checked == true){
|
// // if(value.checked == true){
|
||||||
// get_objs(value)
|
// // get_objs(value)
|
||||||
// i++;
|
// // i++;
|
||||||
// }
|
// // }
|
||||||
// if (i==0){
|
// // if (i==0){
|
||||||
// document.getElementsByClassName("czones")[0].innerHTML = "";
|
// // document.getElementsByClassName("czones")[0].innerHTML = "";
|
||||||
// drag_start()
|
// // drag_start()
|
||||||
// // e.removeChild(e.getElementsByClassName(value))
|
// // // e.removeChild(e.getElementsByClassName(value))
|
||||||
// }
|
// // }
|
||||||
// });
|
// // });
|
||||||
// },1)
|
// // },1)
|
||||||
}
|
// }
|
||||||
|
|
||||||
function wall_color_change(){
|
function wall_color_change(){
|
||||||
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
if (proj_state == "loaded"){objs_back.push(JSON.parse(JSON.stringify(objs)));}
|
||||||
|
@ -471,8 +587,10 @@
|
||||||
|
|
||||||
function save_proj(){
|
function save_proj(){
|
||||||
// document.getElementById('top_panel_center').innerHTML=`сохранение ${proj_name}`;
|
// document.getElementById('top_panel_center').innerHTML=`сохранение ${proj_name}`;
|
||||||
|
let wait_msg = msg("идёт сохранение проекта",{type:"wait"});
|
||||||
save((res)=>{
|
save((res)=>{
|
||||||
alert("проект сохранён")
|
msg_del(wait_msg.id);
|
||||||
|
msg("проект сохранён")
|
||||||
// document.getElementById('top_panel_center').innerHTML=`сохранено ${proj_name} в облако`;
|
// document.getElementById('top_panel_center').innerHTML=`сохранено ${proj_name} в облако`;
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
|
@ -47,7 +47,7 @@
|
||||||
user-select: none;
|
user-select: none;
|
||||||
font: "Circe Rounded";
|
font: "Circe Rounded";
|
||||||
font-size: var(--main-font-size);
|
font-size: var(--main-font-size);
|
||||||
font-weight:100;
|
font-weight:300;
|
||||||
color: #3C3C3C;
|
color: #3C3C3C;
|
||||||
}
|
}
|
||||||
@media (max-width: 900px) {
|
@media (max-width: 900px) {
|
||||||
|
@ -59,7 +59,36 @@
|
||||||
width: 1vw;
|
width: 1vw;
|
||||||
height: 1vw;
|
height: 1vw;
|
||||||
}
|
}
|
||||||
|
.btn_blue{
|
||||||
|
padding: 0.3vw;
|
||||||
|
border-radius: 0.5vw;
|
||||||
|
border: 0.01vw #00AEEF solid;
|
||||||
|
background-color: #00AEEF;
|
||||||
|
color: white;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.btn_white{
|
||||||
|
padding: 0.3vw;
|
||||||
|
border-radius: 0.5vw;
|
||||||
|
border: 0.01vw #929292 solid;
|
||||||
|
background-color: white;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.btn_gray{
|
||||||
|
padding: 0.3vw;
|
||||||
|
border-radius: 0.5vw;
|
||||||
|
border: 0.01vw gray solid;
|
||||||
|
background-color: gray;
|
||||||
|
color: white;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.vc{
|
||||||
|
margin: auto 0px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<script>
|
||||||
|
let domen = "puzzle.nor.su";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|