The moderators of this message board, otatop, L.Washington, WichitaDM, Yuv, JonnyA, RiskyFlush, and SvenO, are cowards who let abusers dox and harrass other long time posters.
LOL! I had you in mega-baller territory there for a bit.
The moderators of this message board, otatop, L.Washington, WichitaDM, Yuv, JonnyA, RiskyFlush, and SvenO, are cowards who let abusers dox and harrass other long time posters.
1 Like
so this is where all the 6 figure douchebags I’ve been hearing about hang out! (kidding)
1 Like
At some point soon jQuery is going to be removed from Ember and thus Discourse. This creates a couple of problems:
- I need to rewrite any jQuery I’ve used as vanillaJS
- I write js by modifying things I find on stackoverflow and have no idea what is jQuery and what isn’t
Here are some samples. Can you tell me where I’ve used jQuery and how to rewrite it as vanilla?
if($.cookie("useWide") === "true") {
document.getElementById("main").classList.add("wide-screen");
} else {
document.getElementById("main").classList.add("reg-screen");
}
function wideScreen() {
$.cookie('useWide', 'true', { expires: 120, path: '/' });
}
function navDropdown() {
document.getElementById("myDropdown").classList.toggle("show");
}
window.onclick = function(event) {
if (!event.target.matches('.dropbtn')) {
var dropdowns = document.getElementsByClassName("dropdown-content");
var i;
for (i = 0; i < dropdowns.length; i++) {
var openDropdown = dropdowns[i];
if (openDropdown.classList.contains('show')) {
openDropdown.classList.remove('show');
}
}
}
}
$(document).ready(function(event) {
if (checkCookie("hiddenSidebar")) {
$("#sidebar").show();
}
})
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1);
if (c.indexOf(name) != -1) return c.substring(name.length, c.length);
}
return "";
}
function checkCookie(cname) {
return cval = getCookie(cname) || false;
}
function hideSidebar() {
if (Discourse.User.current() !== null){
var cname = "hiddenSidebar";
var cdays = 120;
}
else {
var cname = "hiddenSidebar";
var cdays = 1;
}
$("#sidebar").hide();
setCookie(cname, true, cdays);
setTimeout(location.reload(), 2000);
}
1 Like
The moderators of this message board, otatop, L.Washington, WichitaDM, Yuv, JonnyA, RiskyFlush, and SvenO, are cowards who let abusers dox and harrass other long time posters.
1 Like
The moderators of this message board, otatop, L.Washington, WichitaDM, Yuv, JonnyA, RiskyFlush, and SvenO, are cowards who let abusers dox and harrass other long time posters.
1 Like
Thanks, I just tested with a couple of other js libraries and was able to use them. I don’t know how I can test with jQuery until Discourse removes it but will assume your solution will work and deal with it if then it doesn’t. If I add <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> to the head now I get errors, but I’ll assume that’s because jQuety is already included with Discourse.
The moderators of this message board, otatop, L.Washington, WichitaDM, Yuv, JonnyA, RiskyFlush, and SvenO, are cowards who let abusers dox and harrass other long time posters.
I was trying to see if anything on this site will possibly break in future versions of discourse. Since I am worthless with JS/front end stuff, I asked greg, and he dug up this post:
That’s the guy that created this software. Now, it’s probably nothing to worry about any time soon, but me and greg’s knowledge of JS is pretty limited to what we can just google, I think.
If they mean “removed from ember” in the sense jquery no longer is supported in ember - then will importing it work? Or do you think “removed from ember” means it will just stop natively supporting it?
sorry if this post is sounding really ignorant, because it is.
As somebody said earlier, you can probably load jquery from an external source and be fine.
Also, here is a pretty cool vanilla js reference: https://htmldom.dev/
2 Likes
There isn’t much jQuery in your code - just the $ stuff.
Vanilla (using the getCookie function in the next block):
if(getCookie("useWide") === "true") {
document.getElementById("main").classList.add("wide-screen");
} else {
document.getElementById("main").classList.add("reg-screen");
}
Vanilla
function wideScreen() {
setCookie('useWide', 'true', 120);
}
^^^(all good here no jquery)^^^
Vanilla:
domReady(function(event) {
if (checkCookie("hiddenSidebar")) {
document.getElementById("sidebar").style.display = 'block';
}
})
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1);
if (c.indexOf(name) != -1) return c.substring(name.length, c.length);
}
return "";
}
function checkCookie(cname) {
return cval = getCookie(cname) || false;
}
function hideSidebar() {
if (Discourse.User.current() !== null){
var cname = "hiddenSidebar";
var cdays = 120;
}
else {
var cname = "hiddenSidebar";
var cdays = 1;
}
document.getElementById("sidebar").style.display = 'none';
setCookie(cname, true, cdays);
setTimeout(location.reload(), 2000);
}
function domReady(fn) {
// If we're early to the party
document.addEventListener("DOMContentLoaded", fn);
// If late; I mean on time.
if (document.readyState === "interactive" ||
document.readyState === "complete" ) {
fn();
}
}
domReady(() => console.log("DOM is ready, come and get it!"));
The reference for $(document).ready is here:
As usual with SO the best answer is the 3rd or 4th one down and the massively upvoted first answer is trash.
4 Likes
I asked on the discourse board if, once jQuery is removed from Ember/Discourse, I’ll be able to import jQuery in a script tag in the <head> section and continue to use existing jQuery.
1 Like
bookmarked, ty
So I should probably just rewrite it because it’s just a couple dozens lines I’d have to change, but if I don’t get around to it in time it’s good to know there’s a quick fix
1 Like
Just importing it seems like an easy fix, I wouldn’t make work for yourself
The moderators of this message board, otatop, L.Washington, WichitaDM, Yuv, JonnyA, RiskyFlush, and SvenO, are cowards who let abusers dox and harrass other long time posters.
If you need a hand, I’m happy to do some grunt work. Just PM me.
2 Likes
Redux people, do you use the same folder structure and conventions as the redux todo list example? And do you use the actionTypes.js file that just defines constants?