matomo-mirror/matomo-injector
Archived
1
0
Fork 0
Code Releases Activity

piwik template

Browse source
This commit is contained in:
Lukas Winkler 2017-08-27 09:32:05 +02:00
parent 39e1767a53
commit 6b75d26169
5 changed files with 104 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
_locales/en/messages.json
View file

@ -1,10 +1,18 @@
{
"extention_name": {
"message": "Piwik Injector",
"description": "name of the extention"
},
"extention_description": {
"message": "Run custom JavaScript on any website.",
"description": "a short description shown in the extention list"
},
"host_label": {
"message": "hosts",
"description": "label of host selection dropdown"
},
"host_title": {
"message": "List of websites modified by Your custom js",
"message": "List of websites modified by your custom js",
"description": "title-text of host selection dropdown"
},
"save": {
@ -58,5 +66,21 @@
"enable_description": {
"message": "enable injection for this host",
"description": "label for checkbox"
},
"piwik_url_title": {
"message": "",
"description": "title text of piwik URL input"
},
"piwik_url_placeholder": {
"message": "piwik URL",
"description": "placeholder text of piwik URL input"
},
"site_id_title": {
"message": "",
"description": "title text of site ID input"
},
"site_id_placeholder": {
"message": "site ID",
"description": "placeholder text of site ID input"
}
}

6
css/style.css
View file

@ -18,10 +18,14 @@
height: 75px;
}
.customjs.customjs--error form {
.customjs.customjs--error div, .customjs.customjs--error form {
display: none;
}
.customjs.customjs--error #error {
display: block;
}
a,
a:hover,
.blue-text,

54
js/popup.js
View file

