Что ж, пришло время объединить два API Google.

import

Напомним, что places (табличка MySQL, которую вы ранее импортировали), пока что пуста. Данные, которые она должна содержать, находятся в файле US.txt.

Запишите в файл import PHP-скрипт в командной строке, который принимает аргументом командной строки путь к файлу (допустим, этот файл такого же формат, что и US.txt), который выполняет итерацию по строкам файла и записывает каждую новую строку в places.

Общий дизайн файла мы оставляем на ваше усмотрение, но не забудьте хорошо проверить его на ошибки, используя file_exists, is_readable и\или другие. Возможно, следующие функции также могут быть полезны: fopen, fgetcsv, fclose и query с functions.php. Заметьте, что третий аргумент в fgetcsvз (который является необязательным) позволяет заменить дефолтное значение разделителя (в нашем случае это запятая) на что-либо другое.

Чтобы запустить скрипт, выполните в командной строке команду:

./import /path/to/US.txt

где /path/to/US.txt — настоящий путь к файлу, относительный или абсолютный.

Возможно, первые несколько попыток запустить скрипт не будут удачными, то вам будет полезно очищать places между запусками вызывая

TRUNCATE places

во вкладке phpMyAdmin SQL или выбирая Empty the table (TRUNCATE) во вкладке phpMyAdmin Operations. Если вы используете первый способ, не забудьте выбрать places (из левой колонки в phpMyAdmin), чтобы случайно не обрезать какую-то другую таблицу. И ни в коем случае не кликайте на Delete the table (DROP), иначе вам придется заново импортировать pset8.sql и восстановить все сделанные изменения.

Рано или поздно для ускорения поиска (search.php) вам придется добавить несколько дополнительных индексов к places. Смотрите http://dev.mysql.com/doc/refman/5.5/en/mysql-indexes.html и http://dev.mysql.com/doc/refman/5.5/en/fulltext-search.html (и не забывайте о Google!), чтобы найти дополнительную информацию и подсказки, как это сделать (мы определили places в pset8.sql с помощью MyISAM, поэтому индекс FULLTEXT — необязателен).

Java-университет

Хотя иногда данные можно загружать массово через phpMyAdmin (вкладка Import), не поленитесь выполнить описанные шаги для имплементации import), это очень полезно и познавательно.

search.php

Имплементируем search.php так, чтобы он выдавал в результате массив JSON, каждый объект которого отображает строку с places, которая определенным образом соответствует значению geo. Значение geo, переданное в search.php как параметр GET, может быть городом, штатом и/ или почтовым кодом. Решите на ваше усмотрение, как именно будет построено эта соответствие и какие строки выбирать с помощью SELECT. Вам помогут ключевые для SQL слова LIKE и/или MATCH.

Например, рассмотрим следующий запрос: 

CS50::query("SELECT * FROM places WHERE postal_code = ?", $_GET["geo"])

К сожалению, этот запрос требует, чтобы ввод пользователя был в точности равен почтовому индексу (по значению =), что не является достаточным для автозаполнения. Давайте заменим этот запрос другим: 

CS50::query("SELECT * FROM places WHERE postal_code LIKE ?", $_GET["geo"] . "%")

Этот запрос ищет не только postal_code, но и place_name. Предполагается, что вы определили индекс FULLTEXT вместе с postal_code и place_name, что вы можете сделать с помощью вкладки Structure в phpMyAdmin. (посмотрим, можете ли вы определить, как именно!)

Скорее всего, вы не захотите использовать какой-либо из этих запросов напрямую, вместо этого решив для себя, какие поля искать и какие поиски поддерживать!

Чтобы узнать больше, воспользуйтесь ссылками:

Чтобы протестировать search.php, перейдите по следующим URL:

и другими подобными вариантами, где username — ваше имя пользователя, чтобы проверить, вернёте ли вы ожидаемый JSON. Опять, это вам решать, насколько гибким будет search.php по отношению к аббревиатур, знаков препинания и тому подобное. Чем больше гибкости, чем лучше! Попробуйте имплементировать функции, которые вам, как пользователю, показались бы полезными и важными.

