Index: lams_tool_assessment/web/pages/authoring/parts/questionlist.jsp
===================================================================
diff -u -r670dd8e248dc4705c92031c79d05a99559e35024 -r2f91c77f2441c84fd78199bd4e51f1028186bf8f
--- lams_tool_assessment/web/pages/authoring/parts/questionlist.jsp	(.../questionlist.jsp)	(revision 670dd8e248dc4705c92031c79d05a99559e35024)
+++ lams_tool_assessment/web/pages/authoring/parts/questionlist.jsp	(.../questionlist.jsp)	(revision 2f91c77f2441c84fd78199bd4e51f1028186bf8f)
@@ -34,8 +34,10 @@
 					//update all sequenceIds
 					for (var i = 0; i < sortable.el.rows.length; i++) {
 					 	var tr = sortable.el.rows[i];
-					 	var input = $("input[name^=sequenceId]", $(tr));
+					 	var input = $("input[name^=sequenceId]", tr);
 					 	input.val(i);
+					 	var displayOrder = $(".reference-display-order", tr);
+					 	displayOrder.text(i + 1 + ")");
 					}
 
 					//prepare SequenceIds parameter
@@ -85,7 +87,7 @@
 		<c:forEach var="questionReference" items="${sessionMap.questionReferences}" varStatus="status">
 			<c:set var="question" value="${questionReference.question}" />
 			<tr>
-				<td>
+				<td class="reference-display-order">
 					${status.count})
 				</td>
 				<td>
Index: lams_tool_scratchie/src/java/org/lamsfoundation/lams/tool/scratchie/ScratchieConstants.java
===================================================================
diff -u -re8a7110708b15579af2c6b31ac52a6da427fef6d -r2f91c77f2441c84fd78199bd4e51f1028186bf8f
--- lams_tool_scratchie/src/java/org/lamsfoundation/lams/tool/scratchie/ScratchieConstants.java	(.../ScratchieConstants.java)	(revision e8a7110708b15579af2c6b31ac52a6da427fef6d)
+++ lams_tool_scratchie/src/java/org/lamsfoundation/lams/tool/scratchie/ScratchieConstants.java	(.../ScratchieConstants.java)	(revision 2f91c77f2441c84fd78199bd4e51f1028186bf8f)
@@ -40,7 +40,7 @@
     public static final String ERROR = "error";
 
     public static final String DEFINE_LATER = "definelater";
-    
+
     public static final String WAIT_FOR_LEADER_TIME_LIMIT = "waitForLeaderTimeLimit";
 
     // for parameters' name
@@ -64,6 +64,8 @@
 
     public static final String PARAM_BURNING_QUESTION_UID = "burningQuestionUid";
 
+    public static final String PARAM_SEQUENCE_ID = "sequenceId";
+
     // for request attribute name
     public static final String ATTR_TOOL_CONTENT_ID = "toolContentID";
 
@@ -96,7 +98,7 @@
     public static final String ATTR_IS_SCRATCHING_FINISHED = "isScratchingFinished";
 
     public static final String ATTR_IS_WAITING_FOR_LEADER_TO_SUBMIT_NOTEBOOK = "isWaitingForLeaderToSubmitNotebook";
-    
+
     public static final String ATTR_WAITING_MESSAGE_KEY = "waitingMessageKey";
 
     public static final String ATTR_LEARNERS = "learners";
@@ -134,9 +136,9 @@
     public static final String ATTR_REFLECTION_ON = "reflectOn";
 
     public static final String ATTR_IS_BURNING_QUESTIONS_ENABLED = "isBurningQuestionsEnabled";
-    
+
     public static final String ATTR_IS_PRESET_MARKS_OVERWRITTEN = "isPresetMarksOverwritten";
-    
+
     public static final String ATTR_DEFAULT_PRESET_MARKS = "defaultPresetMarks";
 
     public static final String ATTR_REFLECTION_INSTRUCTION = "reflectInstructions";
