Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1019)

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/ui/Icon.js

Issue 2768923006: DevTools: define icon location with row and column (Closed)
Patch Set: add coordinates to svg files Created 3 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 // Copyright 2016 The Chromium Authors. All rights reserved. 1 // Copyright 2016 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 /** 5 /**
6 * @constructor 6 * @constructor
7 * @extends {HTMLSpanElement} 7 * @extends {HTMLSpanElement}
8 */ 8 */
9 UI.Icon = class extends HTMLSpanElement { 9 UI.Icon = class extends HTMLSpanElement {
10 constructor() { 10 constructor() {
(...skipping 17 matching lines...) Expand all
28 icon.setIconType(iconType); 28 icon.setIconType(iconType);
29 return icon; 29 return icon;
30 } 30 }
31 31
32 /** 32 /**
33 * @override 33 * @override
34 */ 34 */
35 createdCallback() { 35 createdCallback() {
36 /** @type {?UI.Icon.Descriptor} */ 36 /** @type {?UI.Icon.Descriptor} */
37 this._descriptor = null; 37 this._descriptor = null;
38 /** @type {?UI.Icon.SpriteSheet} */
39 this._spriteSheet = null;
38 /** @type {string} */ 40 /** @type {string} */
39 this._iconType = ''; 41 this._iconType = '';
40 } 42 }
41 43
42 /** 44 /**
43 * @param {string} iconType 45 * @param {string} iconType
44 */ 46 */
45 setIconType(iconType) { 47 setIconType(iconType) {
46 if (this._descriptor) { 48 if (this._descriptor) {
47 this.style.removeProperty('--spritesheet-position'); 49 this.style.removeProperty('--spritesheet-position');
50 this.style.removeProperty('--spritesheet-size');
48 this.style.removeProperty('width'); 51 this.style.removeProperty('width');
49 this.style.removeProperty('height'); 52 this.style.removeProperty('height');
50 this._toggleClasses(false); 53 this._toggleClasses(false);
51 this._iconType = ''; 54 this._iconType = '';
52 this._descriptor = null; 55 this._descriptor = null;
56 this._spriteSheet = null;
53 } 57 }
54 var descriptor = UI.Icon.Descriptors[iconType] || null; 58 var descriptor = UI.Icon.Descriptors[iconType] || null;
55 if (descriptor) { 59 if (descriptor) {
56 this._iconType = iconType; 60 this._iconType = iconType;
57 this._descriptor = descriptor; 61 this._descriptor = descriptor;
62 this._spriteSheet = UI.Icon.SpriteSheets[this._descriptor.spritesheet];
63 console.assert(
64 this._spriteSheet, `ERROR: icon ${this._iconType} has unknown spritesh eet: ${this._descriptor.spritesheet}`);
65
58 this.style.setProperty('--spritesheet-position', this._propertyValue()); 66 this.style.setProperty('--spritesheet-position', this._propertyValue());
59 this.style.setProperty('width', this._descriptor.width + 'px'); 67 this.style.setProperty('width', this._spriteSheet.cellWidth + 'px');
60 this.style.setProperty('height', this._descriptor.height + 'px'); 68 this.style.setProperty('height', this._spriteSheet.cellHeight + 'px');
61 this._toggleClasses(true); 69 this._toggleClasses(true);
62 } else if (iconType) { 70 } else if (iconType) {
63 throw new Error(`ERROR: failed to find icon descriptor for type: ${iconTyp e}`); 71 throw new Error(`ERROR: failed to find icon descriptor for type: ${iconTyp e}`);
64 } 72 }
65 } 73 }
66 74
67 /** 75 /**
68 * @param {boolean} value 76 * @param {boolean} value
69 */ 77 */
70 _toggleClasses(value) { 78 _toggleClasses(value) {
71 this.classList.toggle('spritesheet-' + this._descriptor.spritesheet, value); 79 this.classList.toggle('spritesheet-' + this._descriptor.spritesheet, value);
72 this.classList.toggle(this._iconType, value); 80 this.classList.toggle(this._iconType, value);
73 this.classList.toggle('icon-mask', value && !!this._descriptor.isMask); 81 this.classList.toggle('icon-mask', value && !!this._descriptor.isMask);
74 } 82 }
75 83
76 /** 84 /**
77 * @return {string} 85 * @return {string}
78 */ 86 */
79 _propertyValue() { 87 _propertyValue() {
80 return `${this._descriptor.x}px ${this._descriptor.y}px`; 88 var x = -(this._spriteSheet.cellWidth + this._spriteSheet.padding) * this._d escriptor.column;
89 var y = -this._spriteSheet.padding +
90 (this._spriteSheet.cellHeight + this._spriteSheet.padding) * (this._desc riptor.row + 1);
91 return `${x}px ${y}px`;
81 } 92 }
82 }; 93 };
83 94
84 /** @typedef {{x: number, y: number, width: number, height: number, spritesheet: string, isMask: (boolean|undefined)}} */ 95 /** @typedef {{column: number, row: number, spritesheet: string, isMask: (boolea n|undefined)}} */
85 UI.Icon.Descriptor; 96 UI.Icon.Descriptor;
86 97
98 /** @typedef {{cellWidth: number, cellHeight: number, padding: number}} */
99 UI.Icon.SpriteSheet;
100
101 /** @enum {!UI.Icon.SpriteSheet} */
102 UI.Icon.SpriteSheets = {
103 'smallicons': {cellWidth: 10, cellHeight: 10, padding: 10},
104 'mediumicons': {cellWidth: 16, cellHeight: 16, padding: 0},
105 'largeicons': {cellWidth: 28, cellHeight: 24, padding: 0},
106 'arrowicons': {cellWidth: 19, cellHeight: 19, padding: 0}
107 };
108
87 /** @enum {!UI.Icon.Descriptor} */ 109 /** @enum {!UI.Icon.Descriptor} */
88 UI.Icon.Descriptors = { 110 UI.Icon.Descriptors = {
89 // small icons 111 // small icons
90 'smallicon-bezier': {x: 0, y: 0, width: 10, height: 10, spritesheet: 'smallico ns', isMask: true}, 112 'smallicon-bezier': {column: 0, row: 4, spritesheet: 'smallicons', isMask: tru e},
91 'smallicon-checkmark': {x: -20, y: 0, width: 10, height: 10, spritesheet: 'sma llicons'}, 113 'smallicon-checkmark': {column: 1, row: 4, spritesheet: 'smallicons'},
92 'smallicon-command-result': {x: 0, y: -20, width: 10, height: 10, spritesheet: 'smallicons'}, 114 'smallicon-command-result': {column: 0, row: 3, spritesheet: 'smallicons'},
93 'smallicon-cross': {x: -20, y: -20, width: 10, height: 10, spritesheet: 'small icons'}, 115 'smallicon-cross': {column: 1, row: 3, spritesheet: 'smallicons'},
94 'smallicon-device': {x: -40, y: 0, width: 10, height: 10, spritesheet: 'smalli cons'}, 116 'smallicon-device': {column: 2, row: 4, spritesheet: 'smallicons'},
95 'smallicon-error': {x: -40, y: -20, width: 10, height: 10, spritesheet: 'small icons'}, 117 'smallicon-error': {column: 2, row: 3, spritesheet: 'smallicons'},
96 'smallicon-green-arrow': {x: 0, y: -40, width: 10, height: 10, spritesheet: 's mallicons'}, 118 'smallicon-green-arrow': {column: 0, row: 2, spritesheet: 'smallicons'},
97 'smallicon-green-ball': {x: -20, y: -40, width: 10, height: 10, spritesheet: ' smallicons'}, 119 'smallicon-green-ball': {column: 1, row: 2, spritesheet: 'smallicons'},
98 'smallicon-info': {x: -40, y: -40, width: 10, height: 10, spritesheet: 'smalli cons'}, 120 'smallicon-info': {column: 2, row: 2, spritesheet: 'smallicons'},
99 'smallicon-inline-breakpoint-conditional': {x: -60, y: 0, width: 10, height: 1 0, spritesheet: 'smallicons'}, 121 'smallicon-inline-breakpoint-conditional': {column: 3, row: 4, spritesheet: 's mallicons'},
100 'smallicon-inline-breakpoint': {x: -60, y: -20, width: 10, height: 10, sprites heet: 'smallicons'}, 122 'smallicon-inline-breakpoint': {column: 3, row: 3, spritesheet: 'smallicons'},
101 'smallicon-orange-ball': {x: -60, y: -40, width: 10, height: 10, spritesheet: 'smallicons'}, 123 'smallicon-orange-ball': {column: 3, row: 2, spritesheet: 'smallicons'},
102 'smallicon-red-ball': {x: 0, y: -60, width: 10, height: 10, spritesheet: 'smal licons'}, 124 'smallicon-red-ball': {column: 0, row: 1, spritesheet: 'smallicons'},
103 'smallicon-shadow': {x: -20, y: -60, width: 10, height: 10, spritesheet: 'smal licons', isMask: true}, 125 'smallicon-shadow': {column: 1, row: 1, spritesheet: 'smallicons', isMask: tru e},
104 'smallicon-step-in': {x: -40, y: -60, width: 10, height: 10, spritesheet: 'sma llicons'}, 126 'smallicon-step-in': {column: 2, row: 1, spritesheet: 'smallicons'},
105 'smallicon-step-out': {x: -60, y: -60, width: 10, height: 10, spritesheet: 'sm allicons'}, 127 'smallicon-step-out': {column: 3, row: 1, spritesheet: 'smallicons'},
106 'smallicon-text-prompt': {x: -80, y: 0, width: 10, height: 10, spritesheet: 's mallicons'}, 128 'smallicon-text-prompt': {column: 4, row: 4, spritesheet: 'smallicons'},
107 'smallicon-thick-left-arrow': {x: -80, y: -20, width: 10, height: 10, spritesh eet: 'smallicons'}, 129 'smallicon-thick-left-arrow': {column: 4, row: 3, spritesheet: 'smallicons'},
108 'smallicon-thick-right-arrow': {x: -80, y: -40, width: 10, height: 10, sprites heet: 'smallicons'}, 130 'smallicon-thick-right-arrow': {column: 4, row: 2, spritesheet: 'smallicons'},
109 'smallicon-triangle-down': {x: -80, y: -60, width: 10, height: 10, spritesheet : 'smallicons', isMask: true}, 131 'smallicon-triangle-down': {column: 4, row: 1, spritesheet: 'smallicons', isMa sk: true},
110 'smallicon-triangle-right': {x: 0, y: -80, width: 10, height: 10, spritesheet: 'smallicons', isMask: true}, 132 'smallicon-triangle-right': {column: 0, row: 0, spritesheet: 'smallicons', isM ask: true},
111 'smallicon-triangle-up': {x: -20, y: -80, width: 10, height: 10, spritesheet: 'smallicons', isMask: true}, 133 'smallicon-triangle-up': {column: 1, row: 0, spritesheet: 'smallicons', isMask : true},
112 'smallicon-user-command': {x: -40, y: -80, width: 10, height: 10, spritesheet: 'smallicons'}, 134 'smallicon-user-command': {column: 2, row: 0, spritesheet: 'smallicons'},
113 'smallicon-warning': {x: -60, y: -80, width: 10, height: 10, spritesheet: 'sma llicons'}, 135 'smallicon-warning': {column: 3, row: 0, spritesheet: 'smallicons'},
114 136
115 // medium icons 137 // medium icons
116 'mediumicon-clear-storage': {x: 0, y: 0, width: 16, height: 16, spritesheet: ' mediumicons', isMask: true}, 138 'mediumicon-clear-storage': {column: 0, row: 3, spritesheet: 'mediumicons', is Mask: true},
117 'mediumicon-cookie': {x: -16, y: 0, width: 16, height: 16, spritesheet: 'mediu micons', isMask: true}, 139 'mediumicon-cookie': {column: 1, row: 3, spritesheet: 'mediumicons', isMask: t rue},
118 'mediumicon-database': {x: -32, y: 0, width: 16, height: 16, spritesheet: 'med iumicons', isMask: true}, 140 'mediumicon-database': {column: 2, row: 3, spritesheet: 'mediumicons', isMask: true},
119 'mediumicon-manifest': {x: -48, y: 0, width: 16, height: 16, spritesheet: 'med iumicons', isMask: true}, 141 'mediumicon-manifest': {column: 3, row: 3, spritesheet: 'mediumicons', isMask: true},
120 'mediumicon-service-worker': {x: 0, y: -16, width: 16, height: 16, spritesheet : 'mediumicons', isMask: true}, 142 'mediumicon-service-worker': {column: 0, row: 2, spritesheet: 'mediumicons', i sMask: true},
121 'mediumicon-table': {x: -16, y: -16, width: 16, height: 16, spritesheet: 'medi umicons', isMask: true}, 143 'mediumicon-table': {column: 1, row: 2, spritesheet: 'mediumicons', isMask: tr ue},
122 'mediumicon-arrow-in-circle': {x: -32, y: -16, width: 16, height: 16, spritesh eet: 'mediumicons', isMask: true}, 144 'mediumicon-arrow-in-circle': {column: 2, row: 2, spritesheet: 'mediumicons', isMask: true},
123 'mediumicon-file-sync': {x: -48, y: -16, width: 16, height: 16, spritesheet: ' mediumicons'}, 145 'mediumicon-file-sync': {column: 3, row: 2, spritesheet: 'mediumicons'},
124 'mediumicon-file': {x: 0, y: -32, width: 16, height: 16, spritesheet: 'mediumi cons'}, 146 'mediumicon-file': {column: 0, row: 1, spritesheet: 'mediumicons'},
125 'mediumicon-gray-cross-active': {x: -16, y: -32, width: 16, height: 16, sprite sheet: 'mediumicons'}, 147 'mediumicon-gray-cross-active': {column: 1, row: 1, spritesheet: 'mediumicons' },
126 'mediumicon-gray-cross-hover': {x: -32, y: -32, width: 16, height: 16, sprites heet: 'mediumicons'}, 148 'mediumicon-gray-cross-hover': {column: 2, row: 1, spritesheet: 'mediumicons'} ,
127 'mediumicon-red-cross-active': {x: -48, y: -32, width: 16, height: 16, sprites heet: 'mediumicons'}, 149 'mediumicon-red-cross-active': {column: 3, row: 1, spritesheet: 'mediumicons'} ,
128 'mediumicon-red-cross-hover': {x: 0, y: -48, width: 16, height: 16, spriteshee t: 'mediumicons'}, 150 'mediumicon-red-cross-hover': {column: 0, row: 0, spritesheet: 'mediumicons'},
129 'mediumicon-search': {x: -16, y: -48, width: 16, height: 16, spritesheet: 'med iumicons'}, 151 'mediumicon-search': {column: 1, row: 0, spritesheet: 'mediumicons'},
130 152
131 // large icons 153 // large icons
132 'badge-navigator-file-sync': {x: 0, y: 0, width: 28, height: 24, spritesheet: 'largeicons'}, 154 'badge-navigator-file-sync': {column: 0, row: 8, spritesheet: 'largeicons'},
133 'largeicon-activate-breakpoints': {x: -28, y: 0, width: 28, height: 24, sprite sheet: 'largeicons', isMask: true}, 155 'largeicon-activate-breakpoints': {column: 1, row: 8, spritesheet: 'largeicons ', isMask: true},
134 'largeicon-add': {x: 0, y: -24, width: 28, height: 24, spritesheet: 'largeicon s', isMask: true}, 156 'largeicon-add': {column: 0, row: 7, spritesheet: 'largeicons', isMask: true},
135 'largeicon-background-color': {x: -28, y: -24, width: 28, height: 24, spritesh eet: 'largeicons', isMask: true}, 157 'largeicon-background-color': {column: 1, row: 7, spritesheet: 'largeicons', i sMask: true},
136 'largeicon-box-shadow': {x: 0, y: -48, width: 28, height: 24, spritesheet: 'la rgeicons', isMask: true}, 158 'largeicon-box-shadow': {column: 0, row: 6, spritesheet: 'largeicons', isMask: true},
137 'largeicon-camera': {x: -28, y: -48, width: 28, height: 24, spritesheet: 'larg eicons', isMask: true}, 159 'largeicon-camera': {column: 1, row: 6, spritesheet: 'largeicons', isMask: tru e},
138 'largeicon-center': {x: -56, y: 0, width: 28, height: 24, spritesheet: 'largei cons', isMask: true}, 160 'largeicon-center': {column: 2, row: 8, spritesheet: 'largeicons', isMask: tru e},
139 'largeicon-checkmark': {x: -56, y: -24, width: 28, height: 24, spritesheet: 'l argeicons', isMask: true}, 161 'largeicon-checkmark': {column: 2, row: 7, spritesheet: 'largeicons', isMask: true},
140 'largeicon-chevron': {x: -56, y: -48, width: 28, height: 24, spritesheet: 'lar geicons', isMask: true}, 162 'largeicon-chevron': {column: 2, row: 6, spritesheet: 'largeicons', isMask: tr ue},
141 'largeicon-clear': {x: 0, y: -72, width: 28, height: 24, spritesheet: 'largeic ons', isMask: true}, 163 'largeicon-clear': {column: 0, row: 5, spritesheet: 'largeicons', isMask: true },
142 'largeicon-copy': {x: -28, y: -72, width: 28, height: 24, spritesheet: 'largei cons', isMask: true}, 164 'largeicon-copy': {column: 1, row: 5, spritesheet: 'largeicons', isMask: true} ,
143 'largeicon-deactivate-breakpoints': {x: -56, y: -72, width: 28, height: 24, sp ritesheet: 'largeicons', isMask: true}, 165 'largeicon-deactivate-breakpoints': {column: 2, row: 5, spritesheet: 'largeico ns', isMask: true},
144 'largeicon-delete': {x: -84, y: 0, width: 28, height: 24, spritesheet: 'largei cons', isMask: true}, 166 'largeicon-delete': {column: 3, row: 8, spritesheet: 'largeicons', isMask: tru e},
145 'largeicon-dock-to-bottom': {x: -84, y: -24, width: 28, height: 24, spriteshee t: 'largeicons', isMask: true}, 167 'largeicon-dock-to-bottom': {column: 3, row: 7, spritesheet: 'largeicons', isM ask: true},
146 'largeicon-dock-to-left': {x: -84, y: -48, width: 28, height: 24, spritesheet: 'largeicons', isMask: true}, 168 'largeicon-dock-to-left': {column: 3, row: 6, spritesheet: 'largeicons', isMas k: true},
147 'largeicon-dock-to-right': {x: -84, y: -72, width: 28, height: 24, spritesheet : 'largeicons', isMask: true}, 169 'largeicon-dock-to-right': {column: 3, row: 5, spritesheet: 'largeicons', isMa sk: true},
148 'largeicon-edit': {x: 0, y: -96, width: 28, height: 24, spritesheet: 'largeico ns', isMask: true}, 170 'largeicon-edit': {column: 0, row: 4, spritesheet: 'largeicons', isMask: true} ,
149 'largeicon-eyedropper': {x: -28, y: -96, width: 28, height: 24, spritesheet: ' largeicons', isMask: true}, 171 'largeicon-eyedropper': {column: 1, row: 4, spritesheet: 'largeicons', isMask: true},
150 'largeicon-filter': {x: -56, y: -96, width: 28, height: 24, spritesheet: 'larg eicons', isMask: true}, 172 'largeicon-filter': {column: 2, row: 4, spritesheet: 'largeicons', isMask: tru e},
151 'largeicon-foreground-color': {x: -84, y: -96, width: 28, height: 24, spritesh eet: 'largeicons', isMask: true}, 173 'largeicon-foreground-color': {column: 3, row: 4, spritesheet: 'largeicons', i sMask: true},
152 'largeicon-hide-bottom-sidebar': {x: -112, y: 0, width: 28, height: 24, sprite sheet: 'largeicons', isMask: true}, 174 'largeicon-hide-bottom-sidebar': {column: 4, row: 8, spritesheet: 'largeicons' , isMask: true},
153 'largeicon-hide-left-sidebar': {x: -112, y: -24, width: 28, height: 24, sprite sheet: 'largeicons', isMask: true}, 175 'largeicon-hide-left-sidebar': {column: 4, row: 7, spritesheet: 'largeicons', isMask: true},
154 'largeicon-hide-right-sidebar': {x: -112, y: -48, width: 28, height: 24, sprit esheet: 'largeicons', isMask: true}, 176 'largeicon-hide-right-sidebar': {column: 4, row: 6, spritesheet: 'largeicons', isMask: true},
155 'largeicon-hide-top-sidebar': {x: -112, y: -72, width: 28, height: 24, sprites heet: 'largeicons', isMask: true}, 177 'largeicon-hide-top-sidebar': {column: 4, row: 5, spritesheet: 'largeicons', i sMask: true},
156 'largeicon-large-list': {x: -112, y: -96, width: 28, height: 24, spritesheet: 'largeicons', isMask: true}, 178 'largeicon-large-list': {column: 4, row: 4, spritesheet: 'largeicons', isMask: true},
157 'largeicon-layout-editor': {x: 0, y: -120, width: 28, height: 24, spritesheet: 'largeicons', isMask: true}, 179 'largeicon-layout-editor': {column: 0, row: 3, spritesheet: 'largeicons', isMa sk: true},
158 'largeicon-longclick-triangle': {x: -28, y: -120, width: 28, height: 24, sprit esheet: 'largeicons', isMask: true}, 180 'largeicon-longclick-triangle': {column: 1, row: 3, spritesheet: 'largeicons', isMask: true},
159 'largeicon-menu': {x: -56, y: -120, width: 28, height: 24, spritesheet: 'large icons', isMask: true}, 181 'largeicon-menu': {column: 2, row: 3, spritesheet: 'largeicons', isMask: true} ,
160 'largeicon-navigator-domain': {x: -84, y: -120, width: 28, height: 24, sprites heet: 'largeicons', isMask: true}, 182 'largeicon-navigator-domain': {column: 3, row: 3, spritesheet: 'largeicons', i sMask: true},
161 'largeicon-navigator-file': {x: -112, y: -120, width: 28, height: 24, spritesh eet: 'largeicons', isMask: true}, 183 'largeicon-navigator-file': {column: 4, row: 3, spritesheet: 'largeicons', isM ask: true},
162 'largeicon-navigator-file-sync': {x: -140, y: 0, width: 28, height: 24, sprite sheet: 'largeicons', isMask: true}, 184 'largeicon-navigator-file-sync': {column: 5, row: 8, spritesheet: 'largeicons' , isMask: true},
163 'largeicon-navigator-folder': {x: -140, y: -24, width: 28, height: 24, sprites heet: 'largeicons', isMask: true}, 185 'largeicon-navigator-folder': {column: 5, row: 7, spritesheet: 'largeicons', i sMask: true},
164 'largeicon-navigator-frame': {x: -140, y: -48, width: 28, height: 24, spritesh eet: 'largeicons', isMask: true}, 186 'largeicon-navigator-frame': {column: 5, row: 6, spritesheet: 'largeicons', is Mask: true},
165 'largeicon-navigator-snippet': {x: -140, y: -72, width: 28, height: 24, sprite sheet: 'largeicons', isMask: true}, 187 'largeicon-navigator-snippet': {column: 5, row: 5, spritesheet: 'largeicons', isMask: true},
166 'largeicon-navigator-worker': {x: -140, y: -96, width: 28, height: 24, sprites heet: 'largeicons', isMask: true}, 188 'largeicon-navigator-worker': {column: 5, row: 4, spritesheet: 'largeicons', i sMask: true},
167 'largeicon-node-search': {x: -140, y: -120, width: 28, height: 24, spritesheet : 'largeicons', isMask: true}, 189 'largeicon-node-search': {column: 5, row: 3, spritesheet: 'largeicons', isMask : true},
168 'largeicon-pan': {x: 0, y: -144, width: 28, height: 24, spritesheet: 'largeico ns', isMask: true}, 190 'largeicon-pan': {column: 0, row: 2, spritesheet: 'largeicons', isMask: true},
169 'largeicon-pause-animation': {x: -28, y: -144, width: 28, height: 24, spritesh eet: 'largeicons', isMask: true}, 191 'largeicon-pause-animation': {column: 1, row: 2, spritesheet: 'largeicons', is Mask: true},
170 'largeicon-pause': {x: -56, y: -144, width: 28, height: 24, spritesheet: 'larg eicons', isMask: true}, 192 'largeicon-pause': {column: 2, row: 2, spritesheet: 'largeicons', isMask: true },
171 'largeicon-pause-on-exceptions': {x: -84, y: -144, width: 28, height: 24, spri tesheet: 'largeicons', isMask: true}, 193 'largeicon-pause-on-exceptions': {column: 3, row: 2, spritesheet: 'largeicons' , isMask: true},
172 'largeicon-phone': {x: -112, y: -144, width: 28, height: 24, spritesheet: 'lar geicons', isMask: true}, 194 'largeicon-phone': {column: 4, row: 2, spritesheet: 'largeicons', isMask: true },
173 'largeicon-play-animation': {x: -140, y: -144, width: 28, height: 24, spritesh eet: 'largeicons', isMask: true}, 195 'largeicon-play-animation': {column: 5, row: 2, spritesheet: 'largeicons', isM ask: true},
174 'largeicon-play-back': {x: 0, y: -168, width: 28, height: 24, spritesheet: 'la rgeicons', isMask: true}, 196 'largeicon-play-back': {column: 0, row: 1, spritesheet: 'largeicons', isMask: true},
175 'largeicon-play': {x: -28, y: -168, width: 28, height: 24, spritesheet: 'large icons', isMask: true}, 197 'largeicon-play': {column: 1, row: 1, spritesheet: 'largeicons', isMask: true} ,
176 'largeicon-pretty-print': {x: -56, y: -168, width: 28, height: 24, spritesheet : 'largeicons', isMask: true}, 198 'largeicon-pretty-print': {column: 2, row: 1, spritesheet: 'largeicons', isMas k: true},
177 'largeicon-refresh': {x: -84, y: -168, width: 28, height: 24, spritesheet: 'la rgeicons', isMask: true}, 199 'largeicon-refresh': {column: 3, row: 1, spritesheet: 'largeicons', isMask: tr ue},
178 'largeicon-replay-animation': {x: -112, y: -168, width: 28, height: 24, sprite sheet: 'largeicons', isMask: true}, 200 'largeicon-replay-animation': {column: 4, row: 1, spritesheet: 'largeicons', i sMask: true},
179 'largeicon-resume': {x: -140, y: -168, width: 28, height: 24, spritesheet: 'la rgeicons', isMask: true}, 201 'largeicon-resume': {column: 5, row: 1, spritesheet: 'largeicons', isMask: tru e},
180 'largeicon-rotate': {x: -168, y: 0, width: 28, height: 24, spritesheet: 'large icons', isMask: true}, 202 'largeicon-rotate': {column: 6, row: 8, spritesheet: 'largeicons', isMask: tru e},
181 'largeicon-rotate-screen': {x: -168, y: -24, width: 28, height: 24, spriteshee t: 'largeicons', isMask: true}, 203 'largeicon-rotate-screen': {column: 6, row: 7, spritesheet: 'largeicons', isMa sk: true},
182 'largeicon-settings-gear': {x: -168, y: -48, width: 28, height: 24, spriteshee t: 'largeicons', isMask: true}, 204 'largeicon-settings-gear': {column: 6, row: 6, spritesheet: 'largeicons', isMa sk: true},
183 'largeicon-show-bottom-sidebar': {x: -168, y: -72, width: 28, height: 24, spri tesheet: 'largeicons', isMask: true}, 205 'largeicon-show-bottom-sidebar': {column: 6, row: 5, spritesheet: 'largeicons' , isMask: true},
184 'largeicon-show-left-sidebar': {x: -168, y: -96, width: 28, height: 24, sprite sheet: 'largeicons', isMask: true}, 206 'largeicon-show-left-sidebar': {column: 6, row: 4, spritesheet: 'largeicons', isMask: true},
185 'largeicon-show-right-sidebar': {x: -168, y: -120, width: 28, height: 24, spri tesheet: 'largeicons', isMask: true}, 207 'largeicon-show-right-sidebar': {column: 6, row: 3, spritesheet: 'largeicons', isMask: true},
186 'largeicon-show-top-sidebar': {x: -168, y: -144, width: 28, height: 24, sprite sheet: 'largeicons', isMask: true}, 208 'largeicon-show-top-sidebar': {column: 6, row: 2, spritesheet: 'largeicons', i sMask: true},
187 'largeicon-start-recording': {x: -168, y: -168, width: 28, height: 24, sprites heet: 'largeicons', isMask: true}, 209 'largeicon-start-recording': {column: 6, row: 1, spritesheet: 'largeicons', is Mask: true},
188 'largeicon-step-in': {x: 0, y: -192, width: 28, height: 24, spritesheet: 'larg eicons', isMask: true}, 210 'largeicon-step-in': {column: 0, row: 0, spritesheet: 'largeicons', isMask: tr ue},
189 'largeicon-step-out': {x: -28, y: -192, width: 28, height: 24, spritesheet: 'l argeicons', isMask: true}, 211 'largeicon-step-out': {column: 1, row: 0, spritesheet: 'largeicons', isMask: t rue},
190 'largeicon-step-over': {x: -56, y: -192, width: 28, height: 24, spritesheet: ' largeicons', isMask: true}, 212 'largeicon-step-over': {column: 2, row: 0, spritesheet: 'largeicons', isMask: true},
191 'largeicon-stop-recording': {x: -84, y: -192, width: 28, height: 24, spriteshe et: 'largeicons', isMask: true}, 213 'largeicon-stop-recording': {column: 3, row: 0, spritesheet: 'largeicons', isM ask: true},
192 'largeicon-text-shadow': {x: -112, y: -192, width: 28, height: 24, spritesheet : 'largeicons', isMask: true}, 214 'largeicon-text-shadow': {column: 4, row: 0, spritesheet: 'largeicons', isMask : true},
193 'largeicon-trash-bin': {x: -140, y: -192, width: 28, height: 24, spritesheet: 'largeicons', isMask: true}, 215 'largeicon-trash-bin': {column: 5, row: 0, spritesheet: 'largeicons', isMask: true},
194 'largeicon-undock': {x: -168, y: -192, width: 28, height: 24, spritesheet: 'la rgeicons', isMask: true}, 216 'largeicon-undock': {column: 6, row: 0, spritesheet: 'largeicons', isMask: tru e},
195 'largeicon-visibility': {x: -196, y: 0, width: 28, height: 24, spritesheet: 'l argeicons', isMask: true}, 217 'largeicon-visibility': {column: 7, row: 8, spritesheet: 'largeicons', isMask: true},
196 'largeicon-waterfall': {x: -196, y: -24, width: 28, height: 24, spritesheet: ' largeicons', isMask: true}, 218 'largeicon-waterfall': {column: 7, row: 7, spritesheet: 'largeicons', isMask: true},
197 219
198 'mediumicon-arrow-top': {x: 0, y: 0, width: 19, height: 19, spritesheet: 'arro wicons'}, 220 'mediumicon-arrow-top': {column: 0, row: 3, spritesheet: 'arrowicons'},
199 'mediumicon-arrow-bottom': {x: 0, y: -19, width: 19, height: 19, spritesheet: 'arrowicons'}, 221 'mediumicon-arrow-bottom': {column: 0, row: 2, spritesheet: 'arrowicons'},
200 'mediumicon-arrow-left': {x: 0, y: -38, width: 19, height: 19, spritesheet: 'a rrowicons'}, 222 'mediumicon-arrow-left': {column: 0, row: 1, spritesheet: 'arrowicons'},
201 'mediumicon-arrow-right': {x: 0, y: -57, width: 19, height: 19, spritesheet: ' arrowicons'}, 223 'mediumicon-arrow-right': {column: 0, row: 0, spritesheet: 'arrowicons'}
202 }; 224 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698