CO3098/CO7098 Coursework 3 Mini Web Project – Genealogy Explorer Important Dates: Handed out: 28-Nov-2018 Deadline: 11-Jan-2019 at 23:59 GMT The deadline is strict and will not be changed. Please ensure that you submit your work in time. • This coursework counts as 22% of your final mark. • Please read guidelines on plagiarism in the study guide and course documentation. • This coursework requires knowledge about REST Web Service, JSON, Bootstrap, AJAX and the Web MVC framework. • Learning outcome: ? Use a web MVC framework to create web applications. ? Demonstrate the understanding of technologies behind Web Service Coursework Description Your task is to develop the Genealogy Explorer (GE), an online tool for building a family tree and tracking ancestry. This piece of coursework consists of two parts – Part 1 (RESTful Service) and Part 2 (Web Interface). You will need to develop a RESTful web service back-end for searching and editing genealogy records, and to design a web interface for creating and browsing these data. You may start your work from Part 1 or Part 2 first as you wish. Java domain class templates and a SQL file is provided on Blackboard (see Appendix). You may choose to use them for implementation, and you are allowed to make any changes to them. Part 1: RESTful Web Service [40 marks] GE allows users to create and edit a family tree. Your tasks in Part 1 are to implement the following REST Web Service methods (a), (b), (c), (d) and (e). (a) Adding a person [10 marks] (1) GET /GE/person/add?key=3&name=RichardIII&dob=14830626&m=1&f=2&g=male Submit a GET request to this URI to add a person to the database. Parameter: key : the unique key of the person (*) name : full name of the person (*) m : the person’s mother’s key f : the person’s father’s key dob : the person’s date of birth (e.g. 19921210 – December 10th 1992) g : the person’s gender * Required fields (2) POST /GE/person/addJSON JSON request { "key": "1", "name": "RichardIII", "dob": "14830626", "g": "male" "m": "2", "f": "3" } Successful response in JSON {"result": "true"} Unsuccessful response in JSON { "result": "false", "message": "person id already exists (or m/f id does not exist)" } Add a new person to the database. This request returns true if the operation is successful, otherwise false is returned. (e.g. a person with the provided id already exists; one of the parent ids does not exist) Consider the following HTTP GET requests: GET /GE/person/add?key=1&name=King%20George%20VI GET /GE/person/add?key=2&name=Queen%20Elizabeth GET /GE/person/add?key=3&name=Queen%20Elizabeth%20II&m=2&f=1 GET /GE/person/add?key=5&name=Prince%20Philip%20Duke%20of%20Edinburgh GET /GE/person/add?key=4&name=Princess%20Margaret&m=2&f=1 GET /GE/person/add?key=6&name=Prince%20Charles&m=3&f=5 GET /GE/person/add?key=7&name=Princess%20Diana GET /GE/person/add?key=8&name=Prince%20William&m=7&f=6 GET /GE/person/add?key=9&name=Prince%20Harry&m=7&f=6 GET /GE/person/add?key=10&name=Catherine%20Duchess%20of%20Cambridge GET /GE/person/add?key=11&name=Prince%20George&m=10&f=8 The family tree structure below will be created (Note that spaces in URLs are encoded as %20; optional arguments are omitted) Figure (1) Example – Royal Family Tree It is also possible to add multiple persons at the same time by posting a JSON array to addJSON. For example, the following JSON will add two people to the database: { "list":[ { "key":"12", "name":"Princess Charlotte", "dob":"20150502", "g":"female", "m":"10", "f":"8" }, { "key":"13", "name":"Prince Louis", "dob":"14830626", "g":"male", "m":"10", "f":"8" } ] } This request returns true if all people are added successfully, otherwise the operation is cancelled and false is returned. (b) Deleting a person [5 marks] GET /GE/person/delete/7 Delete a person with the given key (e.g. key=7) from the Genealogy database. The person's descendants should NOT be deleted from the family tree. The request should return true if the operation is successful, otherwise false is returned. For example, the above HTTP GET request should not delete key=8, 9, 10 or 11 in Figure (1). Successful response in JSON {"result": "true"} Unsuccessful response in JSON { "result": "false", "message": "key X does not exist" } (c) Getting information about a specific person [5 marks] GET /GE/person/get/12 Return the information about a person with the given key in JSON: Successful response in JSON { "key": "12", "name": "Princess Charlotte", "dob": "20150502", "g": "female", "m": "10", "f": "8" } Unsuccessful response in JSON { "result": "false", "message": "key X does not exist" } (d) Finding someone’s ancestors [10 marks] GET /GE/person/ancestors/6 Return the person’s direct-line ancestors (a direct-line ancestor is someone from whom you descend in a direct line – parent to child, grandparent, great-grandparent etc.) as a JSON object. Given the family tree in Figure 1, the GET request above should return all direct-line ancestors of the person (key=6) as a JSON object: { "key":"6", "parents":{ "m":{ "key":"3", "parents":{ "m":{ "key":"2" }, "f":{ "key":"1" } } }, "f":{ "key":"5" } } } Unsuccessful response in JSON { "result": "false", "message": "key X does not exist" } Note: You may include other attributes (e.g. name, gender etc) in the JSON response. (e) Finding someone’s descendants [10 marks] GET /GE/person/descendants/7 Return all of the person’s lineal descendants (a lineal descendant is a blood relative in the direct line of descent – the children, grandchildren, great-grandchildren, etc.) as a JSON object. Given the family tree in Figure (1), the GET request above should return all descendants of the person (key=7) as a JSON object: { "key":"7", "children":[ { "key":"8", "children":[ { "key":"11" } ] }, { "key":"9" } ] } Part 2: Web Interface [60 marks] Your task in Part 2 is to design and implement a web interface for creating and editing the Genealogy data. You may use any Web Frameworks (MVC, MVP or MVVM) for implementation, including but not limited to: • Spring MVC • ASP.NET MVC • Ruby On Rails • Laravel PHP • AngularJS • Django • Ember.js The architecture and good coding practice will also be taken into account when allocating marks. The mark for this piece of coursework will be capped at 65% if the solution does not use any web framework (Please consult with the convenor first if the framework you intend to use is not listed here). Your tasks in Part 2 are to implement a Web Interface for (f), (g) and (h) (f) Browsing genealogy records [20 marks] (g) Adding, deleting and editing persons from the family trees [20 marks] (h) Searching descendants and ancestors [20 marks] In addition to the functionality, the website responsiveness (page rendering on a variety of devices and window or screen sizes) will be taken into account when allocating marks. Marking Scheme & Rubrics Part 1: REST Service API testing process will be automated. Test cases will be provided for each REST controller method (a), (b), (c), (d), (e) to check whether methods are behaving as they are expected. Marks will be distributed according to test results. Part 2: N (0%) • No submission F (0-40%) • Front-end HTML page exists, but the program fails to load or display any genealogy data. No listing of records in a simple form (e.g. table). No front-end framework/CSS used. • An attempt was made but adding/deleting/editing functions are not functional. • Static web pages (or view) for searching descendants/ancestors exists but without any connection to the database. E (40-50%) • Basic HTML pages/view without any front-end framework/CSS; do not adopt a responsive design. • Listing of genealogy records in simple form, e.g. display all persons in a simple HTML table; formbased adding, deleting and editing feature developed, but still not functioning properly. • Static HTML page and server-side code for searching partially implemented, but there are still major issues. (e.g. failed to return any result, 500 internal server error) D (50-60%) • Adopt responsive web design in the development, but there are major issues. (e.g. cannot navigate the website through desktop/mobile) • Genealogy records are loaded and displayed in a static tree-like structure (e.g. HTML , and CSS); form-based adding, deleting and editing functions partially implemented; Use of JavaScript for client-side validation; • Search function linked to the database and works to a certain extent; sometimes, the page crashes or the results of searching are incorrect (e.g. does not include all descendants, wrong ancestor returned). C (60-70%) • The adoption of responsive web design, basic browser resizing and cross-device compatibility • Genealogy records show in a static or interactive tree-like structure; adding, deleting and editing functions are implemented. Ajax/jQuery is used in certain areas but limited, page reloading is still required. • Search results are mostly correct; results are displayed in HTML (e.g. tables, etc.). B (70-80%) • Genealogy records displayed as an interactive tree (e.g. GoJS genogram chart). • Ajax/jQuery is used in some core features so that the tree can be refreshed without reloading (users are able to make any change to the family tree directly without postback) • Search function invokes the RESTful service implemented in Part 1. • The searching function passed all test cases, and results are displayed in HTML with pagination. A (>80%) • Optimise website for mobile devices, supporting both the portrait and landscape view in a variety of mobile devices with different screen sizes. • Secure RESTful Service with OAuth2 Tokens. • Genealogy records are visualised as an interactive tree. • Ajax/jQuery is used appropriately in most features. • The searching function passed all test cases. • Search results can be visualised using an interactive chart. Overall Score How your score will be calculated: (Where p is the number of passed test cases, n is the total number of test cases, wi refers to the weight for each test case) Submission • Zip all files in a single zip file for submission: o Your Dynamic Web project or Gradle/Maven project folder o README.txt o Your SQL schema and data, if applicable (Your_email_ID.sql) • The archive should be named or (e.g. Note: Please contact the module convenor first if you choose to use .NET WCF or other frameworks for Part 1 and 2. You need to submit the zip file via Blackboard and you are allowed to re-submit as many times as you like before the deadline. Anonymous marking We operate an anonymous marking scheme. All submitted WAR files (or other project files) will be deployed to Tomcat using anonymous fingerprinting generated by SHA256. Appendix 1.1. You can use any CSS/JS library for showing the family tree. Here are some candidates: HTML/CSS Family Tree dTree.js (Static JS Tree) GoJS (Interactive Genogram chart) OAuth2 in Spring Pagination in Spring 1.2. Persistence Frameworks You may use GenealogyDB.sql provided on Blackboard, if you intend to write your own DAO classes in conjunction with some ORM frameworks such as Hibernate for data persistence. You do not have to use this file if you intend to use Spring JPA, NoSQL (e.g. Mongodb, Oracle Spatial Graph) or other persistence frameworks. 1.3 Domain classes You may use the Java domain classes provided for implementation. However, you may choose not to use them.

"Get 15% discount on your first 3 orders with us"
Use the following coupon

Order Now