• Hey, guest user. Hope you're enjoying NeoGAF! Have you considered registering for an account? Come join us and add your take to the daily discourse.

Web Design and Development |OT| Pixel perfect is dead, long live responsive design

Copons

Member
WordPress, the software, is not going JS. It's still PHP and MySQL based.

Automattic, the company behind WordPress.com and the steward of the WordPress software, offers a dashboard of sorts that allows you to control your WordPress sites, and this is through the commercial website, WordPress.com.

The WP Rest API allows you to interact with the core software (PHP/MySQL) using javascript (or Rails, Python, anything else that can interact with an API), but you're still using javascript to hit an API that gets its functionality from PHP and stores its data in MySQL.

I think when Automattic wrote that WordPress.com was rebuilt as a React application, people got the impression that WordPress, the open source software, was being rebuilt as a React application. It's not. Maybe one day, but probably not... WP is just not a project that fits the methodology of Node/React/MongoDB.

Yeah, you're totally right: I miswrote there.
I meant it more like "WP theming going JS". :)
 
How so (SQL vs. NoSQL flamewars not-withstanding)?

Not that it couldn't be done, it definitely could, but Node and npm are fundamentally driven by CommonJS philosophy: Provide a small piece of software that fits in with other smaller pieces to build a larger whole. WordPress, while it's the website system that I use in 95% of my client projects, doesn't seem to have this same mantra... It's a "kitchen sink" approach to websites... Posts, pages, categories, authors, taxonomies, menus, the WP_ table, non WP_ tables, and so on a hundred times through the software. You couldn't take the WordPress menu system and plug it into another system and have it work; likewise, taxonomies in WP like categories can't be taken from WordPress and stand-alone on their own. Everything references the post ID and the loop and so without the loop, those components just can't exist on their own. This isnt' just a technical design decision, but a philosophical direction of the software.

