puzzle/views/header.ejs
n0rdye 9cf2250b7b modified: func.js
modified:   index.js
	modified:   object.js
	modified:   public/lib/fn.js
	modified:   public/lib/inter.js
	modified:   views/admin/objects/object_creation.ejs
	modified:   views/admin/objects/object_edit.ejs
	modified:   views/admin/objects/object_groups.ejs
	modified:   views/header.ejs
	modified:   views/load.ejs
	modified:   views/main.ejs
	modified:   views/project.ejs
	modified:   views/static/start.ejs
2023-08-19 21:18:45 +05:00

296 lines
12 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<%- include('./load.ejs') %>
<style>
#proj_top_panel{
display: flex;
/* width: 90%; */
justify-content: space-between;
width: 90%;
text-align: center;
margin: auto;
}
#top_panel_left{
/* float: left; */
justify-content: space-between;
/* width: 200px; */
cursor: pointer;
width: 9vw;
display: flex;
/* width: 20vw; */
}
#top_panel_center{
/* float: left; */
justify-content: space-between;
cursor: pointer;
width: 58vw;
display: flex;
/* width: 20vw; */
}
#top_panel{
height: 10vh;
display: flex;
margin-bottom: 2vh;
margin-top: 1vh;
}
/* button{
/* margin-inline: 5px; */
/* } */
.tpanel{
margin: auto 0px;
/* width: 100%; */
height: 100%;
}
.tpanel button{
border: 0px;
background-color: transparent;
cursor: pointer;
}
.menu_btn{
background: ghostwhite;
cursor: pointer;
border: 1px gray solid;
padding: 2px;
width: 220px;
border-radius: 0.5vw;
min-height: 2.5vw;
}
.cmenu{
position: absolute;
display: grid;
background: ghostwhite;
color: black;
cursor: pointer;
border: 1px gray solid;
border-radius: 0.5vw;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-top: 0px;
z-index: 500;
/* width: 218px; */
}
#top_panel_right_main{
/* float: right; */
justify-content:space-between;
float: right;
display: flex;
cursor: pointer;
width: 14vw;
/* width: 20vw; */
/* height: 60px; */
}
#top_panel_right_sec{
/* float: right; */
justify-content:space-between;
float: left;
display: flex;
cursor: pointer;
width: 14vw;
transform: translateY(100%);
/* width: 20vw; */
/* height: 60px; */
}
.top_panel_right img{
width: 2.5vw;
/* height: 3vh; */
}
@media (max-width: 900px) {
#top_panel_right_main{
display: none;
}
#top_panel_right_sec{
display: flex;
}
#top_panel_center{
width: 70vw;
}
}
@media (min-width: 900px) {
#top_panel_right_main{
display: flex;
}
#top_panel_right_sec{
display: none;
}
}
#top_panel_center button{
border-radius: 0.5vw;
}
#top_panel_center :hover{
border: 1px solid black;
}
</style>
<header id="top_panel">
<!-- <div id="user_name"></div> -->
<div id="proj_top_panel">
<div id="top_panel_left" class="tpanel"></div>
<div id="top_panel_center" class="tpanel">
<button id="page_btn_main" onclick="goto('/main')">Мои проекты</button>
<button id="page_btn_tamp" onclick="goto('/tamp')">Шаблоны</button>
<button id="page_btn_gallery" onclick="goto('/gallery')">Галерея</button>
<button id="page_btn_faq" onclick="goto('/faq')">FAQ</button>
<button id="page_btn_help" onclick="goto('/help')">Связаться с поддержкой</button>
</div>
<div id="top_panel_right_main" class="tpanel top_panel_right">
<a href=""><img src="/img/vk.svg" alt=""></a>
<a href=""><img src="/img/youtube.svg" alt=""></a>
<a href=""><img src="/img/ok.svg" alt=""></a>
<a href=""><img src="/img/telegram.svg" alt=""></a>
</div>
</div> <!-- <div><button onclick="logout();">logout</button></div> -->
</header>
<div id="user_menu" class="cmenu"></div>
<div id="top_div" style="background-color: transparent; width: 100%;height: 100%;position: absolute;inset: 0px;z-index: 300;" onclick="hide_menus()"></div>
<script>
get_from_uuid((res)=>{
// let uname = document.getElementById("user_name");
// let menu = document.getElementById("user_menu");
// let header = document.getElementById("top_panel");
// let right = document.getElementById("top_panel_right");
// let left = document.getElementById("top_panel_left");
// if(document.title != "main") menu.innerHTML += `<button onclick="goto('/');">проекты</button> <br>`;
// right.innerHTML += `<div id="user_name" class="menu_btn">${res["login"]}</div>`;
let menu = document.getElementById("top_panel_center");
if (res["admin"] == true){
menu.innerHTML += `<button id="page_btn_admin" onclick='goto("/admin")'>Админ. панель</button><br>`;
}
// menu.innerHTML += "<button onclick='logout();'>выйти</button><br>";
document.URL.split("puzzle.n0r.su/").at(-1)
switch (document.URL.split("puzzle.n0r.su/").at(-1)) {
case ("main"):
document.getElementById("page_btn_main").style.border = "1px solid black";
break;
case ("admin"):document.getElementById("page_btn_admin").style.border = "1px solid black";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");
// onscroll = (e)=>{
// hide_menus();
// }
onresize = (e)=>{
hide_menus();
}
onclick = (e) => {
// e.preventDefault()
// console.log(e);
// console.log(document.getElementById(e.target.id).parentElement);
// if(e.target.onclick != null){
// if(document.title == "login"){
// // console.log(document.title);
// log_by_sid();
// }else if(document.title != "login"){
// check_sid(true);
// // console.log("check");
// }
// }
if(e.target.id == "user_name"){
hide_menus();
let menu = document.getElementById("user_menu");
menu.style.display = 'block';
menu.style = `top:${e.target.getBoundingClientRect().top + 25}px;left:${e.target.getBoundingClientRect().left - 20}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_menu"){
hide_menus();
let menu = document.getElementById("project_menu");
menu.style.display = 'block';
menu.style = `top:${e.target.getBoundingClientRect().top + 25}px;left:${e.target.getBoundingClientRect().left - 20}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 == "user_buttons"){
hide_menus();
let menu = document.getElementById("user_edit_menu");
menu.setAttribute("login_id",e.target.classList[0]);
menu.setAttribute("login_name",document.getElementById(`login_${e.target.classList[0]}`).innerText);
menu.setAttribute("login_pass",document.getElementById(`pass_${e.target.classList[0]}`).innerText);
menu.setAttribute("login_admin",document.getElementById(`admin_${e.target.classList[0]}`).innerText);
menu.style.display = 'block';
menu.style = `top:${e.target.getBoundingClientRect().top + 20}px;left:${e.target.getBoundingClientRect().left - 8}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 == "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"){
hide_menus();
document.getElementById("cost_list").style = `margin-top:2.5vw;left:${e.target.getBoundingClientRect().left}px`;
console.log("cost_list");
open_menu();
}
else if(`${e.target.id}`.split("-")[0] == "group_drop"){
hide_menus();
document.getElementById("group").innerHTML = "";
// 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");
open_menu();
if (document.URL == "https://puzzle.n0r.su/admin/objects"){
if(e.target.getAttribute("count") != 0)load_groups(()=>{},e.target.getAttribute("groups").split(","),true)
let groups = document.getElementById("group");
let new_grp_btn = document.createElement("button");
new_grp_btn.setAttribute("onclick",`create_new_group(${e.target.getAttribute("pid")})`);
new_grp_btn.innerText = "доб. группу";
new_grp_btn.style.width = "14vw";
groups.append(new_grp_btn)
}
else{
if(e.target.getAttribute("count") != 0)load_groups(()=>{},e.target.getAttribute("groups").split(","))
}
// hide_menus();
// let menu = document.getElementById("object_edit_menu");
// let obj = e.target;
// 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)
}
// else{
// hide_menus();
// }
}
</script>