[Гуляе музыка] 

Дэвід Дж Малання: Прывітанне. Давайце прагуляемся па Праблема Set 8 Mashup, які збіраецца кінуць вам выклік у абапірацца на элементы для Google Maps з элементамі з Google News і пюрэ іх разам у вэб-аплет, які дазваляе карыстальніку шукаць Карта навін мясцовага да канкрэтных гарадах, гарадоў і паштовыя індэксы. Каб зрабіць гэта, мы збіраемся інтэграваць некаторыя HTML, CSS, PHP, SQL, Наяўнасць і тэхніка як правіла, вядомыя як AJAX ў парадку стварыць гэты захапляльны карыстацкі досвед. 

Давайце спачатку для Google Maps самастойна. Гэта, вядома, магчыма, Знаёмы інтэрфейс. Але аказваецца, што Google Maps таксама забяспечвае прымяненне API-- праграмаванне interface--, праз які Вы можаце ўзяць элементы Google Maps і інтэграваць іх у Вашы ўласныя прыкладання. Сапраўды, на працягу ўсяго гэтага Працэс, які вы збіраецеся каб знайсці пару адрасоў асабліва карысна, што згадваюцца ў Спецыфікацыя для пастаўленай задачы 8, У прыватнасці, гэта Пачатак працы Ці Кіраўніцтва распрацоўніка Для Google Maps API версіі 3, а як API Google Maps JavaScript спасылка v3, які з'яўляецца трохі больш таямніцай для чытання але на самой справе мае ўсё больш нізкім узроўні Дэталі, якія функцыі або метады і аб'екты і ўласцівасці, і падзеі на самай справе прыходзяць з API, вельмі блізкія па духу на [неразборліва] старонак. 

Цяпер, калі мы зірнем ў навінах Google, вы будзеце магчыма, убачыць знаёмы інтэрфейс тут. Але, аказваецца, вы таксама можаце знайсці Google Навіны для канкрэтных геаграфічных рэгіёнах з дапамогай параметру HTTP пад назвай Geo. На самай справе, калі б я павялічыць тут, вы ўбачыце, што Я ў news.google.com/news/section?geo=02138. І, сапраўды, калі я павялічыць , Вы ўбачыце, што я гледзячы на ​​старонку з цэлай кучай думкі аб Кембрыджы, штат Масачусэтс. 

Між тым, калі я на самой справе змяніць URL ня быць паштовы індэкс, як гэта, але што-то трохі брудней як Кембрыдж, + Масачусэтс, дзе плюс спосаб кадзіраваць прабел ў URL і націсніце Enter, вы ўбачыце, што я на самой справе ўбачыць амаль тыя ж навіны. Можа быць, гэта крыху па-іншаму таму Cambridge самай справе мае некалькі кодаў ZIP. Цяпер, як я магу ведаць, што і, На самай справе, як я мог нейкім чынам звязаць гарадоў і населеных пунктаў Каб сціснуць кодаў у выпадку, калі я хачу, каб дазволіць карыстальніку каб паглядзець небудзь? Што ж, атрымліваецца, што ёсць сайт там называецца geonames.org што Ініцыятыва ёсць свабодна даступная база дадзеных усіх віды геаграфічнай інфармацыі, не толькі для ЗША, але і для іншых краін, а таксама. На самай справе, калі я іду да гэтага URL тут, што таксама згадваецца ў пастаўленай задачы спецыфікацыя, вы ўбачыце, што тры спіс цэлай кучай паштовыя файлы любы з якіх можа быць загружана вамі. На самай справе, для гэтай праблемы ўсталюйце Вы збіраецеся спампаваць us.zip. У цяперашні час у гэтым файле, з'яўляецца ў цэлым куча дадзеных у тэкставым фармаце. Файлы вельмі падобны на CSV-- з падзельнікамі-коскамі file-- але на самой справе выкарыстоўвае Ўкладкі для размежавання палёў. Цяпер, між тым, калі паглядзець тут на тое, што я вылучыў, поля ў гэтым файле адбываецца быць рэчы, як коды краін, паштовыя індэксы, геаграфічныя назвы, а затым, у нейкім выглядзе або іншыя, штатах і акругах, абшчыны, і многае іншае. На самай справе, я ўжо запампаваў гэты файл загадзя. Дазвольце мне ісці наперад і адкрыць яго here-- us.text-- і, па сутнасці, вы будзеце ўбачыць, калі я пракруціць ўніз, каб выраўнаваць 16792 Вы ўбачыце некалькі запісаў з Кембрыджы, Штат Масачусэтс, і яго розныя коды ZIP. Тое, што вы таксама бачыць, што ёсць акругі, некаторыя лічбы, якія я сапраўды не зразумець, але і ўсе спосаб справа, некаторыя GPS coordinates-- шырыня і даўжыня. Гэта выдатна, таму што адзін з асаблівасці Google Maps API з'яўляецца здольнасць выяўляць дзе вы знаходзіцеся тэрытарыяльна у тэрмінах каардынатаў GPS. 

