How I reassure users that even us IT Pros are human…

Anyone whose worked in the IT world has encountered situations where a user might feel a bit embarrassed when you fix a problem what seemed kind of obvious.   You know the types of situations where the situation can be resolved by plugging in the device.

Being a fallible human,  I have more than my fair share of these…and have posted some of them here

Whenever I need to reassure someone that I’m not at all put out by the situation I tell them my Snowblower Story….and yes, this is a true story.

A few  years ago I lived in Barrie Ontario which was frequently hit with heavy snowfalls.
Shortly after we got hit with about 3ft of the white stuff I suited up and headed down to my garage to fire up the snow blower.

It wouldn’t start….I tried everything!!!

I happened to have the tear down manual for the snow blower, and having no aptitude for mechanical things, decided that it shouldn’t be an issue to tear down the workings and find the problem.

Some time later I had all the external stuff stripped off, and was about to take apart the motor itself (I don’t know why…while I understand the principles of the internal combustion engine I did not have any experience, knowledge or skill in fixing them),  my friend and neighbour Tim came over with a couple of beers to see why I hadn’t cleared out my drive (and his).

When I told him what I was up to, he chuckled and moved the gas tank so he could sit down.

As he did so he paused…

He then handed the gas tank to me and asked if it was empty when I started…

Yes…yes it was.

Sometimes a zebra is just a donkey!

Advertisements

Another Programmers Are Human Moment

I wrote a PHP script that takes the details of an HL7 interface stored as XML and presents it in a nice neat HTML table.

The formatting is customized so most XML to HTML table tools won’t work for this.

As I parse the details out of the XML structure, I write them to the string $output.

I had everything working except for the parameters.

I gather the parameters by storing the XQuery paths into an array and iterate through that adding the details to the html table.

That bit wasn’t working.

I added some code to ensure that I was stepping through the array, and that the information was correct.

It took me about 20 minutes to see it….can you see the problem?


$output .= '<tr class="mdiparms">';

foreach($nxqArr as $nxq) {
         $ouput .= '<td>'.getNodeValue($nxq).'</td>';
}

$outout .= '</tr></table>';

Definitely an end of the day /facepalm moment!

How my stand up comedy class instructor made me a better coder

Years ago, while I was still serving as a military medic my sergeant asked me why I hadn’t signed up for a unit golf tournament.

“Well sergeant,  I don’t like to do things that I do not excel at.”

Her facial expression upon hearing this was very memorable.

As I grow older I’ve started to realize that my drive to find better ways to do things sometimes gets in my way.

 

I was working on a function to recursively parse a string with multiple delimiters into an associated array.

I had it working,  but thought that I could make it more efficient.

That worked,  but thought I could make it ever more efficient.

…you get the idea.

It was getting to the point where I was getting frustrated.  There was an issue with recursive function calls weren’t returning the proper data.

I couldn’t figure it out.

I took a break and saw an email from Jim,  the instructor of the Stand-Up Comedy class I’m taking at Second City in Toronto.

The email contained some notes on a 3-minute set I’d delivered at the last class.

Jim gently pointed out that I was striving for perfection right off the bat and that it was getting in my way.

He talked about how even seasoned comics work to avoid that trap.

He was right.  I had practiced bits of the set for hours working on every nuance of delivery and wording.

I turned back to my code a few minutes later and realized that seasoned programmers and seasoned comics have some things in common.

73 lines of code became 127 lines, and done!

 

 

 

 

Silly mistakes even seasoned IT pros make #1

I keep meaning to post these…I’ve got a bunch,  but I’ll start with the one I just made.

I came into my office first thing this morning,  coffee in hand, and opened Outlook.

I was surprised that I didn’t have any unread mail….

I went to a short meeting,  came back,  sent an email and saw that it appeared that the recipient had responded immediately…except that there was no RE: in the subject line.

That’s right…the reason I didn’t see any unread mail is that last time I was in Outlook,  I was in my Sent items folder.  If I’d bothered to look at the left hand pane I’d have seen Inbox (60)

