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: sharing box and feaure list formed into correct wraps Created July 15, 2013, 4:33 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
20 (function() 21 (function()
21 { 22 {
22 var shade; 23 //var shade;
23 var scrollTimer; 24 var scrollTimer;
24 25
25 // Load subscriptions for features 26 // Load subscriptions for features
26 var featureSubscriptions = [ 27 var featureSubscriptions = [
27 { 28 {
28 feature: "malware", 29 feature: "malware",
29 homepage: "http://malwaredomains.com/", 30 homepage: "http://malwaredomains.com/",
30 title: "Malware Domains", 31 title: "Malware Domains",
31 url: "https://easylist-downloads.adblockplus.org/malwaredomains_full.txt" 32 url: "https://easylist-downloads.adblockplus.org/malwaredomains_full.txt"
32 }, 33 },
33 { 34 {
34 feature: "social", 35 feature: "social",
35 homepage: "https://www.fanboy.co.nz/", 36 homepage: "https://www.fanboy.co.nz/",
36 title: "Fanboy's Social Blocking List", 37 title: "Fanboy's Social Blocking List",
37 url: "https://easylist-downloads.adblockplus.org/fanboy-social.txt" 38 url: "https://easylist-downloads.adblockplus.org/fanboy-social.txt"
38 }, 39 },
39 { 40 {
40 feature: "tracking", 41 feature: "tracking",
41 homepage: "https://easylist.adblockplus.org/", 42 homepage: "https://easylist.adblockplus.org/",
42 title: "EasyPrivacy", 43 title: "EasyPrivacy",
43 url: "https://easylist-downloads.adblockplus.org/easyprivacy.txt" 44 url: "https://easylist-downloads.adblockplus.org/easyprivacy.txt"
44 } 45 }
45 ]; 46 ];
46 47
48
49 function showFeature()
50 {
51 var toggleButton = document.getElementById('activate-features');
52 var overView = document.getElementById('can-do-more-overview');
53 var expandedView = document.getElementById('can-do-more-expanded');
54
55 if(toggleButton.getAttribute("status")=="overview")
56 {
57 fade('out', overView, 750, true);
58 setTimeout(function(){fade('in', expandedView, 750, true)},750);
59 toggleButton.innerHTML ="show overview again";
60 toggleButton.setAttribute("status","expanded");
61
62 } else if(toggleButton.getAttribute("status")=="expanded")
63 {
64 fade('out', expandedView, 750, true);
65 setTimeout(function(){fade('in', overView, 750, true)},750);
66 toggleButton.innerHTML ='activate features';
67 toggleButton.setAttribute("status","overview");
68 }
69
70 // jQuery-style fading
71 function fade(type, el, duration, IEsupport) {
72 var isIn = (type == 'in'),
73 IE = (IEsupport) ? IEsupport : false,
74 opacity = isIn ? 0 : 1,
75 interval = 50,
76 gap = interval / duration;
77
78 if(isIn) {
79 el.style.display = 'block';
80 el.style.opacity = opacity;
81 if(IE) {
82 el.style.filter = 'alpha(opacity=' + opacity + ')';
83 el.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + opacity + ')';
84 }
85 }
86
87 function func() {
88 opacity = isIn ? opacity + gap : opacity - gap;
89 el.style.opacity = opacity;
90 if(IE) {
91 el.style.filter = 'alpha(opacity=' + opacity * 100 + ')';
92 el.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + opacity * 100 + ')';
93 }
94 if(opacity <= 0 || opacity >= 1) { window.clearInterval(fading); }
95 if(opacity <= 0) { el.style.display = "none"; }
96 }
97 var fading = window.setInterval(func, interval);
98 }
99 }
100
47 function onDOMLoaded() 101 function onDOMLoaded()
48 { 102 {
103 var donateLink = document.getElementById("donate");
104 donateLink.href = Utils.getDocLink("donate");
49 // Show warning if data corruption was detected 105 // Show warning if data corruption was detected
50 if (typeof backgroundPage != "undefined" && backgroundPage.seenDataCorruptio n) 106 if (typeof backgroundPage != "undefined" && backgroundPage.seenDataCorruptio n)
51 { 107 {
52 E("dataCorruptionWarning").removeAttribute("hidden"); 108 E("dataCorruptionWarning").removeAttribute("hidden");
53 setLinks("dataCorruptionWarning", Utils.getDocLink("knownIssuesChrome_filt erstorage")); 109 setLinks("dataCorruptionWarning", Utils.getDocLink("knownIssuesChrome_filt erstorage"));
54 } 110 }
55 111
56 // Set up URL 112 // Set up URL
57 setLinks("acceptableAdsExplanation", Utils.getDocLink("acceptable_ads_criter ia"), openFilters); 113 setLinks("acceptableAdsExplanation", Utils.getDocLink("acceptable_ads_criter ia"), openFilters);
58 114
59 shade = E("shade"); 115 //shade = E("shade");
60 shade.addEventListener("mouseover", scrollPage, false); 116 //shade.addEventListener("mouseover", scrollPage, false);
61 shade.addEventListener("mouseout", stopScroll, false); 117 //shade.addEventListener("mouseout", stopScroll, false);
62 118
63 // Set up feature buttons linked to subscriptions 119 // Set up feature buttons linked to subscriptions
64 featureSubscriptions.forEach(setToggleSubscriptionButton); 120 featureSubscriptions.forEach(setToggleSubscriptionButton);
65 var filterListener = function(action) 121 var filterListener = function(action)
66 { 122 {
67 if (/^subscription\.(added|removed|disabled)$/.test(action)) 123 if (/^subscription\.(added|removed|disabled)$/.test(action))
68 { 124 {
69 for (var i = 0; i < featureSubscriptions.length; i++) 125 for (var i = 0; i < featureSubscriptions.length; i++)
70 { 126 {
71 var featureSubscription = featureSubscriptions[i]; 127 var featureSubscription = featureSubscriptions[i];
72 updateToggleButton(featureSubscription.feature, isSubscriptionEnabled( featureSubscription)); 128 updateToggleButton(featureSubscription.feature, isSubscriptionEnabled( featureSubscription));
73 } 129 }
74 } 130 }
75 } 131 }
76 FilterNotifier.addListener(filterListener); 132 FilterNotifier.addListener(filterListener);
77 window.addEventListener("unload", function(event) 133 window.addEventListener("unload", function(event)
78 { 134 {
79 FilterNotifier.removeListener(filterListener); 135 FilterNotifier.removeListener(filterListener);
80 }, false); 136 }, false);
81 137
82 window.addEventListener("resize", onWindowResize, false); 138 window.addEventListener("resize", onWindowResize, false);
83 document.addEventListener("scroll", onScroll, false); 139 document.addEventListener("scroll", onScroll, false);
84 140
141 var activateFeaturesButton = document.getElementById('activate-features');
142 activateFeaturesButton.addEventListener("click", showFeature, false);
143
85 onWindowResize(); 144 onWindowResize();
86 145
87 initSocialLinks(); 146 initSocialLinks();
88 } 147 }
89 148
90 function onScroll() 149 function onScroll()
91 { 150 {
92 var currentHeight = document.documentElement.scrollTop + document.body.scrol lTop + document.documentElement.clientHeight; 151 var currentHeight = document.documentElement.scrollTop + document.body.scrol lTop + document.documentElement.clientHeight;
93 shade.style.opacity = (document.documentElement.scrollHeight == currentHeigh t) ? "0.0" : "0.5"; 152 //shade.style.opacity = (document.documentElement.scrollHeight == currentHei ght) ? "0.0" : "0.5";
94 } 153 }
95 154
96 function onWindowResize() 155 function onWindowResize()
97 { 156 {
98 onScroll(); 157 onScroll();
99 } 158 }
100 159
101 function toggleTypoCorrectionEnabled() 160 function toggleTypoCorrectionEnabled()
102 { 161 {
103 Prefs.correctTypos = !Prefs.correctTypos; 162 Prefs.correctTypos = !Prefs.correctTypos;
(...skipping 101 matching lines...) Expand 10 before | Expand all | Expand 10 after
205 var networks = ["twitter", "facebook", "gplus"]; 264 var networks = ["twitter", "facebook", "gplus"];
206 networks.forEach(function(network) 265 networks.forEach(function(network)
207 { 266 {
208 var link = E("share-" + network); 267 var link = E("share-" + network);
209 link.addEventListener("click", onSocialLinkClick, false); 268 link.addEventListener("click", onSocialLinkClick, false);
210 }); 269 });
211 } 270 }
212 271
213 function onSocialLinkClick(event) 272 function onSocialLinkClick(event)
214 { 273 {
215 // Don't open the share page if the sharing script would be blocked
216 var filter = defaultMatcher.matchesAny(event.target.getAttribute("data-scrip t"), "SCRIPT", "adblockplus.org", true); 274 var filter = defaultMatcher.matchesAny(event.target.getAttribute("data-scrip t"), "SCRIPT", "adblockplus.org", true);
217 if (!(filter instanceof BlockingFilter)) 275 if (!(filter instanceof BlockingFilter))
218 { 276 {
219 event.preventDefault(); 277 event.preventDefault();
220 openSharePopup(Utils.getDocLink(event.target.id)); 278 openSharePopup(Utils.getDocLink(event.target.parentNode.id));
221 } 279 }
222 } 280 }
223 281
224 function setLinks(id) 282 function setLinks(id)
225 { 283 {
226 var element = E(id); 284 var element = E(id);
227 if (!element) 285 if (!element)
228 return; 286 return;
229 287
230 var links = element.getElementsByTagName("a"); 288 var links = element.getElementsByTagName("a");
(...skipping 26 matching lines...) Expand all
257 { 315 {
258 var button = E("toggle-" + feature); 316 var button = E("toggle-" + feature);
259 if (isEnabled) 317 if (isEnabled)
260 button.classList.remove("off"); 318 button.classList.remove("off");
261 else 319 else
262 button.classList.add("off"); 320 button.classList.add("off");
263 } 321 }
264 322
265 document.addEventListener("DOMContentLoaded", onDOMLoaded, false); 323 document.addEventListener("DOMContentLoaded", onDOMLoaded, false);
266 })(); 324 })();
OLDNEW

Powered by Google App Engine
This is Rietveld