Document that explains the chosen concept to the

Document that explains the chosen concept to the animator 1

Merge Sort Course Name: Design and analysis of algorithm Level: UG. Authors: - Praveen Pal Mentor: - Aruna Adil 2

Learning Objectives After interacting with this Learning Object, the learner will be able to explain. 1. How merge –sort works. 2. Advantage of merge sort over other sorting algorithm. 3

Definitions of the components/Keywords: 1 2 3 Merge sort is an O(n log n) Comparison-based sorting algorithm based on the divide & conquer algorithm paradigm. It was developed by ‘john von Neumann’ in 1945. This animation gives a brief idea about merge sort algorithm that split the item to be sorted into two group. Merge sort uses recursion(a function calling itself called recursion) principal. Divide: - If the given sequence of values (array) A has two or more element then divide the array into sub-array a 1, a 2, a 3, …. . , an. Recursion The nested repetition of identical algorithm is recursion. Solve the sub-arrays a 1, a 2, a 3, ………. an. Conquer: Finally combine the sub-array solution. 4 This algorithm is capable to sort large number of input very fast. Number of input is not a concern in merge-sort. • The only disadvantage of merge sort is that it take extra space to sort an array. 5 4

1 2 Definitions of the components/Keywords: Process of merge sort is done in three main steps. 1: If a given array A has 0 or one element, simply return otherwise split A[p---r] into A[p---q] & A[q+1 ----r] , each containing half of the elements of A[p---r] , here q is the halfway point of array A and p & q are the first & last point respectively. Array A 3 4 5 Array A p p r q q+1 r 2: conquer by recursively sorting the two sub-arrays A[p –q] & A[q+1 --- r]. 3: Combine the element back in A[p --r] by merging the two subarrays A[p –q] & A[p – r]. 5

INSTRUCTIONS SLIDE 1 2 Master layout or diagram • Make a schematic diagram of the concept • Explain to the animator about the beginning and ending of the process. • Draw image big enough for explaining. 3 4 5 • In above image, identify and label different components of the process/phenomenon. (These are like characters in a fi lm) • Illustrate the basic flow of action by using arrows. Use BOLD lines in the diagram, (minimum 2 pts. ) • In the slide after that, provide the definitions of ALL the labels used in the diagram 6

IMPORTANT NOTE TO THE ANIMATOR: • All the instructions/labels or anything WRITTEN in blue are CONTENT NOT TO BE DISPLAYED! • All the instructions WRITTEN in black are CONTENT TO BE DISPLAYED! • This is not applicable for images as there can be overlapping of these colours there. This should be followed for all the instructions, labels, etc… Kindly keep a note of this while displaying text in the animation. 7

INSTRUCTIONS SLIDE Components 1 Index 2 0 1 1 2 2 3 3 4 4 5 5 6 6 7 7 8 8 9 9 10 3 Array or list 4 Note: 1: All digit written in white letter in the sender are “element” or “value at index n “(n refers to index number ex. value at index 4 = 5). . 5 8

Master Layout Merge Sort Status: - All steps will display here 0 1 2 14 13 21 3 5 4 5 6 32 6 3 7 2 Put the Start, Pause, Stop, Step, reset , Think button to control animation. Put a slidebar to control the speed of animation. Put a “let me try” button When “Think” is pressed, the applet will run with a time delay so that user can think about the next step. When “Step” button is pressed, the applet will start, but will stop after every step until the step button is pressed. When “let me try ” button is pressed then array will display (slide 39 40)and user have to click to pick the correct partition index and to swap value user click on both value which he/she want to swap. The status bar will be removed in “let me try” mode. Note : Animators are free to change the color and graphics to make animation more effective. Project OSCAR IDD Template 4. 7 9

1 2 3 4 5 Explain the process In this step, use an example to explain the concept. It can be an analogy, a scenario, or an action which explains this concept/process/topic Try to use examples from day-to-day life to make it more clear You have to describe what steps the animator should take to make your concept come alive as a series of moving images. Keep the examples simple to understand, and also to illustrate/animate. 10

