1

SubversionViewing repository files

Use URLhttp://classes.cs.kent.edu/courses/cs49901-trac/svn/S2013to view S2013 at current revisionUse URL

http://classes.cs.kent.edu/courses/cs49901-trac/svn/?rev=1541 to view svn at revisions 1541

http://classes.cs.kent.edu/courses/cs49901-trac/wiki

2

Subversion Command Linesvn co http://classes.cs.kent.edu/courses/cs49901-trac/svn/S2013/you

Will make a subversion copy of your work area (currently empty)Manually add any files to that directory that you want to add to your work area.Use the svn add and commit to add the files to the svn. You should not use this directory for code development. Copy files into it only when you want to commit them.

3

Subversion Command Line

Examplesvn co http://classes.cs.kent.edu/courses/cs49901-trac/svn/S2013[ruttan@sauron tmp]$ lsS2013ls -a S2013. bames ckerstin dkelly mperkovi pedwards talrefai.. bmccue dcollins dprice ntietz rqureshi tfoxaalmahai ccolvin Debugger dsteinbe oasikogl .svn Webcd S2013; mkdir ruttansvn add ruttanA ruttansvn commit -m “added ruttan”Adding ruttanCommitted revision 1546.

http://classes.cs.kent.edu/courses/cs49901-trac/svn/S2013

4

Subversion Command Line

Example (continued)ls -a S2013. bames ckerstin dkelly mperkovi pedwards .svn Web.. bmccue dcollins dprice ntietz rqureshi talrefaiaalmahai ccolvin Debugger dsteinbe oasikogl ruttan tfoxsvn delete ruttanD ruttanls -a . bames ckerstin dkelly mperkovi pedwards .svn Web.. bmccue dcollins dprice ntietz rqureshi talrefaiaalmahai ccolvin Debugger dsteinbe oasikogl ruttan tfoxsvn commit -m “deleted ruttan”Deleting ruttanCommitted revision 1547.ls -a. bames ckerstin dkelly mperkovi pedwards talrefai.. bmccue dcollins dprice ntietz rqureshi tfoxaalmahai ccolvin Debugger dsteinbe oasikogl .svn Web

5

Subversion Command LineIf you want to add multiple files at one time: cp -R ../ruttan .ls -a ruttan. .. lecture01.odp lecture02.odp svn status | grep "^\?" | awk '{print $2}' | xargs svn addA ruttanA (bin) ruttan/lecture01.odpA (bin) ruttan/lecture02.odpsvn commit -m “”Adding ruttanAdding (bin) ruttan/lecture01.odpAdding (bin) ruttan/lecture02.odpTransmitting file data ..Committed revision 1548.svn delete ruttanD ruttan/lecture01.odpD ruttan/lecture02.odpD ruttansvn commit -m “no change”Deleting ruttanCommitted revision 1549.

6

Subversion IssuesIf you delete files using the operating system and not svn you will likely not be able to update that image directoryTo fix a broken image:

check out the image again in a different spotDelete files in the new image using SVN that are were delete from the old image.Copy files from the old image that do not appear in the new. Do not copy .svn files from the old image.Use svn add and commit to update the repository.

7

TortoiseSVN and Trac

TortoiseSVN is a Subversion tool that works on Windows. Use svn add, delete and commit as in the command line version.Trac is the project wiki. Project Tickets and Milestones set there.

8

capstone-s13.cs.kent.eduAll have account on this machineLog in and go to /var/wwwPoint browser at capstone-s12.cs.kent.eduLook at code in html and cgi-bin

C++Final Presentation

Topics• Splash Page• Sandbox• Backend• Parser• Code Generation• User Interface (Instructor,Account,

Student)• Documentation

Splash Page

• Login to web applicationo User logs in with email and passwordo A php session is created for that user

• Create an accounto A user can create a new account by inputting

their email, password, first name, and last name.

o Passwords are hashed using bcrypt

Sandbox

• Drag'n'Drop zone• AJAX control panel• output box• Line highlighting• Variable box updates

Sandbox . Drag ' n ' Drop

• HTML Element Based• Javascript enabled

//setup the listeners on the page to be used for drag'n'dropvar dropZone = document.getElementById('drop_zone');dropZone.addEventListener('dragover', handleDragOver, false);dropZone.addEventListener('drop', handleFileSelect, false);

//This function handles the file that is dropped in the boxfunction handleFileSelect(evt) { evt.stopPropagation(); //to stop browsers' default action evt.preventDefault(); //to stop browsers' default action var files = evt.dataTransfer.files; // FileList object.

