Source Code and Comments

One of the most broadly useful classes developed for the Mobile Math Apps project is the mathematics typesetter, which uses the parse tree inherent in our expression parser combined with placement of textfields with embedded fonts. The Mobile Math Apps are focused on precaclulus-level mathematics, the typesetter has not gotten a robust workout, but it should be a good starting point for others nonetheless.

While functional for producing a typeset expression, the present version of the typesetter is not designed for student input. It is intended to be used with programmer-created strings which adhere to syntax that matches the implementation of our MathParser class. The particulars are discussed and then we give some examples at the bottom of this page, along with a browser-based (swf) applet to show how the examples are rendered.

Syntax and Special Symbols

  • Multiplication must be explicit using the * symbol.
  • Uppercase letters are variables defined as capa, capb, etc.

Fractions

  • To force fractions to appear as “1/2“, use slash(1,2)

Logarithms

  • clog(56) is common log
  • ln(56) is natural log
  • log(3, 9) is log base 3 of 9

Special symbols

  • Greek letters theta, alpha, beta, phi, omega, gamma, and pi are build in and referenced by name
  • Use the token “notequal” for the not equal symbol.
  • Token “qmark” is a question mark.
  • The degree symbol is defined as a variable "deg" so it has to be entered as multiplication, for example: 20 degrees is entered 20*deg.
  • Similarly, to add explicit parentheses you must enter as multiplication, for example: f*par(x + 2) typesets to look like f(x + 3).

Experiment with the typesetter in this browser-based (swf) version:

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Other examples to try: Copy and paste into the test application to see the results.

  • e^(sqrt(x^2 + 2)) = qmark
  • (-x*sqrt((x+1)*(x^2-6))+log(capa,3)-sin(x))/cos(2*pi) notequal 2*3^x+3*x^2
  • sqrt(cos((x^2-1)^4))/x-a^(slash(1,2))+log(slash(1,2),x^2-3*x)+e^x^2
  • y-sqrt(sin(theta+2*pi+3*alpha-beta^2))=60*deg - (sqrt(3)/2)+(x^3-2)^5

NOTE: The current version of mptypeset does not throw error events for syntax errors, so it should not be used for free-form user input. Errors are checked, but a syntax error yields no result instead of an error message from a user point of view.

Download

  • Download all source files corresponding to this example: Typesetter.zip

The folder contains all the class files for the MathParser and mptypeset classes, and typeset_test.fla with the accompanying swf and html file. It also includes the file tnrfonts.swc, which links embedded Times New Roman fonts to be used by the typesetter.

Using tnrfonts.swc

In setting up a new fla file (like typeset_test.fla) for testing or publishing, you will need to provide a path to the file tnrfonts.swc to use the embedded fonts. This process is illustrated in the screen shot below.

  1. Click the wrench icon next to the Script pull down, or choose ActionScript Settings from the File menu.
  2. Click the Flash icon on the Library path tab.
  3. Browse to the location of the tnrfonts.swc. Alternatively, you can just double click on the item shown in #3 and type in the relative path to where your tnrfonts.swc file is located.
  4. Be certain that the Default Linkage (shown at the bottom of the screenshot) is set to "Merged into code," as shown.

The Constructor

  • The variables "x", "y", "z", "t", "w", "a", "b", "c", "d", "theta", "alpha", "beta", "phi", "omega", "gamma", "capa", "capb", "capc", "capd", "deg", "qmark", "f", "g", and "h" are built into MathTypeset, along with "e" and "pi," which were already built into the MathParser class.

For example, the line

var mt:MathTypeset = new MathTypeset( [ ] );

creates a new math typesetter with just the built-in variables listed above.

  • Add additional variables when calling the constructor.

For example, the line

var mt:MathTypeset = new MathTypeset( [ "v" ]);

will create a math typesetter with all the above variables plus the variable "v".

The Main class for typset_test.fla