1 2 3 4 Stepwise description of process The goal of the document is to provide instructions to an animator who is not a expert. You have to describe what steps the animator should take to make your concept come alive as a moving visualization. Use one slide per step. This will ensure clarity of the explanation. Add a image of the step in the box, and the details in the table below the box. You can use any images for reference, but mention about it's copyright status The animator will have to re-draw / re-create the drawings Add more slides as per the requirement of the animation 5 11

Step 2: Partition steps Refer to slide 15 - 36 NOTE : - This is a whole process described for the animators, how merge sort works. 1: User click on start to start animation. Update the status box. 2: Split the given array A into approx two equal sub array a 1 & a 2 by using formula Q = FLOOR([P+R]/2) here P is the index of first element. Q is the index of middle element. R is the index of last element. NOTE: FLOOR represent the lower value, if after division quotient is float value then consider the lower value ex. Floor(9/2) = 4 not 4. 5 NOTE: - we can also take ceiling value but here we are consider only floor value. 3: In these two sub-arrays first (say ‘left sub-array’) sub-array a 1 contains elements from ‘P’ to ‘Q’ and second (say ‘right sub-array’) sub-array a 2 contains element from ‘Q+1’ to ‘R’. 4: Apply the same procedure (step 2 & 3) of partitioning the sub-array a 1 & a 2 recursively until no further partition is possible. That means there is a single element in each array. 12

Step 2: Merge steps Refer to slide 15 - 36. 5: The main feature of merge sort is merging step. This step take two sorted sequences and merge them into one sorted sequence. 6 • Merge-sort is a sorting algorithm that requires an additional temporary array of the same size as the original one. • it needs O(n) additional space, where n is the array size: 7: Now merge each sub-array pair(shown in next slide) into a temporary array of same size as the original one. a: When two sub-array a 1 & a 2 contains single element then compare each pair and merge in a new array in a sorted sequence. b: when two sub-array ‘a 1’ & ‘a 2’contain more then one element then take the first element of sub-array a 1 and compare it with all element of a 2 and copy the smaller of two to temp array M, increment the index of array whose element was copied also increment the temp array by one. and again start with the new selected index and compare with other elements in second array. Do this process of selecting and comparing until all element of a 1 & a 2 merge in a sorted sequence in a single array M. 13

1 Step 1: Partitioning P 2 R 0 1 2 3 4 5 6 14 13 21 5 32 6 3 7 2 3 4 Instruction for the animator • Display array with it’s value and index. • Find the mid point of array. Text to be displayed in the working area (DT) • Split the given array into approx two equal sub-array. mid-point q = floor[(p+q )/2] • P is the first index and r is the last index. 5 • Divide the array in two part from mid-point (q).

1 Step 1: Partitioning P 2 Q 0 1 2 14 13 21 3 5 R 4 5 6 7 32 6 3 2 3 Represent unsorted array or sub-array 4 5 Represent sorted array or sub-array Instruction for the animator Text to be displayed in the working area (DT) • Divide the array from mid point (3). • Left part contains values from p to q. • left of mid point contain values from start (index 0) to mid point. • Right part contains values from q+1 to r. • Right of mid point contain value from mid point + 1 to last element (7). • Q =floor[ (0+7)/2 ]= 3 • Split left part of array ([0] to [7]) at index q.

