1
00:00:00,000 --> 00:00:03,388
>> [संगीत खेल]

2
00:00:03,388 --> 00:00:09,196

3
00:00:09,196 --> 00:00:10,180
>> डेविड जे Malan: नमस्कार।

4
00:00:10,180 --> 00:00:12,600
के माध्यम से एक चल ले चलो
समस्या सेट 8 मैशप,

5
00:00:12,600 --> 00:00:15,880
जो करने के लिए आप को चुनौती देने के लिए जा रहा है
गूगल मैप्स के लिए तत्वों पर आकर्षित

6
00:00:15,880 --> 00:00:20,905
गूगल समाचार और मुहब्बत से तत्वों के साथ
एक साथ एक वेब एप्लेट में उन्हें लगता है कि

7
00:00:20,905 --> 00:00:24,150
एक उपयोगकर्ता की खोज करने की अनुमति देता है
स्थानीय समाचार के लिए एक नक्शा

8
00:00:24,150 --> 00:00:26,780
विशिष्ट शहरों के लिए,
शहरों, और ज़िप कोड।

9
00:00:26,780 --> 00:00:31,040
ऐसा करने के लिए, हम करने जा रहे हैं
कुछ HTML एकीकृत, सीएसएस, पीएचपी, एसक्यूएल,

10
00:00:31,040 --> 00:00:34,390
जावास्क्रिप्ट, और एक तकनीक
आम तौर पर आदेश में AJAX के रूप में जाना जाता है

11
00:00:34,390 --> 00:00:36,850
इस immersive बनाने के लिए
उपयोगकर्ता अनुभव।

12
00:00:36,850 --> 00:00:38,920
>> की पहली गूगल मैप्स के लिए ही करते हैं।

13
00:00:38,920 --> 00:00:41,220
यह, ज़ाहिर है, शायद है
एक परिचित इंटरफ़ेस।

14
00:00:41,220 --> 00:00:45,070
लेकिन यह पता चला है कि गूगल मैप्स
यह भी एक API-- आवेदन प्रदान करता है

15
00:00:45,070 --> 00:00:48,360
interface-- प्रोग्रामिंग जो के माध्यम से
आप गूगल मैप्स के तत्वों को ले जा सकते हैं

16
00:00:48,360 --> 00:00:50,740
और में उन्हें एकीकृत
अपने खुद के अनुप्रयोगों।

17
00:00:50,740 --> 00:00:52,650
दरअसल, भर में इस
प्रक्रिया है, आप जा रहे हैं

18
00:00:52,650 --> 00:00:55,140
यूआरएल के एक जोड़े को खोजने के लिए
कि विशेष रूप से उपयोगी

19
00:00:55,140 --> 00:00:57,820
में उल्लेख कर रहे हैं
समस्या सेट 8 के लिए विशिष्टता,

20
00:00:57,820 --> 00:01:00,980
विशेष रूप से इस प्रारंभ करना
गाइड या डेवलपर की मार्गदर्शिका

21
00:01:00,980 --> 00:01:07,640
गूगल मैप्स एपीआई संस्करण 3 के रूप में अच्छी तरह से करने के लिए
गूगल मैप्स जावास्क्रिप्ट एपीआई के रूप में

22
00:01:07,640 --> 00:01:10,260
एक है जो V3 संदर्भ,
पढ़ने के लिए थोड़ा और अधिक रहस्यमय

23
00:01:10,260 --> 00:01:14,600
लेकिन वास्तव में निचले स्तर के सभी है
क्या कार्य या विधियों के बारे में जानकारी

24
00:01:14,600 --> 00:01:18,220
और वस्तुओं और संपत्तियों और
घटनाओं वास्तव में एपीआई के साथ आते हैं,

25
00:01:18,220 --> 00:01:20,720
भावना में बहुत समान
[अश्राव्य] पृष्ठों के लिए।

26
00:01:20,720 --> 00:01:23,480
>> अब हम एक नज़र रखना अगर
गूगल समाचार में, तुम हूँ

27
00:01:23,480 --> 00:01:25,370
शायद यहाँ एक परिचित इंटरफ़ेस देखते हैं।

28
00:01:25,370 --> 00:01:29,350
लेकिन यह आप भी खोज कर सकते हैं पता चला है
विशिष्ट भौगोलिक लिए Google समाचार

29
00:01:29,350 --> 00:01:32,000
भू बुलाया एक HTTP पैरामीटर के माध्यम से।

30
00:01:32,000 --> 00:01:35,100
वास्तव में, मैं ज़ूम में अगर
यहाँ, आप देखेंगे कि

31
00:01:35,100 --> 00:01:41,672
मैं पर हूँ
news.google.com/news/section?geo=02138।

32
00:01:41,672 --> 00:01:43,630
और, वास्तव में, मैं ज़ूम
बाहर, तुम मैं कर रहा हूँ कि देखेंगे

33
00:01:43,630 --> 00:01:47,090
की एक पूरी गुच्छा के साथ एक पृष्ठ पर देख रहे हैं
कैम्ब्रिज, मैसाचुसेट्स के बारे में विचार।

34
00:01:47,090 --> 00:01:50,620
>> इस बीच, मैं वास्तव में बदलते हैं
यूआरएल, इस तरह से एक ज़िप कोड होने के लिए नहीं

35
00:01:50,620 --> 00:01:55,580
लेकिन एक छोटी सी मेसियर कुछ
कैम्ब्रिज + मैसाचुसेट्स की तरह,

36
00:01:55,580 --> 00:02:00,740
प्लस तरीका है, जहां आप एक सांकेतिक शब्दों में बदलना
एक यूआरएल में अंतरिक्ष चरित्र और हिट दर्ज करें,

37
00:02:00,740 --> 00:02:02,907
आप वास्तव में लगता है कि मैं देख रहा हूँ
लगभग एक ही खबर को देखते हैं।

38
00:02:02,907 --> 00:02:05,489
शायद यह एक छोटा सा अलग है
कैम्ब्रिज वास्तव में, क्योंकि

39
00:02:05,489 --> 00:02:06,910
एकाधिक ज़िप कोड है।

40
00:02:06,910 --> 00:02:09,410
अब मैं कैसे पता है कि और होता,
वास्तव में, कैसे किसी भी तरह मैं कर सकता

41
00:02:09,410 --> 00:02:12,940
शहरों और कस्बों टाई
मामले में मैं ज़िप कोड को

42
00:02:12,940 --> 00:02:15,064
उपयोगकर्ता की अनुमति देना चाहते
या तो ऊपर देखने के लिए?

43
00:02:15,064 --> 00:02:17,480
खैर, यह है कि वहाँ पता चला है
एक वेबसाइट को वहाँ से बाहर बुलाया

44
00:02:17,480 --> 00:02:20,060
geonames.org जो है
एक पहल है करने के लिए

45
00:02:20,060 --> 00:02:23,760
सभी की एक स्वतंत्र रूप से उपलब्ध डेटाबेस
भौगोलिक जानकारी के प्रकार,

46
00:02:23,760 --> 00:02:27,040
न केवल अमेरिका के लिए, लेकिन यह भी
अन्य देशों के लिए के रूप में अच्छी तरह से।

47
00:02:27,040 --> 00:02:30,430
वास्तव में, मैं यहाँ इस यूआरएल पर जाने के लिए अगर जो
यह भी सेट समस्या में उल्लेख किया गया है

48
00:02:30,430 --> 00:02:34,510
विनिर्देश, आप इसे तीन देखेंगे
ज़िप फ़ाइलों की एक पूरी गुच्छा की लिस्टिंग

49
00:02:34,510 --> 00:02:36,400
जिनमें से किसी भी आप से डाउनलोड किया जा सकता है।

50
00:02:36,400 --> 00:02:39,900
वास्तव में, इस समस्या के लिए निर्धारित
आप us.zip डाउनलोड करने के लिए जा रहे हैं।

51
00:02:39,900 --> 00:02:43,790
अब इस फाइल के भीतर, एक पूरी है
पाठ स्वरूप में डेटा का गुच्छा।

