IPSJ SIG Technical Report Vol.2015-CLE-16 No /5/23 RESTful Web API Web 1,2,3,4,a) 1,3,2,4 5,6 6 Wannous Muhammad 7,1,8 4,2,1 3,2,1 Maxima Web JS

Size: px

Start display at page:

Download "IPSJ SIG Technical Report Vol.2015-CLE-16 No /5/23 RESTful Web API Web 1,2,3,4,a) 1,3,2,4 5,6 6 Wannous Muhammad 7,1,8 4,2,1 3,2,1 Maxima Web JS"

ひでよりかやぬま
4 years ago
Views:

1 RESTful Web API Web 1,2,3,4,a) 1,3,2,4 5,6 6 Wannous Muhammad 7,1,8 4,2,1 3,2,1 Maxima Web JSONP Web API Maxima MathML JavaScript HTML5 Flot Web API RPC REST MathDox GUI MathJax Web 1. LMS (Learning Management System) Web Web 1 Center for Management of Information Technologies, Kumamoto University, Kumamoto , Japan 2 Graduate School of Instructional Systems, Kumamoto University, Kumamoto , Japan 3 Graduate School of Computer Science and Electrical Engineering, Kumamoto University, Kumamoto , Japan 4 Institute for e-learning Development,, Kumamoto University, Kumamoto , Japan 5 Graduate School of Information Science, Nagoya University, Nagoya , Japan 6 School of Informatics and Sciences, Nagoya University, Nagoya , Japan 7 () Japan Society for Promotion of Science (JSPS Postdoctoral Fellowship for Overseas Researchers) 8, International University for Science and Technology (IUST), Syria a) nakano@cc.kumamoto-u.ac.jp TEX ( ) Web Web [1] Web LMS Web JavaScript [7], [8] Maxima[2], JSONP[3], Ajax (jquery), MathML[4], FLOT[5] (HTML5 Canvas[6] ) SCORM[9] SCORM [10] Maxima 1 Maxima 1

Maxima Web JavaScript TEX MathML[4] Maxima [11] Moodle[12] STACK[13] MathDox[14] MathDox formula editor Maxima [11] 2 STACK MathDox formula editor

2 1 [7], [8] Fig. 1 A Sample web page for interactive inputting formula and plotting a graph [7], [8]. 2 STACK MathDox [11] Fig. 2 Applying MathDox for answering the STACK s quiz [11]. 3 Fig. 3 MathDox Maxima Applying Maxima s functions to the original demonstration of MathDox. Maxima Web JavaScript TEX MathML[4] Maxima [11] Moodle[12] STACK[13] MathDox[14] MathDox formula editor Maxima [11] 2 STACK MathDox formula editor MathML [7], [8] [15] Web API RPC[16] Web Service REST[17] 2. MathDox Maxima 3 MathDox ( ) Maxima MathJax MathDox MathDox formular editor Maxima [11] JavaScript MathDox MathML Maxima 3 2

3 $ ("# MMLxml "). html ( x2answer ); // MathML MathJax. Hub. Queue ([" Typeset ", // MathJax MathJax.Hub," MMLxml "]) ; 5 MathJax MathML JavaScript Fig. 5 A JavaScript code for refreshing MathML by MathJax. (a) Maxima MathDox (a) Editing an equation by MathDox s equation editor. (b) MathJax (b) Showing the above equation by MathJax. Fig. 4 4 Editing and showing an equation. MathDox MathML [11] 4 Maxima MathDox MathJax 4(a) [11] factor Maxima 4(b) 4(a) MathJax MathJax CSS MathML SVG MathML 5 MathJax 6 Web API Maxima Maxima MathML 6(c) simple Maxima 6(a) Maxima MathJax 6(b) Maxima MathML 6(c) simple 6(d) MathML MathJax Maxima MathDox MathDox Maxima ( Maxima ) Maxima MathML (simple ) Maxima MathDox (?) 3. JSONP REST Web API Web API RPC[16] [7], [8], [9] Web Service REST[17] JSONIC[19] RPC REST 3