for (var i = 0, f; f = files[i]; i++) { var r = new FileReader(); r.onload = function(e){ document.getElementById('userCode').value = e.target.result; } r.readAsText(f); }}

Sandbox . AJAX control panel

• AJAX call to CGI scripts for execution• Run activates after compile

o Javascript monitors keypresso Forces compiling upon changes

• Simple debugger control

Sandbox . Output box

• Contains messages from backend• Gives simplified version of debugger

output

• Acts as if it's a modified stdout

Sandbox . Line Highlighting• Small jQuery code adds divs with line #'s to

textarea

• tweaked Javascript to allow for highlightingo Made CSS class to show highlighted lineo Changed the HTML class/id of divs to show current line

• Client side parsing of gdb output calls function below, passes in the line number

Sandbox . Variable Box

• Box to show program variables and values

• Updates based upon Next and Step buttono gdb output is parsed on backendo JSON object returned with variables:values

• Basic HTML tableo innerHTML replaced any time a button is pressed

Backend Components

• backendServer.pyo srvThread

• gdbthinclient.cgi• gdbwrapper.py

o asyncRead.py

• genCPP.cgi• runprog.cgi

Backend . backendServer.py• Multithreaded socket server• receives requests from gdbthinclient over socket• spawns new thread of srvThread class for each

connection

• srvThread class communicates with gdb instance through gdbwrapper.py

Web

Request

backendServer.pyRequest

srvThread

srvThread

Backend . gdbthinclient.cgi

• cgi script called when button is pressed on Sandbox.php

• Button press corresponds to command sent to backendServer.py and from there to gdb

• returns results of gdb command in JSON object via AJAX

Web

gdbthinclient.cgi

backendServer.py

Backend . gdbwrapper.py• Wraps gdb to provide communication between

front end website and gdb instance

• Sends commands to gdb and reads output• Utilizes asynchronous I/O through the

asynchRead class to read the output

backendServer.py

asyncRead.py

gdb

gdbwrapper.py

Backend . genCPP.cgi• Simple script to generate the C++ file• Takes code from HTML textarea, writes to file

named /temp/prog_user.cpp• Calls g++ command on file, saves executable

name /temp/compiledfrompython_user• Uses pipe and JSON to send return output

Backend . runprog.cgi• Similar to genCPP.cgi, calls command

to simply execute the file• Runs file based on username

o ex [ ./ compiledfrompython_csmith1 ]

• Only active after Compile is pressed (or no changes)

Parser

• Pull XML from databaseo MySQLdbo save XML in temp directory on server

• Pull information out of XMLo stores information in list objectso search objects based on 'rbid' attribute

Code Generation

• ElementTree• Trace XML

o build order of calls

• each element has logic for generating codeo ex) var, else, functioncall

User Interface

• Studento For the student to answer assignments

• Instructoro For the instructor to manage assignments,

courses, and questions

• Accounto For the user to change account settings

User Interface .Account • The user can change the password

o Must enter existing passwordo Must enter the new password twice

• The user can change their nameo First and last name

• The user can change logino Must be unique

User Interface .Instructor

• Courses can be added,edited and deleted

• Assignments can be added,edited and deleted

• Questions can be added,edited and deleted

Python Projectwww.cs.kent.edu/~ruttan/capstone/lectures/pythonhttp://www.cs.kent.edu/~ruttan/capstone/lectures/python/capstone/UserCode/http://www.cs.kent.edu/~ruttan/capstone/lectures/python/capstone/UserCode/PythonFileBuilder.py

http://www.cs.kent.edu/~ruttan/capstone/lectures/pythonhttp://www.cs.kent.edu/~ruttan/capstone/lectures/python/capstone/UserCode/http://www.cs.kent.edu/~ruttan/capstone/lectures/python/capstone/UserCode/PythonFileBuilder.py

Slide 1Slide 2Slide 3Slide 4Slide 5Slide 6Slide 7Slide 8Slide 9TopicsSplash PageSandboxSandbox . Drag ' n ' DropSandbox . AJAX control panelSandbox . Output boxSandbox . Line HighlightingSandbox . Variable BoxBackend ComponentsBackend . backendServer.pyBackend . gdbthinclient.cgiBackend . gdbwrapper.pyBackend . genCPP.cgiBackend . runprog.cgiParserCode GenerationUser InterfaceUser Interface .AccountUser Interface .InstructorSlide 29