Зараз давайце пачнем, каб высветліць, як пачаць звязваць гэтыя рэчы разам. Мы далі вам цэлы куча кода размеркавання, а таксама ў якасці базы дадзеных MySQL. На самай справе, калі я цягну PHPMYADMIN якія маюць ўжо імпартавалі, як вы хутка будзе, pset8.SQL, вы ўбачыце табліцу MySQL, што Падобна на тое, гэта, ID поле, краіна Код, паштовы індэкс, назва і многае іншае. Тыпы ўсіх тых, калоны Я проста выводзіцца чытаючы readme.text падаць тут паказана Ці поле ўяўляе сабой цэлае лік, або VARCHAR ці таму падобнае. 

Такім чынам, мы стварылі гэтую табліцу для Вы і даў вам каманды SQL выканаць, каб стварыць што стол у вашай ўласнай базе дадзеных, але няма на самай справе ніякіх дадзеных у ім яшчэ. Хутчэй за ўсё, вы будзеце мець, каб спампаваць us.zip або паштовы любой краіны файл з гэтай URL там. І тады вы будзеце мець, каб напісаць Сцэнар каманднага радка ў PHP гэта збіраецца адкрыць гэты тэкст падаць, перабраць яго лініі, а затым для кожнага з гэтыя радкі рабіць ўстаўкі у тым, што змяшчае табліцу у вашай базе дадзеных MySQL. Так, у канцы гэтага працэсу, вы будзеце сутыкнуліся гэты сцэнар у канчатковым рахунку, толькі адзін раз, у тэорыі. На самай справе вы, верагодна, Запусціце яго кучу раз пры спробе выправіць розныя памылкі. 

У канчатковым рахунку, вы будзеце мець сапраўды вялікая база дадзеных з тысячамі і тысячы геаграфічных радкоў. Тады вы збіраецеся пакласці, што імпарт Сцэнар бок, калі ён працуе і ваша база дадзеных добра і правільна, а затым Вы збіраецеся перайсці на самай справе рэалізацыі самага калажаў. Калажаў будзе выглядаць трохі нешта накшталт гэтага. У mashup.cs50.net, мы ёсць рашэнне персаналу што выглядае трохі нешта накшталт гэтага. На самай справе, калі я націсну на гэтую газету значок у Кембрыдж, штат Масачусэтс, Вы ўбачыце спінінг коратка і затым націсніце на значок спарадкаваны спіс, маркіраваны спіс артыкулаў звязаныя з Кембрыджы, штат Масачусэтс. Калі я націскаю на Чарльзтауне, Масачусэтс, Я буду бачыць тое ж самае для гэтага горада. І калі я націскаю на Уотертаун, штат Масачусэтс, там не можа быць любы навіны з Уотертаун, так што вы ўбачыце што-то як павольны дзень навін. 