I just think that WordPress, philosophically, does not need to be replicated as a node application because it's just so philosphically different. If Automattic or anybody else wants to develop a WordPress-like blog application in node, then that's fine, but "porting" WP to it just seems like it'd be done in name only to piggyback on the familiarity and popularity with the system. The benefit of using WordPress for a project -- the huge theme repository, plugin repository, and knowledge base -- would be moot because none of those themes or plugins would work without being fundamentally rewritten by the author. As someone with a handful of themes and plugins out in the wild, I'm not going to do that (and frankly, don't have the expertise to either)
 
Not that it couldn't be done, it definitely could, but Node and npm are fundamentally driven by CommonJS philosophy: Provide a small piece of software that fits in with other smaller pieces to build a larger whole. WordPress, while it's the website system that I use in 95% of my client projects, doesn't seem to have this same mantra... It's a "kitchen sink" approach to websites... Posts, pages, categories, authors, taxonomies, menus, the WP_ table, non WP_ tables, and so on a hundred times through the software. You couldn't take the WordPress menu system and plug it into another system and have it work; likewise, taxonomies in WP like categories can't be taken from WordPress and stand-alone on their own. Everything references the post ID and the loop and so without the loop, those components just can't exist on their own. This isnt' just a technical design decision, but a philosophical direction of the software.

I just think that WordPress, philosophically, does not need to be replicated as a node application because it's just so philosphically different. If Automattic or anybody else wants to develop a WordPress-like blog application in node, then that's fine, but "porting" WP to it just seems like it'd be done in name only to piggyback on the familiarity and popularity with the system. The benefit of using WordPress for a project -- the huge theme repository, plugin repository, and knowledge base -- would be moot because none of those themes or plugins would work without being fundamentally rewritten by the author. As someone with a handful of themes and plugins out in the wild, I'm not going to do that (and frankly, don't have the expertise to either)

The modularity of Wordpress is already out there: as ES6 modules, as node modules, as React components, as Ember components, as web components. Take a look at the WP-Calypsos source and see how modular it is. Of course there are some Wordpress features and plugins that maybe couldn't be done in other ways non-trivially, but I'd say those would be far and in-between. Would most plugins and themes and whatever be ported? Most likely not. Should they be? Well, most likely not. And of course there would still be the legacy option for those who would want it. I am not really talking about taking the old Wordpress format and just porting it: but instead making it better, without legacy crutches. And most likely Automattic agrees, thus the new Wordpress.com.

One can always just stick with the old because it's "good enough" or great even, but that has very rarely paid off to anyone. Except for maybe enterprices, who can save a penny or two (and subsequentially lose it by wasting time at thinking about IE5 support on all of their 5000 intranet sites). Think about Wordpress, and then think about the rise of static page generators.
 

jesalr

Member
Ergonomically, the hamburger menu is a cop-out. It's saying "fuck that, let's put my stuff in a place where it's hidden, and I hope you don't mind changing your grip on your phone to reach that menu trigger because I'm gonna put it top right, motherfucker".

Sometimes you don't have a choice. Mostly though, you're going to have to think real hard about how users can navigate your content on mobile. Do you provide other points of entry in your layout and thus make the menu less of a necessity? Go for it. Do you provide quick-access links that are always available and cater to 99% of the use people have for a menu PLUS that hamburger in case they're 1%ers? Splendid. Does abstracting the menu make your storytelling and user engagement better? Yay! Are your doing it because "what else can I do" or "everybody does it"? Oh boy.

Hamburger menus are not the devil per se. They should not be an excuse for lazy design work either.

It's not even the ergonomics for me, there's this real disconnect for people and features once they're hidden behind those buttons.

Most users won't explore random menus, whether it's a hamburger or if it says MENU, so they get confused and can't find things that might seem obvious to tuck away in a menu.
 
So I'm working on a website for a client and stumped on how to implement something that is a very minor design flair, but it's something that I think the client will push back on.

I've blurred out identifying characteristics of the site and I'd just appreciate it if you don't try to do any sleuthing, from one developer to the next :)

So, this is a screenshot of the mock and it uses this 6 column grid, which I've got built out, and each cell in the grid has a light border applied to it... But the one thing I just can't get or even figure out how to tackle is the very light cross that they have at each of the joints of the grid... And you can also see how they sort of "trail" off of each border of the grid. I've highlighted these with the red dotted square... BUt they're wherever one border meets another at the joints, and they also trail off the box as well.

I'm not even sure how to approach this in CSS...

VcrSMq2.jpg


There's a few complicating factors:
  • I'm using Foundation for the grid / framework.
  • Each cell within the grid is using equalizer, Foundation's version of equal heights (so if one element grows, the others match in size).
  • The content is in a CMS, so those boxes can expand in size and will not be fixed assuming the client dumps more content into that intro paragraph (blurred).
  • The grid is responsive, I just have it dump down to 1 column on small screens, but it does complicate it because the columns grow taller/narrower as the device shrinks.
  • I'm using display: table; and display: table-cell to get the vertical alignment of the content within it... but that's something I could drop if need be and just tweak each cell specifically, or do with javascript if necessary.

I also can target any cell in this explicitly. I don't need to use an :nth selector or anything like that, each cell is its own class.. Which makes it easier.

Anybody got any ideas? Think I could place small sprites/svgs/images on the corners of each image... Place them absolutely...?

A beer from one developer to another if you have any thoughts. Thhhhanks!

*edit*

I might try something like this tomorrow, but I feel like it'll be a pain in the ass as the boxes reshape... But will try it.
 

Tathanen

Get Inside Her!
I'd probably do something like this:

Code:
.row {
    position: relative;
}

.row:first-child::before {
    content: "";
    position: absolute;
    background: url('cross.png');
    left: -5px;
    top: -5px;
}
.row:first-child::after {
    content: "";
    position: absolute;
    background: url('cross.png');
    right: -5px;
    top: -5px;
}
.row:first-child > div:not(:last-child)::after {
    content: "";
    position: absolute;
    background: url('vertical-tick.png');
    right: 0;
    top: -5px;
}

.row:not(:last-child) div:first-child::after {
    content: "";
    position: absolute;
    background: url('horizontal-tick.png');
    left: -5px;
    bottom: 0;
}
.row:not(:last-child) div:last-child::after {
    content: "";
    position: absolute;
    background: url('horizontal-tick.png');
    right: -5px;
    bottom: 0;
}

.row:last-child::before {
    content: "";
    position: absolute;
    background: url('cross.png');
    left: -5px;
    bottom: -5px;
}
.row:last-child::after {
    content: "";
    position: absolute;
    background: url('cross.png');
    right: -5px;
    bottom: -5px;
}
.row:last-child > div:not(:last-child)::after {
    content: "";
    position: absolute;
    background: url('vertical-tick.png');
    right: 0;
    bottom: -5px;
}

Pretty repetitive, you could abstract a lot of this into a reusable class using LESS or something. Works for a grid of any size, no need for extra HTML (assuming your grid has a container element). You can make some tweaks here, you could use a single cross image instead of the tick ones and make it overlap the grid lines, you'll get that more-opaque look in the comp that way, though they might not actually want that effect. You could also not use images at all, if the fade-out effect at the tips isn't necessary, and make each generated block a square with one or two semi-transparent border sides. Could ALSO not have "crosses" at all, and instead just run the horizontal and vertical ticks all the way to the edges, and have them overlap to produce the cross visual.

Either way tho, the crux is just a bunch of absolutely positioned generated content that relies on smart combinations of :first-child, :last-child, and :not.

Hopefully gets ya started!
 
I'm building a site with a TON of absolutely positioned images. I've been finding the correct position by hand via trial and error.

There... has to do a better way to do this, right? I know that graphical web editors suck, but I just need an interface that will let me move around absolutely positioned elements on a page.
 
I'm building a site with a TON of absolutely positioned images. I've been finding the correct position by hand via trial and error.

There... has to do a better way to do this, right? I know that graphical web editors suck, but I just need an interface that will let me move around absolutely positioned elements on a page.

Press F12 to open the devtools, select your image, modify the top/right/bottom/left, copy the values to your stylesheet, rinse and repeat. Or better yet, use an editor with livepreview capabilities and you can do all of this at the same time.

If you want to drag them around to position them, any draggable-library will work.
 

WanderingWind

Mecklemore Is My Favorite Wrapper
Press F12 to open the devtools, select your image, modify the top/right/bottom/left, copy the values to your stylesheet, rinse and repeat. Or better yet, use an editor with livepreview capabilities and you can do all of this at the same time.

If you want to drag them around to position them, any draggable-library will work.

I admire your restraint in not naming Brackets outright. Seriously, though, after I got rid of my old fashioned habits, I've ditched every other editor besides CoffeeCup. I can't quite ditch that old habit. Brackets is great for meaty work, but CC lets me test any sort of code fragment without having to save the doc first. One click test. It's not good for anything else though.
 
I admire your restraint in not naming Brackets outright. Seriously, though, after I got rid of my old fashioned habits, I've ditched every other editor besides CoffeeCup. I can't quite ditch that old habit. Brackets is great for meaty work, but CC lets me test any sort of code fragment without having to save the doc first. One click test. It's not good for anything else though.

Hehe, you got me. Admittedly Brackets' built-in live preview is great, even though I don't use it myself. I do mostly React stuff nowadays, and hot loading is pretty much the sweetest thing ever.
 

grmlin

Member
I'm building a site with a TON of absolutely positioned images. I've been finding the correct position by hand via trial and error.

There... has to do a better way to do this, right? I know that graphical web editors suck, but I just need an interface that will let me move around absolutely positioned elements on a page.

I had to do something similar and, for the time of development, created a simple jquery ui draggable script. You could also add keyboard events to move the images with the arrow keys.
 

grmlin

Member
So I'm working on a website for a client and stumped on how to implement something that is a very minor design flair, but it's something that I think the client will push back on.

I've blurred out identifying characteristics of the site and I'd just appreciate it if you don't try to do any sleuthing, from one developer to the next :)

So, this is a screenshot of the mock and it uses this 6 column grid, which I've got built out, and each cell in the grid has a light border applied to it... But the one thing I just can't get or even figure out how to tackle is the very light cross that they have at each of the joints of the grid... And you can also see how they sort of "trail" off of each border of the grid. I've highlighted these with the red dotted square... BUt they're wherever one border meets another at the joints, and they also trail off the box as well.

I'm not even sure how to approach this in CSS...

...

There's a few complicating factors:
  • I'm using Foundation for the grid / framework.
  • Each cell within the grid is using equalizer, Foundation's version of equal heights (so if one element grows, the others match in size).
  • The content is in a CMS, so those boxes can expand in size and will not be fixed assuming the client dumps more content into that intro paragraph (blurred).
  • The grid is responsive, I just have it dump down to 1 column on small screens, but it does complicate it because the columns grow taller/narrower as the device shrinks.
  • I'm using display: table; and display: table-cell to get the vertical alignment of the content within it... but that's something I could drop if need be and just tweak each cell specifically, or do with javascript if necessary.

I also can target any cell in this explicitly. I don't need to use an :nth selector or anything like that, each cell is its own class.. Which makes it easier.

Anybody got any ideas? Think I could place small sprites/svgs/images on the corners of each image... Place them absolutely...?

A beer from one developer to another if you have any thoughts. Thhhhanks!

*edit*

I might try something like this tomorrow, but I feel like it'll be a pain in the ass as the boxes reshape... But will try it.

Hi,
I would do something like this I think: http://codepen.io/grmlin/pen/rOXbrR (quick and dirty).

There are multiple ways to add the dots via pseudo elements, you may have to adjust them for the grid you use.
I'm not familiar with foundation, so this is a little bit of speculation on my side ;) I hope they don't mess around with overflow:hidden, as this will make it very hard to move the crosses out of the boxes itself.
 
One of the latest stable Chrome releases caused part of our JS to chew 25% CPU which somehow freezes the page. Older and beta/canary Chrome are fine. Broken on Chrome, works on IE. What a time to be alive!
 

mugwhump

Member
Sending my first invoice, how do you guys do payment? I'd use paypal but it seems they charge a fee which I'm not keen on.

Should I just send her my banking info? I'm also close enough to her house that I could just go over and pick up a cheque.
 

Copons

Member
You know what time is it?
It's rant time!
Aren't you happy?


Previously: my main project is on hold because reasons, I was sent to another team to help them finalize their software, one month before the deadline.
This new project holds together a bunch of huge ass databases one of the major Italian banks, allowing their people to do stuff with an astounding amounts of different kind of documents, each of an unbelievable amount of different data.
For dumb reasons, we're developing on a virtual machine on the client's dev server, struggling to even move the mouse over there, because of the dozens of proxies and shitty connection we have in our office.



Don't know why, but when my team planned the application, decided that the best way to approach the differences between the various documents types and subtypes was to disregard the hierarchy (and relative inherited fields, that repeats everywhere) and instead to create a distinct view for each document subtype (only one controller, though), naming them with the overdescriptive name of "document1", "document2" and so on, up to almost 100.
Each view have a dozen sections, some shared, some other "personal" (which usually mean there are a couple of fields that are different per parent-type).
Debugging this mess is basically impossible, as the work involved to get on screen the precise document you want requires way, way more effort then just sending the client a mail saying everything works ok enough.

But today I'm not complaining about this.
Oh no.

Thing is, each document needs to be exported to PDF.
I can instantly figure out an easy approach: take the data obtained in the aforementioned controller, pass it through some random PDF Java library, and print it howewer I need, following the pattern already employed in the front-end views, but much simpler, without all the HTML and whatnot.

Instead, they decided to follow the hardest, longest and most frustrating path ever conceived.

Build the templates in ODT via OpenOffice and feed them to the ODT-PDF converter Java library, which builds the PDF and replace the variables in the template with whatever data it gets.
We're talking about almost 100 different .odt, manually written following a mapping excel sheet provided by the client, that gives us the field labels and approximately what variable they're bound to.

Then, we have to send the ODT to the server (fastest way we figured out: use the draft system in our mailboxes, open in our computers and on the server), download it in the Eclipse workspace, refresh the folder, republish the project, reload the browser to gain new login credentials, send a request via Postman that saves the PDF somehwere on the server.
If there are formatting errors in the ODT (and there are, inevitably, because any word processor will fill its pages with invisible trash code), we'll have to go uncompress it, open the content.xml, indent it and try to find the culprit character in 100K lines files; then we have to hope we wrote all the variables names correctly, but there at least the server console accurately logs the error. If something went wrong, though, we are back to square one.
Finally, we can compare the PDF with its website page, to check if they show the exact same data everywhere.

Whenever the client remembers to add or remove a field from the PDF, or we notice they made some errors in the mappings, everything starts over again.
For pretty much every single ODT, because more often than not, the errors focus on shared fields.

On top of this, one hour ago I discovered that a whole bunch of documents showed different data between PDF and site, and it turned out it was the back-end's fault.
I immediately notified the back-end people.
What's the point of keep writing this fucking ODTs if when testing them I can't possibly know it the errors are my fault or theirs.
Also, what's the point of everything, if the clients explicitly told us that the current PDFs are too long, so we'll have to trim them down eventually.
But the team leader is firm: I have to keep writing as many templates as I can.


Now this thing is quickly sending me straight back to depression (long story, not the time nor the place), but my position here is too unstable - and I need this money - to actually and properly fuck them off, and I'm scared shitless I'll end up having an outburst with someone here (something I used to have in the past, but stopped having many years ago), screwing everything up.
 

Somnid

Member
Good Lord that sounds terrible. You are looking for other jobs right? That seems entirely unsustainable both for you, the team and the business and you probably need to get yourself out ASAP.
 

Copons

Member
Good Lord that sounds terrible. You are looking for other jobs right? That seems entirely unsustainable both for you, the team and the business and you probably need to get yourself out ASAP.

I'm not, because I feel kinda like I'm in-between skillsets, fully obsolete on PHP/WordPress, too junior on JS.
When I was unemployed I had time to learn Angular and whatnot, but now, when I get back home I just want to stuff my face in my cats fluffy bellies.

I'd like to refresh my personal site in Angular Material, I'm working on a CSS framework just for fun and to improve my barren GitHub profile.

I mean, at this point I'm scared because my skillset isn't worth anything and I'd waste too many shots applying prematurely to jobs I'd actually care for.

Dunno if I'm explaining myself, I'm still at work and I'm kinda, well, bothered right now
 
Well, with all those stories, you could go for a Kickstarter for a book ... i would read it, even throw 10 bucks for the funding! :)

Also ... i would consider myself a mediocre developer ... but some of the stuff in your post is on a level of fail i haven't even witnessed on the interns at my job.
There are things that defy common sense and school level of logical thinking. (From your co-devs, not you)

Also, look for other jobs and keep the current one as long as you get something else, and don't think that you are not qualified for others places ... if the people you work with were able to get a job, you shouln't really have any problems.
 

Copons

Member
Well, with all those stories, you could go for a Kickstarter for a book ... i would read it, even throw 10 bucks for the funding! :)