52
00:02:43,790 --> 00:02:47,760
फ़ाइलों को एक करने के लिए बहुत समान है
CSV-- कॉमा मान अलग file--

53
00:02:47,760 --> 00:02:51,294
लेकिन यह वास्तव में उपयोग करता है
टैब क्षेत्रों हदबंदी करना।

54
00:02:51,294 --> 00:02:53,710
अब, इस बीच, अगर तुम देखो
यहाँ मैं प्रकाश डाला है पर,

55
00:02:53,710 --> 00:02:56,459
इस फाइल में खेतों जा रहे हैं
देश कोड की तरह बातें होने के लिए,

56
00:02:56,459 --> 00:02:58,980
डाक कोड, जगह नाम,
और फिर, किसी न किसी रूप में

57
00:02:58,980 --> 00:03:04,230
या अन्य, राज्यों और देशों,
समुदायों, और अधिक।

58
00:03:04,230 --> 00:03:06,630
वास्तव में, मैं पहले से ही है
अग्रिम में इस फाइल को डाउनलोड किया।

59
00:03:06,630 --> 00:03:09,750
मुझे आगे चलते हैं और here-- इसे खोलने
दरअसल, तुम हूँ, us.text-- और

60
00:03:09,750 --> 00:03:16,660
मैं 16,792 लाइन करने के लिए नीचे स्क्रॉल अगर देखना
आप, कैम्ब्रिज के लिए कुछ रिकॉर्ड देखेंगे

61
00:03:16,660 --> 00:03:19,120
मैसाचुसेट्स और इसके विभिन्न ज़िप कोड।

62
00:03:19,120 --> 00:03:22,150
क्या आप भी वहाँ देखते हैं, काउंटी है
मैं वास्तव में नहीं है कि कुछ संख्या

63
00:03:22,150 --> 00:03:24,500
यह भी सभी को समझते हैं, लेकिन
सही रास्ते पर,

64
00:03:24,500 --> 00:03:27,170
कुछ जीपीएस coordinates--
अक्षांश और देशांतर।

65
00:03:27,170 --> 00:03:30,440
इस महान है में से एक है क्योंकि
गूगल मैप्स एपीआई की विशेषताएं

66
00:03:30,440 --> 00:03:33,670
पता लगाने की क्षमता है
आप भौगोलिक रूप से कर रहे हैं, जहां

67
00:03:33,670 --> 00:03:36,850
जीपीएस निर्देशांक के संदर्भ में।

68
00:03:36,850 --> 00:03:40,210
>> अब देखते हैं कि कैसे करने के लिए बाहर निकालने के लिए शुरू करते हैं
एक साथ इन बातों को बांधने शुरू करते हैं।

69
00:03:40,210 --> 00:03:42,900
हम आपको एक पूरे दिया है
वितरण कोड का गुच्छा,

70
00:03:42,900 --> 00:03:44,970
के रूप में अच्छी तरह से MySQL डाटाबेस के रूप में।

71
00:03:44,970 --> 00:03:49,100
मैं खींच वास्तव में, यदि एक phpMyAdmin होने
पहले से ही आयातित, आप जल्द ही के रूप में होगा,

72
00:03:49,100 --> 00:03:54,800
pset8.SQL, आप एक MySQL तालिका देखेंगे कि
इस तरह दिखता है, एक आईडी क्षेत्र, देश

73
00:03:54,800 --> 00:03:57,400
कोड, पोस्टल कोड, जगह का नाम और अधिक।

74
00:03:57,400 --> 00:04:00,490
उन सभी के प्रकार
कॉलम मैं बस व्युत्पन्न

75
00:04:00,490 --> 00:04:03,870
readme.text पढ़ने के द्वारा
निर्दिष्ट है कि यहाँ फ़ाइल

76
00:04:03,870 --> 00:04:07,330
एक क्षेत्र एक पूर्णांक है, चाहे
या varchar या पसंद है।

77
00:04:07,330 --> 00:04:10,510
>> तो हम उस मेज के लिए बनाया गया है
आप और आप SQL आदेश दिया

78
00:04:10,510 --> 00:04:12,770
कि बनाने के लिए निष्पादित करने के लिए
अपने खुद के डेटाबेस में मेज,

79
00:04:12,770 --> 00:04:15,290
लेकिन अभी तक वास्तव में इसमें कोई डेटा नहीं है।

80
00:04:15,290 --> 00:04:19,600
बल्कि, आप करने के लिए जा रहे हैं
us.zip डाउनलोड या किसी भी देश की ज़िप

81
00:04:19,600 --> 00:04:21,500
वहाँ उस URL से फ़ाइल।

82
00:04:21,500 --> 00:04:24,940
और फिर तुम लिखने के लिए जा रहे हैं
है कि PHP में एक कमांड लाइन स्क्रिप्ट

83
00:04:24,940 --> 00:04:28,420
उस पाठ को खोलने के लिए जा रहा
फ़ाइल अपने लाइनों पर पुनरावृति,

84
00:04:28,420 --> 00:04:31,180
और उसके बाद से प्रत्येक के लिए
उन पंक्तियों के एक डालने करना

85
00:04:31,180 --> 00:04:34,940
उस तालिका स्थानों में
अपने MySQL डेटाबेस में।

86
00:04:34,940 --> 00:04:37,880
इस प्रक्रिया के अंत में, आप होगी
अंततः है कि स्क्रिप्ट चलाने के लिए है

87
00:04:37,880 --> 00:04:39,610
सिर्फ एक बार सिद्धांत में।

88
00:04:39,610 --> 00:04:41,780
हकीकत में तो आप शायद हूँ
यह समय का एक गुच्छा चलाने

89
00:04:41,780 --> 00:04:45,460
जबकि विभिन्न कीड़ों को ठीक करने के लिए कोशिश कर रहा।

90
00:04:45,460 --> 00:04:48,440
>> अंत में, आप एक के लिए जा रहे हैं
हजारों के साथ वास्तव में बड़ा डेटाबेस

91
00:04:48,440 --> 00:04:50,139
भौगोलिक पंक्तियों की और हजारों।

92
00:04:50,139 --> 00:04:52,930
तो फिर आपको लगता है कि आयात डाल करने के लिए जा रहे हैं
स्क्रिप्ट एक तरफ यह काम कर रहा है एक बार

93
00:04:52,930 --> 00:04:55,140
और अपने डेटाबेस अच्छा है
और सही, और फिर

94
00:04:55,140 --> 00:04:58,880
आप वास्तव में करने के लिए पर स्थानांतरित करने के लिए जा रहे हैं
मैशप खुद को लागू करने।

95
00:04:58,880 --> 00:05:01,670
मैशप देखने के लिए जा रहा है
इस तरह एक छोटे से कुछ।

96
00:05:01,670 --> 00:05:05,165
Mashup.cs50.net में, हम
एक कर्मचारी के समाधान है

97
00:05:05,165 --> 00:05:06,990
कि इस तरह एक छोटे से कुछ लग रहा है।

98
00:05:06,990 --> 00:05:11,070
दरअसल, मैं इस अखबार पर क्लिक करते हैं
कैम्ब्रिज, मैसाचुसेट्स के लिए चिह्न,

99
00:05:11,070 --> 00:05:13,300
आप एक कताई देखेंगे
संक्षेप में और फिर आइकन

100
00:05:13,300 --> 00:05:16,370
एक का आदेश दिया सूची, एक
लेख के बुलेटेड सूची

101
00:05:16,370 --> 00:05:18,280
कैम्ब्रिज, मैसाचुसेट्स से संबंधित है।

102
00:05:18,280 --> 00:05:20,352
मैं Charlestown पर क्लिक करते हैं,
मैसाचुसेट्स,

103
00:05:20,352 --> 00:05:21,685
मुझे लगता है कि शहर के लिए एक ही देखेंगे।

104
00:05:21,685 --> 00:05:24,174
और मैं पर क्लिक करते हैं
Watertown, मैसाचुसेट्स,

105
00:05:24,174 --> 00:05:26,090
वहाँ कोई नहीं हो सकता है
वाटरटाउन से की खबर है,

106
00:05:26,090 --> 00:05:28,630
इसलिए यदि आप कुछ देखेंगे
धीमी समाचार दिन की तरह।

