tooltip devient hotspot
authorPatrick PIERRE
lun., 11 mars 2013 14:54:12 +0100
changeset 176 b1ce505b889d
parent 175 9817635631aa
child 177 fbd3e7259bbc
tooltip devient hotspot
RelaxNG/Examples/Documents/torture_test.xml
RelaxNG/Examples/Quiz/Images/blanks-select_hotspotsi01.jpg
RelaxNG/Examples/Quiz/Images/blanks-select_tooltipsi01.jpg
RelaxNG/Examples/Quiz/blanks-select_hotspots.xml
RelaxNG/Examples/Quiz/blanks-select_tooltips.xml
RelaxNG/publidoc.rnc
RelaxNG/publiquiz.rnc
Xxe/Css/publidoc.css
--- a/RelaxNG/Examples/Documents/torture_test.xml	mer. mars 06 16:02:01 2013 +0100
+++ b/RelaxNG/Examples/Documents/torture_test.xml	lun. mars 11 14:54:12 2013 +0100
@@ -530,9 +530,9 @@
             </p>
             <media>
               <image id="f-gcru">
-                <tooltip x="27.5%" y="55.4%" dx="-6.5" dy="-11"><p>Directionnel</p></tooltip>
-                <tooltip x="72.2%" y="40.1%" dx="-7.5" dy="-11"><p>Compte-tours</p></tooltip>
-                <tooltip x="59%" y="74.9%" dx="-9.4" dy="-17.8"><image id="zoom_oil"/></tooltip>
+                <hotspot x="27.5%" y="55.4%" dx="-6.5" dy="-11" hidden="true"><p>Directionnel</p></hotspot>
+                <hotspot x="72.2%" y="40.1%" dx="-7.5" dy="-11" hidden="true"><p>Compte-tours</p></hotspot>
+                <hotspot x="59%" y="74.9%" dx="-9.4" dy="-17.8" hidden="true"><image id="zoom_oil"/></hotspot>
               </image>
               <caption x="1%" y="1%">Robin DR-400, F-GCRU.</caption>
             </media>
Binary file RelaxNG/Examples/Quiz/Images/blanks-select_hotspotsi01.jpg has changed
Binary file RelaxNG/Examples/Quiz/Images/blanks-select_tooltipsi01.jpg has changed
--- /dev/null	jeu. janv. 01 00:00:00 1970 +0000
+++ b/RelaxNG/Examples/Quiz/blanks-select_hotspots.xml	lun. mars 11 14:54:12 2013 +0100
@@ -0,0 +1,25 @@
+<?xml version='1.0' encoding='utf-8'?>
+<!-- $Id$ -->
+<publiquiz version="1.0">
+  <quiz id="blanks-select_hotspots">
+    <head>
+      <title>Exercice à trous avec placement sur image</title>
+    </head>
+
+    <instructions>
+      <p>Placez correctement chaque élément de la voiture.</p>
+    </instructions>
+
+    <blanks-select>
+      <media>
+        <image id="blanks-select_hotspotsi01">
+          <hotspot x="25%" y="45.5%"><blank>le volant</blank></hotspot>
+          <hotspot x="62%" y="24%"><blank>le pare-brise</blank></hotspot>
+          <hotspot x="63%" y="77%"><blank>le siège</blank></hotspot>
+          <hotspot x="46%" y="68%"><blank>le levier de vitesse</blank></hotspot>
+          <hotspot x="1%" y="25.4%"><blank>le rétroviseur</blank></hotspot>
+        </image>
+      </media>
+    </blanks-select>
+  </quiz>
+</publiquiz>
--- a/RelaxNG/Examples/Quiz/blanks-select_tooltips.xml	mer. mars 06 16:02:01 2013 +0100
+++ /dev/null	jeu. janv. 01 00:00:00 1970 +0000
@@ -1,25 +0,0 @@
-<?xml version='1.0' encoding='utf-8'?>
-<!-- $Id$ -->
-<publiquiz version="1.0">
-  <quiz id="blanks-select_tooltips">
-    <head>
-      <title>Exercice à trous avec placement sur image</title>
-    </head>
-
-    <instructions>
-      <p>Placez correctement chaque élément de la voiture.</p>
-    </instructions>
-
-    <blanks-select>
-      <media>
-        <image id="blanks-select_tooltipsi01">
-          <tooltip x="25%" y="45.5%"><blank>le volant</blank></tooltip>
-          <tooltip x="62%" y="24%"><blank>le pare-brise</blank></tooltip>
-          <tooltip x="63%" y="77%"><blank>le siège</blank></tooltip>
-          <tooltip x="46%" y="68%"><blank>le levier de vitesse</blank></tooltip>
-          <tooltip x="1%" y="25.4%"><blank>le rétroviseur</blank></tooltip>
-        </image>
-      </media>
-    </blanks-select>
-  </quiz>
-</publiquiz>
--- a/RelaxNG/publidoc.rnc	mer. mars 06 16:02:01 2013 +0100
+++ b/RelaxNG/publidoc.rnc	lun. mars 11 14:54:12 2013 +0100
@@ -351,8 +351,7 @@
 
 image.content =
    copyright?,
