I need an ionic component to be developed that will allow the end user to organise visually elements into groups and sub groups.
key requirements :
-
take an array of objects, display the elements on the screen.
-
provide the ability for the user to drag and drop the elements to reorder the elements
-
provide the ability for the user to drag an element onto another element to create a group (looking for similar functionality as creating folders on mobile phone launchers).
-provide the ability to drag and drop a group onto another group to create a super group.
-
provide the ability to label the group’s and super group
-
provide the ability to set a maximum number of elements for a group and/or super group(i.e a user can set a maximum number of elements for a group and a super group). unlimited = 0.
-
visually reject an element from being dropped onto a group of the total count of elements exceeds the maximum set. i.e animate the group and element to shake
-
visually reject a group being dropped onto a super group if the total number of elements (including the elements in groups exceeds theaximum). animate group and super group to shake.
-
visually reject an element from being dropped onto a super group if the total exceeds the maximum set. animate the super group and element to shake.
-
provide the ability to reorganise the order of elements within groups and super groups by dragging dropping.
-provide the ability to reorder groups and elements within a super group.
- provide the ability remove an element or group from a super group by allowing the user to drag the element/group out of the super group. the element or group should be made available for the user to create new groups (i.e root of heiarchy).
-provide the ability to remove an element out of a group, even if the group is in a super group, at allowing the user to drag and drop the element outside of group. the element should be made avialbe for the user create new group (i.e place element at the root).
-
provide the ability to destroy a group or a super group. a super group should return the elements and/or group to the root level. a group should return the elements to root level.
-
visually display that a group/sub group has exceeded the maximum. (i.e if a user changed the maximum of a group 6 to 3).
-
provide the ability to save the work (save to local storage).
-
provide the ability to load the work (load from local storage).
-
provide the ability for the user to add more elements
-
provide the ability to generate a PDF of the work showing the super groups, groups, elements. To be sent out via email or saved to local storage.
As mentioned this is for ionic 3/cordova, using angular 2+ (typescript). Assumption is that this will work on both iOS and Android.