107
00:05:28,630 --> 00:05:32,140
>> अब, इस बीच, ऊपर छोड़ दिया पर हैं
कुछ परिचित गूगल मैप्स नियंत्रण

108
00:05:32,140 --> 00:05:34,980
, पैन आप बाहर ज़ूम जाने के लिए
ऊपर, नीचे, बाएँ, और सही,

109
00:05:34,980 --> 00:05:37,360
लेकिन हम भी वहाँ रखा है कि एक खोज बॉक्स।

110
00:05:37,360 --> 00:05:40,910
तो मैं स्पष्ट रूप से, के लिए खोज करते हैं,
मैं जानता हूँ कि केवल अन्य ज़िप कोड,

111
00:05:40,910 --> 00:05:45,020
90210, हम वास्तव में देखेंगे
बेवर्ली हिल्स, कैलिफोर्निया।

112
00:05:45,020 --> 00:05:48,550
क्लिक किया जब यह करने के लिए मुझे सुराग
कैलिफोर्निया और एक पूरी गुच्छा

113
00:05:48,550 --> 00:05:50,369
बेवर्ली हिल्स के बारे में खबर की।

114
00:05:50,369 --> 00:05:51,910
अब वहाँ क्या हुआ, भी, नोटिस।

115
00:05:51,910 --> 00:05:57,040
यहां तक ​​कि 02,138 या के लिए मैं तो इस समय खोज
कैम्ब्रिज अल्पविराम मैसाचुसेट्स या कुछ

116
00:05:57,040 --> 00:06:00,300
संस्करण क्या है, यदि आप एक मिल
छोटे से स्वत: पूर्ण लटकती।

117
00:06:00,300 --> 00:06:03,840
अब यह एक प्लगइन का उपयोग कर रहा है
jQuery के नाम से एक पुस्तकालय के लिए,

118
00:06:03,840 --> 00:06:05,732
और कहा कि प्लगइन typeahead कहा जाता है।

119
00:06:05,732 --> 00:06:07,440
हम बस के माध्यम से पढ़ा
प्रलेखन,

120
00:06:07,440 --> 00:06:13,150
.js एकीकृत फाइल डाउनलोड
वितरण कोड में तो आपको लगता है कि

121
00:06:13,150 --> 00:06:16,900
अंततः कोड लिख सकते हैं
ऑटो के साथ कि लटकती मेनू भरता है

122
00:06:16,900 --> 00:06:19,350
चयन या ऑटो सुझाव।

123
00:06:19,350 --> 00:06:23,820
>> अब वितरण कोड है, हालांकि, कि
आप लगभग उतनी ही ऐसा नहीं करता प्राप्त किया।

124
00:06:23,820 --> 00:06:26,860
आप गूगल मानचित्र एम्बेडेड मिलता है, और
यदि आप शीर्ष बाएँ नियंत्रण पाने के

125
00:06:26,860 --> 00:06:28,240
और आप खोज बॉक्स मिलता है।

126
00:06:28,240 --> 00:06:32,760
लेकिन मैं ऐसा कुछ टाइप
02,138, कोई स्थानों अभी तक पाए जाते हैं।

127
00:06:32,760 --> 00:06:34,730
तो यह है कि होने जा रहा है
यहाँ हमारे लक्ष्यों में से एक।

128
00:06:34,730 --> 00:06:37,430
इसके अलावा, आप एक कदम उठाने अगर
पीठ और नक्शा खुद को देखो,

129
00:06:37,430 --> 00:06:38,950
जो भी कोई खबर नहीं है।

130
00:06:38,950 --> 00:06:41,780
मैं क्लिक करें यहां तक ​​कि अगर और
खींचें, वास्तव में कोई मार्करों

131
00:06:41,780 --> 00:06:45,560
कि क्योंकि खबर के लिए प्रदर्शित
चुनौती के रूप में अच्छी तरह से आप के लिए छोड़ दिया है।

132
00:06:45,560 --> 00:06:48,490
>> तो एक नज़र रखना
वितरण कोड पर।

133
00:06:48,490 --> 00:06:51,460
आप डाउनलोड करने के बाद
pset8.zip और यह unzipped

134
00:06:51,460 --> 00:06:54,430
अपने vhost निर्देशिका में
CS50 उपकरणों में,

135
00:06:54,430 --> 00:06:56,550
आप इन देखेंगे
यहाँ के अंदर निर्देशिकाओं।

136
00:06:56,550 --> 00:07:00,200
आम तौर पर के लिए खड़ा है जो Bin--
निष्पादन योग्य programs-- के लिए द्विआधारी

137
00:07:00,200 --> 00:07:04,870
pset7, के रूप में शामिल है, कुछ पीएचपी
अन्य फ़ाइलों को भी शामिल है कि फ़ाइलें,

138
00:07:04,870 --> 00:07:06,710
जो है तो जनता,
जरूरत है कि फ़ाइलें

139
00:07:06,710 --> 00:07:09,369
सार्वजनिक रूप से सुलभ हो
एक ब्राउज़र के साथ एक उपयोगकर्ता के लिए।

140
00:07:09,369 --> 00:07:11,410
में एक नज़र रखना
बिन निर्देशिका, और हम करेंगे

141
00:07:11,410 --> 00:07:13,890
एक फ़ाइल है कि वहाँ देखना
पहले से ही आयात वहां बुलाया।

142
00:07:13,890 --> 00:07:17,591
हम एडिट के साथ इस खोलते हैं, तो हम देखेंगे
कि, दुर्भाग्य से, वहाँ ज्यादा नहीं है

143
00:07:17,591 --> 00:07:18,090
क्या आप वहां मौजूद हैं।

144
00:07:18,090 --> 00:07:20,250
हालांकि, वहाँ है कि सभी,
शीर्ष पर एक कुटिया है

145
00:07:20,250 --> 00:07:23,410
जो जो निर्दिष्ट
इस मामले में interpreter-- PHP--

146
00:07:23,410 --> 00:07:25,759
वास्तव में करने के लिए इस्तेमाल किया जाना चाहिए
इस फ़ाइल को निष्पादित।

147
00:07:25,759 --> 00:07:27,550
लेकिन फिर यह कहते हैं कि जहां
आप कर रहे हैं, जहां TODO है

148
00:07:27,550 --> 00:07:31,130
कुछ कोड लिखने की जरूरत के लिए जा रहा
कि शायद कॉन्फिग की आवश्यकता है

149
00:07:31,130 --> 00:07:35,820
निर्देशिका में शामिल में है कि फ़ाइल
हम PHP फाइलों के साथ पहले किया है के रूप में।

150
00:07:35,820 --> 00:07:38,180
और फिर आप करने जा रहे हैं
किसी भी तरह खोलने के लिए है

151
00:07:38,180 --> 00:07:41,920
us.text जो आप संभवतः
पहले से ही unzipped है।

152
00:07:41,920 --> 00:07:44,690
तो फिर तुम करने के लिए जा रहे हैं
उस फ़ाइल में लाइनों पर पुनरावृति,

153
00:07:44,690 --> 00:07:47,800
शायद कार्यों में से कुछ का उपयोग कर
विनिर्देश में सुझाव दिया।

154
00:07:47,800 --> 00:07:51,390
तब उन लोगों में से प्रत्येक डालने
MySQL डाटाबेस में लाइनों

155
00:07:51,390 --> 00:07:54,940
क्वेरी समारोह का उपयोग करके जो
हम फिर से with-- आप प्रदान की है

156
00:07:54,940 --> 00:07:58,010
या कम से कम एक संस्करण
उसके functions.php में,

157
00:07:58,010 --> 00:07:59,560
जो हम सिर्फ एक पल में देखेंगे।

158
00:07:59,560 --> 00:08:04,430
>> अब हम आयात बंद करें और वापस करने के लिए चलते हैं
हमारी निर्देशिका और इस बार में जाने

159
00:08:04,430 --> 00:08:05,300
भी शामिल है।

160
00:08:05,300 --> 00:08:09,210
मैं वहाँ रास करते हैं, तो आप देखेंगे
काफी समस्या सेट 7 की तरह तीन फ़ाइलें।

