1. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. Pronq IDE – Collaboration Code Review Technion Project

2. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. 2 Pronq IDE Product description Web-based IDE for developing web applications Currently supports java-script only Powered by Eclipse Orion editor Advantages over other web-based IDEs Source files are stored on client-side (in-browser storage) Better performance (and lighter server) Full privacy Fully extensible For more details – read ‘CodeAnywhere: Web IDE – The next generation’

3. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. 3 Technologies Must – java script (Java Script – the good parts book) including deferred+promises – html - http://www.w3schools.com/html/default.asphttp://www.w3schools.com/html/default.asp – require.js - http://requirejs.org/docs/start.htmlhttp://requirejs.org/docs/start.html – node.js - http://nodejs.org/api/ (REST API, socket.io)http://nodejs.org/api/ Choose – jquery - http://www.w3schools.com/jquery/http://www.w3schools.com/jquery/ – angular.js (Angular JS book) Choose – git - http://git-scm.com/abouthttp://git-scm.com/about – svn - http://subversion.tigris.org/http://subversion.tigris.org/ Optional – html5 - http://www.isoc.org.il/openacademy/html5/http://www.isoc.org.il/openacademy/html5/ – css - http://www.w3schools.com/css/default.asphttp://www.w3schools.com/css/default.asp – less - http://lesscss.org/http://lesscss.org/

4. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. 4 Architecture High level Single page application All business logic resides in the client-side (expect for certain use-cases) Each js file is a require.js module Extension loader – loads all extensions Most of the rest are extensions

5. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. 5 Extensibility Extension Everything is extension (extendable, replaceable) Extension is a set of modules (described in config.js file) Each module is a require.js module and may contribute one service Each module may depend on other modules (either of the same extension or others’) that are available via dependency injection A module life-cycle has two phases – init – collect information from other modules, contributes information to other moduels – start – expose/present the information

6. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. 6 Core Extensions Layout Service Responsible for managing all panes and sub panes (tabs) Provides the API for adding new sub panes Project Service Responsible for managing all projects and project files Provides the API for adding, getting and removing files to/from the project Editors Service Responsible for managing all open editors Provides the API for opening/closing an editor Provides the API for manipulation of editor contents

7. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. 7 Project Goals Collaboration Integrated offline code review system to the IDE Developer should be able to request code review – Select the changes – Select the code reviewer – Send the request Backend server gets the request and routes it to the code reviewer (push with socket.io)

8. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. 8 Project Goals Collaboration – cont. Backend server gets the request and routes it to the code reviewer (push with socket.io) Code reviewer gets the notification and opens the code review dedicated view – File tree shows the changed files – Contents is taken from the base line (where the changes are made upon) + the diff – Changes should be presented according to the change type (add line, remove, etc.) – Navigation between changes – Adding comments, approving or disabling a change Send back the review to the developer Checking all changes in the shared code-base

9. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. 9 Code Review 1 Introduce changes Select code reviewer Send 2 Push notification 3 Get notification Open code review view Review and send back

10. © Copyright 2012 Hewlett-Packard Development Company, L.P. The information contained herein is subject to change without notice. Thank you