Also ... i would consider myself a mediocre developer ... but some of the stuff in your post is on a level of fail i haven't even witnessed on the interns at my job.
There are things that defy common sense and school level of logical thinking.

AH!
I thought several times of opening some kind of blog writing about how big corporations actually works, even on extremely important and delicate projects (I hear other teams telling scary stories about the utter lack of security for several banks sites' user areas - but I was also relieved my bank wasn't on that list :D ), using junior developers (fresh from university, first real programming experience) for critical jobs, even at planning stage.

I guess that would work wonder for my career, if at some point someone manages to connect the dots of who I am, who I work for and what I'm working on. :D


Anyway yes: it's baffling how a team of a dozen programmers can't even do a damn google search for "java pdf library", to take a fully programming approach, and choose to write a gazillion ODT files instead. Even tho an ODT file is basically an XML file with lots of useless noise, so at that point why the heck didn't they choose to code straight up XML, even following the ODT markup if needed?
 
AH!
I thought several times of opening some kind of blog writing about how big corporations actually works, even on extremely important and delicate projects (I hear other teams telling scary stories about the utter lack of security for several banks sites' user areas - but I was also relieved my bank wasn't on that list :D ), using junior developers (fresh from university, first real programming experience) for critical jobs, even at planning stage.

I guess that would work wonder for my career, if at some point someone manages to connect the dots of who I am, who I work for and what I'm working on. :D