161
00:08:09,210 --> 00:08:13,760
और चलो एक त्वरित नज़र रखना,
उदाहरण के लिए, config.php पर।

162
00:08:13,760 --> 00:08:16,730
वहाँ में, कम लाइनों है
से पहले, और यह

163
00:08:16,730 --> 00:08:20,712
इस फाइल को शामिल लगता है
constants.php और functions.php।

164
00:08:20,712 --> 00:08:23,670
हम एक अलग प्रयोग कर रहे हैं
तकनीक वास्तव में करने के लिए इस बार के आसपास

165
00:08:23,670 --> 00:08:30,910
इन फ़ाइलों रिश्तेदार हैं कि निर्दिष्ट
वर्तमान निर्देशिका के लिए __ DIR__

166
00:08:30,910 --> 00:08:35,280
का प्रतिनिधित्व करता है जो कुछ निर्देशिका इस
फ़ाइल, config.php, जो अपने आप में है।

167
00:08:35,280 --> 00:08:37,600
तो यह एक अधिक है
निर्दिष्ट करने के स्पष्ट रास्ता

168
00:08:37,600 --> 00:08:40,100
आप की आवश्यकता करना चाहते हैं क्या अन्य फ़ाइलें।

169
00:08:40,100 --> 00:08:44,020
>> अब मैं इस फाइल को बंद करें और यदि
बजाय constants.php ऊपर खुला,

170
00:08:44,020 --> 00:08:47,430
आप बहुत याद ताजा एक फाइल देखेंगे
के लिए समस्या सेट 7 के रूप में अच्छी तरह से, यद्यपि

171
00:08:47,430 --> 00:08:50,050
pset8 नामक एक अलग डाटाबेस के साथ।

172
00:08:50,050 --> 00:08:54,020
अंत में, functions.php में,
हम सिर्फ एक समारोह देखेंगे

173
00:08:54,020 --> 00:08:55,942
क्वेरी नामक इस समय।

174
00:08:55,942 --> 00:08:59,150
यह हम संभाल के अलावा लगभग एक ही है
थोड़ा के आसपास त्रुटियों इस समय

175
00:08:59,150 --> 00:09:02,860
अलग ढंग से, लेकिन यह उपयोग के लिए है
समस्या के रूप में ही सात निर्धारित किया है।

176
00:09:02,860 --> 00:09:08,090
>> अब हम हमारे pset8 में वापस जाने दिया
निर्देशिका, जनता में जाना है, और वहाँ में

177
00:09:08,090 --> 00:09:14,420
मैं रास करते हैं, तो आप this-- देखेंगे
articles.php, सूचकांक, search.php,

178
00:09:14,420 --> 00:09:16,940
और सभी फ़ाइलों update.php--।

179
00:09:16,940 --> 00:09:22,010
और फिर सीएसएस फोंट, IMG, और
काफी pset7 तरह जेएस निर्देशिका।

180
00:09:22,010 --> 00:09:24,660
>> पर एक नज़र रखना
जो सूचकांक,

181
00:09:24,660 --> 00:09:27,290
वास्तव में होने जा रहा
smashup के लिए प्रवेश बिंदु।

182
00:09:27,290 --> 00:09:31,820
अब सूचकांक में, आप एक पूरे देखेंगे
सिर में लिंक तत्व का गुच्छा,

183
00:09:31,820 --> 00:09:36,540
विशेष रूप से, अपने स्वयं के लिए बूटस्ट्रैप के लिए
स्क्रिप्ट की एक पूरी गुच्छा द्वारा पीछा सीएसएस

184
00:09:36,540 --> 00:09:41,520
नक्शे, एपीआई जैसी चीजों के लिए टैग
ही है, लेबल के साथ एक विशेष मार्कर

185
00:09:41,520 --> 00:09:44,950
हम में उल्लेख किया है कि उपयोगिता
विनिर्देश, आप के लिए उपलब्ध है

186
00:09:44,950 --> 00:09:48,420
jQuery का ही है, बूटस्ट्रैप
ही है, और एक और पुस्तकालय

187
00:09:48,420 --> 00:09:50,990
कहा जाता अंडरस्कोर जो
हम कल्पना के बारे में बात करते हैं।

188
00:09:50,990 --> 00:09:57,031
Jquery.js तरह Underscore.js
एक जावास्क्रिप्ट पुस्तकालय है

189
00:09:57,031 --> 00:10:00,280
कि कार्यक्षमता की एक पूरी गुच्छा है
कि दुनिया इच्छा में बहुत से लोगों को

190
00:10:00,280 --> 00:10:02,020
जावास्क्रिप्ट अपने आप में ही अस्तित्व में।

191
00:10:02,020 --> 00:10:04,560
तो ये सब कर रहे हैं
वास्तव में काफी लोकप्रिय है।

192
00:10:04,560 --> 00:10:07,140
हम यह भी typeahead उल्लेख किया है
पुस्तकालय है जो कि

193
00:10:07,140 --> 00:10:11,180
करता है कि स्वत: पूर्ण लटकती और
अंत में हमारे अपने जावास्क्रिप्ट के लिए एक कड़ी।

194
00:10:11,180 --> 00:10:13,880
>> इस बीच, और शायद
शुक्र है, इस मैशप

195
00:10:13,880 --> 00:10:17,550
अपेक्षाकृत कम से प्रेरित है
यहाँ नीचे तल पर एचटीएमएल।

196
00:10:17,550 --> 00:10:22,330
हम एक div में निर्दिष्ट किया है कि सूचना
वर्ग-कंटेनर तरल पदार्थ का हमारे शरीर।

197
00:10:22,330 --> 00:10:24,610
यह प्रति बूटस्ट्रैप की
प्रलेखन, बस

198
00:10:24,610 --> 00:10:29,840
इस div को भरने के लिए जा रहा है, इसका मतलब है कि
व्यूपोर्ट या पूरी तरह से ब्राउज़र की खिड़की।

199
00:10:29,840 --> 00:10:33,020
>> इस बीच, है कि नीचे हम एक div है
कि खोला और तुरंत बंद कर दिया गया है

200
00:10:33,020 --> 00:10:34,790
नक्शा कैनवास की अद्वितीय पहचान के साथ।

201
00:10:34,790 --> 00:10:37,400
यह अब गूगल से है
मैप्स प्रलेखन

202
00:10:37,400 --> 00:10:42,490
अपने एपीआई, के लिए जिससे मैं बस करने की जरूरत है
, इंजेक्षन करने के लिए जो में एक खाली div है

203
00:10:42,490 --> 00:10:44,470
अंत में, एक वास्तविक गूगल मैप्स।

204
00:10:44,470 --> 00:10:46,310
लेकिन सिर्फ एक बिट में उस पर और अधिक।

205
00:10:46,310 --> 00:10:48,850
>> अंत में, एक रूप है
यहाँ के अंदर जो

206
00:10:48,850 --> 00:10:52,930
पाठ बॉक्स को शीर्ष छोड़ा लागू
खोज के लिए हमारे इंटरफ़ेस में।

207
00:10:52,930 --> 00:10:54,730
हम का उपयोग किया है कि सूचना
बूटस्ट्रैप का एक सा

208
00:10:54,730 --> 00:10:57,670
यहाँ की तरह बातें too--
फार्म-इनलाइन और फार्म-समूह।

209
00:10:57,670 --> 00:11:00,080
हम पूर्व दिया है
फार्म की अद्वितीय पहचान।

210
00:11:00,080 --> 00:11:04,510
और फिर, अंत में, मैं वास्तव में है
बहुत परिचित है जो एक इनपुट प्रकार,

211
00:11:04,510 --> 00:11:06,440
क्यू जिसका आईडी है।

212
00:11:06,440 --> 00:11:07,230
बस एक सम्मेलन।

213
00:11:07,230 --> 00:11:09,234
Query-- हो सकता है के लिए क्यू
कुछ भी बुलाया गया।

214
00:11:09,234 --> 00:11:11,400
और फिर प्लेसहोल्डर,
इस बीच, शहर, राज्य है,

