Friday, February 28, 2014

Size does matter with Bootstrap

So I figured out this cool way to dynamically change the size of a column in Bootstrap with angular.  It's pretty slick.  Check it out:
 
<span ng-class="{true: 'col-lg-2', false: 'col-lg-3'}[TypeID == 1]">...</span>
 
That's it!
 
Okay, so what it does:  It's using AngularJS, as you probably noticed by the 'ng-class' tag.  So the TypeID is a model.  This code is actually inside an ng-repeat.  So if the TypeID is equal to 1, then make the column only 2 big in Bootstrap.  If you're unfamiliar with this, click here for Bootstrap Knowledge.  So, if it's not 1, it's 3 big.  This TypeID is set dynamically in my code not show by a dropdown list selection. 
 
If you have trouble with this, post a comment and I'll give a more thorough example, perhaps on jsfiddle.
 

Wednesday, February 26, 2014

Sweet Select2's in Angular!

So I had this awesome idea to make my Select2 dropdown much nicer by adding group names to the dropdown.  { Yes, I know, novel idea! }  The problem is... it's Select2.  Which I guess wouldn't be such a big deal, but I'm also binding my dropdown with Angular.  If you're not technical, let me help you out by saying stop reading and move on.

So, this is how I { with the help of a colleague } did it:

<select ui-select2="{allowClear:true}" data-placeholder="Product" class="input-max ProductDropdown" ng-model="ProductID">

<optgroup label="Ranged">

<option ng-repeat="p in Products | filter: { IsRanged: 'true'}" value="{{p.ProductID}}">{{p.ProductName}}</option>

</optgroup>

<optgroup label="No Range">

<option ng-repeat="p in Products | filter: { IsRanged: 'false'}" value="{{p.ProductID}}">{{p.ProductName}}</option>

</optgroup>

</select>
 
 


Well, first it's not perfect.  I could have done this in javascript when I was instantiating the select2, but I chose this route since the form is way more complex.  This select lives in 'n' number of rows, repeated with an Angular directive template.  SO... while the SAME list is getting filtered twice { once for Ranged, once for NonRanged }, it is very fast and very nice looking. 

I'm happy with the result.  It's not the most efficient code written, but it works and enhances the user's experience.  Win-win!

Why not now?

In programming, much like life, everyone has that moment when we really want to work on a project or we really want that promotion/job, and for whatever reason it just doesn't happen.  This can take its toll on our ego and make us question our role.  I'd ask you to steal yourself from moments like these and continue to look forward.  Don't let missed opportunities get you down.  There will be other projects, other jobs, other opportunities.  Just keep coding!

Friday, February 21, 2014

What's wrong with MY code?

Never miss the opportunity to have someone review your code. 

I use to play chess in high school.  During some of my more competitive matches, I always had an audience watching.  When the match was late and moves were crucial, people would always gasp and grunt in frustration.  What did they see that I didn't?  What did I miss?  Coding is a lot like that.  Sometimes you just stare at code so long that you don't see what it's doing... you see what you think it's suppose to do.  Code reviews can help flush out things you may have missed.

Just the other day, I had a review done on my code.  The reviewer found some slow spots in my code.  I was pulling a list of 500+ records, iterating through said list and then paging the results.  What I should have done was pull the list, page it and THEN iterate through it.  This step shaved at least 30 seconds.  HUGE impact!  Did it chip at my ego... sure.  I'm only human.  But it helps me be a better programmer and now my project is more efficient.  Win-win situation.  If I just learn to check my ego at the door, then we as a team will learn, grow and win!

Thursday, February 20, 2014

Username and Password Please

Our websites ask us this question probably a dozen times a day. Each of our sites requires us to prove we are who we say we are by entering our username and password. But what's that username again? Is it the one where my first two initials are capitalized? Was this the site where I had to put weird characters and numbers in my password? Has my 90 days been up? Do I need to think of a new password? How can I remember my password if I don't write it down? The questions go on and on. What a broken, flawed system we have. Each website has their own policy on what a password should look like. Some don't even care and let you make your password... password.

As a programmer and an avid web user, this drives me crazy. I prefer social media authentication. It's such a smooth process, and I've yet to run into any issues with it. My Facebook account has never been hacked { knock on wood }, so this is by far my preferred choice for logging into websites. But is it secure? Maybe. But I find myself asking the question... "Should I trust my information and access to all my sites { that have this functionality } to a social networking site? To me, it's like going to a seafood restaurant and asking for a chicken sandwich. It's not their specialty... it's not what they do... so I probably shouldn't get too mad if it's bad or I get sick. Is the same true for social media authentication? It's not their specialty? In fact, it appears selling information is their specialty, which should raise even more red flags.

Google authentication seems to be catching on with popularity. But if you believe the ads and gossip, they're selling information too! I do feel that Google may be our best bet for getting out of this awful credentials authentication mess. They seem to be on the cutting edge of most things technology related, and the certainly have the capital to back such a movement, should they find it profitable. But until that day comes... Click here to recover password..... sigh!

Wednesday, February 12, 2014

In the Beginning there was Angular

In the beginning there was Angular. In the beginning of this blog, that is. I use AngularJS for current projects. It serves as a Front-End framework for my applications. It allows me to communicate with the server and manipulate the DOM { webpage elements } in real-time, without those annoying page refreshes that have to reload everything just because you add one single row to a table.

Libraries such as AngularJS help a programmer do their job more efficiently. It eliminates the 'reinvent-the-wheel' phase. It also gives you a base of where to start. There are tools out there to help you even setup your base application for a new project... but we'll talk about those in another post. For now, check out AngularJS. Add some Angular to your page, mess things up, try something new. And when you do, try out ng-cloak. You'll love it!