Maths Editor

• Download source - 21.1 Kb

Introduction

I'd like to thank the Code Project members for allowing us to share our codes in this site. This article is created to give online help about the Math Editor, how to use it, its source code, and comments.

The Math Editor is a Java Script program implemented within an HTML page to work with many mathematical formula.

Background

Internet should do what the visitor may expect to find. As for me and other students who are actually interested in Mathematics, I am figuring out how wonderful it would be when getting an advanced calculator in hand as the Math Editor does. It is a very simple HTML Interface page that can solve lots of mathematics. For the first time, you may find it is somewhat useless, but surprising after you be familiar of its functions, particularly if you already have a background knowledge of MATLAB.

Link

You can still visit the online Math Editor at my web page.

Any new modification will be approved on that page first before posting it here, in order to assure its validity of execution.

This program works on Netscape or Internet Explorer. I'd prefer you have Internet Explorer 5 or higher. I found JavaScript or simply Jscript much more powerful and easier, and also has an open source code for other programmers who like to develop the source code online and save it into their computers to work offline.

The following image shows how the Math Editor looks like and also how it behaves.

Features

• The Math Editor consists of three boxes, and two buttons.
• The first upper box is called the Math History, where every executed command will remain. As you can see, it starts with the name, copyrights, and a short help message.
• Bellow is the Command prompt dialog, where you can type your expression. After typing the expression, you can execute the command by either clicking the button next to it (i.e., the Equality or Result button), or by pressing Enter on the keyboard.
• Next to the result button is the 3rd box which in turn gives out the result of the executed expression.
• Bellow them, there is the Settings button. This button has a special function will be explained later.

When executing the command, the result not only appears on the result box, but also the Math History dialog box will save the executed expression as well as the result automatically.

It is also possible to copy an expression from any other text and paste it in the Command dialog. As a Windows feature, you can use the drag and drop method, and this case is useful when selecting an expression from the Math History and drag (hold mouse down while moving) into the Command box, then drop or release the mouse to let it paste by itself.

Math Editor is not only assigned for mathematical formula or equations, but also it allows you to make your own constants, strings, and variables. It also allows you to use some script expressions (Jscript here) so you can analyze your problem as an algorithm and solve it using this script.

Note: you can use the Up, Down, PageUp and PageDown keys to restore last executed entries.

The Settings button has a unique feature that controls most of the Math Editor Interface such as colors and fonts. It also controls the Language Interface and Math Mode. The following shows the new window resulted after the Settings button is clicked.

Math Editor Commands

The following lists the available commands that can be run in the command prompt.

Predefined Constants

pi = 3.141592653589793,

e = 2.718281828459045,

euler = 0.5772156649015329

Special commands

about ,to view the Math version information,

ans ,to get the value of the last result.

exit , to quit current Math program (window),

help , to view the help menu of Math Editor commands,

? , acts for help,

clr , to clear Math History Dialog,

unclr , to restore last cleared screen of Math History

Environment Variables

hcolor, set/get the History font color,

hbcolor, set/get the History background color,

ecolor, set/get the Command entry font color,

ebcolor, set/get the Command entry background color,

rcolor, set/get the Result font color,

rbcolor, set/get the Result background color,

pbcolor, set/get the Plot background color,

mode, set/get Math Editor mode ("simple" or "advanced"),

setlang, set/get the Math Editor language support as well as English. (Valid languages here are "arabic" or "english").

Functions

SIN(X) , X should be a value in radians..

COS(X) , X should be a value in radians..

TAN(X) , X should be a value in radians..

ASIN(X) , X a valid value between -1 and 1, gives the Angle which sin() is X in radians..

ACOS(X) , X a valid value between -1 and 1, gives the Angle which cos() is X in radians..

ATAN(X) , which tan() is X gives the Angle in radians..

SINH(X) , Gives the Hyperbolic SIN value of X.

SH(X) , Gives the Hyperbolic SIN value of X.

COSH(X) , Gives the Hyperbolic COS value of X.

CH(X) , Gives the Hyperbolic COS value of X.

TANH(X) , Gives the Hyperbolic TAN value of X.

TH(X) , Gives the Hyperbolic TAN value of X.

ARG(X, Y) , Gives the angle opposite to X and Y.

DEG(X) , Converts X from Radians to Degrees.

Rad(X) , Converts X from Degrees to Radians.

SIGN(X) , Gives the sign of X.

ABS(X) , Gives the absolute value of X.

CEIL(X) , Gives the smallest integer greater than or equal to X.

FLOOR(X) , Gives the greatest integer less than or equal to X.

ROUND(X) , Rounds X to the nearest integer.

RANDOM() , Gets a random value between 0 and 1.

MAX(X1, X2, ...) , gets the greatest value.

