Напиши разширение за Google Chrome, за нула време. Но не може да има (и има) в писмена форма от първите въпроси rashireniem. Повечето наръчници за написването на първото разширение са проектирани да използват първата версия на манифеста, чиято подкрепа ще престане в близко бъдеще.
В тази статия ще се счита:
- Как се пише манифест v.2
- Как се работи с отдалечени ресурси
- Как да работим с бисквитки
- Как да работим с локално хранилище
- Как да се справим с известията
До края на статията ще бъде организатор готов експанзия, която е поле за добавяне на нова задача, както и списък със задачи за текущия ден. Да означим всички изисквания за организатора:
- Трябва ли да има поле за добавяне на събитието (дата, час, събитие)
- Тя трябва да покаже всички задачи за текущия ден, от часа
- Всички минали събития трябва да показват задраскан
- Тя трябва да има поле за въвеждане на времето, за това колко е необходимо да се покаже съобщението, както и активиране и деактивиране на квадратчето, за да показват известия на работния плот
- За определено време преди събитието трябва да се покаже известие за предстоящо събитие
Започваме да създадете разширение от самото начало, тоест, с манифеста. Манифест - това е един и същи файл в разширения МДМ предписани параметри. Име, описание, версия, разрешение за достъп до сайтове, разрешение за използване на бисквитки, известия местното хранилище. Като цяло, манифестът - удължител. Създаване на файл manifest.json. Манифест - един файл, който трябва да има предварително зададено име, всички други файлове могат да бъдат дадени всяко име. В този файл има три задължителни полета:
Има няколко правила:
- Версията на манифеста трябва да е цяло число, тогава няма да бъде записано като 2 вместо "2".
- разширение версия трябва да бъде низ, но съдържа само цифри и точки, това е, "1.0" - е добро, и 1.0 и "0.9 бета" - лошо.
С задължителни полета - всичко се премине към създаване на изскачащи повишаване на прозорец. Да, като кликнете върху иконата, се отваря прозорец, който трябва да добавите в манифест "browser_action"
Сега създайте изскачащ прозорец. Това е често срещан HTML страница, която може да бъде всякакъв размер и цвят, без трикове. Нека да наречем "popup.html" файл. Създаване на този файл не е достатъчно - той трябва да бъде посочена в манифеста. Така че ние направихме: «default_popup»: «popup.html».
Добавяне на разширения за браузъра
Сега е време да се тества функционалността на нашия rasshirniya. За да направите това, изтеглете разширението на вашия браузър. Open в менюто на браузъра разширения. Сложете една птица в "режим на програмиста".
След това ще има три бутона. Натиснете бутона "Зареждане на разпакетирано разширение. ". Изберете папката с разширението на файла. Това ще доведе до нашата експанзия. Ако всичко е наред, а след това, като кликнете върху иконата - прозореца povitsya:
скриптове за връзка
Сега се свърже тези скриптове в popup.html
Когато помощта за съхранение в хром можете да съхранявате потребителски данни. И това е в наш разширение за съхранение и ще запази предстоящи събития. В действителност има две причини. На първо място, hranischiesya на данни в склад може да се синхронизира, ако браузъра за вход. И на второ място, данните могат да се съхраняват не само в низ, както и в бисквитките, и във всякаква форма, то е възможно да се съхранява и масиви и обекти. За да стане това, свободния достъп до склад в манифеста.
Сега ремонтирам vsplavayuschee прозорец. В прозореца на поп-нагоре ще бъде поле с днешна дата, три INPUT за датата, часа и описанието на новото събитие, бутонът за добавяне на ново събитие, както и списък на всички събития за днес.
Веднага добавете дисплея на дата в #today_date блок.
Тя трябва да изглежда така:
Така че, когато натиснете бутона "+", ние трябва да добавите събитие. Файл първоначално обяви сториджа променлива - съоръжението да работи с памет, както и глобален набор от задачи, които да се съхраняват събития.
Валидиране Проверката определя датата е писано в d.m.yyyy формат и време в чч формат: мм, както и че в описанието на събитието най-малко три знака.
С добавянето на измисли, ние се връщаме към производство на събития за днес. За това ние трябва да получите всички събития от базата данни, изберете всички днешни събития само и да ги сортирате по време във възходящ ред.
getTodayTasks () връща от общия списък само събития с днешна дата.
sortTasks () функция сортира събитията по възходящ път.
известие
Това е време, за да изберете на дисплея на уведомлението на екрана. Добави в специален прозорец квадратче. Ако тази отметка е маркиран - uvedomlenieya ще се появи, ако тя не е маркиран - ще не. Просто добавете текст INPUT. INPUT фигура, това означава колко време преди събитието ще бъдат показани на уведомлението. Това означава, че ако имаме едно събитие насрочено за 19:00 часа на 5, а след това ще се покаже известие при 18:55 в въвеждане на текст. Popup.html добавите кода в тези INPUT
Сега нека да стигнем до това как ще работи. С кликване върху квадратчето за атрибута ще бъде проверена само проверени, стойността на атрибут ще бъде записана в "show_notifications" бисквитката. Превъртете до въвеждане на текст. Според стойността на промяната, новата стойност ще бъде за валидиране, ако това е цяло число, и не повече от 120 напише нова стойност в бисквитката "when_to_notify".
Но, за да има тя работи, трябва да се отвори достъп до бисквитките. За да направите това, ние се връщаме в manifest.json и добавете към "Разрешения"
Сега можете да започнете сценария. Отиди popup.js. За да започнете, задайте началната стойност във входа. По подразбиране, поставете отметка в квадратчето не е отметнато, което означава, че съобщението не се появи, а времето е 0. Когато кликнете върху квадратчето, няма да се промени "бисквитка show_notifications" на. Ако промените стойностите в текстовото поле ще се промени бисквитка "when_to_notify" стойност.
Нека разгледаме функцията. Нека да започнем с функциите за работа с бисквитки. В този случай, ние бяхме отведени в готов функция w3schools.com.
Нека разгледаме функция setCheckbox (). Тя получава бисквитка "show_notifications" и проверки, за да се види дали една и съща "истинска" (текст, да), получената стойност, опцията е отметната в квадратчето, за да е истина, иначе са лъжа.
А сега да разгледаме setWhenToNotify (). Това отнема новата стойност на таймера. Ако тази стойност - цяло число, и не повече от 120 минути, бисквитката "when_to_notify" постави нов стойност. Ако променливата не се предава тази проверка, на входа се връща на предишната стойност на бисквитките "when_to_notify".
Сега е ред на действителната обявлението. За да направите това, ще се отвори достъп до нотификации и да се свържете фонови background.js. Вие трябва да го свържете фоновото изображение, тъй като, ако причината за popup.js на уведомяването, това ще се появи само ако отворите изскачащ прозорец.
Последният ред дава достъп до отдалечения файл. Фактът, че на снимката, която се показва в уведомлението задължително трябва да бъде на разположение за разширяването на дистанционно. В този случай, локален файл, но достъп все още трябва да се отвори. Сега ние приемаме за background.js. Декларирам променлива съхранение и празен масив на задачите. Освен това, всяка минута в скрипт ще получите списък с днешните събития и да ги получите от списъка със задачи, които трябва да се появят в определеното време. След това, за всеки такъв задача ще покаже уведомлението.
getTodayTasks () и getCookie (), взети от popup.js. Така че нека да започнем с анализ на (функция getNextTask). Функцията сравнява текущото време и времето на събитието, ако тя е равна на стойността, която се съхранява в бисквитката "when_to_notify", а след това на масива е приложен следващия ред от времето на събитието и описание. След проверка на всички събития vozvraschet масив следващия.
шоу () функция показва уведомление с посочения текст.
В резултат на този сценарий трябва да бъде нотифицирано тук:
послеслов
Полезни връзки
Свързани статии