Prev: Applet UpCall from JS Event - Which Thread?
Next: Request.QueryString
From: David Mark on 17 Mar 2010 08:26
Initial examples page has just been completed. Isn't even linked to the
site yet. There is a link to a new primer _from_ this page if you look
closely (something I get the feeling most visitors do not do).

http://www.cinsoft.net/mylib-examples.html

It's been available to readers of my forum for a couple of days, but I
think I am about ready to connect it up to the main site at this point.
As you might imagine, I'm quite pleased with it. :) I'll be expanding
it to demonstrate slide shows, setting HTML and query-based effects
shortly (among other things).

Would be interested in feedback. Specifically, from Stockton or
otherwise mathematically-inclined readers who can tell me which
implementations (IE vs. the others) are lying about their matrix
representations. When I first started on the new Transform add-on, I
tore my hair out for hours because one of the camps is making up
stories. They both claim to use (a, b, c, d) notation in their styles,
but in fact, one camp is actually using (a, c, b, d). The My Library
interface is currently siding with the quasi-standard camp and making
the necessary adjustment in the IE fork (which may be backwards). I
don't care to investigate as the only ones who would complain would be
mathematicians, but I thought it was interesting enough of a
contradiction to note.

I plan to expand on the code generator. I think that aspect has the
makings of a killer app. I don't imagine I'll be hearing any more
excuses about a lack of examples when my examples can virtually write
your app for you (more on that later).
From: Thomas Allen on 17 Mar 2010 12:56
On Mar 17, 8:26 am, David Mark <dmark.cins...(a)gmail.com> wrote:
> I plan to expand on the code generator.

Are the generation forms intentionally disabled? It seems that the
only form on that page that functions is the one with the alert
button, so I can only comment on that.

Where is the API.alert function documented? I did not see it on
http://www.cinsoft.net/mylib-doc.asp?view=object

I'd suggest changing some of the alert defaults:

1. Display no window title unless one is provided (I assume one can be
provided)
2. Include only the close control in the title bar unless others are
specified.
3. Default to 'OK' for the close button text in the window itself.

Thomas
From: David Mark on 17 Mar 2010 14:01
Thomas Allen wrote:
> On Mar 17, 8:26 am, David Mark <dmark.cins...(a)gmail.com> wrote:
>> I plan to expand on the code generator.
>
> Are the generation forms intentionally disabled?

Yes, if your browser does not support the features in question, the
controls are left disabled. In the case of most of the initial
examples, CSS3 transforms are involved, so you need to be using IE5.5+,
Opera 10.5+, Safari 4, Chrome 3+ or FF3.5+.

> It seems that the
> only form on that page that functions is the one with the alert
> button, so I can only comment on that.

Fair enough!

>
> Where is the API.alert function documented? I did not see it on
> http://www.cinsoft.net/mylib-doc.asp?view=object

You are looking at it. :) I will be fleshing it out with some more
examples that will generate the code for you to use different effects,
do confirms, prompts, etc. Also, the alert is pretty ancient and never
intended for anything more than a demonstration (was written with the
test page in mind at the very start of the project) Also it is to be
displaced (at least as a first choice for an alert replacement) soon as
I have a new (and better thought out) widget that does
alert/confirm/prompt/indicator/wizard/property sheet stacks with
curtains and real modality (real meaning the curtain is just for show,
not the real barrier). Examples for the Modals add-on will be up in the
next few days. That one should put to rest any thoughts people have
about building on top of a rickety Dojo or jQuery because of "pretty
widgets". Mine may not have the prettiest graphics (supply your own of
course), but they will have the prettiest functionality. It will be
interesting to see if people can understand the difference. If not, I
know where to get pretty graphics too. ;)

>
> I'd suggest changing some of the alert defaults:
>
> 1. Display no window title unless one is provided (I assume one can be
> provided)

I think that's how the new one works. Don't remember as the "new" one
is actually a year and half old (I wrote it for a project pitch and
never used it).

> 2. Include only the close control in the title bar unless others are
> specified.

Yes, their presence is determined by the included modules (e.g. if Size
is not there, no max/min, resize handles, etc.) ISTM you can simply
style those buttons into oblivion (e.g. display:none), but don't quote
me on that. I know that sounds silly, but the alert is really just a
silly one-off example. I mean, who needs an alert with minize/maximize
buttons? I think I had it in my head to expand it into a dialog, but
then I wrote the new one, so the original will stay exactly as it is
until it is superseded by the Modals add-on. I will keep the original
around as an example and for the test page as it is good for what it was
designed to do there (demonstrate progressive enhancement and the
relative capabilities of partial builds).

> 3. Default to 'OK' for the close button text in the window itself.

I suppose that's a matter of taste. It can do OK/Cancel, Yes/No, etc.
and you can optionally add a help button, but I don't recall if I have
an option to change the text of the single button. I'll look into that
as I do need to post more examples for that one. My main focus for the
initial Examples page was the transform stuff. I added the alert and
scrolling anchors (which don't need an action to see--they are enabled
on load on that page) as afterthoughts.

