meyerweb.com

Skip to: site navigation/presentation
Skip to: Thoughts From Eric

S5 1.1b2

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.

31 Responses»

    • #1
    • Pingback
    • Sat 18 Dec 2004
    • 2125
    Received from DIGIDAL » S5

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

    • #2
    • Comment
    • Thu 9 Dec 2004
    • 1314
    Dean wrote in to say...

    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
    • Comment
    • Thu 9 Dec 2004
    • 1747
    jerome wrote in to say...

    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?

    J

    • #4
    • Comment
    • Thu 9 Dec 2004
    • 1808
    stonedyak wrote in to say...

    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
    • Comment
    • Thu 9 Dec 2004
    • 2040
    Ben Finney wrote in to say...

    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
    • Comment
    • Thu 9 Dec 2004
    • 2056
    Dean Edwards wrote in to say...

    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
    • Comment
    • Thu 9 Dec 2004
    • 2058
    Ben Finney wrote in to say...

    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
    • Comment
    • Fri 10 Dec 2004
    • 0000
    Roy wrote in to say...

    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
    • Comment
    • Fri 10 Dec 2004
    • 0327
    joshua wrote in to say...

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

    • #10
    • Comment
    • Fri 10 Dec 2004
    • 0607
    Michael Smith wrote in to say...

    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
    • Comment
    • Fri 10 Dec 2004
    • 1155
    Ed wrote in to say...

    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
    • Comment
    • Fri 10 Dec 2004
    • 1158
    Dean wrote in to say...

    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
    • Comment
    • Fri 10 Dec 2004
    • 1547
    Firas wrote in to say...

    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
    • Comment
    • Sat 11 Dec 2004
    • 2333
    Lloyd Dalton wrote in to say...

    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
    • Comment
    • Sun 12 Dec 2004
    • 0639
    Jeff wrote in to say...

    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
    • Comment
    • Sun 12 Dec 2004
    • 1824
    Eric wrote in to say...

    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
    • Comment
    • Sun 12 Dec 2004
    • 2202
    Ben Finney wrote in to say...

    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
    • Comment
    • Sun 12 Dec 2004
    • 2257
    Roy Schestowitz wrote in to say...

    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
    • Comment
    • Mon 13 Dec 2004
    • 1315
    Micha wrote in to say...

    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:


    /*@cc_on
    @if (@_win16 != @_win16)
    @set @_win16 = false
    @end
    @if (@_win32 != @_win32)
    @set @_win32 = false
    @end
    @if (@_jscript_version >= 5.5 && (@_win32 || @_win16))
    window.attachEvent(
    'onload'
    , function() {
    for (var i = 0; i var img = document.images[i];
    var len = img.src.length;
    if ('.PNG' == img.src.substring(len - 4, len).toUpperCase()) {
    var span = {
    id: img.id
    ,className: img.className
    ,title: (img.title) ? img.title : img.alt
    ,style: 'display:inline-block;width:'
    + img.width + 'px;height:' + img.height + 'px;'
    + 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=''
    + img.src + '',sizingMethod='scale');'
    ,toString: function() {
    return ' + ((this.id) ? 'id="' + this.id + '" ' : '')
    + ((this.className) ? 'class="' + this.className + '" ' : '')
    + 'title="' + this.title + '" '
    + 'style="' + this.style + '">< \/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 + '';
    i--;
    }
    }
    }
    );
    @end @*/

    to drop by PNG in Internet Explorer for further details.

    • #20
    • Comment
    • Mon 13 Dec 2004
    • 1319
    Micha wrote in to say...

    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
    • Comment
    • Tue 14 Dec 2004
    • 1147
    Martin Lucas-Smith wrote in to say...

    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
    • Comment
    • Tue 14 Dec 2004
    • 1445
    Tim wrote in to say...

    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
    • Comment
    • Thu 16 Dec 2004
    • 1139
    Spike411 wrote in to say...

    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
    • Comment
    • Fri 17 Dec 2004
    • 0536
    Anup wrote in to say...

    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
    • Comment
    • Sat 18 Dec 2004
    • 0052
    Ryan wrote in to say...

    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!

    -Ryan

    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
    • Comment
    • Mon 20 Dec 2004
    • 0303
    Jordan Liggitt wrote in to say...

    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
    • Comment
    • Thu 23 Dec 2004
    • 0928
    Anup wrote in to say...

    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
    • Comment
    • Tue 28 Dec 2004
    • 1423
    lou wrote in to say...

    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
    • Comment
    • Wed 29 Dec 2004
    • 0234
    Jordan Liggitt wrote in to say...

    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
    • Comment
    • Thu 13 Jan 2005
    • 0936
    Luke Taylor wrote in to say...

    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).

    cheers,

    Luke.

    • #31
    • Pingback
    • Mon 5 Sep 2005
    • 1637
    Received from Dalibor Dvorski » Blog Archive » S5

    […] 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

Line and paragraph breaks automatic, e-mail address required but never displayed, HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>



Remember to encode character entities if you're posting markup examples! Management reserves the right to edit or remove any comment—especially those that are abusive, irrelevant to the topic at hand, or made by anonymous posters—although honestly, most edits are a matter of fixing mangled markup. Thus the note about encoding your entities. If you're satisfied with what you've written, then go ahead...


December 2004
SMTWTFS
November January
 1234
567891011
12131415161718
19202122232425
262728293031  

Sidestep

Feeds

Extras