215
00:11:11,400 --> 00:11:16,200
और डाक कोड यदि आपको याद हो सकता है
डेमो पहले हमारे मैशप में देखकर।

216
00:11:16,200 --> 00:11:17,980
चलो इस फाइल को बंद कर दें।

217
00:11:17,980 --> 00:11:24,460
>> अब PHP फाइलों पर एक नज़र रखना है कि
इंतजार और फिर जावास्क्रिप्ट फ़ाइलें।

218
00:11:24,460 --> 00:11:27,700
हमारे PHP फाइलों में, हम है
पहले से ही आप के लिए लागू की,

219
00:11:27,700 --> 00:11:29,960
उदाहरण के लिए, अद्यतन।

220
00:11:29,960 --> 00:11:35,060
हम एक बहुत बड़ा खर्च नहीं होगा Update.php--
संक्षेप में here-- पर समय की राशि

221
00:11:35,060 --> 00:11:38,400
फ़ाइल है कि हमारे
जावास्क्रिप्ट कोड जा रहा है

222
00:11:38,400 --> 00:11:41,610
AJAX के माध्यम से संपर्क करने के लिए कि
है कि अतुल्यकालिक तकनीक

223
00:11:41,610 --> 00:11:45,980
है कि इन दिनों जावास्क्रिप्ट में निर्मित
हमें update.php पूछने के लिए अनुमति देने के लिए जा रहा

224
00:11:45,980 --> 00:11:47,410
अधिक जानकारी के लिए।

225
00:11:47,410 --> 00:11:50,045
>> विशेष रूप से, किसी भी समय
उपयोगकर्ता नक्शा drags

226
00:11:50,045 --> 00:11:53,310
या कूदता है कि एक खोज करता है
किसी अन्य स्थान के लिए उपयोगकर्ता,

227
00:11:53,310 --> 00:11:55,250
हमारे JavaScript कोड,
हम जल्द ही देखेंगे के रूप में है,

228
00:11:55,250 --> 00:11:59,610
update.php फोन करने वाला
और 10 या तो मार्करों के लिए पूछना

229
00:11:59,610 --> 00:12:02,630
व्यूपोर्ट के भीतर आधारित
जीपीएस निर्देशांक पर

230
00:12:02,630 --> 00:12:06,510
ऊपर और नीचे की
नक्शा है कि के कोनों।

231
00:12:06,510 --> 00:12:10,520
हम तो अब नक्शा है कि फिर से आबाद कर सकते हैं
उपयोगकर्ता क्रम में स्क्रीन ले जाया गया है

232
00:12:10,520 --> 00:12:14,210
10 शायद नया देखने के लिए
विभिन्न शहरों के लिए मार्करों।

233
00:12:14,210 --> 00:12:18,340
इस बीच, इस फाइल अंततः है
एक एसक्यूएल क्वेरी को निष्पादित करने के लिए जा रहा

234
00:12:18,340 --> 00:12:21,680
हमारे डाटाबेस के खिलाफ
तालिका बुलाया स्थानों जो

235
00:12:21,680 --> 00:12:26,380
उन पर लौटने के लिए जा रहा है
10 या कम स्थानों।

236
00:12:26,380 --> 00:12:32,620
>> इस बीच, articles.php में, एक और है
हम अपनी संपूर्णता में लिखा है फ़ाइल।

237
00:12:32,620 --> 00:12:35,820
यह करने के लिए भावना में बहुत समान है
समस्या सेट 7 LOOKUP समारोह,

238
00:12:35,820 --> 00:12:39,450
जो आप के लिए याहू वित्त से संपर्क किया।

239
00:12:39,450 --> 00:12:43,710
इस फ़ाइल में संपर्कों Google समाचार
आप के लिए, अंततः हथियाने

240
00:12:43,710 --> 00:12:46,050
एक मशीन पठनीय
version-- कुछ में

241
00:12:46,050 --> 00:12:49,720
खबर के आरएसएस format-- बुलाया
कैम्ब्रिज या बेवर्ली हिल्स के लिए

242
00:12:49,720 --> 00:12:52,880
या जो कुछ भी शहर आप खोज की है
के लिए कि geoparameter पर आधारित है।

243
00:12:52,880 --> 00:12:57,250
हम सिर्फ एक है जो कि आरएसएस, पार्स
एक्सएमएल बुलाया मार्कअप भाषा का प्रकार,

244
00:12:57,250 --> 00:13:00,740
और फिर हम वास्तव में
अपने ब्राउज़र के लिए यह वापसी

245
00:13:00,740 --> 00:13:03,570
और आपकी जावास्क्रिप्ट कोड को,
विशेष रूप से, एक प्रारूप में बुलाया

246
00:13:03,570 --> 00:13:06,097
JSON, जावास्क्रिप्ट वस्तु संकेतन।

247
00:13:06,097 --> 00:13:08,180
अब तुम में देखेंगे
specification-- हम आप बात

248
00:13:08,180 --> 00:13:10,720
आप वास्तव में देख सकते हैं कि कैसे में
JSON के आने back-- के कुछ

249
00:13:10,720 --> 00:13:15,210
कि इस कार्यक्षमता अंततः
आप तो उन पॉपअप मेनू आबाद देता है

250
00:13:15,210 --> 00:13:16,960
जब आप क्लिक करें कि
नक्शे में एक मार्कर पर

251
00:13:16,960 --> 00:13:19,430
आप वास्तव में एक पूरी गुच्छा देखना
गोलियों की, जिनमें से प्रत्येक का

252
00:13:19,430 --> 00:13:21,020
एक लेख के लिंक।

253
00:13:21,020 --> 00:13:25,000
>> अब हम पिछले एक पर एक नज़र रखना
सौभाग्य से, नहीं करता है, जो PHP फ़ाइल

254
00:13:25,000 --> 00:13:27,970
ज्यादा है on-- जा रहा
सिर्फ एक बहुत बड़ा TODO।

255
00:13:27,970 --> 00:13:32,170
ठीक है अब इस फाइल को वाणी
एक सरणी स्थानों बुलाया।

256
00:13:32,170 --> 00:13:35,980
और फिर अंत में प्रिंट
JSON के format-- में उस सरणी

257
00:13:35,980 --> 00:13:38,720
बस इतना है कि यह बहुत-मुद्रण
बातें डिबग करने के लिए आसान कर रहे हैं।

258
00:13:38,720 --> 00:13:41,480
दुर्भाग्य से, में
बीच इस TODO वहाँ है,

259
00:13:41,480 --> 00:13:46,890
आप खोज करने के लिए है, जो कहता है
मिलान स्थानों के लिए डेटाबेस एक भू HTTP के

260
00:13:46,890 --> 00:13:47,490
पैरामीटर।

261
00:13:47,490 --> 00:13:49,865
>> और, वास्तव में, यह करने के लिए जा रहा है
अपने challenges-- में से एक हो

262
00:13:49,865 --> 00:13:54,240
यहाँ इस कार्यक्षमता को लागू करने के लिए
इतना है कि आप के साथ इस फाइल संपर्क जब

263
00:13:54,240 --> 00:14:00,610
खोज की तरह एक यूआरएल। PHP? जियो = कुछ है,
अपने कोड अंततः एक JSON वापस आ जाएगी

264
00:14:00,610 --> 00:14:05,020
में स्थानों के सभी की सरणी अपने
कि इनपुट से मेल खाने वाले डेटाबेस तालिका।

265
00:14:05,020 --> 00:14:08,960
कैम्ब्रिज में उपयोगकर्ता प्रकार तो अगर
यहाँ अपनी फ़ाइल search.php

266
00:14:08,960 --> 00:14:12,680
अंततः एक JSON सरणी वापस आ जाना चाहिए
कैम्ब्रिज के मैचों के लिए सभी के लिए,

267
00:14:12,680 --> 00:14:16,990
मैसाचुसेट्स में हो सकता है, जो
लेकिन फिर भी कहीं और हो सकता है।

268
00:14:16,990 --> 00:14:21,040
>> अन्त में, दो पर एक नज़र रखना
स्थिर ultimately-- हैं कि फ़ाइलों

