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

Side by Side Diff: chrome/browser/resources/print_preview/previewarea/margin_control_container.js

Issue 2939273002: DO NOT SUBMIT: what chrome/browser/resources/ could eventually look like with clang-format (Closed)
Patch Set: Created 3 years, 6 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 (c) 2012 The Chromium Authors. All rights reserved. 1 // Copyright (c) 2012 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 cr.define('print_preview', function() { 5 cr.define('print_preview', function() {
6 'use strict'; 6 'use strict';
7 7
8 /** 8 /**
9 * UI component used for setting custom print margins. 9 * UI component used for setting custom print margins.
10 * @param {!print_preview.DocumentInfo} documentInfo Document data model. 10 * @param {!print_preview.DocumentInfo} documentInfo Document data model.
11 * @param {!print_preview.ticket_items.MarginsType} marginsTypeTicketItem 11 * @param {!print_preview.ticket_items.MarginsType} marginsTypeTicketItem
12 * Used to read margins type. 12 * Used to read margins type.
13 * @param {!print_preview.ticket_items.CustomMargins} customMarginsTicketItem 13 * @param {!print_preview.ticket_items.CustomMargins} customMarginsTicketItem
14 * Used to read and write custom margin values. 14 * Used to read and write custom margin values.
15 * @param {!print_preview.MeasurementSystem} measurementSystem Used to convert 15 * @param {!print_preview.MeasurementSystem} measurementSystem Used to convert
16 * between the system's local units and points. 16 * between the system's local units and points.
17 * @param {function(boolean)} dragChangedCallback A function which is called 17 * @param {function(boolean)} dragChangedCallback A function which is called
18 * when dragging margins starts or stops. True is passed to the function 18 * when dragging margins starts or stops. True is passed to the function
19 * if the margin is currently being dragged and false otherwise. 19 * if the margin is currently being dragged and false otherwise.
20 * @constructor 20 * @constructor
21 * @extends {print_preview.Component} 21 * @extends {print_preview.Component}
22 */ 22 */
23 function MarginControlContainer(documentInfo, marginsTypeTicketItem, 23 function MarginControlContainer(
24 customMarginsTicketItem, measurementSystem, 24 documentInfo, marginsTypeTicketItem, customMarginsTicketItem,
25 dragChangedCallback) { 25 measurementSystem, dragChangedCallback) {
26 print_preview.Component.call(this); 26 print_preview.Component.call(this);
27 27
28 /** 28 /**
29 * Document data model. 29 * Document data model.
30 * @type {!print_preview.DocumentInfo} 30 * @type {!print_preview.DocumentInfo}
31 * @private 31 * @private
32 */ 32 */
33 this.documentInfo_ = documentInfo; 33 this.documentInfo_ = documentInfo;
34 34
35 /** 35 /**
(...skipping 26 matching lines...) Expand all
62 62
63 /** 63 /**
64 * Convenience array that contains all of the margin controls. 64 * Convenience array that contains all of the margin controls.
65 * @type {!Object< 65 * @type {!Object<
66 * !print_preview.ticket_items.CustomMarginsOrientation, 66 * !print_preview.ticket_items.CustomMarginsOrientation,
67 * !print_preview.MarginControl>} 67 * !print_preview.MarginControl>}
68 * @private 68 * @private
69 */ 69 */
70 this.controls_ = {}; 70 this.controls_ = {};
71 for (var key in print_preview.ticket_items.CustomMarginsOrientation) { 71 for (var key in print_preview.ticket_items.CustomMarginsOrientation) {
72 var orientation = print_preview.ticket_items.CustomMarginsOrientation[ 72 var orientation =
73 key]; 73 print_preview.ticket_items.CustomMarginsOrientation[key];
74 var control = new print_preview.MarginControl(orientation); 74 var control = new print_preview.MarginControl(orientation);
75 this.controls_[orientation] = control; 75 this.controls_[orientation] = control;
76 this.addChild(control); 76 this.addChild(control);
77 } 77 }
78 78
79 /** 79 /**
80 * Margin control currently being dragged. Null if no control is being 80 * Margin control currently being dragged. Null if no control is being
81 * dragged. 81 * dragged.
82 * @type {print_preview.MarginControl} 82 * @type {print_preview.MarginControl}
83 * @private 83 * @private
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after
123 /** 123 /**
124 * @param {!print_preview.ticket_items.CustomMarginsOrientation} orientation 124 * @param {!print_preview.ticket_items.CustomMarginsOrientation} orientation
125 * Orientation value to test. 125 * Orientation value to test.
126 * @return {boolean} Whether the given orientation is TOP or BOTTOM. 126 * @return {boolean} Whether the given orientation is TOP or BOTTOM.
127 * @private 127 * @private
128 */ 128 */
129 MarginControlContainer.isTopOrBottom_ = function(orientation) { 129 MarginControlContainer.isTopOrBottom_ = function(orientation) {
130 return orientation == 130 return orientation ==
131 print_preview.ticket_items.CustomMarginsOrientation.TOP || 131 print_preview.ticket_items.CustomMarginsOrientation.TOP ||
132 orientation == 132 orientation ==
133 print_preview.ticket_items.CustomMarginsOrientation.BOTTOM; 133 print_preview.ticket_items.CustomMarginsOrientation.BOTTOM;
134 }; 134 };
135 135
136 MarginControlContainer.prototype = { 136 MarginControlContainer.prototype = {
137 __proto__: print_preview.Component.prototype, 137 __proto__: print_preview.Component.prototype,
138 138
139 /** 139 /**
140 * Updates the translation transformation that translates pixel values in 140 * Updates the translation transformation that translates pixel values in
141 * the space of the HTML DOM. 141 * the space of the HTML DOM.
142 * @param {print_preview.Coordinate2d} translateTransform Updated value of 142 * @param {print_preview.Coordinate2d} translateTransform Updated value of
143 * the translation transformation. 143 * the translation transformation.
(...skipping 24 matching lines...) Expand all
168 * Clips margin controls to the given clip size in pixels. 168 * Clips margin controls to the given clip size in pixels.
169 * @param {print_preview.Size} clipSize Size to clip the margin controls to. 169 * @param {print_preview.Size} clipSize Size to clip the margin controls to.
170 */ 170 */
171 updateClippingMask: function(clipSize) { 171 updateClippingMask: function(clipSize) {
172 if (!clipSize) { 172 if (!clipSize) {
173 return; 173 return;
174 } 174 }
175 this.clippingSize_ = clipSize; 175 this.clippingSize_ = clipSize;
176 for (var orientation in this.controls_) { 176 for (var orientation in this.controls_) {
177 var el = this.controls_[orientation].getElement(); 177 var el = this.controls_[orientation].getElement();
178 el.style.clip = 'rect(' + 178 el.style.clip = 'rect(' + (-el.offsetTop) + 'px, ' +
179 (-el.offsetTop) + 'px, ' +
180 (clipSize.width - el.offsetLeft) + 'px, ' + 179 (clipSize.width - el.offsetLeft) + 'px, ' +
181 (clipSize.height - el.offsetTop) + 'px, ' + 180 (clipSize.height - el.offsetTop) + 'px, ' + (-el.offsetLeft) +
182 (-el.offsetLeft) + 'px)'; 181 'px)';
183 } 182 }
184 }, 183 },
185 184
186 /** Shows the margin controls if the need to be shown. */ 185 /** Shows the margin controls if the need to be shown. */
187 showMarginControlsIfNeeded: function() { 186 showMarginControlsIfNeeded: function() {
188 if (this.marginsTypeTicketItem_.getValue() == 187 if (this.marginsTypeTicketItem_.getValue() ==
189 print_preview.ticket_items.MarginsTypeValue.CUSTOM) { 188 print_preview.ticket_items.MarginsTypeValue.CUSTOM) {
190 this.setIsMarginControlsVisible_(true); 189 this.setIsMarginControlsVisible_(true);
191 } 190 }
192 }, 191 },
193 192
194 /** @override */ 193 /** @override */
195 enterDocument: function() { 194 enterDocument: function() {
196 print_preview.Component.prototype.enterDocument.call(this); 195 print_preview.Component.prototype.enterDocument.call(this);
197 196
198 // We want to respond to mouse up events even beyond the component's 197 // We want to respond to mouse up events even beyond the component's
199 // element. 198 // element.
200 this.tracker.add(window, 'mouseup', this.onMouseUp_.bind(this)); 199 this.tracker.add(window, 'mouseup', this.onMouseUp_.bind(this));
201 this.tracker.add(window, 'mousemove', this.onMouseMove_.bind(this)); 200 this.tracker.add(window, 'mousemove', this.onMouseMove_.bind(this));
202 this.tracker.add( 201 this.tracker.add(
203 this.getElement(), 'mouseover', this.onMouseOver_.bind(this)); 202 this.getElement(), 'mouseover', this.onMouseOver_.bind(this));
204 this.tracker.add( 203 this.tracker.add(
205 this.getElement(), 'mouseout', this.onMouseOut_.bind(this)); 204 this.getElement(), 'mouseout', this.onMouseOut_.bind(this));
206 205
207 this.tracker.add( 206 this.tracker.add(
208 this.documentInfo_, 207 this.documentInfo_, print_preview.DocumentInfo.EventType.CHANGE,
209 print_preview.DocumentInfo.EventType.CHANGE,
210 this.onTicketChange_.bind(this)); 208 this.onTicketChange_.bind(this));
211 this.tracker.add( 209 this.tracker.add(
212 this.marginsTypeTicketItem_, 210 this.marginsTypeTicketItem_,
213 print_preview.ticket_items.TicketItem.EventType.CHANGE, 211 print_preview.ticket_items.TicketItem.EventType.CHANGE,
214 this.onTicketChange_.bind(this)); 212 this.onTicketChange_.bind(this));
215 this.tracker.add( 213 this.tracker.add(
216 this.customMarginsTicketItem_, 214 this.customMarginsTicketItem_,
217 print_preview.ticket_items.TicketItem.EventType.CHANGE, 215 print_preview.ticket_items.TicketItem.EventType.CHANGE,
218 this.onTicketChange_.bind(this)); 216 this.onTicketChange_.bind(this));
219 217
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after
254 * to in pixels. 252 * to in pixels.
255 * @private 253 * @private
256 */ 254 */
257 moveControlWithConstraints_: function(control, posInPixels) { 255 moveControlWithConstraints_: function(control, posInPixels) {
258 var newPosInPts; 256 var newPosInPts;
259 if (MarginControlContainer.isTopOrBottom_(control.getOrientation())) { 257 if (MarginControlContainer.isTopOrBottom_(control.getOrientation())) {
260 newPosInPts = control.convertPixelsToPts(posInPixels.y); 258 newPosInPts = control.convertPixelsToPts(posInPixels.y);
261 } else { 259 } else {
262 newPosInPts = control.convertPixelsToPts(posInPixels.x); 260 newPosInPts = control.convertPixelsToPts(posInPixels.x);
263 } 261 }
264 newPosInPts = Math.min(this.customMarginsTicketItem_.getMarginMax( 262 newPosInPts = Math.min(
265 control.getOrientation()), 263 this.customMarginsTicketItem_.getMarginMax(control.getOrientation()),
266 newPosInPts); 264 newPosInPts);
267 newPosInPts = Math.max(0, newPosInPts); 265 newPosInPts = Math.max(0, newPosInPts);
268 newPosInPts = Math.round(newPosInPts); 266 newPosInPts = Math.round(newPosInPts);
269 control.setPositionInPts(newPosInPts); 267 control.setPositionInPts(newPosInPts);
270 control.setTextboxValue(this.serializeValueFromPts_(newPosInPts)); 268 control.setTextboxValue(this.serializeValueFromPts_(newPosInPts));
271 }, 269 },
272 270
273 /** 271 /**
274 * @param {string} value Value to parse to points. E.g. '3.40"' or '200mm'. 272 * @param {string} value Value to parse to points. E.g. '3.40"' or '200mm'.
275 * @return {?number} Value in points represented by the input value. 273 * @return {?number} Value in points represented by the input value.
276 * @private 274 * @private
277 */ 275 */
278 parseValueToPts_: function(value) { 276 parseValueToPts_: function(value) {
279 // Removing whitespace anywhere in the string. 277 // Removing whitespace anywhere in the string.
280 value = value.replace(/\s*/g, ''); 278 value = value.replace(/\s*/g, '');
281 if (value.length == 0) { 279 if (value.length == 0) {
282 return null; 280 return null;
283 } 281 }
284 var validationRegex = new RegExp('^(^-?)(\\d)+(\\' + 282 var validationRegex = new RegExp(
285 this.measurementSystem_.thousandsDelimeter + '\\d{3})*(\\' + 283 '^(^-?)(\\d)+(\\' + this.measurementSystem_.thousandsDelimeter +
286 this.measurementSystem_.decimalDelimeter + '\\d*)?' + 284 '\\d{3})*(\\' + this.measurementSystem_.decimalDelimeter + '\\d*)?' +
287 '(' + this.measurementSystem_.unitSymbol + ')?$'); 285 '(' + this.measurementSystem_.unitSymbol + ')?$');
288 if (validationRegex.test(value)) { 286 if (validationRegex.test(value)) {
289 // Replacing decimal point with the dot symbol in order to use 287 // Replacing decimal point with the dot symbol in order to use
290 // parseFloat() properly. 288 // parseFloat() properly.
291 var replacementRegex = 289 var replacementRegex =
292 new RegExp('\\' + this.measurementSystem_.decimalDelimeter + '{1}'); 290 new RegExp('\\' + this.measurementSystem_.decimalDelimeter + '{1}');
293 value = value.replace(replacementRegex, '.'); 291 value = value.replace(replacementRegex, '.');
294 return this.measurementSystem_.convertToPoints(parseFloat(value)); 292 return this.measurementSystem_.convertToPoints(parseFloat(value));
295 } 293 }
296 return null; 294 return null;
(...skipping 172 matching lines...) Expand 10 before | Expand all | Expand 10 after
469 for (var o in this.controls_) { 467 for (var o in this.controls_) {
470 if (control.getOrientation() != o) { 468 if (control.getOrientation() != o) {
471 this.controls_[o].setIsEnabled(enableOtherControls); 469 this.controls_[o].setIsEnabled(enableOtherControls);
472 } 470 }
473 } 471 }
474 } 472 }
475 } 473 }
476 }; 474 };
477 475
478 // Export 476 // Export
479 return { 477 return {MarginControlContainer: MarginControlContainer};
480 MarginControlContainer: MarginControlContainer
481 };
482 }); 478 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698