@@ -158,27 +160,29 @@
     public static final String ATTR_GROUP_LEADER_USER_ID = "groupLeaderUserId";
 
     public static final String ATTR_IS_USER_LEADER = "isUserLeader";
-    
+
     public static final String ATTR_IS_TIME_LIMIT_ENABLED = "isTimeLimitEnabled";
-    
+
     public static final String ATTR_IS_TIME_LIMIT_NOT_LAUNCHED = "isTimeLimitNotLaunched";
-    
+
     public static final String ATTR_SECONDS_LEFT = "secondsLeft";
 
     public static final String ATTR_SUBMISSION_DEADLINE = "submissionDeadline";
     public static final String ATTR_SUBMISSION_DEADLINE_DATESTRING = "submissionDateString";
     public static final String ATTR_IS_SUBMISSION_DEADLINE_PASSED = "isSubmissionDeadlinePassed";
 
     public static final String ATTR_OPTION_UIDS = "optionUids";
-    
+
     public static final String ATTR_ACTIVITIES_PROVIDING_CONFIDENCE_LEVELS = "activitiesProvidingConfidenceLevels";
-    
+
     public static final String ATTR_ACTIVITIES_PROVIDING_VSA_ANSWERS = "activitiesProvidingVsaAnswers";
 
     public static final String LEARNER_MARK = "learner.mark";
 
     public static final String ERROR_MSG_REQUIRED_FIELDS_MISSING = "error.required.fields.missing";
     public static final String ERROR_MSG_ENTERED_MARKS_NOT_COMMA_SEPARATED_INTEGERS = "error.entered.marks.not.comma.separates";
-    
+
     public static final String ATTR_SHOW_RESULTS = "showResults";
+
+    public static final String ATTR_REFERENCES_SEQUENCE_IDS = "sequenceIds";
 }
Index: lams_tool_scratchie/src/java/org/lamsfoundation/lams/tool/scratchie/web/controller/AuthoringController.java
===================================================================
diff -u -re6dc4db4137cfd6b07a4aa79711b9d12b39fb78e -r2f91c77f2441c84fd78199bd4e51f1028186bf8f
--- lams_tool_scratchie/src/java/org/lamsfoundation/lams/tool/scratchie/web/controller/AuthoringController.java	(.../AuthoringController.java)	(revision e6dc4db4137cfd6b07a4aa79711b9d12b39fb78e)
+++ lams_tool_scratchie/src/java/org/lamsfoundation/lams/tool/scratchie/web/controller/AuthoringController.java	(.../AuthoringController.java)	(revision 2f91c77f2441c84fd78199bd4e51f1028186bf8f)
@@ -81,6 +81,7 @@
 import org.springframework.web.bind.annotation.RequestMethod;
 import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.bind.annotation.ResponseBody;
+import org.springframework.web.bind.annotation.ResponseStatus;
 
 import com.fasterxml.jackson.databind.node.JsonNodeFactory;
 import com.fasterxml.jackson.databind.node.ObjectNode;
@@ -588,61 +589,27 @@
     }
 
     /**
-     * Move up current item.
-     *
-     * @param mapping
-     * @param form
-     * @param request
-     * @param response
-     * @return
+     * Caches references order, along with this caches MaxMarks.
      */
-    @RequestMapping("/upItem")
-    private String upItem(HttpServletRequest request) {
-	return switchItem(request, true);
-    }
-
-    /**
-     * Move down current item.
-     *
-     * @param mapping
-     * @param form
-     * @param request
-     * @param response
-     * @return
-     */
-    @RequestMapping("/downItem")
-    private String downItem(HttpServletRequest request) {
-	return switchItem(request, false);
-    }
-
-    private String switchItem(HttpServletRequest request, boolean up) {
+    @RequestMapping("/cacheItemsOrder")
+    @ResponseStatus(HttpStatus.OK)
+    public void cacheItemsOrder(HttpServletRequest request) throws ServletException, IOException {
 	SessionMap<String, Object> sessionMap = getSessionMap(request);
 	SortedSet<ScratchieItem> itemList = getItemList(sessionMap);
 
-	int itemIndex = NumberUtils.toInt(request.getParameter(ScratchieConstants.PARAM_ITEM_INDEX), -1);
-	if (itemIndex != -1) {
-	    List<ScratchieItem> rList = new ArrayList<>(itemList);
+	//cache references' sequenceIds
+	Map<String, String> sequenceIdsParamMap = splitRequestParameter(request,
+		ScratchieConstants.ATTR_REFERENCES_SEQUENCE_IDS);
 
-	    // get current and the target item, and switch their sequnece
-	    ScratchieItem item = rList.get(itemIndex);
-	    ScratchieItem repOption;
-	    if (up) {
-		repOption = rList.get(--itemIndex);
-	    } else {
-		repOption = rList.get(++itemIndex);
-	    }
-
-	    int upSeqId = repOption.getDisplayOrder();
-	    repOption.setDisplayOrder(item.getDisplayOrder());
-	    item.setDisplayOrder(upSeqId);
-
-	    // put back list, it will be sorted again
-	    itemList.clear();
-	    itemList.addAll(rList);
+	Set<ScratchieItem> updatedItemList = new TreeSet<>(new ScratchieItemComparator());
+	for (ScratchieItem item : itemList) {
+	    String newSequenceId = sequenceIdsParamMap
+		    .get(ScratchieConstants.PARAM_SEQUENCE_ID + item.getDisplayOrder());
+	    item.setDisplayOrder(Integer.valueOf(newSequenceId));
+	    updatedItemList.add(item);
 	}
-
-	request.setAttribute(ScratchieConstants.ATTR_ITEM_LIST, itemList);
-	return "pages/authoring/parts/itemlist";
+	itemList.clear();
+	itemList.addAll(updatedItemList);
     }
 
     // ----------------------- Options functions ---------------
Index: lams_tool_scratchie/web/pages/authoring/basic.jsp
===================================================================
diff -u -r21555f88fd0c63a4a9eb3ae288a2e1d48452aa4b -r2f91c77f2441c84fd78199bd4e51f1028186bf8f
--- lams_tool_scratchie/web/pages/authoring/basic.jsp	(.../basic.jsp)	(revision 21555f88fd0c63a4a9eb3ae288a2e1d48452aa4b)
+++ lams_tool_scratchie/web/pages/authoring/basic.jsp	(.../basic.jsp)	(revision 2f91c77f2441c84fd78199bd4e51f1028186bf8f)
@@ -42,32 +42,7 @@
 			);
 		};
 	}
-	function upItem(idx){
-		var url = "<c:url value="/authoring/upItem.do"/>";
-		$(itemTargetDiv).load(
-			url,
-			{
-				itemIndex: idx,
-				sessionMapID: "${sessionMapID}"
-			},
-			function(){
-				refreshThickbox();
-			}
-		);
-	}
-	function downItem(idx){
-		var url = "<c:url value="/authoring/downItem.do"/>";
-		$(itemTargetDiv).load(
-			url,
-			{
-				itemIndex: idx,
-				sessionMapID: "${sessionMapID}"
-			},
-			function(){
-				refreshThickbox();
-			}
-		);
-	}
+
 	function initNewItemHref() {
 		var itemTypeDropdown = document.getElementById("item-type");
 		var itemType = itemTypeDropdown.value;
Index: lams_tool_scratchie/web/pages/authoring/parts/itemlist.jsp
===================================================================
diff -u -r98fb8bd4f3c36bbdcfe9b9445757f685d972cc02 -r2f91c77f2441c84fd78199bd4e51f1028186bf8f
--- lams_tool_scratchie/web/pages/authoring/parts/itemlist.jsp	(.../itemlist.jsp)	(revision 98fb8bd4f3c36bbdcfe9b9445757f685d972cc02)
+++ lams_tool_scratchie/web/pages/authoring/parts/itemlist.jsp	(.../itemlist.jsp)	(revision 2f91c77f2441c84fd78199bd4e51f1028186bf8f)
@@ -4,6 +4,7 @@
 <c:set var="isAuthoringRestricted" value="${mode == 'teacher'}" />
 
 <%@ page import="org.lamsfoundation.lams.qb.service.IQbService" %>
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/Sortable.js"></script>
 <script>
 	// Inform author whether the QB question was modified
 	var qbQuestionModified = ${empty qbQuestionModified ? 0 : qbQuestionModified},
@@ -22,6 +23,51 @@
 	if (qbMessage) {
 		alert(qbMessage);
 	}
+	
+$(document).ready(function(){
+		
+	    //init questions sorting
+	    <c:if test="${not empty sessionMap.itemList}">
+		    new Sortable($('#itemTable tbody')[0], {
+			    animation: 150,
+			    direction: 'vertical',
+				store: {
+					set: function (sortable) {
+						//update all sequenceIds
+						for (var i = 0; i < sortable.el.rows.length; i++) {
+						 	var tr = sortable.el.rows[i];
+						 	var input = $("input[name^=sequenceId]", tr);
+						 	input.val(i);
+						 	var displayOrder = $(".item-display-order", tr);
+						 	displayOrder.text(i + 1 + ")");
+						}
+	
+						//prepare SequenceIds parameter
+						var serializedSequenceIds = "";
+						$("[name^=sequenceId]").each(function() {
+							serializedSequenceIds += "&" + this.name + "="  + this.value;
+						});
+	
+						$.ajax({ 
+						    url: '<c:url value="/authoring/cacheItemsOrder.do"/>',
+							type: 'POST',
+							data: {
+								sessionMapID: "${sessionMapID}",
+								sequenceIds: serializedSequenceIds
+							}
+						});
+	
+						//update names
+						$("[name^=sequenceId]").each(function() {
+							var newSequenceId = this.value;
+							//update name of the hidden input
+							this.name = "sequenceId" + newSequenceId;
+						});
+					}
+				}
+			});
+		</c:if>
+	});
 </script>
 
 <!-- Dropdown menu for choosing a question from question bank -->
@@ -36,13 +82,15 @@
 	</div>
 	<input type="hidden" name="itemCount" id="itemCount" value="${fn:length(sessionMap.itemList)}">
 		
-	<table class="table table-condensed table-striped">
+	<table id="itemTable" class="table table-condensed table-striped">
 		<c:forEach var="item" items="${sessionMap.itemList}" varStatus="status">
 			<tr>
-				<td style="width:5%">
+				<td style="width:5%" class="item-display-order">
 					${status.count})
 				</td>
 				<td style="padding-top:15px; padding-bottom:15px;">
+					<input type="hidden" name="sequenceId${item.displayOrder}" value="${status.index}" class="item-sequence-id">
+					
 					<c:out value="${item.qbQuestion.name}" escapeXml="true"/>
 					
 				    <span class='pull-right alert-info btn-xs loffset5 roffset5'>
@@ -60,18 +108,6 @@
 						</c:choose>
 	       			</span>
 				</td>
-				
-				<c:if test="${!isAuthoringRestricted}">
-					<td class="arrows" style="width:5%">
-						<c:if test="${not status.first}">
-							<lams:Arrow state="up" title="<fmt:message key='label.authoring.basic.up'/>" onclick="return upItem(${status.index})"/>
-						</c:if>
-			
-						<c:if test="${not status.last}">
-							<lams:Arrow state="down" title="<fmt:message key='label.authoring.basic.down'/>" onclick="return downItem(${status.index})"/>
-						</c:if>
-					</td>
-				</c:if>
 					
 				<td align="center" style="width:5%">
 					<c:set var="editItemUrl" >