Зараз, у той час, у верхнім левым куце з'яўляюцца некаторыя звыклыя элементы кіравання Google Maps каб вы паменшыць маштаб, пан уверх, уніз, налева і направа, але і акно пошуку, якое мы ставім там. Так што, калі я шукаю, шчыра кажучы, Адзіны паштовы індэкс Я ведаю, 90210, мы на самай справе бачым Беверлі-Хілз, Каліфорнія. Пры націску прыводзіць мяне Каліфорнія і цэлая куча навін аб Беверлі-Хілз. Зараз звернеце ўвагу, таксама, што там адбылося. Калі я на гэты раз пошук 02138 ці нават Cambridge коскі Масачусэтс або якой-небудзь варыянт, вы атрымаеце трохі аўтазапаўнення спісу. Зараз гэта, выкарыстоўваючы убудова для бібліятэкі пад назвай JQuery, і што ўбудова называецца typeahead. Мы проста прачытаць дакументацыя, запампаваў .js файл інтэграваны у код размеркавання, так што вы у канчатковым рахунку, можа напісаць код, які запаўняе гэты выпадальнае меню з аўто выбар альбо аўтаматычна прапановы. 

Цяпер код размеркавання, аднак, што Вы атрымалі не робіць амаль столькі ж. Вы атрымліваеце Google Map убудаваныя, і вы атрымліваеце кантроль у левым верхнім куце, і вы атрымаеце акно пошуку. Але калі я нешта накшталт увядзіце 02138, няма месца не будуць знойдзеныя. Так што будзе адна з нашых мэтаў тут. Акрамя таго, калі вы робіце крок назад і зірнуць на самой карце, няма навін б там ні было. Нават калі я націскаю і супраціву, без маркераў на самай справе з'яўляюцца на навіны, таму што гэта Задача застаецца для вас. 

Давайце зірнем, то на код размеркавання. Пасля таго, як вы запампавалі pset8.zip і расшпіліў яго у каталогу з віртуальнымі хастамі у CS50 Appliance, Вы ўбачыце іх каталогі тут ўнутры. Bin-- якія, як правіла выступае за бінарны код для выкананага programs-- ўключае, як і ў pset7, некаторыя РНР файлы, якія іншыя файлы ўключаюць у сябе, то публіка, якая з'яўляецца файлы, якія павінны быць даступныя для грамадскасці карыстачу з дапамогай браўзэра. Давайце зірнем на Каталог скрыню, і мы бачыць, што ёсць файл ёсць ужо называюць Імпарт. Калі мы адкрыем гэта з Gedit, мы ўбачым, што, на жаль, існуе не так шмат там. Усё, што ёсць, тым не менш, гэта прытон на вяршыні які вызначае, якія interpreter-- ў гэтым выпадку PHP-- павінен быць выкарыстаны на самай справе выканаць гэты файл. Але тады дзе ён кажа TODO, дзе вы знаходзіцеся будзе неабходна напісаць код што, верагодна, патрабуе канфігурацыі файл, які знаходзіцца ў ўключае ў сябе каталог як мы рабілі раней з PHP файлаў. І тады вы будзеце як-то адкрыць us.text, якія Вы, верагодна, распакуете ўжо. Тады вы будзеце мець, каб перабору радкоў у гэтым файле, магчыма, з выкарыстаннем некаторых функцый прапанавана ў апісанні. Затым устаўце кожны з тых, лініі ў базе дадзеных MySQL з дапамогай функцыі запыту, які мы зноў падалі вам with-- або, па меншай меры, варыянт іх у functions.php, які мы ўбачым у хвіліну. 

