Typos.

diff --git a/doc/demo.xhtml b/doc/demo.xhtml
index c028779..0e5c813 100644 (file)
--- a/doc/demo.xhtml
+++ b/doc/demo.xhtml
@@ -38,9 +38,9 @@
     </script>
 
     <script type="text/javascript">
-/*
-      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeVerticalSlide;
-      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeHorizontalSlide; */
+
+//      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeVerticalSlide;
+//      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeHorizontalSlide; 
       SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
       SWS.Config['sws-object-deactivate'] =  SWS.Effects.objectDeactivateFadeOut;
       SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
@@ -127,70 +127,69 @@ o.attr("style",a.join(";"));
           (videos, vector graphics, sounds,…)
         </li>
       </ul>
-      <p  class="sws-pause">But wait! I'm loosing all those nicely
-      rendered mathematical formulæ!</p>
-      <p class="sws-pause"> You mean like this one<sup>*</sup> ?
-        $$
+      <h1> What's wrong with Powerpoint/Keynote/LibreOffice ?</h1>
+      <span class="sws-pause">Seriously ?</span>
+    </div>
+    <div class="sws-slide">
+      <h1>Can I really use SWS for <i>scientific</i> presentations?</h1>
+      <p  class="sws-pause">You sure can:</p>
+      <ul class="sws-pause">
+       <li> Exhibit A: $$
         F_n = \frac{1}{\sqrt{5}}\cdot\left(\frac{1+\sqrt{5}}{2}\right)^n-\frac{1}{\sqrt{5}}\cdot\left(\frac{1-\sqrt{5}}{2}\right)^n
-        $$
-      </p>
-      <p class="sws-pause">or that one<sup>*</sup> ?
-
-        $$
+        $$</li>
+       <li>Exihbit B: $$
         \frac{\Gamma\cup\{x\mapsto t\}\vdash e : s}{\Gamma\vdash \lambda x^{t}.e : t \rightarrow s}
-        $$
-      </p>
-      <p class="sws-pause">*: All this is done
+        $$</li>
+      </ul>
+      <p class="sws-pause"> All this is done
         using <a href="http://www.mathjax.org">MathJax!</a> and
         written like this:<br/>
 <pre><code>