Anyway yes: it's baffling how a team of a dozen programmers can't even do a damn google search for "java pdf library", to take a fully programming approach, and choose to write a gazillion ODT files instead. Even tho an ODT file is basically an XML file with lots of useless noise, so at that point why the heck didn't they choose to code straight up XML, even following the ODT markup if needed?
Think of it as a second career or a project for the time after retirement. And you wouldn't be the first dev to vent. ^^
Just keep it "anonymous" and remember to use altered names for companies and people ... like Cuca-Culo, or Nyke. ;D

Oh and btw. a friend of mine works as a contracted IT consultant in a number of medium to large companies here where i live ... he basically described his job as follows: "I get paid to yell at some higher ups because their IT everything is bad and sucks. Then i plan some IT everything stuff, only to yell at them again for ignoring every single advice!"

See? Sometimes you even get paid for bringing out the truth bombs! ^^
 

Somnid

Member
I'm not, because I feel kinda like I'm in-between skillsets, fully obsolete on PHP/WordPress, too junior on JS.
When I was unemployed I had time to learn Angular and whatnot, but now, when I get back home I just want to stuff my face in my cats fluffy bellies.

I'd like to refresh my personal site in Angular Material, I'm working on a CSS framework just for fun and to improve my barren GitHub profile.

I mean, at this point I'm scared because my skillset isn't worth anything and I'd waste too many shots applying prematurely to jobs I'd actually care for.

