Ranged highlights: initial commit
- Initial commit: structure, 'enabled' property controls sample mouseDown handler. - Minimal integration: isRangeSelected - Minimal test. Change-Id: I963ac7b158d57a1c24ee302d99eb6af26b0aeeeb
This commit is contained in:
Viktar Donich
@@ -0,0 +1,40 @@
|
||||
<!--
|
||||
Copyright (C) 2016 The Android Open Source Project
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
-->
|
||||
<link rel="import" href="../../../bower_components/polymer/polymer.html">
|
||||
|
||||
<link rel="import" href="../gr-selection-action-box/gr-selection-action-box.html">
|
||||
|
||||
<dom-module id="gr-diff-highlight">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
position: relative;
|
||||
}
|
||||
.contentWrapper ::content .range {
|
||||
background-color: #ffd500 !important;
|
||||
display: inline;
|
||||
}
|
||||
.contentWrapper ::content .rangeHighlight {
|
||||
background-color: #ff0 !important;
|
||||
display: inline;
|
||||
}
|
||||
</style>
|
||||
<div class="contentWrapper">
|
||||
<content></content>
|
||||
</div>
|
||||
</template>
|
||||
<script src="gr-diff-highlight.js"></script>
|
||||
</dom-module>
|
||||
@@ -0,0 +1,80 @@
|
||||
// Copyright (C) 2016 The Android Open Source Project
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License.
|
||||
// You may obtain a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
Polymer({
|
||||
is: 'gr-diff-highlight',
|
||||
|
||||
properties: {
|
||||
comments: Object,
|
||||
enabled: {
|
||||
type: Boolean,
|
||||
observer: '_enabledChanged',
|
||||
},
|
||||
loggedIn: Boolean,
|
||||
_cachedDiffBuilder: Object,
|
||||
_diffElement: Object,
|
||||
_enabledListeners: {
|
||||
type: Object,
|
||||
value: function() {
|
||||
return {
|
||||
'down': '_handleDown',
|
||||
};
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
get diffBuilder() {
|
||||
if (!this._cachedDiffBuilder) {
|
||||
this._cachedDiffBuilder =
|
||||
Polymer.dom(this).querySelector('gr-diff-builder');
|
||||
}
|
||||
return this._cachedDiffBuilder;
|
||||
},
|
||||
|
||||
get diffElement() {
|
||||
if (!this._diffElement) {
|
||||
this._diffElement = Polymer.dom(this).querySelector('#diffTable');
|
||||
}
|
||||
return this._diffElement;
|
||||
},
|
||||
|
||||
detached: function() {
|
||||
this.enabled = false;
|
||||
},
|
||||
|
||||
_enabledChanged: function() {
|
||||
for (var eventName in this._enabledListeners) {
|
||||
var methodName = this._enabledListeners[eventName];
|
||||
if (this.enabled) {
|
||||
this.listen(this, eventName, methodName);
|
||||
} else {
|
||||
this.unlisten(this, eventName, methodName);
|
||||
};
|
||||
};
|
||||
},
|
||||
|
||||
isRangeSelected: function() {
|
||||
return !!this.$$('gr-selection-action-box');
|
||||
},
|
||||
|
||||
_handleDown: function(e) {
|
||||
var actionBox = this.$$('gr-selection-action-box');
|
||||
if (actionBox && !actionBox.contains(e.target)) {
|
||||
this._removeActionBox();
|
||||
}
|
||||
},
|
||||
});
|
||||
})();
|
||||
@@ -0,0 +1,51 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (C) 2016 The Android Open Source Project
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
-->
|
||||
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
<title>gr-diff-highlight</title>
|
||||
|
||||
<script src="../../../bower_components/webcomponentsjs/webcomponents.min.js"></script>
|
||||
<script src="../../../bower_components/web-component-tester/browser.js"></script>
|
||||
|
||||
<link rel="import" href="../../../bower_components/iron-test-helpers/iron-test-helpers.html">
|
||||
<link rel="import" href="gr-diff-highlight.html">
|
||||
|
||||
<test-fixture id="basic">
|
||||
<template>
|
||||
<gr-diff-highlight></gr-diff-highlight>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
suite('gr-diff-highlight', function() {
|
||||
var element;
|
||||
|
||||
setup(function() {
|
||||
element = fixture('basic');
|
||||
});
|
||||
|
||||
test('handles down only when enabled ', function() {
|
||||
sinon.stub(element, '_handleDown');
|
||||
MockInteractions.down(element);
|
||||
assert.isFalse(element._handleDown.called);
|
||||
element.enabled = true;
|
||||
MockInteractions.down(element);
|
||||
assert.isTrue(element._handleDown.called);
|
||||
element._handleDown.restore();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user