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

Delta Between Two Patch Sets: lib/icon.js

Issue 5196306347720704: Issue 1965 - Simplified and fixed missing image for icon animation (Closed)
Left Patch Set: Created Feb. 27, 2014, 4:54 p.m.
Right Patch Set: Rebased and addressed comment Created Feb. 12, 2015, 11:15 a.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
Right: Side by side diff | Download
« no previous file with change/comment | « background.js ('k') | metadata.common » ('j') | no next file with change/comment »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
LEFTRIGHT
(no file at all)
1 /* 1 /*
2 * This file is part of Adblock Plus <https://adblockplus.org/>, 2 * This file is part of Adblock Plus <https://adblockplus.org/>,
3 * Copyright (C) 2006-2015 Eyeo GmbH 3 * Copyright (C) 2006-2015 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 iconAnimation = { 18 const numberOfFrames = 10;
19 _icons: new ext.PageMap(),
20 _animatedPages: new ext.PageMap(),
21 _step: 0,
22 19
23 update: function(type) 20 let whitelistedState = new ext.PageMap();
21 let notificationType = null;
22 let animationInterval = null;
23 let animationStep = 0;
24
25 function getIconPath(whitelisted)
26 {
27 let filename = "icons/abp-$size";
28
29 // If the current page is whitelisted, pick an icon that indicates that
30 // Adblock Plus is disabled, however not when the notification icon has
31 // full opacity, or on Safari where icons are genrally grayscale-only.
32 if (whitelisted && animationStep < numberOfFrames && require("info").platform != "safari")
33 filename += "-whitelisted";
34
35 // If the icon is currently animating to indicate a pending notification,
36 // pick the icon for the corresponing notification type and animation frame.
37 if (notificationType && animationStep > 0)
24 { 38 {
25 if (type == this._type) 39 filename += "-notification-" + notificationType;
26 return;
27 40
28 if (!this._type) 41 if (animationStep < numberOfFrames)
29 this._start(); 42 filename += "-" + animationStep;
43 }
30 44
31 this._type = type; 45 return filename + ".png";
32 }, 46 }
33 stop: function() 47
48 function setIcon(page)
49 {
50 page.browserAction.setIcon(getIconPath(whitelistedState.get(page)));
51 }
52
53 function runAnimation()
54 {
55 return setInterval(function()
34 { 56 {
35 clearInterval(this._interval); 57 ext.pages.query({active: true}, function(pages)
58 {
59 let fadeInInterval = setInterval(function()
60 {
61 animationStep++;
62 pages.forEach(setIcon);
36 63
37 delete this._interval; 64 if (animationStep < numberOfFrames)
38 delete this._type;
39
40 this._animatedPages.clear();
41 },
42 registerPage: function(page, icon)
43 {
44 this._icons.set(page, icon);
45
46 if (this._animatedPages.has(page))
47 this._updateIcon(page);
48 },
49 _start: function()
50 {
51 this._interval = setInterval(function()
52 {
53 ext.pages.query({active: true}, function(pages)
54 {
55 if (pages.length == 0)
56 return; 65 return;
57 66
58 for (var i = 0; i < pages.length; i++) 67 setTimeout(function()
59 this._animatedPages.set(pages[i], null); 68 {
69 let fadeOutInterval = setInterval(function()
70 {
71 animationStep--;
72 pages.forEach(setIcon);
60 73
61 var interval = setInterval(function() 74 if (animationStep > 0)
62 { 75 return;
63 this._step++;
64 pages.forEach(this._updateIcon.bind(this));
65 76
66 if (this._step < 10) 77 clearInterval(fadeOutInterval);
67 return; 78 }, 100);
79 },1000);
68 80
69 clearInterval(interval); 81 clearInterval(fadeInInterval);
70 setTimeout(function() 82 }, 100);
71 { 83 });
72 interval = setInterval(function() 84 }, 15000);
73 { 85 }
74 this._step--;
75 pages.forEach(this._updateIcon.bind(this));
76 86
77 if (this._step > 0) 87 /**
78 return; 88 * Set the browser action icon for the given page, indicating whether
89 * adblocking is active there, and considering the icon animation.
90 *
91 * @param {Page} [page] The page to set the browser action icon for
92 * @param {Boolean} [whitelisted] Whether the page has been whitelisted
93 */
94 function updateIcon(page, whitelisted)
95 {
96 page.browserAction.setIcon(getIconPath(whitelisted));
97 whitelistedState.set(page, whitelisted);
98 }
99 exports.updateIcon = updateIcon;
79 100
80 clearInterval(interval); 101 /**
81 this._animatedPages.clear(); 102 * Starts to animate the browser action icon to indicate a pending notifcation.
82 }.bind(this), 100); 103 *
83 }.bind(this), 1000); 104 * @param {string} [type] The notifaction type (i.e: "information" or "critical" )
84 }.bind(this), 100); 105 */
85 }.bind(this)); 106 function startIconAnimation(type)
86 }.bind(this), 15000); 107 {
87 }, 108 notificationType = type;
88 _updateIcon: function(page) 109
110 if (animationInterval == null)
111 animationInterval = runAnimation();
112 }
113 exports.startIconAnimation = startIconAnimation;
114
115 /**
116 * Stops to animate the browser action icon.
117 */
118 function stopIconAnimation()
119 {
120 if (animationInterval != null)
89 { 121 {
90 var path = this._icons.get(page); 122 clearInterval(animationInterval);
123 animationInterval = null;
124 }
91 125
92 if (!path) 126 notificationType = null;
93 return; 127 }
94 128 exports.stopIconAnimation = stopIconAnimation;
95 if (this._step > 0)
96 {
97 var suffix = "-notification-" + this._type;
98
99 if (this._step < 10)
100 suffix += "-" + this._step;
101
102 path = path.replace(/(?=\..+$)/, suffix);
103 }
104
105 page.browserAction.setIcon(path);
106 }
107 };
LEFTRIGHT

Powered by Google App Engine
This is Rietveld