ENHANCEMENT OF FACEBOOK FEATURES<br />                           BY: PARIN  SHAH<br />
FEATURES<br />PHOTO - EDITING APPLICATION <br />TEMPORARY ONE TIME PASSWORD TO ACCESS FACEBOOK ACCOUNT FROM PUBLIC MACHINE...
TOOLS	<br />MICROSOFT VISUAL STUDIO 2008<br />INTERNET INFORMATION SERVER (IIS)<br />AJAX CONTROL TOOLKIT<br />NEODYNAMIC ...
SELF DESIGNED MODULE<br />DESIGN PAGES OF  ALL MODULE.<br />FILE UPLOAD MODULE.<br />TEMPORARY PASSWORD GENERATOR AND SEND...
OPEN SOURCE MODULE BUT MODIFIED W.R.T.  APPLICATION<br />CALLOUT IMAGE<br />PHOTO-EDITING FUNCTIONALITIES LIKE   <br />   ...
ARCHITECTURAL STYLE<br />I have chosen the FOUR-TIER ARCHITECTURAL style for my project. <br />My project involves using t...
ARCHITECTURAL STYLE<br />     Presentation Client<br />     Presentation Layer<br />     Application Logic<br />       Sto...
Subsystem for photo-editor and applying various effects<br /> INTERFACE LAYER   :      <br />     (A) PRESENTATION CLIENT ...
Subsystem for photo-editor and applying various effects<br />
COMPONENT DIAGRAM<br />
COMPONENT DIAGRAM<br />
DEPLOYMENT DIAGRAM<br />
DEPLOYMENT DIAGRAM<br />
Access control matrix<br />Access control matrix for the photo album module, modifying the photos of the user, sending tem...
DESIGN PATTERNS<br />PROXY DESIGN PATTERN<br />FACADE PATTERN<br />MODEL VIEW CONTROLLER PATTERN<br />
 PROXY DESIGN PATTERN<br />Provide a surrogate or placeholder for another <br />   object to control access to it. <br />F...
