S5 1.1b2

Published 13 years, 1 month ago

Behold: v1.1 beta 2 of S5.  This version has a few of changes, all of which are being floated as trial balloons.  Feedback on them all is appreciated.

  • Change in file structure.  Now the ui/ directory will contain only directories.  Thus, the default theme and scripts live in ui/default/.  The reason for this is so that other themes can be put in the ui/ directory without things getting too confusing.  For example, the current beta version has a v11b2/ directory (the beta’s version of ui/) that contains default/ and i18n/.  Switching between them does require manual editing of the XHTML file, as I decided to punt on dynamic theme switching for now.  This does, however, let an author carry around a single ui/ directory with a number of themes contained inside.  That way, he might have four presentations to give, each one with a different theme, but all of them sharing the same ui/ directory.

    Another advantage to changing the directory structure is that v1.0 presentations won’t be compatible with v1.1 themes.  That’s actually a good thing, since the XHTML structure changed in small but significant ways in v1.1b1.

    I thought about further splitting the default directory into “script” and “style” subdirectories, but this seemed like a bit of overkill.  However, I’m starting to wonder how to handle things like IE/Win behaviors, which I suspect will be needed before too much longer.  Why?  Look at the images in the v1.1b2 testbed: they all have flat white backgrounds.  I’d like to turn them all into PNGs with alpha channels, and I’d like to have those work as intended in IE/Win.  The only way to make that work right now is via behaviors like this one.  I’ll want to drop those behaviors into the default/ directory—my leading candidate would actually be IE7, once it gets close to being stable, mostly because it would add quite a lot to theme authors’ CSS toolkits.  But all those behavior files could clutter up the directory, for which the easiest fix is to drop them all in a subdirectory… you probably see where I’m going with this.

    That’s all for another version, though; v1.1 won’t have any behaviors packaged by default.  It’s just on my radar, and I thought I’d toss it out to see if anyone has bright ideas.

  • A “header” file for themes.  You can see an example at v11b2/i18n/00_head.txt.  Briefly, this file contains material destined for the head element of any presentation that’s going to use this theme.  In the case of i18n, the only thing that changes is the link element pointing to slides.css.  Nevertheless, the header file provides all of the link and script elements that should appear in the presentation file.  This should make it easier for an editor program to just grab each block and paste them over the existing block in the presentation file.  It will also reduce ambiguity for anyone doing a manual edit to change themes.  (Open header file, drag-select, copy; open presentation file, drag-select, paste, save, done.)

  • Changes to incremental class names.  In earlier versions, incremental-display objects were marked with a class of inc, and any list that should start out already showing the first list item got a class of psf.  I’ve changed those to incremental and show-first.  The new names require a little more typing, but they’re much less ambiguous and therefore much more author-friendly.  I’m interested to see if anyone has ideas for better names, especially for show-first.

As for the issue of licensing, I guess I’m little further along, but not all they way yet.  The discussion did help me focus on what I want.

  • Presentation content should be under whatever license/terms the author desires.  I do not want to force all S5 presentation content to be public domain, or GPL’ed, or whatever.  If someone wants to give a highly confidential talk using S5, they should be able to put the most restrcitive license in the Universe on the content… but only on the content.

  • Themes should similarly have their licenses, or lack thereof, determined by each one’s author.  If Joe Consultant wants to create a MyCoolCo theme and release it under copyright so that anyone can use the theme for their own presentations but nobody is allowed to re-use his images/look-and-feel/whatever outside the S5 theme, there should be nothing that stops him from doing so.

  • The S5 system (JS, core CSS, and the way they’re put together) should be forever free to use by anyone who wants to do so.  It should be open for future development, in the event that I stop developing it and someone wants to keep going.  This would also allow anyone to fork off their own variant on S5 at any time, but that’s okay too.

    Here’s where it gets a little tricky: S5 should be able to be incorporated into any other project, commercial or not, without restriction.  Attribution to the original source is to be strongly encouraged, but not an absolute requirement.  But at no time, and in no way, should use of S5 in a closed environment ever cause a back-flow of restrictions to the original project.

In other words, anyone should be able to use S5 or a derivative work in their for-profit, wholly proprietary, patented software (or in any other circumstance).  They can even make modifications, if they like.  However, there should be no way for their use of it in a closed system to infect the original S5 source, and if their modifications make it into a future version of S5, the same should hold true.  I don’t even know if that’s possible, but it’s in the spirit of the Share Alike terms in the Creative Commons licenses.  You want to build S5 support into your $49.95 fully copyrighted and licensed editor?  Fine, no problem.  You want to extend S5 to do more cool stuff?  Also fine, but freely contribute the changes back to the place you got the code in the first place.  Don’t try to claim the original project has no right to the additions you made to it, or that the addition of those changes to the original project makes the whole thing yours.