Зараз давайце закрыем імпарт і вярнуцца да Наш каталог і на гэты раз ісці ў ўключае ў сябе. А калі я Маецца Ці, вы ўбачыце тры файла зусім як пастаўленай задачы 7. І давайце кінем хуткі погляд, напрыклад, у config.php. У там, менш радкоў чым раней, і яго Здаецца, гэты файл ўтрымлівае constants.php і functions.php. Мы выкарыстоўваем трохі адрозніваецца Тэхніка гэты раз на самай справе пазначыць, што гэтыя файлы з'яўляюцца адноснымі у бягучым каталогу __ DIR__ прадстаўляе ўсе каталог гэтым Файл, config.php, сама знаходзіцца ў. Так што гэта больш Відавочны спосаб задання што іншыя файлы, якія вы хочаце патрабаваць. 

Цяпер, калі я зачыню гэты файл і адкрыць constants.php замест гэтага, Вы ўбачыце файл вельмі нагадвае для пастаўленай задачы 7, а таксама, хоць і з другога базе даных пад назвай pset8. Нарэшце, у functions.php, мы ўбачым толькі адну функцыю на гэты раз называецца запыту. Гэта амаль тое ж самае, за выключэннем мы звяртаемся Памылкі ў гэты раз крыху па-рознаму, але яго выкарыстанне з'яўляецца гэтак жа, як у задачы ўстаноўлена сем. 

Зараз давайце вернемся ў наш pset8 каталога, перайдзіце ў публіцы, і там калі я раблю Ls, вы ўбачыце this-- articles.php, index.html, search.php, і update.php-- ўсе файлы. А потым CSS шрыфты, IMG, і JS каталог зусім як pset7. 

Давайце зірнем на index.html, які з'яўляецца будзе вельмі кропка ўваходу ў smashup. Зараз у index.html, то ўбачыце, уся куча элементаў ліній у галаве, У прыватнасці, для пачатковай загрузкі для нашых уласных CSS рушыла ўслед цэлая куча сцэнара тэгі для рэчаў, як карты, API Сам, спецыяльны маркер з пазнакай Ўтыліта якім мы ўжо згадвалі ў спецыфікацыя даступная для вас, Сам JQuery, загрузны Сам, і адна бібліятэка, называецца падкрэслення, якія мы гаворым пра ў спецыфікацыі. Underscore.js як jquery.js гэта бібліятэка JavaScript што мае цэлую кучу функцыянальнасці што шмат людзей у свеце жаданні існавалі ў самой JavaScript. Такім чынам, усё гэта на самай справе даволі папулярныя. Мы таксама згадаў typeahead які з'яўляецца бібліятэка, якая робіць гэта аўтазапаўнення спісу і нарэшце, спасылка на наш уласны JavaScript. 

У той жа час, і, магчыма, На шчасце, гэта калажаў прыводзіцца ў рух адносна мала HTML сюды ўнізе. Звярніце ўвагу, што мы паказалі DIV ў наша цела класа-кантэйнера для вадкасці. Гэта, у бутстраповские-х Дакументацыя, проста азначае, што гэты DIV збіраецца запоўніць краявіднага экрана або вокны браўзэра ў поўным аб'ёме. 

Між тым, ніжэй, чым у нас ёсць DIV які адкрыў і адразу ж зачыніў з унікальным ідэнтыфікатарам карты. Гэта цяпер ад Google Карты дакументацыя для яго API, у выніку чаго я проста трэба ёсць пусты DIV, у які будзе ўводзіць, у канчатковым рахунку, фактычная Google Maps. Але пра гэта крыху пазней. 

Нарэшце, ёсць форма ўнутры тут, які рэалізуе тэкставае поле наверсе злева у нашым інтэрфейсу для пошуку. Звярніце ўвагу, што мы выкарыстоўвалі трохі бутстрапе тут too-- рэчы, як формаў-рядный і форма-група. Мы далі былы Унікальны ідэнтыфікатар формы. А потым, у канчатковым рахунку, я на самой справе ёсць Тып уваходнага, што даволі добра знаёмыя, якога ідэнтыфікатар в. Проста канвенцыі. Q для query-- можа мець называюць што заўгодна. І тады запаўняльнік, Між тым, гэта горад, і паштовы код, які вы маглі б узгадаць, бачачы ў нашай калажаў дэма раней. Давайце закрыем гэты файл. 

