Difference between revisions of "Tutorial:Creating HTML5 documents with GeoGebraWeb"

From GeoGebra Manual
Jump to: navigation, search
(link to french)
(removed "offline" information (wrong) and tidied)
Line 1: Line 1:
== GeoGebraWeb documents ==
+
== GeoGebraWeb Applets==
  
With GeoGebra 4.2 we have introduced pure HTML5 GeoGebra documents. This way GeoGebra applets start even faster than before, and this technology provides availability of GeoGebra for smartphone users as well since Java is no longer a prerequisite. Such documents currently can have just a Graphics View (ie spreadsheets do not work yet), and they have no menu driven graphical user interface, but otherwise have the same features as usual GeoGebra documents. The main advantage is that GeoGebra runs on a wider set of hardware at a more comfortable speed, but to harness all the possibilities one should always use the latest web browsers. In short, we call this technology ''GeoGebraWeb'', and the documents created by this method are called ''GeoGebraWeb documents''.
+
With GeoGebra 4.2 we have introduced pure HTML5 GeoGebra documents. This way GeoGebra applets start even faster than before, and this technology provides availability of GeoGebra for smartphone users as well since Java is no longer a prerequisite. The main advantage is that GeoGebra runs on a wider set of hardware at a more comfortable speed, but to harness all the possibilities one should always use the latest web browsers. In short, we call this technology ''GeoGebraWeb'', and the documents created by this method are called ''GeoGebraWeb Applets''.
 
<div style="overflow: auto;">
 
<div style="overflow: auto;">
 
<div style="float:right;">
 
<div style="float:right;">
Line 7: Line 7:
 
</div>
 
</div>
  
There are two types of GeoGebraWeb documents: ''online'' and ''offline''. Online documents are usually hosted by the official GeoGebra servers, primarily by GeoGebra; and offline documents are usually put on intranet servers by members of the GeoGebra community, or even on the end users' own machine.
+
There are two types of GeoGebraWeb Applets: ''online'' and ''offline''. Online documents are usually on GeoGebra; and offline documents are usually put on intranet servers by members of the GeoGebra community, or even on the end users' own machine.
  
 
=== Online documents ===
 
=== Online documents ===
  
We suggest using online documents everywhere! GeoGebra automatically detects a user's web browser and decides if it is running on a smartphone, and serves the document in GeoGebraWeb format. Hence we strongly suggest to upload all your documents to GeoGebraWeb if you want to publish teaching materials. This has a great advantage: GeoGebra will always show the latest GeoGebraWeb document when a user wants to visit it on his/her smartphone. In some cases, however, GeoGebra cannot identify the end user's machine correctly: in such cases we recommend to add the '''&mobile=true''' setting to the end of the document URL.
+
We suggest using online documents everywhere! GeoGebra automatically detects a user's web browser and decides if it is running on a smartphone, and serves the document in GeoGebraWeb format. Hence we strongly suggest to upload all your documents to GeoGebraWeb if you want to publish teaching materials. This has a great advantage: GeoGebra will always show the latest GeoGebraWeb document when a user wants to visit it on their smartphone.  
 
 
=== Offline documents ===
 
 
 
In some situations it is useful to have offline GeoGebraWeb documents available. For example, if internet is not available during a classroom teaching, or during a travel without an internet connection good enough.
 
 
 
Since version 4.1.62.0, offline GeoGebraWeb documents can also be created in GeoGebra by following these steps: In ''File'' menu, go to ''Export'' -> ''Dynamic worksheet as webpage (html)'',click the "Export as Webpage" tab, then select the "Advanced" tab and check for the following options in the "Files" settings:
 
 
 
* Export to HTML5 only
 
* Allow offline use
 
 
 
Then press "Export". Now GeoGebra will automatically download the required set of files and copy them into the appropriate directory. Please expect approximately 40 MB of data for an offline GeoGebraWeb document. You can simply copy all the created files for this export to another directory or another machine, and use them.
 
  
 
==How GeoGebraWeb works==
 
==How GeoGebraWeb works==
  
GeoGebraWeb consists of a set of HTML files which will be downloaded from the GeoGebra Developer Site by GeoGebra on a user initiated export. The files are packaged in a .zip archive, and can be downloaded manually as well. However, these files are not intended for end users. For those who are still interested in the internal details, and want to tweak the HTML files, we provide some additional information here.
+
GeoGebraWeb consists of a set of files which can be downloaded manually from http://dev.geogebra.org/download/web/GeoGebraWeb-latest.zip. However, these files are not intended for end users. For those who are still interested in the internal details, and want to tweak the HTML files, we provide some additional information here.
  
An HTML document may contain several GeoGebraWeb documents, but here we assume that only one will be used. The HTML file should look something like this:
+
An HTML document may contain several GeoGebraWeb documents. The HTML file should look something like this:
  
 
<pre>
 
<pre>
  <script type="text/javascript" language="javascript" src="GEOGEBRAWEB_SOURCE"></script>
+
  <script type="text/javascript" language="javascript" src="http://www.geogebra.org/web/4.2/web/web.nocache.js"></script>
  <article class="geogebraweb" data-param-width="WIDTH" data-param-height="HEIGHT"
