Sorting MultiButtonList or ComponentGroup - sorting

Is there any way to sort a multibuttonlist or a componentgroup by TextLine1 or TextLine2?

You can perform a sort algorithm as you normally would.
To sort the multi buttons just remove them and add them based on that order (assuming you are using a layout manager such as box layout). You can also animated them into place using animateLayout if you want that.

Related

Angular2 performance with lots of input elements with two way binding

I have a component which displays a UI similar to a spreadsheet. There are lots of elements with two way binding [(ngModel)] to a mutable Object.
As soon as the number of inputs grows past 100 or so inputs the UI becomes sluggish. The profiler shows a lot of time in Decimal format (decimal pipe).
I can think of a couple of possible solutions:
Using immutable objects somehow?
Customising the 2 way databinding?
I am not using ChangeDetectionStrategy OnPush, but I am curious as to how this will help and how to actually implement it with [(ngModel)] on html inputs.
Many input fields on a page is stressful both for the CPU and the user.
Instead of showing a spreadsheet with many input fields simultaneously - I would rather make the cell an input field only when focused, and otherwise only show the value of the cell. Use *ngIf on the input checking for the current cell being edited.
This way you should be able to keep the functionality you want, but by making only the focused spreadsheet cell an input - that should improve the performance of the page.
Since NgModel is directive it does not support change detection strategies, it means that you should avoid NgModel. The only way is to create custom component that uses OnPush strategy and wraps input field.

Independently jumping over full column span rows in the grid regardless of source order

I'm using singularitygs as my grid system and am really like the flexibility but I have come across a fairly unique situation and I'm not sure if singularity (or any other grid system) addresses
I have a row that span the entire column width, that breaks up the header portion and the content portion of the document. There is an element, div.b, that sits within above the full column bars next to div.a in larger layout. But on a medium sized layout and below, that element falls below the full span row. Here is the source order and the desired output, showed using a 10 column layout for simplicity.
Source Order
div.a
div.b
div.c
div.d
div.e
div.f
div.g
div.h
Large Layout
Medium Layout
Thanks in advance for any help and ++ to the creators of the grid system
Interesting use case. Honestly it’s going to be pretty hard until CSS grid layout comes out. While Singularity can handle any order horizontally, the vertical reordering like "D" and "G" stacked is going to be tricky. There might be a clever use of floats to get this working but it will probably be more hand manipulation of elements than pure Singularity magic.

How to multiple sorting with jQuery Isotop?

I'm using jQuery isotope from there: http://isotope.metafizzy.co/
There is a way to sort with multiple types?
For example: moving all green and blue boxes to the top of the container?
Thanks
You can sort for multiple types, see this sample fiddle. The documentation for sorting is here. All you need is to make green or blue a data-category on each div. Or, you could use a class also. See it here how to use the data-category for sorting. It's that simple. And another one is well explained here. Now, you need just a bit of programming to adapt it for your case. But, again, it's all in the original's sorting documentation.

Highlight Data Points in Birt Reports

creating simple charts with BIRT is easy, but now I would like to bring some more life to them...
imagine a simple line chart. Let's define as a requirement, that the maximum value should be highlighted. A further requirement would be that if the user clicks on this data point, something happens.
How can I solve this?
I can imagine that I could created a second value series which consists only of the highlighted data points.
But it would be nicer if there was a JavaScript API (or even a server side java api) with which I could loop through the data points and add a highlight on the fly. Is this possible?
I think I've found a good starting point:
http://www.birt-exchange.org/org/devshare/designing-birt-reports/276-birt-chart-scripting-dynamic-markers-and-datapoint-colors/
Now I have to find a way to add on click events to certain data points...

Know any great examples of CSS3 Transformations/animation for sorting/filtering group of items

We are building essentially a product/image sorter in pure CSS and js. The sorter will reorder products into different groups based on filtering and selecting. It needs to be ultra fast and smooth when moving/shifting products etc
Here is an example in flash of what I am talking about (click the links in the middle of the page to see animation):
http://dermalogica.com/us/products.html#/products/product-use
But I am looking for examples using Pure CSS3 transformation and/or JS that are as fast during animating and sorting as the example above.
Here is one example that I found using pure CSS that is sort of similar:
http://files.myopera.com/FataL/pres/pres.xml?1280852782
Know of any others?
Not sure if this http://www.spritely.net/ has what you're asking, but you could give it a shot!

Resources