269
00:14:21,040 --> 00:14:23,680
अपने सीएसएस फ़ाइल और आपकी जावास्क्रिप्ट फ़ाइल।

270
00:14:23,680 --> 00:14:26,779
मैं हमारे सीएसएस निर्देशिका में जाओ,
फ़ाइलों की एक पूरी गुच्छा, वहाँ वहाँ

271
00:14:26,779 --> 00:14:28,070
लेकिन उनमें से ज्यादातर पुस्तकालयों रहे हैं।

272
00:14:28,070 --> 00:14:31,530
मैं एक बार देख लेने के लिए जा रहा हूँ,
विशेष रूप से, styles.css पर,

273
00:14:31,530 --> 00:14:35,440
जो कि हमारे अपने वैश्विक सीएसएस
इस पूरे मैशप stylize जा रहा है।

274
00:14:35,440 --> 00:14:38,840
आप के माध्यम से पढ़ने के लिए करने के लिए मैं इसे छोड़ देंगे
टिप्पणियों के साथ साथ, लेकिन, संक्षेप में,

275
00:14:38,840 --> 00:14:43,490
इस सुनिश्चित करता है कि सीएसएस है हमारी
मैशप, बॉक्स से बाहर डिफ़ॉल्ट रूप से,

276
00:14:43,490 --> 00:14:46,950
हम it-- चाहते ठीक तरह से लग रहा है
देखें बंदरगाह भरने नक्शे के साथ

277
00:14:46,950 --> 00:14:49,720
और खोज के साथ
ऊपर छोड़ दिया पर अप बॉक्स।

278
00:14:49,720 --> 00:14:52,870
हम यह भी करने की स्वतंत्रता ले लिया है
कि typeahead लटकती stylizing

279
00:14:52,870 --> 00:14:55,170
मेनू एक छोटा सा के रूप में अच्छी तरह से।

280
00:14:55,170 --> 00:14:58,030
>> सबसे महत्वपूर्ण फाइल
शायद सेट इस समस्या के लिए

281
00:14:58,030 --> 00:15:01,070
यह पिछले एक, scripts.js है।

282
00:15:01,070 --> 00:15:03,800
अपने जेएस निर्देशिका के अंदर
यहां तक ​​कि अधिक फ़ाइलें है।

283
00:15:03,800 --> 00:15:08,090
वे सब के सब पुस्तकालय फाइल कर रहे हैं
इस एक को छोड़कर, scripts.js।

284
00:15:08,090 --> 00:15:11,460
हम इस को खोलते हैं, के लिए ले जाने के लिए हमारे
कार्यों के माध्यम से अंतिम दौरे कि

285
00:15:11,460 --> 00:15:13,820
इस फाइल में बनाया जाता है
आप और कॉल ध्यान के लिए

286
00:15:13,820 --> 00:15:16,200
कि आगे झूठ सब करने के लिए।

287
00:15:16,200 --> 00:15:19,110
>> इस फाइल के शीर्ष पर,
तीन वैश्विक चर रहे हैं।

288
00:15:19,110 --> 00:15:22,910
जा रहा है जो एक नक्शा, के लिए एक
हमारे गूगल मानचित्र के लिए एक संदर्भ हो।

289
00:15:22,910 --> 00:15:25,510
आप इसके बारे में सोच सकते हैं
तरह का एक संकेत के रूप में।

290
00:15:25,510 --> 00:15:27,710
इस बीच, हम हैं
एक और वैश्विक चर

291
00:15:27,710 --> 00:15:31,500
प्रतीत होता है, जो कहा जाता है, जानकारी,
एक कॉल की वापसी मान के भंडारण

292
00:15:31,500 --> 00:15:34,170
नई google.maps.InfoWindow करने के लिए।

293
00:15:34,170 --> 00:15:37,835
जावास्क्रिप्ट वस्तुओं का समर्थन करता है जो
Struts के लिए भावना में बहुत समान हैं।

294
00:15:37,835 --> 00:15:40,250
और क्या इस लाइन के लिए
हमारे उद्देश्यों के लिए कर रही है

295
00:15:40,250 --> 00:15:42,820
एक नई जानकारी पैदा कर रही है
तो स्मृति और खिड़की

296
00:15:42,820 --> 00:15:46,330
एक संदर्भ के आसपास रखने के
जानकारी नामक एक चर में बहां।

297
00:15:46,330 --> 00:15:48,330
और उन के बीच में,
इस बीच, क्या प्रकट होता है

298
00:15:48,330 --> 00:15:51,060
एक खाली जावास्क्रिप्ट होने के लिए
सरणी मार्करों बुलाया।

299
00:15:51,060 --> 00:15:55,392
उन समाचार पत्र माउस के सभी, या आप
कुल मिलाकर एक और आइकन चुन सकते हैं,

300
00:15:55,392 --> 00:15:57,350
संग्रहीत किया जा करने के लिए जा रहे हैं
अंततः इस सरणी में

301
00:15:57,350 --> 00:16:01,570
हम बहुत आसानी से करने के लिए जोड़ सकते हैं ताकि
नक्शा और नक्शे से उन्हें हटा दें।

302
00:16:01,570 --> 00:16:03,990
>> अब चलो नीचे स्क्रॉल करते हैं
एक छोटा सा और विशेषज्ञ

303
00:16:03,990 --> 00:16:07,690
होने जा रहा है कि कोड के माध्यम से
डोम या दस्तावेज जैसे ही मार डाला

304
00:16:07,690 --> 00:16:10,480
ऑब्जेक्ट मॉडल या
पृष्ठ ही तैयार है।

305
00:16:10,480 --> 00:16:12,942
इस वाक्य याद है कि
यहाँ बस को निर्दिष्ट

306
00:16:12,942 --> 00:16:14,900
निम्नलिखित कोड है कि
केवल निष्पादित किया जाना चाहिए

307
00:16:14,900 --> 00:16:17,840
ब्राउज़र समाप्त हो गया है जब
बाकी सब लोड हो रहा है।

308
00:16:17,840 --> 00:16:19,750
>> हम पहले एक घोषित
शैलियों की पूरी गुच्छा,

309
00:16:19,750 --> 00:16:22,410
stylizing जो अंत
कल्पना के अनुसार नक्शा।

310
00:16:22,410 --> 00:16:24,790
हम तो एक घोषित
विकल्पों की पूरी गुच्छा,

311
00:16:24,790 --> 00:16:28,630
आगे गूगल अनुकूलित जो
हम एम्बेड करने के बारे में कर रहे हैं कि नक्शा।

312
00:16:28,630 --> 00:16:32,090
हम तो jQuery कोड का एक बिट का उपयोग
जो थोड़ा और अधिक विस्तार से समझाया गया है

313
00:16:32,090 --> 00:16:35,000
कल्पना में, हड़पने के लिए
उस तत्व, नक्शे-कैनवास

314
00:16:35,000 --> 00:16:36,980
हम इतने विशिष्ट पहचान है।

315
00:16:36,980 --> 00:16:40,640
और फिर इस लाइन यहाँ है
क्या लगता है जादुई हमें देने के लिए

316
00:16:40,640 --> 00:16:43,560
के अंदर एक गूगल मानचित्र
हमारे अपने आवेदन,

317
00:16:43,560 --> 00:16:47,020
एक संदर्भ बहां के भंडारण
कि चर बुलाया नक्शे में।

318
00:16:47,020 --> 00:16:50,550
>> अंत में, यहाँ नीचे हम रजिस्टर
क्या एक श्रोता कहा जाता है।

319
00:16:50,550 --> 00:16:54,690
Back-- तरह, जिस तरह सोचो
CS50 में सप्ताह शून्य करने के लिए back--

320
00:16:54,690 --> 00:16:57,430
हम खरोंच पर देखा और जब
टहलने के माध्यम से अपना समर्थन

321
00:16:57,430 --> 00:16:59,935
कहा जाता बातों के लिए के माध्यम से
घटनाओं और प्रसारण।

322
00:16:59,935 --> 00:17:01,810
आप का इस्तेमाल किया है नहीं हो सकता है
यह अपने आप को, लेकिन यह बात है

