Skip to content
This repository has been archived by the owner on Jan 22, 2024. It is now read-only.

Commit

Permalink
Make a number of private properties that were being used as
Browse files Browse the repository at this point in the history
protected properties protected so that we can move
javascript/closure/compiledClosure to visibility=error.

R=chrishenry,nicksantos
DELTA=137 (40 added, 15 deleted, 82 changed)


Revision created by MOE tool push_codebase.
MOE_MIGRATION=6214


git-svn-id: http://closure-library.googlecode.com/svn/trunk@2477 0b95b8e8-c90f-11de-9d4f-f947ee5921c8
  • Loading branch information
nnaze@google.com committed Jan 29, 2013
1 parent 437c299 commit 38cc19b
Show file tree
Hide file tree
Showing 4 changed files with 122 additions and 97 deletions.
24 changes: 11 additions & 13 deletions closure/goog/ui/hsvapalette.js
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -57,11 +57,9 @@ goog.ui.HsvaPalette = function(opt_domHelper, opt_color, opt_alpha, opt_class) {
this.alpha_ = goog.isDef(opt_alpha) ? opt_alpha : 1; this.alpha_ = goog.isDef(opt_alpha) ? opt_alpha : 1;


/** /**
* The base class name for the component. * @override
* @type {string}
* @private
*/ */
this.class_ = opt_class || goog.getCssName('goog-hsva-palette'); this.className = opt_class || goog.getCssName('goog-hsva-palette');


/** /**
* The document which is being listened to. * The document which is being listened to.
Expand Down Expand Up @@ -176,11 +174,11 @@ goog.ui.HsvaPalette.prototype.createDom = function() {


var dom = this.getDomHelper(); var dom = this.getDomHelper();
this.aImageEl_ = dom.createDom( this.aImageEl_ = dom.createDom(
goog.dom.TagName.DIV, goog.getCssName(this.class_, 'a-image')); goog.dom.TagName.DIV, goog.getCssName(this.className, 'a-image'));
this.aHandleEl_ = dom.createDom( this.aHandleEl_ = dom.createDom(
goog.dom.TagName.DIV, goog.getCssName(this.class_, 'a-handle')); goog.dom.TagName.DIV, goog.getCssName(this.className, 'a-handle'));
this.swatchBackdropEl_ = dom.createDom( this.swatchBackdropEl_ = dom.createDom(
goog.dom.TagName.DIV, goog.getCssName(this.class_, 'swatch-backdrop')); goog.dom.TagName.DIV, goog.getCssName(this.className, 'swatch-backdrop'));
dom.appendChild(this.element_, this.aImageEl_); dom.appendChild(this.element_, this.aImageEl_);
dom.appendChild(this.element_, this.aHandleEl_); dom.appendChild(this.element_, this.aHandleEl_);
dom.appendChild(this.element_, this.swatchBackdropEl_); dom.appendChild(this.element_, this.swatchBackdropEl_);
Expand All @@ -207,16 +205,16 @@ goog.ui.HsvaPalette.prototype.updateUi = function() {
this.aImageEl_.offsetHeight * ((255 - a) / 255); this.aImageEl_.offsetHeight * ((255 - a) / 255);
this.aHandleEl_.style.top = top + 'px'; this.aHandleEl_.style.top = top + 'px';
this.aImageEl_.style.backgroundColor = this.color_; this.aImageEl_.style.backgroundColor = this.color_;
goog.style.setOpacity(this.swatchEl_, a / 255); goog.style.setOpacity(this.swatchElement, a / 255);
} }
}; };




/** @override */ /** @override */
goog.ui.HsvaPalette.prototype.updateInput = function() { goog.ui.HsvaPalette.prototype.updateInput = function() {
if (!goog.array.equals([this.color_, this.alpha_], if (!goog.array.equals([this.color_, this.alpha_],
goog.ui.HsvaPalette.parseUserInput_(this.inputEl_.value))) { goog.ui.HsvaPalette.parseUserInput_(this.inputElement.value))) {
this.inputEl_.value = this.getColorRgbaHex(); this.inputElement.value = this.getColorRgbaHex();
} }
}; };


Expand All @@ -226,13 +224,13 @@ goog.ui.HsvaPalette.prototype.handleMouseDown = function(e) {
goog.base(this, 'handleMouseDown', e); goog.base(this, 'handleMouseDown', e);
if (e.target == this.aImageEl_ || e.target == this.aHandleEl_) { if (e.target == this.aImageEl_ || e.target == this.aHandleEl_) {
// Setup value change listeners // Setup value change listeners
var b = goog.style.getBounds(this.vImageEl_); var b = goog.style.getBounds(this.valueBackgroundImageElement);
this.handleMouseMoveA_(b, e); this.handleMouseMoveA_(b, e);
this.mouseMoveListener_ = goog.events.listen(this.document_, this.mouseMoveListener_ = goog.events.listen(this.document_,
goog.events.EventType.MOUSEMOVE, goog.events.EventType.MOUSEMOVE,
goog.bind(this.handleMouseMoveA_, this, b)); goog.bind(this.handleMouseMoveA_, this, b));
this.mouseUpListener_ = goog.events.listen(this.document_, this.mouseUpListener_ = goog.events.listen(this.document_,
goog.events.EventType.MOUSEUP, this.handleMouseUp_, false, this); goog.events.EventType.MOUSEUP, this.handleMouseUp, false, this);
} }
}; };