1 Step 1: 0 1 2 3 4 5 6 14 13 Q 21 5 32 6 3 P 2 partition 0 14 1 13 7 2 R 2 21 3 5 3 Represent unsorted array or sub-array 4 5 Represent sorted array or sub-array Instruction for the animator Text to be displayed in the working area (DT) • First apply the process of partition on left side array when single element remain at the left side then partition right side array. • Split left part of array ([0] to [3]) at index q. • Again split this left array in two part. • Again split the left sub-array. • Q =floor[ (0+3)/2 ]= 1

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 2 14 13 21 0 14 7 2 3 5 1 13 Represent unsorted array or sub-array 4 5 Represent sorted array or sub-array Instruction for the animator Text to be displayed in the working area (DT) • First apply the process of partition on left side array when single element remain at the left side then partition right side array. • Split left part of array ([0] to [1]) at index q. • Again split this left array in two part. • Again split the left sub-array. • Q = floor[(0 +1)/2] = 0

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 2 14 13 21 0 14 7 2 3 5 1 13 0 14 Represent unsorted array or sub-array 4 5 Represent sorted array or sub-array Instruction for the animator Text to be displayed in the working area (DT) • There is a single element in the array so no need to sort it change the color of 14. • Now no further partition is possible. because there is a single element in array. • Now partition the right sub array. • split right sub-array.

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 2 14 13 21 0 14 7 2 3 5 1 13 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • Now both left and right sub array contain single element. • Sort and merge these sub array pair in a new array of size equal to size of both sub array. 5 Text to be displayed in the working area (DT) • sort and merge sub-array pair. • Here two sub-array contains single element (14 & 13). • Compare values of these pair and merge in a new array in a sorted sequence. (Next slide)

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 2 14 13 21 0 13 0 14 7 2 3 5 1 14 1 13 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • Remove the array which have sorted and merged. 5 Text to be displayed in the working area (DT) • split right sub-array.

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 14 13 0 14 1 14 2 7 2 3 21 2 21 5 3 5 1 13 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • Apply same process of partition on both left & right array. 5 • First sort left array until it reaches to a position where no further partition is possible ie. There is only a single element in array. Text to be displayed in the working area (DT) • Split right part of array ([2] to [3]) at index q. • Q = floor[(2+3)/2] = 2 • Split from index 2.

1 2 3 4 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 14 13 0 14 2 1 13 2 21 5 3 5 2 21 Represent unsorted array or sub-array Represent sorted array or sub-array Instruction for the animator • Apply same process of partition on both left & right array. 5 2 3 21 1 14 7 • First sort left array recursively until it reaches to a position where no further partition is possible ie. There is only a single element in array. Text to be displayed in the working area (DT) • Split right part of right sub-array.

1 2 3 4 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 14 13 0 14 1 13 2 7 2 3 21 2 21 5 3 5 2 3 21 5 Represent unsorted array or sub-array Represent sorted array or sub-array Instruction for the animator Text to be displayed in the working area (DT) • sort and merge sub-array pair. • Here two sub-array contains single element (21 & 5). • Compare values of these pair and merge in a new array in a sorted sequence. (Next slide) 5

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 14 13 0 14 2 7 2 3 21 5 1 14 2 3 5 21 1 13 2 21 3 5 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • Sort and merge these sub array pair in a new array of size equal to size of both sub array. 5 • Note: - next slide shows the process of comparison and sorting. Process is shown only for one pair same process is apply for all the pairs. Text to be displayed in the working area (DT) • Sort and merge sub array pair. • Note: - Sorting process is shown in the next slide apply same process for all the pair

Sorting • Here process shows how comparison and sorting is done , same process will apply for all the remaining pair. • Compare values of left sub-array with the values of right sub arrays and find the smallest element and place this smallest element in a new sorted array. • Continuously Find the smallest value from array pairs and place in a new array until both sub-array merge in a single array in a sorted sequence. A 0 13 B 1 14 2 5 3 21 Compare 13 & 5 : - 0 1 14 2 1 2 3 5<13 so put 5 in the merged, sorted array. B A 0 13 Merged Sorted Array 3 21 0 5 1 2 3 25

Compare 13 & 21 : A 0 13<21 so put 13 in the merged, sorted array. Merged Sorted Array B 1 14 2 3 21 Compare 14 & 21 : - 0 A 1 0 5 2 3 14<21 so put 14 in the merged, sorted array. Merged Sorted Array B 2 1 13 3 21 0 5 1 13 2 14 3 There is only single element remain so no comparison is required so put it in merged sorted array. 0 A B 1 2 Merged Sorted Array 3 0 5 1 13 Apply same process for all the pair 2 14 3 21 26

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 5 13 0 14 2 7 2 3 14 21 1 14 2 3 5 21 1 13 2 21 3 5 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • Split the right sub array. • apply the same process as we applied on the left side 5 Text to be displayed in the working area (DT) • Split the right sub array.

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 7 5 13 14 21 32 3 2 14 5 21 13 14 2 6 7 2 5 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • apply the same process as we applied on the left side 5 Text to be displayed in the working area (DT) • Split right part of array ([4] to [7]) at index q. • Q = floor [(4+7)/2] = 5

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 5 13 21 32 6 4 5 32 6 13 14 2 14 14 5 13 21 21 3 7 2 5 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • apply the same process as we applied on the left side 5 Text to be displayed in the working area (DT) • Split left part of array ([4] to [5]) at index q. • Q = floor [(4 +5)/2] = 4

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 5 13 21 32 6 4 5 32 6 13 14 14 13 2 14 5 21 21 5 3 7 2 4 32 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • apply the same process as we applied on the left side Text to be displayed in the working area (DT) • Now no further partition is possible. because there is a single element in array. • split right sub-array. 5