package {

import flashandmath.as3.parsers.*;

import flashandmath.as3.mptypeset.*;

import flash.display.MovieClip;

import flash.display.Sprite;

import flash.events.MouseEvent;

import flash.text.Font;

 

public class Main extends MovieClip {

//mtTest will hold an instance of MathTypset class

protected var mtTest:MathTypeset;

 

//A container for typeset expression

protected var testCont:Sprite;

protected var typesetExpr:Sprite;

 

public function Main() {

//The fonts in tnrfonts.swc MUST BE "Merged into code", as shown above.

Font.registerFont(TNRItalic);

Font.registerFont(TNRRegular);

Font.registerFont(TNRBold);

 

txtInput.wordWrap=true;

init();

}

private function init():void {

testCont=new Sprite();

testCont.x=65;

testCont.y=200;

this.addChild(testCont);

typesetExpr=new Sprite();

/* The constructor of MathTypeset takes names of variables as parameters. pi and e are built in. (Just like MathParser). Uppercase letters are variables defined as capa, capb etc. The degree symbol is defined as a variable "deg" so it has to be entered as multiplication, for example: 20 degrees is entered 20*deg. Variables basicVars=["x","y", "z", "t", "w", "a", "b", "c", "d", "theta", "alpha", "beta", "phi", "omega", "gamma", "capa", "capb" ,"capc", "capd", "deg", "qmark", "f", "g", "h"]; are built into MathTypeset. Add to the constructor only the new ones. */

mtTest=new MathTypeset([]);

btnTypeset.addEventListener(MouseEvent.CLICK, typeset);

btnClearInput.addEventListener(MouseEvent.CLICK, clearInput);

btnZoomIn.addEventListener(MouseEvent.CLICK, zoomIn);

btnZoomOut.addEventListener(MouseEvent.CLICK, zoomOut);

/*Typesetting is done with fixed font sizes etc. Scaling takes place afterwords. Below the container containing a typeset expression is scaled. */

testCont.scaleX=1.6;

testCont.scaleY=1.6;

/* Uppercase variables are entered as capa, capb etc. Greek: alpha, beta , gamma, phi, omega. f(x) is enetred f*par(x) Logarithm with a base is entered as log(base,arg). The common log is entered as clog(arg), the natural log as ln(arg). Asterisk must be used for multiplication. Degree symbol is entered 20*deg. Slash multiplication slash(2,3). Forced parethesis par(x+1). If not equal is required instead of equal, it is entered as x notequal (y-1)^2. */

txtInput.text="f*par(x)=cos(omega*t-phi)+clog(capd)+log(slash(2,3),x)";

}

private function typeset(e:MouseEvent):void {

var str:String=txtInput.text;

// Reset and remove any previous typesetExpr

if(typesetExpr!=null && testCont.numChildren>0){

testCont.removeChildAt(0);

}

typesetExpr=null;

/*MathTypeset has one methods: doTypeset. doTypeset takes a string with or without equality whose sides are expressions suitable to be compiled by MathParser, and an optional parameter for the color. Default color is white.*/

typesetExpr=mtTest.doTypeset(str,0xCCFFFF);

testCont.addChild(typesetExpr);

}

private function clearInput(e:MouseEvent):void {

txtInput.text="";

}

// scale up to a max of 5.0

private function zoomIn(e:MouseEvent):void {

if(testCont.scaleX<=4.8){

testCont.scaleX+=0.2; testCont.scaleY+=0.2;

}

}

// scale down to a min of 0.2

private function zoomOut(e:MouseEvent):void {

if(testCont.scaleX>=0.4){

testCont.scaleX+=-0.2;

testCont.scaleY+=-0.2;

}

}

}

}

Related Flash and Math Tutorials

Using the Math Parser

Embedding fonts

This Flash and Math AIR for Mobile Tutorial is related to Mobile Math Apps project by Doug Ensley and Barbara Kaskosz.

Back to AIR for Mobile              Back to Flash and Math Home

We welcome your comments, suggestions, and contributions. Click the Contact Us link below and email one of us.

Adobe®, Flash®, ActionScript®, Flex® are registered trademarks of Adobe Systems Incorporated.