Build a responsive HTML quiz generator to make drag and drop quizzes with variable marks for partially correct answers

I would like to be able to generate HTML5 complian quizzes that allow students to drag and drop answers to the correct order. E.g. Ranke 1-5, options A-E - they would need to drag the correct response to the correct position (e.g. 1 = E, 2 = B, 3 = C, 4 = D, 5 = A). We need to be able to set partial marks for incorrect answers, with the mark scheme being different for each question based on how close the response is to the best option. E.g. if the best response for a question is EBCDA (1-5), they would get 4 marks for each part that was in the perfect position, get 3 marks for each part that was just 1 position from the correct response, 2 marks if 2 positions away, 1 mark if 3 positions away, and 0 marks if 4 positions away. E.g. if E should be ranked 1st, they would get 4 marks if they ranked it 1st, 3 marks if they ranked it 2nd, 2 marks if they ranked it 3rd, 1 mark if they ranked it 4th, and 0 marks if they ranked it 5th. Needs to be responsive and work on all major browsers and mobile devices. Ideally we would like to be able to generate questions from a spreadsheet where we could enter the question, the answer options, the correct response and the marking. The layout of the screen on a computer should have the ranks on the left, and the options on the right (please see attached image).