Mise en place des scénarios hotspot
authorPatrick PIERRE
dim., 17 mars 2013 12:41:21 +0100
changeset 183 f9b4457d0778
parent 182 af222772225f
child 184 68fd62d59f7c
Mise en place des scénarios hotspot
RelaxNG/Examples/Documents/torture_test.xml
RelaxNG/publidoc.rnc
RelaxNG/publiquiz.rnc
Xxe/Css/publidoc.css
--- a/RelaxNG/Examples/Documents/torture_test.xml	sam. mars 16 20:42:16 2013 +0100
+++ b/RelaxNG/Examples/Documents/torture_test.xml	dim. mars 17 12:41:21 2013 +0100
@@ -505,7 +505,7 @@
             <media>
               <image id="cosette">
                 <copyright>Émile BAYARD</copyright>
-                <hotspot x="35%" y="32%" w="34%" h="50%" type="border">
+                <hotspot x="35%" y="32%" w="34%" h="50%" type="visible">
                   <link idref="cosette"/>
                 </hotspot>
               </image>
@@ -530,14 +530,32 @@
             </p>
             <media>
               <image id="f-gcru">
-                <hotspot x="23.5%" y="48.7%" w="7.5%" h="14.2%" type="border">
+                <hotspot x="23.5%" y="48.7%" w="7.5%" h="14.2%" type="normal"
+                         dx="-1" dy="-4.1" dw="0">
                   <p>Directionnel</p>
+                  <scenario>
+                    <init action="hide"/>
+                    <onclick action="show"/>
+                  </scenario>
                 </hotspot>
-                <hotspot x="68.2%" y="33.2%" w="7.5%" h="14.2%" type="border">
+                <hotspot x="68.2%" y="33.2%" w="7.5%" h="14.2%" type="visible"
+                         dx="-2.5" dy="-4.1" dw="0">
                   <p>Compte-tours</p>
-                </hotspot>
-                <hotspot x="55.3%" y="67.8%" w="7.5%" h="14.2%" type="pulse">
+                  <scenario>
+                    <init action="hide"/>
+                    <onclick action="show"/>
+                  </scenario>
+                 </hotspot>
+                <hotspot x="55.3%" y="67.8%" w="7.5%" type="pulse"
+                         dx="-2.5" dy="-6" dw="5">
                   <image id="zoom_oil"/>
+                  <scenario>
+                    <init action="hide"/>
+                    <onclick action="show"/>
+                  </scenario>
+                 </hotspot>
+                <hotspot x="1%" y="93.5%" w="0%">
+                  <p>Copyright P²</p>
                 </hotspot>
               </image>
               <caption x="1%" y="1%">Robin DR-400, F-GCRU.</caption>
--- a/RelaxNG/publidoc.rnc	sam. mars 16 20:42:16 2013 +0100
+++ b/RelaxNG/publidoc.rnc	dim. mars 17 12:41:21 2013 +0100
@@ -376,18 +376,25 @@
    x.attribute
  & y.attribute
  & w.attribute
- & h.attribute
- & (hotspot.type.attribute & dx.attribute? & dy.attribute?)?
+ & h.attribute?
+ & (hotspot.type.attribute
+  & dx.attribute?
+  & dy.attribute?
+  & dw.attribute?
+  & dh.attribute?)?
 x.attribute = attribute x { xsd:token {pattern = "\d{1,2}(\.\d{1,2})?%"} }
 y.attribute = attribute y { xsd:token {pattern = "\d{1,2}(\.\d{1,2})?%"} }
 w.attribute = attribute w { xsd:token {pattern = "\d{1,2}(\.\d{1,2})?%"} }
 h.attribute = attribute h { xsd:token {pattern = "\d{1,2}(\.\d{1,2})?%"} }
-hotspot.type.attribute = attribute type { "pulse" | "border" }
-dx.attribute = attribute dx { xsd:token {pattern = "-?\d{1,2}(\.\d)?"} }
-dy.attribute = attribute dy { xsd:token {pattern = "-?\d{1,2}(\.\d)?"} }
+hotspot.type.attribute = attribute type { "normal" | "visible" | "pulse" }
+dx.attribute = attribute dx { xsd:token {pattern = "-?\d{1,2}(\.\d{1,2})?"} }
+dy.attribute = attribute dy { xsd:token {pattern = "-?\d{1,2}(\.\d{1,2})?"} }
+dw.attribute = attribute dw { xsd:token {pattern = "\d{1,2}(\.\d{1,2})?"} }
+dh.attribute = attribute dh { xsd:token {pattern = "\d{1,2}(\.\d{1,2})?"} }
    
 hotspot.content =
-   (p | link | image | audio | video)
+   (p | link | image | audio | video),
+   scenario?
    
 # ~~~~~~ media.caption
 media.caption = element caption { caption.attributes, caption.content }
@@ -396,6 +403,29 @@
    x.attribute?
  & y.attribute?
 
+# ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ scenario ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+# ~~~~~~ scenario
+scenario = element scenario { scenario.content }
+
+scenario.content =
+   init*,
+   onclick*
+
+# ~~~~~~ init
+init = element init { init.attributes }
+
+init.attributes =
+   init.action.attribute
+init.action.attribute = attribute action { "hide" }
+
+# ~~~~~~ onclick
+onclick = element onclick { onclick.attributes }
+
+onclick.attributes =
+   onclick.action.attribute
+onclick.action.attribute = attribute action { "show" }
+
 
 # =============================================================================
 #                                 HEAD LEVEL
--- a/RelaxNG/publiquiz.rnc	sam. mars 16 20:42:16 2013 +0100
+++ b/RelaxNG/publiquiz.rnc	dim. mars 17 12:41:21 2013 +0100
@@ -372,14 +372,18 @@
 
 blanks.image.content =
    copyright?,
-   hotspot*,
    blanks.hotspot*
 
 # ~~~~~~ blanks.hotspot
-blanks.hotspot = element hotspot { hotspot.attributes, blanks.hotspot.content }
+blanks.hotspot = element hotspot {
+   blanks.hotspot.attributes, blanks.hotspot.content }
+
+blanks.hotspot.attributes =
+   x.attribute
+ & y.attribute   
 
 blanks.hotspot.content =
-   (p | image | blank)
+   blank
 
 # ~~~~~~~~~~~~~~~~~~~~~~~~ choices.right, choices.wrong ~~~~~~~~~~~~~~~~~~~~~~~
 
--- a/Xxe/Css/publidoc.css	sam. mars 16 20:42:16 2013 +0100
+++ b/Xxe/Css/publidoc.css	dim. mars 17 12:41:21 2013 +0100
@@ -508,8 +508,8 @@
 
 hotspot {
   display: block;
-  padding: .5em;
-  margin-right: 1.5em;
+  padding: .4em;
+  margin: 0 1em .1em 0; 
   background-color: #ffefd8;
   border-radius: 1.5em;
 }
@@ -527,6 +527,7 @@
 hotspot > p {
   font-family: sans-serif;
   font-size: 85%;
+  margin: 0 .5em 0 .5em;
 }
 
 hotspot > blank {