Цяпер зірніце на файлы PHP, што чакаюць, і затым файлы JavaScript. У нашых PHP файлаў, мы ўжо рэалізавана для вас, Напрыклад, абнаўлення. Update.php-- мы не будзем марнаваць велізарныя колькасць часу на here-- ў двух словах гэта файл, што нашы Код JavaScript збіраецца звязацца з дапамогай AJAX, што асінхронны метад, які гэта убудаваны ў JavaScript у гэтыя дні, што гэта збіраецца, каб дазволіць нам, каб спытаць update.php для атрымання дадатковай інфармацыі. 

У прыватнасці, у любы час карыстальнік цягае карту або выконвае пошук, які скача Карыстальнік ў іншае месца, наш код JavaScript, як мы хутка ўбачым, з'яўляецца буду называць update.php і папрасіць 10 ці каля таго маркераў у акне прагляду аснове ад каардынатаў GPS у верхняй і ніжняй куты гэтай карты. Мы можам засяліць карту цяпер, карыстальнік перайшоў на экране ў парадку каб убачыць 10, верагодна, новы маркеры для розных гарадоў. Між тым, гэты файл, у канчатковым рахунку збіраецца выканаць SQL-запыт супраць нашай базе дадзеных табліцу з імем месцы, якія збіраецца вярнуцца тых, 10 ці менш месцы. 

Між тым, у articles.php, з'яўляецца яшчэ адным файла, які мы напісалі ў поўным аб'ёме. Ён вельмі падобны па духу Функцыя ПРАГЛЯД пастаўленай задачы 7, у які зьвязаўся з Yahoo Finance для вас. Гэты файл кантакты Google Навіны для вас, у канчатковым рахунку, захопліваючы машыначытальнай version-- ў чым-то называецца RSS format-- навінаў Кембрыдж або Беверлі-Хілз або любым горадзе вы шукалі для аснове гэтага geoparameter. Мы разабраць, што RSS, які знаходзіцца ўсяго ў тып мовы разметкі называецца XML, і тады мы на самай справе вярнуць яго ў браўзэры і ваш код JavaScript, У прыватнасці, у фармаце, званым JSON, JavaScript Object Notation. Цяпер вы ўбачыце ў specification-- мы паказваем вам на тое, як вы можаце бачыць, некаторыя з будучага back-- JSON што гэтая функцыя ў канчатковым рахунку, дазваляе вам запоўніць гэтыя усплывальныя меню, так што пры націску на маркер у карце вы на самой справе бачыце цэлую кучу куль, кожны з якіх Спасылкі на артыкулы. 

Зараз давайце зірнем на яшчэ адзін PHP-файл, які, на шчасце, не ёсць шмат усяго адбываецца on-- толькі даволі вялікі TODO. Зараз гэты файл аб'яўляе Масіў назваць месцамі. , І ў выніку друкуе што масіў у JSON format-- даволі-друку яго проста так, што рэчы лягчэй для адладкі. На жаль, у сярэдні ёсць гэты TODO, якая заклікае да вас шукаць база дадзеных для месцаў, адпаведных гео HTTP параметрам. 

І, сапраўды, гэта будзе быць адным з вашых challenges-- каб рэалізаваць гэтую функцыянальнасць тут так што, калі вы звярніцеся да гэтага файлу URL як пошук. PHP? Гео = тое, ваш код будзе ў канчатковым выніку вярнуць JSON Масіў ўсіх аб'ектаў у спісе Табліца базы дадзеных, якія адпавядаюць гэтаму ўваходу. Так што, калі карыстальнік ўводзіць у Кембрыджы, Ваш файл тут search.php у канчатковым рахунку павінны вярнуць масіў JSON для ўсіх матчаў у Кембрыдж, якія могуць быць у штаце Масачусэтс але можа быць нават дзе-небудзь яшчэ. 

