fixed toolbar?

[mrie...@googlemail.com]

how would i implement a fixed toolbar?
the toolbar should not scroll on long lists. only the list itself.

thank you

markus

[djp]

That would involve dissecting PastryKit (http://davidbcalhoun.com/2009/
pastrykit-digging-into-an-apple-pie) which, rumor has it, Kaneda is
doing.

On Jan 9, 5:36 am, "mrietz...@googlemail.com"

[jonPrecise]

bah!.. Pastrykit?
If you noticed, it has no license, which technically makes it illegal
to use as is.
No developer would currently reference it on a serious project,
outside the realm of learning from the methods with the goal of
implementing similar techniques in their current framework.
On the topic of dissecting it, why waste your time? I doubt it was
created for a single manual, it will most likely be released as an
Apple solution to the current web app 'DIY' problem.
If you're looking for a fixed toolbar, there's a license for that.

Matteo Spinelli wrote a script called iScroll:
http://cubiq.org/scrolling-div-for-mobile-webkit-turns-3/16
Sam Shull wrote an iScroll extension for jqt: http://code.google.com/p/jqextensions/

With a few tweaks, it feels like a native scroll, although it
currently has one issue: it's not dynamic.
With every ajax call, you will need to re-initiate the jqt object
which makes it a memory hog :

<script type="text/javascript">
var jQT = new $.jQTouch()
</script>

NOTE: make sure you include After the html.

I'm currently trying to resolve this issue :
http://groups.google.com/group/jqtouch/browse_thread/thread/d3134158a8d1ffbd
when I do, it will be posted there.

Besides this solution, googleing your question will get you nowhere,
you can usually find anything with google, as long as it's ancient
history.
I was put on an iphone web app project against my wishes, and I've
learned with web apps, most are keeping the secrets/hacks to
themselves, unless they're working open source of course or with the
intent of self promotion.
So unfortunately, in this market you're on your own, and I really
don't like this market, the iphone, or this dreaded jQuery movement.
Yah, although I may be old, I can still learn new tricks, but who has
time for that.. really?
sorry, I'm ranting.. Pastrykit.. pft

[David Kaneda]

Hi guys,

Just real quick:

After thoroughly reviewing PastryKit, I've decided to go a different route—the code in PastryKit isn't IMHO fantastic, and there are lots of features/structure/codebase that I don't like (like Dashcode). Instead, like jonPrecise mentions, I'm aiming to implement an extension which starts with Matteo/Cubiq's script and hopefully just add some acceleration.

I'm actually meeting with Matteo tomorrow, so hopefully we'll get a chance to discuss.

Thanks,

Dave

......................................................

David Kaneda, jQTouch developer

http://www.twitter.com/jqtouch/

[Jann Gobble]

Good luck!

I have yet to get the iScroll to work in any of my PhoneGap apps! (and I *have* tried till I am blue in the face)

:(

Jann

[Andy Fuchs]

In the last couple of days I was looking for an existing script which allows
'flicking' (or swiping) through images/divs/whatever. IMHO this is a very
cool feature in native apps, which doesn't exist at all in a webapp: (i.e.
look at Apple's Weather.app or Photo.app on the iPhone). Maybe you can talk
to Matteo, if it would be possible to enhance iScroll in this direction....
;-)

a.

[Matías Herranz [scoobygalletas]]

Hi jonPrecise!

> Sam Shull wrote an iScroll extension for jqt:  http://code.google.com/p/jqextensions/

