+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- <title>SimpleWebSlides</title>
-
- <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
- <meta name="copyright"
- content="Copyright © 2013 Kim Nguyễn" />
-
- <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"
- media="all" />
- <!-- allows to switch themes in firefox -->
-
- <link rel="stylesheet" title="Default" href="../themes/default.css"
- type="text/css" />
- <link rel="alternate stylesheet" title="Web 2.0"
- href="../themes/webTwoPointO.css"
- type="text/css" />
-
- <script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
- <script src="../simpleWebSlides.js" type="text/javascript" ></script>
- </head>
- <body>
-
- <div class="slide cover nofooter">
- <div class="centerbox">
- <h1>SimpleWebSlides</h1>
- <h1>An <em>HTML</em><img style="height:28pt"
- src="http://www.w3.org/html/logo/downloads/HTML5_Badge.svg" alt="5"/>
- Presentation framework</h1>
- <a href="mailto:kim@nguyen.vg">kim@nguyen.vg</a>
- </div>
- </div>
-
-
- <h1>Introduction</h1>
-
- <div class="slide">
- <h1>What is it?</h1>
- <em>SimpleWebSlides</em> is an HTML5 framework that allows
- you to build presentation:<br class="pause" />
- <ul>
- <li>Write your slides in HTML5!</li>
- <li>Script your slides with Javascript!</li>
- <li>Theme your slides with CSS!</li>
- </ul>
- </div>
-
- <div class="slide">
- <h1>Modalités de Contrôle des Connaissances (MCC)</h1>
- <ul>
- <li><em>Première session (100%)</em>
- <ul>
- <li>Un partiel (25%)</li>
- <li>Une ou deux interro. de TD/TP (25%)</li>
- <li>Un examen (50%)</li>
- </ul>
- </li>
- <li><em>Deuxième session (100%)</em></li>
- <li><em>Rappel</em>
- <blockquote><p>
- La défaillance fait obstacle au calcul de la moyenne
- et implique l'ajournement.<br/>
- La présence de l'étudiant étant obligatoire en TP […], plus
- d'une absence injustiée dans un enseignement peut entraîner
- la défaillance de l'étudiant dans l'enseignement concerné
- </p>
- </blockquote>
- </li>
- </ul>
- </div>
-
-
- <div class="slide">
- <h1>Organisation</h1>
- <ul>
- <li>10 semaines de cours
- <ul>
- <li>17/9, 24/9, 1/10, _, 15/10, 22/10</li>
- <li>Partiel la semaine du 29/10</li>
- <li>5/11, 12/11, 19/11, 26/11, 3/12</li>
- </ul>
- </li>
- <li>Cours tous les lundi (~ 1h)</li>
- <li>TD tous les mardis</li>
- <li>TPs les mercredi/jeudi</li>
- </ul>
- </div>
- <div class="slide">
- <div class="toc"/>
- </div>
-
-
- </body>
-</html>
</head>
<body>
- <div class="slide cover nofooter">
+ <div class="sws-slide sws-cover sws-option-nofooter">
<div class="centerbox">
<h1>SimpleWebSlides</h1>
<h1>An <em>HTML</em><img style="height:28pt"
<h1>Introduction</h1>
- <div class="slide" >
+ <div class="sws-slide" >
<h1>What is it?</h1>
<em>SimpleWebSlides</em> is an HTML5 framework that allows
you to build presentation slides:
<ul>
- <li class="pause" >Write your slides in HTML5!</li>
- <li class="pause" >Theme your slides with <em>CSS</em>!</li>
- <li class="pause" >Script your slides with Javascript!</li>
+ <li class="sws-pause" >Write your slides in HTML5!</li>
+ <li class="sws-pause" >Theme your slides with <em>CSS</em>!</li>
+ <li class="sws-pause" >Script your slides with Javascript!</li>
<script type="text/javascript">
SimpleWebSlides.registerCustom(3, function (canvas) {
- console.log("calling callback");
var h1 = canvas.find("h1");
- console.log(h1);
var old_color = h1.css('color');
var old_size = h1.css('font-size');
h1.animate({"font-size":"100pt" }, 500);
- h1.animate({"font-size":old_size }, 500);
+ h1.animate({"font-size":old_size }, 500);
});
</script>
</ul>
</div>
- <div class="slide">
-
- </div>
-
</body>
</html>
var SimpleWebSlides = new function () {
+
var _self = this;
var _total_slides;
var _defered_custom = new Array();
var _initialized = false;
+ var _animations_running = false;
function push_following(t, i, v) {
if ((typeof t[i]) == 'undefined') {
var cur_frame = 0;
canvas.find("*").each(function(i) {
- if ($(this).hasClass("pause")) cur_frame++;
+ if ($(this).hasClass("sws-pause")) cur_frame++;
push_following(frames, cur_frame, $(this));
});
- canvas.data("frames", { frames: frames,
- current: 0,
- custom: new Array() });
+ canvas.data("sws-frames", { frames: frames,
+ current: 0,
+ custom: new Array() });
};
//on partial doms
var scripts = document.getElementsByTagName("script");
var current = scripts[scripts.length-1];
- console.log(current);
- var slide = $(current).parents(".slide");
+
+ var slide = $(current).parents(".sws-slide");
if (slide.length == 0) {
console.log("no parent ?");
return;
};
_self.firstSlide = function () { return 0; };
_self.lastSlide = function () { return _self.getNumSlides() - 1; };
+
_self.refresh = function () {
+
var cur = _self.getCurrentSlide();
- $(".canvas").each (function (i) {
+ $(".sws-canvas").each (function (i) {
if (i == cur){
- $(this).removeClass("other_slides").addClass("current_slide");
- var info = $(this).data("frames");
+ $(this).removeClass("sws-inactive-slide").addClass("sws-active-slide");
+ var info = $(this).data("sws-frames");
var frames = info.frames;
var upto = info.current;
var custom = info.custom;
for(var j = 0; j < Math.max(frames.length, custom.length); j++) {
for (var k = 0; k < frames[j].length; k++) {
- if (j < upto || frames[j][k].hasClass("footer")){
-
- frames[j][k].removeClass("inactive_frame").addClass("active_frame");
-
- } else if (j == upto) {
-
- frames[j][k].removeClass("inactive_frame").addClass("current_frame");
+ if (j <= upto || frames[j][k].hasClass("sws-footer")){
+ frames[j][k]
+ .removeClass("sws-inactive-frame")
+ .addClass("sws-active-frame");
} else {
- frames[j][k].removeClass("active_frame").removeClass("current_frame").addClass("inactive_frame");
+ frames[j][k]
+ .removeClass("sws-active-frame")
+ .addClass("sws-inactive-frame");
};
};
var callbacks;
};
};
- } else if ($(this).hasClass("current_slide")) {
- $(this).removeClass("current_slide").addClass("other_slides");
+ _animation_running = true;
+ $(this).find("*").promise().done(function() {
+ _animation_running = false;
+ });
+ } else if ($(this).hasClass("sws-active-slide")) {
+ $(this).removeClass("sws-active-slide").addClass("sws-inactive-slide");
};
- });
+
+ });
};
_self.nextSlide = function () {
_self.getFrameInfo = function () {
var i = _self.getCurrentSlide();
- var canvas = $($(".canvas")[i]);
- var infos = canvas.data("frames");
+ var canvas = $($(".sws-canvas")[i]);
+ var infos = canvas.data("sws-frames");
return infos;
};
_self.getCurrentFrame = function () { return _self.getFrameInfo().current; };
_self.keyboardHandler = function (event) {
-
+ if (_animation_running) return;
switch (event.which) {
case 36:/* Home */
_self.firstSlide();
};
var _init = function () {
- _total_slides = $(".slide").length;
+ _total_slides = $(".sws-slide").length;
$(document).keydown(_self.keyboardHandler);
$(document).mousedown(_self.keyboardHandler);
var cur = _self.getCurrentSlide();
- $(".slide").each (function (i) {
- var elem = '<div class="footer"><span class="current_slide_num">' + (i+1);
- elem += '</span><span class="slide_num_sep"/><span class="total_slide_num">';
+ $(".sws-slide").each (function (i) {
+ var elem = '<div class="sws-footer"><span class="sws-current-slide-num">' + (i+1);
+ elem += '</span><span class="sws-slide-num-sep"/><span class="sws-total-slide-num">';
elem += _self.getNumSlides() + '</span></div>';
- if (!($(this).hasClass("nofooter"))) {
+ if (!($(this).hasClass("sws-option-nofooter"))) {
$(this).append($(elem));
};
var par = $(this).parent();
$(this).remove();
- var canvas = $('<div class="canvas"/>');
+ var canvas = $('<div class="sws-canvas"/>');
canvas.append($(this));
par.append(canvas);
if (i == cur) {
- canvas.addClass("current_slide").removeClass("other_slides");
+ canvas
+ .addClass("sws-active-slide")
+ .removeClass("sws-inacitve-slide");
} else {
- canvas.addClass("other_slides").removeClass("current_slide");
+ canvas
+ .addClass("sws-inactive-slide")
+ .removeClass("sws-active-slide");
};
init_canvas(canvas);
for (var i = 0; i < _defered_custom.length; i++){
var custom = _defered_custom[i];
- var canvas = $(custom.src).parents(".canvas");
+ var canvas = $(custom.src).parents(".sws-canvas");
if (canvas.length == 0) continue;
canvas = $(canvas[0]);
- var info = canvas.data("frames");
+ var info = canvas.data("sws-frames");
push(info.custom, custom.frame, custom.fn);
};
projects / hacks / simpleWebSlides.git / commitdiff