Нарэшце, давайце зірнем на два файлы, якія з'яўляюцца статычнымі ultimately-- Ваш файл CSS і ваш файл JavaScript. Калі я іду ў нашым каталогу CSS, ёсць цэлая куча файлаў там, але большасць з іх з'яўляюцца бібліятэкі. Я збіраюся зірнуць, У прыватнасці, на styles.css, якая з'яўляецца нашым уласным глабальны CSS гэта будзе стылізаваць ўвесь гэты калажаў. Я пакіну гэта вам прачытаць каментары тут, але, увогуле, гэта CSS, што гарантуе, што нашы калажаў, па змаўчанні з скрынкі, выглядае менавіта так, як мы хочам it-- з картай запаўнення назіральнае адтуліну і з пошукам запіхваць у левым верхнім куце. Мы таксама ўзяў на сябе смеласць стылізацыю, што typeahead выпадальны спіс Меню трохі, як добра. 

Найбольш важны файл Магчыма, па гэтай пастаўленай задачы гэта апошні, scripts.js. Усярэдзіне каталога JS нават некалькі файлаў. Усе яны бібліятэчныя файлы для гэтага, акрамя аднаго, scripts.js. Калі мы адкрыем гэтую гульню, давайце наш выніковы тур праз функцыі, якія ўбудаваны ў гэтым файле для вас і ўвагі выкліку у нязробленым, якія ляжаць наперадзе. 

У верхняй часткі гэтага файла, тры глабальныя зменныя. Адзін за картай, якая збіраецца быць спасылка на нашай карце Google. Вы можаце думаць пра гэта накшталт як паказальнік. Між тым, мы маем іншы глабальнай зменнай называецца інфармацыя, якая, як уяўляецца, захоўвання вяртаецца значэння выкліку да новага google.maps.InfoWindow. JavaScript падтрымлівае аб'екты, якія вельмі падобныя па духу Struts. І тое, што гэтая лінія для нашы мэты робіць стварае новую інфармацыю акно, у памяці, а затым трымаць вакол спасылкі да яго ў зменнай з імем інфармацыя. І паміж гэтымі, Між тым, тое, што з'яўляецца каб быць пусты наяўнасць Масіў называецца маркеры. Усе гэтыя газетныя абразоў, ці вы можа наогул выбраць іншы значок, якія будуць захоўвацца у канчатковым рахунку, у гэтым масіве так што мы можам вельмі лёгка дадаць у карта і выдаліць іх з карты. 

Зараз давайце пракруціць ўніз ледзь-ледзь і свіст з дапамогай кода, будзе выконваецца, як толькі DOM або дакумента аб'ектная мадэль або Сама старонка будзе гатовая. Нагадаем, што гэты сінтаксіс тут проста паказвае што наступны код павінен быць выкананы толькі калі браўзэр скончыў загрузка ўсё астатняе. 

Мы спачатку аб'явіць цэлая куча стыляў, якія ў канчатковым выніку стылізацыі Карта, як у спецыфікацыі. Затым мы аб'яўляем Увесь набор опцый, якія ў далейшым наладзіць Google Карта, што мы збіраемся укараніць. Затым мы выкарыстоўваем трохі JQuery код, што тлумачыцца ў трохі больш падрабязна у спецыфікацыі, каб захапіць што элемент, карта палатно што мы так адназначна ідэнтыфікаваныя. А потым гэтая лінія тут тое, што здаецца чароўным даць нам Карта Google ўнутры наш ўласнае прыкладанне, захоўвання спасылку на іх ў гэтай зменнай называецца мапе. 

Нарэшце, тут мы рэгіструем тое, што называецца слухачом. Падумайце back-- шлях, шлях back-- да нулявой тыдні ў CS50 калі мы глядзелі на пустым месцы і падтрымка праз шпацыр праз рэчы, званыя падзеі і трансляцыі. Вы не маглі б выкарыстоўваць сам, але гэта механізм, з дапамогай якога Браўзэр у гэтым выпадку можа прыцягнуць нашу ўвагу, калі гэта гатовы на самай справе выканаць код. У гэтым выпадку, гэта будзе слухаць на карту для мерапрыемстве пад назвай прастойвае. Гэта азначае, што браўзэр мае завяршыў загрузку карту Google. На дадзены момант функцыя называецца Налада павінна ў канчатковым рахунку, быць пакараны. Гэтая функцыя, наладжваць мы ўбачым, напісана намі. 

Цяпер тут знаходзіцца функцыя што, на жаль, проста TODO дадаць маркер. Паводле спецыфікацыі. Вы будзеце мець патрэбу напісаць код, які на самай справе дадае marker-- выглядае Ці гэта як газету, так і на флэш тактыку, або што-то else-- да карце Google. Вось цяпер у тым, што функцыя называецца наладзе. Я пакідаю гэта вам чытаць праз гэта больш падрабязна, але разумею, што мы дадаем куча больш слухачоў так што мы можам выканаць код, калі Карыстальнік націскае на цягне карту. У нас таксама ёсць код тут ініцыялізуе гэтую typeahead убудова так што выпадальны Меню сапраўды працуе. 

Але давайце засяродзіцца толькі на некалькі месцаў тут. У прыватнасці, гэта зрабіць тут. Я адкласці да онлайн дакументацыя і спецыфікацыі аб тым, як запоўніць гэтую TODO. Але ў двух словах, гэтая бібліятэка typeahead дазваляе перадаваць У тое, што агульнавядома як шаблон, які мае некаторыя зменныя запаўняльнікі вельмі блізкія па духу PRINTF у%. * S. Але ў гэтым выпадку, шаблон паводле спецыфікацыі дазваляе паказаць якія зменныя вы хочаце ўводзіць з дадзеных, якія прыходзяць назад ад чаго-то накшталт PHP файлы, якія вы напісалі што выпраменьваюць выхад JSON. 

Цяпер тут разумеюць, што мы прыслухоўваючыся да typeahead выбараў калі карыстач у рэчаіснасці вядзе пошук і выбірае значэнне. Гэта, як мы на самай справе будзе слухаць, што і выканаць код у якасці выніку. Тады мы працягваем наладжваць калажаў толькі ледзь-ледзь. І, у канчатковым рахунку, мы называем Гэтая функцыя абнаўлення. Ён абнаўляе маркеры на экране. Больш падрабязна пра гэта ў хвіліну. Між тым, ёсць некалькі невялікія функцыі тут. Адным з іх з'яўляецца hideInfo якія проста закрывае InfoWindow. Яшчэ адна функцыя тут, што ў канчатковым выніку не будзе занадта доўга, выдаліць маркеры. Гэта збіраецца адмяніць усе надбудова функцыя маркер ня. А потым сюды, гэта пошук. А гэта цікава, таму што мы напісаў код JavaScript, што гэта збіраюся пагаварыць з search.php на сервер і атрымаць назад некаторую рэакцыю. 

Вы, вядома, будзе па-ранейшаму неабходна рэалізаваць search.php, але мы рэалізавалі Код JavaScript гэта справімся, фактычна выконваючы пошук ад гэтага тэкставае поле. У прыватнасці, паведамлення што гэтая функцыя тут, пошук, сапраўды патрабуе search.php па спосабе, званаму атрымаць JSON, які мы бачылі ў лекцыі. І сінтаксіс тут гэта крыху па-іншаму З лекцыі ў тым, што мы выкарыстоўваем JQuery так званы інтэрфейс абяцанне. Больш падрабязна пра гэта ў спецыфікацыі. Гэта проста азначае для нашых Мэты Цяпер, калі дзве спецыяльныя функцыі, якія мы трэба патэлефанаваць з кропкавай натацыі тут адразу пасля выкліку атрымаць JSON. Адна з іх называецца зрабіць. Адна з іх называецца правал. Вы можаце думаць пра іх ў якасці апрацоўшчыка поспеху і апрацоўшчык адмову толькі калі нешта пойдзе не так. 

Зараз давайце паглядзім на апошні Некалькі функцый у гэтым файле. Ўніз тут функцыя называецца showInfo, што паказвае інфармацыю ў адным з тых, маленькія інфармацыйныя вокны, якія з'яўляецца, калі карыстальнік пстрыкае маркер. Ўніз вось далей ёсць што функцыя абнаўлення што мы рэалізавалі для вас. Ён вызначае межы карты. Якія GPS каардынаты яго паўночны ўсход і паўднёвы захад куты тут. Мы падрыхтавалі некаторыя параметры HDP тут, а затым перадаў іх у канчатковым рахунку, у update.php, які мы Таксама рэалізаваны для вас. У канчатковым выніку, вяртаецца некаторы JSON ад файла называецца update.php а затым выдаляе любыя Маркеры на экране а затым перабірае дадзеныя, якія вяртаюцца ад update.php, які зноў проста масіў JSON. І тады, у канчатковым рахунку дадае маркер для кожны з гэтых месцаў, апрацоўкі адмову або памылак, якія могуць вельмі добра здарыцца. 

Цяпер толькі, каб даць вам густ, як вы можа пайсці аб адладцы гэты праект, разумею, што я адкрыў у прасунуць гэтую ўкладку тут, каб гэтым адрасе, pset8 / articles.php? гео = 02138. Зараз зноў артыкулы пра PHP мы рэалізавалі для вас так што гэта не так шмат тое, што вы будзеце выкарыстоўваць для адладкі, а тэхнікі. Звярніце ўвагу, што я шукаў Паштовы індэкс Кембрыджа тут, і я атрымаў назад, на самай справе, JSON масіў JSON аб'ектаў, усярэдзіне якіх два keys-- спасылку і назва. 

Так гэтая функцыянальнасць ўжо працуе для вас. Але гэты метад ўручную адбываецца у URL, як гэта нешта накшталт search.php? гео = Кембрыдж або 02138 або тое, што карыстальнік набраў у павінны неацэнным, як вы самі, паспрабуйце каб высветліць дакладна, ці чаму search.php працуе ці не. 

У канчатковым рахунку, то, у вас ёсць некалькі ToDos перад вамі. Вы збіраецеся першых гармат што сцэнар імпарту, што счытвае us.text ў вашай базе дадзеных. Вы тады будзеце мець патрэбу ажыццявіць search.php так, што ён паводзіць сябе так, як паказана. Вы тады збіраецеся хочаце засяродзіцца на scripts.js і ў канчатковым выніку рэалізуе тыя пару нязробленым, у тым ліку для Наладзіць і што шаблон, дадаць маркеры, выдаліць маркеры, і Затым у мінулым, але не менш важнае, адзін асабісты кантакт. 

Калі ў вас ёсць калажаў працу зусім як у нас, мэта пад рукой для Вас, каб дадаць асабісты дакрануцца да вашай калажаў, ці з'яўляецца гэта эстэтычнае або функцыянальнае. Вазьміце калажаў вельмі трохі на наступны ўзровень. Так доўга, як вы прымусіць сябе за ваша знаёмства з самай спецыфікацыі і забраць адну тэхніку новы, нават калі гэта проста то эстэтычныя, як змяняецца Схема карце, які вы выкарыстоўваеце, Сфера, што мы чакаем, будуць задаволеныя. Што ж тады праблема Set 8 Mashup. Заставайцеся з намі для больш Спецыфікацыя і ўдачы вырашэння гэтага ваш апошні Праблема CS50 ўсталяваць ніколі. 

[Гуляе музыка]