+
  <article class="geogebraweb" data-param-width="600" data-param-height="400"
 
  data-param-showResetIcon="false" data-param-enableLabelDrags="false" data-param-showMenuBar="false"
 
  data-param-showResetIcon="false" data-param-enableLabelDrags="false" data-param-showMenuBar="false"
 
  data-param-showToolBar="false" data-param-showAlgebraInput="true" enableLabelDrags="true"
 
  data-param-showToolBar="false" data-param-showAlgebraInput="true" enableLabelDrags="true"
Line 38: Line 27:
 
</pre>
 
</pre>
  
Here we omit the beginning and closing parts of a typical HTML file and focus only the GeoGebraWeb parts. First of all, the GeoGebraWeb source must be loaded. For online documents the GEOGEBRAWEB_SOURCE must be '''http://www.geogebra.org/web/4.2/web/web.nocache.js''', for offline documents its correct setting is '''web/web.nocache.js'''. The WIDTH and HEIGHT settings should be the desired applet size in pixels. The other parameters are direct settings for GeoGebraWeb. Finally, the data-param-ggbbase64 setting must contain the .ggb file in base64 encoding (as generated by GeoGebra).
+
Here we omit the beginning and closing parts of a typical HTML file and focus only the GeoGebraWeb parts. First of all, the GeoGebraWeb source must be loaded. For online documents the '''src''' must be '''http://www.geogebra.org/web/4.2/web/web.nocache.js''', for offline documents its correct setting is '''web/web.nocache.js'''. The '''data-param-width''' and '''data-param-height''' settings should be the desired applet size in pixels. The other parameters are direct settings for GeoGebraWeb. Finally, the '''data-param-ggbbase64''' setting must contain the .ggb file in base64 encoding (as generated by GeoGebra).
 
 
== How to obtain GeoGebraWeb ==
 
 
 
Every time you export your .ggb file to offline GeoGebraWeb format, the GeoGebra application will download the latest GeoGebraWeb .zip file into your temp directory. To do this manually, you can always download it from http://dev.geogebra.org/download/web/GeoGebraWeb-latest.zip.
 
  
 
If you are a web developer, you can learn even more on this technology on the [http://dev.geogebra.org/trac/wiki/GeoGebraWeb GeoGebra Developer Site].
 
If you are a web developer, you can learn even more on this technology on the [http://dev.geogebra.org/trac/wiki/GeoGebraWeb GeoGebra Developer Site].

Revision as of 22:05, 15 February 2013

GeoGebraWeb Applets

With GeoGebra 4.2 we have introduced pure HTML5 GeoGebra documents. This way GeoGebra applets start even faster than before, and this technology provides availability of GeoGebra for smartphone users as well since Java is no longer a prerequisite. The main advantage is that GeoGebra runs on a wider set of hardware at a more comfortable speed, but to harness all the possibilities one should always use the latest web browsers. In short, we call this technology GeoGebraWeb, and the documents created by this method are called GeoGebraWeb Applets.

There are two types of GeoGebraWeb Applets: online and offline. Online documents are usually on GeoGebra; and offline documents are usually put on intranet servers by members of the GeoGebra community, or even on the end users' own machine.

Online documents

We suggest using online documents everywhere! GeoGebra automatically detects a user's web browser and decides if it is running on a smartphone, and serves the document in GeoGebraWeb format. Hence we strongly suggest to upload all your documents to GeoGebraWeb if you want to publish teaching materials. This has a great advantage: GeoGebra will always show the latest GeoGebraWeb document when a user wants to visit it on their smartphone.

How GeoGebraWeb works

GeoGebraWeb consists of a set of files which can be downloaded manually from http://dev.geogebra.org/download/web/GeoGebraWeb-latest.zip. However, these files are not intended for end users. For those who are still interested in the internal details, and want to tweak the HTML files, we provide some additional information here.

An HTML document may contain several GeoGebraWeb documents. The HTML file should look something like this:

 <script type="text/javascript" language="javascript" src="http://www.geogebra.org/web/4.2/web/web.nocache.js"></script>
 <article class="geogebraweb" data-param-width="600" data-param-height="400"
 data-param-showResetIcon="false" data-param-enableLabelDrags="false" data-param-showMenuBar="false"
 data-param-showToolBar="false" data-param-showAlgebraInput="true" enableLabelDrags="true"
 data-param-ggbbase64="UEsDBBQACAAIAHOOh0AAAAAAAAAAAAAAAAAWAA...=="></article>...

Here we omit the beginning and closing parts of a typical HTML file and focus only the GeoGebraWeb parts. First of all, the GeoGebraWeb source must be loaded. For online documents the src must be http://www.geogebra.org/web/4.2/web/web.nocache.js, for offline documents its correct setting is web/web.nocache.js. The data-param-width and data-param-height settings should be the desired applet size in pixels. The other parameters are direct settings for GeoGebraWeb. Finally, the data-param-ggbbase64 setting must contain the .ggb file in base64 encoding (as generated by GeoGebra).

If you are a web developer, you can learn even more on this technology on the GeoGebra Developer Site.es:Creando Documentos HTML5 con GeoGebraWeb it:Tutorial:Creare documenti HTML5 con GeoGebraWeb

fr:Tutoriel:Créer_un_document_Html5_avec_GeoGebraWeb
© 2020 International GeoGebra Institute