Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Side by Side Diff: chrome/content/ui/firstRun.js

Issue 11039060: first run page redesign (Closed)
Patch Set: codereview updates Created Aug. 26, 2013, 3:44 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* 1 /*
2 * This file is part of Adblock Plus <http://adblockplus.org/>, 2 * This file is part of Adblock Plus <http://adblockplus.org/>,
3 * Copyright (C) 2006-2013 Eyeo GmbH 3 * Copyright (C) 2006-2013 Eyeo GmbH
4 * 4 *
5 * Adblock Plus is free software: you can redistribute it and/or modify 5 * Adblock Plus is free software: you can redistribute it and/or modify
6 * it under the terms of the GNU General Public License version 3 as 6 * it under the terms of the GNU General Public License version 3 as
7 * published by the Free Software Foundation. 7 * published by the Free Software Foundation.
8 * 8 *
9 * Adblock Plus is distributed in the hope that it will be useful, 9 * Adblock Plus is distributed in the hope that it will be useful,
10 * but WITHOUT ANY WARRANTY; without even the implied warranty of 10 * but WITHOUT ANY WARRANTY; without even the implied warranty of
11 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 11 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
12 * GNU General Public License for more details. 12 * GNU General Public License for more details.
13 * 13 *
14 * You should have received a copy of the GNU General Public License 14 * You should have received a copy of the GNU General Public License
15 * along with Adblock Plus. If not, see <http://www.gnu.org/licenses/>. 15 * along with Adblock Plus. If not, see <http://www.gnu.org/licenses/>.
16 */ 16 */
17 17
18 "use strict"; 18 "use strict";
19 19
20 (function() 20 (function()
21 { 21 {
22 var shade;
23 var scrollTimer;
24
25 // Load subscriptions for features 22 // Load subscriptions for features
26 var featureSubscriptions = [ 23 var featureSubscriptions = [
27 { 24 {
28 feature: "malware", 25 feature: "malware",
29 homepage: "http://malwaredomains.com/", 26 homepage: "http://malwaredomains.com/",
30 title: "Malware Domains", 27 title: "Malware Domains",
31 url: "https://easylist-downloads.adblockplus.org/malwaredomains_full.txt" 28 url: "https://easylist-downloads.adblockplus.org/malwaredomains_full.txt"
32 }, 29 },
33 { 30 {
34 feature: "social", 31 feature: "social",
35 homepage: "https://www.fanboy.co.nz/", 32 homepage: "https://www.fanboy.co.nz/",
36 title: "Fanboy's Social Blocking List", 33 title: "Fanboy's Social Blocking List",
37 url: "https://easylist-downloads.adblockplus.org/fanboy-social.txt" 34 url: "https://easylist-downloads.adblockplus.org/fanboy-social.txt"
38 }, 35 },
39 { 36 {
40 feature: "tracking", 37 feature: "tracking",
41 homepage: "https://easylist.adblockplus.org/", 38 homepage: "https://easylist.adblockplus.org/",
42 title: "EasyPrivacy", 39 title: "EasyPrivacy",
43 url: "https://easylist-downloads.adblockplus.org/easyprivacy.txt" 40 url: "https://easylist-downloads.adblockplus.org/easyprivacy.txt"
44 } 41 }
45 ]; 42 ];
46 43
47 function onDOMLoaded() 44 function onDOMLoaded()
48 { 45 {
46 // Set up URL
47 var donateLink = E("donate");
48 donateLink.href = Utils.getDocLink("donate");
49
50 var contributors = E("contributors");
51 contributors.href = Utils.getDocLink("contributors");
52
53 setLinks("acceptableAdsExplanation", Utils.getDocLink("acceptable_ads_criter ia"), openFilters);
54 setLinks("share-headline", Utils.getDocLink("contribute"));
55
49 // Show warning if data corruption was detected 56 // Show warning if data corruption was detected
50 if (typeof backgroundPage != "undefined" && backgroundPage.seenDataCorruptio n) 57 if (typeof backgroundPage != "undefined" && backgroundPage.seenDataCorruptio n)
51 { 58 {
52 E("dataCorruptionWarning").removeAttribute("hidden"); 59 E("dataCorruptionWarning").removeAttribute("hidden");
53 setLinks("dataCorruptionWarning", Utils.getDocLink("knownIssuesChrome_filt erstorage")); 60 setLinks("dataCorruptionWarning", Utils.getDocLink("knownIssuesChrome_filt erstorage"));
54 } 61 }
55 62
56 // Set up URL
57 setLinks("acceptableAdsExplanation", Utils.getDocLink("acceptable_ads_criter ia"), openFilters);
58
59 shade = E("shade");
60 shade.addEventListener("mouseover", scrollPage, false);
61 shade.addEventListener("mouseout", stopScroll, false);
62
63 // Set up feature buttons linked to subscriptions 63 // Set up feature buttons linked to subscriptions
64 featureSubscriptions.forEach(setToggleSubscriptionButton); 64 featureSubscriptions.forEach(setToggleSubscriptionButton);
65 var filterListener = function(action) 65 var filterListener = function(action)
66 { 66 {
67 if (/^subscription\.(added|removed|disabled)$/.test(action)) 67 if (/^subscription\.(added|removed|disabled)$/.test(action))
68 { 68 {
69 for (var i = 0; i < featureSubscriptions.length; i++) 69 for (var i = 0; i < featureSubscriptions.length; i++)
70 { 70 {
71 var featureSubscription = featureSubscriptions[i]; 71 var featureSubscription = featureSubscriptions[i];
72 updateToggleButton(featureSubscription.feature, isSubscriptionEnabled( featureSubscription)); 72 updateToggleButton(featureSubscription.feature, isSubscriptionEnabled( featureSubscription));
73 } 73 }
74 } 74 }
75 } 75 }
76 FilterNotifier.addListener(filterListener); 76 FilterNotifier.addListener(filterListener);
77 window.addEventListener("unload", function(event) 77 window.addEventListener("unload", function(event)
78 { 78 {
79 FilterNotifier.removeListener(filterListener); 79 FilterNotifier.removeListener(filterListener);
80 }, false); 80 }, false);
81 81
82 window.addEventListener("resize", onWindowResize, false); 82 // You can click activate-feature or one of the icons to toggle the features area
83 document.addEventListener("scroll", onScroll, false); 83 E("activate-features").addEventListener("click", showFeature, false);
84 84 E("can-do-more-overview").addEventListener("click", showFeature, false);
85 onWindowResize();
86 85
87 initSocialLinks(); 86 initSocialLinks();
88 } 87 }
89 88
90 function onScroll() 89 function showFeature()
91 { 90 {
92 var currentHeight = document.documentElement.scrollTop + document.body.scrol lTop + document.documentElement.clientHeight; 91 var canDoMore = E("can-do-more");
93 shade.style.opacity = (document.documentElement.scrollHeight == currentHeigh t) ? "0.0" : "0.5"; 92 var canDoMoreOverview = E("can-do-more-overview");
94 } 93 var canDoMoreExpanded = E("can-do-more-expanded");
95 94
96 function onWindowResize() 95 if (!canDoMore.classList.contains("expanded"))
97 { 96 {
98 onScroll(); 97 canDoMore.classList.add("expanded");
99 } 98 canDoMoreOverview.classList.add("fade-out");
100 99
101 function toggleTypoCorrectionEnabled() 100 setTimeout(function()
102 { 101 {
103 Prefs.correctTypos = !Prefs.correctTypos; 102 canDoMoreOverview.classList.add("hide");
103 canDoMoreExpanded.classList.remove("hide");
104 },500);
105
106 /* Next timeout has to be done because of an js bug.
107 * If you set "display: block" and "opacity: 1"
108 * at the same time the content would be shown
109 * directly without any transition.
110 * With the following timeout the opacity
111 * transition works correctly
112 */
113 setTimeout(function()
114 {
115 canDoMoreExpanded.classList.remove("fade-out");
116 },520);
117 }
118 else if (canDoMore.classList.contains("expanded"))
119 {
120 canDoMore.classList.remove("expanded");
121 canDoMoreExpanded.classList.add("fade-out");
122
123 setTimeout(function()
124 {
125 canDoMoreExpanded.classList.add("hide");
126 canDoMoreOverview.classList.remove("hide");
127 },500);
128
129 setTimeout(function()
130 {
131 canDoMoreOverview.classList.remove("fade-out");
132 },520);
133 }
104 } 134 }
105 135
106 function isSubscriptionEnabled(featureSubscription) 136 function isSubscriptionEnabled(featureSubscription)
107 { 137 {
108 return featureSubscription.url in FilterStorage.knownSubscriptions 138 return featureSubscription.url in FilterStorage.knownSubscriptions
109 && !Subscription.fromURL(featureSubscription.url).disabled; 139 && !Subscription.fromURL(featureSubscription.url).disabled;
110 } 140 }
111 141
112 function setToggleSubscriptionButton(featureSubscription) 142 function setToggleSubscriptionButton(featureSubscription)
113 { 143 {
(...skipping 11 matching lines...) Expand all
125 subscription.disabled = false; 155 subscription.disabled = false;
126 subscription.title = featureSubscription.title; 156 subscription.title = featureSubscription.title;
127 subscription.homepage = featureSubscription.homepage; 157 subscription.homepage = featureSubscription.homepage;
128 FilterStorage.addSubscription(subscription); 158 FilterStorage.addSubscription(subscription);
129 if (!subscription.lastDownload) 159 if (!subscription.lastDownload)
130 Synchronizer.execute(subscription); 160 Synchronizer.execute(subscription);
131 } 161 }
132 }, false); 162 }, false);
133 } 163 }
134 164
135 function scrollPage() 165 function scrollPage()
Thomas Greiner 2013/08/26 16:25:04 Doesn't seem to be used anywhere.
136 { 166 {
137 if (scrollTimer) 167 if (scrollTimer)
138 stopScroll(); 168 stopScroll();
139 169
140 scrollTimer = setInterval(function() 170 scrollTimer = setInterval(function()
141 { 171 {
142 window.scrollBy(0, 5); 172 window.scrollBy(0, 5);
143 }, 20); 173 }, 20);
144 } 174 }
145 175
146 function stopScroll() 176 function stopScroll()
Thomas Greiner 2013/08/26 16:25:04 Doesn't seem to be used anywhere.
147 { 177 {
148 clearTimeout(scrollTimer); 178 clearTimeout(scrollTimer);
149 scrollTimer = null; 179 scrollTimer = null;
150 } 180 }
151 181
152 function openSharePopup(url) 182 function openSharePopup(url)
153 { 183 {
154 var iframe = E("share-popup"); 184 var iframe = E("share-popup");
155 var glassPane = E("glass-pane"); 185 var glassPane = E("glass-pane");
156 var popupMessageReceived = false; 186 var popupMessageReceived = false;
(...skipping 61 matching lines...) Expand 10 before | Expand all | Expand 10 after
218 { 248 {
219 event.preventDefault(); 249 event.preventDefault();
220 openSharePopup(Utils.getDocLink(event.target.id)); 250 openSharePopup(Utils.getDocLink(event.target.id));
221 } 251 }
222 } 252 }
223 253
224 function setLinks(id) 254 function setLinks(id)
225 { 255 {
226 var element = E(id); 256 var element = E(id);
227 if (!element) 257 if (!element)
258 {
228 return; 259 return;
229 260 }
261
230 var links = element.getElementsByTagName("a"); 262 var links = element.getElementsByTagName("a");
263
231 for (var i = 0; i < links.length; i++) 264 for (var i = 0; i < links.length; i++)
232 { 265 {
233 if (typeof arguments[i + 1] == "string") 266 if (typeof arguments[i + 1] == "string")
234 { 267 {
235 links[i].href = arguments[i + 1]; 268 links[i].href = arguments[i + 1];
236 links[i].setAttribute("target", "_blank"); 269 links[i].setAttribute("target", "_blank");
237 } 270 }
238 else if (typeof arguments[i + 1] == "function") 271 else if (typeof arguments[i + 1] == "function")
239 { 272 {
240 links[i].href = "javascript:void(0);"; 273 links[i].href = "javascript:void(0);";
(...skipping 16 matching lines...) Expand all
257 { 290 {
258 var button = E("toggle-" + feature); 291 var button = E("toggle-" + feature);
259 if (isEnabled) 292 if (isEnabled)
260 button.classList.remove("off"); 293 button.classList.remove("off");
261 else 294 else
262 button.classList.add("off"); 295 button.classList.add("off");
263 } 296 }
264 297
265 document.addEventListener("DOMContentLoaded", onDOMLoaded, false); 298 document.addEventListener("DOMContentLoaded", onDOMLoaded, false);
266 })(); 299 })();
OLDNEW

Powered by Google App Engine
This is Rietveld