nasitra/Select all text on focus

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Select all text on focus</title>
  <style>
    * {
      margin: 0;
      padding: 0;
      border: 0;
    }

    body {
      background-color: #f9f9f9;
    }

    .container {
      text-align: center;
    }

    #text-input {
      -moz-box-sizing: border-box;
      background-color: #fff;
      border: 1px solid #ddd;
      border-radius: 5px;
      box-sizing: border-box;
      color: #333;
      font-family: Helvetica, Arial, sans-serif;
      font-size: 16px;
      line-height: 1.4;
      margin-top: 200px;
      outline: 0;
      padding: 6.4px;
      width: 80%;
    }

    #text-input:focus {
      box-shadow: 0 0 2px 2px #38c;
    }
  </style>
</head>
<body>
  <div class="container">
    <input id="text-input" type="text" value="https://gist.github.com" />
  </div>
  <script>
    var input = document.getElementById('text-input');

    var isFocus = false;

    input.addEventListener('blur', function() {
      isFocus = false;
    }, false);

    input.addEventListener('click', function() {
      if (!isFocus && input.selectionStart === input.selectionEnd) {
        input.select();
        isFocus = true;
      }
    }, false);
  </script>
</body>
</html>

## Select all text on focus
Select all of the text in the field on focus
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>Select all text on focus</title>
	<style>
	* {
	margin: 0;
	padding: 0;
	border: 0;
	}

	body {
	background-color: #f9f9f9;
	}

	.container {
	text-align: center;
	}

	#text-input {
	-moz-box-sizing: border-box;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 5px;
	box-sizing: border-box;
	color: #333;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.4;
	margin-top: 200px;
	outline: 0;
	padding: 6.4px;
	width: 80%;
	}

	#text-input:focus {
	box-shadow: 0 0 2px 2px #38c;
	}
	</style>
	</head>
	<body>
	<div class="container">
	<input id="text-input" type="text" value="https://gist.github.com" />
	</div>
	<script>
	var input = document.getElementById('text-input');

	var isFocus = false;

	input.addEventListener('blur', function() {
	isFocus = false;
	}, false);

	input.addEventListener('click', function() {
	if (!isFocus && input.selectionStart === input.selectionEnd) {
	input.select();
	isFocus = true;
	}
	}, false);
	</script>
	</body>
	</html>