The most important changes of this version are::

2019-04-07 Minor Bug Fixes

  • Values for dragrange could not be made with the slider
  • Position auf language code was too close to the elements of the navbar if the language code was added to the center navbar
  • the elements in the center navbar were not centered if language codes were existent in the left or right navbar area
  • The XAMPP/htdocs/ folder was not preset as default publish path if XAMPP was installed
  • Corrected logic for “Batch PDF Conversion”
    During and automatic conversion (Batch PDF Conversion) PIMGs are not added automatically, becasue the decision what image type to use must be made by the user

2019-04-06 Zoom and Pan improvements on PC

The book now is zoomed-in with the actual mouse position as focus point; i.e. the selected position of the page stays in focus and remains visible (i.e. within the viewport) even if zoomed-in by the maximum value of factor 4.
If the keyboard operation is used (“+” to zoom in and “-” to zoom out), the last selected focus point is used: either the last position with t mouse scroll or the position of the last mouse click.

If no mouse or touchpad is available a pure keyboard control is possible:

  • + zoom in
  • zoom out
  • a-w-d-x for “left-up-right-down” move of the enlarged page
  • s center the enlarged open book

Reason: A mouse-scroll with the CTRL-key pressed is always interpreted by the browser. This cannot be prevented any longer, because the browser forces the “expected user experience”.

2019-03-27 Documentation reworked

Almost all (at least EN) pages had been touched and checked and improved: broken links fixed, typos, strange “translations”, missing parts, new chapters.
Hopefully, everything now is up to date and understandable ;-)

23.03.2019 Open Project functionality completely reworked

The columns show some key project data:

  • Mz3 Project Name
  • Modification Date
  • Page Count
  • Language(s)
  • Count of Page Images PIMG; across all languages)
  • Thumbnail count; total across all languages
  • Count of PDF converted pages across all languages (i.e. the count of JPG, PNG, SWF files each)
  • Element count over all languages, separate by element type: Sound/Audio, Video and Links/Areas

A double click in a row opens the respective project.
A single click selects the project, which then can be opened via the Open button

Every column can be sorted with a click into the title (header cell) of a column.
A next click into the same column header reverts the sort direction.
The selected project remains selected and visible.

Very helpful also for plausibility checks and bug fixing

03/20/2019 Support of Zoom and Pan with mouse or keyboard in Desktop Browsers

Now it is possible to zoom the book (and only the book: Thumbnails and navigation bar remain untouched) via mouse gestures or keyboard short cuts in all modern browsers:.

  • Chrome
  • Firefox
  • Safari
  • Edge
  • Opera

Mouse Gestures

  • “Swipe” gesture with the mouse
    Press the left button and drag the mouse with “some” speed” left/right or up/down to simulate a touch swipe gesture (supported on mobile devices):
    • “Swipe Left”: Previous Page
    • “Swipe Right” Next Page
    • “Swipe Up”: Show Thumbnails
    • “Swipe Down”: Hide Thumbnails
  • Zoom: Scroll the Mouse Wheel to zoom in and out
  • Pan: Drag the mouse with pressed left mouse key
    In case the book was scaled up, it is possible to “move” the book (pan gesture) so the area of interest is positioned within the viewport (visible area of the window).
    In this case (zoom factor > 1) a Swipe is no longer supported.
    Only after the original scale factor of 1 is reached (it is not possible zooming out to scale factors less than 1), the book is reset, i.e. adjusted to the window size.

Keyboard operation

For those who prefer operation by key clicks, all can be achieved via key codes also!

h5: Extended, big keyboards
If a keyboard with Arrow keys or even a numeric pad is available the following keys are supported:

  • Arrow Left/Right: Previous/Next Page
  • Arrow Up/Down: Show/Hide Thumbnails
  • Home/End: First/Last Page
  • Page Up/Down: Zoom In/Out
  • +/- Keys: Zoom-In/Out
  • Arrow Keys on Numeric Pad (on keys 4-8-6-2):
    All Browsers but Edge: Move the scaled-up book with the Arrow Keys on the numeric pad.
    Edge Browser: The Arrow Keys on the numeric pad have the same functions as the “standard” arrow keys (previous/next page, show/hide Thumbs).

Small Keyboard

If the special keys are not available, everything can be operated via special “sets” of alpha keys.
4 adjacent keys are used as a set of keys for the Pan and Page/Thumb control:

  • PAN: A-W-D-X: Move the Book left (“A), up (“W”), right (“D”) or down (“X”)
  • Page/Thumb J-I-L-M: Previous Page (“J”)/Next Page (“L”), Show Thumbs (“I”)/Hide Thumbs (“M”)
  • Zoom-out/in: “U” and “O”