I have no enough words to thanks you for this link. I struggled about
6 hours trying to get scroll working proporly in an iPhone webapp
(which I'm compiling with PhoneGap) with no good results until this
link. The main problem I had was having both a header and a footer,
and when I scrolled dows the footer behaved in an "sticky" way and
went up with the rest of the scrolling content.

Again, ¡¡THANK YOU!!

Matías Herranz.-

[Chris]

Matías: Would you mind sharing the snippet you built for the footer?
Also did you solve the issue reported above about having to re-
initialize JQT on every ajax access?

On Jan 20, 6:56 am, Matías Herranz [scoobygalletas]

[Quinn]

Sorry to be such a newbie, but I'm lost. I followed the link (Sam
Shull wrote an iScroll extension for jqt: http://code.google.com/p/jqextensions/),
but don't see any expansions to download or anything marked iScroll.
Where do I find it?

[Chris]

http://jqextensions.googlecode.com/files/example.zip

[jonPrecise]

@Matias
Np , btw did you notice Sam's extension of iScroll for jqt seems to be
much more responsive than the original iScroll?
I didn't look through the script much to pick out the improvements,
but bravo to him .

@Chris,
nah, I havn't been able to resolve the ajax issue, although someone
dropped a rather cryptic solution over at my thread:
http://groups.google.com/group/jqtouch/browse_thread/thread/d3134158a8d1ffbd
As a work-around for now, I just recycle an iScroll div on the main
page by running urls through a load function and swapping displays,
works great so far.

[Davide Zanotti]

I'm trying jqt.scrolling.js and it seems to work, but I don't see scrollbars appearing during the scrolling... is it normal? 

--
Davide Zanotti

blog: http://www.daveoncode.com
twitter: http://twitter.com/daveoncode
oreilly: http://www.oreillynet.com/pub/au/3894

[jonPrecise]

@Davide
The newest version of iscroll has an option for scrollbar,
although you would need to merge the new script with sam's extension
and prolly won't work out the box.
also, might not be worth the trouble depending on what you're working
on ..
any kind of indexing would benefit from the addition but I think a
solid app looks a bit better without it actually,
and per the project comments, it sounds like they're having
performance issues with applying the scrollbar.
read all about it: http://cubiq.org/scrolling-div-for-mobile-webkit-turns-3/16

[Chris]

Jon: Would you mind sharing your trick on the ajax solution. I was
really lost on the 'hint' given on your other page.

Also I can't get this statement to work when I put it in the JQT
slideSelector: '.right',
I have to comment it out otherwise it won't load. Also the
class="right" won't work for me. Just hangs on the <a>. The "flip"
works fine

On Jan 21, 8:21 pm, jonPrecise <jc6...@gmail.com> wrote:
> @Chris,
> nah, I havn't been able to resolve the ajax issue, although someone

> dropped a rather cryptic solution over at my thread:http://groups.google.com/group/jqtouch/browse_thread/thread/d3134158a...

[IIIxwaveIII]

Hi;
assuming that what I am looking for is an inter-page view sticky
header/footer (a header/footer that sticks between view transitions)
do I have any options currently?
i noticed iScroller has a per view sticky header/footer (for div
scrolling) but it's not the same.
is this something someone is working on? is it possible today with
jqtouch or its extensions?
thanks in advance.

On Jan 26, 6:47 am, Chris <m...@mgcars.org.uk> wrote:
> Jon: Would you mind sharing your trick on the ajax solution.  I was
> really lost on the 'hint' given on your other page.
>
> Also I can't get this statement to work when I put it in the JQT
> slideSelector: '.right',
> I have to comment it out otherwise it won't load. Also the
> class="right" won't work for me. Just hangs on the <a>.  The "flip"
> works fine
>
> On Jan 21, 8:21 pm, jonPrecise <jc6...@gmail.com> wrote:
>
> > @Chris,
> > nah, I havn't been able to resolve the ajax issue, although someone
> > dropped a rather cryptic solution over at my thread:http://groups.google.com/group/jqtouch/browse_thread/thread/d3134158a...

> > As a work-around for now, I just recycle aniScrolldiv on the main

[Matías Herranz [scoobygalletas]]

On 21 ene, 00:31, Chris <m...@mgcars.org.uk> wrote:
> Matías: Would you mind sharing the snippet you built for the footer?

I'll build a demo of what I did as soon as I get the time and share
it.

> Also did you solve the issue reported above about having to re-
> initialize JQT on every ajax access?

I do just one ajax call and load all the info after successful login.
And did not have this problem.

Matías Herranz.-

[Matías Herranz [scoobygalletas]]

On 22 ene, 02:21, jonPrecise <jc6...@gmail.com> wrote:
> @Matias
> Np , btw did you notice Sam's extension of iScroll for jqt seems to be
> much more responsive than the original iScroll?
> I didn't look through the script much to pick out the improvements,
> but bravo to him .

Neither did I, but I noticed it to be more responsive. It works really
good.

As a comment, none of them work in Mac OS X Safari, nor even if I set
the browser to simulate Mobile Safari. Just works in the device (iPod
Touch / iPhone).

Matías Herranz.-

[jonPrecise]

@Chris
I don't know if you would want to use my solution, depending how far
into development you are, it can be an overhaul and most likely not
nessasary.
I steered away from jqt's div tier system due to some page history
issues and the iScroll ajax issue.
Now I swap displays ( divs hide: display='none' , div show:
display='block' ) for page navigation.
What I meant before by recycling a div for ajax, is by using jquery's
load function to pull data into a div that is already assigned as with
a scroll class.
If you use this method, just make sure to load some markup or blank
page when hiding the scroll div, so that when you come back to it with
a new query, you won't see the previous data.

> > works great so far.- Hide quoted text -
>
> - Show quoted text -

[Chris]

Thanks Jon. I think I will try to stay with the Div aspect of JQT
because changing it now will be quite an undertaking. I will look at
loading the page to a DIV in the main file using JQUERY.

On Jan 27, 3:37 pm, jonPrecise <jc6...@gmail.com> wrote:
> @Chris
> I don't know if you would want to use my solution, depending how far
> into development you are, it can be an overhaul and most likely not
> nessasary.

[Sam]

Everyone,
There is an update to the jQTouch iScroll extension and its example
here (http://jqextensions.googlecode.com/files/example.zip) and I
added an ajax loaded example, and an example with a sticky footer,
just in case some one is looking for an example of that additional
functionality. :)

Sorry, about the problem with the dynamically loaded pages, the
example uses an old version of jQTouch that didn't have the
pageInserted event firing. :-|

Sam Shull

[Chris]

Sam: This was great and I tried out both the ajax load and the stickey
footer. Both worked well until I went for my third level ajax load.
Then it went off the rails and I lost the jqt format. Anything you
suggest that I do to retain this on deeper loads?

> > >> - Show quoted text -- Hide quoted text -

[IIIxwaveIII]

love the extension. thanks a lot. i actually used the first version it
with an properietry absolutly positioned bottom toolbar until now but
i think i will make the switch now...

something looks strange in my iphone regarding the handling of the
orientation changes. i did not check all the examples but when turning
the iphone horizontally (ala wide screen - cant remember if its called
landscape) the top half of the page is not shown and only the bottom
half is shown and the rest of the iphone screen is a big blank.
anyone experiencing this? (i am not sure if its the same for the older
version of the examples)

thanks

[Sam]

@Chris
I added a recursive element to the ajax loaded page (changes the title
on pageInsert to ensure that it is in fact a new node), I did see a
problem when the id of the element was the same everytime, so I
removed that, and everything worked fine (just make sure the id of
your inserted node is not the same as the id of an existing element or
it will break). And I also noticed an issue with the hash check
function firing during the animation that raised a warning because the
animation was already in motion, this has been fixed in more recent
versions of jQTouch than the one I use in the example, I probably
won't update the example right now, but the extension itself works
fine with other versions of jQTouch (the ones that have the pageInsert
event), feel free to drop it the extension into an updated jQTouch
project (the example html won't work though, the code base has changed
too much).

@Illxwavalll
Did this happen with the example that I published? Or in another
project? I cannot seem to replicate the problem that you are
describing?

Regards,
Sam

[Sam]

Sorry @Illxwavalll I saw the problem after further investigation. I
never realized how bad jQTouch is at correctly updating the
orientation class. It mostly has to do with rendering and event
triggers not matching up properly, Dave chose not to use
window.orientation for some reason or another, probably backwards
compatibility or something, but my extensions rely on proper class
name for the orientation.

Here is the code to ensure you have the proper orientation at all
times on the iPhone:

$(function()
{
$(window).bind('load orientationchange', function()
{
$(document.body).removeClass('profile landscape').addClass(Math.abs
(window.orientation) == 90 ? 'landscape' : 'profile');
//this will cause aggravation if not all of your pages use the
vertical scroll/slide extension
scrollTo(0,0);
});
});

I updated the example. You will find the scrollTo(0,0) very
aggravating if you are not using the vertical scroll extension on
every page, supposedly it will scroll to top every time the
orientation changes, but it doesn't always work as advertised
though. :-(

Regards,
Sam Shull

[IIIxwaveIII]

thanks sam!;
BTW, there is some CSS code in the index.html of the examples. is this
not something that should be in the specific CSS files?

[Chris]

Sam: Could you provide a readme file that explains which files you
actually are providing (new or modified from the normal ones)? I have
changed the file structure from your demo and the JQT demo and also
use other versions of jquery etc. Its hard to tell which files are
yours vs ones you are distributing to be complete.

[Sam]

@Illxwavalll,
Good point, I moved two of the rules into extensions/scrolling.css
(the ones about using the bottom toolbar), but the others are very
implementation specific rules. For example, you might not want:

body.landscape > *
{
min-height: 270px !important;
}

on your site, unless you were using the vertical scroll on every page.
You should create a new class and apply it to the nodes that contain a
vertical scroll/slide div, like:

body.landscape > .contains-scroll
{
min-height: 270px !important;
}

and apply 'contains-scroll' to your page/node/div (whatever) that has
a vertical scroll in it. Hope that makes sense, I want the extension
to work as broadly as possible. But if you are planning on using the
vertical scroll on all your pages, or it doesn't interfere with
anything else feel free to use it as is.

Sam

[Sam]

@Chris,
The only files that are needed to make the extensions work are the
ones in the extensions folder of the example, i.e.:

scrolling.css -- always needed (except by scaling)

jqt.scrolling.js -- if you are using scrolling, vertical or
horizontal

jqt.sliding.js -- if you are using sliding, vertical or
horizontal

jqt.scaling.js -- if you are using scaling

Sam

[Chris]

Sam: Thank you for the list of files. That is what I had determined by
looking at the file attributes but I did not want to assume this,
especially since I had a problem. It would not be fair to you that I
was not using the tool correctly if I had missed files.

[Chris]

Sam: Mea Culpa. I forgot to include the class="fade" on the <a> tag :-
(

May I suggest that you might want to include a default class on the
<a> tag for people like me who forget those types of things.

It works great.

[Aaron Lord]

The demo works great!  Thanks!

Unfortunately, when I add scrolling.css and jqt.scrolling.js to my existing project, and wrap my content with <div class="vertical-scroll"></div>, it does not work as intended.  I end up with a gap at the bottom of the screen, and my navigation no longer works.

Note: My navigation is comlex.  I'm not using the regular anchor navigation, but binding to the tap event, because I have to make certain calls to web services to load data depending on what I tap.

Any ideas?

Thanks,

Aaron

[Sam]

@Aaron,
The gap at the bottom is because jQTouch does not properly identify
the orientation of the screen. I have detailed this and how to fix it
above and in the examples. Please review those explanations, or visit
http://code.google.com/p/jqextensions/wiki/HowItWorks for more
details. Feel free to submit an issue ticket.

[Aaron Lord]

I saw the notes about orientation in the demo, but didn't make the connection.  Thanks.

[Chris]

Problem with scrolling on AJAX pages.

I thought everything was going OK on my AJAX pages with the fixed
toolbar as I was testing on Safari and it looked OK. But now that I
have deployed it on an iPod Touch it appears that the AJAX pages don't
scroll. Instead the whole panel (toolbars and field) scroll as it does
with regular jqt.

The example files does work OK for its ajax pages so I am trying to
figure out what is wrong. All the pages that are part of my main
index file scroll just fine. Its just the pages loaded via ajax.

[Sam]

@Chris,

Could you provide more details? maybe a link?

Sam

[Aaron Lord]

Ok, I was apparently missing the nested div required for scrolling.

I had to tweak the css for full-screen view, changing the height to 417px.  Now a problem remains: When I scroll all the way down, there is always a little bit of content below the fold.  It looks like it would be due to the offset of the toolbar. 

On Fri, Feb 5, 2010 at 4:37 AM, Sam <brick...@gmail.com> wrote: