Issue 5539 - Implement "Acceptable Ads notification"

locale/en-US/new-options.json

 {
   "options_page_title": {
     "description": "Options page title",
     "message": "Adblock Plus Options"
   },
   "options_page_header_1": {
     "description": "Page title in navigation sidebar",
     "message": "Options"
   },
   "options_page_header_2": {
@@ skipping 401 matching lines @@
     "message": "Added languages"
   },
   "options_dialog_language_other": {
     "description": "Table headline in add language modal dialog",
     "message": "Other languages"
   },
   "options_dialog_language_other_empty": {
     "description": "Text shown when list of available languages is empty",
     "message": "There are no available languages."
   },
+  "options_dialog_tracking_title": {
+    "description": "Title of tracking modal dialog",
+    "message": "Allow tracking on Acceptable Ads?"
+  },
+  "options_dialog_tracking_notification": {
+    "description": "Text in 'Allow tracking on Acceptable Ads' dialog",
+    "message": "You currently allow Acceptable Ads to be shown. These ads are respectful and do not interfere with content that you view. Some of these ads require tracking to show you more relevant ads. Click <strong>YES</strong> to continue seeing relevant nonintrusive ads."

[saroyanm, 2017/08/19 00:00:40]

In specs each sentence looks to be on it's own line, but we do not support row
breaks in the strings.
One solution is that I can put them inside <span>s with <br> in between:
<span></span><br>
<span></span><br>
<span></span><br>
<span></span>

[Thomas Greiner, 2017/08/25 18:44:51]

This is not a viable solution because we don't support `<span>` tags either.
Furthermore, it'd increase the probability of syntax errors that can be
introduced during translation.

If you don't want to modify the translation code you could simply split it up
into one string per paragraph as we did with "options_page_header_*", for
instance.

Alternatively, you could implement support for `<br>`. I had to do that for
Flattr already so if you want, I could provide you with the code we're using
there.

[saroyanm, 2017/08/27 16:25:28]

Actually that what I meant by the example of spans, so I was thinking to use
<span>s instead of <p> tags.
Yes please, I think that will be best solution and save me time.

[Thomas Greiner, 2017/08/29 10:20:41]

Ah ok. In that case `<div>` would be more appropriate than `<span>` though
because it's already a block element so no need for `<br>`.
I uploaded it to
https://gist.github.com/ThomasGreiner/a2f32ed70cdb19e5e24654ae3b4f5fac (see
`getNodes()`). But note that we're working with a virtual DOM there so you'd
still need to adapt that to using the actual DOM API.

Obviously, we need to be very careful when dealing with transforming arbitrary
text into DOM elements so if you're uncomfortable with doing that feel free to
use multiple strings instead as you suggested.

[saroyanm, 2017/09/14 21:56:14]

Having another look I think we don't need to use <br>, this seems to be
different strings separated into paragraphs, or lists I think.

+  },
+  "options_dialog_tracking_relevent_ads": {

[Thomas Greiner, 2017/08/25 18:44:51]

Detail: Those IDs are specific to how the text is phrased. Instead they should
reflect what the message is.

e.g.
Replace "options_dialog_tracking_relevant_ads" with
"options_dialog_tracking_allow"
Replace "options_dialog_tracking_privacy_ads" with
"options_dialog_tracking_disallow"

[Thomas Greiner, 2017/08/25 18:44:51]

Typo: Replace "relevent" with "relevant"

[saroyanm, 2017/08/27 16:25:28]

agree.

[saroyanm, 2017/09/14 21:56:13]

Done.

+    "description": "Button text in 'Allow tracking on Acceptable Ads' dialog",
+    "message": "Yes, allow relevant ads"
+  },
+  "options_dialog_tracking_privacy_ads": {
+    "description": "Button text in 'Allow tracking on Acceptable Ads' dialog",
+    "message": "No, turn off tracking"
+  },
+  "options_dialog_tracking_note": {
+    "description": "Text in 'Allow tracking on Acceptable Ads' dialog",

[Thomas Greiner, 2017/08/25 18:44:51]

Detail: I wasn't able to tell where this text is supposed to be without looking
at the screenshot. It'd be great if the ID and the description were more
descriptive.

e.g.
"options_dialog_tracking_note_title"
"Text preceding list of notes in 'Allow tracking on Acceptable Ads' dialog"

[saroyanm, 2017/08/27 16:25:28]

Agree.

[saroyanm, 2017/09/14 21:56:14]

Done.

+    "message": "Note:"
+  },
+  "options_dialog_tracking_note_1": {
+    "description": "Text in 'Allow tracking on Acceptable Ads' dialog",
+    "message": "Adblock Plus cannot guarantee that all tracking is disabled."
+  },
+  "options_dialog_tracking_note_2": {
+    "description": "Text in 'Allow tracking on Acceptable Ads' dialog",
+    "message": "Ads shown are chosen by the website you visit, not Adblock Plus."
+  },
+  "options_dialog_tracking_note_3": {
+    "description": "Text in 'Allow tracking on Acceptable Ads' dialog",
+    "message": "Adblock Plus never tracks your data."
+  },
   "options_language_en": {
     "description": "Language name shown in add language modal dialog",
     "message": "English"
   },
   "options_language_id": {
     "description": "Language name shown in add language modal dialog",
     "message": "Indonesian"
   },
   "options_language_bg": {
     "description": "Language name shown in add language modal dialog",
@@ skipping 41 matching lines @@
   },
   "options_language_ro": {
     "description": "Language name shown in add language modal dialog",
     "message": "Romanian"
   },
   "options_language_ru_uk": {
     "description": "Language name shown in add language modal dialog",
     "message": "Russian and Ukrainian"
   }
 }