@ -4,7 +4,6 @@ document.addEventListener('DOMContentLoaded', function() {
key: 'popup',
el: {
popup: document.getElementById("customjs"),
popupForm: document.getElementById("popup-form"),
hostSelect: document.getElementById("host"),
hostGoToLink: document.getElementById("goto-host"),
enableCheck: document.getElementById("enable"),
@ -12,25 +11,25 @@ document.addEventListener('DOMContentLoaded', function() {
saveBtn: document.getElementById("save"),
resetBtn: document.getElementById("reset"),
draftRemoveLink: document.getElementById("draft-remove"),
error: document.getElementById("error")
},
title: {
include: {
textarea: 'Uncomment address of script below or type your own (one per line)',
mask: 'Click to close textarea popup'
}
error: document.getElementById("error"),
piwikForm: document.getElementById("piwik-form"),
piwikURL: document.getElementById("piwik-url"),
siteID: document.getElementById("site-id")
},
applyi18n: function() {
var translatableIDs = ["error-message", "error-tip", "save", "reset", "goto-host", "enable-description"];
var translatableIDs = ["error-message", "error-tip", "save", "reset", "goto-host", "enable-description", "host-label"];
translatableIDs.forEach(function(id) {
var translateKey = id.replace("-", "_");
document.getElementById(id).innerText = chrome.i18n.getMessage(translateKey);
});
var translatableTitles = ["host", "goto_host", "save", "reset", "draft_remove"];
var translatableTitles = ["host", "goto_host", "save", "reset", "draft_remove", "piwik_url", "site_id"];
translatableIDs.forEach(function(id) {
var translateKey = id.replace("-", "_") + "_title";
document.getElementById(id).setAttribute('title', chrome.i18n.getMessage(translateKey));
});
popup.el.piwikURL.setAttribute("placeholder", chrome.i18n.getMessage("piwik_url_placeholder"));
popup.el.siteID.setAttribute("placeholder", chrome.i18n.getMessage("site_id_placeholder"));
document.title = chrome.i18n.getMessage("extention_name")
},
host: undefined,
emptyDataPattern: {
@ -52,6 +51,7 @@ document.addEventListener('DOMContentLoaded', function() {
// editor.setHighlightActiveLine(false);
editor.getSession().on('change', this.onChange);
editor.$blockScrolling = Infinity;
// editor.setReadOnly(true)
},
apply: function(source) {
var editor = this.editorInstance;
@ -242,6 +242,32 @@ document.addEventListener('DOMContentLoaded', function() {
popup.applyData(popup.storage.get('draft'));
}
},
piwik: {
defaultTrackingCode: "var _paq = _paq || [];\n" +
"/* tracker methods like \"setCustomDimension\" should be called before \"trackPageView\" */\n" +
"_paq.push(['trackPageView']);\n" +
"_paq.push(['enableLinkTracking']);\n" +
"(function() {\n" +
" var u=\"{{PIWIKURL}}\";\n" +
" _paq.push(['setTrackerUrl', u+'piwik.php']);\n" +
" _paq.push(['setSiteId', '{{SITEID}}']);\n" +
" var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];\n" +
" g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);\n" +
"})();",
handleTrackingCode: function() {
var piwikURL = encodeURI(popup.el.piwikURL.value);
var siteID = parseInt(popup.el.siteID.value, 10);
if (!siteID || !piwikURL) {
return false;
}
console.warn(piwikURL, siteID);
var js = popup.piwik.defaultTrackingCode;
js = js.replace("{{PIWIKURL}}", piwikURL);
js = js.replace("{{SITEID}}", String(siteID));
popup.editor.apply(js)
}
},
generateScriptDataUrl: function(script) {
var b64 = 'data:text/javascript';
// base64 may be smaller, but does not handle unicode characters
@ -394,6 +420,10 @@ document.addEventListener('DOMContentLoaded', function() {
}, popup.apiclb.onSelectedTab);
popup.el.piwikForm.querySelectorAll("input").forEach(function(input) {
input.addEventListener("change", popup.piwik.handleTrackingCode)
});
/**
* Auto save draft
*/
@ -402,6 +432,10 @@ document.addEventListener('DOMContentLoaded', function() {
var draft = popup.getCurrentData(),
source = draft.source;
if (!popup.data) {
popup.error();
return false;
}
if ((source || !popup.data.source) && source !== popup.data.source) {
popup.storage.setMode(popup.storage.MODE.private);

2
manifest.json
View file

@ -1,6 +1,6 @@
{
"manifest_version": 2,
"name": "Piwik Injector",
"name": "__MSG_extention_name__",
"short_name": "piwik-injector",
"version": "3.0.0",
"author": "Lukas Winkler, xcv58, hromadadan",

50
popup.html
View file

@ -1,7 +1,7 @@
<!doctype html>
<html>
<head>
<title>Custom JavaScript</title>
<title></title>
<link href="libs/purecss/base-min.css" rel="stylesheet">
<link href="libs/purecss/grids-responsive-min.css" rel="stylesheet">
@ -9,15 +9,14 @@
<link href="libs/purecss/buttons-min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script type="text/javascript" src="libs/ace/ace.js" charset="utf-8"></script>
</head>
<body>
<div class="customjs" id="customjs">
<form action="" method="post" accept-charset="utf-8" id="popup-form" class="pure-form">
<form action="" method="post" accept-charset="utf-8" id="popup-form" class="pure-form pure-form-stacked">
<div class="pure-g host">
<div class="pure-u-3-5 host__name">
<label for="host" id="host-label">Label</label>
<select id="host" name="host"></select>
<a class="is-hidden" id="goto-host" href="#"></a>
</div>
@ -28,30 +27,39 @@
</label>
</div>
</div><!-- .top -->
<div class="pure-g source">
<div class="pure-u-1 source__editor">
<pre id="ace-editor"></pre>
<input type="hidden" name="script" value="">
</div>
</div><!-- .source -->
<div class="pure-g">
<div class="pure-u-3-5 controls">
<button id="save" class="controls__save pure-button pure-button-primary"
name="save"></button>
<button id="reset" class="controls__reset pure-button" name="reset"></button>
<a id="draft-remove" class="controls__remove-draft red-text is-hidden" href="#"></a>
</div>
</div><!-- .controls -->
</form>
<form class="pure-form" id="piwik-form">
<input id="piwik-url" title="">
<input type="number" id="site-id" min="0" title="">
</form>
<form class="pure-form" id="piwik-form">
<label for="expert-mode">gffdgkfdglj</label>
<input type="checkbox" id="expert-mode">
</form>
<div class="pure-g source">
<div class="pure-u-1 source__editor">
<pre id="ace-editor"></pre>
<input type="hidden" name="script" value="">
</div>
</div><!-- .source -->
<div class="pure-g">
<div class="pure-u-3-5 controls">
<button id="save" class="controls__save pure-button pure-button-primary"
name="save"></button>
<button id="reset" class="controls__reset pure-button" name="reset"></button>
<a id="draft-remove" class="controls__remove-draft red-text is-hidden" href="#"></a>
</div>
</div><!-- .controls -->
<!--</form>-->
<div id="error" class="error is-hidden">
<p class="red-text" id="error-message"></p>
<span id="error-tip"></span>
</div><!-- .error -->
</div>
<script type="text/javascript" src="libs/ace/ace.js" charset="utf-8"></script>
<script src="js/popup.js"></script>
</body>
</html>