Dunno if I'm explaining myself, I'm still at work and I'm kinda, well, bothered right now

You might want to try. Wordpress/PHP is still very heavily used, not so much in glamorous new projects but certainly not usually in disasters like that. Or take the hit and get hired as a junior in something else, often times you can work up pretty quickly since the skills are typically transferrable.
 

Daffy Duck

Member
Sounds like a ramped up version of the place I work where the guy who used to wok here just did stuff in languages he was learning on the fly with live client projects, and didn't even get a spec from what the clients want to do.

He did a PDF generator for a load of forms that generated a file PDF that was submitted back to the person who created it with a whole host of hacks and things talking to each other, and there are problems with fields not working properly or not showing on the submission. He winged it basically, and this is for a massive global organisation that was done and 'managed' by a team of 1.
 

Copons

Member
Also, look for other jobs and keep the current one as long as you get something else, and don't think that you are not qualified for others places ... if the people you work with were able to get a job, you shouln't really have any problems.

This is actually true, and I'll say this especially for any young dev just starting out their careers: people in higher positions don't know shit about anything.
When I started here, after years of unemployment/self-employment (so, with nothing to compare my work to), I thought I was severely underskilled for the task.
But fuck it, even a dumb idiot like me is fucking Alan Turing compared to the Java drones that work in big ass corporate jobs.

