Thomas Giles wthit56

Transcript Helper

What this is

This script is adds some little doodads to your page to help you transcribe local audio files, directly in the browser. It even works within Google Docs. This has only been tested in Google Chrome, and all the instructions are specifically for Chrome; though there's no reason the code itself shouldn't work in other browsers.

Installation is a little fiddly, but doesn't take long.

How to install

Open Chrome Dev Tools. (CTRL + SHIFT + I)
Go the "Sources" tab.

Please read Writing Your Own Non-Templating Engine before reading this article.

Using Your Own Non-Templating Engine

In the previous article (link at the top), I showed how you can write a very simple function that will turn a given template string into something JavaScript can use. In this article, I'll go into how you can use this in practise.

The Basics

First, let's just make sure we're on the same page as to what the code is and what it does. And while we're at it, let's wrap it up in a function we can reference in later code examples:

Writing Your Own Non-Templating Engine

Templating engines are a dime-a-dozen right now, ranging from micro-DSLs to opinionated behemoth frameworks. It can be a bit of a chore to wade through them all (even with a Template Chooser), and even when you settle on one to use, it may not have all the functionality you want. So what do you do? You write your own, with as many custom and customizable features as you wish.

But writing a templating engine can be a whole mess of a problem all by itself. Writing a custom DSL that won't break with a mis-placed space or capital letter, and does what you want it to do, and ready for future changes, improvements, and additions, is just a pain the behind.

So what would the ideal-world, blue-sky apex of templating engines look like? What would you be able to do with it? If we're talking about JavaScript and HTML (and in this article, for example's sake, I will be), you'd want to be able to use all the power and simplicity

Async Techniques

NOTE: this project is for ideas regarding how to work with asynchronous calls. It includes ways one might achieve different effects and flows, in the form of simple, commented code. It does not include libraries or reusable code of any kind; this is to help programmers understand when to use certain techniques and how such techniques can be implemented.

When working with an asynchronous framework such as Node.js, you will often use code like the following:

	HTML
	<p>:para:</p>\n
	<blockquote>:quote:</blockquote>\n
	<strong>:bold:</strong>
	<em>:italic:</em>
	<u>:underline:</u>
	<img src=":img:" alt=":img_alt:" />
	<a href=":link:">:link_text:</a>
	newline:<br/>
	rule:<hr/>

	var CreateCallback = (function() {
	var pool = [];

	function CreateCallback() {
	if(pool.length){
	var callback = pool.pop();
	}
	else {
	function callback() {
	if(callback.action){

	// holds all instantiated Obj objects in memory for reuse
	var clean = [];

	function Obj(a, b) {
	// reset newObj variable
	var newObj = false;

	// when function was not called as a "new" contructor...
	// (like a "factory" function)
	if (!(this instanceof Obj)) {

	var data = { heading: "Page Title", toString: function() { return this.heading + "!"; } };
	data + "string" === "Page Title!string"

	var data = { heading: "Page Title" };
	data + "" === "[object Object]"