MIN(X1, X2, ...) , gets the least value.

SQRT(X) , gets the square root of X.

POW(X, N) , Gives X to the power N.

EXP(X) , Gives the exponential of X.

LOG(X) , Gives the natural logarithm of X.

LOG10(X) , Gives the base 10 logarithm of X.

LOGN(X,N) , Gives the base N logarithm of X.

FACTORIAL(X) , Gives the factorial of X, X must be a positive integer.

GAMMA(X) , Gives the gamma of X.

DERIVE("Fx", X) , Gets the derivative of a string function Fx at value X.

INTEG("Fx", X1, X2) , Gets the integration of a string function Fx on the interval value X1 to X2.

ZERO("Fx", X1, X2) , Finds the zeros of the function Fx, on the interval X1 and X2.

PSET(X, Y, "_COLOR", W, H) , Draw a pixel at point (X, Y) with colour _COLOR. The point is a square of W, width and H, height.

PLOT("Fx1", "Fx2", X1, X2, dX, "_COLOR", W, H) , Draw the relation between two functions each is a function of "X" at point (Fx1, Fx2) with colour _COLOR.The step between points is dX, the size of the point is a square of W, width and H, height.

VECTOR("Fx1", "Fx2", "Fx3", x1, x2, dX, "_COLOR", W, H) , Draw the 3 dimensional vector relation between three functions each is a function of "X" at point (Fx1, Fx2, Fx3) with colour _COLOR.The step between points is dX, the size of the point is a square of W, width and H, height.

PLOT3D("Ftz1", "Ftz2", "Ftz3", t1, t2, dt,z1, z2, dz, W, H) , sketch the 3 dimensional or volume relation between three functions each is a function of two parameters, "t" and "z" at point (Fx1, Fx2, Fx3), i.e: t represents the horizontal angle and z is the vertical angle in spherical coordinates. The step between points is dt-horizontally, dz-vertical. The size of the point is a square of W, width and H, height.

Examples of Math & Jscript Expressions

123.5-1/(4+7*5)

The result box will give out 123.47435897435898

Multiple expressions can be executed as in:

x=5, y = x*x, z = sin(rad(x)) - cos(pi/3)

Note: the last expression will appear in the result box which will be -0.412844257252342

alert('hi')

The returned value is "undefined".

gamma(-4.3)

The answer is -0.258

To get the zeros of this function on the interval [-100,100], try executing it:

zero("(cos(x/3)+sin(x/7))*(x-1)*(x-3)",-100,100)

The result is -95.661496302,-90.713487872, -82.466807157,-69.272118012, -57.72676501,-56.077428867,-42.882739722000004,-29.688050576000002,-24.740042147,-16.493361431, -3.2986722860000004, 1,3,8.246680716,9.896016859000001, 23.090706004,36.285395149,41.233403578, 49.480084294,62.674773439000006, 74.220126441,75.869462584,89.064151729

To sketch the GAMMA function try this:

plot("40*x","10*gamma(x)",-5,5,.03,red,1,1)

To check how dummy spiral acts, check this:

vector("20*cos(x)","x+20*sin(x)","(x+10*sin(x))*x/10",0,40,.3,black,2,2)

To plot a part of sphere, check this:

plot3d("80*cos(t)*sin(z)","80*sin(t)*sin(z)","80*cos(z)",-pi/2,pi,.06,-pi*.8,-pi*.2,.06,8,8)

Comments about Math Editor

I have updated this version of Math Editor as a promise, and followed the comments I received from some friends.

About the GUI, I've made it in user defined colors (27 visual colors). However, the user can also select any other colors using the command prompt and the (#abcdef) colors formula.

Also, the language support is now available (in this version, there is English/Arabic support). For example, Arabic will change not only the Interface of the Math Editor, but also the Commands can be written in Arabic. If your browser doesn't support a foreign language, you may encounter errors when loading and the Program will not run. If you are not sure, please replace the source file, named (jscript.saf) by the one called (jscript.tar) in the heading (SCRIPT) tag of the HTML source page to run the Math Editor in Safe mode.

In this code, I considered to make it simpler so that others may not suffer the case sensitivity, and in case of mistake, they will get an error message, preventing command execution. If your browser doesn't allow Error Check message alert, this means you have to reset some of the web settings. To do this, go to the Internet Options, select the Advanced tab, and click the Restore Defaults button.

When using graphical commands (i.e., plot(), vector(), plot3d() functions), there will be much delay in graphics executions, because the idea of making a graph is not graphical by all means. It is just a sequence of small shaded square object. The smaller the increment factor, the higher the graph resolution, but the slower the command execution.

Finally, I'll be glad to receive any comments or suggestions via my email, tarek0@mail.com.