1 2 3 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 5 13 21 32 6 4 5 32 6 13 14 14 13 2 14 5 21 21 5 4 32 3 7 2 5 6 Represent unsorted array or sub-array 4 Represent sorted array or sub-array Instruction for the animator • apply the same process as we applied on the left side Text to be displayed in the working area (DT) • Now no further partition is possible. because there is a single element in array. • split right array. 5

1 2 3 4 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 5 13 21 32 6 4 5 6 32 13 14 2 14 14 5 13 21 Instruction for the animator • apply the same process as we applied on the left side 5 21 5 32 3 7 2 6 Text to be displayed in the working area (DT) • Sort and merge sub array pair. • Split Right sub-array.

1 2 3 4 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 5 13 21 32 6 4 5 6 7 6 32 3 2 13 14 2 14 14 5 13 21 Instruction for the animator • apply the same process as we applied on the left side 5 21 5 32 3 7 2 6 Text to be displayed in the working area (DT) • Split right part of array ([6] to [7]) at index q. • Q =floor[ (6+7)/2] = 6

1 2 3 4 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 5 13 21 32 6 4 5 6 7 6 32 3 2 13 14 14 13 2 14 5 21 Instruction for the animator • apply the same process as we applied on the left side 5 21 5 32 3 6 7 2 6 3 Text to be displayed in the working area (DT) • Split right sub array

1 2 3 4 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 5 13 21 32 6 4 5 6 7 6 32 3 2 13 14 14 13 2 14 5 21 Instruction for the animator • apply the same process as we applied on the left side 5 21 5 32 3 6 7 2 6 3 7 2 Text to be displayed in the working area (DT) • Sort and merge sub array pair.

1 2 3 4 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 3 4 5 6 5 13 21 32 6 4 5 6 7 6 32 2 3 13 14 14 13 2 14 5 21 Instruction for the animator • apply the same process as we applied on the left side 5 21 5 32 3 6 7 2 6 3 7 2 Text to be displayed in the working area (DT) • Sort and merge sub array pair.

1 2 3 4 Step 1: partition 0 1 2 3 4 5 6 14 13 21 5 32 6 3 0 1 4 5 6 5 13 13 14 21 14 5 21 13 21 Instruction for the animator • apply the same process as we applied on the left side 5 5 2 6 32 32 6 7 2 7 32 2 3 3 2 Text to be displayed in the working area (DT) • Sort and merge sub array pair.

1 Step 1: 0 2 2 3 4 partition 1 3 0 1 5 13 13 14 2 3 4 5 6 2 5 6 13 14 21 4 5 6 3 14 21 14 5 21 13 21 Instruction for the animator • apply the same process as we applied on the left side 5 2 6 6 32 32 6 32 7 32 2 3 3 2 Text to be displayed in the working area (DT) • Sort and merge sub array pair. • Sorting complete. 5 3 7

1 2 Interactivity and Boundary limits In this section, you will add the ‘Interactivity’ options to the animation. Use the template in the next slide to give the details. 3 Insert the image of the step/s (explained earlier in the Section 3) in the box, and provide the details in the table below. 4 The details of Interactivity could be: Types: Drop down, Slider bar, Data inputs etc. Options: Select one, Multiple selections etc Boundary Limits: Values of the parameters, which won’t show results after a particular point Results: Explain the effect of the interaction in this column 5 Add more slides if necessary 39