(Not that I think any of you would do such a thing, but I have to think ahead to when S5 catches the interest of someone… well, let’s say less scrupulous.)

In a sense, I want to prevent major infection of licensing terms in both directions.  I’m not entirely sure where that leaves me, but I’d like to work it out before 1.1 goes final.

  1. […] entations to your printer. For more information on S5 and the latest 1.1b2 build, head to Eric’s website. Comments » The U […]

  2. I just took my first look at S5 via the demo – very cool. Thanks for creating this and making it available. Can’t wait to try it out.

  3. One thing that I didn’t get is the folliwing: where do we download s5? I can download the s5intro.zip file, but that isn’t the latest one, isn’t it?
    Then I can use the one in testbed, for example doing a wget on http://www.meyerweb.com/eric/tools/s5/testbed/. Is that the official way of getting the latest?


  4. I know S5 was originally designed to be compatible with Opera’s built in slide show format. However, the latest enchancements in 1.1 like incremental display and font resizing don’t work in Opera.

    Is there any way to prevent Opera’s built in code from kicking in, so that S5’s javascript can work normally?

    I’m a Firefox user myself, but it seems a shame to have Opera lagging behind when we support all the other major browsers.

  5. Eric, for the licensing policy you’ve described above, I would recommend putting the whole project under the Expat license (or the 3-clause BSD license, which is mostly equivalent).

    Presentation content should be under whatever license/terms the author desires. I do not want to force all S5 presentation content to be public domain, or GPL’ed, or whatever. If someone wants to give a highly confidential talk using S5, they should be able to put the most restrcitive license in the Universe on the content— but only on the content.

    Free software licenses never force someone to distribute work if they don’t want to (if a license does force that, it’s not free). The only time a free software license puts terms on anything is when you choose to distribute a derivative work.

    If someone takes the S5 examples, makes a highly-confidential presentation (or any other work) and uses it, a free software license will have nothing to say about what they must do with it. They can keep it secret as long as they like. Once they distribute the work, though, they’ll need to satisfy your license terms.

    Themes should similarly have their licenses, or lack thereof, determined by each one’s author.

    This means you don’t want a copyleft license for themes. The Expat license will be fine here; you remain the copyright holder on your own work, but it allows someone to create their own dervative work and release it under their own license, so long as your license terms are met.

    In other words, anyone should be able to use S5 or a derivative work in their for-profit, wholly proprietary, patented software (or in any other circumstance). They can even make modifications, if they like. However, there should be no way for their use of it in a closed system to infect the original S5 source, and if their modifications make it into a future version of S5, the same should hold true.

    The Expat license will allow anyone to release derivatives of S5 and license them to whomever and under whatever terms they want. You will remain the copyright holder for the S5 software you release, and nobody can change that. As long as the original is available under your license, it remains as free as you like.

    Again, given your description, the good choices pretty much boiled down to “GPL, if you want to prevent non-free software derivatives” or “Expat license, if you want to allow restrictively-licensed derivatives”. You’ve chosen the latter, so far as I can see.

    Thanks for considering the options and involving your users in the issue.

  6. IE7 is no longer implemented using DHTML behaviors. It is now a JavaScript inclusion. People have found this easier to install and configure. I’m preparing a new release of IE7 which will take it toward a beta version. So if you have any feature requests make them quick (and not too complex). Got to say I’m a fan of this little project of yours!

  7. The only time a free software license puts terms on anything is when you choose to distribute a derivative work.

    That could be clearer: I mean that a free software license only puts terms on distribution of copies, modified or otherwise.

    Whether you choose a copyleft (share-alike) license or some other free software license, the license terms only affect your distribution of the work. It’s a grant of license — it only tells you what you’re allowed to do *in addition* to things you’re already allowed to do.

    Private modification of the software — even if you then show the *output* of the software to other people — isn’t covered by a free software license, since that act isn’t reserved to the copyright holder in any case (despite what some software corporations would like us to believe).

  8. I am proudly using S5 (with acknowledgements of course) in academia. Before I found out about S5 I used my own CSS presentation template which you might want to have a glance at: http://www.schestowitz.com/Projects/HTP

  9. How about “initial” instead of “show-first”?

  10. Is there a way to make a scrollbar appear if the content overflows
    the height of the browser window?

    It seems like the mechanism for selectively showing only one part
    of a file at a time could be useful for any document with parts of
    any arbitrary length, not necessarily just for a slide presentation.

    The only thing that prevents the current implementation from being
    usable for that is the lack of a scrollbar.

  11. S5 is an amazing slide show system! I was working on a much less flexible one when you announced S5. Yesterday I used S5 (v1.0) to give a presentation on CSS, web standards and related topics and it performed smoothly. Switching my content to S5 was as simple as cut and paste. No fuss, no muss! My audience was impressed that such a system was created using web standards and CSS. It’s not often that the presentation system itself contributes to the content of the presentation, but that was true in this case.

    Thanks again, Eric, and to everyone who has contributed to S5!

  12. I have the same request regarding the scrollbar. On the demo at http://www.meyerweb.com/eric/tools/s5/s5-intro.html , sometimes the bottom part is cutoff and I can’t see the entire slide (res: 1024×768).

  13. About licensing the core: you’re somewhat contradicting yourself. It’s either GPL, where they absolutely cannot lock up their modifications, or it’s BSD/Expat-like, where they can.

    If they have incorporated it into a text editor, then they have extended it.

    There’s really no danger of “back-flow of restrictions”. You don’t need to accept any changes that are not licensed under the terms of your own release, and the part of the code that you released will always be free.

  14. It’s possible to get png transparency in IE using a css-only solution.

    I haven’t looked closely at S5, so I don’t know how applicable the technique is.

  15. Where can I download a copy of the latest test bed version of S5 and its themes? I have a presentation coming up that I would like to try and use it for.

  16. Lloyd: Interesting, but that’s not CSS-only. It’s a blend of CSS and behaviors, or at least filters. It’s bascially what the various behavior hacks do, except in your case you’ve embedded the proprietary stuff into the style sheet instead of splitting it off to another file.

    Jeff: here’s a direct link to a 247KB ZIP file, most of which is occupied by images that are included for testing purposes, but the rest of which is the UI directory and the testbed presentation file. A presentation without images would be more like a 15KB Zip file, if that.

  17. You want to build S5 support into your $49.95 fully copyrighted and licensed editor? Fine, no problem. You want to extend S5 to do more cool stuff? Also fine, but freely contribute the changes back to the place you got the code in the first place.

    These two are contradictory. The scenarios are both a case of extending S5 (in the first case, extending it with editor functionality; in the second case, with “more cool stuff”). What is your policy: copyleft (share-alike, GPL) or non-copyleft (Expat license)?

    Note that none of the existing free software licenses require someone to “contribute the changes back to the place you got the code”, because that’s an unreasonable requirement. It sets up “the place you got the code” as a central gatekeeper. It’s quite plausible that the “place you got the code” is not available at the time you want to distribute your changes to a third party — it may be years later, or you may be in an Internet-poor area, or any of a number of other circumstances.

    More reasonable (and this is all that a copyleft actually requires) is to require that modifications to the original code should be available *to the recipient* when you give them the modified code, under the same license terms as the original. This way, you ensure that changes add to the common pool of S5 “cool stuff”, but there’s no particular gatekeeper to whom the changes must be submitted.

  18. I am pretty sure that all IE-PNG compatibility issues can be resolved be reducing the pallete from full RGB to indexed of maximum 255 colours. That’s what I always do. I can’t begin to describe how much I hate to reduce quality, just because of bloody Internet Explorer.

  19. Regarding IE/Win-PNG compatibility issue, you may also use JScript conditional compilation. Here’s a script — that do not trigger errors in IE5/Mac — I have submitted to Bob Osola [1], which should enlighten you:

    @if (@_win16 != @_win16)
    @set @_win16 = false
    @if (@_win32 != @_win32)
    @set @_win32 = false
    @if (@_jscript_version >= 5.5 && (@_win32 || @_win16))
    , function() {
    for (var i = 0; i< \/span>';
    if ('left' == img.align)
    span.style += 'float:left;';
    if ('right' == img.align)
    span.style += 'float:right;';
    if (img.parentElement.href)
    span.style += 'cursor:hand;';
    if (0 != img.style.cssText.length)
    span.style = img.style.cssText.toLowerCase() + ';' + span.style;
    img.outerHTML = span + '';
    @end @*/

    to drop by PNG in Internet Explorer for further details.

  20. Oops, something went wrong in my previous post. Obviously you cannot use fragment identifiers in comments (!). You should read:

    [1] You may want to drop by PNG in Internet Explorer for further details.

  21. Using v. 1.0 I get 404s each time a slideshow is loaded, when using Mozilla or Firefox, for ./null (i.e. a file called null in the same directory. Will this be fixed in 1.1 final?

  22. A coworker and I looked at S5 as a replacement for PowerPoint at work – we liked the idea but had never gotten around to actually trying it.

    Yesterday I created my first S5 presentation for career day at my wife’s school. Wow! I am blown away by how damn easy it is to use and how cool the presentation is.

    And, since it uses standards, I could easily demonstrate seperating content from style. In the middle of my presentation I opened up NotePad, changed the css link to a new path, reloaded and presto! the same presentation with a new look!

    You keep making me look good, thanks Eric. (If I was thinking I should have labeled my presentation “Working Man” in your honor. Doh!)

  23. I know it would probably break the presentation for MSIE… but using XHTML 1.1 you cold mix SVG content and maybe some other cool stuff ^_^

    Maybe I’ll (or someone else) work on some extended (though less compatibile) derivate in the future (hmm… maybe some XBL bindings come to my mind ^_~)

    Oh, and just a moment ago, I thought about styling OpenOffice.org presentations, since they are actually compressed XML (at least in the development versin; European Union wants to accept it as an official format for data exchange). I haven’t seen the structure yet, but maybe using XSLT one could transform it to some usable document.

  24. Hi,

    Had two suggestions:

    1) While the idea of using different <div class=”slide”> is quite nice, I wonder if you could support the <link> element a bit more?

    E.g. <link rel=”prev” href=”” /> and rel=”next” etc. There are quite a lot of inbuilt navigation features in the link element that would be quite useful.

    Right now, the way I am thinking of using this is in such a way that a course I create will have 10 or so large chapters, each one with tons of slides in it. Those 10 chapters will be different HTML pages, while all the slides will of course be different divs. Each chapter will make use of appropriate link tags to link to the next, previous, and main ones for example.

    One potential draw back to making each page into its own page and linking them via the link tags could be printability. One would have to go to each page and print it out, which would be combersome, if each page is a slide (or smaller subset of slides).

    But, perhaps linking chapters could be useful? For now, I simply create a final slide in each chapter that links to the next chapter. In addition, I use a Firefox extension called Link Toolbar that will create the previous and next links etc. There is something like this for IE as well, but I forget what it is called. I find this quite useful for navigating between chapters in a presentation.

    2) For the author type information that you present in the first slide in your examples, would meta tags be more useful?

    In both these cases, the (X)HTML standards provide these features I and I think you would be able to access them at least using document.getElementByTagName(), I believe.

    This could possibly help encourage people to think a bit more about the tags that are already there which may be useful and relevant. I think there may also be some reasonable drawbacks to relying on this only however.

    Just some thoughts.

    Oh yeah, this is very cool though, nonetheless ;)

  25. Thanks Eric for the new version. I’ve used your slideshow on two interviews with the University of Portland and University of Oregon. I have a write up here: http://www.parrfolio.com/development/

    I wished I was using your current version!! Thanks again!


    P.S. UP was very impressed with my slideshow presentation being projected on a large screen. Only problem I see with the slide show is the limitation on resolution. They had low (1024×768 or lower) resolution and the bottom of my slide show was cut off. I wish it could resize properly. Plus, IE has a problem of carring up when scrolling. All in all it turned out very impressive.

  26. Saw a comment a while ago about being able to enter numbers, then hit Enter to jump to that slide. That happened to be an itch I shared, so here’s code to scratch it. This code does the following things:

    1. Lets the user type a number (multi-digit is allowed), and stores the number typed. Typing any non-number key clears the entered number.
    2. If the user hits Enter/Return while there is a number stored, they jump to that slide. Jumping clips at the end of the slideshow.
    3. If the user hits any of the “Next” or “Previous” keys while there is a number entered, they skip the number entered (e.g. typing “5”, then hitting the spacebar would skip 5 slides forward)

    All changes were made to the version of slides.js included in the v11b2.zip file. The modified slides.js file is located at http://www.liggitt.net/s5/v11b2/default/slides.js, and all changed lines are flagged with

    // Numeric support change

    To try it out, see these files:
    http://www.liggitt.net/s5/index.html (original example slideshow)
    http://www.liggitt.net/s5/index2.html (slideshow with 130 pages)

  27. Don’t know if I am the only person having this problem, but with the beta, Firefox 1.0’s browser back button doesn’t work. In fact, if I try to reload, enter a different URL in the address bar, click go, anything, nothing happens. I have to close this tab or open a new one depending on what else I want to do.

    It would be nice to resolve this, if this is indeed an issue.

    It is ok with IE 6 (XP SP2)

  28. the firefox issue is probably caused by an extension. Do you run Adblock?
    To test this, disable all your extensions and try the beta site again.

  29. One more note… someone noticed that “Find As You Type” (the auto-find that occurs when you start typing in Firefox/Mozilla) was messing stuff up when you would type numbers, so I added a global keypress handler to trap keyevents from reaching the FAYT code.

  30. Hi,

    Regarding the conversion from OpenOffice sxi files (and PPT via Open Office), I’ve already started work on some XSLT which does a basic job of this.

    Any improvements and suggestions are welcome (you can add them to the wiki page).



  31. […] entations to your printer. For more information on S5 and the latest 1.1b2 build, head to Eric’s website. This entry was posted on […]

Leave a Comment

Management reserves the right to edit or remove any comment, especially when abusive or irrelevant to the topic at hand. HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <em> <i> <q cite=""> <s> <strong> <pre class=""> <kbd>

Comment Preview

If you're satisfied with what you've written, then go ahead...