Once all employees received a mail asking for an self-evaluation of all the skills currently needed in this branch.
I've seen my boss writing down 5/5 (labeled something like "years of professional use") in HTML5/CSS3/JS because, as he actually said to me, he once did a site for his fantasy soccer league.

I mean, I've been a web dev since way before Chrome, when writing with IE6 in mind was the norm. And I wrote 4/5 for HTML5 and CSS3, because I'm not the fucking W3C, and after so many years I still have to look up if even and odd are pseudo classes or parameters of nth. :D

Think of it as a second career or a project for the time after retirement. And you wouldn't be the first dev to vent. ^^
Just keep it "anonymous" and remember to use altered names for companies and people ... like Cuca-Culo, or Nyke. ;D

Oh and btw. a friend of mine works as a contracted IT consultant in a number of medium to large companies here where i live ... he basically described his job as follows: "I get paid to yell at some higher ups because their IT everything is bad and sucks. Then i plan some IT everything stuff, only to yell at them again for ignoring every single advice!"

See? Sometimes you even get paid for bringing out the truth bombs! ^^

Cuca-Culo sounds definitely great, here in Italy!!

I'm working as a contracted consultant myself, but I'm still new on the job (also, my contract is pending renewal, so I'd better keep it quiet for the next bunch of weeks :D ) so yelling orders doesn't feel right yet.

But I sincerely hope to finally manage to lift my lazy ass and send out resumes left and right before that does feel right, because I really can't see my future in a corporate environment.
 

Copons

Member
Yo, finally home for the weekend, kinda feels like oxygen really.

I'm sorry for having vented out and stuff, but today has been quite a harsh day and it's not like I can go to my non-programmer girlfriend telling her eh today I got frustrated writing a bunch of PDF and expecting the right compassion. :D
So hey, for what is worth, thank you all for reading the post and commenting and everything. It made me feel better indeed.


You might want to try. Wordpress/PHP is still very heavily used, not so much in glamorous new projects but certainly not usually in disasters like that. Or take the hit and get hired as a junior in something else, often times you can work up pretty quickly since the skills are typically transferrable.

I didn't quite mean that PHP/WP is obsolete, instead that my skills are obsolescent, as I didn't touch a line of PHP in like a year, and I'm kinda out of the loop of WP evolution.

And yeah, I'd feel actually glad to start over as a junior (not that what I'm doing now can be described as senior in any way conceivable :D ), as long as it's in a comfy environment with some cool people to learn from, and not dumb managers that got up there just cutting costs and delivering shit dressed up as cupcakes for even dumber clients.
 

