Thanks for looking into this.
I'm looking to build a framework of apps which can be extended by third party developers.
The goal is to load each frame via ajax - I need to know if there is a framework which can be help me position and resize various widgets just like this one.
Example screenshot
http://tour.netvibes.com/private.php
Thanks.
Not completely sure what the question is... but:
http://jqueryui.com/
Draggable/droppable as well as jqueryui dialog should help you create and position widgets as in your question.
If you do 'view source' on the page you have linked, you can see that the page uses Mootools.
Appears to be some kind of Javascript framework.
http://mootools.net/
Additionally, you could follow Mark's advice and go with jQuery, which is a widely-used, mature framework that offers great functionality.
I agree with rmk and Mark about jQuery being a great framework!
For the ajax stuff it works well and is really easy to get into work.
For the UI part you can try the "standard" jQueryUI, which is well structured and easily themed, but by now it has a limited set of things. You have all you need to build widgets, but you don't have ready-to-use stuff like panels, layouts and so on..
If you need more, besides those said above, try looking at jQuery EasyUI, which has a lot more of things (for instance a "panel" extension to put widgets inside).
They are both based on jQuery.
Related
wondering how to use BoilerplateJS with Jquery Mobile. Perticulary when it comes to manage url and how to deal with the which is created automatically.
Thanks.
I haven't seen any examples out there so have been doing exactly that myself but haven't yet completed the exercise. You need to add the jQuery Mobile references into the top level index.html and then modify the html (structure, tags) to something that JQM will like to render. You also need to ensure the views correctly trigger enhancement of content changes. It seems straight forward enough although styling might yet be a gotcha so I can't yet say whether it's trivial-but-time-consuming or going to be a mess.
I'm doing an app with jQuery Mobile and Angular.js. Cause we have some issues using both libs, exists an adapter that do "teh job".
So I'm trying using routeProvider to route my pages. But I still can't render pages using this.
Here plunker if u can help show me the way.
http://plnkr.co/edit/DNGiT83csWMmfYnHXOop
Thanks in advance!
I ran into a similar problem and maybe what I learned might help you. It comes down to the differences in the way angular and jquery go from one page/section to another (routing).
First, the basics: angular routes by inserting a chunk of html into your view, then on whatever click/action/etc, removing that html from the view and adding a new chunk of html. Essentially you're on the same page all the time; it's just the included html is changing. In contrast, think of jqm as loading up all the html into the same page, with those html chunks as divs. Instead of removing html chunks and replacing them (via routing), it's just turning divs off and on. (There are multi-page jqm apps but SPAs really highlight the differences.)
My suggestion is to pick which set of features you really want: angular's minimalistic loading (only as you need it), or jqm's flashy transitions and other built-in features. If you've got a massive app with a lot of data on every page, you might want to bypass jqm and use angular alone, and see what you can do with angular's new animate functions. It'll mean you'll need to build (via CSS or javascript) duplicates of the jqm features -- and from what I've seen, you can get close but it won't quite be as pleasantly streamlined as jqm.
If the jqm built-in features are what you really want, then skip using angular's routing. It'll just introduce all kinds of complications, anyway. Set up your pages using jqm's pattern, and use angular only where you're dealing with data.
What I've found works best is to treat it like it's a jqm app overall, and only add angular into the sections where you need it. After all, you don't have to add ng-app at the html line; you can add it into a single div as needed. Since jqm is happiest as a system-wide kind of thing, while angular is just fine being confined to pieces within a system, so far I've found jqm-whole and angular-parts to be the simplest way to get the best of both worlds.
I'm working on a brand new project for a state government agency that we are going to be using Asp.Net MVC3 as our framework.
My question is I cannot find any guidance on how to make our web app Section 508 (and similar accessibly requirements). This is my first project where this is a requirment. So to implement this do I - For example -
Is MVC3 compliant out of the box just by adding some properties?
Extend the standard controls for this functionality?
Write my own controls?
Any suggestions would be appreciated. We don't really care about how this is implemented as long as it is clean in our Razor view.
Section 508 compliance doesn't have so much to do with the technology as it does the implementation of that technology. If you look at the guidelines, they're (for the most part) implementation details:
Having alt tags for images
Captioning audio presentations
Verifying that information is displayed with cues beyond just color
Documents readable without a stylesheet
Having row and column headers for your tables
Frames (if you're really still using them) must be titled and labelled
Don't add any content that flashes or flickers
When using javascript have descriptive information that identifiers to the user what is happening
The rules go on a bit more, but you get the gist of it. It's not in the technology, it's in the implementation details. You can do all of these things with standard HTML (captioning videos may be a bit trickier)
One other thing I can recommend: The Web Developer toolbar for Firefox (and I'm guessing the Chrome version as well) has a 508 validator option built right in. It will get your up and running on what the reqs really are.
Web accessibility is too broad a subject to cover in a single answer, but it is all to do with your HTML markup - regardless fo controls, or anything else you use. What really matters is the HTML rendered - even if you use some components to assist with this.
You can find a lot more information by searching for "web accessibility" in your favorite search engine, but my high level suggestions would be:
Be proud of your markup, and make it semantic. Use headings only when you actually intend there to be a heading. Within a table, use instead of if the cell is a table header. Use bulleted/numbered lists when that's semantically what you want. Don't miss-use tags to fake appearance.
Then layer on CSS to provide any visual look that you want. Check out http://www.CSSZenGarden.com to see how this is possible.
Finally, add on your behavior using Javascript. Don't mix these three up - with Javascript you can add in event handlers in the jQuery $(document).ready() function; leaving your markup behavior-free.
If you wish to use lots of Javascript libraries and controls, then beware that this is likely to decrease your compliance unless you specifically look for accessible controls which promote progressive enhancement. For a government site, someone without Javascript should still get a good experience, and a blind screen reader user should be able to use your Javascript controls as most screen reader users still have Javascript on.
There are various good articles on choosing your color contrasts, avoiding rapidly changing content, spacing - too much to cover here :-)
No, you need to write your html to be follow the 508 requirements. MVC doesn't do anything special in that regard.
For some reason i don't like any of the themes that are on the jquery ui themeroller page (i am looking for something on a business website and these all look either bleak or too corny). I wanted to see if there were other sites where people have uploaded or voted on other themes to view and download.
I know i can tweak my own but first wanted to see if anyone has done this already with a better artistic eye.
Aristo is a really nice jQuery UI theme that is worth consideration.
As others have mentioned, there are more themes out there if want to do some more digging...
I want to have two different jQuery UI accordion menus on the same page, but I want them to have different themes. Is this possible?
Absolutely. The jQuery UI CSS Framework has a robust and complete theming solution. Just give your accordions separate CSS classes - jQuery UI classes are semantic in nature - and off you go! Let me know if you'd like an example.
EDIT: There are many different ways to do this, depending on what your needs are. See the bottom part of this page for more information on how to use theme-ing with the accordion
According to the article Using Multiple jQuery UI Themes on a Single Page from the Filament Group, it is possible to provide a CSS Scope when a theme is downloaded that will allow you to specify use of alternate themes on a single page. There is also a link to a demo page.
Disclaimer: I have not tried doing this myself, but it does look promising.