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

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/inline_editor/CSSShadowModel.js

Issue 2626143004: DevTools: move from Common module - Geometry and CSSShadowModel (Closed)
Patch Set: minimize test diff Created 3 years, 11 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 * @unrestricted 5 * @unrestricted
6 */ 6 */
7 Common.CSSShadowModel = class { 7 InlineEditor.CSSShadowModel = class {
8 /** 8 /**
9 * @param {boolean} isBoxShadow 9 * @param {boolean} isBoxShadow
10 */ 10 */
11 constructor(isBoxShadow) { 11 constructor(isBoxShadow) {
12 this._isBoxShadow = isBoxShadow; 12 this._isBoxShadow = isBoxShadow;
13 this._inset = false; 13 this._inset = false;
14 this._offsetX = Common.CSSLength.zero(); 14 this._offsetX = InlineEditor.CSSLength.zero();
15 this._offsetY = Common.CSSLength.zero(); 15 this._offsetY = InlineEditor.CSSLength.zero();
16 this._blurRadius = Common.CSSLength.zero(); 16 this._blurRadius = InlineEditor.CSSLength.zero();
17 this._spreadRadius = Common.CSSLength.zero(); 17 this._spreadRadius = InlineEditor.CSSLength.zero();
18 this._color = /** @type {!Common.Color} */ (Common.Color.parse('black')); 18 this._color = /** @type {!Common.Color} */ (Common.Color.parse('black'));
19 this._format = [Common.CSSShadowModel._Part.OffsetX, Common.CSSShadowModel._ Part.OffsetY]; 19 this._format = [InlineEditor.CSSShadowModel._Part.OffsetX, InlineEditor.CSSS hadowModel._Part.OffsetY];
20 } 20 }
21 21
22 /** 22 /**
23 * @param {string} text 23 * @param {string} text
24 * @return {!Array<!Common.CSSShadowModel>} 24 * @return {!Array<!InlineEditor.CSSShadowModel>}
25 */ 25 */
26 static parseTextShadow(text) { 26 static parseTextShadow(text) {
27 return Common.CSSShadowModel._parseShadow(text, false); 27 return InlineEditor.CSSShadowModel._parseShadow(text, false);
28 } 28 }
29 29
30 /** 30 /**
31 * @param {string} text 31 * @param {string} text
32 * @return {!Array<!Common.CSSShadowModel>} 32 * @return {!Array<!InlineEditor.CSSShadowModel>}
33 */ 33 */
34 static parseBoxShadow(text) { 34 static parseBoxShadow(text) {
35 return Common.CSSShadowModel._parseShadow(text, true); 35 return InlineEditor.CSSShadowModel._parseShadow(text, true);
36 } 36 }
37 37
38 /** 38 /**
39 * @param {string} text 39 * @param {string} text
40 * @param {boolean} isBoxShadow 40 * @param {boolean} isBoxShadow
41 * @return {!Array<!Common.CSSShadowModel>} 41 * @return {!Array<!InlineEditor.CSSShadowModel>}
42 */ 42 */
43 static _parseShadow(text, isBoxShadow) { 43 static _parseShadow(text, isBoxShadow) {
44 var shadowTexts = []; 44 var shadowTexts = [];
45 // Split by commas that aren't inside of color values to get the individual shadow values. 45 // Split by commas that aren't inside of color values to get the individual shadow values.
46 var splits = Common.TextUtils.splitStringByRegexes(text, [Common.Color.Regex , /,/g]); 46 var splits = Common.TextUtils.splitStringByRegexes(text, [Common.Color.Regex , /,/g]);
47 var currentIndex = 0; 47 var currentIndex = 0;
48 for (var i = 0; i < splits.length; i++) { 48 for (var i = 0; i < splits.length; i++) {
49 if (splits[i].regexIndex === 1) { 49 if (splits[i].regexIndex === 1) {
50 var comma = splits[i]; 50 var comma = splits[i];
51 shadowTexts.push(text.substring(currentIndex, comma.position)); 51 shadowTexts.push(text.substring(currentIndex, comma.position));
52 currentIndex = comma.position + 1; 52 currentIndex = comma.position + 1;
53 } 53 }
54 } 54 }
55 shadowTexts.push(text.substring(currentIndex, text.length)); 55 shadowTexts.push(text.substring(currentIndex, text.length));
56 56
57 var shadows = []; 57 var shadows = [];
58 for (var i = 0; i < shadowTexts.length; i++) { 58 for (var i = 0; i < shadowTexts.length; i++) {
59 var shadow = new Common.CSSShadowModel(isBoxShadow); 59 var shadow = new InlineEditor.CSSShadowModel(isBoxShadow);
60 shadow._format = []; 60 shadow._format = [];
61 var nextPartAllowed = true; 61 var nextPartAllowed = true;
62 var regexes = [/inset/gi, Common.Color.Regex, Common.CSSLength.Regex]; 62 var regexes = [/inset/gi, Common.Color.Regex, InlineEditor.CSSLength.Regex ];
63 var results = Common.TextUtils.splitStringByRegexes(shadowTexts[i], regexe s); 63 var results = Common.TextUtils.splitStringByRegexes(shadowTexts[i], regexe s);
64 for (var j = 0; j < results.length; j++) { 64 for (var j = 0; j < results.length; j++) {
65 var result = results[j]; 65 var result = results[j];
66 if (result.regexIndex === -1) { 66 if (result.regexIndex === -1) {
67 // Don't allow anything other than inset, color, length values, and wh itespace. 67 // Don't allow anything other than inset, color, length values, and wh itespace.
68 if (/\S/.test(result.value)) 68 if (/\S/.test(result.value))
69 return []; 69 return [];
70 // All parts must be separated by whitespace. 70 // All parts must be separated by whitespace.
71 nextPartAllowed = true; 71 nextPartAllowed = true;
72 } else { 72 } else {
73 if (!nextPartAllowed) 73 if (!nextPartAllowed)
74 return []; 74 return [];
75 nextPartAllowed = false; 75 nextPartAllowed = false;
76 76
77 if (result.regexIndex === 0) { 77 if (result.regexIndex === 0) {
78 shadow._inset = true; 78 shadow._inset = true;
79 shadow._format.push(Common.CSSShadowModel._Part.Inset); 79 shadow._format.push(InlineEditor.CSSShadowModel._Part.Inset);
80 } else if (result.regexIndex === 1) { 80 } else if (result.regexIndex === 1) {
81 var color = Common.Color.parse(result.value); 81 var color = Common.Color.parse(result.value);
82 if (!color) 82 if (!color)
83 return []; 83 return [];
84 shadow._color = color; 84 shadow._color = color;
85 shadow._format.push(Common.CSSShadowModel._Part.Color); 85 shadow._format.push(InlineEditor.CSSShadowModel._Part.Color);
86 } else if (result.regexIndex === 2) { 86 } else if (result.regexIndex === 2) {
87 var length = Common.CSSLength.parse(result.value); 87 var length = InlineEditor.CSSLength.parse(result.value);
88 if (!length) 88 if (!length)
89 return []; 89 return [];
90 var previousPart = shadow._format.length > 0 ? shadow._format[shadow ._format.length - 1] : ''; 90 var previousPart = shadow._format.length > 0 ? shadow._format[shadow ._format.length - 1] : '';
91 if (previousPart === Common.CSSShadowModel._Part.OffsetX) { 91 if (previousPart === InlineEditor.CSSShadowModel._Part.OffsetX) {
92 shadow._offsetY = length; 92 shadow._offsetY = length;
93 shadow._format.push(Common.CSSShadowModel._Part.OffsetY); 93 shadow._format.push(InlineEditor.CSSShadowModel._Part.OffsetY);
94 } else if (previousPart === Common.CSSShadowModel._Part.OffsetY) { 94 } else if (previousPart === InlineEditor.CSSShadowModel._Part.Offset Y) {
95 shadow._blurRadius = length; 95 shadow._blurRadius = length;
96 shadow._format.push(Common.CSSShadowModel._Part.BlurRadius); 96 shadow._format.push(InlineEditor.CSSShadowModel._Part.BlurRadius);
97 } else if (previousPart === Common.CSSShadowModel._Part.BlurRadius) { 97 } else if (previousPart === InlineEditor.CSSShadowModel._Part.BlurRa dius) {
98 shadow._spreadRadius = length; 98 shadow._spreadRadius = length;
99 shadow._format.push(Common.CSSShadowModel._Part.SpreadRadius); 99 shadow._format.push(InlineEditor.CSSShadowModel._Part.SpreadRadius );
100 } else { 100 } else {
101 shadow._offsetX = length; 101 shadow._offsetX = length;
102 shadow._format.push(Common.CSSShadowModel._Part.OffsetX); 102 shadow._format.push(InlineEditor.CSSShadowModel._Part.OffsetX);
103 } 103 }
104 } 104 }
105 } 105 }
106 } 106 }
107 if (invalidCount(Common.CSSShadowModel._Part.OffsetX, 1, 1) || 107 if (invalidCount(InlineEditor.CSSShadowModel._Part.OffsetX, 1, 1) ||
108 invalidCount(Common.CSSShadowModel._Part.OffsetY, 1, 1) || 108 invalidCount(InlineEditor.CSSShadowModel._Part.OffsetY, 1, 1) ||
109 invalidCount(Common.CSSShadowModel._Part.Color, 0, 1) || 109 invalidCount(InlineEditor.CSSShadowModel._Part.Color, 0, 1) ||
110 invalidCount(Common.CSSShadowModel._Part.BlurRadius, 0, 1) || 110 invalidCount(InlineEditor.CSSShadowModel._Part.BlurRadius, 0, 1) ||
111 invalidCount(Common.CSSShadowModel._Part.Inset, 0, isBoxShadow ? 1 : 0 ) || 111 invalidCount(InlineEditor.CSSShadowModel._Part.Inset, 0, isBoxShadow ? 1 : 0) ||
112 invalidCount(Common.CSSShadowModel._Part.SpreadRadius, 0, isBoxShadow ? 1 : 0)) 112 invalidCount(InlineEditor.CSSShadowModel._Part.SpreadRadius, 0, isBoxS hadow ? 1 : 0))
113 return []; 113 return [];
114 shadows.push(shadow); 114 shadows.push(shadow);
115 } 115 }
116 return shadows; 116 return shadows;
117 117
118 /** 118 /**
119 * @param {string} part 119 * @param {string} part
120 * @param {number} min 120 * @param {number} min
121 * @param {number} max 121 * @param {number} max
122 * @return {boolean} 122 * @return {boolean}
123 */ 123 */
124 function invalidCount(part, min, max) { 124 function invalidCount(part, min, max) {
125 var count = 0; 125 var count = 0;
126 for (var i = 0; i < shadow._format.length; i++) { 126 for (var i = 0; i < shadow._format.length; i++) {
127 if (shadow._format[i] === part) 127 if (shadow._format[i] === part)
128 count++; 128 count++;
129 } 129 }
130 return count < min || count > max; 130 return count < min || count > max;
131 } 131 }
132 } 132 }
133 133
134 /** 134 /**
135 * @param {boolean} inset 135 * @param {boolean} inset
136 */ 136 */
137 setInset(inset) { 137 setInset(inset) {
138 this._inset = inset; 138 this._inset = inset;
139 if (this._format.indexOf(Common.CSSShadowModel._Part.Inset) === -1) 139 if (this._format.indexOf(InlineEditor.CSSShadowModel._Part.Inset) === -1)
140 this._format.unshift(Common.CSSShadowModel._Part.Inset); 140 this._format.unshift(InlineEditor.CSSShadowModel._Part.Inset);
141 } 141 }
142 142
143 /** 143 /**
144 * @param {!Common.CSSLength} offsetX 144 * @param {!InlineEditor.CSSLength} offsetX
145 */ 145 */
146 setOffsetX(offsetX) { 146 setOffsetX(offsetX) {
147 this._offsetX = offsetX; 147 this._offsetX = offsetX;
148 } 148 }
149 149
150 /** 150 /**
151 * @param {!Common.CSSLength} offsetY 151 * @param {!InlineEditor.CSSLength} offsetY
152 */ 152 */
153 setOffsetY(offsetY) { 153 setOffsetY(offsetY) {
154 this._offsetY = offsetY; 154 this._offsetY = offsetY;
155 } 155 }
156 156
157 /** 157 /**
158 * @param {!Common.CSSLength} blurRadius 158 * @param {!InlineEditor.CSSLength} blurRadius
159 */ 159 */
160 setBlurRadius(blurRadius) { 160 setBlurRadius(blurRadius) {
161 this._blurRadius = blurRadius; 161 this._blurRadius = blurRadius;
162 if (this._format.indexOf(Common.CSSShadowModel._Part.BlurRadius) === -1) { 162 if (this._format.indexOf(InlineEditor.CSSShadowModel._Part.BlurRadius) === - 1) {
163 var yIndex = this._format.indexOf(Common.CSSShadowModel._Part.OffsetY); 163 var yIndex = this._format.indexOf(InlineEditor.CSSShadowModel._Part.Offset Y);
164 this._format.splice(yIndex + 1, 0, Common.CSSShadowModel._Part.BlurRadius) ; 164 this._format.splice(yIndex + 1, 0, InlineEditor.CSSShadowModel._Part.BlurR adius);
165 } 165 }
166 } 166 }
167 167
168 /** 168 /**
169 * @param {!Common.CSSLength} spreadRadius 169 * @param {!InlineEditor.CSSLength} spreadRadius
170 */ 170 */
171 setSpreadRadius(spreadRadius) { 171 setSpreadRadius(spreadRadius) {
172 this._spreadRadius = spreadRadius; 172 this._spreadRadius = spreadRadius;
173 if (this._format.indexOf(Common.CSSShadowModel._Part.SpreadRadius) === -1) { 173 if (this._format.indexOf(InlineEditor.CSSShadowModel._Part.SpreadRadius) === -1) {
174 this.setBlurRadius(this._blurRadius); 174 this.setBlurRadius(this._blurRadius);
175 var blurIndex = this._format.indexOf(Common.CSSShadowModel._Part.BlurRadiu s); 175 var blurIndex = this._format.indexOf(InlineEditor.CSSShadowModel._Part.Blu rRadius);
176 this._format.splice(blurIndex + 1, 0, Common.CSSShadowModel._Part.SpreadRa dius); 176 this._format.splice(blurIndex + 1, 0, InlineEditor.CSSShadowModel._Part.Sp readRadius);
177 } 177 }
178 } 178 }
179 179
180 /** 180 /**
181 * @param {!Common.Color} color 181 * @param {!Common.Color} color
182 */ 182 */
183 setColor(color) { 183 setColor(color) {
184 this._color = color; 184 this._color = color;
185 if (this._format.indexOf(Common.CSSShadowModel._Part.Color) === -1) 185 if (this._format.indexOf(InlineEditor.CSSShadowModel._Part.Color) === -1)
186 this._format.push(Common.CSSShadowModel._Part.Color); 186 this._format.push(InlineEditor.CSSShadowModel._Part.Color);
187 } 187 }
188 188
189 /** 189 /**
190 * @return {boolean} 190 * @return {boolean}
191 */ 191 */
192 isBoxShadow() { 192 isBoxShadow() {
193 return this._isBoxShadow; 193 return this._isBoxShadow;
194 } 194 }
195 195
196 /** 196 /**
197 * @return {boolean} 197 * @return {boolean}
198 */ 198 */
199 inset() { 199 inset() {
200 return this._inset; 200 return this._inset;
201 } 201 }
202 202
203 /** 203 /**
204 * @return {!Common.CSSLength} 204 * @return {!InlineEditor.CSSLength}
205 */ 205 */
206 offsetX() { 206 offsetX() {
207 return this._offsetX; 207 return this._offsetX;
208 } 208 }
209 209
210 /** 210 /**
211 * @return {!Common.CSSLength} 211 * @return {!InlineEditor.CSSLength}
212 */ 212 */
213 offsetY() { 213 offsetY() {
214 return this._offsetY; 214 return this._offsetY;
215 } 215 }
216 216
217 /** 217 /**
218 * @return {!Common.CSSLength} 218 * @return {!InlineEditor.CSSLength}
219 */ 219 */
220 blurRadius() { 220 blurRadius() {
221 return this._blurRadius; 221 return this._blurRadius;
222 } 222 }
223 223
224 /** 224 /**
225 * @return {!Common.CSSLength} 225 * @return {!InlineEditor.CSSLength}
226 */ 226 */
227 spreadRadius() { 227 spreadRadius() {
228 return this._spreadRadius; 228 return this._spreadRadius;
229 } 229 }
230 230
231 /** 231 /**
232 * @return {!Common.Color} 232 * @return {!Common.Color}
233 */ 233 */
234 color() { 234 color() {
235 return this._color; 235 return this._color;
236 } 236 }
237 237
238 /** 238 /**
239 * @return {string} 239 * @return {string}
240 */ 240 */
241 asCSSText() { 241 asCSSText() {
242 var parts = []; 242 var parts = [];
243 for (var i = 0; i < this._format.length; i++) { 243 for (var i = 0; i < this._format.length; i++) {
244 var part = this._format[i]; 244 var part = this._format[i];
245 if (part === Common.CSSShadowModel._Part.Inset && this._inset) 245 if (part === InlineEditor.CSSShadowModel._Part.Inset && this._inset)
246 parts.push('inset'); 246 parts.push('inset');
247 else if (part === Common.CSSShadowModel._Part.OffsetX) 247 else if (part === InlineEditor.CSSShadowModel._Part.OffsetX)
248 parts.push(this._offsetX.asCSSText()); 248 parts.push(this._offsetX.asCSSText());
249 else if (part === Common.CSSShadowModel._Part.OffsetY) 249 else if (part === InlineEditor.CSSShadowModel._Part.OffsetY)
250 parts.push(this._offsetY.asCSSText()); 250 parts.push(this._offsetY.asCSSText());
251 else if (part === Common.CSSShadowModel._Part.BlurRadius) 251 else if (part === InlineEditor.CSSShadowModel._Part.BlurRadius)
252 parts.push(this._blurRadius.asCSSText()); 252 parts.push(this._blurRadius.asCSSText());
253 else if (part === Common.CSSShadowModel._Part.SpreadRadius) 253 else if (part === InlineEditor.CSSShadowModel._Part.SpreadRadius)
254 parts.push(this._spreadRadius.asCSSText()); 254 parts.push(this._spreadRadius.asCSSText());
255 else if (part === Common.CSSShadowModel._Part.Color) 255 else if (part === InlineEditor.CSSShadowModel._Part.Color)
256 parts.push(this._color.asString(this._color.format())); 256 parts.push(this._color.asString(this._color.format()));
257 } 257 }
258 return parts.join(' '); 258 return parts.join(' ');
259 } 259 }
260 }; 260 };
261 261
262 /** 262 /**
263 * @enum {string} 263 * @enum {string}
264 */ 264 */
265 Common.CSSShadowModel._Part = { 265 InlineEditor.CSSShadowModel._Part = {
266 Inset: 'I', 266 Inset: 'I',
267 OffsetX: 'X', 267 OffsetX: 'X',
268 OffsetY: 'Y', 268 OffsetY: 'Y',
269 BlurRadius: 'B', 269 BlurRadius: 'B',
270 SpreadRadius: 'S', 270 SpreadRadius: 'S',
271 Color: 'C' 271 Color: 'C'
272 }; 272 };
273 273
274 274
275 /** 275 /**
276 * @unrestricted 276 * @unrestricted
277 */ 277 */
278 Common.CSSLength = class { 278 InlineEditor.CSSLength = class {
279 /** 279 /**
280 * @param {number} amount 280 * @param {number} amount
281 * @param {string} unit 281 * @param {string} unit
282 */ 282 */
283 constructor(amount, unit) { 283 constructor(amount, unit) {
284 this.amount = amount; 284 this.amount = amount;
285 this.unit = unit; 285 this.unit = unit;
286 } 286 }
287 287
288 /** 288 /**
289 * @param {string} text 289 * @param {string} text
290 * @return {?Common.CSSLength} 290 * @return {?InlineEditor.CSSLength}
291 */ 291 */
292 static parse(text) { 292 static parse(text) {
293 var lengthRegex = new RegExp('^(?:' + Common.CSSLength.Regex.source + ')$', 'i'); 293 var lengthRegex = new RegExp('^(?:' + InlineEditor.CSSLength.Regex.source + ')$', 'i');
294 var match = text.match(lengthRegex); 294 var match = text.match(lengthRegex);
295 if (!match) 295 if (!match)
296 return null; 296 return null;
297 if (match.length > 2 && match[2]) 297 if (match.length > 2 && match[2])
298 return new Common.CSSLength(parseFloat(match[1]), match[2]); 298 return new InlineEditor.CSSLength(parseFloat(match[1]), match[2]);
299 return Common.CSSLength.zero(); 299 return InlineEditor.CSSLength.zero();
300 } 300 }
301 301
302 /** 302 /**
303 * @return {!Common.CSSLength} 303 * @return {!InlineEditor.CSSLength}
304 */ 304 */
305 static zero() { 305 static zero() {
306 return new Common.CSSLength(0, ''); 306 return new InlineEditor.CSSLength(0, '');
307 } 307 }
308 308
309 /** 309 /**
310 * @return {string} 310 * @return {string}
311 */ 311 */
312 asCSSText() { 312 asCSSText() {
313 return this.amount + this.unit; 313 return this.amount + this.unit;
314 } 314 }
315 }; 315 };
316 316
317 /** @type {!RegExp} */ 317 /** @type {!RegExp} */
318 Common.CSSLength.Regex = (function() { 318 InlineEditor.CSSLength.Regex = (function() {
319 var number = '([+-]?(?:[0-9]*[.])?[0-9]+(?:[eE][+-]?[0-9]+)?)'; 319 var number = '([+-]?(?:[0-9]*[.])?[0-9]+(?:[eE][+-]?[0-9]+)?)';
320 var unit = '(ch|cm|em|ex|in|mm|pc|pt|px|rem|vh|vmax|vmin|vw)'; 320 var unit = '(ch|cm|em|ex|in|mm|pc|pt|px|rem|vh|vmax|vmin|vw)';
321 var zero = '[+-]?(?:0*[.])?0+(?:[eE][+-]?[0-9]+)?'; 321 var zero = '[+-]?(?:0*[.])?0+(?:[eE][+-]?[0-9]+)?';
322 return new RegExp(number + unit + '|' + zero, 'gi'); 322 return new RegExp(number + unit + '|' + zero, 'gi');
323 })(); 323 })();
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698