jesalr

Member
Anybody have any experience with JS libraries for reordering lists with drag & drop? The HTML5 standard is appalling
 
Anybody have any experience with JS libraries for reordering lists with drag & drop? The HTML5 standard is appalling

My team used JqueryUI sortable, but only to get the IDs of the moving and target element. Update the model and then let React rerender the list.
 

Daft Bird

Member
Hi, I need some help on a CIS 111 project, its in JavaScript. I don't know how to approach this

"After the above functions are written and tested, write a function named verbalizeCash that accepts a value in dollars and cents and returns a string showing the correct number of bills and coins:


Example of wanted result:
verbalizeAmt(595.40) => "$595.40 = 5 Franklins 4 Jacksons 1 Hamilton 1 Lincoln 1 Quarter 1 Dime 1 Nickel"


For the individual bills I used this function for each of the amounts:
function numofWilsons(num){
num = num/100000;
num.toFixed(2);
return num
}
I would really appreciate some help on this, Thanks!
 

Somnid

Member
Hi, I need some help on a CIS 111 project, its in JavaScript. I don't know how to approach this

"After the above functions are written and tested, write a function named verbalizeCash that accepts a value in dollars and cents and returns a string showing the correct number of bills and coins:


Example of wanted result:
verbalizeAmt(595.40) => "$595.40 = 5 Franklins 4 Jacksons 1 Hamilton 1 Lincoln 1 Quarter 1 Dime 1 Nickel"


For the individual bills I used this function for each of the amounts:

I would really appreciate some help on this, Thanks!

It's hard to tell what exactly what you want but I'm guessing it's how to get the fewest number of bills to make up the amount. Take the starting amount and then starting with the largest bill type:

- divide to get the greatest number of bills that can make up the amount
- modulus to get the remainder that you can't satisfy with that bill type
- repeat with the remainder and the next smallest bill
 

Daft Bird

Member
It's hard to tell what exactly what you want but I'm guessing it's how to get the fewest number of bills to make up the amount. Take the starting amount and then starting with the largest bill type:

- divide to get the greatest number of bills that can make up the amount
- modulus to get the remainder that you can't satisfy with that bill type
- repeat with the remainder and the next smallest bill

Thank You this helped me a lot!
 

WanderingWind

Mecklemore Is My Favorite Wrapper
I'm running into another wallbanger. I'm trying to put together a simple slider based on bxslider. The problem is that it looks fine until I put it up on our site. The CSS on mine conflicts with some usage of bxslider that was done in the past, even though I'm hosting the files on a separate server and went through and renamed all the classes to some ridiculous stuff. The javascript that populates the pager depends on the base bxslider.js and no matter what I do, the CSS continues to get pulled from the legacy file on some ancient ass server somewhere and it overrides mine. I even went crazy for like, 10 minutes and just tagged every element with !important.

Is there something super simple I'm missing here?
Conversely, does anybody know of a better or different plugin that allows me to go

BIG OLD PHOTO
thumb thumb thumb
caption for photo

Or, can somebody point me to a decent tutorial on how to get that accomplished?
 

Copons

Member
I've just realized one of the three main controllers of the project I'm helping with is a JS file consisting of 6935 lines, 269255 chars and 30 levels of indentation.

I'm too scared to check the other two...
 

D4Danger

Unconfirmed Member
I've just realized one of the three main controllers of the project I'm helping with is a JS file consisting of 6935 lines, 269255 chars and 30 levels of indentation.

I'm too scared to check the other two...

any chance it's been compiled to js?

because if not then you can almost guarantee the quality of that code is crap and will never die
 

Copons

Member
And probably no unit tests or useful comments? I know that feel

No unit test (but there I can't complain, as I'm guilty of that too! :p ), and no comments at all, excluding some commented lines of what I hope is legacy code, but I'm pretty sure is simply non working code they never deleted.