So yeah,  if an IT person ever makes you feel stupid…remember everyone does silly stuff like this….

 

 

Switching Active Tabs Programattically: Jquery/Bootstrap

There are lots of different ways to control visibility of different types of web elements.

I’m working on the web front end of what will eventually become an HL7 message inspection tool.

I’ve set it up so that when the user pastes an HL7 message into the textarea on the #omsg pane,  the results will be pasted into the #parsedmsg pane.  I then want the latter pane to become visible.

I set all this up using bootstrap tabs.

The tab controls are anchors wrapped in list elements.  To show what tab is visible, Bootstrap relies on the class “active” to be added to the parent li tag.

I don’t know if I’m having an off day but I couldn’t figure out how to have that happen when I switched visibility programmatically.

The panes would switch visibility just fine, but I naturally wanted the active tab button to be highlighted.

Instead of toggling visibility of various elements,  I decided to write a function using DOM traversal to simulate clicking the desired button.

I’ll go into more detail below, but this is the function itself.

function activeTab(newtabid) {
$('#lpane > ul > li > a[href="'+newtabid+'"]').trigger('click');
});

The tab controls are contained in a div with the id of “lpane”.  As Bootstrap tabs rely on the href attribute, its easy enough to find which element to click using that particular parameter.

Here is the HTML

<div id="wrapper" class="col-lg-12">
<div id="header" class="col-lg-12">
<h3>HL7 Tool</h3>
</div>
<div id="lpane" class="col-lg-12 centered">
<ul class="nav nav-pills " style="text-align:center;">
	<li role="presentation"><a data-toggle="tab" href="#omsg">Original Message</a></li>
	<li role="presentation" id="lpmsg"><a class="btn" data-toggle="tab" href="#pmsg" href="#">Parsed Message</a></li>
	<li role="presentation"><a class="btn" data-toggle="tab" href="#redset" href="#">Redaction Settings</a></li>
	<li role="presentation"><a class="btn" data-toggle="tab" href="#redmsg" href="#">Redacted Message</a></li>
</ul>
</div>
<div id="cpane" class="tab-content col-lg-12">
<div id="omsg" class="tab-pane active">
<label for="#omsg">Original Message</label><textarea id="msg" class="form-control" placeholder="Paste Msg Here"></textarea>
<input type="button" class="btn" value="Parse" id="parsemsg"/><input type="button" class="btn" value="Clear" id="clearomsg" />
</div>
<div id="pmsg" class="tab-pane">
<div class="col-md-6" id="parsedmsg"></div>
</div>
<div id="redset" class="tab-pane">
REDSET
</div>
<div id="redmsg" class="tab-pane">
REDMSG
</div>
</div>
</div>

and finally…the actual script


<script>

$(document).ready(function(e){
 
$('#parsemsg').click(function(e){
 
$('#parsedmsg').parsehl7({msgin:$('#msg').val()});
 
 activeTab('#pmsg');
 
 }); //parsemsg
 
 }); //document ready

</script>

 

 

CSS Calc Function

 

Have you ever had a problem getting a div to center?   There are times that for some reason the margin: auto;  just doesn’t work.

Its situations like this that get old timers like me poking around Google where we discover new and cool things.   (the whole having a job, and being expected to produce results thing can make that difficult at times).

This led to the discovery of the calc()  function!

Calc allows you to use math to size elements without having to resort to scripting.

In the example below,  I set up a lightbox div with a width that is 100 pixels less than half the width of the parent div  (calc(50% – 100px);).

In order to center this (because margin:auto wasn’t working for some reason),  I used (calc((100% – (50% – 100px))/2);)

 

.lightbox {
margin-top:20px;
 width:calc(50% - 100px);
 left: calc((100% - (50% - 100px))/2);
 height:auto;
 padding:15px;
 margin-left:auto;
 margin-right: auto;
 position:absolute;
 border: #110ef3 solid 2px;
 border-radius: 5px;
 background-color: #FFF;

}