diff options
author | Bernhard Posselt <dev@bernhard-posselt.com> | 2014-08-27 18:52:13 +0200 |
---|---|---|
committer | Bernhard Posselt <dev@bernhard-posselt.com> | 2014-08-27 18:52:13 +0200 |
commit | c7c2bf214c9cf6bde0c563ee68ffb5b61ed9734e (patch) | |
tree | 0d53bd6049bf05a5ddfae4957d950c124c791679 | |
parent | 924d8b5d63813a833db3ba86acb438fc7c456bc4 (diff) |
editing
-rw-r--r-- | css/navigation.css | 108 | ||||
-rw-r--r-- | js/app/Run.js | 1 | ||||
-rw-r--r-- | js/build/app.js | 40 | ||||
-rw-r--r-- | js/directive/AppNavigationEntryUtils.js | 38 | ||||
-rw-r--r-- | js/directive/NewsAutoFocus.js | 6 | ||||
-rw-r--r-- | js/directive/NewsFocus.js | 4 | ||||
-rw-r--r-- | js/tests/unit/controller/NavigationControllerSpec.js | 2 | ||||
-rw-r--r-- | templates/part.addnew.php | 1 | ||||
-rw-r--r-- | templates/part.feed.unread.php | 2 | ||||
-rw-r--r-- | templates/part.listfeed.php | 84 |
10 files changed, 118 insertions, 168 deletions
diff --git a/css/navigation.css b/css/navigation.css index de0b39c9f..e19e6a594 100644 --- a/css/navigation.css +++ b/css/navigation.css @@ -117,118 +117,14 @@ padding-right: 0px; } -.folder { +#app-navigation .folder { text-transform: uppercase; } -.feed { +#app-navigation .feed { text-transform: none; } -#app-navigation li:hover > .utils { - display: block; -} - -#app-navigation li:hover > .utils .unread-counter { - padding-left: 0; -} - #app-navigation .folder-input { text-transform: uppercase; } - -.rename-feed input { - margin: 1px 0 0px 5px; - border-right: 1px solid #ddd; - border-radius: 2px; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - border-right: 0; - width: 208px; - height: 32px; -} - -.rename-feed button { - margin: 5px 0 5px 0; - display: inline-block; - border-bottom-left-radius: 0; - border-top-left-radius: 0; - width: 30px !important; - height: 30px !important; - padding: 0.6em; -} - -.rename-feed .action-button { - background-position: center; - background-repeat: no-repeat; -} - -.rename-feed .back-button { - border-radius: 3px; - background-image: url('../img/delete.svg'); -} - -.rename-feed .create-button { - border-radius: 0; - background-image: url('../img/mark_read.svg'); -} - -.rss-icon { - background-image: url('../img/rss.svg'); -} - -#app-navigation .ui-draggable-dragging { - width: 100%; -} - -#app-navigation .multiselect { - height:20px; -} - -#app-navigation .progress-icon, -#app-navigation .problem-icon { - width: 299px; - line-height: 44px; -} - -.progress-icon { - background-image: url('../img/loading.gif'); -} - -.problem-icon { - background-image: url('../img/problem.svg') !important; -} - -.failed { - background-color: #F2FF63 !important; - text-shadow: none !important; - font-weight: bold; -} - - .failed .title { - background-color: #F2FF63 !important; - width: 299px !important; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - display: inline-block !important; - } - - .failed a:hover, - .failed:hover a { - background-color: #F2FF63 !important; - } - - .failed .message { - font-weight: normal; - padding: 5px 20px 5px 32px; - } - - .folder .feed.failed .message { - padding-left: 48px; - } - -.tooltip { - text-shadow: none; - text-transform: none; -}
\ No newline at end of file diff --git a/js/app/Run.js b/js/app/Run.js index 44c01a5e5..9b068910c 100644 --- a/js/app/Run.js +++ b/js/app/Run.js @@ -105,4 +105,5 @@ app.run(($rootScope, $location, $http, $q, $interval, Loading, ItemResource, $rootScope.$on('$routeChangeError', () => { $location.path('/items'); }); + });
\ No newline at end of file diff --git a/js/build/app.js b/js/build/app.js index a3a749132..c718e3c2c 100644 --- a/js/build/app.js +++ b/js/build/app.js @@ -1536,6 +1536,35 @@ var $__build_47_app__ = function () { writable: true }), $__2; }; + app.run([ + '$document', + '$rootScope', + function ($document, $rootScope) { + 'use strict'; + $document.click(function (event) { + $rootScope.$broadcast('documentClicked', event); + }); + } + ]); + app.directive('appNavigationEntryUtils', function () { + 'use strict'; + return { + restrict: 'C', + link: function (scope, elm) { + var menu = elm.siblings('.app-navigation-entry-menu'); + menu.hide(); + var button = $(elm).find('.app-navigation-entry-utils-menu-button button'); + button.click(function () { + menu.toggle(); + }); + scope.$on('documentClicked', function (scope, event) { + if (event.target !== button[0]) { + menu.hide(); + } + }); + } + }; + }); app.directive('newsAudio', function () { 'use strict'; return { @@ -1563,7 +1592,11 @@ var $__build_47_app__ = function () { app.directive('newsAutoFocus', function () { 'use strict'; return function (scope, elem, attrs) { - $(attrs.newsAutofocus).focus(); + if (attrs.newsAutofocus) { + $(attrs.newsAutofocus).focus(); + } else { + elem.focus(); + } }; }); app.directive('newsBindHtmlUnsafe', function () { @@ -1610,11 +1643,12 @@ var $__build_47_app__ = function () { ]); app.directive('newsFocus', [ '$timeout', - function ($timeout) { + '$interpolate', + function ($timeout, $interpolate) { 'use strict'; return function (scope, elem, attrs) { elem.click(function () { - var toReadd = $(attrs.newsFocus); + var toReadd = $($interpolate(attrs.newsFocus)(scope)); $timeout(function () { toReadd.focus(); }, 500); diff --git a/js/directive/AppNavigationEntryUtils.js b/js/directive/AppNavigationEntryUtils.js new file mode 100644 index 000000000..8deb09b61 --- /dev/null +++ b/js/directive/AppNavigationEntryUtils.js @@ -0,0 +1,38 @@ +/** + * ownCloud - News + * + * This file is licensed under the Affero General Public License version 3 or + * later. See the COPYING file. + * + * @author Bernhard Posselt <dev@bernhard-posselt.com> + * @copyright Bernhard Posselt 2014 + */ +app.run(($document, $rootScope) => { + 'use strict'; + $document.click((event) => { + $rootScope.$broadcast('documentClicked', event); + }); +}); + +app.directive('appNavigationEntryUtils', () => { + 'use strict'; + return { + restrict: 'C', + link: (scope, elm) => { + let menu = elm.siblings('.app-navigation-entry-menu'); + menu.hide(); + let button = $(elm) + .find('.app-navigation-entry-utils-menu-button button'); + + button.click(() => { + menu.toggle(); + }); + + scope.$on('documentClicked', (scope, event) => { + if (event.target !== button[0]) { + menu.hide(); + } + }); + } + }; +});
\ No newline at end of file diff --git a/js/directive/NewsAutoFocus.js b/js/directive/NewsAutoFocus.js index a66f4453c..e66f7b3bf 100644 --- a/js/directive/NewsAutoFocus.js +++ b/js/directive/NewsAutoFocus.js @@ -11,7 +11,11 @@ app.directive('newsAutoFocus', () => { 'use strict'; return (scope, elem, attrs) => { - $(attrs.newsAutofocus).focus(); + if (attrs.newsAutofocus) { + $(attrs.newsAutofocus).focus(); + } else { + elem.focus(); + } }; });
\ No newline at end of file diff --git a/js/directive/NewsFocus.js b/js/directive/NewsFocus.js index 3ab2a85aa..f5133fd20 100644 --- a/js/directive/NewsFocus.js +++ b/js/directive/NewsFocus.js @@ -7,12 +7,12 @@ * @author Bernhard Posselt <dev@bernhard-posselt.com> * @copyright Bernhard Posselt 2014 */ -app.directive('newsFocus', ($timeout) => { +app.directive('newsFocus', ($timeout, $interpolate) => { 'use strict'; return (scope, elem, attrs) => { elem.click(() => { - let toReadd = $(attrs.newsFocus); + let toReadd = $($interpolate(attrs.newsFocus)(scope)); $timeout(() => { toReadd.focus(); }, 500); diff --git a/js/tests/unit/controller/NavigationControllerSpec.js b/js/tests/unit/controller/NavigationControllerSpec.js index 6837160bf..1cfbb4012 100644 --- a/js/tests/unit/controller/NavigationControllerSpec.js +++ b/js/tests/unit/controller/NavigationControllerSpec.js @@ -278,4 +278,6 @@ describe('NavigationController', () => { expect(ctrl.isFolderActive(3)).toBe(true); })); + + }); diff --git a/templates/part.addnew.php b/templates/part.addnew.php index 6afc0f40f..5bc48b23d 100644 --- a/templates/part.addnew.php +++ b/templates/part.addnew.php @@ -34,6 +34,7 @@ ng-model="folderName" placeholder="<?php p($l->t('Folder-Name')); ?>" name="folderName" + class="folder-input" ng-if="Navigation.newFolder"> <button class="icon-checkmark add-new-folder-primary" title="<?php p($l->t('Create folder')); ?>" diff --git a/templates/part.feed.unread.php b/templates/part.feed.unread.php index f572f1d43..bef1cf6b7 100644 --- a/templates/part.feed.unread.php +++ b/templates/part.feed.unread.php @@ -21,7 +21,7 @@ </ul> </div> - <div class="app-navigation-entry-menu" ng-class="{'app-navigation-entry-menu-open': optionsId == 'all'}"> + <div class="app-navigation-entry-menu"> <ul> <li><button class="icon-checkmark" title="<?php p($l->t('Read all')); ?>" ng-click="Navigation.markRead()"></button></li> </ul> diff --git a/templates/part.listfeed.php b/templates/part.listfeed.php index 1c5cc3bc3..3673c4958 100644 --- a/templates/part.listfeed.php +++ b/templates/part.listfeed.php @@ -20,82 +20,56 @@ revert: true }"> - <div ng-if="feed.editing" class="rename-feed"> - <input type="text" ng-model="feed.title" autofocus> - <button title="<?php p($l->t('Cancel')); ?>" - ng-click="cancelRenameFeed(feed.id)" - class="action-button back-button action"></button> - <button title="<?php p($l->t('Save')); ?>" - ng-click="Navigation.renameFeed(feed.id, feed.title)" - class="action-button create-button action"> - </button> - </div> - <a ng-style="{ backgroundImage: 'url(' + feed.faviconLink + ')'}" ng-class="{ 'progress-icon': !feed.id, 'problem-icon': feed.error }" - ng-hide="feed.editing" + ng-if="!feed.editing" ng-href="#/items/feeds/{{ feed.id }}/" - class="title icon-loading" + class="title icon-loading" title="{{ feed.title }}"> - {{ feed.title }} </a> - <div class="app-navigation-entry-utils"> + <div ng-if="feed.editing" class="app-navigation-entry-edit"> + <input name="feedRename" type="text" value="{{ feed.title }}" news-auto-focus> + <button title="<?php p($l->t('Cancel')); ?>" + ng-click="feed.editing=false" + class="action icon-close"></button> + <button title="<?php p($l->t('Rename')); ?>" + ng-click="Navigation.renameFeed(feed.id, feed.title)" + class="action icon-checkmark"> + </button> + </div> + + <div class="app-navigation-entry-utils" + ng-show="feed.id && !feed.editing && !feed.error"> <ul> <li class="app-navigation-entry-utils-counter" - ng-show="feed.id && Navigation.getUnreadCount(feed.id) > 0 && !feed.error && !feed.editing"> + ng-show="feed.id && Navigation.getUnreadCount(feed.id) > 0"> {{ Navigation.getFeedUnreadCount(feed.id) | unreadCountFormatter }} </li> - <li class="app-navigation-entry-utils-menu-button"><button ng-click="optionsId = (optionsId == feed.id ? -1 : feed.id)"></button></li> + <li class="app-navigation-entry-utils-menu-button"> + <button ng-click="App.toggleMenu('f' + feed.id)"></button> + </li> </ul> </div> - <div class="app-navigation-entry-menu" ng-class="{'app-navigation-entry-menu-open': optionsId == feed.id}"> + <div class="app-navigation-entry-menu"> <ul> - <li><button class="icon-rename" title="<?php p($l->t('Rename feed')); ?>"></button></li> - <li><button class="icon-delete" title="<?php p($l->t('Delete website')); ?>"></button></li> - <li><button class="icon-checkmark" title="<?php p($l->t('Read all')); ?>"></button></li> + <li><button ng-click="feed.editing=true" + class="icon-rename" + title="<?php p($l->t('Rename feed')); ?>"></button></li> + <li><button ng-click="Navigation.deleteFeed(feed.url)" + class="icon-delete" + title="<?php p($l->t('Delete website')); ?>"></button></li> + <li><button ng-show="Navigation.getUnreadCount(feed.id) > 0" + class="icon-checkmark" + title="<?php p($l->t('Read all')); ?>"></button></li> </ul> </div> - <!--<span class="utils"> - <span class="unread-counter" - > - - </span>--> - <!--<button ng-click="Navigation.deleteFeed(feed.id)" - class="svg action delete-icon delete-button" - title="<?php p($l->t('Delete website')); ?>" - ng-show="feed.id && !feed.editing && !feed.error" - oc-tooltip></button>--> - - - <!-- - <button class="svg action mark-read-icon" - ng-show="Navigation.getUnreadCount(feed.id) > 0 && feed.id && !feed.error && !feed.editing" - ng-click="Navigation.markRead(feed.id)" - title="<?php p($l->t('Mark read')); ?>" - oc-tooltip></button> - - - <button class="svg action rename-feed-icon" - ng-hide="feed.editing || feed.error" - ng-click="edit(feed)" - title="<?php p($l->t('Rename feed')); ?>" - oc-tooltip></button> - - <button class="svg action delete-icon" - ng-click="Navigation.markErrorRead(feed.url)" - title="<?php p($l->t('Delete website')); ?>" - ng-show="feed.error" - oc-tooltip></button> - </span> - --> - <div class="message" ng-show="feed.error">{{ feed.error }}</div> </li> |