323
00:17:01,810 --> 00:17:03,900
एक तंत्र जिससे एक
इस मामले में ब्राउज़र

324
00:17:03,900 --> 00:17:07,940
जब यह हमारे ध्यान में प्राप्त कर सकते हैं
वास्तव में कुछ कोड को निष्पादित करने के लिए तैयार है।

325
00:17:07,940 --> 00:17:12,170
इस मामले में, यह सुनने के लिए जा रहा है
निष्क्रिय नामक एक घटना के लिए नक्शा करने के लिए।

326
00:17:12,170 --> 00:17:14,930
यह ब्राउज़र की है कि इसका मतलब है
गूगल मानचित्र लोड हो रहा समाप्त हो गया।

327
00:17:14,930 --> 00:17:18,380
इस बिंदु पर एक समारोह में कहा जाता है
कॉन्फ़िगर करना चाहिए अंततः

328
00:17:18,380 --> 00:17:19,339
निष्पादित किया।

329
00:17:19,339 --> 00:17:22,510
उस समारोह, विन्यस्त करता है,
हम हमारे द्वारा लिखा गया है, देखेंगे।

330
00:17:22,510 --> 00:17:24,550
>> अब यहाँ नीचे एक समारोह है
कि, दुर्भाग्य से,

331
00:17:24,550 --> 00:17:25,871
सिर्फ एक TODO ऐड मार्कर है।

332
00:17:25,871 --> 00:17:28,620
कल्पना के अनुसार। आप की जरूरत करने जा रहे हैं
कि वास्तव में कोड लिखने के लिए

333
00:17:28,620 --> 00:17:32,840
यह लग रहा है कि क्या एक marker-- कहते हैं
एक समाचार पत्र, या एक अंगूठे कील की तरह,

334
00:17:32,840 --> 00:17:35,360
या कुछ और गूगल मानचित्र के लिए else--।

335
00:17:35,360 --> 00:17:37,720
यहाँ अब उस समारोह है
कॉन्फ़िगर बुलाया।

336
00:17:37,720 --> 00:17:40,390
आप पढ़ने के लिए करने के लिए मैं इसे छोड़ देंगे
और अधिक विस्तार में इस माध्यम से,

337
00:17:40,390 --> 00:17:42,600
लेकिन हम जोड़ने का एहसास है कि
एक गुच्छा अधिक श्रोताओं

338
00:17:42,600 --> 00:17:46,620
जब हम कोड को निष्पादित कर सकते हैं ताकि
उपयोगकर्ता पर क्लिक करता है और नक्शा drags।

339
00:17:46,620 --> 00:17:50,730
हम यह भी है कि यहाँ में कोड है
कि typeahead प्लगइन initializes

340
00:17:50,730 --> 00:17:53,120
इतना है कि लटकती
मेनू वास्तव में काम करता है।

341
00:17:53,120 --> 00:17:55,690
>> लेकिन सिर्फ एक पर ध्यान केंद्रित करते हैं
इस के साथ साथ स्थानों में से जोड़े।

342
00:17:55,690 --> 00:17:57,590
विशेष रूप से, इस यहाँ करने के लिए।

343
00:17:57,590 --> 00:18:00,410
मैं ऑनलाइन के लिए स्थगित कर देंगे
प्रलेखन और विनिर्देश

344
00:18:00,410 --> 00:18:02,530
के लिए कैसे इस TODO में भरने के लिए।

345
00:18:02,530 --> 00:18:05,890
लेकिन संक्षेप में, इस लाइब्रेरी
typeahead आप पारित करने के लिए अनुमति देता है

346
00:18:05,890 --> 00:18:09,790
आम तौर पर एक टेम्पलेट के रूप में जाना जाता है में,
कुछ चर प्लेसहोल्डर है जो

347
00:18:09,790 --> 00:18:13,690
printf के% की भावना में बहुत समान। * एस।

348
00:18:13,690 --> 00:18:16,030
लेकिन इस मामले में,
कल्पना प्रति टेम्पलेट

349
00:18:16,030 --> 00:18:18,760
आप निर्दिष्ट करने के लिए अनुमति देता है
क्या चर आप चाहते हैं

350
00:18:18,760 --> 00:18:24,880
आ गया है कि डेटा से इंजेक्षन
वापस पीएचपी तरह से कुछ से

351
00:18:24,880 --> 00:18:29,810
आप लिखा है कि फ़ाइलें
कि JSON के उत्पादन उत्सर्जन कर रहे हैं।

352
00:18:29,810 --> 00:18:35,170
>> अब यहाँ नीचे हम महसूस करते हैं कि
typeahead चयन के लिए सुन

353
00:18:35,170 --> 00:18:38,050
जब उपयोगकर्ता वास्तव में आयोजित करता है
एक खोज और एक मूल्य का चयन करता है।

354
00:18:38,050 --> 00:18:40,270
यह है कि हम वास्तव में कर रहे हैं कि कैसे है
उस के लिए सुनने के लिए जा रहा

355
00:18:40,270 --> 00:18:42,250
और एक परिणाम के रूप में कुछ कोड को निष्पादित।

356
00:18:42,250 --> 00:18:45,300
तो फिर हम विन्यस्त करने के लिए जारी रखने के लिए
मैशप बस थोड़ा सा।

357
00:18:45,300 --> 00:18:48,000
और, अंततः, हम कॉल
इस समारोह में अद्यतन।

358
00:18:48,000 --> 00:18:49,640
यह स्क्रीन पर मार्कर अद्यतन करता है।

359
00:18:49,640 --> 00:18:51,529
बस एक पल में उस पर और अधिक।

360
00:18:51,529 --> 00:18:53,570
इस बीच, कुछ नहीं है
यहां के छोटे कार्य करता है।

361
00:18:53,570 --> 00:18:56,820
जिनमें से एक hideInfo है जो
बस InfoWindow बंद कर देता है।

362
00:18:56,820 --> 00:19:00,020
यहां एक अन्य समारोह, जो अंततः
बहुत लंबा नहीं होगा, मार्कर को हटा दें।

363
00:19:00,020 --> 00:19:03,580
यही पूर्ववत करने के लिए जा रहा है जो कुछ भी
अपने ऐड मार्कर कार्य करता है।

364
00:19:03,580 --> 00:19:04,960
और फिर नीचे यहाँ खोज है।

365
00:19:04,960 --> 00:19:08,610
और यह एक रोचक है क्योंकि हम
है कि जावास्क्रिप्ट कोड लिखा है

366
00:19:08,610 --> 00:19:13,490
पर search.php से बात करने के लिए जा रहा
सर्वर और कुछ प्रतिक्रिया वापस मिलता है।

367
00:19:13,490 --> 00:19:16,110
>> तुम्हें पता है, जाहिर है, अभी भी होगा
search.php को लागू करने की जरूरत है,

368
00:19:16,110 --> 00:19:18,310
लेकिन हम क्रियान्वित किया है
है कि जावास्क्रिप्ट कोड

369
00:19:18,310 --> 00:19:22,480
प्रदर्शन कर वास्तव में संभाल करने के लिए जा रहा
कि टेक्स्ट बॉक्स से खोज करता है।

370
00:19:22,480 --> 00:19:25,340
विशेष रूप से, नोटिस में
यहाँ है कि इस समारोह में,

371
00:19:25,340 --> 00:19:29,160
खोज, search.php कॉल करता है
कहा जाता है एक विधि द्वारा

372
00:19:29,160 --> 00:19:31,072
हम व्याख्यान में देखा था जो JSON, मिलता है।

373
00:19:31,072 --> 00:19:32,780
और यहाँ वाक्य रचना
एक छोटे से अलग है

374
00:19:32,780 --> 00:19:37,110
उस में व्याख्यान से हम प्रयोग कर रहे हैं
jQuery का वादा इंटरफ़ेस तथाकथित।

375
00:19:37,110 --> 00:19:38,479
कल्पना में उस पर और अधिक।

376
00:19:38,479 --> 00:19:40,520
यह सिर्फ हमारे लिए इसका मतलब
अब लगता है कि वहाँ प्रयोजनों