The keys in the middle f the blocks set the book to the original position (0,0 coordinate: “S”-Key) or perform a Reset (“K”-Key).

Alternatively also the “Enter-” and “Space-” Keys perform a reset.

This all should offer sufficient options so everybody can find his perfect “mode of operation”.

BTW: We plan to create a special Help-Po-Up” that shows the most important operations (mouse gestures, keycode); in English and German.
This Pop-Up can be activated via a special Icon/Key (most probably the “?” key) that can be added to the navigation bar or burger menu.

10.03.2019 Thumbnail Support in Javascript

If Page Images are added to the book, the respective Thumbnails are generated automatically.
Thumbnails can be shown in a “Thumb Bar” beneath the book (in the Javascript Version only; the viewer and Flash versions support the “bubbles” only).

Thumbnails can be “swiped” (touch gesture with a finger or simulated with a mouse drag) to move to previous/next pages. The faster the swipe, the bigger the page jump ;-)
Thumbs can be hidden with a sipe down and shown again with a swipe up.
Hiding thumbnails can be helpful to better use the available space for the book.

Thumbnails also can be added independently on a “Page Image Add” operation. Selected Images can be loaded and are converted into thumbnails. The thumb number (page number – 1) can be extracted from the file name or adjusted in several ways via the advanced settings in the Thumbnail WIndow.

03.03.2019 Burger Menu

Additionally to the standard navigation bar a new “burger menu” is supported. This icon is known from websites with special support for mobile devices. The name describes pretty well the icon:
The for horizontal bars look like the stacked layers of a burger ;-)

In the Javascript Settings, it is defined, if the burger menu and/or the navigation bar are shown. If both are selected, the navigation bar is shown in landscape mode and the burger menu in portrait mode and switched automatically, if the mobile device is turned (or the window is scaled so a different aspect ratio of the window is achieved).
In case not all navbar elements would fit, the font and icons are scaled down until a minimal font-size of 8px or icon size of 24px width is reached. After that, the burger menu is selected automatically.

The full burger menu is shown after a click on the burger menu icon
All “tabs” (navigation elements, i.e. either a descriptive text or an icon with tooltip) are listed in kind of table with adjusted width and height.
Another click toggles the list, i.e. closes the table.

20.02.2019 PopUp Menu

To inform or “motivate” users of the book, a Pop-Up Menu can be defined. Such Pop-Ups usually remind to subscribe to a newsletter; or accept special offers.
Content and design can be defined in a special window; available in the Javascript Settings.
The Pop-Up will be shown after a selectable time and/or when the main area is left (in desktop browsers only!).
It also can be defined how often the pop-up is shown (once per session, ever n days).

20.02.2019 Additional HTML Parameters

The index.html file supports several “Meta Tags”. Those tags can be set via Javascript Parameters. WIth such Meta Tags, it e.g. is possible to select which image is shown in a facebook link.
The following screenshot shows a list of supported parameters. This list was achieved in filtering the Javascript book parameters with the keyword “HTML”.

Improved Google Analytics Support for JavaScript

Now a more granular reporting is supported, i.e. all three levels of details plus an optional value are supported now:

  • event
  • category
  • label
  • value
  1. Settings – Configure JavaScript Settings
  2. Book Parameters
  3. Search/Filter: “analyt” (or ‘gaaccount’ or ‘google’ or …)
  4. Click on ‘gaaccount’
  5. Enter your Google Analytics ID: UA-xxxxxxxx-x, confirm with ‘Return’ and ‘Save’

GA Events

The following events are used and tracked: * openMagazine
Triggered whenever the magazine is opened

  • video
    Triggered when the user interacts with an in-book-video
    Supported labels:
    • ‘playSpVid’ + videoName
    • ‘pauseSpVid’ + videoName
      Supported value (pause only):
    • current time when paused
  • sound
    Triggered in case of any interaction with a sound element.
    Supported labels:
    • ‘playSound: ‘ + soundName
    • ‘pauseSound: ‘ + soundName
      Supported value (pause only):
    • current time when paused
  • goto_page
    Whenever a new page is opened, this event is triggered
    Supported label:
    • the destination, i.e. the page number selected
      Supported value:
    • number of skipped pages
  • mz3Click
    If an Mz3 Element is clicked, this event is triggered.
    Supported labels (clicks) are
    • clicks on an external link (<a> tag with href defined)
    • clicks on an internal link (<a> tag with onclick defined)

GA Category

