Witam. Nwm czy tu no ale pisze... bo potrzebuje waszej pomocy... większość JS potrafię i wgl ale co do exportów importów mam problemy a teraz dochodzi do nich node js i już wysiadam nie wiem jak to zrobić totalnie... otóż mam stronę
zrobiłem ja wczoraj na szybo trochę tam jeszcze nie dział ale nie w tym rzecz... stworzyłem ją normalnie wiecie html css js i to tyle no ale chce zrobić panel sterowania do którego była by potrzebna mi edytowalna baza danych. no i tu pojawił się node i mongo... tylko że mam se szkielet aplikacji od noda:
const mongoClient = require("mongodb").MongoClient;
const url = "mongodb://127.0.0.1:27017";
const dbname = "mongo_work";
mongoClient.connect(url, {}, (error, client) => {
if (error) {
console.log("nie działa");
} else {
console.log("wszystko git");
const db = client.db(dbname);
db.collection("rand_main").insertMany(
[
{
tablica: [
"Warto się uczyć nawet od wroga.",
"Pamiętaj zachować spokój umysłu <br> tak w nieszczęściu jak i w powodzeniu.",
"Odważnym szczęście sprzyja.",
"Nie nudzi cie te klikanie?",
"Ta też lubie placki",
"Ej czekaj to ty robisz ... <br> o boże, o kurwa!",
"Nieno serio skończ wkońcu",
"Strzel se w łeb <br> ponoć nie boli",
"jak myslisz ile to robiłem <br> hmm? 1 noc kocie",
"i po co ja ci to losuje...",
"Czas tracony z przyjemnością <br> nie jest czasem straconym",
"Skutki gniewu są dużo <br> poważniejsze od jego przyczyn.",
"Wiedza to władza. Ale <br> niewiedza nie oznacza jeszcze <br> braku władzy.",
"Mamy Wszystko <br> Czego potrzebujesz ❤",
],
},
],
(error, result) => {
if (error) {
console.log("adding array field" + error);
} else {
console.log("Scuccesful add array");
}
}
);
db.collection("rand_main")
.find("tablica")
.toArray((error, results) => {
console.log(results);
});
}
});
const express = require("express");
var path = require("path");
const port = 80;
const app = express();
app.set("view engine", "hbs");
app.use(express.static(path.join(__dirname, "public")));
app.get("/", (req, res) => {
res.render("index");
});
app.get("/admin", (req, res) => {
res.send();
});
app.listen(port);
i teraz wytłumaczczcie mi zrobiłem tą linie żeby móc se pliki polaczyć:
app.use(express.static(path.join(__dirname, "public")));
i spoko mam pliki się tam widzą strona mnie więcej działa (jak coś ona jest tak zrobiona ze jak macie ciemny motyw to może być brzydka ;|) ale jak po odebraniu tych danych z bazy które dostałem mogę je dodać do tamtego pliku js żeby tam operować na danych próbowałem już wszystkiego no ale nic nie działa....
jak to zrobić żeby na ten tablicy mógł operować inny plik js który został nie jest apką tylko chyba modułem nwm czy to sie tak nazywa ale od razu mówię tamten plik stylizuje mi stronę wiec z nodem wiecie document... nie jest poprawny musi się tak dać zrobić zrobiłem w 10h stronę a 5 już siedzę nad czytanie po googlu jak to ma działać i nic nie działa...
Struktura plików w załączniku: 
Od razu mówię porządek w kodzie będę robił potem wiecie pomieszane angielskie nazwy i wgl więc proszę nie zwracać uwagi chodzi o same wytłumaczenie jak to działa
cały plik js ten nie od node... błagam pomóżcie mi z tym bo naprawdę wymiękam przy tym dajcie możliwości jakieś rozwiązania pomoc cokolwiek za wszystko serio dziękuje
// Line of the global variables for all page elements
var main_btn_content_c = document.querySelector(".main_btn_content");
var main_fot_btn_i = document.querySelector("#main_fot_btn");
var fotbar_btn_c = document.querySelectorAll(".fotbar_btn");
var fotbar_c = document.querySelector(".fotbar");
var fotbar_i = document.querySelector("#fotbar");
var content_c = document.querySelector(".content");
var content_i1 = document.querySelector("#content1");
var content_i2 = document.querySelector("#content2");
var content_i3 = document.querySelector("#content3");
var content_i4 = document.querySelector("#content4");
var img_c = document.querySelectorAll(".img");
var img_i1 = document.querySelector("#img1");
var img_i2 = document.querySelector("#img2");
var img_i3 = document.querySelector("#img3");
var img_i4 = document.querySelector("#img4");
var fotter_c = document.querySelector(".fotter");
var fotter_i = document.querySelector("#fotter");
var fotter_con_1_c = document.querySelector(".content_fot_1");
var fotter_con_2_c = document.querySelector(".content_fot_2");
var logo_i = document.querySelector("#logo");
// end of global variables
// functions && scripts
window.addEventListener("scroll", () => {
var wysokosc_elementu = content_i1.getBoundingClientRect().height;
var pozycja_elem_od_gory = content_i1.getBoundingClientRect().top;
var pozycja_od_gory = wysokosc_elementu - pozycja_elem_od_gory;
var wysokosc_strony = document.body.scrollHeight;
var roznica = wysokosc_strony / (pozycja_od_gory * 2) - 1;
if (roznica >= 1) {
roznica = 1;
} else if (roznica <= 0) {
roznica = 0;
} else if (roznica <= 1) {
fotbar_i.setAttribute(
"style",
`background-color: rgba(0,0,0, ${1 - roznica});`
);
}
if (1 - roznica >= 0.5) {
logo_i.setAttribute("src", "main/src/white.svg");
fotbar_btn_c.forEach((element, index, array) => {
element.setAttribute("style", "color: #ffffff;");
});
} else if (1 - roznica < 0.5) {
logo_i.setAttribute("src", "main/src/black.svg");
fotbar_btn_c.forEach((element, index, array) => {
element.setAttribute("style", "color: #000000;");
});
}
var wysokosc_elementu2 = content_i2.getBoundingClientRect().height;
var wysokosc_elementu3 = content_i3.getBoundingClientRect().height;
var wysokosc_elementu4 = content_i4.getBoundingClientRect().height;
var pozycja_elem_od_gory2 = content_i2.getBoundingClientRect().top;
var pozycja_elem_od_gory3 = content_i3.getBoundingClientRect().top;
var pozycja_elem_od_gory4 = content_i4.getBoundingClientRect().top;
if (pozycja_elem_od_gory2 <= wysokosc_elementu2 / 2) {
content_i2.style.transition = "1s ease-in-out";
content_i2.style.opacity = "1";
content_i2.style.transform = "translateY(0vh)";
} else {
}
if (pozycja_elem_od_gory3 <= wysokosc_elementu3 / 2) {
content_i3.style.transition = "1s ease-in-out";
content_i3.style.opacity = "1";
content_i3.style.transform = "translateY(0vh)";
} else {
}
if (pozycja_elem_od_gory4 <= wysokosc_elementu4 / 2) {
content_i4.style.transition = "1s ease-in-out";
content_i4.style.opacity = "1";
content_i4.style.transform = "translateY(0vh)";
} else {
}
// console.log(pozycja_elem_od_gory3);
// console.log(wysokosc_elementu3 / 2);
// fotbar_c.setAttribute("style", "background: #000000ad;");
// console.log(pozycja_od_gory);
// console.log(wysokosc_elementu);
// console.log(wysokosc_elementu - pozycja_od_gory);
// console.log(document.body.scrollHeight);
// content_i2
// content_i3
// content_i4
});
main_fot_btn_i.addEventListener("mouseover", function a() {
logo_i.style.transform = "rotate(380deg)";
logo_i.style.transition = "all 0.5s";
setTimeout(function () {
logo_i.style.transform = "";
logo_i.style.transition = "";
}, 500);
});
var fotbar_btn_tab = [...fotbar_btn_c];
fotbar_btn_c[1].addEventListener("click", () => {
window.scrollTo({
top: 1000,
left: 0,
behavior: "smooth",
});
});
fotbar_btn_c[2].addEventListener("click", () => {
window.scrollTo({
top: 2000,
left: 0,
behavior: "smooth",
});
});
fotbar_btn_c[3].addEventListener("click", () => {
window.scrollTo({
top: 3000,
left: 0,
behavior: "smooth",
});
});
main_fot_btn_i.addEventListener("click", () => {
window.scrollTo({
top: 0,
left: 0,
behavior: "smooth",
});
});
main_btn_content.addEventListener("click", () => {
var rand = Math.floor(Math.random() * 14);
var los = document.querySelector("#los");
var cytat = data_base[rand];
los.innerHTML = cytat;
});
var data_base = [
"Warto się uczyć nawet od wroga.",
"Pamiętaj zachować spokój umysłu <br> tak w nieszczęściu jak i w powodzeniu.",
"Odważnym szczęście sprzyja.",
"Nie nudzi cie te klikanie?",
"Ta też lubie placki",
"Ej czekaj to ty robisz ... <br> o boże, o kurwa!",
"Nieno serio skończ wkońcu",
"Strzel se w łeb <br> ponoć nie boli",
"jak myslisz ile to robiłem <br> hmm? 1 noc kocie",
"i po co ja ci to losuje...",
"Czas tracony z przyjemnością <br> nie jest czasem straconym",
"Skutki gniewu są dużo <br> poważniejsze od jego przyczyn.",
"Wiedza to władza. Ale <br> niewiedza nie oznacza jeszcze <br> braku władzy.",
"Mamy Wszystko <br> Czego potrzebujesz ❤",
];
// variables for admin panel (node list replacet to array) =>
var node_all_divs = document.querySelectorAll("div");
var arr_all_divs = [...node_all_divs];
var node_all_btns = document.querySelectorAll("button");
var arr_all_btns = [...node_all_btns];
var node_all_img = document.querySelectorAll("img");
var arr_all_img = [...node_all_img];
var node_all_a = document.querySelectorAll("a");
var arr_all_a = [...node_all_a];
var node_all_p = document.querySelectorAll("p");
var arr_all_p = [...node_all_p];
var node_all_h2 = document.querySelectorAll("h2");
var arr_all_h2 = [...node_all_h2];
// all elements in 1 array
var all_elem = (nums = arr_all_a.concat(
arr_all_btns,
arr_all_divs,
arr_all_h2,
arr_all_img,
arr_all_p
));
jeśli chcecie jeszcze coś innego to mogę dać tylko poproście ale pomóżcie... tu jeszcze screeny z noda i mondo że mi zwraca normalnie:
za wszystkie uwagi odnośnie kody też dziękuje bo się poduczę przynajmniej
