MZ3 Examples

From MegaZine3
Jump to navigation Jump to search


Examples of elements that can be used in the book definition file.

Book

<book
    pagewidth="430"
    pageheight="600"
    bgcolor="0xffffff"
    plugins="navigationbar, gallery, links, anchors"
    lang="en,de"
    minscale="0.5"
>
    <background>
        <box anchors="0,0,pw,ph" background="image(data/overall_bg.png)"/>
    </background>
    <pagebackground>
        <box width="pagew" height="pageh" background="image(data/prepage.jpg)"/>
    </pagebackground>

    <chapter>
        <page>
            <img src="data/cover.jpg"/>
        </page>
        <!-- ... -->
    </chapter>
    <!-- ... -->
</book>

Book Elements

Chapter

<book>
  <chapter bgsound="data/c1_bg.mp3">
    <!-- ... -->
  </chapter>
  <chapter anchor="chapter2" bgcolor="0xFF9999">
    <!-- ... -->
  </chapter>
</book>

Page

<book>
  <chapter>
    <page bgcolor="0x9999FF" stiff="true">
      <img src="data/cover.jpg"/>
    </page>
    <page>
      <img src="data/index.jpg"/>
      <nav>
        <!-- ... -->
      </nav>
    </page>
    <page>
      <img src="data/background.jpg"/>
      <vid src="data/intro.flv" position="center middle"/>
    </page>
    <!-- ... -->
    <page>
      <img src="data/cover_back.jpg"/>
    </page>
  </chapter>
</book>

Spreadpage

<book>
  <chapter>
    <page/>
    <spreadpage foldfx="0">
      <vid src=".." position="center middle"/>
    </spreadpage>
    </page>
  </chapter>
</book>

Page Elements

Area

<book plugins="anchors,links,overlays">
    <chapter>
        <page>
            <img src="data/cover.jpg"/>
            <area width="200" height="100" url="anchors:index"/>
        </page>
        <spreadpage anchor="index">
            <img src="data/index.jpg"/>
        </spreadpage>
        <!-- ... -->
    </chapter>
</book>

Image

<book>
    <chapter>
        <!-- ... -->
        <page>
            <img src="data/background.jpg"/>
            <img src="data/form.swf"/>
        </page>
        <!-- ... -->
    </chapter>
</book>

Image Elements

Scale
<img position="center middle" width="1280" height="853" hires="../example/img/f028.jpg" gallery="test" title="this is an example to show how scaling works">
	<src lang="de" >../example/img/s028.jpg</src>
	<src scale="0.9" lang="de">../example/img/m028.jpg</src>
	<src scale="2.0" lang="de">../example/img/f028.jpg</src>
	<src lang="en" >../example/img/s028.jpg</src>
	<src scale="0.9" lang="en">../example/img/m028.jpg</src>
	<src scale="1.8" lang="en">../example/img/f028.jpg</src>
</img>

This is kind of maximal approach: 3 stages of scale and the option to have different scales or images by language (in this example the images are the same) If the scale is lower than 0.9 than the default image s028.jpg will be shown. When zooming in and the scale is higher than 0.9 for both the German and English language the higher reolution image m028.jpg is (re)loaded. If scale goes up, in case of language is English, at a scale higher than 1.8 the high resolution image f028.jpg is loaded. If German is selected that trigger level is not at 1.98 but at 2.0

s: small, m: medium, f: full resolution; just one way to do it. You also might have different directories like "jpg" and "swf" and use JPG images at low scale (faster) and switch to SWF at higher zoom levels.

Navigation

<nav align="center" position="center middle" color="#423e21" hover="#5e5934" >
    <lnk url="http://www.example.com/" target="_self"><![CDATA[<font face="serif" size="24">External link</font>]]></lnk>
    <lnk url="anchor:prologue"><![CDATA[<font face="serif" size="24">Prologue</font>]]></lnk>
    <lnk url="anchor:chapter1"><![CDATA[<font face="serif" size="24">Chapter I - Features</font>]]></lnk>
    <lnk url="anchor:chapter2"><![CDATA[<font face="serif" size="24">Chapter II - Elements And this is Some More text</font>]]></lnk>
    <lnk url="anchor:references"><![CDATA[<font face="serif" size="24">References</font>]]></lnk>
    <!-- Default format for this entry -->
    <lnk url="anchor:epilogue">Epilogue</lnk>
    
    <!-- Won't show the external link in german -->
    <lnk lang="de" url="anchor:download"><![CDATA[<font face="serif" size="24">Download</font>]]></lnk>
    <lnk lang="de" url="anchor:prologue"><![CDATA[<font face="serif" size="24">Prolog</font>]]></lnk>
    <lnk lang="de" url="anchor:chapter1"><![CDATA[<font face="serif" size="24">Kapitel I - Features</font>]]></lnk>
    <lnk lang="de" url="anchor:chapter2"><![CDATA[<font face="serif" size="24">Kapitel II - Elemente</font>]]></lnk>
    <!-- Won't show the 'references' link in german -->
    <lnk lang="de" url="anchor:epilogue">Epilog</lnk>
</nav>

Sound

<page bgcolor="0x01BCDEF1" foldfx="0" stiff="true" >
    <snd src="snd/your.mp3" onlywhenactive="true"/>
</page>

Video

<book>
    <chapter>
        <page>
            <vid src="data/video.f4v" position="middle center"
                 onlywhenactive="true" gui="elements/vidgui.swf"
                 preview="data/video_preview.jpg"/>
        </page>
        <!-- ... -->
    </chapter>
</book>