I am looking for options to manage the ui-layout of an ember application I am currently working on.
The application has to be very flexible (configurable) when it comes to the ui-layout - so having layout-containers with regions like "top", "left", "center", "right" and "bottom" which can be nested whould be a good fit (thats how most layout-managers manage layout).
I found a few solutions, but am somehow undecided:
yui2-layout-manager (Demo)
Seems a bit old/clunky, successor, yui3-layoutmanager, is in "planning" stage since months (years?)
jquery-ui-layout (Demo)
Looks a bit bloated. Codebase is not public: As it seems the project-owner does not want it to be too public(?) (from what i read in the google-group, someone asked why its not on github...)
dojotoolkit (Demo)
Seems quit a bit "obtrusive"
All in all no solution feels "good" to me and I wonder if I should better write the layout-managing-logic myself. What do you think?
Check those two addons:
https://github.com/ghempton/ember-layout
https://github.com/ghempton/ember-routemanager
Also check the demo http://ghempton.github.com/ember-layout-example/
Edit: I think this project: https://github.com/flamejs/flame.js is extremely close to what you want.
JQuery ui-layout is a problem with Ember, because ui-layout requires a ui-layout-center element at layout time, but Ember {{outlet}}'s typically defer the presence of these.
You may have a look at Twitter's Bootstrap. It has a layout classes set.
http://twitter.github.com/bootstrap/scaffolding.html
I finally found it: http://www.bramstein.com/projects/jlayout
"[..] The jLayout JavaScript library provides layout algorithms for laying out components. A component is an abstraction; it can be implemented in many ways, for example as items in a HTML5 Canvas drawing or as HTML elements. The jLayout library allows you to focus on drawing the individual components instead of on how to arrange them on your screen. [..]"
Related
Summary: I have seemingly hit a limitation in Figma when trying to make the columns behave akin to a CSS grid system. I would like to know if I have misunderstood Figma's built in capabilities, if there is a plug-in that solves the problem, if I have to create one Figma frame per CSS breakpoint (undesirable), or if there are other solutions.
Background: As an interaction/ UX designer, I would like to specify the responsiveness of a web based application, so that the front end developers know how the interface should appear at all browser widths. They implement in a CSS-based grid system similar to Bootstrap
So far, I failed in achieving what I want, and the most knowledgeable UX'ers in the company think I have hit a limitation in Figma's capabilities, but they are not certain.
Basically, what I want is this basic responsiveness, but column based. But as shown in this video, none of my experiments work.
I wonder if it boils down to this: If a Figma child element has:
horisontal constraint set to “Scale” and
vertical constraint set to “Hug contents”
Then the parent element cannot have:
vertical constraint set to “Hug contents”
Is this is a known limitation in Figma? If yes, are there plugins that solve this problem, or is it outside Figma's scope to offer this type of alignment with CSS-based grid systems? Obviously, it would be very beneficial if the solution also supports breakpoints.
P.S. I have asked which SE site that was most suitable for this question, and SO was the suggested site. The question was closed on UX.SE.
No, according to an answer on Figma's own forum, Figma's columns cannot behave akin to a CSS grid system, even though “several threads [have] requested [this] evolution”.
Does anyone know any table component that works with EmberJS 2.6?
My requirements are next:
Fixed header
Resizable columns
Sortable by column(s)
I know about these one but it does not work with current EmberJS version and it looks like it wont in near future...I tried two forks that looks decent but no luck, so im looking for replacement. Also I don't mind using some heavy library's I don't need since its for node webkit app.
Ember Light Table should work for you.
It has all your requirements, and is fairly easy to customize.
Hope it helps
Ember-table has branch https://github.com/addepar/ember-table/tree/cyril/ember-2.0 for ember 2.0
But my experience says that better check https://www.emberaddons.com/?query=table cause Addepar not pay enough attention to ember-table. We try ember-tabello - still work fine
When I try to print my Ember.js page application, templates aren't displayed on the sheet (it only displays a big empty white section). Any explanations or solutions?
Thank you
You will need to use traditional media queries to implement the ability to print from your Ember app. As far as I am aware there, no one has created an ember addon to support print functionality at this time. (See here where it doesn't look like anyone has a good suggestion for a similar question.) I can imagine it would be difficult to support generic functionality for printing that looks decent across apps, which may explain why no one has attempted to create an add on at this time.
I've been writing my own pagination logic that would be similar to the Ember.SortableMixin but with support for paging. Does anything like this exist yet in the pre 1.0 build?
If this doesn't exist is a pull request welcome around this specific behavior? It's my guess that 90% of apps out there need simple pagination/sorting and having a mixin built in would cut out almost 60+ lines of code.
Thank you in advance
Update
I replied to another "ember/ pagination" question and my full blown (working example) can be found at the below
Ember pagination full example
Here's a simple one that I've used: https://gist.github.com/1559628
It's by one of the top ember contributors.
i've just come across emberjs-pageable.
it looks quite nice at first glance, but i'm not sure if it's still maintained.
I've been using this one https://github.com/mathieul/page_wrapper
Tailored for use with Rails but could easily be adopted.
Really happy with it so far.
I have a django app and I would like to display some graphical data visualization to my users. I am looking for an easy-to-use package that would allow me to add graphs and widgets.
The kind of widget I want to build is a kind of speedometer dial that is red at one end and green at the other. As a user completes their job over the day, the graphic/widget adjusts itself. The dial moves from red to green.
I also want an S-curve graphic that shows the cumulative amount of work accomplished against planned. That is kind of an x/y line plot.
My question are: How easy is this to implement? Are there any add-ins libraries or packages that do this already? I am trying to keep my entire application open-source. I've seen a couple subscription services that do this type of thing, but I can't stomach the cost.
I don't mind using ajax or jquery to implement such a thing, but I would like the most elegant and maintainable solution.
Any advice or examples on how to tackle this project?
There are lots of good javascript libraries these days, but all require some effort to learn how to use. I have not found one that really is easy to use, I guess because everyone wants something different. My general experience has been the more effort you put into learning them, the more you get out.
Google has gauges: http://code.google.com/apis/chart/interactive/docs/gallery/gauge.html
Also
http://www.flotcharts.org/
http://philogb.github.com/jit/
http://www.highcharts.com/
http://www.jqplot.com/
Or really take control:
http://mbostock.github.com/protovis/
As first, see the following grid (https://www.djangopackages.com/grids/g/dashboard-applications/) on djangopackages.
Not sure if that's exactly what's asked for, but you might take a look at django-dash (https://pypi.python.org/pypi/django-dash).
It allows each user to make his own dashboard (from plugins available). Those dashboards can be made public.
Some screenshots (http://pythonhosted.org/django-dash/#screenshots).
It's modular and plugin based, so you need to make a plugin and widgets for every specific feature (in this particular case - the speedometer plugin and widgets for it). Each plugin/widget can include own JS/CSS when being rendered.
See the following chart usage examples:
D3.js integration examples (https://github.com/barseghyanartur/django-dash/tree/master/example/example/d3_samples).
Polychart2.js integration example (https://github.com/barseghyanartur/django-dash/blob/master/example/example/bar/).
protovis is no longer under active development, but they started a new poject: http://d3js.org/
You may choose from these packages:
https://www.djangopackages.com/search/?q=dash