As category always the actual Mz3 Book Title (project name) followed by an (optionally) defined <head><title> is tracked
Such Meta Title can be entered via Book Parameters as htmlTitle (Search/Filter for it!).


What is tracked as a label depends on the kind of Event.

  • video and sound Events
    Play and Pause interactions are tracked independently
  • goto_page Event
    The page number of the page that is opened (jumped to)
  • mz3Click
    The destination of the clicked element’s anchor tag:
    • The path of the external URL
    • The internal page number (or anchor name)



Little bug fixes:

  • Menu: enable/disable menu items depending on the actual state


Better support for videos on double pages

Videos now can play inside double pages also; as long as the complete video box (preview image) fits into either the left or right half of the double page (i.e. it must not be wider than a single page and not cross the fold in the middle.
The operation is very easy: As soon as the above conditions are met, the “In Book Video” checkbox appears and the checkbox is pre-selected.

If the video is too wide or spans across the fold, that option disappears and the video will play in a separate window or tab (depending on the user’s preferences).
A video that “could” play within the book can optionally be opened in a separate window/tab also.
For this simply delete un-check the box.

Improved licence key editiing

Before the licence key had to be entered in clicking Retunr.
This was not obvious, because no information was provided and the next option to check/verify the key was not shown.
Now it is sufficient to move the mouse out of the licence key field and immediate pre-check is done and the Check! button is enabled.
WIth one move to the right the then avialble Check! can be done to verify the license key against the server database.



API and Structure Changes

  • css-files re-organized
    All Plugin-specific css-File are combined in the all.css file, which will be loaded first.
    All Mz3-specific css-Files follow
    The last css-File, and with that with the highest priority) is the custom.css File, where you can make Mz3 Project specific Layout changes and overwrite default css-Settings.
  • Technology specific Parameters
    Element and Book Parameters now are sorted by technology. You now first select the technology, i.e.
    • Javascript
    • Air (mz3 Viewer)
    • FLASH
      And then can modify any parameter in the technology-specific list.
      The Javascript Version e.g. supports different SOund Parameters than the mz3Viewer and Flash Variant.
      Selecting mz3Viewer (i.e. more precisely: AIR) as technology, only a relevant subset of all book parameters supported in FLASH is presented.
      Common Parameters are used in all technologies, i.e. modifying a common parameter adjusts that parameter in the other technologies also.
      Therefore any parameter missing in mz3Viewer could still be modified in changing the corresponding FLASH parameter. As long as that parameter is supported in mz3Viewer.
      Remark: In mz3Viewer e.g. all Internets specific Parameters (like Favicon, HTML Title, …) are not supported.



Sound buttons: one or more play/pause buttons with linked audio files can be put on pages.
Positioning and sizing the same way as with other elements (e.g.images).
Different designs available plus the standard control (browser dependent design)
Sound optionally starts automatically when the corresponding page becomes visible, and stops when the page is left.


A video on a single page now can be opened “in book”, i.e. on a single page of the book. Optionally a new tab can be used.
The video can be expanded to full screen ( both: the “in book” and the “in new tab” videos).
The default browser control (play/pause, scrub, mute/volume) is used.


New Menu Items: e.g. “Show XAMPP Files”, “Browse XAMPP Project”

  • Help, Documentation
    The new Manual/documentation is used for a context-sensitive help feature:
    With every click of a menu item (and often when selecting/opening new subwindows) the corresponding chapter is shown.
    The chapter is shown in a separate window, that can be sized, positioned and closed as usual.
    The help window opens automatically with the start of mz3Tool, but can be manually switched to “always off” or “always on” (in the Settings - Basic Settings).


  • Better support of old Browsers
    Because we started to make use of new Javascript features and also some used plugins/libraries do so, we transpile the JS programs with a tool (babel) to pure ES5 code.
    This helps to support e.g. Safari 9, the highest version available for iPad2 and some older OSx versions.
  • Watermark-Area in Demo version reduced
    The watermark layer started in the top-left most corner and covered the drag range and sound buttons located on top of a page.
    This blocked mouse clicks and a page could not be flipped or a sound started/paused.

Bug fixes

The “overwrite” switch in ‘Add Page Image’ only was used locally but not when the file was about to be copied.
New Page Images did not overwrite existing “pages”; which made an update only possible after the respective page image was deleted manually.

Revision: 4
Last modified: 8 April 2019


Was this helpful?

Yes No
You indicated this topic was not helpful to you ...
Could you please leave a comment telling us why? Thank you!
Thanks for your feedback.

Post your comment on this topic.

Post Comment