-   hotspot*,
-   tooltip*
+   hotspot*
 
 # ~~~~~~ audio
 audio = element audio { audio.attributes }
@@ -374,30 +373,22 @@
 hotspot.attributes =
    x.attribute
  & y.attribute
+ & dx.attribute?
+ & dy.attribute?
  & (width.attribute & height.attribute)?
+ & hidden.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})?%"} }
+dx.attribute = attribute dx { xsd:token {pattern = "-?\d{1,2}(\.\d)?"} }
+dy.attribute = attribute dy { xsd:token {pattern = "-?\d{1,2}(\.\d)?"} }
 width.attribute = attribute width {
    xsd:token {pattern = "\d{1,2}(\.\d{1,2})?%"} }
 height.attribute = attribute height {
    xsd:token {pattern = "\d{1,2}(\.\d{1,2})?%"} }
-
+hidden.attribute = attribute hidden { xsd:boolean }
+   
 hotspot.content =
-   (link | audio | video)
-   
-# ~~~~~~ tooltip
-tooltip = element tooltip { tooltip.attributes, tooltip.content }
-
-tooltip.attributes =
-   x.attribute
- & y.attribute
- & dx.attribute?
- & dy.attribute?
-dx.attribute = attribute dx { xsd:token {pattern = "-?\d{1,2}(\.\d)?"} }
-dy.attribute = attribute dy { xsd:token {pattern = "-?\d{1,2}(\.\d)?"} }
-
-tooltip.content =
-   (p+ | image)
+   (p | link | image | audio | video)
    
 # ~~~~~~ media.caption
 media.caption = element caption { caption.attributes, caption.content }
--- a/RelaxNG/publiquiz.rnc	mer. mars 06 16:02:01 2013 +0100
+++ b/RelaxNG/publiquiz.rnc	lun. mars 11 14:54:12 2013 +0100
@@ -373,13 +373,13 @@
 blanks.image.content =
    copyright?,
    hotspot*,
-   blanks.tooltip*
+   blanks.hotspot*
 
-# ~~~~~~ blanks.tooltip
-blanks.tooltip = element tooltip { tooltip.attributes, blanks.tooltip.content }
+# ~~~~~~ blanks.hotspot
+blanks.hotspot = element hotspot { hotspot.attributes, blanks.hotspot.content }
 
-blanks.tooltip.content =
-   (p+ | image | blank)
+blanks.hotspot.content =
+   (p | image | blank)
 
 # ~~~~~~~~~~~~~~~~~~~~~~~~ choices.right, choices.wrong ~~~~~~~~~~~~~~~~~~~~~~~
 
--- a/Xxe/Css/publidoc.css	mer. mars 06 16:02:01 2013 +0100
+++ b/Xxe/Css/publidoc.css	lun. mars 11 14:54:12 2013 +0100
@@ -509,40 +509,34 @@
 hotspot {
   display: block;
   padding: .5em;
+  margin-right: 1.5em;
   background-color: #ffefd8;
   border-radius: 1.5em;
 }
 
-/* tooltip ~~~~~~~~~~~~~~~~~~~~~~~~~ */
-
-tooltip image:before {
+hotspot image:before {
   content: "";
 }
-tooltip > image {
+hotspot > image {
   content: concatenate("image('Images/", attr(id), ".png', -128, -96, smooth)");
 }
 
-tooltip {
-  display: block;
-  padding: .4em;
-  margin: 0 1em .1em 0; 
-  background-color: #eaffe9;
-  border-radius: 1.5em;
+hotspot p:before {
+  content: "";
 }
-
-tooltip > p {
+hotspot > p {
   font-family: sans-serif;
   font-size: 85%;
 }
 
-tooltip > blank {
+hotspot > blank {
   background-color: transparent;
 }
 
-tooltip:after {
+hotspot:after {
   display: marker;
   padding-bottom: .7em;
-  content: insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
+  content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc));
 }
 
 /* audio ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */