From e3c224e1df67655d2b93f108825e3793745302cd Mon Sep 17 00:00:00 2001 From: James Barnsley Date: Tue, 20 Dec 2016 13:41:58 +1300 Subject: [PATCH] Readme update; Context menu positioning in extremities --- README.md | 26 +++++++++++++------------- src/js/components/ContextMenu.js | 3 +++ src/js/components/VersionManager.js | 2 +- src/scss/components/_context-menu.scss | 15 ++++++++++++--- 4 files changed, 29 insertions(+), 17 deletions(-) diff --git a/README.md b/README.md index d47249fc..a943f7c2 100755 --- a/README.md +++ b/README.md @@ -3,8 +3,8 @@ Iris Iris (previously known as Spotmop) is a Mopidy HTTP client that utilizes Spotify to create an interactive, user-friendly and collaborative music interface. Built and maintained by James Barnsley. -![badge](https://img.shields.io/pypi/v/mopidy-spotmop.svg?style=flat) -![badge](https://img.shields.io/pypi/dm/mopidy-spotmop.svg) +![badge](https://img.shields.io/pypi/v/mopidy-iris.svg?style=flat) +![badge](https://img.shields.io/pypi/dm/mopidy-iris.svg) [![badge](https://img.shields.io/badge/donate-paypal-blue.svg)](https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=james%40barnsley%2enz&lc=NZ&item_name=James%20Barnsley¤cy_code=NZD&bn=PP%2dDonationsBF%3abtn_donate_LG%2egif%3aNonHosted) Features @@ -20,17 +20,17 @@ Features Screenshots ----------- -![Overview](https://raw.githubusercontent.com/jaedb/spotmop/master/Screenshots/overview.jpg) +![Overview](https://raw.githubusercontent.com/jaedb/iris/master/Screenshots/overview.jpg) -![Play queue](https://raw.githubusercontent.com/jaedb/spotmop/master/Screenshots/desktop-queue.jpg) +![Play queue](https://raw.githubusercontent.com/jaedb/iris/master/Screenshots/desktop-queue.jpg) -![Featured playlists](https://raw.githubusercontent.com/jaedb/spotmop/master/Screenshots/desktop-featured.jpg) +![Featured playlists](https://raw.githubusercontent.com/jaedb/iris/master/Screenshots/desktop-featured.jpg) -![Artist](https://raw.githubusercontent.com/jaedb/spotmop/master/Screenshots/desktop-artist.jpg) +![Artist](https://raw.githubusercontent.com/jaedb/iris/master/Screenshots/desktop-artist.jpg) -![Single playlist](https://raw.githubusercontent.com/jaedb/spotmop/master/Screenshots/desktop-playlist.jpg) +![Single playlist](https://raw.githubusercontent.com/jaedb/iris/master/Screenshots/desktop-playlist.jpg) -![Dragging tracks](https://raw.githubusercontent.com/jaedb/spotmop/master/Screenshots/desktop-dragging.jpg) +![Dragging tracks](https://raw.githubusercontent.com/jaedb/iris/master/Screenshots/desktop-dragging.jpg) Requirements @@ -44,20 +44,20 @@ Requirements Installation -------- -1. Install using pip: `sudo pip install Mopidy-Spotmop` +1. Install using pip: `sudo pip install Mopidy-Iris` 2. Restart Mopidy server -3. Navigate to Mopidy interface (ie http://localhost:6680/spotmop) +3. Navigate to Mopidy interface (ie http://localhost:6680/iris) Development ----- -1. Clone this repository into a your Apache2 web directory (ie `/var/www/html/`) +1. Clone this repository into a your Apache2 web directory (eg `/var/www/html/`) 2. Install in develop mode `python setup.py install develop` 3. Restart mopidy Support ------- -* [Changelog](https://github.com/jaedb/spotmop/releases) -* [Issues and requests](https://github.com/jaedb/spotmop/issues) +* [Changelog](https://github.com/jaedb/iris/releases) +* [Issues and requests](https://github.com/jaedb/iris/issues) diff --git a/src/js/components/ContextMenu.js b/src/js/components/ContextMenu.js index 05d83fb8..2dbc14f6 100755 --- a/src/js/components/ContextMenu.js +++ b/src/js/components/ContextMenu.js @@ -222,6 +222,9 @@ class ContextMenu extends React.Component{ className += ' '+this.props.context_menu.trigger } + if (this.props.context_menu.position_x > (window.innerWidth - 154)) className += ' right-align' + if (this.props.context_menu.position_x > (window.innerWidth - 308)) className += ' right-align-submenu' + return (
{ this.renderItems(trigger) } diff --git a/src/js/components/VersionManager.js b/src/js/components/VersionManager.js index e4f9531a..c15bc571 100755 --- a/src/js/components/VersionManager.js +++ b/src/js/components/VersionManager.js @@ -33,7 +33,7 @@ class VersionManager extends React.Component{ return } - return null; + return } render(){ diff --git a/src/scss/components/_context-menu.scss b/src/scss/components/_context-menu.scss index f05308c8..2d76718c 100755 --- a/src/scss/components/_context-menu.scss +++ b/src/scss/components/_context-menu.scss @@ -7,6 +7,15 @@ background: $dark_grey; color: #FFFFFF; + &.right-align { + margin-left: -140px; + } + + &.right-align-submenu .submenu { + left: auto !important; + right: 140px !important; + } + .menu-item-wrapper { display: block; position: relative; @@ -15,7 +24,7 @@ cursor: pointer; display: block; padding: 8px 12px; - width: 120px; + width: 140px; box-sizing: border-box; } @@ -32,14 +41,14 @@ .submenu { display: none; position: absolute; - left: 120px; + left: 140px; top: 0; max-height: 200px; overflow-y: scroll; background: lighten($dark_grey, 5%); .menu-item { - width: 150px; + width: 140px; &:hover { background: lighten($dark_grey, 10%); }