Wtyczka do chrome a DOM

Question

Witam, 

napisałem znajomemu prostą funkcję : 
 

function rep(klucz,klucz2) { 
	var tab = document.getElementsByClassName('namevalue');
	for (var x = 0; x < tab.length; x++) { 
		tab[x].innerText = tab[x].innerText.replace(klucz,klucz2);
}
console.log('check');
}

Jak widać nic zaawansowanego. Chciałbym teraz w ramach rozwijania umiejętności zrobić z tego wtyczkę do Google Chrome :) dwa pola tekstowe wstawiające klucz i klucz2 do funkcji. 

Moje pytanie, gdzie znajdę jakieś w miarę sensowne objaśnienie jak wypełnić manifest.json żeby kod zawarty w wtyczce wykonywał się na aktywnej karcie? :) 

Tak wiem, dokuemntacja googla jest ale jak dla mnie jest strasznie "pokrętna" i niezrozumiała (oby chwilowo :) )

Z góry dziękuję za pomoc.

Pozdrawiam 

Answer 1

Moje pytanie, gdzie znajdę jakieś w miarę sensowne objaśnienie jak wypełnić manifest.json żeby kod zawarty w wtyczce wykonywał się na aktywnej karcie? :) 

Sama funkcja się sama nie wywoła - potrzebujesz jakiś interfejs, który poprosi usera o wartości klucz i klucz2.

Widzę trzy możliwości:

- dynamiczne dodanie guzika wykonującego akcję (pokaże popup z polami tekstowymi eetc) na stronę - wtedy wystarczy sam content script

- prosty guzik (z akcją-stroną z polami tekstowymi) na pasku narzędzi przeglądarki - wtedy potrzebujesz background page z kodem który odpalisz jednorazowo na stronie przez `tabs.executeScript()`

- podejście mieszane i pewnie najbardziej "ładne" technicznie - guzik (z akcją-stroną) który przekaże informację o akcji do content scriptu na stronie, który wykona samą akcję.

Pierwsze podejście jest raczej najłatwiejsze do zaimplementowania - wtedy manifest wygląda mniej więcej tak:

{
	"name": "test",
	"description": "test",
	"version": "0.1",
	"content_scripts": [
		{
			"matches": ["http://*/*", "https://*/*"],
			"js": ["skrypt.js"]
		}
	],
	"permissions": [
		// nie pamietam na 100% jaki jest minimalny zbior wymagan
		"tabs",
		"<all_urls>"
	],
}