bennadel/index.htm

## index.htm
<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8" />

	<title>
		Code Kata: Parsing Simple Timespan Strings Like 3h:12m:57s Using JavaScript
	</title>
</head>
<body>

	<h1>
		Code Kata: Parsing Simple Timespan Strings Like 3h:12m:57s Using JavaScript
	</h1>

	<p>
		<em>View the console for output...</em>
	</p>

	<script type="text/javascript">

		// I parse a simple timespan string (ex, "12h,30m,17s") into a number of SECONDS.
		// Supports the following units (must be lowercase):
		// --
		// * d = days
		// * h = hours
		// * m = minutes
		// * s = seconds
		// --
		// Input may contain other delimiters, as desired, in order to make the input
		// more readable by the developers.
		function parseTimespan( input ) {

			// CAUTION: On its own, this pattern does not require the input to only
			// contain tokens that can be matched by this pattern. Depending on how hard
			// you squint, this can be a good or bad thing.
			var pattern = /(\d+)(d|h|m|s)/g;
			var multiplier = {
				d: 86400,
				h: 3600,
				m: 60,
				s: 1
			};

			var timespan = 0;
			var match;

			// Apply each matched magnitude-unit combination to the running total.
			while ( match = pattern.exec( input ) ) {

				var magnitude = match[ 1 ];
				var unit = match[ 2 ];

				timespan += ( magnitude * multiplier[ unit ] );

			}

			return( timespan );

		}

		// --------------------------------------------------------------------------- //
		// --------------------------------------------------------------------------- //

		console.group( "Single Units" );
		console.log( "2s =>", parseTimespan( "2s" ) );
		console.log( "2m =>", parseTimespan( "2m" ) );
		console.log( "2h =>", parseTimespan( "2h" ) );
		console.log( "2d =>", parseTimespan( "2d" ) );
		console.groupEnd();

		// Notice that the parseTimespan() function doesn't care about how you format
		// your input string; you could use spaces, commas, colons, etc. While this does
		// open the door for subtle errors (of omission), it grants you the flexibility
		// to choose a formatting option that sparks the most joy.
		console.group( "Mixed Units" );
		console.log( "1m2s =>", parseTimespan( "1m2s" ) );
		console.log( "2s 1m =>", parseTimespan( "2s 1m" ) );
		console.log( "3d..2h..16m..18s =>", parseTimespan( "3d..2h..16m..18s" ) );
		console.log( "16m, 2h, 18s, 3d =>", parseTimespan( "16m, 2h, 18s, 3d" ) );
		console.log( "10s:15s:20s =>", parseTimespan( "10s:15s:20s" ) );
		console.groupEnd();

	</script>

</body>
</html>
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="utf-8" />

	<title>
	Code Kata: Parsing Simple Timespan Strings Like 3h:12m:57s Using JavaScript
	</title>
	</head>
	<body>

	<h1>
	Code Kata: Parsing Simple Timespan Strings Like 3h:12m:57s Using JavaScript
	</h1>

	<p>
	<em>View the console for output...</em>
	</p>

	<script type="text/javascript">

	// I parse a simple timespan string (ex, "12h,30m,17s") into a number of SECONDS.
	// Supports the following units (must be lowercase):
	// --
	// * d = days
	// * h = hours
	// * m = minutes
	// * s = seconds
	// --
	// Input may contain other delimiters, as desired, in order to make the input
	// more readable by the developers.
	function parseTimespan( input ) {

	// CAUTION: On its own, this pattern does not require the input to only
	// contain tokens that can be matched by this pattern. Depending on how hard
	// you squint, this can be a good or bad thing.
	var pattern = /(\d+)(d\|h\|m\|s)/g;
	var multiplier = {
	d: 86400,
	h: 3600,
	m: 60,
	s: 1
	};

	var timespan = 0;
	var match;

	// Apply each matched magnitude-unit combination to the running total.
	while ( match = pattern.exec( input ) ) {

	var magnitude = match[ 1 ];
	var unit = match[ 2 ];

	timespan += ( magnitude * multiplier[ unit ] );

	}

	return( timespan );

	}

	// --------------------------------------------------------------------------- //
	// --------------------------------------------------------------------------- //

	console.group( "Single Units" );
	console.log( "2s =>", parseTimespan( "2s" ) );
	console.log( "2m =>", parseTimespan( "2m" ) );
	console.log( "2h =>", parseTimespan( "2h" ) );
	console.log( "2d =>", parseTimespan( "2d" ) );
	console.groupEnd();

	// Notice that the parseTimespan() function doesn't care about how you format
	// your input string; you could use spaces, commas, colons, etc. While this does
	// open the door for subtle errors (of omission), it grants you the flexibility
	// to choose a formatting option that sparks the most joy.
	console.group( "Mixed Units" );
	console.log( "1m2s =>", parseTimespan( "1m2s" ) );
	console.log( "2s 1m =>", parseTimespan( "2s 1m" ) );
	console.log( "3d..2h..16m..18s =>", parseTimespan( "3d..2h..16m..18s" ) );
	console.log( "16m, 2h, 18s, 3d =>", parseTimespan( "16m, 2h, 18s, 3d" ) );
	console.log( "10s:15s:20s =>", parseTimespan( "10s:15s:20s" ) );
	console.groupEnd();

	</script>

	</body>
	</html>