PROXY DESIGN PATTERN<br />The classes  participating  in this pattern are: <br />Proxy Image<br /><ul><li>It maintains a r...
Proxy may refer to a Photo-Editor if the Real Image and Photo Editor interfaces are the same.
It provides an interface identical to real image so that a proxy can be substituted for it.
Moreover it controls access to the real image.</li></ul>Photo-Editor<br /><ul><li>This class defines the common interface ...
It reduce dependencies of outside code on the inner workings of a library and allows more flexibility in developing the sy...
It wraps a collection of various APIs like Facebook API, Image Draw API with a single well-designed API for our applicatio...
MODEL VIEW CONTROLLER PATTERN<br />*The model manages the behavior and data of the application domain, responds   <br />  ...
MODEL VIEW CONTROLLER PATTERN<br />In the model view controller pattern we have the business logic separated from the view...
MODEL VIEW CONTROLLER PATTERN<br />
MODEL TRANSFORMATION<br />
Interface specification <br /><ul><li> This class deals with the functionality of the photo-editing features like </li></u...
Mapping contracts to exception<br />context Photo_Editor:crop_image(x,y) pre:<br />user.photo.album.photo.viewOnCanvastru...
Mapping contracts to exception<br />contextPhoto_Editorinv: <br />photos_editor->forAll( Img:Image | Img.load(true) and Im...
Interface specification <br />By use of this class the user’s request for temporary password would be fulfilled. <br />Con...
Mapping contracts to exception<br />contextMobileMessaging : generateRandomPwd():String pre:<br />isIdentity->true<br />	c...
MAPPING OBJECT MODELS T0 A PERSISTENT STORAGE SCHEMA<br />A Schema is a description of the data, that is, a meta model for...
MAPPING CLASS AND ATTRIBUTES<br />
optimizing THE OBJECT MODEL - Delaying Expensive Computations<br /><ul><li> By this pattern an ImageProxy object takes pla...
RATIONALE MANAGEMENT<br />can be by use of		can be by use of<br />  			fails to perform	meets this criteria and improves p...
RATIONALE MANAGEMENT<br />       fails 		meets	<br />Photo Display?: Issue<br />Simple Controls : Proposal<br />AJAX Contr...
screenshots<br />
Upcoming SlideShare
Loading in...5
×

Enhancement Of Facebook Features

574

Published on

Published in: Technology, Art & Photos
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
574
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Enhancement Of Facebook Features"

  1. 1. ENHANCEMENT OF FACEBOOK FEATURES<br /> BY: PARIN SHAH<br />
  2. 2. FEATURES<br />PHOTO - EDITING APPLICATION <br />TEMPORARY ONE TIME PASSWORD TO ACCESS FACEBOOK ACCOUNT FROM PUBLIC MACHINE<br />APPLYING WATERMARK EFFECT TO THE PHOTOS.<br />PHOTO VIEWING APPLICATION.<br />
  3. 3. TOOLS <br />MICROSOFT VISUAL STUDIO 2008<br />INTERNET INFORMATION SERVER (IIS)<br />AJAX CONTROL TOOLKIT<br />NEODYNAMIC IMAGEDRAW TOOLKIT<br />.NET FRAMEWORK 3.5<br />FACEBOOK API<br />
  4. 4. SELF DESIGNED MODULE<br />DESIGN PAGES OF ALL MODULE.<br />FILE UPLOAD MODULE.<br />TEMPORARY PASSWORD GENERATOR AND SENDING THE PASSWORD TO USER.<br />PHOTO VIEWER, PHOTO SLIDESHOW.<br />PHOTO EDITING FUNCTIONS LIKE SHARPEN,EMBOSS.<br />PHOTO COLLAGE<br />
  5. 5. OPEN SOURCE MODULE BUT MODIFIED W.R.T. APPLICATION<br />CALLOUT IMAGE<br />PHOTO-EDITING FUNCTIONALITIES LIKE <br /> 1.) ADJUSTING SATURATION, HUE, BRIGHTNESS, <br /> GAMMA, CONTRAST<br /> 2.) ROTATING & FLIPPING IMAGE,<br /> 3.) PERSPECTIVE AND REFLECTION OF IMAGE<br /> 4.) CREATING BLACK & WHITE , SEPIA IMAGE<br />CROPPING PHOTO.<br />
  6. 6. ARCHITECTURAL STYLE<br />I have chosen the FOUR-TIER ARCHITECTURAL style for my project. <br />My project involves using the Facebook through Computers, Mobile Devices, etc. So the application requires different version of interface for every user.<br /> So my interface layer is decomposed into a Presentation Server Layer and a Presentation Client Layer. <br />Forms shared by all types of users in Presentation Client Layer are then processed in the Presentation Server Layer thus removing the redundancy across different clients like Computer User, Mobile Device users. <br />And then the data from all clients is stored and processed in a single storage system.<br /> When the client requests any data the Application Logic provides the connection with the storage layer and then the query are processed and then the Presentation Server Layer presents the data to Presentation Client Layer. This Presentation Client Layer depending upon the client presents appropriate forms, user interface, etc. <br />
  7. 7. ARCHITECTURAL STYLE<br /> Presentation Client<br /> Presentation Layer<br /> Application Logic<br /> Storage Layer<br />
  8. 8. Subsystem for photo-editor and applying various effects<br /> INTERFACE LAYER : <br /> (A) PRESENTATION CLIENT LAYER <br /> 1.) UPLOADPHOTOPAGE. <br /> 2.) CHANGE SETTING FOR PHOTOS.<br /> APPLICATION LOGIC LAYER : <br /> 1.) SELECT PHOTOS TO UPLOAD. <br /> 2.) APPLY VARIOUS PHOTO EDITING EFFECTS. <br /> 3.) ADD PHOTO PROCESS <br />STORAGE LAYER : <br /> 1.) USER’S PHOTO ALBUM DATABASE.<br />
  9. 9. Subsystem for photo-editor and applying various effects<br />
  10. 10. COMPONENT DIAGRAM<br />
  11. 11. COMPONENT DIAGRAM<br />
  12. 12. DEPLOYMENT DIAGRAM<br />
  13. 13. DEPLOYMENT DIAGRAM<br />
  14. 14. Access control matrix<br />Access control matrix for the photo album module, modifying the photos of the user, sending temporary password and for various user settings.<br />
  15. 15. DESIGN PATTERNS<br />PROXY DESIGN PATTERN<br />FACADE PATTERN<br />MODEL VIEW CONTROLLER PATTERN<br />
  16. 16. PROXY DESIGN PATTERN<br />Provide a surrogate or placeholder for another <br /> object to control access to it. <br />Facebook User<br />Photo-Editor<br />+EditingFunctions<br />Real Image Class<br />Proxy Image Class<br /> Real Image<br />+EditingFunctions<br />+EditingFunctions<br />+RealImage.EditingFunctions<br />
  17. 17. PROXY DESIGN PATTERN<br />The classes participating in this pattern are: <br />Proxy Image<br /><ul><li>It maintains a reference that lets the proxy access the real image.
  18. 18. Proxy may refer to a Photo-Editor if the Real Image and Photo Editor interfaces are the same.
  19. 19. It provides an interface identical to real image so that a proxy can be substituted for it.
  20. 20. Moreover it controls access to the real image.</li></ul>Photo-Editor<br /><ul><li>This class defines the common interface for Real Image and Proxy Image class so that a Proxy can be used anywhere a Real Image is expected or required to be processed. </li></ul>Real Image<br /><ul><li>This class defines the real object that the proxy image class represents. </li></li></ul><li>FACADE PATTERN<br /> A facade is an object that provides a simplified interface to a larger body of code:<br /><ul><li>It makes APIs easier to use, understand and test, since the facade has convenient methods for common tasks.
  21. 21. It reduce dependencies of outside code on the inner workings of a library and allows more flexibility in developing the system.
  22. 22. It wraps a collection of various APIs like Facebook API, Image Draw API with a single well-designed API for our application.</li></li></ul><li>FAÇADE PATTERN<br /> User<br /> FACADE<br /> Photo-Editor<br /> Photo Watermark<br /> Temporary Access<br /> Photo-Viewer<br />
  23. 23. MODEL VIEW CONTROLLER PATTERN<br />*The model manages the behavior and data of the application domain, responds <br /> to requests for information about its state (usually from the view), and responds <br /> to instructions to change state (usually from the controller). <br />*Also the model notifies observers (usually views) when the information changes <br /> so that they can react.<br />*The view renders <br /> the model into a <br /> form suitable for <br /> interaction.<br /> *Multiple views can <br /> exist for a single <br /> model for different <br /> purposes.<br /> *A viewport typically <br /> has a one to one <br /> correspondence <br /> with a display <br /> surface and knows <br /> how to render to it.<br /> MODEL<br />* The controller receives user input and initiates a response by making calls on model objects. A controller accepts input from the user and instructs the model and viewport to perform actions based on that input.<br />VIEW<br />CONTROLLER<br />
  24. 24. MODEL VIEW CONTROLLER PATTERN<br />In the model view controller pattern we have the business logic separated from the view and controller module. <br />In this application we have the image editing functions separate from the view photos and photo preview function. <br />We have the various functions like crop_image(), sharpen_image(), etc in the photo_editor functionality whereas the photos and user photo album class contains various other details of the photo and its viewing details. <br />
  25. 25. MODEL VIEW CONTROLLER PATTERN<br />
  26. 26. MODEL TRANSFORMATION<br />
  27. 27. Interface specification <br /><ul><li> This class deals with the functionality of the photo-editing features like </li></ul> rotate, crop, sharpen, etc. <br /><ul><li> When the photo is uploaded and changed the photo is viewed using the </li></ul> method view_preview_window(). <br /><ul><li> Whenever the photo is uploaded and performed any function different </li></ul> methods like crop_image(), sharpen_image(), rotate_image(), <br />auto_size_image(), etc are called depending upon the <br /> HTTP request of the user.<br />
  28. 28. Mapping contracts to exception<br />context Photo_Editor:crop_image(x,y) pre:<br />user.photo.album.photo.viewOnCanvastrue<br /> contextPhoto_Editor:crop_image(x,y) post:<br />user.photo.album.photo.savemodifiedimage(boolean)<br /> <br />context Photo_Editor:rotate_image(angle) pre:<br />user.photo.album.photo.viewOnCanvastrue<br /> contextPhoto_Editor:rotate_image(angle) post:<br />user.photo.album.photo.savemodifiedimage(boolean) <br /> <br />context Photo_Editor:sharpen_image(value) pre:<br />user.photo.album.photo.viewOnCanvastrue<br /> contextPhoto_Editor:sharpen_image(value) post:<br />user.photo.album.photo.savemodifiedimage(boolean) <br />context Photo_Editor:view_preview_window() pre:<br />user.photo.album.photo.pathselected(path)<br /> contextPhoto_Editor:view_preview_window() post:<br />user.photo.album.photo.view(picture) <br />
  29. 29. Mapping contracts to exception<br />contextPhoto_Editorinv: <br />photos_editor->forAll( Img:Image | Img.load(true) and Img.save(true)) <br /> <br />context UserPhotoAlbuminv:<br />photoAlbum->forAll(PA : Photo_Album | Pa.create(true) and pa.notPresent(true))<br /> <br />context Photos inv:<br />photosforAll(p:Photo | p.addPhoto(true) and p.dwnloadDisable(true))<br /> <br /> <br />
  30. 30. Interface specification <br />By use of this class the user’s request for temporary password would be fulfilled. <br />ConfirmIdentity()- Authenticates the user and its request. generateRandomPwd() - System generates a random password and initiates mobile messaging module<br /> <br /> After the identity has been confirmed <br />configureUserMsg()- The message is configure through by the generated password and user details<br />
  31. 31. Mapping contracts to exception<br />contextMobileMessaging : generateRandomPwd():String pre:<br />isIdentity->true<br /> contextMobileMessaging : generateRandomPwd() post:<br />MobileMessaging.isCorrectPwdGenerated(pwd).<br /> <br />contextMobileMessaging : SendPassword() pre:<br />receivedMsg(msg)<br /> contextMobileMessaging : SendPassword() post:<br />Password.Send.Identity(User)<br /> <br />contextMobileMessaging : ConfirmIdentity() pre:<br />user.details->includes(list)<br /> contextMobileMessaging : ConfirmIdentity() post:<br />userIdentity(list) <br /> <br />contextMobileMessaging : RetrieveUserDetailpre:<br />User.Enter.Answers.->include(list)<br /> contextMobileMessagin : RetrieveUserDetailpost:<br />User.Message.Match.Compare(list,entered value)true<br />contextMobileMessaginginv<br />FacebookUsers.access->forAll( FacebookUsers.registered(self))<br /> <br />
  32. 32. MAPPING OBJECT MODELS T0 A PERSISTENT STORAGE SCHEMA<br />A Schema is a description of the data, that is, a meta model for data.<br />A Primary key of a table is a set of attributes whose values uniquely identify the data records in a table.<br />Sets of attributes that could be used as a primary key are called Candidate keys.<br />A Foreign key is an attribute that references the primary key of another table.<br />
  33. 33. MAPPING CLASS AND ATTRIBUTES<br />
  34. 34. optimizing THE OBJECT MODEL - Delaying Expensive Computations<br /><ul><li> By this pattern an ImageProxy object takes place of Image and provides </li></ul> the same interface as Image object. When the image needs to be drawn, <br />ImageProxy loads the data from the disk and creates a RealIMage object, <br /> thus saving the substantial computation time.<br /><ul><li>We can use this pattern while applying the various photo editing effects on </li></ul> the loaded image .<br />
  35. 35. RATIONALE MANAGEMENT<br />can be by use of can be by use of<br /> fails to perform meets this criteria and improves performance<br /> by about 5-10 % of the user request. <br />Use of Processing Page?: Issue<br />.aspx .cs page: Proposal<br />.ashx page : Proposal<br />Performance$ : Criterion <br />
  36. 36. RATIONALE MANAGEMENT<br /> fails meets <br />Photo Display?: Issue<br />Simple Controls : Proposal<br />AJAX Controls: Proposal<br />Slow?: Issue<br />Response Time$ : Criterion <br />
  37. 37. screenshots<br />
  38. 38.
  39. 39.
  40. 40.
  41. 41.
  42. 42.
  43. 43.
  44. 44. THANK YOU<br />

×