Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

backbone compatible UI/component library for some sencha/enyo style features

Let me start by saying I have read plenty of questions and blog posts relating to the use of combinations of backbone/jQuery mobile and comparisons of backbone/Sencha, and have actually had my head in this space for some time but still haven't found quite what I'm looking for.

I'm very familiar with Sencha and have used it for wrapped (phonegap etc.) apps in the past, and I really like it. However for a smaller code base for web projects and more control over browser compatibility and various other reasons it's not quite appropriate for certain tasks.

When I start trying to engineer mobile (but also desktop and tablet) backbone webapps from scratch I find I miss three key things

  • General mobile 'init', filling the screen etc. (although this is the easiest to replicate)
  • Tabbed, iOS-style, navigation (of course I can roll my own, but it seems silly)
  • Scrolling - both scrolling a piece of content, but especially the carousel and how the carousel is linked to the tabbed interface

I'm not massively bothered about mimicking each device's native OS style throughout the app, and in fact would prefer to (whilst following some sensible conventions) make them look a bit different.

Ember has flame and I've used that before, that's kind of the thing I'm looking for.

I know I can build up a toolkit of jQuery mobile, custom script, jQ plugins/iSroll, CSS libraries, backbone UI etc. and do like the idea of compiling my own 'stack' but for some reason it just doesn't feel right.

So, to bring this back around to more of an actual question. I guess I'm looking for ideally a single project that isn't specifically linked to a library - and in theory could run on it's own on a statically coded page if needs be (even though that wouldn't be the case for me now). Or perhaps some words from others who have been on a similar journey and perhaps ended up on the mix of libraries I mentioned earlier with why they decided this was the best solution.

I'm not looking to do anything too crazy, say something a bit like the old sencha oreilly example but using some carousels, and I'd cover the multiple devices and browsers with a mix of Responsive CSS and a bit of JS.

I'm going to continue looking at this myself too and report back if I find anything interesting

Cheers

EDIT

While looking into this, I realised its only really the carousel and scrolling that I really wanted from Sencha. I noticed that Cubiq has a nice slideview component that handles the carousel very neatly and with a small footprint. I found a stackoverflow answer about using this with the original iscroll for vertical scrolling. See my answer below for successfully using the two together How to use iScroll4 with SwipeView?

This would need some tweaking to work appropriately on desktop. and I'd like to control it from a tabbed UI too. Anyway, I'm not near answering my own question but given this has had a couple of upvotes I'd post some of my thinking.

Quick edit

You can attach events for tabs to the slideview https://dl.dropbox.com/u/81328343/scroll/1.html but at the moment, it only animates for next/prev and not direct page (tab) access

like image 684
joevallender Avatar asked Nov 12 '22 23:11

joevallender


1 Answers

Webix

Very big library of components.

like image 63
darky Avatar answered Nov 15 '22 12:11

darky