Slide 4 Introduction Slide 4 Definitions Slide 40 - 44 Analogy Slide 45 Want to know more… Test your understanding Lets Sum up (summary) (Further Reading) (questionnaire) Interactivity: Array Size : Values : : In the input box the user will input all the numerical values that he/she wants to sort. Display array of size entered above as input , with it’s index and values. Try it yourself • Place an input box to enter the size of array not more than 15. • Place an another input box to enter values to be sorted of size specified in above input box. . • Place an enter button to enter the value. • After entering the selected values, master layout 1 procedure is to be done Allow values to be entered one by one. 40 Credits

1 2 Step 1: partitioning 0 68 1 75 2 3 89 37 4 5 6 84 72 82 3 4 5 Instruction for the animator Text to be displayed in the working area (DT) • If user click on “let me try” button then display this array (step 1)and allow user to do all the task (partition & merge ). • NOTE: - Please follow the process which is described in the demo. • Give four chances to user to select correct answer after that correct the answer and move the user to next step. • If user click on 37 then display “correct” otherwise “sorry you pick wrong element select next element”. • If user click four or more time right answer then give a greeting to user “very good you are going right” • Click on the element which split the array. • After selecting the correct element split the array from selected element.

1 Step 1: partitioning 0 68 1 75 2 3 89 37 4 5 6 84 72 82 2 3 4 5 Instruction for the animator • Record the correct and incorrect selection by user and display the progress report after the sorting done. display how many time user select correct answer and how many time it pick wrong. Text to be displayed in the working area (DT) • To change the position of element first click on source and then destination place to sort the array.

INSTRUCTIONS SLIDE Self- Assessment Questionnaire for Learners • Please provide a set of questions that a user can answer based on the LO. They can be of the following types: – These questions should be 5 in number and can be of objective type (like MCQ, Match the columns, Yes or No, Sequencing, Odd One Out). – The questions can also be open-ended. The user would be asked to think about the question. The author is requested to provide hints if possible, but a full answer is not necessary. – One can include questions, for which the user will need to interact with the LO (with certain parameters) in order to answer it. 43

INSTRUCTIONS SLIDE Questionnaire for users to test their understanding • Please make sure that the questions can be answered by interacting with the LO. It is better to avoid questions based purely on recall. 44

Question 1: What is true about merge sort? . Answers: 1. Merge sort is not an in-place sorting algorithm. 2. Due to recursion merge sort require dynamic memory. 3. Merge sort is a comparison based algorithm 4. All of the above Correct answer: all of the above Feedback/Justification to be displayed: • If user clicks correct answer then display ____ Correct ____ • If user clicks incorrect answer then display ____Incorrect 4 is correct answer_______. Project OSCAR IDD Template 4. 7 45

Question 2: Which of the following sorting algorithm has average case and worst case running time o(n log n)? Answers: 1. Quick sort. 2. Heap sort. 1. Merge sort. 2. 2 and 3. Correct answer: 4. Feedback/Justification to be displayed: • If user clicks correct answer then display ____ Correct ____ • If user clicks incorrect answer then display _____“Incorrect. 4 is correct answer”______. Project OSCAR IDD Template 4. 7 46

Question 3: Merge sort uses. Answers: 1. Divide and conquer approach. 2. Back tracking approach. 1. Heuristic approach. 2. Greedy approach. Correct answer: Divide and conquer strategy. Feedback/Justification to be displayed: • If user clicks correct answer then display ____ Correct ____ • If user clicks incorrect answer then display 1 is correct answer ____Incorrect. ______. Project OSCAR IDD Template 4. 7 47

Question 3: Which algorithm is not an in place sorting algorithm. Answers: 1. Insertion sort. 2. Selection sort. 1. Merge Sort. 2. Quick sort. Correct answer: Merge Sort. Feedback/Justification to be displayed: • If user clicks correct answer then display ____ Correct ____ • If user clicks incorrect answer then display 3 is correct answer ____Incorrect. ______. Project OSCAR IDD Template 4. 7 48

References Website links for further reading: http: //en. wikipedia. org/wiki/Merge_sort http: //algs 4. cs. princeton. edu/22 mergesort/ Books: • “Introduction to Algorithm” Thomas H. Coremen Project OSCAR IDD Template 4. 7 49