-    \frac{
-          \Gamma\cup\{x\mapsto t\}\vdash e : s
-    }{
-          \Gamma\vdash \lambda x^{t}.e : t \rightarrow s
+    \frac{ \Gamma\cup\{x\mapsto t\}\vdash e : s
+    }{  \Gamma\vdash \lambda x^{t}.e : t \rightarrow s
     }
 </code></pre>
 </p>
     </div>
-    <div class="sws-slide">
-      <h1>A simple example</h1>
-      <p class="sws-onframe-1_3">
-      A minimal slide, with no animation looks like this:
-<pre><code>
-     &lt;div <em>class="sws-slide"</em>&gt;
-          &lt;h1&gt;Slide title&lt;/h1&gt;
-             Hello world!
-     &lt;/div&gt;
-</code></pre>
-</p>
-<p class="sws-pause">
-  You can also reveal things progressively like this:
-  <pre><code>
-      &lt;p&gt; Text 1&lt;/p&gt;
-      &lt;p <em>class="sws-pause"</em>&gt;
-      Text 2 (appears afterwards)
-      &lt;/p&gt;
-  </code></pre>
-</p>
-<p class="sws-pause">
-  You can also set an element to appear on specific frames:
-  <pre><code>
-      &lt;p&gt; Text 1&lt;/p&gt;
-      &lt;p <em>class="sws-onframe-1-5_9"</em>&gt;
-      Appears on frame 2, 3, 4, 5, 6 and 10 of the current slide
+
+<div class="sws-slide">
+  <h1>A simple example</h1>
+  <p class="sws-onframe-1_3">
+    A minimal slide, with no animation looks like this:
+    <code>
+      &lt;div <em>class="sws-slide"</em>&gt;
+      <![CDATA[ <h1> Slide title </h1>
+               Hello world!
+               </div> ]]>
+                        </code>
+  </p>
+  <p class="sws-pause">
+    You can also reveal things progressively like this:
+    <code><![CDATA[
+      <p> Text 1 </p>
+      <p ]]><em>class="sws-pause"</em><![CDATA[> Text 2 (appears afterwards) </p>]]>
+    </code>
+  </p>
+  <p class="sws-pause">
+    You can also set an element to appear on specific frames:
+    <code><![CDATA[
+     <p>Text1</p>
+     <p ]]> <em>class="sws-onframe-1-5_9"</em> <![CDATA[ >
+      Appears on frame 1, 2, 3, 4, 5, and 9 of the current slide
       (frame numbering starts at 0).
-      &lt;/p&gt;
-  </code></pre>
-</p>
-    </div>
+     </p> ]]>
+    </code>
+  </p>
+</div>
 <div class="sws-slide">
   <h1>Scripting your presentation</h1>
   <p>
     Of course, you can script your presentation with Javascript!<br/>
     You just need to add the <code>script</code> element somewhere in
     the current <code>div</code>
-    <pre><code>
-&lt;script type="text/javascript"&gt;
+    <code>
+<![CDATA[
+ <script type="text/javascript">
     function zoom_title (canvas) {
         var h1 = canvas.find("h1");
         var old_size = h1.css('font-size');
@@ -198,15 +197,15 @@ o.attr("style",a.join(";"));
                .animate({"font-size":old_size }, 300);
     };
     //Call the zoom_title function on the 4th and 7th frame
-    <em>SWS.Presentation.registerCallback("3_6", zoom_title);</em>
-&lt;script&gt;
-</code></pre>
+    ]]><em>SWS.Presentation.registerCallback("3_6", zoom_title);</em><![CDATA[
+</script>]]>
+</code>
     (That's not a bug, you should keep pressing next, see how many
     steps there are on this slide)
   </p>
 
 <script type="text/javascript">
-  SWS.Presentation.registerCallback("4_7", zoom_title);
+  SWS.Presentation.registerCallback("3_6", zoom_title);
 </script>
 
 </div>
@@ -367,6 +366,9 @@ Of course we can animate it with some javascript!
     BTW did you see how I changed the transition effect for the
     previous slide ?
   </p>
+  <script type="text/javascript">
+    SWS.Presentation.registerCallback("1", zoom_title);
+  </script>
 </div>
 
   </body>

diff --git a/simpleWebSlides.js b/simpleWebSlides.js
index d2859f3..d0165f0 100644 (file)
--- a/simpleWebSlides.js
+++ b/simpleWebSlides.js
@@ -186,13 +186,19 @@ SWS.Effects = new function () {
         var t = SWS.Presentation.getSlide(to);
         if (from < to) {
             t.css('left', '100%');
+            t.css('opacity', '1');
             SWS.Templates.slideActivate(t);
-            f.animate({ 'left': '-100%' }, 250, function () { SWS.Templates.slideDeactivate(f); });
-            t.animate({ 'left': '0%' }, 250);
+            f.animate({ 'left': '-100%' }, 250, function () { SWS.Templates.slideDeactivate(f);
+                                                              f.css('opacity', '0');
+                                                              t.animate({ 'left': '0%' }, 250);
+                                                            });
         } else {
             t.css('left', '-100%');
             SWS.Templates.slideActivate(t);
-            f.animate({ 'left': '100%' }, 250, function () { SWS.Templates.slideDeactivate(f); });
+            f.animate({ 'left': '100%' }, 250, function () { SWS.Templates.slideDeactivate(f);
+                                                             f.css('opacity', '0');
+                                                           });
+            t.css('opacity', '1');
             t.animate({ 'left': '0%' }, 250);
         };
     };
@@ -442,7 +448,8 @@ SWS.Presentation = new function () {
 
         case 32: /* space */
         case 39: /* -> */
-
+            if (self.getCurrentSlide() == self.lastSlide()
+                && self.getCurrentFrame() == self.lastFrame()) return;
             self.next();
             break;
         case 34: /* PgDown */
@@ -621,14 +628,6 @@ SWS.Presentation = new function () {
 
             var inner = $('<div class="sws-inner-canvas"/>');
             var content = $('<div class="sws-content"/>');
-            var title = $('<div class="sws-title"/>');
-            var h1 = $(this).children("h1");
-            if (h1) {
-              h1.detach();
-              title.append(h1);
-            }
-            canvas.append(title);
-            canvas.append($("<br/>"));
             $(this).find('script[type="text/javascript"]').remove();
             content.append($(this));
             inner.append(content);

diff --git a/themes/webTwoPointO.css b/themes/webTwoPointO.css
index 4dd0c78..3031736 100644 (file)
--- a/themes/webTwoPointO.css
+++ b/themes/webTwoPointO.css
@@ -13,18 +13,14 @@
 }
 
 /* Title of the slide */
-.sws-title {
-    top: 0vh;
-    height: 10vh;
-}
-.sws-title h1 {
+h1 {
     color: #f14a29;
     font-size: 5vh;
     text-align:center;
 }
 /* The inner canvas and content */
 .sws-inner-canvas {
-    top: 10vh;
+    top: 0vh;
     height: 85vh;
 }
 .sws-content {
@@ -37,7 +33,6 @@
     text-align: right;
 }
 
-
 .sws-slide-num-sep:after {
     content: "/";
 }
@@ -52,6 +47,9 @@ body {
 code, pre, tt {
     font-family: 'Inconsolata', monospace;
 }
+code {
+    white-space: pre;
+}
 
 ul {
     list-style-type: square;