n0rdye/puzzle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modified: object.js

Browse Source 
modified:   public/lib/fn.js
	modified:   public/lib/inter.js
	modified:   public/lib/inter_group_object.js
	modified:   public/lib/inter_temp.js
	modified:   views/admin/objects/group_object.ejs
	modified:   views/admin/objects/object_creation.ejs
	modified:   views/admin/objects/object_edit.ejs
	modified:   views/project.ejs
This commit is contained in:
n0rdye 2023-11-16 17:32:11 +00:00
parent 38418b5e59
commit 1a8831d6ad
9 changed files with 116 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
object.js
View File

@ -109,12 +109,14 @@ module.exports.load_colors = (inp,cook,res)=>{
module.exports.save_grouped = (inp,cook,res)=>{ module.exports.save_grouped = (inp,cook,res)=>{
try { try {
db.sv("objects","group_obj",inp["json"],"id",inp["id"],()=>{ db.sv("objects","group_obj",inp["json"],"id",inp["id"],()=>{
db.sv("objects","cost",inp["cost"],"id",inp["id"],()=>{
let img = imageDataURI.decode(inp["data"]); let img = imageDataURI.decode(inp["data"]);
if (!fs.existsSync(`public/img/object/${inp["name"]}`)){fs.mkdirSync(`public/img/object/${inp["name"]}`);} if (!fs.existsSync(`public/img/object/${inp["name"]}`)){fs.mkdirSync(`public/img/object/${inp["name"]}`);}
fs.writeFile(`public/img/object/${inp["name"]}/main.${img.imageType.split("/").at(-1)}`, img.dataBuffer,()=>{ fs.writeFile(`public/img/object/${inp["name"]}/main.${img.imageType.split("/").at(-1)}`, img.dataBuffer,()=>{
res.send({body:"good"}) res.send({body:"good"})
}); });
},true) },true)
},true)
} catch (error) { } catch (error) {
func.log("backend object creating error - "+error); func.log("backend object creating error - "+error);
} }

2
public/lib/fn.js
View File

@ -302,7 +302,7 @@ async function removeImageBackground(image) {
} }
ctx.putImageData(imageData, 0, 0); ctx.putImageData(imageData, 0, 0);
return canvas.toDataURL(`image/png`); return canvas.toDataURL(`image/jpg`);
} }
function downloadImg(url, filename) { function downloadImg(url, filename) {

17
public/lib/inter.js
View File

@ -1,6 +1,6 @@
window.dragMoveListener = dragMoveListener; window.dragMoveListener = dragMoveListener;
let root = document.getElementById("drags"); let root = document.getElementById("drags");
let objs = { height:"2",width:"4",color:"#FFFFFF"}; let objs = { height:"2",width:"3",color:"#FFFFFF"};
let objs_store = {}; let objs_store = {};
let proj_from = "cloud"; let proj_from = "cloud";
let cur_obj; let cur_obj;
@ -19,7 +19,18 @@ function create(clas,x,y,color = null,id,size,layer = 0){
clas.forEach(cl => { clas.forEach(cl => {
obj.classList.add(cl); obj.classList.add(cl);
}); });
get_obj(main_clas,(db_data)=>{ if(objs_store[main_clas] == null){
load_objs(()=>{
make_obj(objs_store[main_clas])
});
}
else{
make_obj(objs_store[main_clas])
}
// get_obj(main_clas,(db_data)=>{
// })
function make_obj(db_data) {
// console.log(db_data); // console.log(db_data);
// console.log(db_data); // console.log(db_data);
// db_data.forEach(db_data => { // db_data.forEach(db_data => {
@ -60,7 +71,7 @@ function create(clas,x,y,color = null,id,size,layer = 0){
} }
} }
calc_total(); calc_total();
}) }
obj.setAttribute("decoding","async"); obj.setAttribute("decoding","async");
obj.setAttribute("loading","lazy"); obj.setAttribute("loading","lazy");
if(id != "none"){obj.setAttribute("onclick",`obj_click("${id}")`);} if(id != "none"){obj.setAttribute("onclick",`obj_click("${id}")`);}

20
public/lib/inter_group_object.js
View File

@ -1,6 +1,6 @@
window.dragMoveListener = dragMoveListener; window.dragMoveListener = dragMoveListener;
let root = document.getElementById("drags"); let root = document.getElementById("drags");
let objs = { height:"2",width:"4",color:"#FFFFFF"}; let objs = { height:"2",width:"2",color:"#ffffff",total:0};
let objs_store = {}; let objs_store = {};
let proj_from = "cloud"; let proj_from = "cloud";
let cur_obj; let cur_obj;
@ -19,7 +19,18 @@ function create(clas,x,y,color = null,id,size,layer = 0){
clas.forEach(cl => { clas.forEach(cl => {
obj.classList.add(cl); obj.classList.add(cl);
}); });
get_obj(main_clas,(db_data)=>{ if(objs_store[main_clas] == null){
load_objs(()=>{
make_obj(objs_store[main_clas])
});
}
else{
make_obj(objs_store[main_clas])
}
// get_obj(main_clas,(db_data)=>{
// })
function make_obj(db_data) {
// console.log(db_data); // console.log(db_data);
// console.log(db_data); // console.log(db_data);
// db_data.forEach(db_data => { // db_data.forEach(db_data => {
@ -60,7 +71,7 @@ function create(clas,x,y,color = null,id,size,layer = 0){
} }
} }
calc_total(); calc_total();
}) }
obj.setAttribute("decoding","async"); obj.setAttribute("decoding","async");
obj.setAttribute("loading","lazy"); obj.setAttribute("loading","lazy");
if(id != "none"){obj.setAttribute("onclick",`obj_click("${id}")`);} if(id != "none"){obj.setAttribute("onclick",`obj_click("${id}")`);}
@ -219,7 +230,10 @@ function load(objss){
} }
if (keys == "color"){ if (keys == "color"){
console.log(values);
document.getElementById("trans_checkbox").checked = (values == "#ffffff")? true:false;
document.getElementById("wall").style.backgroundColor = values; document.getElementById("wall").style.backgroundColor = values;
wall_color_change()
} }
if (keys == Object.keys(objs).at(-1)){ if (keys == Object.keys(objs).at(-1)){
proj_state = "loaded"; proj_state = "loaded";

17
public/lib/inter_temp.js
View File

@ -1,6 +1,6 @@
window.dragMoveListener = dragMoveListener; window.dragMoveListener = dragMoveListener;
let root = document.getElementById("drags"); let root = document.getElementById("drags");
let objs = { height:"2",width:"4",color:"#FFFFFF",total:0}; let objs = { height:"2",width:"3",color:"#FFFFFF",total:0};
let objs_store = {}; let objs_store = {};
let proj_from = "cloud"; let proj_from = "cloud";
let cur_obj; let cur_obj;
@ -19,7 +19,18 @@ function create(clas,x,y,color = null,id,size,layer = 0){
clas.forEach(cl => { clas.forEach(cl => {
obj.classList.add(cl); obj.classList.add(cl);
}); });
get_obj(main_clas,(db_data)=>{ if(objs_store[main_clas] == null){
load_objs(()=>{
make_obj(objs_store[main_clas])
});
}
else{
make_obj(objs_store[main_clas])
}
// get_obj(main_clas,(db_data)=>{
// })
function make_obj(db_data) {
// console.log(db_data); // console.log(db_data);
// console.log(db_data); // console.log(db_data);
// db_data.forEach(db_data => { // db_data.forEach(db_data => {
@ -60,7 +71,7 @@ function create(clas,x,y,color = null,id,size,layer = 0){
} }
} }
calc_total(); calc_total();
}) }
obj.setAttribute("decoding","async"); obj.setAttribute("decoding","async");
obj.setAttribute("loading","lazy"); obj.setAttribute("loading","lazy");
if(id != "none"){obj.setAttribute("onclick",`obj_click("${id}")`);} if(id != "none"){obj.setAttribute("onclick",`obj_click("${id}")`);}

46
views/admin/objects/group_object.ejs
View File

@ -237,6 +237,9 @@
} }
</style> </style>
</div> </div>
<div style="display: flex;justify-content: space-between; width: 15vw;">
<div><input type="checkbox" id="trans_checkbox" checked="true" onchange='wall_color_change()'><label for="trans_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()"><img src="/img/icon/save.png" alt="save"></div> <div id="save_btn_icon" class="btn_icon" onclick="save()"><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="document.getElementById('import_file').click();"><img src="/img/icon/download.png" alt="load"></div> -->
@ -288,6 +291,7 @@
<script src="/lib/inter_group_object.js"></script> <script src="/lib/inter_group_object.js"></script>
<script> <script>
const get_object_id = new URL(window.location).searchParams.get("object_id"); const get_object_id = new URL(window.location).searchParams.get("object_id");
const get_object_name = new URL(window.location).searchParams.get("object_name");
document.getElementById("layer_inp").value = 0; document.getElementById("layer_inp").value = 0;
img_cache(()=>{}) img_cache(()=>{})
wall_size_change('height');resize_drags(); wall_size_change('height');resize_drags();
@ -301,28 +305,36 @@
},false) },false)
} }
function get_data(id,callback) { function get_data(name,callback) {
$.post( "/get_objs") $.post( "/get_obj",{name:name,key:"*"})
.done(function( res ) { .done(function( res ) {
if(res["out"] == "good"){ if(res["out"] == "good"){
Object.entries(res["body"]).forEach(([key,value]) => { // Object.entries(res["body"]).forEach(([key,value]) => {
if(id == value["id"]){ // if(id == value["id"]){
callback(value) // callback(value)
} // }
}); // });
console.log(res["body"]);
callback(res["body"])
} }
}); });
} }
function save() { function save() {
get_data(get_object_id,(data)=>{ let wait_msg = msg("Сохраняем изображение", {type:"wait"})
proj_img((src)=>{ get_data(get_object_name,(data)=>{
$.post( "/admin/object/grouped/save",{name:data["name"],data:src,json:JSON.stringify(objs),id:data["id"]}) proj_img((src_orig)=>{
removeImageBackground(src_orig).then((src_chaged)=>{
src = (JSON.parse(document.getElementById("trans_checkbox").checked) == true)? src_chaged:src_orig;
console.log("posting");
$.post( "/admin/object/grouped/save",{name:data["name"],data:src,json:JSON.stringify(objs),id:data["id"],cost:objs["total"]})
.done(function( res ) { .done(function( res ) {
msg_del(wait_msg.id)
goto(`/admin/objects?object_id=${data["id"]}`); goto(`/admin/objects?object_id=${data["id"]}`);
}); });
}) })
}) })
})
} }
function proj_img(callback,cost = false){ function proj_img(callback,cost = false){
@ -344,8 +356,8 @@
y:7, y:7,
x:2, x:2,
width:width, width:width,
logging:false, logging:false
scale:5 // scale:0.2
}).then(canvas => { }).then(canvas => {
if(cost == true){ if(cost == true){
document.getElementById("cost_div").style.marginLeft = `0`; document.getElementById("cost_div").style.marginLeft = `0`;
@ -384,12 +396,20 @@
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)));}
if (JSON.parse(document.getElementById("trans_checkbox").checked) == true) {
let wall = document.getElementById("wall")
wall.style.backgroundColor = "#ffffff";
objs["color"] = "#ffffff";
document.getElementById("wall_color").disabled = true;
}
else{
document.getElementById("wall_color").disabled = false;
let wall = document.getElementById("wall") let wall = document.getElementById("wall")
let color = document.getElementById("wall_color") let color = document.getElementById("wall_color")
wall.style.backgroundColor = color.value; wall.style.backgroundColor = color.value;
objs["color"] = color.value; objs["color"] = color.value;
} }
}
function obj_color_change(color,in_obj = null){ function obj_color_change(color,in_obj = null){
if(color != "null"){ if(color != "null"){

17
views/admin/objects/object_creation.ejs
View File

@ -60,20 +60,31 @@
} }
</script> </script>
<input type="checkbox" id="obj_group_check" onchange="group_object_check()"> <input type="checkbox" id="obj_group_check" onchange='group_object_check(event)'>
<label for="obj_group_check">Сделать обьект группированным</label> <label for="obj_group_check">Сделать обьект группированным</label>
<script> <script>
function group_object_check(){ function group_object_check(event){
let onc = `document.getElementById('img_file').click();msg('помните что граници обозначают элемент с которым можно взаимодействовать даже если он прозрачный',{time:10,type:'help'});msg('старайтесь не оставлять пустые/прозрачные отступы',{time:15,type:'help'})` let onc = `document.getElementById('img_file').click();msg('помните что граници обозначают элемент с которым можно взаимодействовать даже если он прозрачный',{time:10,type:'help'});msg('старайтесь не оставлять пустые/прозрачные отступы',{time:15,type:'help'})`
let group_check = document.getElementById("obj_group_check"); let group_check = document.getElementById("obj_group_check");
let img_div = document.getElementById("img_prev_div"); let img_div = document.getElementById("img_prev_div");
if(group_check.checked == true){ if(group_check.checked == true){
img_div.setAttribute("onclick",`save_edited_obj(${group_check.getAttribute("object_id")});goto('/admin/group_object?object_id=${group_check.getAttribute("object_id")}')`); document.getElementById("obj_cost").disabled = true;
img_div.setAttribute("onclick",
`save_edited_obj(${group_check.getAttribute("object_id")});goto('/admin/group_object?`+
`object_id=${group_check.getAttribute("object_id")}&`+
`object_name=${document.getElementById(`object_${group_check.getAttribute("object_id")}`).getAttribute("class").split(" ")[0]}')`);
} }
else{ else{
document.getElementById("obj_cost").disabled = false;
img_div.setAttribute("onclick",onc); img_div.setAttribute("onclick",onc);
} }
if(event != null && group_check.checked == true){
msg("при изменении изображения вы перейдёте в режим редактирования гриппированного обьекта",{type:"help",time:11});
msg("нынешние изменения сохраняться",{type:"help",time:12});
msg("цена будет равна цене группы обьектов",{type:"help",time:13});
msg("при сохранении гриппированного обьекта вы вернётесь в это меню с сохранением всех параметров",{type:"help",time:14});
}
} }
</script> </script>
</div> </div>

9
views/admin/objects/object_edit.ejs
View File

@ -60,9 +60,11 @@
// load_groups(()=>{ // load_groups(()=>{
// edit_get_objs(); // edit_get_objs();
// }); // });
const get_object_id = new URL(window.location).searchParams.get("object_id");
function set_edit(id){ function set_edit(id){
window.history.pushState({}, null, `${(new URL(window.location)).toString().split("?")[0]}?object_id=${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],
@ -81,6 +83,7 @@
function edit_get_objs(by_name = false,callback){ function edit_get_objs(by_name = false,callback){
document.getElementById("objs_in_group").innerHTML = ""; document.getElementById("objs_in_group").innerHTML = "";
let wait_msg_object_load = (get_object_id != null)? msg("загружаем прошлый объект",{type:"wait"}):null;
if (obj_edit_type == "edit") set_obj_edit_params(); if (obj_edit_type == "edit") set_obj_edit_params();
edit_load_objs((data)=>{ edit_load_objs((data)=>{
let wait_msg = msg("Загрузка объектов",{type:"wait"}) let wait_msg = msg("Загрузка объектов",{type:"wait"})
@ -92,9 +95,9 @@
if(data.at(-1)["id"] == value["id"]){ if(data.at(-1)["id"] == value["id"]){
msg_del(wait_msg.id); msg_del(wait_msg.id);
msg("Объекты загружены") msg("Объекты загружены")
if(new URL(window.location).searchParams.get("object_id") != null){ if(get_object_id != null && wait_msg_object_load != null){
const get_object_id = new URL(window.location).searchParams.get("object_id"); set_edit(get_object_id);
set_edit(new URL(window.location).searchParams.get("object_id")); msg_del(wait_msg_object_load.id);
} }
if(callback)callback(true); if(callback)callback(true);
} }

4
views/project.ejs
View File

@ -349,8 +349,8 @@
y:7, y:7,
x:2, x:2,
width:width, width:width,
logging:false, logging:false
scale:5 // scale:0.99
}).then(canvas => { }).then(canvas => {
if(cost == true){ if(cost == true){
document.getElementById("cost_div").style.marginLeft = `0`; document.getElementById("cost_div").style.marginLeft = `0`;