4 ) 4. MathJax (a) MathJax (a) Editing a rather complex equation and zooming by MathJax. (b) WebAPI Maxima (b) Normal output of the Maxima through Web API. (c) WebAPI simple Maxima (c) simple type output of the Maxima through Web API. (d) WebAPI MathML Maxima MathJax (d) MathML type output of the Maxima through Web API and shown by MathJax. Fig. 6 6 Web API Maxima Various type of the Maxima s output through WebAPI. REST JSONP Web Web API 7 Web jquery Web API JavaScript JavaScript WebAPI Web HTML id 8 JSONIC Web API REST Java JSON Maxima MathML mathml.lisp[20] NULL (Maxima 9 MathJax HTML [21] TeX MathML article MathML MathJax MathML 5 5. Maxima Web Maxima MathDox MathJax Web JSONP Web API RPC REST Maxima Maxima MathDox JSPS , [1] webmathematica webmathematica/, MapleNet maplenet/, Sage MaximaPHP [2] : [3] jquery JavaScript,, (2009/11) p.349. [4] : W3C Math Home, [5] [6] HTML5 Canvas [7] Muhammad Wannous 4

5 function execute ( id, outstyle, command ) { $. getjson (" http :// / maximaexecute. json? callback =?", // JSONP callback =? { outstyle : outstyle, command : command, // function ( data ) { $ ("#"+ id). text ( data. result ); // ); 7 Web API JavaScript (jquery ) Fig. 7 Essential JavaScript code for calling the Web API (using jquery). public class MaximaExecuteService { public HttpServletRequest request ; public LinkedHashMap < String, Object > find ( Map < String, Object > params ) { LinkedHashMap < String, Object > ret = new LinkedHashMap < String, Object >() ; String outstyle = params. get (" outstyle "). tostring (); String command = params. get (" command "). tostring (); if( outstyle. equals (" simple ")) { command = " display2d : false$ "+ command + ";"; // simple else if( outstyle. equals (" mathml ")) { command = " load (\" mathml. lisp \") $mathml ("+ command +") $"; // MathML else { command = command + ";"; // String result = ( new Maxima ()). executerawcommand ( command ). tostring (); // Maxima ret. put (" result ", result ); // JSON return ret ; Fig. 8 8 Web API Java (JSONIC ) Essential Java code for responsing the Web API (using JSONIC) <head > < script type =" text / javascript " src =" http :// cdn. mathjax. org / mathjax / latest / MathJax.js? config =TeX -AMS - MML_HTMLorMML "></ script > <body > <article > ( MathML MathJax ( MathJax automatically display MathML written here ) </ article > 9 MathJax JavaScript [21] Fig. 9 JavaScript code for using MathJax Maxima 35 pp (2010). [8] Nakano, H., Nagai, T., Jia Y., Wannous, M. and Kita, T.: Mashup approach for embedding algebraic manipulations, formulas and graphs in web pages, Global Engineering Education Conference (EDUCON), 4-6 April 2011, Amman, pp (2011). [9] [10] Muhammad Wannous, Maxima SCORM. Vol.2011, No.3, pp.1 6 ( ). [11],, : MathDox 5

6 STACK, PC (CD-ROM), pp (2014). [12] [13] Chris Sangwin: Computer Aided Assessment of Mathematics, Oxford University Press (2013). [14] [15] [16] JSON-RPC 2.0 Specification : [17] Roger L. Costello, Building Web Services the REST Way : [18] MathJax MathML Support : [19] jsonic.jar - simple json encoder/decoder for java, [20] mathml.lisp - MathML Conversion in Maxima [21] The TeX-AMS-MML HTMLorMML configuration file : #the-tex-ams-mml-htmlormml-configuration-file 6

JavaScript MathTOUCH (Shizuka Shirai) Graduate School of Human Environmental Sciences, Mukogawa Women s University (Tetsuo Fukui) S

JavaScript MathTOUCH (Shizuka Shirai) Graduate School of Human Environmental Sciences, Mukogawa Women s University (Tetsuo Fukui) S Title JavaScript 版数式入力インタフェース MathTOUCH の試作 ( 数学ソフトウェアとその効果的教育利用に関する研究 ) Author(s) 白井, 詩沙香 ; 福井, 哲夫 Citation 数理解析研究所講究録 (2015), 1951: 34-39 Issue Date 2015-06 URL http://hdl.handle.net/2433/223967 Right