Expand All @@ -257,7 +255,7 @@ goog.ui.HsvaPalette.prototype.handleMouseMoveA_ = function(b, e) {


/** @override */ /** @override */
goog.ui.HsvaPalette.prototype.handleInput = function(e) { goog.ui.HsvaPalette.prototype.handleInput = function(e) {
var parsed = goog.ui.HsvaPalette.parseUserInput_(this.inputEl_.value); var parsed = goog.ui.HsvaPalette.parseUserInput_(this.inputElement.value);
if (parsed) { if (parsed) {
this.setColorAlphaHelper_(parsed[0], parsed[1]); this.setColorAlphaHelper_(parsed[0], parsed[1]);
} }
Expand Down
14 changes: 7 additions & 7 deletions closure/goog/ui/hsvapalette_test.html
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@
function testInputColor() { function testInputColor() {
samplePalette.render(document.getElementById('sandbox')); samplePalette.render(document.getElementById('sandbox'));
var color = '#00112233'; var color = '#00112233';
samplePalette.inputEl_.value = color; samplePalette.inputElement.value = color;
samplePalette.handleInput(null); samplePalette.handleInput(null);
assertEquals(color, assertEquals(color,
goog.color.alpha.parse(samplePalette.getColorRgbaHex()).hex); goog.color.alpha.parse(samplePalette.getColorRgbaHex()).hex);
Expand Down Expand Up @@ -128,23 +128,23 @@
samplePalette.render(document.getElementById('sandbox')); samplePalette.render(document.getElementById('sandbox'));


samplePalette.setAlpha(1); samplePalette.setAlpha(1);
assertEquals(1, goog.style.getOpacity(samplePalette.swatchEl_)); assertEquals(1, goog.style.getOpacity(samplePalette.swatchElement));


samplePalette.setAlpha(0x99 / 0xff); samplePalette.setAlpha(0x99 / 0xff);
assertEquals(0.6, goog.style.getOpacity(samplePalette.swatchEl_)); assertEquals(0.6, goog.style.getOpacity(samplePalette.swatchElement));


samplePalette.setAlpha(0); samplePalette.setAlpha(0);
assertEquals(0, goog.style.getOpacity(samplePalette.swatchEl_)); assertEquals(0, goog.style.getOpacity(samplePalette.swatchElement));
} }


function testNoTransparencyBehavior() { function testNoTransparencyBehavior() {
samplePalette.render(document.getElementById('sandbox')); samplePalette.render(document.getElementById('sandbox'));


samplePalette.inputEl_.value = '#abcdef22'; samplePalette.inputElement.value = '#abcdef22';
samplePalette.handleInput(null); samplePalette.handleInput(null);
samplePalette.inputEl_.value = '#abcdef'; samplePalette.inputElement.value = '#abcdef';
samplePalette.handleInput(null); samplePalette.handleInput(null);
assertEquals(1, goog.style.getOpacity(samplePalette.swatchEl_)); assertEquals(1, goog.style.getOpacity(samplePalette.swatchElement));
} }


</script> </script>
Expand Down
125 changes: 74 additions & 51 deletions closure/goog/ui/hsvpalette.js
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -61,9 +61,9 @@ goog.ui.HsvPalette = function(opt_domHelper, opt_color, opt_class) {
/** /**
* The base class name for the component. * The base class name for the component.
* @type {string} * @type {string}
* @private * @protected
*/ */
this.class_ = opt_class || goog.getCssName('goog-hsv-palette'); this.className = opt_class || goog.getCssName('goog-hsv-palette');


/** /**
* The document which is being listened to. * The document which is being listened to.
Expand Down Expand Up @@ -96,9 +96,9 @@ goog.ui.HsvPalette.prototype.hsHandleEl_;
/** /**
* DOM element representing the value background image. * DOM element representing the value background image.
* @type {Element} * @type {Element}
* @private * @protected
*/ */
goog.ui.HsvPalette.prototype.vImageEl_; goog.ui.HsvPalette.prototype.valueBackgroundImageElement;




/** /**
Expand All @@ -112,17 +112,17 @@ goog.ui.HsvPalette.prototype.vHandleEl_;
/** /**
* DOM element representing the current color swatch. * DOM element representing the current color swatch.
* @type {Element} * @type {Element}
* @private * @protected
*/ */
goog.ui.HsvPalette.prototype.swatchEl_; goog.ui.HsvPalette.prototype.swatchElement;




/** /**
* DOM element representing the hex color input text field. * DOM element representing the hex color input text field.
* @type {Element} * @type {Element}
* @private * @protected
*/ */
goog.ui.HsvPalette.prototype.inputEl_; goog.ui.HsvPalette.prototype.inputElement;




/** /**
Expand Down Expand Up @@ -176,12 +176,12 @@ goog.ui.HsvPalette.prototype.getAlpha = function() {
goog.ui.HsvPalette.prototype.updateInput = function() { goog.ui.HsvPalette.prototype.updateInput = function() {
var parsed; var parsed;
try { try {
parsed = goog.color.parse(this.inputEl_.value).hex; parsed = goog.color.parse(this.inputElement.value).hex;
} catch (e) { } catch (e) {
// ignore // ignore
} }
if (this.color_ != parsed) { if (this.color_ != parsed) {
this.inputEl_.value = this.color_; this.inputElement.value = this.color_;
} }
}; };


Expand Down Expand Up @@ -274,26 +274,45 @@ goog.ui.HsvPalette.prototype.canDecorate = function(element) {
goog.ui.HsvPalette.prototype.createDom = function() { goog.ui.HsvPalette.prototype.createDom = function() {
var dom = this.getDomHelper(); var dom = this.getDomHelper();
var noalpha = (goog.userAgent.IE && !goog.userAgent.isVersion('7')) ? var noalpha = (goog.userAgent.IE && !goog.userAgent.isVersion('7')) ?
' ' + goog.getCssName(this.class_, 'noalpha') : ''; ' ' + goog.getCssName(this.className, 'noalpha') : '';

var backdrop = dom.createDom(goog.dom.TagName.DIV,
goog.getCssName(this.className, 'hs-backdrop'));

this.hsHandleEl_ = dom.createDom(goog.dom.TagName.DIV,
goog.getCssName(this.className, 'hs-handle'));

this.hsImageEl_ = dom.createDom(goog.dom.TagName.DIV,
goog.getCssName(this.className, 'hs-image'),
this.hsHandleEl_);

this.valueBackgroundImageElement = dom.createDom(
goog.dom.TagName.DIV,
goog.getCssName(this.className, 'v-image'));

this.vHandleEl_ = dom.createDom(
goog.dom.TagName.DIV,
goog.getCssName(this.className, 'v-handle'));

this.swatchElement = dom.createDom(goog.dom.TagName.DIV,
goog.getCssName(this.className, 'swatch'));

this.inputElement = dom.createDom('input', {
'class': goog.getCssName(this.className, 'input'),
'type': 'text', 'dir': 'ltr'
});

var labelElement = dom.createDom('label', null, this.inputElement);

var element = dom.createDom(goog.dom.TagName.DIV, var element = dom.createDom(goog.dom.TagName.DIV,
this.class_ + noalpha, this.className + noalpha,
dom.createDom(goog.dom.TagName.DIV, backdrop,
goog.getCssName(this.class_, 'hs-backdrop')), this.hsImageEl_,
this.hsImageEl_ = dom.createDom(goog.dom.TagName.DIV, this.valueBackgroundImageElement,
goog.getCssName(this.class_, 'hs-image'), this.vHandleEl_,
this.hsHandleEl_ = dom.createDom(goog.dom.TagName.DIV, this.swatchElement,
goog.getCssName(this.class_, 'hs-handle'))), labelElement);
this.vImageEl_ = dom.createDom(goog.dom.TagName.DIV,
goog.getCssName(this.class_, 'v-image')),
this.vHandleEl_ = dom.createDom(goog.dom.TagName.DIV,
goog.getCssName(this.class_, 'v-handle')),
this.swatchEl_ = dom.createDom(goog.dom.TagName.DIV,
goog.getCssName(this.class_, 'swatch')),
dom.createDom('label', null,
//dom.createDom('span', null, 'Hex color '),
this.inputEl_ = dom.createDom('input',
{'class': goog.getCssName(this.class_, 'input'),
'type': 'text', 'dir': 'ltr'})));
this.setElementInternal(element); this.setElementInternal(element);


// TODO(arv): Set tabIndex // TODO(arv): Set tabIndex
Expand All @@ -319,7 +338,7 @@ goog.ui.HsvPalette.prototype.enterDocument = function() {
// Cannot create InputHandler in createDom because IE throws an exception // Cannot create InputHandler in createDom because IE throws an exception
// on document.activeElement // on document.activeElement
if (!this.inputHandler_) { if (!this.inputHandler_) {
this.inputHandler_ = new goog.events.InputHandler(this.inputEl_); this.inputHandler_ = new goog.events.InputHandler(this.inputElement);
} }


handler.listen(this.inputHandler_, handler.listen(this.inputHandler_,
Expand All @@ -333,10 +352,10 @@ goog.ui.HsvPalette.prototype.disposeInternal = function() {


delete this.hsImageEl_; delete this.hsImageEl_;
delete this.hsHandleEl_; delete this.hsHandleEl_;
delete this.vImageEl_; delete this.valueBackgroundImageElement;
delete this.vHandleEl_; delete this.vHandleEl_;
delete this.swatchEl_; delete this.swatchElement;
delete this.inputEl_; delete this.inputElement;
if (this.inputHandler_) { if (this.inputHandler_) {
this.inputHandler_.dispose(); this.inputHandler_.dispose();
delete this.inputHandler_; delete this.inputHandler_;
Expand Down Expand Up @@ -377,17 +396,18 @@ goog.ui.HsvPalette.prototype.updateUi = function() {
goog.style.bidi.setPosition(this.hsHandleEl_, left, top, goog.style.bidi.setPosition(this.hsHandleEl_, left, top,
this.isRightToLeft()); this.isRightToLeft());


top = this.vImageEl_.offsetTop - top = this.valueBackgroundImageElement.offsetTop -
Math.floor(this.vHandleEl_.offsetHeight / 2) + Math.floor(this.vHandleEl_.offsetHeight / 2) +
this.vImageEl_.offsetHeight * ((255 - v) / 255); this.valueBackgroundImageElement.offsetHeight * ((255 - v) / 255);

this.vHandleEl_.style.top = top + 'px'; this.vHandleEl_.style.top = top + 'px';
goog.style.setOpacity(this.hsImageEl_, (v / 255)); goog.style.setOpacity(this.hsImageEl_, (v / 255));


goog.style.setStyle(this.vImageEl_, 'background-color', goog.style.setStyle(this.valueBackgroundImageElement, 'background-color',
goog.color.hsvToHex(this.hsv_[0] * 360, this.hsv_[1], 255)); goog.color.hsvToHex(this.hsv_[0] * 360, this.hsv_[1], 255));


goog.style.setStyle(this.swatchEl_, 'background-color', this.color_); goog.style.setStyle(this.swatchElement, 'background-color', this.color_);
goog.style.setStyle(this.swatchEl_, 'color', goog.style.setStyle(this.swatchElement, 'color',
(this.hsv_[2] > 255 / 2) ? '#000' : '#fff'); (this.hsv_[2] > 255 / 2) ? '#000' : '#fff');
this.updateInput(); this.updateInput();
} }
Expand All @@ -400,15 +420,16 @@ goog.ui.HsvPalette.prototype.updateUi = function() {
* @protected * @protected
*/ */
goog.ui.HsvPalette.prototype.handleMouseDown = function(e) { goog.ui.HsvPalette.prototype.handleMouseDown = function(e) {
if (e.target == this.vImageEl_ || e.target == this.vHandleEl_) { if (e.target == this.valueBackgroundImageElement ||
e.target == this.vHandleEl_) {
// Setup value change listeners // Setup value change listeners
var b = goog.style.getBounds(this.vImageEl_); var b = goog.style.getBounds(this.valueBackgroundImageElement);
this.handleMouseMoveV_(b, e); this.handleMouseMoveV_(b, e);
this.mouseMoveListener_ = goog.events.listen(this.document_, this.mouseMoveListener_ = goog.events.listen(this.document_,
goog.events.EventType.MOUSEMOVE, goog.events.EventType.MOUSEMOVE,
goog.bind(this.handleMouseMoveV_, this, b)); goog.bind(this.handleMouseMoveV_, this, b));
this.mouseUpListener_ = goog.events.listen(this.document_, this.mouseUpListener_ = goog.events.listen(this.document_,
goog.events.EventType.MOUSEUP, this.handleMouseUp_, false, this); goog.events.EventType.MOUSEUP, this.handleMouseUp, false, this);
} else if (e.target == this.hsImageEl_ || e.target == this.hsHandleEl_) { } else if (e.target == this.hsImageEl_ || e.target == this.hsHandleEl_) {
// Setup hue/saturation change listeners // Setup hue/saturation change listeners
var b = goog.style.getBounds(this.hsImageEl_); var b = goog.style.getBounds(this.hsImageEl_);
Expand All @@ -417,7 +438,7 @@ goog.ui.HsvPalette.prototype.handleMouseDown = function(e) {
goog.events.EventType.MOUSEMOVE, goog.events.EventType.MOUSEMOVE,
goog.bind(this.handleMouseMoveHs_, this, b)); goog.bind(this.handleMouseMoveHs_, this, b));
this.mouseUpListener_ = goog.events.listen(this.document_, this.mouseUpListener_ = goog.events.listen(this.document_,
goog.events.EventType.MOUSEUP, this.handleMouseUp_, false, this); goog.events.EventType.MOUSEUP, this.handleMouseUp, false, this);
} }
}; };


Expand All @@ -433,12 +454,14 @@ goog.ui.HsvPalette.prototype.handleMouseDown = function(e) {
goog.ui.HsvPalette.prototype.handleMouseMoveV_ = function(b, e) { goog.ui.HsvPalette.prototype.handleMouseMoveV_ = function(b, e) {
e.preventDefault(); e.preventDefault();
var vportPos = this.getDomHelper().getDocumentScroll(); var vportPos = this.getDomHelper().getDocumentScroll();

var height = Math.min(
Math.max(vportPos.y + e.clientY, b.top),
b.top + b.height);

var newV = Math.round( var newV = Math.round(
255 * (b.top + b.height - Math.min( 255 * (b.top + b.height - height) / b.height);
Math.max(vportPos.y + e.clientY, b.top),
b.top + b.height)
) / b.height
);
this.setHsv(null, null, newV); this.setHsv(null, null, newV);
}; };


Expand All @@ -465,9 +488,9 @@ goog.ui.HsvPalette.prototype.handleMouseMoveHs_ = function(b, e) {
/** /**
* Handles mouseup events on the document, which ends a drag operation. * Handles mouseup events on the document, which ends a drag operation.
* @param {goog.events.Event} e Event object. * @param {goog.events.Event} e Event object.
* @private * @protected
*/ */
goog.ui.HsvPalette.prototype.handleMouseUp_ = function(e) { goog.ui.HsvPalette.prototype.handleMouseUp = function(e) {
goog.events.unlistenByKey(this.mouseMoveListener_); goog.events.unlistenByKey(this.mouseMoveListener_);
goog.events.unlistenByKey(this.mouseUpListener_); goog.events.unlistenByKey(this.mouseUpListener_);
}; };
Expand All @@ -479,7 +502,7 @@ goog.ui.HsvPalette.prototype.handleMouseUp_ = function(e) {
* @protected * @protected
*/ */
goog.ui.HsvPalette.prototype.handleInput = function(e) { goog.ui.HsvPalette.prototype.handleInput = function(e) {
if (/^#[0-9a-f]{6}$/i.test(this.inputEl_.value)) { if (/^#[0-9a-f]{6}$/i.test(this.inputElement.value)) {
this.setColor(this.inputEl_.value); this.setColor(this.inputElement.value);
} }
}; };
Loading

0 comments on commit 38cc19b

Please sign in to comment.