377
00:19:40,520 --> 00:19:43,870
दो विशेष कार्य कर रहे हैं हम
डॉट अंकन के साथ फोन करने की जरूरत

378
00:19:43,870 --> 00:19:46,230
यहाँ तुरंत JSON पाने के फोन करने के बाद।

379
00:19:46,230 --> 00:19:47,510
एक किया जाता है।

380
00:19:47,510 --> 00:19:49,870
कहा जाता है एक असफल।

381
00:19:49,870 --> 00:19:51,790
आप इन के बारे में सोच सकते हैं
सफलता हैंडलर के रूप में

382
00:19:51,790 --> 00:19:54,960
और विफलता हैंडलर बस
मामले में कुछ गलत हो जाता है।

383
00:19:54,960 --> 00:19:57,760
>> अब के अंतिम को देखो
इस फाइल में कार्यों की जोड़ी।

384
00:19:57,760 --> 00:20:00,180
यहाँ नीचे एक समारोह है
कहा जाता है showInfo, जो

385
00:20:00,180 --> 00:20:03,090
उन में से एक में जानकारी से पता चलता है
थोड़ी जानकारी Windows कि

386
00:20:03,090 --> 00:20:05,380
उपयोगकर्ता एक मार्कर क्लिक करने पर चबूतरे।

387
00:20:05,380 --> 00:20:08,470
यहाँ नीचे आगे है
कि अद्यतन समारोह

388
00:20:08,470 --> 00:20:10,510
कि हम आप के लिए लागू किया है।

389
00:20:10,510 --> 00:20:15,250
यह मानचित्र की सीमा निर्धारित करता है।

390
00:20:15,250 --> 00:20:19,360
के जीपीएस निर्देशांक क्या हैं इसकी
पूर्वोत्तर और यहां दक्षिण पश्चिम कोनों।

391
00:20:19,360 --> 00:20:22,780
हम कुछ HDP मापदंडों तैयार किया है
यहाँ और फिर अंततः उन्हें पारित

392
00:20:22,780 --> 00:20:26,160
हम है, जो update.php को
आप के लिए भी लागू किया है।

393
00:20:26,160 --> 00:20:31,390
कि अंततः कुछ JSON के वापस हो जाता है
फ़ाइल update.php बुलाया से

394
00:20:31,390 --> 00:20:34,050
और फिर किसी भी निकालता है
स्क्रीन पर मार्कर

395
00:20:34,050 --> 00:20:36,650
और फिर खत्म हो iterates
वापस आ गया है कि डेटा

396
00:20:36,650 --> 00:20:40,350
update.php, से जो
फिर सिर्फ एक JSON सरणी है।

397
00:20:40,350 --> 00:20:45,130
और फिर यह अंततः एक मार्कर के लिए कहते हैं
उन स्थानों में से प्रत्येक से निपटने विफलता

398
00:20:45,130 --> 00:20:47,750
या जो हो सकता है त्रुटियों को बहुत अच्छी तरह से हो।

399
00:20:47,750 --> 00:20:51,550
>> अब बस आप आप कैसे की एक स्वाद देने के लिए
इस परियोजना के डिबगिंग के बारे में जाना हो सकता है,

400
00:20:51,550 --> 00:20:55,420
मैं में खोला है कि एहसास
इस यूआरएल के लिए यहाँ इस टैब अग्रिम,

401
00:20:55,420 --> 00:21:01,320
pset8 / articles.php? जियो = 02,138।

402
00:21:01,320 --> 00:21:04,050
के बारे में अब, फिर से, लेख
पीएचपी हम आप के लिए लागू किया

403
00:21:04,050 --> 00:21:06,320
तो यह इतना नहीं है
आप उपयोग कर सकता हूँ क्या

404
00:21:06,320 --> 00:21:08,190
डिबग, बल्कि तकनीक के लिए।

405
00:21:08,190 --> 00:21:10,590
मैं के लिए खोज की है कि सूचना
यहाँ कैम्ब्रिज की ज़िप कोड,

406
00:21:10,590 --> 00:21:15,260
और मैं एक JSON, वास्तव में, वापस मिल गया है
JSON की सरणी जिसमें से अंदर की वस्तुओं

407
00:21:15,260 --> 00:21:17,640
दो keys-- लिंक और शीर्षक हैं।

408
00:21:17,640 --> 00:21:19,860
>> तो इस कार्यक्षमता
आप के लिए पहले से ही काम करता है।

409
00:21:19,860 --> 00:21:24,330
लेकिन मैन्युअल रूप से इस तकनीक के लिए जा रहा
कुछ के लिए इस तरह एक यूआरएल की तरह

410
00:21:24,330 --> 00:21:31,710
search.php? जियो = कैम्ब्रिज या 02,138 या
उपयोगकर्ता चाहिए में टाइप किया है, जो कुछ भी

411
00:21:31,710 --> 00:21:35,770
यदि आप अपने आप को, की कोशिश के रूप में अमूल्य साबित
यह पता लगाने के लिए वास्तव में क्या है या क्यों

412
00:21:35,770 --> 00:21:38,510
search.php काम कर रहा है या नहीं।

413
00:21:38,510 --> 00:21:41,720
>> अंत में तो, आपके पास
आप के आगे कुछ TODOS।

414
00:21:41,720 --> 00:21:44,250
आप पहले से लागू कर जा रहे हैं
कि आयात स्क्रिप्ट है कि

415
00:21:44,250 --> 00:21:46,520
अपने डेटाबेस में us.text में पढ़ता है।

416
00:21:46,520 --> 00:21:48,760
फिर आप की जरूरत करने जा रहे हैं
search.php लागू करने के लिए

417
00:21:48,760 --> 00:21:51,320
निर्दिष्ट के रूप में यह वास्तव में बर्ताव करता है कि इतनी।

418
00:21:51,320 --> 00:21:54,170
फिर आप चाहते करने के लिए जा रहे हैं
scripts.js पर ध्यान केंद्रित करने के लिए

419
00:21:54,170 --> 00:21:57,520
और अंत में लागू करता है
सब के उन कुछ,

420
00:21:57,520 --> 00:21:59,950
कॉन्फ़िगर के लिए सहित
और उस टेम्पलेट,

421
00:21:59,950 --> 00:22:03,220
, मार्करों जोड़ मार्करों हटाने, और
तो, पिछले नहीं बल्कि कम से कम, एक

422
00:22:03,220 --> 00:22:04,330
निजी स्पर्श।

423
00:22:04,330 --> 00:22:07,477
>> आप अपने मैशप काम किया है एक बार
हाथ में काफी हमारे जैसे, लक्ष्य

424
00:22:07,477 --> 00:22:09,560
आप एक व्यक्तिगत जोड़ने के लिए है
अपने मैशप को छूना,

425
00:22:09,560 --> 00:22:11,290
यह सौंदर्य या कार्यात्मक है या नहीं।

426
00:22:11,290 --> 00:22:13,950
कभी तो मैशप लो
थोड़ा अगले स्तर के लिए।

427
00:22:13,950 --> 00:22:18,330
तो जब तक आप से परे अपने आप को धक्का के रूप में
कल्पना के साथ ही आपके अपनेपन

428
00:22:18,330 --> 00:22:20,840
और एक तकनीक उठाओ
नई, यह भले ही बस

429
00:22:20,840 --> 00:22:25,610
कुछ बदलने की तरह सौंदर्य
आप उपयोग कर रहे हैं कि नक्शा लेआउट,

430
00:22:25,610 --> 00:22:28,070
हम उम्मीद करते हैं कि गुंजाइश
संतुष्ट हो जाएगा।

431
00:22:28,070 --> 00:22:30,260
यही तो समस्या सेट 8 मैशप है।

432
00:22:30,260 --> 00:22:33,070
में अधिक जानकारी के लिए देखते रहो
विनिर्देश और शुभकामनाएँ

433
00:22:33,070 --> 00:22:36,400
इस से निपटने, अपनी पिछली
CS50 समस्या कभी निर्धारित किया है।

434
00:22:36,400 --> 00:22:39,750
>> [संगीत खेल]

435
00:22:39,750 --> 00:22:43,542