From bbb69c6bf2dce7d34baed7a82c86b3d0ecc4cfbb Mon Sep 17 00:00:00 2001 From: Tomas Kikutis Date: Tue, 15 Jan 2019 13:42:51 +0100 Subject: [PATCH] Subject matter expert review (SDFID-513) (#2733) --- .../directives/AuthoringDirective.js | 4 +- .../directives/AuthoringTopbarDirective.ts | 7 +- .../services/AuthoringWorkspaceService.js | 22 + scripts/apps/authoring/styles/authoring.scss | 16 +- .../versioning/versions/versions.scss | 2 +- .../authoring/views/authoring-topbar.html | 8 +- .../authoring/widgets/widgets-article.scss | 6 +- scripts/apps/authoring/widgets/widgets.ts | 24 +- scripts/apps/dashboard/styles/widgets.scss | 2 +- .../controllers/MonitoringController.ts | 10 - scripts/apps/monitoring/controllers/index.ts | 1 - ...{MonitoringGroup.js => MonitoringGroup.ts} | 261 +++++++---- .../monitoring/directives/MonitoringView.js | 8 + scripts/apps/monitoring/index.ts | 3 +- .../apps/monitoring/styles/monitoring.scss | 29 +- .../monitoring/views/monitoring-group.html | 8 +- .../monitoring/views/monitoring-view.html | 404 +++++++++--------- scripts/apps/packaging/styles/packaging.scss | 2 +- scripts/apps/search/components/Item.tsx | 6 +- scripts/apps/search/components/ItemList.tsx | 16 +- .../apps/search/components/ListTypeIcon.tsx | 8 +- scripts/apps/search/directives/ItemList.js | 4 + scripts/apps/search/helpers.js | 1 - scripts/apps/settings/styles/settings.scss | 2 +- scripts/apps/users/styles/users.scss | 2 +- scripts/core/helpers/for-extensions.ts | 15 + scripts/core/menu/styles/menu.scss | 15 + scripts/core/services/preferences.spec.ts | 4 - styles/sass/layouts.scss | 22 +- styles/sass/media-archive.scss | 22 +- styles/sass/sf-additional.scss | 83 ---- styles/sass/variables/_dimensions.scss | 6 +- 32 files changed, 568 insertions(+), 455 deletions(-) rename scripts/apps/monitoring/directives/{MonitoringGroup.js => MonitoringGroup.ts} (68%) create mode 100644 scripts/core/helpers/for-extensions.ts diff --git a/scripts/apps/authoring/authoring/directives/AuthoringDirective.js b/scripts/apps/authoring/authoring/directives/AuthoringDirective.js index c5d87d0d5a..785625f771 100644 --- a/scripts/apps/authoring/authoring/directives/AuthoringDirective.js +++ b/scripts/apps/authoring/authoring/directives/AuthoringDirective.js @@ -682,7 +682,9 @@ export function AuthoringDirective(superdesk, superdeskFlags, authoringWorkspace */ $scope.close = function() { _closing = true; - authoring.close($scope.item, $scope.origItem, $scope.save_enabled()).then(() => { + + // returned promise used by superdesk-fi + return authoring.close($scope.item, $scope.origItem, $scope.save_enabled()).then(() => { authoringWorkspace.close(true); }); }; diff --git a/scripts/apps/authoring/authoring/directives/AuthoringTopbarDirective.ts b/scripts/apps/authoring/authoring/directives/AuthoringTopbarDirective.ts index 4f2f1e0fe4..5fa1dcf40f 100644 --- a/scripts/apps/authoring/authoring/directives/AuthoringTopbarDirective.ts +++ b/scripts/apps/authoring/authoring/directives/AuthoringTopbarDirective.ts @@ -7,11 +7,14 @@ * * @description Generates authoring subnav bar */ -AuthoringTopbarDirective.$inject = ['TranslationService', 'privileges']; -export function AuthoringTopbarDirective(TranslationService, privileges) { +AuthoringTopbarDirective.$inject = ['TranslationService', 'privileges', 'authoringWorkspace']; +export function AuthoringTopbarDirective(TranslationService, privileges, authoringWorkspace) { return { templateUrl: 'scripts/apps/authoring/views/authoring-topbar.html', link: function(scope) { + scope.additionalButtons = authoringWorkspace.authoringTopBarAdditionalButtons; + scope.buttonsToHide = authoringWorkspace.authoringTopBarButtonsToHide; + scope.saveDisabled = false; scope.userHasPrivileges = privileges.userHasPrivileges; diff --git a/scripts/apps/authoring/authoring/services/AuthoringWorkspaceService.js b/scripts/apps/authoring/authoring/services/AuthoringWorkspaceService.js index 7c76f41762..423dd87352 100644 --- a/scripts/apps/authoring/authoring/services/AuthoringWorkspaceService.js +++ b/scripts/apps/authoring/authoring/services/AuthoringWorkspaceService.js @@ -23,6 +23,24 @@ export function AuthoringWorkspaceService($location, superdeskFlags, authoring, this.action = null; this.state = null; + // Array<() => Promise> + let widgetVisibilityCheckerFuntions = []; + + this.addWidgetVisibilityCheckerFunction = (fn) => { + widgetVisibilityCheckerFuntions.push(fn); + }; + + this.removeWidgetVisibilityCheckerFunction = (fn) => { + widgetVisibilityCheckerFuntions = widgetVisibilityCheckerFuntions.filter((f) => f !== fn); + }; + + this.isWidgetVisible = (widget) => new Promise((resolve) => { + Promise.all(widgetVisibilityCheckerFuntions.map((fn) => fn(widget))) + .then((res) => { + resolve(resolve(res.every((i) => i === true))); + }); + }); + var self = this; /** @@ -48,6 +66,10 @@ export function AuthoringWorkspaceService($location, superdeskFlags, authoring, } }; + // plugin support + this.authoringTopBarAdditionalButtons = {}, + this.authoringTopBarButtonsToHide = {}; + /** * Open an item in readonly mode without locking it * diff --git a/scripts/apps/authoring/styles/authoring.scss b/scripts/apps/authoring/styles/authoring.scss index fc5b269b33..ba876bd7b3 100644 --- a/scripts/apps/authoring/styles/authoring.scss +++ b/scripts/apps/authoring/styles/authoring.scss @@ -33,10 +33,6 @@ right: 0; left: 0; box-sizing: border-box; - - .sd-widget.versions .article-versions { - bottom: 0; - } } .page-content-container { @@ -157,12 +153,16 @@ .page-content-container { position: absolute; top:0; + bottom: 0; left: $tablist-width + $article-tabpane-padding; right: $tablist-width + $article-tabpane-padding; - bottom: 30px; overflow-y: auto; } +.workqueue .page-content-container { + bottom: 30px; +} + // Medium editor // ------------------------------------------------- @@ -324,12 +324,6 @@ } } -.scratchpad-open { - .opened-articles { - bottom: $scratchpad-closed + $scratchpad-content-height; - } -} - // Article dashboard diff --git a/scripts/apps/authoring/versioning/versions/versions.scss b/scripts/apps/authoring/versioning/versions/versions.scss index bfbefa8ac0..69473f5751 100644 --- a/scripts/apps/authoring/versioning/versions/versions.scss +++ b/scripts/apps/authoring/versioning/versions/versions.scss @@ -15,7 +15,7 @@ position: absolute; left: 0; top:50px; right: 0; overflow: auto; - bottom: $authoring-opened-articles + $scratchpad-closed; + bottom: 0; .versions-list { padding: 12px; diff --git a/scripts/apps/authoring/views/authoring-topbar.html b/scripts/apps/authoring/views/authoring-topbar.html index 41c1c53b49..95259045ee 100644 --- a/scripts/apps/authoring/views/authoring-topbar.html +++ b/scripts/apps/authoring/views/authoring-topbar.html @@ -160,18 +160,20 @@ ng-if="action === 'correct' || action === 'kill'" ng-click="close()" translate>Cancel + + diff --git a/scripts/apps/monitoring/views/monitoring-view.html b/scripts/apps/monitoring/views/monitoring-view.html index 662cd71d5c..a010ae76fb 100644 --- a/scripts/apps/monitoring/views/monitoring-view.html +++ b/scripts/apps/monitoring/views/monitoring-view.html @@ -1,204 +1,224 @@
-
- -
-
- -
-
-
-
-
- -
-
-
+
+
+ -
-
-
-
-
-
-
-
-
-
-
+ +
-
-
+ +
+ +
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
diff --git a/scripts/apps/packaging/styles/packaging.scss b/scripts/apps/packaging/styles/packaging.scss index a85a10257b..6431292127 100644 --- a/scripts/apps/packaging/styles/packaging.scss +++ b/scripts/apps/packaging/styles/packaging.scss @@ -146,7 +146,7 @@ border: 1px solid #ebebeb; border-width: 0 1px; background: #fcfcfc; - padding: 30px 60px $scratchpad-closed + 20px; + padding: 30px 60px 20px; @include border-box(); overflow: auto; } diff --git a/scripts/apps/search/components/Item.tsx b/scripts/apps/search/components/Item.tsx index d3add2f74e..47c94f0498 100644 --- a/scripts/apps/search/components/Item.tsx +++ b/scripts/apps/search/components/Item.tsx @@ -178,7 +178,7 @@ export class Item extends React.Component { } const getActionsMenu = () => - !get(scope, 'flags.hideActions') && this.state.hover && !item.gone ? React.createElement( + this.props.hideActions !== true && this.state.hover && !item.gone ? React.createElement( ActionsMenu, { item: item, svc: this.props.svc, @@ -243,6 +243,7 @@ export class Item extends React.Component { onMultiSelect: this.props.onMultiSelect, swimlane: this.props.swimlane, svc: this.props.svc, + selectingDisabled: this.props.multiSelectDisabled, }), item.priority || item.urgency ? React.createElement(ListPriority, { item: item, @@ -273,6 +274,7 @@ export class Item extends React.Component { key: item._id, className: classNames( 'list-item-view', + {'actions-visible': this.props.hideActions !== true}, {active: this.props.flags.selected}, {selected: this.props.item.selected && !this.props.flags.selected}, ), @@ -306,4 +308,6 @@ Item.propTypes = { onEdit: PropTypes.any, onSelect: PropTypes.any, narrow: PropTypes.any, + hideActions: PropTypes.bool, + multiSelectDisabled: PropTypes.bool, }; diff --git a/scripts/apps/search/components/ItemList.tsx b/scripts/apps/search/components/ItemList.tsx index d318d9697e..c4853bcfd7 100644 --- a/scripts/apps/search/components/ItemList.tsx +++ b/scripts/apps/search/components/ItemList.tsx @@ -1,4 +1,4 @@ -import _ from 'lodash'; +import _, {get} from 'lodash'; import React from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; @@ -85,6 +85,11 @@ export class ItemList extends React.Component { } select(item, event?) { + if (typeof this.props.onMonitoringItemSelect === 'function') { + this.props.onMonitoringItemSelect(item, event); + return; + } + const {$timeout} = this.props.svc; const {scope} = this.props; @@ -194,6 +199,11 @@ export class ItemList extends React.Component { } dbClick(item) { + if (typeof this.props.onMonitoringItemDoubleClick === 'function') { + this.props.onMonitoringItemDoubleClick(item); + return; + } + const {superdesk, $timeout, authoringWorkspace} = this.props.svc; const {scope} = this.props; @@ -460,6 +470,8 @@ export class ItemList extends React.Component { versioncreator: this.modifiedUserName(item.version_creator), narrow: this.state.narrow, svc: this.props.svc, + hideActions: scope.hideActionsForMonitoringItems || get(scope, 'flags.hideActions'), + multiSelectDisabled: scope.disableMonitoringMultiSelect, scope: scope, }); }.bind(this); @@ -495,4 +507,6 @@ ItemList.propTypes = { desksById: PropTypes.any, ingestProvidersById: PropTypes.any, usersById: PropTypes.any, + onMonitoringItemSelect: PropTypes.func, + onMonitoringItemDoubleClick: PropTypes.func, }; diff --git a/scripts/apps/search/components/ListTypeIcon.tsx b/scripts/apps/search/components/ListTypeIcon.tsx index 0982782243..abfba89f32 100644 --- a/scripts/apps/search/components/ListTypeIcon.tsx +++ b/scripts/apps/search/components/ListTypeIcon.tsx @@ -26,14 +26,15 @@ export class ListTypeIcon extends React.Component { } render() { - const showSelect = this.state.hover || this.props.item.selected; + const {selectingDisabled} = this.props; + const showSelect = selectingDisabled !== true && (this.state.hover || this.props.item.selected); return React.createElement( 'div', { className: classNames('list-field type-icon sd-monitoring-item-multi-select-checkbox'), - onMouseEnter: this.setHover, - onMouseLeave: this.unsetHover, + onMouseEnter: selectingDisabled ? null : this.setHover, + onMouseLeave: selectingDisabled ? null : this.unsetHover, }, showSelect ? React.createElement(SelectBox, { @@ -56,4 +57,5 @@ ListTypeIcon.propTypes = { svc: PropTypes.object.isRequired, onMultiSelect: PropTypes.func, item: PropTypes.any, + selectingDisabled: PropTypes.bool, }; diff --git a/scripts/apps/search/directives/ItemList.js b/scripts/apps/search/directives/ItemList.js index 4304b18b5e..c2c4de2f53 100644 --- a/scripts/apps/search/directives/ItemList.js +++ b/scripts/apps/search/directives/ItemList.js @@ -161,6 +161,10 @@ export function ItemList( angular.extend({ svc: services, scope: scope, + hideActionsForMonitoringItems: scope.hideActionsForMonitoringItems, + onMonitoringItemSelect: scope.onMonitoringItemSelect, + onMonitoringItemDoubleClick: scope.onMonitoringItemDoubleClick, + disableMonitoringMultiSelect: scope.disableMonitoringMultiSelect, }, monitoringState.state)); var listComponent = ReactDOM.render(itemList, elem[0]); diff --git a/scripts/apps/search/helpers.js b/scripts/apps/search/helpers.js index 83138e2bc1..9f777ccd30 100644 --- a/scripts/apps/search/helpers.js +++ b/scripts/apps/search/helpers.js @@ -147,7 +147,6 @@ export function renderArea(area, itemProps, props, customRender = {}) { return fields[field](itemProps); } - console.warn('missing field in list: ' + field); return null; }).filter(angular.identity); var elemProps = angular.extend({key: area}, props); diff --git a/scripts/apps/settings/styles/settings.scss b/scripts/apps/settings/styles/settings.scss index 9e79546fa7..4da8bbec00 100644 --- a/scripts/apps/settings/styles/settings.scss +++ b/scripts/apps/settings/styles/settings.scss @@ -82,7 +82,7 @@ padding: 0 0 0 10px; } .content { - padding-bottom: $scratchpad-closed + 20; + padding-bottom: 20px; } } } diff --git a/scripts/apps/users/styles/users.scss b/scripts/apps/users/styles/users.scss index 5333317745..5b6603bedd 100644 --- a/scripts/apps/users/styles/users.scss +++ b/scripts/apps/users/styles/users.scss @@ -407,7 +407,7 @@ Profile page styles left: 0px; right: 0; top: 0; - bottom: $scratchpad-closed + 20; + bottom: 20px; padding: 10px 30px 0; background-color: $background-main; overflow-x: hidden; diff --git a/scripts/core/helpers/for-extensions.ts b/scripts/core/helpers/for-extensions.ts new file mode 100644 index 0000000000..88b992274c --- /dev/null +++ b/scripts/core/helpers/for-extensions.ts @@ -0,0 +1,15 @@ +export const hideSideMenu = () => { + document.body.classList.add('side-menu-hidden'); +}; + +export const unhideSideMenu = () => { + document.body.classList.remove('side-menu-hidden'); +}; + +export const hideTopMenu = () => { + document.body.classList.add('top-menu-hidden'); +}; + +export const unhideTopMenu = () => { + document.body.classList.remove('top-menu-hidden'); +}; diff --git a/scripts/core/menu/styles/menu.scss b/scripts/core/menu/styles/menu.scss index 658318d32f..0eff4bb442 100644 --- a/scripts/core/menu/styles/menu.scss +++ b/scripts/core/menu/styles/menu.scss @@ -418,6 +418,21 @@ } } } + +.side-menu-hidden { + #side-menu { + display: none; + } + + #main-container.hideMonitoring #authoring-container { + width: 100%!important; + } + + #workspace-container { + left: 0; + } +} + .sd-sidetab-menu, .sd-sidebar-menu { top: 0; diff --git a/scripts/core/services/preferences.spec.ts b/scripts/core/services/preferences.spec.ts index 6d0931169a..c60c735823 100644 --- a/scripts/core/services/preferences.spec.ts +++ b/scripts/core/services/preferences.spec.ts @@ -36,10 +36,6 @@ describe('Preferences Service', () => { session_preferences: { 'desk:items': [], 'pinned:items': [], - 'scratchpad:items': [ - '/archive/urn:newsml:a0cca6c9-fe94-46ed-9ce7-aab9361ff6b8', - '/archive/urn:newsml:a0cca6c9-fe94-46ed-9ce7-aab9361ff6b8', - ], }, }; diff --git a/styles/sass/layouts.scss b/styles/sass/layouts.scss index 66c3f18e8e..62d8891da7 100644 --- a/styles/sass/layouts.scss +++ b/styles/sass/layouts.scss @@ -39,6 +39,25 @@ a:hover { // Layouts // -------------------------------------------- +.top-menu-hidden { + #top-menu { + display: none; + } + + .monitoring { + top: 0; + } + + .subnav--authoring { + top: 0; + } + + .main-section { + // excludes $subnav-height + top: $topspace; + } +} + // main container // ------------------------------------ #main-container { @@ -135,7 +154,6 @@ a:hover { margin:0; padding:0; z-index:1; - padding-bottom:35px !important; /* because of scratchpad*/ &.with-subnav { .preview-layout { top : $nav-height; @@ -157,7 +175,6 @@ a:hover { margin:0; padding:0; z-index:1; - padding-bottom:35px !important; /* because of scratchpad*/ &.with-subnav { .preview-layout { top : $nav-height; @@ -656,7 +673,6 @@ $slide-pane-width: 400px; } .tabcontent { padding:$tabcontent-padding; - padding-bottom: $tabcontent-padding + 30px; //because of scratchpad @include box-sizing(border-box); position: absolute; bottom: 0; diff --git a/styles/sass/media-archive.scss b/styles/sass/media-archive.scss index 3f46df4aca..09fa3d976b 100644 --- a/styles/sass/media-archive.scss +++ b/styles/sass/media-archive.scss @@ -438,7 +438,7 @@ $sfbox_mediaMaxWidth : 172px; } } -.mgrid-view, #scratchpad { +.mgrid-view { .media-box { .action { display: none; @@ -666,15 +666,6 @@ $sfbox_mediaMaxWidth : 172px; margin: 0; } -#scratchpad { - .media-box { - border-color: #aaa; - &.archived { - @include box-shadow(none); - } - } -} - .sd-grid-list { .sd-grid-item { height: 100%; @@ -720,6 +711,11 @@ $rightfield-width:60px; width: 100%; } } + .actions-visible .media-box:hover { + .item-info { + padding: 10px 30px 10px 10px; + } + } .media-box { position: relative; background: #fff; @@ -727,6 +723,7 @@ $rightfield-width:60px; border-right: 2px solid #fff; padding-left: 40px; overflow: hidden; + &:hover { background-color: #f4f4f4 !important; border-right: 2px solid #f4f4f4; @@ -734,9 +731,6 @@ $rightfield-width:60px; .list-field { border-color:#ebebeb; } - .item-info { - padding: 10px 30px 10px 10px; - } .item-info-reduced-rowheight { padding: 5px 10px 5px 10px; } @@ -1138,7 +1132,7 @@ $rightfield-width:60px; } } -.mgrid-view, #scratchpad { +.mgrid-view { .active:not(.selected) { .media-box { border-color: #787878; diff --git a/styles/sass/sf-additional.scss b/styles/sass/sf-additional.scss index 99f4eb85c5..2d59c2bd84 100644 --- a/styles/sass/sf-additional.scss +++ b/styles/sass/sf-additional.scss @@ -1631,89 +1631,6 @@ } } - -// Scratchpad -// --------------------------------------------- - -#scratchpad { - position:fixed; - left:0; right:0; bottom:0px; - z-index: 1020; - @include transition(all ease 0.3s); - &.left { - left: $sf-main-menu-width !important; - } - .header { - height:$scratchpad-closed; - background: #585858; - line-height:$scratchpad-closed; - font-size:12px; - } - .title { - padding: 0 20px; - @include text-extrabold(); - color:#b7b7b7; - border-right:1px solid #747474; - float:left; - } - .info { - padding:0 20px; - @include text-normal(); - color:#ffffff; - float:left; - } - - .trigger { - border: 0; - background: none; - margin-top: 10px; - margin-right: 10px; - } - - &.opened { - .trigger i { - @include rotate(0); - } - } - - .content { - @include box-sizing(border-box); - height:$scratchpad-content-height; - background-color:rgb(195,195,195); - background-color:rgba(195,195,195,0.8); - padding:10px 5px; - overflow:hidden; - .media-box { - margin: 1px 1px 6px 12px; - } - } - - .scratchpad-items { - display: block; - width: 100%; - white-space: nowrap; - overflow-x: auto; - - &::-webkit-scrollbar { - background: #eee; - &:hover { - background: #fff; - } - } - &::-webkit-scrollbar-thumb { - background: #666; - &:hover { - background: #333; - } - } - - > div { - float: none !important; - } - } -} - - // Scroll shadow // --------------------------------------------- diff --git a/styles/sass/variables/_dimensions.scss b/styles/sass/variables/_dimensions.scss index 178dd263d1..db1ec90611 100644 --- a/styles/sass/variables/_dimensions.scss +++ b/styles/sass/variables/_dimensions.scss @@ -32,15 +32,11 @@ $sidebar-width: 48px; $sidepreview-width: 400px; $notification-pane-width: 300px; -// Scratchpad -$scratchpad-closed: 0px; -$scratchpad-content-height: 0px; - // Article edit screen $authoring-opened-articles: 30px; //Layout -$bottom-view-padding: $scratchpad-closed + $authoring-opened-articles + 20px; +$bottom-view-padding: $authoring-opened-articles + 20px; //Archive $archive-sidebar-width: 300px;