Implement sorting functions for Requests
One of the goals for this OBS Mobile Project to make the list of requests sortable, by date/time, requester, target project/package, and request state.
Basically, there are two options:
2. Do the sorting on the server side in the controller (request_controller) and make the mobile view render only that list. This option requires a round-trip to the server with a parameter indicating how the list should get rendered. The controller prepares the new list, which then gets rendered by the mobile view.
The first option is apparently preferred over the second one.
Then, I attempted to make the list sortable with the help of an acts_as_list plugin. In theory, it looked like it would work. First of all, I tried to create a position column to the request list so as to construct a table:
generate migration add_position_to_requests rake db:migrate
Next, I created a <ul> of requests that belong to a given user. Each <li> contains a request, and I just have to “stage” the element’s IDs when I serialize the list using jQuery.
I also created a span with a class of “handle”, which is where the user sorts the requests.
This didn’t work, either. The class that has this extension specified needs to have a +position+ column defined as an integer on the mapped database table, like this:
class TodoList < ActiveRecord::Base has_many :todo_items, :order => "position" end class TodoItem < ActiveRecord::Base belongs_to :todo_list acts_as_list :scope => :todo_list end todo_list.first.move_to_bottom todo_list.last.move_higher
However, this seemed to be an overkill for this project, as there is no request table. The list of requests is directly loaded from the API, not stored on the webclient.
I checked out a few Android apps to see how they implemented sortable lists. I found Zaarly (a local community marketplace, launched in Chicago, US). It has a neat UI for sorting items and looks pretty much like what I want to achieve:
Looks like this app has a list of items (perhaps ordered by item ID or just randomly), and each item in the list has 3 elements / attributes:
- distance from where the user is;
- date/time the item is posted;
- price of the item.
There are 3 sorting buttons at the top:
Whenever a uses taps a sorting button, it’s calling a sorting function to rearrange the list of items based on element values. I don’t think there is a round-trip call to the server, because sorting in this app takes only the blink of an eye. So how is this implemented? Inset lists?
Maybe I could do the same with the requests: list the requests by request_id, and give each request 4 elements: date/time, requester, target project/package, and state. Then implement a function to rearrange the list based on an element’s value whenever that element is called. In that way, the server doesn’t need to be called, and changes take place in the mobile UI only. Looks like it might work, in theory.
On another note, I’m not sure if there would be much difference in implementing sorting functions between native apps and browser-based apps, but I’ll look into that. Maybe the algorithms are different, but the results will be the same.
A prototype of this concept looks like this:
More polishments need to be done, e.g., highlighting the button of the current ordering, showing the request state, and checking if the sorting has bugs…
I will continue working on this implementation, and update the post when I get some results.