If you look at the whole, a pattern should emerge as to how virtually
everything in My Library can be animated with a common interface (e.g.
you should see how to make the alert spin and fade rather than slide and
fade). I do need to explain the required feature testing a bit though.
For instance:-

var myEffects = [], myAlertOptions;

// Lots of browsers lack the features for this one

if (API.effects.spin) {
myEffects.push(API.effects.spin);
}

// Ancient browsers lack the features for this one

if (API.effects.fade) {
myEffects.push(API.effects.fade);
}

// If found at least one usable effect

if (myEffects.length) {
myAlertOptions = {
effects: myEffects,
duration: 1000
};
}

API.alert('This is a test', myAlertOptions);


Damn. I tried that and it turned out so well, I went ahead and did
something similar on the Examples page:-

// Set up alert examples

var setupAlertExample = function(id, msg, effects) {
el = getEBI(id);
if (el) {
el.disabled = false;
attachListener(el, 'click', function() {
API.alert(msg, {
effects:effects,
duration:500,
ease:API.ease.sigmoid4
});
});
}
};

if (attachListener && getEBI && API.alert) {
if (API.effects.fade && API.effects.slide) {
setupAlertExample('testalert', 'This is a test!',
[API.effects.slide, API.effects.fade]);
}

if (API.effects.fade && API.effects.spin) {
setupAlertExample('testalert2', 'This is also a test!',
[API.effects.spin, API.effects.fade]);
}
}

That is positively spooky in Webkit and FF (even on my seven year plus
old test machine!) I've also had someone test these transform effects
on the iPhone and they said they were smooth as silk (same for the
scrolling effects). I see I will need to add overflow:visible during
the alert spin animation though as IE has some sort of a clipping issue.
Opera 10.5 showed a brief flash of scroll bars, which it definitely did
_not_ do for the spinning images in the Reveal example. Not sure what
is going on there, but all in all, I am thrilled with how this stuff is
turning out.

And yeah, the animation documentation needs some work. But the
Transform add-on (which is fairly small with very little of it dealing
with effects) should be enough for any programmer to see how to create
custom effects and augment methods (e.g. setElementTransform) to apply
those effects. At this point, you are still going to have to want to
learn. I'll get to the point where everything is spelled out for you
soon enough.
From: Ethan B on 17 Mar 2010 14:57
On Mar 17, 8:26 am, David Mark <dmark.cins...(a)gmail.com> wrote:
> Initial examples page has just been completed.  Isn't even linked to the
> site yet.  There is a link to a new primer _from_ this page if you look
> closely (something I get the feeling most visitors do not do).
>
> http://www.cinsoft.net/mylib-examples.html
>
> It's been available to readers of my forum for a couple of days, but I
> think I am about ready to connect it up to the main site at this point.
>  As you might imagine, I'm quite pleased with it.  :)  I'll be expanding
> it to demonstrate slide shows, setting HTML and query-based effects
> shortly (among other things).
>
> Would be interested in feedback.

In my opinion, being able to toggle CSS and source code visibility
(default hidden) would make it easier to scroll through the demos.

And many more examples would be appreciated. :)


On a side note, I've been meaning to say that your my library build
tests are a little bit hidden... Maybe a link to a test of the full
build in the site's navigation?

Thanks,
Ethan B
From: David Mark on 17 Mar 2010 15:21
Ethan B wrote:
> On Mar 17, 8:26 am, David Mark <dmark.cins...(a)gmail.com> wrote:
>> Initial examples page has just been completed. Isn't even linked to the
>> site yet. There is a link to a new primer _from_ this page if you look
>> closely (something I get the feeling most visitors do not do).
>>
>> http://www.cinsoft.net/mylib-examples.html
>>
>> It's been available to readers of my forum for a couple of days, but I
>> think I am about ready to connect it up to the main site at this point.
>> As you might imagine, I'm quite pleased with it. :) I'll be expanding
>> it to demonstrate slide shows, setting HTML and query-based effects
>> shortly (among other things).
>>
>> Would be interested in feedback.
>
> In my opinion, being able to toggle CSS and source code visibility
> (default hidden) would make it easier to scroll through the demos.

Absolutely. That's coming.

>
> And many more examples would be appreciated. :)

Many more are coming, including slide shows and setting HTML (with or
without effects). That territory was mined pretty heavily in the Test
page, of course, but not with the add-on effects. :) Transform by
mousewheel or drag, the more advanced transform effect, lots of
query-based operations (e.g. spin every nth element in) and much, much
more! Now that I've mastered my own monster, I can teach you to tame it
too. :)

>
>
> On a side note, I've been meaning to say that your my library build
> tests are a little bit hidden...

You are a 1000% correct, what held you back? :) That's been on my mind
too of late. That page has a lot of potential to learn with examples
and a monitoring console to boot. But I get the feeling that many
would-be developer's attention spans kept them from getting that far.
Mea culpa, but I never wanted to try to sell anything to anyone.

> Maybe a link to a test of the full
> build in the site's navigation?

I like it! I have to update the navigation for the Examples page and I
will throw that in (at no additional cost). Stay tuned...
 |  Next  |  Last
Pages: 1 2 3
Prev: Applet UpCall from JS Event - Which Thread?
Next: Request.QueryString