Brightie
Brightie
KPCKevin Powell - Community
Created by Brightie on 11/17/2024 in #back-end
sending data with uri (but doesn't affect the page its trying to reach)
No description
4 replies
KPCKevin Powell - Community
Created by Brightie on 9/29/2024 in #front-end
:nth-child(odd), :nth-child(even)
No description
87 replies
KPCKevin Powell - Community
Created by Brightie on 9/24/2024 in #front-end
Transition on modal.close()
No description
29 replies
KPCKevin Powell - Community
Created by Brightie on 1/27/2024 in #back-end
Help setting up
Hi! So I am new to back-end, decided to learn it via a tutorial Can anyone help me get started? I've tried several things as to a workable demo (as that is required in step 1), but so far I've got no luck correctly launching the page outside of the Live Server from vsc
24 replies
KPCKevin Powell - Community
Created by Brightie on 1/27/2024 in #back-end
Deploying...
No description
7 replies
KPCKevin Powell - Community
Created by Brightie on 12/25/2023 in #front-end
array object remove
Hey, I'd like some help I've been trying things for the past 30 mins and I jsut can't figure it out! I've completely made the add, create, delete functions they all work as they are supposed to UNTIL I remove the first object, then it all goes to shit and no longer functions and I just can't figure out why tf this is happening Whenever I look at the console.log(articles) in the console while messing around it ALWAYS returns the correct amount of objects in the array UNTIL I even dare remove the first object, then it just breaks apart and the first object that's supposedly removed persists within the array Yet every other element gets removed as intended, I don't get why this very first object is messing it up I can edit its data as much as I want, no issues but when I delete it, it just messes everything up and the deletion is just a compare(a,b, index) if(a==b)articles.splice(index,index) Can someone please save my soul If you want to fiddle around, here's the link https://brights-store-app-prototype.netlify.app (for those who don't speak dutch and prefer fiddling around to figure out whats making this happen; "opslaan" means save, clicking this will commit the changes "annuleer" means cancel)
32 replies
KPCKevin Powell - Community
Created by Brightie on 12/25/2023 in #front-end
How to removeEventListener
Hiya! So I need a function removed upon clicking, I've read the docs and I've tried it several ways, also checked the console to see if I could find something useful, but to no avail Maybe I am just misunderstanding it Anyway, in image you'll see the function I need removed (its the one in dynamicpageload) Here is how the js handling this currently looks like:
function pushNewArticle(element){
const parent = element.parentElement.parentElement
const newArticle = {}
newArticle.articleBrand='default'
newArticle.articleName= parent.children[0].children[1].value
newArticle.articleEan= parent.children[1].children[0].children[1].value
newArticle.articleHope= parent.children[1].children[1].children[1].value
newArticle.articleExpiryDate = parent.children[1].children[2].children[1].value.split("-").reverse().join("/")
newArticle.articleAvailability='Beschikbaar'
articles.push(newArticle)
showExpireSoonDigit()
createArticleCard(newArticle, (articles.length-1))
}

getObjectByClass("dialogSave").addEventListener("click", (element) => pushNewArticle(element.target))


getObjectByClass("fa-pen-to-square").addEventListener("click", function(){
/* Ive already tried several methods below for calling onto it */
getObjectByClass("dialogSave").removeEventListener("click", (element) => pushNewArticle(element.target))
})
function pushNewArticle(element){
const parent = element.parentElement.parentElement
const newArticle = {}
newArticle.articleBrand='default'
newArticle.articleName= parent.children[0].children[1].value
newArticle.articleEan= parent.children[1].children[0].children[1].value
newArticle.articleHope= parent.children[1].children[1].children[1].value
newArticle.articleExpiryDate = parent.children[1].children[2].children[1].value.split("-").reverse().join("/")
newArticle.articleAvailability='Beschikbaar'
articles.push(newArticle)
showExpireSoonDigit()
createArticleCard(newArticle, (articles.length-1))
}

getObjectByClass("dialogSave").addEventListener("click", (element) => pushNewArticle(element.target))


getObjectByClass("fa-pen-to-square").addEventListener("click", function(){
/* Ive already tried several methods below for calling onto it */
getObjectByClass("dialogSave").removeEventListener("click", (element) => pushNewArticle(element.target))
})
This js code is incomplete and I'll eventually make sure that no eventListeners & variables are outside of a function, for now I just want it to work before I wrap them in for example "initPageLoad()" If anyone is confused, basically when it's to add a new object, this "save" button will need to create the object However, the same dialog screen is used to edit existing articles, but it obviously shouldn't create a new object but edit the existing ones, hence it'll need a different function attached, not the pushNewArticle function
6 replies
KPCKevin Powell - Community
Created by Brightie on 12/25/2023 in #front-end
Object won't go hidden
Hey so, in the image you'll see that the trashcan should have the hidden class, yet the trashcan is not hidden.. The trashcan object is: <i class="fa-solid fa-trash-can articleDeleteTrash" style="color:white; cursor:pointer;"></i> the css of hidden is:

.hidden{
display:none;
visibility: none;
}

.hidden{
display:none;
visibility: none;
}
Okay, while writing this update... So sometimes on the live after refreshing it it is working, yet other times it is not... I'd prefer no inconsistenties All that I did inbetween it not working and it working was make sure the css file is linked by simply putting the body:background-color:red to confirm it indeed being linked After confirming it was linked I wanted to add that to this message and then somehow it started working as it should Any idea if this inconsistency is just due to Live servers Or some other reason? Because if this inconsistency is bc of live servers sometimes loading weirdly, then it shouldn't be a problem when I push it to the internet But if it is something else then I'd like to figure out why and prevent it from happening
29 replies
KPCKevin Powell - Community
Created by Brightie on 12/9/2023 in #front-end
vertical align
Hey so, I'm probably just being stupid but, I can't get my div to vertically align to the center, even made my body a flex to try and get it to work 😂 Can anyone point out what I'm doing wrong pretty please? thanks ❤️ codepen: https://codepen.io/BrightDN-the-sasster/pen/abXMqXq
191 replies
KPCKevin Powell - Community
Created by Brightie on 11/27/2023 in #front-end
JavaScript querySelect & document.getBy issues
No description
51 replies
KPCKevin Powell - Community
Created by Brightie on 11/15/2023 in #front-end
Help w/ Dialog
No description
3 replies
KPCKevin Powell - Community
Created by Brightie on 10/2/2023 in #front-end
Form submitting
No description
31 replies
KPCKevin Powell - Community
Created by Brightie on 9/26/2023 in #front-end
Quirky numbers in javascript
No description
84 replies
KPCKevin Powell - Community
Created by Brightie on 9/26/2023 in #front-end
Array issue (Unwanted changes to the array)
No description
5 replies
KPCKevin Powell - Community
Created by Brightie on 8/27/2023 in #front-end
Grid issues
Okay so, I've been fiddling with this for over 30 minutes, trying various things but I just don't get the result I want https://codepen.io/BrightDN-the-sasster/pen/RwEroVO THis is the codepen, basically I need the items in the grid to be square and have the size of the border around adjusted to the size of the bingo (For some reason I'm even failing to get that right lol) (As this is a 3x3, the squares can be a bit bigger just have to make sure it doesn't end up requiring scrolling as Id love this design to work both phone and pc alike) If you look on the codepen, I got them square, but the grid is...Still big, bigger than the items it contains lol But I was also wondering if it is possible to automatically change it depending on gridSize it goes from 3x3 all the way to 7x7 obv the 7x7 requiring the smallest possible options I was already thinking of doing it with a switch in javascript and switch out classes depending on chosen GridSize But I was wondering if its possible to do this CSS only, as if it is, that'd be much more efficient Basically, eventually it'll need to somewhat have the same idea as my prototype, just.. More, bigger, customizeable https://brightdn.github.io/sv/ ^ See how square they are in link above and not an enormous white spat next to it? I can't recreate what I originally made... And one is w/ flexbox, the other w/ grid so I can't blindly take it over The prototype was created w/ only 1 gridsize in mind, namely 5x5, in the current iteration of it it needs multiple sizes and so obv the design has to adjust correctly to it, but I am failing to do so The javaScript I'll have to add will not be an issue, I can handle the js fine on my own, it's just css that's a weakpoint for me, as designing isn't my strong suit, so I never managed to find some love for css to really dig into it (Shoutout to one of the people here that gave me more insight of how array manipulation works btw, its extremily useful, way more efficient than what I did)
58 replies
KPCKevin Powell - Community
Created by Brightie on 8/27/2023 in #front-end
Fixing margin(?) issue
No description
3 replies
KPCKevin Powell - Community
Created by Brightie on 8/24/2023 in #ui-ux
Suggestions & Opinion on how to design this
Hey! Would someone be willing to give their suggestions/ideas on how to improve on this designwise? Logics no issue, but design, that's an issue for me, I am really bad at it I feel the return to select (which I'll make "return to hub" doesn't feel right and the general width doesn't either, but I can't make it smaller as some names require more space and making them extra long to make them a nice square feels odd too. Sidenote, "Options > timed" doesn't do anything just yet If that is selected, it will generate the bingo as well as a countdown timer, I haven't made the countdown timer yet, but I'm planning to build it with JS, I just need a good design for it and a place Second Sidenote, please don't mind that the javascript has 15K+ lines, almost all is going to be converted to JSON files eventually and even be split up in multiple JSON files
2 replies
KPCKevin Powell - Community
Created by Brightie on 8/15/2023 in #front-end
Confused on JS error
6 replies
KPCKevin Powell - Community
Created by Brightie on 8/10/2023 in #front-end
.json
40 replies