any chance it's been compiled to js?

because if not then you can almost guarantee the quality of that code is crap and will never die

There is no task runner in place, nor they're using some uglification tool I'm aware of.
But, it's the frontend for a Java project, so it's in Eclipse and I don't know Eclipse and if/how processes JS, so I cannot exclude ultimately the code will be compiled in some ways.

[fake edit]
I guess I misunderstood what you were saying...
What do you mean "compiled to js"?
Anyway, no, it's a pretty standard (well, except its size) Angular controller, 100% hand-written.
 

D4Danger

Unconfirmed Member
[fake edit]
I guess I misunderstood what you were saying...
What do you mean "compiled to js"?
Anyway, no, it's a pretty standard (well, except its size) Angular controller, 100% hand-written.

I meant like was it C# or coffeescript or something that someone output to JS which would explain the indentation and stuff. I guess not though.
 

Daffy Duck

Member
I'm running into another wallbanger. I'm trying to put together a simple slider based on bxslider. The problem is that it looks fine until I put it up on our site. The CSS on mine conflicts with some usage of bxslider that was done in the past, even though I'm hosting the files on a separate server and went through and renamed all the classes to some ridiculous stuff. The javascript that populates the pager depends on the base bxslider.js and no matter what I do, the CSS continues to get pulled from the legacy file on some ancient ass server somewhere and it overrides mine. I even went crazy for like, 10 minutes and just tagged every element with !important.

Is there something super simple I'm missing here?
Conversely, does anybody know of a better or different plugin that allows me to go

BIG OLD PHOTO
thumb thumb thumb
caption for photo

Or, can somebody point me to a decent tutorial on how to get that accomplished?

You looked at slick carousel? One of the examples there has something like what you want I think of I understand correctly.
 

WanderingWind

Mecklemore Is My Favorite Wrapper
You looked at slick carousel? One of the examples there has something like what you want I think of I understand correctly.

I did look into that. What I'm trying to get is something like this
http://www.gamesradar.com/assassins-creed-iii/screenshots/
But with captions underneath. Slick doesn't seem to allow that natively. It'll put the captions above the pager/thumbnails. bxslider does really well because it lets you position the elements as you want (with some tweaking of z-index and margins).

On another note, is there a way to compartmentalize an element like a slider so that it doesn't take anything from other CSS stylings? I don't know what the old guard did to lock everything down the way they do, but I can't even have anything with a *body without it breaking the entire page.
 

grmlin

Member
I did look into that. What I'm trying to get is something like this
http://www.gamesradar.com/assassins-creed-iii/screenshots/
But with captions underneath. Slick doesn't seem to allow that natively. It'll put the captions above the pager/thumbnails. bxslider does really well because it lets you position the elements as you want (with some tweaking of z-index and margins).

On another note, is there a way to compartmentalize an element like a slider so that it doesn't take anything from other CSS stylings? I don't know what the old guard did to lock everything down the way they do, but I can't even have anything with a *body without it breaking the entire page.

Scoped CSS was never really supported by browsers and I think it's not coming any time soon in favor of shadow dom, web components and all these fancy new techniques.

http://caniuse.com/#feat=style-scoped

Until we can safely use web components in ALL browsers (and not just chrome) we have to rely on other tools.

I for myself use BEM to get rid of css inheritance, specificity and other side effects with external libraries in my CSS. I can't recommend it enough, it solved so many problems that there is no way I can live without it anymore.
It looks a little bit ugly at first, but everyone I know got used to it.

There are other approaches similar to BEM, but I never tried them.

http://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/
 

Deltoid

Banned
angular 2 beta is out :D and some of the features are so hype

but all my friends are raving about react

what do I do

thoughts on angular vs react?
 

grmlin

Member
I never liked Angular, and Angular 2, with all these Typescript roots, looks even worse to me. No way I'll try that.

React on the other hand is one awesome framework and I love it. I recently started using redux, and after some "getting used to" it really shines.
I like the fact, that much less magic is involved in contrast to the other flux libraries I tried.
 

Somnid

Member
I don't like these frameworks, I especially don't like that elegant primitives like Object.observe were dropped because popular frameworks couldn't make use of it with all their custom baggage.
 
Top Bottom