Linux – Adding useful aliases

I prefer to add the aliases to a different file rather than the .bashrc. You can modify the .bashrc file to include the .bash_aliases file:

# Alias definitions.
# You may want to put all your additions into a separate file like
# ~/.bash_aliases, instead of adding them here directly.
# See /usr/share/doc/bash-doc/examples in the bash-doc package.

if [ -f ~/.bash_aliases ]; then
    . ~/.bash_aliases
fi

And then create a new file .bash_aliases in the home directory with the following or your own aliases:

#!/bin/bash
# Adding custom aliases
alias l='ls -lrt'
alias lwc='ls -lrt | wc -l'
alias la='ls -lart'
alias lm='ls -lrt | more'
alias lwc='ls | wc -l'
alias f='find . -name $1'
alias b='cd ..'

Finally, to execute the bash_aliases in your current session without having to logout and login again, execute the following command:

. ~/.bash_aliases

PHP – return multiple values in Array

PHP doesn’t allow return of multiple values – no way. I typically would create an array and set key value pairs and return the array. Until I found this much easier way of handling the situation:

function getXYZ()
{
    return array(4,5,6);
}

list($x,$y,$z) = getXYZ();

// Afterwards: $x == 4 && $y == 5 && $z == 6
// (This will hold for all samples unless otherwise noted)

Technically, you’re returning an array and using list to store the elements of that array in different values instead of storing the actual array. Using this technique will make it feel most like returning multiple values.

Rename files in a sequential order

My camera shoots images until DSC_9999 and after that it resets to DSC_0001. It messes up the sequence of images shot during a day if the sequence is reset. I found this cool solution which resets them in sequential order starting from 1 and also pads 0’s to the beginning if the number is less than 100.

a=1
for i in *.JPG; do
  new=$(printf "DSC_%04d.JPG" "$a") #04 pad to length of 4
  mv -i -- "$i" "$new"
  let a=a+1
done

jQuery DatePicker with default date

Here’s how you could use jQuery’s Datepicker component within your HTML. There are 2 variations of Datepicker. One is normal date picker where user would select a date from the calendar. The other one is a readonly date field that would default the current date and is readonly.

<link rel="stylesheet" href="https://unpkg.com/purecss@0.6.2/build/pure-min.css" integrity="sha384-" crossorigin="anonymous">
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" type="text/css" href="static/css/menu.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  assignDates();
});
var assignDates = function(){
  $( "#expiration_date" ).datepicker({
    changeMonth: true,
    changeYear: true
  });
  $( "#creation_date" ).datepicker({
    changeMonth: true,
    changeYear: true
  });
  $( "#creation_date" ).datepicker('setDate', new Date());
};
</script>

<div class="pure-control-group">
    <label for="expiration_date">Expiration Date</label>
    <input id="expiration_date" type="text" placeholder="Expiration Date" required>
    <span class="pure-form-message-inline">*</span>
</div>

<div class="pure-control-group">
    <label for="creation_date">Creation Date</label>
    <input id="creation_date" type="text" onmousedown="return false;" readonly>
</div>

Working samples available on GitHub

Javascript/jQuery Menu

Here’s a working Javascript/jQuery Menu. It’s a horizontal menu with sub-menu items dropping vertically.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>menu demo</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
  <style>
  .ui-menu { 
      overflow: hidden;
  }
  .ui-menu .ui-menu {
      overflow: visible !important;
  }
  .ui-menu > li { 
      float: left;
      display: block;
      width: auto !important;
  }
  .ui-menu ul li {
      display:block;
      float:none;
  }
  .ui-menu ul li ul {
      left:120px !important;
      width:100%;
  }
  .ui-menu ul li ul li {
      width:auto;
  }
  .ui-menu ul li ul li a {
      float:left;
  }
  .ui-menu > li {
      margin: 5px 5px !important;
      padding: 0 0 !important;
  }
  .ui-menu > li > a { 
      float: left;
      display: block;
      clear: both;
      overflow: hidden;
  }
  .ui-menu .ui-menu-icon { 
      margin-top: 0.3em !important;
  }
  .ui-menu .ui-menu .ui-menu li { 
      float: left;
      display: block;
  }
  </style>
  <script src="//code.jquery.com/jquery-1.12.4.js"></script>
  <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
 
<ul id="menu">
  <li>
    <div>Home</div>
  </li>
  <li>
    <div>Inventory Management</div>
    <ul id="sub_menu">
      <li>
        <div>Add items</div>
      </li>
      <li>
        <div>Delete items</div>
      </li>
      <li>
        <div>Modify items</div>
      </li>
      <li>
        <div>View items</div>
      </li>
    </ul>
  </li>
  </ul>
 
<script>
$( "#menu" ).menu({position: {at: "left bottom"}});
$( "#menu li" ).hover(function() {
        $(this).find('ul').show();
    },
    function() {
        $(this).find('ul').hide();
});
</script>
</body>
</html>

Pretty Print JSON

I used to use a website to pretty-print my JSON. But realized that the site saves the data. If there’s data that could be confidential, it may not be a good idea use a 3rd party website. So I created a simple hosted page to pretty print a JSON.

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">
function onSubmit(){
	var $json_input = $( "#ta_json_input" );
	var json_out = JSON.stringify(JSON.parse($json_input.val()), null, 4);
	$json_input.val(json_out);
}
</script>
</head>
<body>
<form id="frmJson" name="frmJson">
<h2>Pretty JSON</h2>
<div>
<textarea id="ta_json_input" rows="30" style="width:100%; overflow-x: scroll; "></textarea>
</div>
<div>
<input type="button" value="Submit" onclick="onSubmit()" style="height:30px;">
</div>
</form>
</body>
</html>

Here’s how the page looks like: