1. 1
‫מסכם‬ ‫דו"ח‬
:‫מגישים‬
‫חורי‬ ‫עלאא‬
‫ממאן‬ ‫נדב‬
‫רביע‬‫אגבאריה‬
‫חורי‬ ‫פאדי‬
‫אקדמי‬ ‫מנחה‬:'‫פרופ‬‫זיפר‬ ‫משה‬

2. 2
‫תוכן‬‫עניינים‬
‫סקירת‬‫האפליקציה‬.............................................................................................3
‫תיאור‬‫האפליקציה‬.......................................................................................................................................3
‫מטרת‬‫האפליקציה‬.......................................................................................................................................3
‫תרחישי‬‫השימוש‬‫באפליקציה‬.......................................................................................................................3
‫אופן‬‫השימוש‬‫באפליקציה‬............................................................................................................................3
‫תכונות‬‫שיושמו‬‫באפליקציה‬..................................................................................5
‫צד‬‫שרת‬.......................................................................................................................................................5
‫צד‬‫לקוח‬......................................................................................................................................................5
‫ארכיטקטורת‬‫המערכת‬.........................................................................................6
‫צד‬‫שרת‬.......................................................................................................................................................6
‫צד‬‫לקוח‬....................................................................................................................................................10
‫בסיסי‬‫נתונים‬............................................................................................................................................20
‫אינטראקציית‬‫לקוח‬-‫שרת‬...........................................................................................................................22
‫עיצוב‬..............................................................................................................23
‫ממשק‬‫משתמש‬(IU).................................................................................................................................23
‫שיקולי‬‫פיתוח‬..................................................................................................27
‫טכנולוגיות‬‫צד‬-‫שרת‬...................................................................................................................................27
‫טכנולוגיות‬‫צד‬-‫לקוח‬...................................................................................................................................28
‫אופן‬‫אחסון‬‫והגשת‬‫הסרטונים‬.....................................................................................................................28
‫מסקנות‬,‫לקחים‬‫שנלמדו‬‫ושיפורים‬‫לעתיד‬..............................................................29
‫ביבליוגרפיה‬....................................................................................................30

3. 3
‫האפליקציה‬ ‫סקירת‬
‫האפליקציה‬ ‫תיאור‬
“VideoLoca”‫מיקום‬ ‫מבוססת‬ ‫וידאו‬ ‫סרטוני‬ ‫שיתוף‬ ‫אפליקציית‬ ‫הינה‬,‫לצפות‬ ‫למשתמש‬ ‫המאפשרת‬
‫וכמו‬ ‫הקרובה‬ ‫בסביבתו‬ ‫שצולמו‬ ‫בסרטונים‬-‫הנמצאים‬ ‫משתמשים‬ ‫עם‬ ‫ולשתפם‬ ‫סרטונים‬ ‫לצלם‬ ‫כן‬
‫הסרטונים‬ ‫צולמו‬ ‫בה‬ ‫בסביבה‬.
‫המש‬ ‫של‬ ‫מיקומו‬ ‫זיהוי‬ ‫עבור‬ ‫הנייד‬ ‫המכשיר‬ ‫של‬ ‫המיקום‬ ‫ביכולות‬ ‫משתמשת‬ ‫האפליקציה‬‫תמש‬,‫מנת‬ ‫על‬
‫בו‬ ‫המיקום‬ ‫את‬ ‫לזהות‬ ‫כדי‬ ‫וכן‬ ‫הקרובה‬ ‫בסביבתו‬ ‫האפליקציה‬ ‫באמצעות‬ ‫שצולמו‬ ‫סרטונים‬ ‫לו‬ ‫להציג‬
‫ו‬ ‫סרטון‬ ‫צולם‬"‫לנעוץ‬"‫זה‬ ‫במיקום‬ ‫אותו‬.
‫האפליקציה‬ ‫מטרת‬
‫הבאים‬ ‫לנושאים‬ ‫מענה‬ ‫לתת‬ ‫באה‬ ‫האפליקציה‬:
●‫כמו‬ ‫מדיה‬ ‫שיתוף‬ ‫פלטפורמות‬YOUTUBE‫לדוג‬,'‫האפשרות‬ ‫את‬ ‫למשתמש‬ ‫נותנות‬ ‫לא‬‫לחפש‬
‫ע‬ ‫סרטונים‬"‫מיקום‬ ‫פ‬
●‫הנוכחי‬ ‫למיקומו‬ ‫הרלוונטיים‬ ‫וידאו‬ ‫בסרטוני‬ ‫לצפות‬ ‫למשתמש‬ ‫יכולת‬ ‫מתן‬
●‫מוגבל‬ ‫גיאוגרפי‬ ‫ברדיוס‬ ‫סרטון‬ ‫של‬ ‫שיתוף‬
‫נוספת‬ ‫מידע‬ ‫בשכבת‬ ‫אותם‬ ‫להעשיר‬ ‫מנת‬ ‫על‬ ‫מסוימים‬ ‫במיקומים‬ ‫סרטונים‬ ‫הטמעת‬
‫באפליקציה‬ ‫השימוש‬ ‫תרחישי‬
●‫מתרחש‬ ‫או‬ ‫שהתרחש‬ ‫אירוע‬ ‫על‬ ‫שומע‬ ‫המשתמש‬‫בסרטונים‬ ‫לצפות‬ ‫ומעוניין‬ ‫הקרובה‬ ‫בסביבתו‬
‫למקום‬ ‫להגיע‬ ‫מעוניין‬ ‫והוא‬ ‫במידה‬ ‫האירוע‬ ‫היכן‬ ‫ולראות‬ ‫מהאירוע‬.
●‫שנמצא‬ ‫מי‬ ‫עם‬ ‫רק‬ ‫אותו‬ ‫לשתף‬ ‫ומעוניין‬ ‫צולם‬ ‫בו‬ ‫למיקום‬ ‫רק‬ ‫שרלוונטי‬ ‫סרטון‬ ‫צילם‬ ‫המשתמש‬
‫זה‬ ‫מיקום‬ ‫בסביבת‬.
●‫בסגנון‬ ‫במשחקים‬ ‫שימוש‬"‫המטמון‬ ‫את‬ ‫חפש‬"–‫עם‬ ‫סרטונים‬ ‫להשאיר‬ ‫ניתן‬‫והנחיות‬ ‫רמזים‬
‫המשחק‬ ‫בתחנות‬.
●‫תיירותיים‬ ‫במקומות‬ ‫וירטואלית‬ ‫אינפורמציה‬ ‫שכבת‬ ‫הוספת‬–‫של‬ ‫וסקירה‬ ‫הסבר‬ ‫סרטוני‬
‫כעת‬ ‫נמצא‬ ‫המשתמש‬ ‫בו‬ ‫המיקום‬.
●‫המשתמש‬ ‫למיקום‬ ‫הרלוונטיות‬ ‫וידאו‬ ‫פרסומות‬ ‫הצגת‬–‫בסביבה‬ ‫ושירותים‬ ‫לעסקים‬ ‫פרסומות‬
‫הקרובה‬.
‫באפליקציה‬ ‫השימוש‬ ‫אופן‬
●‫לאפליקצ‬ ‫נכנס‬ ‫המשתמש‬‫שלו‬ ‫הפייסבוק‬ ‫חשבון‬ ‫באמצעות‬ ‫יה‬.
●‫עם‬ ‫המשתמש‬ ‫של‬ ‫סביבתו‬ ‫של‬ ‫מפה‬ ‫המציג‬ ‫האפליקציה‬ ‫של‬ ‫הראשי‬ ‫למסך‬ ‫מגיע‬ ‫המשתמש‬
‫ע‬ ‫להגדרה‬ ‫הניתן‬ ‫ברדיוס‬ ‫שצולמו‬ ‫הווידאו‬ ‫סרטוני‬"‫המשתמש‬ ‫י‬.
●‫בהם‬ ‫לצפות‬ ‫מנת‬ ‫על‬ ‫הסרטונים‬ ‫סימוני‬ ‫על‬ ‫ללחוץ‬ ‫יכול‬ ‫המשתמש‬.
●‫הסרטון‬ ‫את‬ ‫לדרג‬ ‫יכול‬ ‫המשתמש‬ ‫בסרטון‬ ‫צפייה‬ ‫בעת‬,‫לה‬‫בפרופיל‬ ‫ולצפות‬ ‫תגובות‬ ‫לו‬ ‫וסיף‬
‫הסרטון‬ ‫את‬ ‫שהעלה‬ ‫המשתמש‬ ‫של‬ ‫האישי‬.
●‫על‬-‫האפליקציה‬ ‫של‬ ‫הראשי‬ ‫המסך‬ ‫בתחתית‬ ‫הקבוע‬ ‫הצילום‬ ‫כפתור‬ ‫על‬ ‫לחיצה‬ ‫ידי‬,‫האפליקציה‬
‫של‬ ‫באורך‬ ‫וידאו‬ ‫צילום‬ ‫למצב‬ ‫עוברת‬15‫שניות‬.
●‫סרטון‬ ‫צילום‬ ‫לאחר‬,‫הסרטון‬ ‫את‬ ‫לסקור‬ ‫יכול‬ ‫המשתמש‬,‫ולהעלות‬ ‫תיאור‬ ‫לו‬ ‫להוסיף‬‫אותו‬
‫למפה‬.

4. 4

5. 5
‫באפליקציה‬ ‫שיושמו‬ ‫תכונות‬
‫שרת‬ ‫צד‬
●‫של‬ ‫דירוג‬ ‫מנהל‬ ‫השרת‬ ‫ואיכותיים‬ ‫מעניינים‬ ‫סרטונים‬ ‫להעלות‬ ‫משתמשים‬ ‫לעודד‬ ‫מנת‬ ‫על‬
‫דירוג‬ ‫להם‬ ‫שיש‬ ‫אלו‬ ‫את‬ ‫רק‬ ‫במערכת‬ ‫ומשאיר‬ ‫לסרטונים‬ ‫סינון‬ ‫מבצע‬ ‫זמן‬ ‫פרק‬ ‫וכל‬ ‫הסרטונים‬
‫גבוהה‬.
●‫אמת‬ ‫בזמן‬ ‫התראות‬ ‫בשליחת‬ ‫תומך‬ ‫השרת‬.
●‫מספר‬ ‫אחרי‬ ‫מעקב‬‫סרטון‬ ‫כל‬ ‫של‬ ‫הצפיות‬.
‫לקוח‬ ‫צד‬
●‫שלו‬ ‫הפיסבוק‬ ‫פרופיל‬ ‫תמונת‬ ‫את‬ ‫המציג‬ ‫משתמש‬ ‫לכל‬ ‫אישי‬ ‫פרופיל‬,‫בסיסיים‬ ‫אישיים‬ ‫פרטים‬:
‫מין‬,‫קצר‬ ‫ותיאור‬ ‫לידה‬ ‫תאריך‬,‫שצילם‬ ‫הסרטונים‬ ‫את‬ ‫וכן‬.
●‫לסרטונים‬ ‫תגובות‬ ‫והוספת‬ ‫דירוג‬ ‫אפשרות‬.
●‫של‬ ‫באורך‬ ‫קצרים‬ ‫סרטונים‬ ‫צילום‬15‫שניות‬.
●‫המוצגים‬ ‫הסרטונים‬ ‫רדיוס‬ ‫להגדרת‬ ‫אפשרות‬(‫בין‬1‫ל‬-15‫ק‬"‫מ‬.)
●‫הסרטונים‬ ‫הצגת‬ ‫אופן‬ ‫הגדרת‬–‫ברצף‬ ‫וניגון‬ ‫אוטומטי‬ ‫ניגון‬.
●( ‫התקבצות‬Clustering‫ברדיוס‬ ‫הסרטונים‬ )50.‫במפה‬ ‫הצפיפות‬ ‫את‬ ‫להוריד‬ ‫כדי‬ '‫מ‬

6. 6
‫המערכת‬ ‫ארכיטקטורת‬
‫שרת‬ ‫צד‬
Server.js:,‫הלקוח‬ ‫מצד‬ ‫מתקבלות‬ ‫אשר‬ ‫הבקשות‬ ‫כל‬ ‫את‬ ‫שמנהלת‬ ‫השרת‬ ‫של‬ ‫הראשית‬ ‫המחלקה‬
.‫בהתאם‬ ‫בהם‬ ‫לטפל‬ ‫כדי‬ ‫המתאימות‬ ‫למחלקות‬ ‫אותם‬ ‫ומחלקת‬
User.js:‫ללקוח‬ ‫שקשורה‬ ‫נתונים‬ ‫לעדכון/שליפת‬ ‫הקשורות‬ ‫הבקשות‬ ‫סוגי‬ ‫בכל‬ ‫המטפלת‬ ‫המחלקה‬
.‫התחברות‬ ‫בקשת‬ ‫בעת‬ ‫המשתמש‬ ‫קיום‬ ‫את‬ ‫כולל‬ ‫שזה‬ ,‫מסוים‬
S3Service.js‫לשירותי‬ ‫קשורות‬ ‫אשר‬ ‫בבקשות‬ ‫המטפלת‬ ‫המחלקה‬ :Amazon S3‫מחזיקה‬ ‫היא‬ ,‫וגם‬ ,
.‫זה‬ ‫לשירות‬ ‫הקשורה‬ ‫הלוגיקה‬ ‫את‬
CoreAPI.js‫האחראית‬ ‫הבקשה‬ ,‫כגון‬ ,‫האפליקציה‬ ‫של‬ ‫הכללית‬ ‫הלוגיקה‬ ‫על‬ ‫האחראית‬ ‫המחלקה‬ :
.‫המפה‬ ‫על‬ ‫מסוים‬ ‫ברדיוס‬ ‫הסרטונים‬ ‫טעינת‬ ‫על‬
VideoOperations.js‫בבקש‬ ‫המטפלת‬ ‫המחלקה‬ :‫לאינטראקציה‬ ‫הקשורות‬ ‫ות‬‫עם‬ ‫המשתמש‬ ‫של‬
.‫מסוים‬ ‫סרטון‬(like, comment, views count.)'‫וכו‬

7. 7
user.js
connect()
‫היא‬ ,‫המשתמש‬ ‫התחברות‬ ‫ברגע‬ ‫לשרת‬ ‫מהאפליקציות‬ ‫הנשלחות‬ ‫הבקשות‬ ‫בסוג‬ ‫מטפלת‬ ‫הזו‬ ‫הפונקציה‬
‫למשתמש‬ ‫הקשורים‬ ‫הנתונים‬ ‫כל‬ ‫את‬ ‫לו‬ ‫מחזירה‬ ‫אז‬ ‫קיים‬ ‫אם‬ ,‫במערכת‬ ‫המשתמש‬ ‫קיום‬ ‫את‬ ‫בודקת‬
‫מפרופיל‬ ‫הזה‬ ‫המשתמש‬ ‫על‬ ‫נתונים‬ ‫כמה‬ ‫שולפת‬ ‫היא‬ ‫אז‬ ‫לא‬ ‫ואם‬ ,‫בהתאם‬ ‫אותם‬ ‫להציג‬ ‫כדי‬ ‫הזה‬
‫ורוש‬ ‫שלו‬ ‫הפייסבוק‬.‫במערכת‬ ‫אותו‬ ‫מת‬
getUserProfileDataFromDB(pUserId)
‫מקבלת‬ ‫היא‬ ,‫אחר‬ ‫משתמש‬ ‫של‬ ‫לפרופיל‬ ‫או‬ ‫שלו‬ ‫לפרופיל‬ ‫נכנס‬ ‫המשתמש‬ ‫כאשר‬ ‫נקראת‬ ‫הזו‬ ‫הפונקציה‬
‫ה‬ ‫את‬user id,‫הזה‬ ‫המשתמש‬ ‫של‬‫להציג‬ ‫כדי‬ ‫הזה‬ ‫למשתמש‬ ‫השייכים‬ ‫הסרטונים‬ ‫כל‬ ‫רשימת‬ ‫ומחזירה‬
.‫בפרופיל‬ ‫אותם‬
‫מח‬ ‫לא‬ ‫הזו‬ ‫(הפונקציה‬ :‫הערה‬‫רשימת‬ ‫את‬ ‫אלא‬ ‫הסרטונים‬ ‫את‬ ‫זירה‬jsons‫על‬ ‫נתונים‬ ‫המכילים‬
.)‫האלו‬ ‫הסרטונים‬
updateProfileInfo()
‫המעודכנים‬ ‫הנתונים‬ ‫את‬ ‫מקבלת‬ ‫היא‬ ,‫שלו‬ ‫הפרופיל‬ ‫את‬ ‫מעדכן‬ ‫כשהמשתמש‬ ‫נקראת‬ ‫הזו‬ ‫הפונקציה‬
‫ב‬ ‫אותם‬ ‫ושומרת‬database.‫לא‬ ‫או‬ ‫בהצלחה‬ ‫התבצע‬ ‫העדכון‬ ‫אם‬ ‫למשתמש‬ ‫תשובה‬ ‫ומחזירה‬ ,
getProfileAboutInfo()
‫כמו‬ ‫נתונים‬ ,‫מסוים‬ ‫משתמש‬ ‫של‬ ‫הפרופיל‬ ‫נתוני‬ ‫את‬ ‫מחזירה‬ ‫הזו‬ ‫הפונקציה‬birthday, gender, about
.'‫וכו‬
coreAPI.js
loadLikesAndComments(pVideoID)
‫ה‬ ‫כל‬ ‫שליפת‬ ‫על‬ ‫אחראית‬ ‫הזו‬ ‫הפונקציה‬comments‫ו‬likes‫מה‬ ‫מסוים‬ ‫סרטון‬ ‫של‬database.
‫איזשהו‬ ‫על‬ ‫לוחץ‬ ‫שהמשתמש‬ ‫ברגע‬‫הקשורים‬ ‫לנתונים‬ ‫טעינת‬ ‫בקשת‬ ‫שולחת‬ ‫האפליקציה‬ ‫במפה‬ ‫סרטון‬
.‫הזה‬ ‫מהסוג‬ ‫בבקשות‬ ‫שמטפלת‬ ‫מי‬ ‫היא‬ ‫הזו‬ ‫הפונקציה‬ ‫ולכן‬ ,‫מהשרת‬ ‫הזה‬ ‫לסרטון‬
‫של‬ ‫רשימות‬ ‫שתי‬ ‫מחזירה‬jsons‫ה‬ ‫הראשונה‬ ,comments‫ה‬ ‫של‬ ‫והשנייה‬likes.
addNewVideoDataInDB(pUploadVideoJson)
‫חדש‬ ‫סרטון‬ ‫מעלה‬ ‫שהמשתמש‬ ‫אחרי‬‫ל‬ ‫עולה‬ ‫הזה‬ ‫הסרטון‬ ,‫למפה‬S3‫ב‬Amazon‫הועלה‬ ‫אם‬ ‫ואז‬
‫לשרת‬ ‫שולחת‬ ‫ישירות‬ ‫האפליקציה‬ ‫אז‬ ‫בהצלחה‬‫ـ‬Json‫הזה‬ ‫לסרטון‬ ‫הקשורים‬ ‫הנתונים‬ ‫כל‬ ‫את‬ ‫המכיל‬
‫ל‬ ‫שלו‬ ‫הקישור‬ ,‫הסרטון‬ ‫את‬ ‫העלה‬ ‫מי‬ ‫(כמו‬Amazon‫וכו‬’‫ב‬ ‫אותם‬ ‫לעדכן‬ ‫כדי‬ )database‫ולכן‬ ,
‫מהסוג‬ ‫בקשות‬ ‫על‬ ‫אחראית‬ ‫היא‬ ‫הזו‬ ‫הפונקציה‬.‫הזה‬
getVideosByLocationAndRadius(xCoordinate,yCoordinate)
‫עד‬ ‫של‬ ‫ברדיוס‬ ‫הסרטונים‬ ‫כל‬ ‫רשימת‬ ‫את‬ ‫מחזירה‬ ‫הזו‬ ‫הפונקציה‬15.‫הנתונה‬ ‫מהנקודה‬ ‫קמ"ש‬
‫להציג‬ ‫כדי‬ ‫סרטונים‬ ‫רשימת‬ ‫קבלת‬ ‫בקשת‬ ‫שולחת‬ ‫האפליקציה‬ ,‫בהצלחה‬ ‫התחבר‬ ‫שהמשתמש‬ ‫ברגע‬
‫לפונקצי‬ ‫מגיעה‬ ‫הזו‬ ‫הבקשה‬ ‫ולכן‬ ,‫המפה‬ ‫על‬ ‫אותם‬.‫שצריך‬ ‫מה‬ ‫את‬ ‫למשתמש‬ ‫ומחזירה‬ ‫בשרת‬ ‫הזו‬ ‫ה‬

8. 8
s3Service.js
deleteVideoFromS3(pVideoId)
‫מה‬ ‫מסוים‬ ‫סרטון‬ ‫מחיקת‬ ‫על‬ ‫אחראית‬ ‫הזו‬ ‫הפונקציה‬database‫מה‬ ‫אותו‬ ‫למחוק‬ ‫וגם‬S3.
deleteVideoFromS3InTimeOut()
‫מתח‬ ‫שהוא‬ ‫לפני‬ ‫זה‬ ‫על‬ ‫לשרת‬ ‫מדווח‬ ‫הוא‬ ‫הסרטון‬ ‫את‬ ‫להעלות‬ ‫רוצה‬ ‫שהמשתמש‬ ‫בזמן‬.‫ההעלאה‬ ‫את‬ ‫יל‬
‫יוכל‬ ‫שהשרת‬ ‫כדי‬ ‫בתשובה‬ ‫אליו‬ ‫ויחזור‬ ‫ההעלאה‬ ‫את‬ ‫שיסיים‬ ‫עד‬ ‫מסוים‬ ‫זמן‬ ‫פרק‬ ‫למשתמש‬ ‫נותן‬ ‫השרת‬
‫ב‬ ‫לסרטון‬ ‫קישור‬ ‫(כולל‬ ‫הסרטון‬ ‫נתוני‬ ‫את‬ ‫להוסיף‬S3)‫ל‬Database.
‫שקיימים‬ ‫מצב‬ ‫מונע‬ ‫ובכך‬ ,)‫קיים‬ ‫(אם‬ ‫האמזון‬ ‫משירותי‬ ‫הסרטון‬ ‫את‬ ‫מוחק‬ ‫השרת‬ ‫אז‬ ‫חזר‬ ‫לא‬ ‫ואם‬
‫ב‬ ‫סרטונים‬S3‫ש‬‫ב‬ ‫מצביע‬ ‫להם‬ ‫אין‬Database.
videoOperations.js
like()
‫ה‬ ‫בבקשות‬ ‫מטפלת‬ ‫הזו‬ ‫הפונקציה‬like‫את‬ ‫ומעדכנת‬ ‫מסוים‬ ‫סרטון‬ ‫של‬‫ה‬database.‫בהתאם‬
removeLike()
‫בבקשות‬ ‫מטפלת‬ ‫הזו‬ ‫הפונקציה‬remove like‫מוריד‬ ‫היא‬ ‫כלומר‬like‫סרטון‬ ‫עבור‬ ‫מסוים‬ ‫משתמש‬ ‫של‬
‫ה‬ ‫את‬ ‫ומעדכנת‬ ,‫מסוים‬database.‫בהתאם‬
comment()
‫ה‬ ‫בבקשות‬ ‫מטפלת‬ ‫הזו‬ ‫הפונקציה‬comment‫ה‬ ‫את‬ ‫ומעדכנת‬ ‫מסוים‬ ‫סרטון‬ ‫על‬database.
removeComment()
‫ה‬ ‫בבקשות‬ ‫מטפלת‬ ‫הזו‬ ‫הפונקציה‬remove comment‫ה‬ ‫את‬ ‫למחוק‬ ‫רוצה‬ ‫מסוים‬ ‫משתמש‬ ‫אם‬ ‫כלומר‬ ,
comment‫הנתונים‬ ‫את‬ ‫ומוחקת‬ ‫נקראת‬ ‫הזו‬ ‫הפונקציה‬ ,‫מסוים‬ ‫סרטון‬ ‫עבור‬ ‫שלו‬‫מה‬ ‫הרלוונטים‬
database.‫בהתאם‬
addViewsNumber(pVideoId)
,‫המפה‬ ‫על‬ ‫סרטון‬ ‫באיזשהו‬ ‫צופה‬ ‫מסוים‬ ‫שמשתמש‬ ‫פעם‬ ‫כל‬ ‫נקראת‬ ‫הזו‬ ‫הפונקציה‬‫ה‬ ‫את‬ ‫מקבלת‬id‫של‬
‫ב‬ ‫הזה‬ ‫הסרטון‬ ‫של‬ ‫הצופים‬ ‫מספר‬ ‫את‬ ‫ומעלה‬ ‫הסרטון‬1‫ב‬database.

9. 9
‫כמו‬ ‫עדכונים‬ ‫לקבלת‬ ‫מיועד‬ ‫הזה‬ ‫המנגנון‬view count / likes / comments.‫אמת‬ ‫בזמן‬
‫באותו‬ ‫סרטון‬ ‫באותו‬ ‫שצופים‬ ‫המשתמשים‬ ‫כל‬ ,‫הסרטונים‬ ‫אחד‬ ‫על‬ ‫עדכונים‬ ‫שחל‬ ‫עת‬ ‫בכל‬ ,‫כלומר‬
.‫מידי‬ ‫באופן‬ ‫העדכון‬ ‫את‬ ‫יקבלו‬ ,‫רגע‬
( ‫חדר‬ ‫כל‬Room,‫נתון‬ ‫ברגע‬ ‫משתמשים‬ ‫מספר‬ ‫ידי‬ ‫על‬ ‫נצפה‬ ‫אשר‬ ‫מסוים‬ ‫סרטון‬ ‫מייצג‬ )
‫בזמן‬ ‫עדכונים‬ ‫מקבלים‬ ,‫מסוים‬ ‫לחדר‬ ‫השייכים‬ ‫והמשתמשים‬.‫החדר‬ ‫ידי‬ ‫על‬ ‫המיוצג‬ ‫לסרטון‬ ‫אמת‬

10. 10
‫לקוח‬ ‫צד‬
‫תבנית‬Model–View–Presenter‫(בקיצור‬MVP‫המשמשת‬ ‫תוכנה‬ ‫בהנדסת‬ ‫עיצוב‬ ‫תבנית‬ ‫היא‬ )
‫מבט‬ ,‫מודל‬ ,‫חלקים‬ ‫לשלושה‬ ‫היישום‬ ‫לחלוקת‬ ‫טכניקה‬ ‫מתארת‬ ‫התבנית‬ .‫כלשהו‬ ‫יישום‬ ‫להפשטת‬
.‫אירועים‬ ‫מונחה‬ ‫רפוי‬ ‫בצימוד‬ ‫ביניהם‬ ‫המחוברים‬ ,‫ובקר‬
-Model‫המ‬ :‫להציג‬ ‫הולכת‬ ‫שהאפליקציה‬ ‫הנתונים‬ ‫את‬ ‫בתוכו‬ ‫שמגדיר‬ ‫הממשק‬ ‫הוא‬ ‫ודל‬
( ‫המשתמש‬ ‫בממשק‬UI.)
-View,‫אלמנטים‬ ‫סוגי‬ ‫שני‬ ‫המכילות‬ ‫חבילות‬ ‫שתי‬ ‫מכיל‬ :Activity‫ו‬-Fragment‫שני‬ ,
( ‫המשתמש‬ ‫ממשק‬ ‫את‬ ‫מהווים‬ ‫האלו‬ ‫אלמנטים‬UI.‫באפליקציה‬ )
-Presenter‫כל‬ ‫של‬ ‫הלוגי‬ ‫הצד‬ ‫הוא‬ :view‫הנתוני‬ ‫את‬ ‫מקבל‬ ,‫מה‬ ‫האירועים‬ ‫או‬ ‫ם‬-view‫מעבד‬
‫ה‬ ‫לעדכון‬ ‫הצורך‬ ‫ובעת‬ ‫אותם‬-UI‫ל‬ ‫תשובה‬ ‫מחזיר‬ ‫הוא‬ ,view.

11. 11
Object Diagram
( ‫שלישיה‬ ‫כל‬ ,‫האפליקציה‬ ‫של‬ ‫הכללי‬ ‫העיצוב‬ ‫מתואר‬ ‫הזה‬ ‫בשרטוט‬Model, View, Presenter‫מייצגת‬ )
‫העיצוב‬ ‫תבנית‬ ‫של‬ ‫המימוש‬ ‫את‬MVP.

12. 12
Login:
‫ה‬ ‫מסך‬-Login.‫לאפליקציה‬ ‫המשתמש‬ ‫התחברות‬ ‫או‬ ‫רישום‬ ‫על‬ ‫אחראי‬
‫ה‬ ,‫ההתחברות‬ ‫כפתור‬ ‫על‬ ‫הלחיצה‬ ‫אחרי‬ ,‫פייסבוק‬ ‫שירותי‬ ‫ע"י‬ ‫נעשית‬ ‫לאפליקציה‬ ‫ההרשמה‬-presenter
‫מה‬ ‫מקבל‬-view‫ומקבל‬ ‫פייסבוק‬ ‫לשירותי‬ ‫פונה‬ .‫ההתחברות‬ ‫בקשת‬ ‫את‬ID‫המשתמש‬ ‫של‬ ‫ייחודי‬
‫ה‬ ,‫התשובה‬ ‫קבלת‬ ‫בעת‬ .‫לשרת‬ ‫התחברות‬ ‫בקשת‬ ‫ושולח‬-presenter‫ה‬ ‫את‬ ‫ומעדכן‬ ‫בהתאם‬ ‫מתנהג‬-
view.
LoginActivity:
onLoginButton‫היא‬ .‫ההתחברות‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫מה‬ ‫מבקשת‬-presenter.‫התחברות‬ ‫בקשת‬
openMapActivity‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫למסך‬ ‫המשתמש‬ ‫את‬ ‫מעבירה‬ ‫היא‬ .
.‫באפליקציה‬ ‫המפה‬
showLoginErrorDialog‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫בעת‬ ‫שגיאה‬ ‫הודעת‬ ‫מציגה‬ ‫היא‬ .
.‫התחברות‬ ‫שגיאת‬
LoginPresenter:
onLoginRequest‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫מול‬ ‫ההתחברות‬ ‫תהליך‬ ‫את‬ ‫מבצעת‬ ‫היא‬ .
.‫השרת‬
onLoginSucess‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :‫ו‬ ,‫מהשרת‬ ‫חיובית‬ ‫תשובה‬ ‫מקבלים‬‫קוראת‬
‫ב‬ ‫המתאימה‬ ‫לפונקציה‬-view.
onLoginFailed‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :‫וקוראת‬ ,‫מהשרת‬ ‫שלילית‬ ‫תשובה‬ ‫מקבלים‬
‫ב‬ ‫המתאימה‬ ‫לפונקציה‬-view.

13. 13
Map:
‫ה‬ ‫מסך‬-Map‫האישי‬ ‫לפרופיל‬ ,‫ההגדרות‬ ‫למסך‬ ‫דרכו‬ ‫לגשת‬ ‫אפשר‬ .‫באפליקציה‬ ‫המרכזי‬ ‫המסך‬ ‫הוא‬
‫קטעי‬ ‫לצילום‬ ‫המצלמה‬ ‫ולפתיחת‬‫ווידאו‬.
‫קטעי‬ ‫קיימים‬ ‫איפה‬ ‫הסימנים‬ ‫עליה‬ ‫מופעים‬ ‫גביה‬ ‫שעל‬ ‫המפה‬ ‫מופיעה‬ ‫זה‬ ‫במסך‬‫ווידאו‬‫שנמצאים‬
‫ה‬ ‫קטע‬ ‫יפתח‬ ,‫הסימנים‬ ‫אחד‬ ‫על‬ ‫בלחיצה‬ .‫למשתמש‬ ‫הקרובה‬ ‫בסביבה‬‫ווידאו‬.‫לצפיה‬
MapActivity:
onCameraButton‫היא‬ ,‫המצלמה‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
onSettingsButton‫היא‬ ,‫ההגדרות‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
onProfileButton,‫האישי‬ ‫הפרופיל‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫מדווחת‬ ‫היא‬‫לה‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
onMarkerIcon‫על‬ ‫שמופיעים‬ ‫הסימנים‬ ‫אחד‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬ ‫היא‬ ,‫המפה‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
openCamera‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫את‬ ‫פותחת‬ ‫היא‬ .fragment.‫המצלמה‬
openSettings‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫ה‬ ‫את‬ ‫פותחת‬ ‫היא‬ .-activity.‫ההגדרות‬ ‫של‬
openProfile‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫ה‬ ‫את‬ ‫פותחת‬ ‫היא‬ .-activity.‫המצלמה‬ ‫של‬
openVideoFragment‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫פותחת‬ ‫היא‬ .fragment‫הווידאו‬
.‫בו‬ ‫ולצפיה‬ ‫לטעינתו‬
openVideoListFragment‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫פותחת‬ ‫היא‬ .fragment
‫ממש‬ ‫במרחק‬ ‫שנמצאים‬ ‫הווידאו‬ ‫קטעי‬ ‫רשימת‬ ‫טועת‬ ‫גם‬ ‫היא‬ ‫ובנוסף‬ ,‫בו‬ ‫ולצפיה‬ ‫לטעינתו‬ ‫הווידאו‬
.‫לשני‬ ‫אחד‬ ‫קרוב‬
addVideoMarker‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫סימן‬ ‫מוסיפה‬ ‫היא‬ ,.‫המפה‬ ‫על‬ ‫ווידאו‬
addListMarker‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫קטעי‬ ‫רשימת‬ ‫של‬ ‫סימן‬ ‫מוסיפה‬ ‫היא‬ ,
.‫לשני‬ ‫אחד‬ ‫שקרובים‬ ‫המפה‬ ‫על‬ ‫ווידאו‬
MapPresenter:
onCameraOpen‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view,‫המצלמה‬ ‫לפתיחת‬ ‫ההרשאות‬ ‫את‬ ‫מבקשת‬ ,
‫מה‬ ‫ומבקשת‬-view.‫המצלמה‬ ‫את‬ ‫לפתוח‬

14. 14
onSettingsOpen‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫מה‬ ‫ומבקשת‬ ,‫השמורות‬ ‫ההגדרות‬ ‫את‬ ‫טוענת‬ ,-
view.‫ההגדרות‬ ‫מסך‬ ‫את‬ ‫לפתוח‬
onProfileOpen‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫מה‬ ‫ומבקשת‬ ,‫האישים‬ ‫הפרטים‬ ‫את‬ ‫טוענת‬ ,-
view.‫האישי‬ ‫הפרופיל‬ ‫את‬ ‫לפתוח‬
onMarkerIcon‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫נתונים‬ ‫כל‬ ‫טוענת‬ ,‫ומבקשת‬ ,‫לווידוא‬ ‫שקשורים‬
‫מה‬-view‫את‬ ‫לפתוח‬fragment.‫המתאימים‬ ‫הנתונים‬ ‫העברת‬ ‫כדי‬ ‫תוך‬ ‫הווידוא‬ ‫של‬
onVideoReceive‫ומעדכנת‬ ,‫מהשרת‬ ‫עדכונים‬ ‫או‬ ‫תשובות‬ ‫מקבלים‬ ‫כאשר‬ ‫נקראת‬ ‫הפונקציה‬ :
‫ה‬ ‫את‬-view‫לפני‬ ‫הנתונים‬ ‫את‬ ‫מעבדת‬ ‫הפונקציה‬ ,‫מהשרת‬ ‫סרטונים‬ ‫רשימת‬ ‫קבלת‬ ‫בעת‬ .‫בהתאם‬
‫מע‬ ‫שהיא‬‫ה‬ ‫את‬ ‫דכנת‬-view( ‫התקבצות‬ ‫פעולת‬ ‫כולל‬ ‫העיבוד‬ ,clustering.)
Hierarchical greedy clustering algorithm:
:‫כדלקמן‬ ‫הוא‬ ‫בו‬ ‫שהשתמשנו‬ ‫ההתקבצות‬ ‫אלגוריתם‬
‫סרטון‬ ‫לכל‬v‫בפחות‬ ‫רחוק‬ ‫הוא‬ ‫(כלומר‬ ‫הקיימות‬ ‫הקבוצות‬ ‫לאחת‬ ‫להשתייך‬ ‫יכול‬ ‫הוא‬ ‫אם‬ ‫בודקים‬
‫מ‬50:)‫הקבוצה‬ ‫מנציג‬ '‫מ‬
o‫איזושהי‬ ‫נקח‬.‫הנתונה‬ ‫הנקודות‬ ‫מקבוצת‬ ‫נקודה‬
o.‫שבחרנו‬ ‫מהנקודה‬ ‫מסוים‬ ‫ברדיוס‬ ‫השכנים‬ ‫הנקודות‬ ‫כל‬ ‫נמצא‬
o.‫שמצאנו‬ ‫השכנים‬ ‫כל‬ ‫עם‬ ‫חדשה‬ ‫נקודות‬ ‫קבוצת‬ ‫נייצר‬
o.‫שייצרנו‬ ‫הקבוצות‬ ‫באחת‬ ‫שאינה‬ ‫כך‬ ‫המקורית‬ ‫הנקודות‬ ‫מקבוצת‬ ‫חדשה‬ ‫נקודה‬ ‫נקח‬
o‫בקבוצה‬ ‫נקודות‬ ‫לנו‬ ‫יישאר‬ ‫שלא‬ ‫עד‬ ‫ושוב‬ ‫שוב‬ ‫השלבים‬ ‫אותם‬ ‫על‬ ‫נחזור‬.‫המקורית‬
.‫סרטונים‬ ‫של‬ )‫(רשימה‬ ‫קבוצות‬ ‫מציגים‬ ‫אנחנו‬ ‫צפופים‬ ‫במקומות‬ ,‫ובך‬
Settings:
‫ה‬ ‫מסך‬-Settings‫האפליקציה‬ ‫הגדרות‬ ‫על‬ ‫האחראי‬ ‫מסך‬ ‫הוא‬.
SettingsActivity:
onLogoutButton‫היא‬ ,‫ההתנתקות‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
onRaduisChange‫מדווחת‬ ‫היא‬ ,‫הרדיוס‬ ‫את‬ ‫משנה‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬-presenter.‫הרדיוס‬ ‫שינוי‬ ‫על‬
onAutoplayChecked‫ה‬ ‫כפתור‬ ‫של‬ ‫המצב‬ ‫את‬ ‫משנה‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :-
Autoplay video‫לה‬ ‫מדווחת‬ ‫והיא‬ ,-presenter.‫המצב‬ ‫שינוי‬ ‫על‬

15. 15
onAutoplayListChecked‫כפתור‬ ‫של‬ ‫המצב‬ ‫את‬ ‫משנה‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫ה‬-Autoplay list‫לה‬ ‫מדווחת‬ ‫והיא‬ ,-presenter.‫המצב‬ ‫שינוי‬ ‫על‬
SettingsPresenter:
logoutRequest‫ה‬ ‫את‬ ‫מוחקת‬ ‫הפונקציה‬ :-session‫ה‬ ‫את‬ ‫סוגרת‬ .‫המכשיר‬ ‫מתוך‬ ‫המשתמש‬ ‫של‬-
session‫של‬.‫הפיסבוק‬ ‫התחברות‬
changeRadius‫בקשות‬ ‫שליחת‬ ‫ובעת‬ ,‫המבוקש‬ ‫הרדיוס‬ ‫את‬ ‫באפליקציה‬ ‫מעדכנת‬ ‫הפונקציה‬ :
.‫הבקשות‬ ‫עם‬ ‫נשלח‬ ‫זה‬ ‫רדיוס‬ ,‫לשרת‬
changeAutoplayState‫ניגון‬ ‫להתחיל‬ ‫האם‬ ,‫הסרטונים‬ ‫ניגון‬ ‫מצב‬ ‫את‬ ‫משנה‬ ‫זו‬ ‫פונקציה‬ :
.‫המשתמש‬ ‫לבחירת‬ ‫אותה‬ ‫להשאיר‬ ‫או‬ ‫הסרטון‬ ‫טעינת‬ ‫אחרי‬ ‫אוטומטי‬
changeAutoplayListState‫את‬ ‫לנגן‬ ‫האם‬ ,‫הסרטונים‬ ‫רשימת‬ ‫ניגון‬ ‫מצב‬ ‫את‬ ‫משנה‬ ‫זו‬ ‫פונקציה‬ :
.‫ביניהם‬ ‫שידפדף‬ ‫למשתמש‬ ‫הבחירה‬ ‫את‬ ‫להשאיר‬ ‫או‬ ‫אוטומטי‬ ‫ברצף‬ ‫הסרטונים‬ ‫רשימת‬
Profile:
‫ה‬ ‫מסך‬-Profile‫הסרטונים‬ ‫כל‬ ‫ובנוסף‬ ,‫עליו‬ ‫הנתונים‬ ‫כל‬ ,‫משתמש‬ ‫כל‬ ‫של‬ ‫האישי‬ ‫הפרופיל‬ ‫את‬ ‫מציג‬
.‫שהעלה‬
ProfileActivity:
onEditProfileButton,‫ההתנתקות‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬ ‫היא‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
openEditProfileActivity‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter,‫עריכת‬ ‫מסך‬ ‫את‬ ‫פותחת‬ ‫היא‬
.‫האישי‬ ‫הפרופיל‬
fillVideosList‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫הסרטונים‬ ‫רשימת‬ ‫את‬ ‫מקבלת‬ ‫היא‬ ,
.‫ברשימה‬ ‫אותם‬ ‫ומציגה‬ ,‫למשתמש‬ ‫ששייכים‬
ProfilePresenter:
openEditProfileRequest‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view,‫האישים‬ ‫הפרטים‬ ‫את‬ ‫טוענת‬ ,
‫מה‬ ‫ומבקשת‬-view.‫האישי‬ ‫הפרופיל‬ ‫עריכת‬ ‫מסך‬ ‫את‬ ‫לפתוח‬
onUserVideosListReceive‫את‬ ‫ומעדכנת‬ ,‫מהשרת‬ ‫עדכונים‬ ‫מקבלים‬ ‫כאשר‬ ‫נקראת‬ ‫הפונקציה‬ :
‫ה‬-view.‫בהתאם‬

16. 16
EditProfile:
‫ה‬ ‫מסך‬-EditProfile.‫שלו‬ ‫האישי‬ ‫הפרופיל‬ ‫לערוך‬ ‫משתמש‬ ‫לכל‬ ‫המאפשר‬ ‫מסך‬ ‫הוא‬
EditProfileActivity:
onSaveButton‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :‫היא‬ ,‫הנתונים‬ ‫שמירת‬ ‫כפתור‬
‫לה‬ ‫מדווחת‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
EditProfilePresenter:
saveInfo‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view.‫האישי‬ ‫בפרופיל‬ ‫והעדכונים‬ ‫השינויים‬ ‫את‬ ‫שומרת‬ ,
Camera:
‫ה‬ ‫מסך‬-Camera.‫הסרטונים‬ ‫את‬ ‫מצלמים‬ ‫הממנו‬ ‫המצלמה‬ ‫מסך‬ ‫הוא‬
CameraActivity
onCaptureButton‫היא‬ ,‫ההקלטה‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
openUploadActivity‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫העלאת‬ ‫מסך‬ ‫את‬ ‫פותחת‬ ‫היא‬ ,
.‫ההקלטה‬ ‫סיום‬ ‫אחרי‬ ‫לשרת‬ ‫הווידאו‬
CameraPresenter
saveVideo‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view,‫הסרטון‬ ‫את‬ ‫שומרת‬ ‫היא‬ ,‫ההקלטה‬ ‫סיום‬ ‫אחרי‬ ,
‫ל‬ ‫ומדווחת‬ ‫המכשיר‬ ‫של‬ ‫הפנימי‬ ‫בזיכרון‬-view.‫השמירה‬ ‫הצלחת‬ ‫על‬

17. 17
Upload:
‫ה‬ ‫מסך‬-upload‫ולשתף‬ ‫לשרת‬ ‫אותו‬ ‫להעלות‬ ‫אפשר‬ ‫ומפה‬ ,‫שצלמנו‬ ‫הסטון‬ ‫את‬ ‫שרואים‬ ‫המסך‬ ‫הוא‬
.‫אותו‬
UploadActivity
onUploadButton‫היא‬ ,‫ההקלטה‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
backToMapActivity‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫ה‬ ‫מסך‬ ‫את‬ ‫סוגרת‬ ‫היא‬ ,-upload
.‫המפה‬ ‫למסך‬ ‫המשתמש‬ ‫את‬ ‫ומחזירה‬
UploadPresenter
uploadVideo‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫ל‬ ‫שהוקלט‬ ‫הסרטון‬ ‫את‬ ‫מעלה‬ ‫היא‬ ,-Amazon s3,
‫ל‬ ‫ומדווחת‬-view.‫סיום‬ ‫בזמן‬
Video:
‫סרטון‬ ‫של‬ ‫קיומו‬ ‫שמראה‬ ‫(סימן‬ ‫המפה‬ ‫על‬ ‫הסימנים‬ ‫אחד‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫נפתח‬ ‫זה‬ ‫מסך‬
.‫הסרטון‬ ‫את‬ ‫רואים‬ ‫זה‬ ‫במסך‬ .)‫בסביבה‬
VideoFragment:
onLikeButton‫ה‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :-like‫מדווחת‬ ‫היא‬ ,
‫לה‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
onCommentButton‫ה‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :-comment,
‫לה‬ ‫מדווחת‬ ‫היא‬-presenter‫בהת‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬.‫אם‬
onUserProfileClick‫של‬ ‫הפרופיל‬ ‫תמונת‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬ ‫היא‬ ,‫הסרטון‬ ‫את‬ ‫שהעלה‬ ‫המשתמש‬-presenter‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
.‫בהתאם‬
likeVideo‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫ה‬ ‫את‬ ‫מעדכמת‬ ‫היא‬ ,-view.‫בהתאם‬

18. 18
openCommentFragment:‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬-presenter.‫התגובות‬ ‫מסך‬ ‫את‬ ‫פותחת‬ ,
openProfileFragment‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫של‬ ‫הפרופיל‬ ‫מסך‬ ‫את‬ ‫פותחת‬ ,
.‫הסרטון‬ ‫את‬ ‫שהעלה‬ ‫המשתמש‬
VideoPresenter:
onVideoLike‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫המשתמש‬ ‫פעולת‬ ‫על‬ ‫השרת‬ ‫את‬ ‫מעדכנת‬ ‫היא‬ ,
(like/unlike.)
onVideoComment‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫עם‬ ‫וחוזרת‬ ,‫שקיימות‬ ‫התגובות‬ ‫את‬ ‫טוענת‬ ,
‫ל‬ ‫הנתונים‬-view.
onProfileOpen‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫המשתמש‬ ‫של‬ ‫האישי‬ ‫הפרופיל‬ ‫את‬ ‫טוענת‬ ,
‫ל‬ ‫הנתונים‬ ‫עם‬ ‫וחוזרת‬ ,‫הנבחר‬-view.
onNewVideoInfoReceive‫מקבל‬ ‫כאשר‬ ‫נקראת‬ ‫הפונקציה‬ :‫את‬ ‫ומעדכנת‬ ,‫מהשרת‬ ‫עדכונים‬ ‫ים‬
‫ה‬-view‫ה‬ ‫מספר‬ ,‫(כגון‬ ,‫בהתאם‬-likes.)‫השתנה‬ ‫הצפיות‬ ‫או‬ ‫,תגובות‬
VideoList:
‫סרטים‬ ‫של‬ ‫קיומם‬ ‫שמראה‬ ‫(סימן‬ ‫המפה‬ ‫על‬ ‫הסימנים‬ ‫אחד‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫נפתח‬ ‫זה‬ ‫מסך‬
‫מרחק‬ ‫עד‬ ,‫לשני‬ ‫אחד‬ ‫שקרובים‬50.‫הסרטון‬ ‫את‬ ‫רואים‬ ‫זה‬ ‫במסך‬ .)‫הקרובה‬ ‫בסביבה‬ ,'‫מ‬
VideoListFragment:
onVideoClick,‫הסרטונים‬ ‫רשימת‬ ‫מתוך‬ ‫סרטון‬ ‫בוחר‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬ ‫היא‬-presenter‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
openVideoFragment‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter.‫הנבחר‬ ‫הסרטון‬ ‫את‬ ‫פותחת‬ ,
VideoListPrensenter:
openVideo‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫הנתונים‬ ‫עם‬ ‫וחוזרת‬ ,‫הנבחר‬ ‫הסרטון‬ ‫את‬ ‫טוענת‬ ,
‫לה‬-view.

19. 19
Comments:
.‫הנצפה‬ ‫הסרטון‬ ‫עבור‬ ‫תגובות‬ )‫למחוק‬ ‫(או‬ ‫להוסיף‬ ‫ניתן‬ ‫זה‬ ‫במסך‬
CommentsFragment:
onSendButton‫התגובה‬ ‫שליחת‬ ‫כפתור‬ ‫על‬ ‫לוחץ‬ ‫המשתמש‬ ‫כאשר‬ ‫מופעלת‬ ‫הזו‬ ‫הפונקציה‬ :
‫לה‬ ‫מדווחת‬ ‫היא‬ ,‫החדשה‬-presenter.‫בהתאם‬ ‫בה‬ ‫שיטפל‬ ‫כדי‬ ‫המשתמש‬ ‫בקשת‬ ‫על‬
addComment‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-presenter‫בה‬ ‫הסרטון‬ ‫על‬ ‫חדשה‬ ‫תגובה‬ ‫מוסיפה‬ ‫היא‬ ,-
view.
CommentsPresenter:
newComment‫ה‬ ‫ע"י‬ ‫נקראת‬ ‫הפונקציה‬ :-view‫בשרת‬ ‫אותה‬ ‫ומעדכנת‬ ,‫התגובה‬ ‫את‬ ‫מקבלת‬ ,
‫ה‬ ‫את‬ ‫ומעדכנת‬-view.‫הצלחה‬ ‫בעת‬
onNewCommentReceive‫סרטון‬ ‫על‬ ‫חדשות‬ ‫תגובות‬ ‫מקבלים‬ ‫כאשר‬ ‫נקראת‬ ‫הפונקציה‬ :
‫ה‬ ‫את‬ ‫ומעדכנת‬ ,‫בו‬ ‫צופים‬ ‫שאנחנו‬-view.‫בהתאם‬

20. 20
‫נתונים‬ ‫בסיסי‬
‫לטבלאות‬ ‫כללי‬ ‫פירוט‬
‫טבלת‬users:
‫כל‬ ‫על‬ ‫הנתונים‬ ‫את‬ ‫מאחסנת‬ ‫היא‬ .‫לאפליקציה‬ ‫שנרשמו‬ ‫המשתמשים‬ ‫רשימת‬ ‫מכילה‬ ‫זו‬ ‫טבלה‬.‫משתמש‬
‫ה‬ ‫שדה‬ ‫באמצעות‬ ‫המשתמשים‬ ‫בין‬ ‫מפרידים‬-userID(Primary Key‫משתמש‬ ‫לכל‬ ‫ייחודי‬ ‫ערך‬ ‫שהוא‬ )
.‫לאפליקציה‬ ‫הראשונה‬ ‫ההרשמה‬ ‫ברגע‬ ‫מהפיסבוק‬ ‫אותו‬ ‫ששולפים‬
‫טבלת‬videos:
‫באמצעות‬ ‫הסרטונים‬ ‫בין‬ ‫מפרידים‬ .‫לאפליקציה‬ ‫שהועלו‬ ‫הסרטונים‬ ‫כל‬ ‫של‬ ‫רשימה‬ ‫מכילה‬ ‫זו‬ ‫טבלה‬
‫ה‬ ‫שדה‬-videoID(Primary Key‫חדש‬ ‫סרטון‬ ‫הוספת‬ ‫בעת‬ ‫אוטומטית‬ ‫שמופק‬ ‫ייחודי‬ ‫ערך‬ ‫שהוא‬ )
.‫לטבלה‬
‫טבלת‬likes:
‫ה‬ ‫כל‬ ‫רשימת‬ ‫מכילה‬ ‫זו‬ ‫טבלה‬-likes‫ה‬ ‫בין‬ ‫מפרידים‬ .‫במערכת‬ ‫הסרטונים‬ ‫כל‬ ‫על‬ ‫שבוצעו‬-likes
‫ה‬ ‫שדה‬ ‫באמצעות‬-likeID(Primary Key‫הוספת‬ ‫בעת‬ ‫אוטומטית‬ ‫שמופק‬ ‫ייחודי‬ ‫ערך‬ ‫שהוא‬ )like‫חדש‬
.‫לטבלה‬
‫טב‬‫לת‬comments:
‫התגובות‬ ‫בין‬ ‫מפרידים‬ .‫במערכת‬ ‫הסרטונים‬ ‫לכל‬ ‫שהוספו‬ ‫התגובות‬ ‫כל‬ ‫רשימת‬ ‫מכילה‬ ‫זו‬ ‫טבלה‬
‫ה‬ ‫שדה‬ ‫באמצעות‬-commentID(Primary Key‫הוספת‬ ‫בעת‬ ‫אוטומטית‬ ‫שמופק‬ ‫ייחודי‬ ‫ערך‬ ‫שהוא‬ )
.‫לטבלה‬ ‫חדשה‬ ‫תגובה‬

21. 21
‫הטבלאות‬ ‫בין‬ ‫הקשרים‬ ‫פירוט‬
1)Videos -> Users
‫ה‬ ‫טבלת‬Videos‫ה‬ ‫את‬ ‫מכילה‬userID‫ולכן‬ ,‫באפליקציה‬ ‫הסרטון‬ ‫את‬ ‫שהעלה‬ ‫המשתמש‬ ‫של‬
‫ה‬ ‫לטבלת‬ ‫ניגשים‬ ‫אנחנו‬ ‫הזה‬ ‫המשתמש‬ ‫על‬ ‫מידע‬ ‫לשלוף‬ ‫שרוצים‬ ‫ברגע‬Users‫ה‬ ‫לפי‬ ‫ומחפשים‬
userID.‫עליו‬ ‫המידע‬ ‫כל‬ ‫את‬ ‫ומקבלים‬
‫הוא‬ ‫כאן‬ ‫הקשר‬M -> 1‫אבל‬ ,‫המשתמש‬ ‫לאותו‬ ‫ששייכים‬ ‫סרטונים‬ ‫כמה‬ ‫שיש‬ ‫להיות‬ ‫יכול‬ ‫כי‬
‫יכול‬ ‫לא‬.‫משתמשים‬ ‫לכמה‬ ‫שייך‬ ‫סרטון‬ ‫שאותו‬ ‫מצב‬ ‫להיות‬
2)Likes -> Videos
‫ה‬ ‫טבלת‬Likes‫ה‬ ‫את‬ ‫מכילה‬videoID‫ה‬ ‫עליו‬ ‫שבוצע‬ ‫הסרטון‬ ‫של‬like.
‫איזה‬ ‫לדעת‬ ‫וכדי‬ ‫מסוים‬ ‫סרטון‬ ‫טעינת‬ ‫בעת‬ ‫ולכן‬likes‫ה‬ ‫בטבלת‬ ‫מחפשים‬ ‫אז‬ ,‫עליו‬ ‫בוצעו‬
Likes‫ה‬ ‫לפי‬videoID.
‫הוא‬ ‫כאן‬ ‫הקשר‬M -> 1‫הרבה‬ ‫להיות‬ ‫יכול‬ ‫כי‬likes‫שאותו‬ ‫להיות‬ ‫יכול‬ ‫לא‬ ‫אבל‬ ‫הסרטון‬ ‫לאותו‬
‫ה‬like.‫סרטונים‬ ‫לכמה‬
3)Likes -> Users
‫ה‬ ‫טבלת‬Likes‫ה‬ ‫את‬ ‫מכילה‬userID‫ה‬ ‫את‬ ‫שביצע‬ ‫המשתמש‬ ‫של‬like.‫מסוים‬ ‫סרטון‬ ‫עבור‬
‫הוא‬ ‫כאן‬ ‫הקשר‬M -> 1‫הרבה‬ ‫שקיימים‬ ‫להיות‬ ‫יכול‬ ‫כי‬likes‫אבל‬ ,‫המשתמש‬ ‫לאותו‬ ‫ששייכים‬
‫ה‬ ‫שאותו‬ ‫להיות‬ ‫יכול‬ ‫לא‬like.‫משתמשים‬ ‫לשני‬ ‫שייך‬
4)Comments -> Videos
‫ה‬ ‫טבלת‬Comments‫ה‬ ‫את‬ ‫מכילה‬videoID.‫התגובה‬ ‫שייכת‬ ‫שאליו‬ ‫הסרטון‬ ‫של‬
‫ה‬ ‫בטבלת‬ ‫מחפשים‬ ‫אז‬ ,‫אליו‬ ‫הוספו‬ ‫תגובות‬ ‫איזה‬ ‫לדעת‬ ‫וכדי‬ ‫מסוים‬ ‫סרטון‬ ‫טעינת‬ ‫בעת‬ ‫ולכן‬-
Comments‫ה‬ ‫לפי‬videoID.
‫הוא‬ ‫כאן‬ ‫הקשר‬M -> 1‫להיות‬ ‫יכול‬ ‫לא‬ ‫אבל‬ ‫הסרטון‬ ‫לאותו‬ ‫תגובות‬ ‫הרבה‬ ‫להיות‬ ‫יכול‬ ‫כי‬
.‫שונים‬ ‫סרטונים‬ ‫לשני‬ ‫שייכת‬ ‫תגובה‬ ‫שאותה‬
5)Comments -> Users
‫ה‬ ‫טבלת‬Comments‫ה‬ ‫את‬ ‫מכילה‬userID.‫מסוים‬ ‫סרטון‬ ‫על‬ ‫שהגיב‬ ‫המשתמש‬ ‫של‬
‫הוא‬ ‫כאן‬ ‫הקשר‬M -> 1‫יכו‬ ‫לא‬ ‫אבל‬ ‫סרטונים‬ ‫לכמה‬ ‫הגיב‬ ‫מסוים‬ ‫שמשתמש‬ ‫להיות‬ ‫יכול‬ ‫כי‬‫להיות‬ ‫ל‬
.‫משתמשים‬ ‫לכמה‬ ‫שייכת‬ ‫התגובה‬ ‫שאותה‬ ‫מצב‬

