secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Using _ref

Browse Source
This commit is contained in:
James Barnsley
2020-03-10 08:01:52 +13:00
parent 1c5f0b2bfc
commit 3d9e2e4cb8
6 changed files with 78 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
mopidy_iris/static/app.css
View File

@ -3740,14 +3740,6 @@ select {
margin: 0;
background: rgba(128, 128, 128, 0.5);
opacity: 0.5; }
.context-menu__background {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
opacity: 0; }
.context-menu--submenu-expanded .context-menu__section {
transform: translateX(-100%);
opacity: 0; }

2
mopidy_iris/static/app.css.map
View File

File diff suppressed because one or more lines are too long

39
mopidy_iris/static/app.js
View File

@ -57754,10 +57754,14 @@ var ContextMenu = function (_React$Component) {
_this.componentDidMount = function () {
window.addEventListener('scroll', _this.handleScroll, false);
window.addEventListener('mousedown', _this.handleMouseDown, false);
window.addEventListener('touchstart', _this.handleTouchStart, false);
};
_this.componentWillUnmount = function () {
window.removeEventListener('scroll', _this.handleScroll, false);
window.removeEventListener('mousedown', _this.handleMouseDown, false);
window.removeEventListener('touchstart', _this.handleTouchStart, false);
};
_this.componentDidUpdate = function (prevProps) {
@ -57814,6 +57818,33 @@ var ContextMenu = function (_React$Component) {
if (menu) hideContextMenu();
};
_this.handleMouseDown = function (e) {
var hideContextMenu = _this.props.uiActions.hideContextMenu;
if (_this._ref && !_this._ref.contains(e.target)) {
console.log('outside');
hideContextMenu();
}
/*
// if we click (touch or mouse) outside of the context menu or context menu trigger, kill it
if ($(e.target).closest('.context-menu').length <= 0 && $(e.target).closest('.context-menu-trigger').length <= 0) {
hideContextMenu();
}
*/
};
_this.handleTouchStart = function (e) {
var hideContextMenu = _this.props.uiActions.hideContextMenu;
// if we click (touch or mouse) outside of the context menu or context menu trigger, kill it
if ($(e.target).closest('.context-menu').length <= 0 && $(e.target).closest('.context-menu-trigger').length <= 0) {
hideContextMenu();
}
};
_this.inLibrary = function () {
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
uri = _ref.uri;
@ -58233,11 +58264,19 @@ var ContextMenu = function (_React$Component) {
_this.state = {
submenu: null
};
_this.setRef = _this.setRef.bind(_this);
_this.handleScroll = (0, _helpers.throttle)(_this.handleScroll.bind(_this), 50);
_this.handleMouseDown = _this.handleMouseDown.bind(_this);
_this.handleTouchStart = _this.handleTouchStart.bind(_this);
return _this;
}
_createClass(ContextMenu, [{
key: 'setRef',
value: function setRef(ref) {
this._ref = ref;
}
}, {
key: 'getContext',
value: function getContext() {
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;

2
mopidy_iris/static/app.js.map
View File

File diff suppressed because one or more lines are too long

37
src/js/components/ContextMenu.js
View File

@ -33,15 +33,22 @@ class ContextMenu extends React.Component {
this.state = {
submenu: null,
};
this.setRef = this.setRef.bind(this);
this.handleScroll = throttle(this.handleScroll.bind(this), 50);
this.handleMouseDown = this.handleMouseDown.bind(this);
this.handleTouchStart = this.handleTouchStart.bind(this);
}
componentDidMount = () => {
window.addEventListener('scroll', this.handleScroll, false);
window.addEventListener('mousedown', this.handleMouseDown, false);
window.addEventListener('touchstart', this.handleTouchStart, false);
}
componentWillUnmount = () => {
window.removeEventListener('scroll', this.handleScroll, false);
window.removeEventListener('mousedown', this.handleMouseDown, false);
window.removeEventListener('touchstart', this.handleTouchStart, false);
}
componentDidUpdate = (prevProps) => {
@ -97,6 +104,35 @@ class ContextMenu extends React.Component {
if (menu) hideContextMenu();
}
handleMouseDown = (e) => {
const { uiActions: { hideContextMenu } } = this.props;
if (this._ref && !this._ref.contains(e.target)) {
console.log('outside');
hideContextMenu();
}
/*
// if we click (touch or mouse) outside of the context menu or context menu trigger, kill it
if ($(e.target).closest('.context-menu').length <= 0 && $(e.target).closest('.context-menu-trigger').length <= 0) {
hideContextMenu();
}
*/
}
handleTouchStart = (e) => {
const { uiActions: { hideContextMenu } } = this.props;
// if we click (touch or mouse) outside of the context menu or context menu trigger, kill it
if ($(e.target).closest('.context-menu').length <= 0 && $(e.target).closest('.context-menu-trigger').length <= 0) {
hideContextMenu();
}
}
setRef(ref) {
this._ref = ref;
}
getContext(props = this.props) {
const {
menu,
@ -531,6 +567,7 @@ class ContextMenu extends React.Component {
push(buildLink(uris[0]));
}
copyURIs = () => {
const {
uiActions: {

10
src/scss/components/_context-menu.scss
View File

@ -96,16 +96,6 @@
opacity: 0.5;
}
&__background {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
opacity: 0;
}
&--submenu-expanded {
.context-menu {