И другие такие варианты, где username — ваше собственное имя пользователя, чтобы узнать, вернете ли вы ожидаемый JSON (а не, скажем, какую-то большую оранжевую ошибку!). Опять же, однако, мы предоставляем вам возможность решить, насколько толерантен будет search.php, по отношению к аббревиатурам, знакам пунктуации и прочим сложностям. Чем толерантнее, тем лучше! Попытайтесь реализовать функции, которые вы сами ожидаете от пользователя!

Не стесняйтесь изучать с решением персонала на https://mashup.cs50.net/, проверяя его HTTP-запросы через вкладку «Сеть» Chrome, если это необходимо, если вы не знаете, как должен работать ваш собственный код!

Scripts.js

Во-первых, в верхней части scripts.js вы увидите анонимную функцию, внутри которой находится определение параметров, объект, один из ключей которого является центром. Его значение — это объект с двумя собственными ключами , Lat и lng. В комментариях рядом с этим объектом карта вашего мэшапа в настоящее время сосредоточена на Стэнфорде, штат Калифорния. (D’oh.) Измените координаты центра вашей карты на Кембридж (42.3770, -71.1256) или Нью-Хейвен (41.3184, -72.9318) или еще где-нибудь! Учтите, если вы загрузили US.txt должны выбрать координаты в США! После того, как вы сохраните изменения и перезагрузите свою карту, вы должны найти себя там! Уменьшите изображение, если необходимо, для визуального подтверждения.

По-прежнему разбирайтесь с решением персонала на https://mashup.cs50.net/, проверяя его HTTP-запросы через вкладку Network в Chrome. Особенно если вы не знаете, как должен работать ваш собственный код!

сonfigure

Теперь, когда search.php и текстовое поле, наконец, работают, измените в configure (функция в scripts.js) значения suggestion, чтобы вместо TODO, мы видели отображения (то есть, place_name, admin_name1 и/или другие поля). Напомним, что запись

&ltp><%- place_name %>, <%- admin_name1 %></p>

Может вводить в заблуждение, поскольку, вероятно, привязана к некоторому CSS.

addMarker

Имплементируем addMarker в scripts.js так, чтобы addMarker добавлял бы маркер place на карту, где place —JavaScript-объект, который отображает строку с places, нашей MySQL-таблицы. Используйте https://developers.google.com/maps/documentation/javascript/markers для подсказок, а также https://github.com/googlemaps/v3-utility-library для альтернативы собственных маркерам Google (напомним, что мы же загрузили markerwithlabel_packed.js в ваш index.html).

Когда кто-то кликает на маркер, должно открыться информационное окно, которое привязано к этому маркеру. Это окно должно содержать неупорядоченный список ссылок на статьи, размещенные в этом регионе/городе (иначе articles.php должен выдать пустой массив).

Не переживайте, если ваши маркеры будут накладываться друг на друга, это несовершенство US.txt, а не вашего кода!

Если вы хотите кастомизировать иконку маркера, поищите здесь: https://developers.google.com/maps/documentation/javascript/markers#simple_icons

Для стандартных картинок Google Maps смотрите сюда http://www.lass.it/Web/viewer.aspx?id=4, а для получения иконок сторонних производителей — сюда: http://mapicons.nicolasmollet.com/category/markers/.

removeMarkers

Имплементируем removeMarkers так, чтобы эта функция удаляла все маркеры с карты. Вероятно, для этого вам понадобится функция addMarker, чтобы изменить глобальную переменную markers чтобы removeMarkers заработала.

Дополнительная функциональность

Последнее, но не менее важное: добавьте хотя бы одну собственную особенность для этой задачи. Например, поменяйте её внешний вид или добавьте какую-то новую функциональность, которой (в идеале!) нет ни у кого из сокурсников. Любая функциональность, которая дает вам возможность изучить (или загуглить!) хотя бы одну новую технику также подходит.