1. An Integrated Solution for Web-based Mathematical Expression Inputting Wei Su Department of Computer Science, Lanzhou University, PRC Department of Computer Science, Kent State University, USA wsu@cs.kent.edu July 30 th 2008

2. WME Group http://wme.cs.kent.edu/mathedit Outline 1.Background 2.Introduction 3.Content-based editing  Expression Editing  Navigation 4.Presentation-based editing 5.Customization and MathEdit API 6.Answer Checking

3. WME Group http://wme.cs.kent.edu/mathedit 1. Background WME is a modern distributed system on the Web for mathematics education. The approach is to provide each participating school with a website that is comprehensive, well-organized, dynamic, interactive, hands-on and ready to use by teachers for mathematics teaching in the classroom.

4. WME Group http://wme.cs.kent.edu/mathedit Requirement 1.A totally Web-based tool for the interactive entering and editing of mathematical expressions especially for applying the Web in of mathematics, science, and technology. 2.The editor should be easy to use and provide an intuitive GUI for editing mathematical expressions 3.This editor must be easily integrated with the Web- based systems. And the entered expressions should be encoded as common formats which have interoperability with other programs. 4.The editor must also be flexible, customizable and extensible to address different user groups at various levels.

5. WME Group http://wme.cs.kent.edu/mathedit Requirement (cont.) 4. The editor should satisfy two distinct needs for mathematical expressions –Capturing meaning and semantics (Content) The expressions can be used to compute, prove and plot –Describing the visual appearance (Presentation) The expressions can be used to display, typeset in the applications or on the Web.

6. WME Group http://wme.cs.kent.edu/mathedit MathML  The Mathematical Markup Language (MathML), a W3C standard, supports both a presentation encoding and a content encoding for the different purposes.

7. WME Group http://wme.cs.kent.edu/mathedit 2. Introduction MathEdit, a Web-based visual interactive mathematical expression editor, aims to provide an integrated solution of on-line entering and editing of mathematical expressions.

8. WME Group http://wme.cs.kent.edu/mathedit MathEdit Overview  MathEdit provides convenient and intuitive graphical user interface.  It provides MathML-Content based editing and MathML-Presentation based editing.  It also provides well-defined API.  Customize toolbar, palette and expression template  It can work with IE and the Mozilla-family browsers  Written in JavaScript and MathML.

9. WME Group http://wme.cs.kent.edu/mathedit MathEdit Authoring Environment Templates Operational Mode Work Area Infix Input Toolbar

10. WME Group http://wme.cs.kent.edu/mathedit The Feature of MathEdit  Totally Web-based tool  Integrate Content-based editing and Presentation- based editing  Easy to use, what you see is what you get  Various editing mode  Adaptable and customizable  Easily to include in your web application  Open source and Free

11. WME Group http://wme.cs.kent.edu/mathedit 3. Content-based editing  Content-based editing aims to let user edit the well- formed expression, which can keep mathematical meaning.

12. WME Group http://wme.cs.kent.edu/mathedit Expression Editing MathEdit supports several forms of user input:  Template  Infix  MathML

13. WME Group http://wme.cs.kent.edu/mathedit Well-formed

14. WME Group http://wme.cs.kent.edu/mathedit Some Examples of Math expression  Demo Demo

15. WME Group http://wme.cs.kent.edu/mathedit Visual Navigation  Basic Navigation  Traversal Navigation  Mouse Click

16. WME Group http://wme.cs.kent.edu/mathedit 4. Presentation-based editing  Presentation-based editing enables users to enter arbitrary expressions that may or may not have widely accepted mathematical meaning or may not be mathematical at all.

17. WME Group http://wme.cs.kent.edu/mathedit The Difference between Content-based Editing and Presentation-based Editing

18. WME Group http://wme.cs.kent.edu/mathedit 5. Customization and MathEdit API  The MathEdit API, supported by a set of JavaScript functions, allows applications to create an editor instance, sets its editing ways, configure its template palette and other GUI features, and set/retrieve the MathML code and infix it contains.

19. WME Group http://wme.cs.kent.edu/mathedit Integrated for Content and Presentation

20. WME Group http://wme.cs.kent.edu/mathedit MathPASS

21. WME Group http://wme.cs.kent.edu/mathedit Answer Checking

22. WME Group http://wme.cs.kent.edu/mathedit Thank you ！