Ordered Multi-select control in HTML

I'm developing a highly customisable SaaS application. It has at several places a multi select, for some cases additionally to selecting the items, the user can define an order, for other cases it is only the selection which matters. (Order is mostly for the order in which the items should be displayed later on)

Originally we were using two lists (available items / selected items) where the user could move the items from one list to another via buttons or drag&drop. Similar to: enter image description here In case the order would matter, there would be additional up/down arrow buttons on the right side, to change the order of the selected items.

However this control was too big for many scenarios, so with the redesign of the application and switch to angularJS we found a much smaller control: http://isteven.github.io/angular-multi-select/ The problem here is, that we have one use-case with several hundred items, and those look to be just too many for a drop down control. Also it isn't possible to change the order. So why the experience and layout improved for many use-cases it got worse for others.

Now as far as I know, you should try to use always the same controls, the same buttons, in order to not confuse the user. Are there any examples which we could look at? Any idea how we can introduce sorting into the angularjs-control? Or should we just have 2 different controls for slightly different usecases? won't that be confusing at best?

We've taken the idea of the first control from classical wizard applications which are 15-20 years old. I just can't imagine that nobody came up with a better solution since than, but still I won't seem to be able to find one.