22. 22
‫לקוח‬ ‫אינטראקציית‬-‫שרת‬
‫ה‬ ‫בצד‬-client‫מנגנון‬ ‫מומש‬listeners‫זה‬ ‫מנגנון‬ .
( ‫הצופה‬ ‫תבנית‬ ‫את‬ ‫מממש‬Observer Design
Pattern.)
‫צופה‬ ‫תבנית‬‫הייחוס‬ ‫אובייקט‬ ‫שבה‬ ‫עיצוב‬ ‫תבנית‬ ‫היא‬ ,
‫אשר‬ ‫אליו‬ ‫מקושרים‬ ‫אובייקטים‬ ‫של‬ ‫רשימה‬ ‫מחזיק‬
‫הייחוס‬ ‫אובייקט‬ .‫לגביו‬ ‫צופה‬ ‫נקרא‬ ‫מהם‬ ‫אחד‬ ‫כל‬
‫ידי‬ ‫על‬ ‫כלל‬ ‫בדרך‬ ,‫צורך‬ ‫בעת‬ ‫עליו‬ ‫לצופים‬ "‫"מודיע‬
.‫שלהם‬ ‫מהפונקציות‬ ‫לאחת‬ ‫קריאה‬
‫באפליקציה‬ ‫מסך‬ ‫שכל‬ ‫כך‬ ‫זה‬ ‫במנגנון‬ ‫השתמשנו‬
‫הוא‬ ,‫אמת‬ ‫בזמן‬ ‫מתעדכן‬ ‫או‬ ‫מהשרת‬ ‫נתונים‬ ‫שמקבל‬
‫למחלקת‬ ‫נרשם‬Client‫כל‬ ‫את‬ ‫מעבירה‬ ‫בתורה‬ ‫שהיא‬
‫ו‬ ‫לשרת‬ ‫הבקשות‬.‫ממנו‬ ‫העדכונים‬ ‫כל‬ ‫את‬ ‫מקבלת‬
,‫מהשרת‬ ‫עדכונים‬ ‫או‬ ‫תשובות‬ ‫שמקבלים‬ ‫בזמן‬ ,‫ואז‬
‫מחלקת‬Client‫ה‬ ‫כל‬ ‫את‬ ‫מעדכנת‬-views)‫(הצופים‬
.‫אתחולם‬ ‫בזמן‬ ‫אליה‬ ‫שנרשמו‬

23. 23
‫עיצוב‬
‫משתמש‬ ‫ממשק‬(UI)

24. 24

25. 25

26. 26

27. 27
‫פיתוח‬ ‫שיקולי‬
‫טכנולוגיות‬‫צד‬-‫שרת‬
Node.js‫היא‬‫שפה‬‫חדשה‬‫יחסית‬(2009)‫שהשימוש‬‫בה‬‫התרחב‬‫מאוד‬‫בשנים‬‫האחרונות‬‫והיה‬
‫לנו‬‫חשוב‬‫ללמוד‬‫טכנולוגיות‬‫חדשות‬‫ועדכניות‬‫דרך‬‫הפרויקט‬,‫לכן‬‫העדפנו‬‫אותה‬‫ע‬"‫פ‬‫שפות‬‫צד‬-
‫שרת‬‫אחרות‬‫וותיקות‬‫יותר‬‫כגון‬PHP, JAVA, Python‫אע‬"‫פ‬‫שהן‬‫מבוססות‬‫יותר‬.
‫מכיוון‬‫ש‬-Node.js‫כוללת‬‫באופן‬‫מובנה‬‫ספריות‬Web,‫ניתן‬‫ליצור‬‫שרת‬‫בסיסי‬‫בשורות‬‫קוד‬
‫ספורות‬,‫ללא‬‫צורך‬‫בתכנת‬‫שרת‬‫ייעודית‬‫וכבדה‬.
‫מהירות‬‫ו‬-Scalability:Node.js‫היא‬‫שפה‬‫מונחית‬‫אירועים‬‫ואסינכרונית‬,‫מה‬‫שמאפשר‬‫לה‬
‫לטפל‬‫בבקשות‬I/O,‫ובפרט‬‫בבקשות‬‫רשת‬,‫באופן‬‫מהיר‬,Non-Blocking,‫בתהליך‬‫יחיד‬‫ללא‬
‫צורך‬‫בת‬'‫רד‬‫נפרד‬‫עבור‬‫כל‬‫חיבור‬‫חדש‬,‫ולכן‬‫השרת‬‫יכול‬‫לנהל‬‫אלפי‬‫חיבורים‬‫במקביל‬‫ללא‬
‫יצירת‬‫עומס‬‫על‬‫המערכת‬.
‫שימוש‬‫ב‬-WebSockets:‫זהו‬‫פרוטוקול‬‫תקשורת‬‫המאפשר‬‫לבצע‬‫תקשורת‬‫דו‬-‫כיוונית‬‫על‬‫גבי‬
‫חיבור‬‫בודד‬‫שנשאר‬‫פתוח‬‫לכל‬‫אורך‬‫ההתקשרות‬‫ובו‬‫כל‬‫צד‬‫יכול‬‫לשלוח‬‫מידע‬‫לצד‬‫השני‬(‫לאחר‬
‫שהלקוח‬‫יזם‬‫חיבור‬,)‫בניגוד‬‫ל‬-HTTP‫שבו‬‫הלקוח‬‫שולח‬‫בקשות‬‫והשרת‬‫מגיב‬‫להן‬‫בלבד‬,‫ואינו‬
‫יכול‬‫ליזום‬‫הודעות‬‫בעצמו‬.‫התקשורת‬‫מתבצעת‬‫ישירות‬‫מעל‬‫פרוטוקול‬TCP(‫שכבת‬
‫התעבורה‬)‫ואינה‬‫מצריכה‬‫שימוש‬‫ב‬-HTTP.‫בפרויקט‬‫זה‬‫השתמשנו‬‫בספריית‬Socket.IO,
‫ספרייה‬‫פופולרית‬‫ומהירה‬‫התומכת‬‫במספר‬‫קב‬‫של‬‫פלטפורמות‬‫ומאפשרת‬‫תקשורת‬‫בזמן‬-
‫א‬‫מת‬‫באמצעות‬WebSockets‫ומאפשרת‬‫בין‬‫השאר‬‫דחיפת‬‫נוטיפקציות‬‫ללקוח‬.
‫עוד‬‫כמה‬‫נתונים‬‫מעניינים‬:
‫חברת‬Paypal‫החליטה‬‫לעבור‬‫מ‬-Java‫ל‬-Node.js‫במסגרת‬‫עדכון‬‫המערכת‬‫שלהם‬.‫הם‬
‫החליטו‬‫להתחיל‬‫עם‬‫התכנית‬‫האחראית‬‫להצגת‬‫מצב‬‫החשבון‬‫של‬‫המשתמשים‬–‫אחד‬‫החלקים‬
‫העמוסים‬‫יותר‬‫באתרת‬‫ועל‬-‫מנת‬‫למזער‬‫סיכונים‬‫הם‬‫הקצו‬‫שני‬‫צוותי‬‫פיתוח‬‫מקבילים‬
‫למשימה‬–‫צוות‬‫פיתוח‬‫ב‬-Node.js‫וצוות‬‫פיתוח‬‫ב‬-Java‫למקרה‬‫שמשהו‬‫ישתבש‬.‫צוות‬
‫הפיתוח‬‫ב‬-Java‫החל‬‫את‬‫עבודתו‬‫בחודש‬‫ינואר‬‫ומנה‬5‫מתכנתים‬‫והצוות‬‫השני‬‫החל‬‫את‬
‫עבודתו‬‫חודשיים‬‫מאוחר‬‫יותר‬,‫במרץ‬,‫ומנה‬2‫מתכנתים‬‫בלבד‬.‫בחודש‬‫יוני‬,‫שני‬‫הצוותים‬
‫סיימו‬‫את‬‫עבודתם‬‫והתברר‬‫כי‬:
1.‫אפליקציית‬‫ה‬-Node.JS‫נבנתה‬‫במהירות‬‫כמעט‬‫כפולה‬‫מאפליקציית‬‫ה‬-Java‫עם‬‫מספר‬
‫מפתחים‬‫קטן‬‫בחצי‬.
2.‫התכנית‬‫מנתה‬33%‫פחות‬‫שורות‬‫קוד‬‫לעומת‬Java.
3.‫מספר‬‫הקבצים‬‫הנדרש‬‫היה‬‫קטן‬‫ב‬-40%.
‫כמו‬-‫כן‬,‫החברה‬‫עשתה‬‫מבחני‬‫ביצועים‬‫לשתי‬‫התכניות‬‫והתוצאות‬‫היו‬:
1.‫התכנית‬‫שנכתבה‬‫ב‬-Node.js‫הצליחה‬‫לטפל‬‫במספר‬‫כפול‬‫של‬‫בקשות‬‫לשנייה‬‫לעומת‬
‫התכנית‬‫שנכתבה‬‫ב‬-.Java
2.‫זמן‬‫התגובה‬‫הממוצע‬‫היה‬‫קטן‬‫ב‬-35%(200ms‫מהיר‬‫יותר‬.)
(‫הנתונים‬‫נלקחו‬‫מבלוג‬‫הפיתוח‬‫של‬PayPal–)‫בביבליוגרפיה‬ ‫קישור‬.
‫שמות‬‫בולטים‬‫נוספים‬‫חוץ‬‫מ‬-PayPal‫שעברו‬‫לפיתוח‬‫ב‬-Node.js‫עבור‬‫מערכות‬‫גדולות‬
‫ומורכבות‬‫הם‬:
Netflix, LinkedIn, Uber, Pinterest, Yahoo!, New York Times‫ועוד‬.

28. 28
‫טכנולוגיות‬‫צד‬-‫לקוח‬
FacebookSDK:‫כי‬ ‫פייסבוק‬ ‫בשירותי‬ ‫השתמשנו‬ :
1.‫מבטיח‬‫כיום‬‫המשתמש‬,‫ובזה‬‫חוסך‬‫לנו‬‫כל‬‫עניין‬‫הווידוי‬‫אם‬‫המשתמש‬‫קיים‬‫או‬‫לא‬.
2.‫הסתמכנו‬‫על‬‫הנתונים‬‫הבסיסים‬‫של‬‫כל‬‫משתמש‬‫כדי‬‫לבנות‬‫את‬‫הפרופיל‬‫האישי‬(‫תמונה‬,
‫שם‬,‫וכו‬.)'
MapboxSDK:‫השתמשנו‬‫בשירותי‬Mapbox‫כי‬:
1.‫חיפשנו‬‫שירותי‬‫מפות‬‫קלים‬‫שלא‬‫יצטרכו‬‫משאבים‬‫גדולים‬(‫לעומת‬‫מפות‬‫גוגל‬.)
2.‫ניתן‬‫לערוך‬‫ולעצב‬‫אותם‬‫כרצוננו‬.
‫אופן‬‫אחסון‬‫והגשת‬‫הסרטונים‬
‫התלבטנו‬‫בין‬‫מספר‬‫אפשרויות‬‫עבור‬‫אחסון‬,‫העלאת‬‫והגשת‬‫הסרטונים‬:
1.‫שימוש‬‫בשרת‬‫יחיד‬‫עבור‬‫ניהול‬‫הנתונים‬‫ואחסון‬‫הסרטונים‬.
2.‫שימוש‬‫בשירות‬‫אחסון‬‫חיצוני‬‫והעברת‬‫הסרטונים‬‫אליו‬‫מהאפליקציה‬‫דרך‬‫השרת‬.
3.‫שימוש‬‫בשירות‬‫אחסון‬‫חיצוני‬‫עבור‬‫הסרטונים‬‫ושמירת‬‫קישורים‬‫בלבד‬‫בשרת‬.
‫את‬‫האפשרות‬‫הראשונה‬‫פסלנו‬‫מהסיבה‬‫שפעולות‬‫ההעלאה‬‫וההורדה‬‫של‬‫הסרטונים‬‫היו‬‫מעמיסות‬‫על‬
‫השרת‬‫מאוד‬‫מבחינת‬I/O‫ופוגעות‬‫בתקשורת‬‫השוטפת‬‫עם‬‫הלקוחות‬.
‫האופציה‬‫השנייה‬‫עלתה‬‫מכיוון‬‫שלא‬‫רצינו‬‫לשלב‬‫הרשאות‬‫לשירות‬AWS‫של‬‫אמזון‬‫בקוד‬
‫האפליקציה‬,‫מה‬‫שיאפשר‬‫ניצול‬‫לרעה‬‫של‬‫השירות‬‫ע‬"‫י‬‫תוקפים‬,‫וכדי‬‫לוודא‬‫שתהליך‬‫ההעלאת‬
‫הסרטונים‬‫יהיה‬‫מפוקח‬‫ע‬"‫י‬‫השרת‬‫כדי‬‫למנוע‬‫חוסר‬‫עקביות‬‫במערכת‬‫במקרה‬‫של‬‫כשל‬‫באפליקציה‬‫או‬
‫בתקשורת‬‫בזמן‬‫העלאת‬‫הסרטון‬.‫אפשרות‬‫זו‬‫נפסלה‬‫גם‬‫היא‬‫מאותה‬‫הסיבה‬‫שבגינה‬‫פסלנו‬‫את‬
‫האפשרות‬‫הראשונה‬.
‫לאחר‬"‫חפירה‬"‫בתיעוד‬‫של‬AWS,‫גילינו‬‫שישנן‬‫אפשרויות‬‫לניהול‬‫ומתן‬‫הרשאות‬‫בדרך‬‫בטיחותית‬
‫שאינה‬‫מחייבת‬‫שילוב‬‫של‬‫ה‬-Credentials‫בקוד‬‫ולכן‬‫החלטנו‬‫לממש‬‫את‬‫האפשרות‬‫השלישית‬,‫כך‬
‫שהלקוח‬‫יעלה‬‫ויוריד‬‫את‬‫הסרטונים‬‫ישירות‬‫מ‬-S3‫של‬‫אמזון‬‫והשרת‬‫רק‬‫יפקח‬‫על‬‫הפעולה‬‫ויאחסן‬‫את‬
‫הקישור‬‫לסרטון‬‫במסד‬-‫הנתונים‬.
‫בחרנו‬‫להשתמש‬‫בשירות‬S3‫אמזון‬‫מכיוון‬‫שהוא‬‫גמיש‬,‫יעיל‬‫וזול‬‫עבור‬‫אחסון‬‫ותעבורה‬‫של‬‫קבצים‬
‫גדולים‬‫וכמו‬-‫כן‬‫מכיוון‬‫שהתנסינו‬‫בשירות‬‫זה‬‫וב‬-AWS‫בכלל‬‫בעבר‬.

29. 29
‫מסקנות‬,‫לעתיד‬ ‫ושיפורים‬ ‫שנלמדו‬ ‫לקחים‬

30. 30
‫ביבליוגרפיה‬
SocketIO.‫והלקוח‬ ‫השרת‬ ‫בין‬ ‫להתחברות‬ ‫בה‬ ‫שהשתמשנו‬ ‫התקשורת‬ ‫ספריית‬ ‫היא‬ :
http://socket.io/docs
Android developers‫הפיתוח‬ ‫כל‬ ‫לאורך‬ ‫בו‬ ‫שנעזרנו‬ ‫הרשמי‬ ‫האנדרואיד‬ ‫אתר‬ :
https://developer.android.com/guide/index.html
Mapbox‫המפות‬ ‫שירות‬ :.‫בהם‬ ‫שהשתמשנו‬
https://www.mapbox.com/android-sdk
Hierarchical greedy clustering.‫אותו‬ ‫שממשנו‬ ‫ההתקבצות‬ ‫אלגוריתם‬ ‫זה‬ :
https://www.mapbox.com/blog/supercluster
Paypal site:.‫פיתוח‬ ‫שיקולי‬ ‫לצרכי‬ ‫בו‬ ‫נעזרנו‬
https://www.paypal-engineering.com/2013/11/22/node-js-at-paypal
‫בה‬ ‫שהשתמשנו‬ ‫עיצוב‬ ‫תבניות‬.‫ן‬
https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93presenter
https://en.wikipedia.org/wiki/Observer_pattern