Merge branch 'master' of github.com:superdesk/superdesk-client-core

superdesk · Jan 18, 2019 · 9550c23 · 9550c23
2 parents f358e9e + 2286464
commit 9550c23
Show file tree

Hide file tree

Showing 9 changed files with 127 additions and 3 deletions.
diff --git a/scripts/apps/archive/views/preview.html b/scripts/apps/archive/views/preview.html
@@ -130,11 +130,17 @@
 
             <div class="text sign-off" ng-show="selected.preview.sign_off" sd-html-preview="selected.preview.sign_off"></div>
 
-            <!-- custom date and text fields -->
+            <!-- custom date, text and url fields -->
             <div ng-repeat="field in fields track by field._id" order="{{editor[field._id].order}}"
-              ng-if="selected.preview.extra[field._id] && (field.field_type === 'text' || field.field_type === 'date')">
+              ng-if="selected.preview.extra[field._id] && (field.field_type === 'text' || field.field_type === 'date' || field.field_type === 'urls')">
+
               <div class="text body-text" sd-short-date ng-if="field.field_type === 'date'" data-date="selected.preview.extra[field._id]"></div>
+
               <div class="text body-text" ng-if="field.field_type === 'text'" sd-html-preview="selected.preview.extra[field._id]"></div>
+
+              <ul class="text body-text" ng-if="field.field_type === 'urls'">
+                <li ng-repeat="url in selected.preview.extra[field._id] track by $index">{{url}}</li>
+              </ul>
             </div>
 
             <div class="composite-preview" ng-if="selected.preview.type === 'composite'">

diff --git a/scripts/apps/authoring/authoring/article-url-fields.tsx b/scripts/apps/authoring/authoring/article-url-fields.tsx
@@ -0,0 +1,82 @@
+import React from 'react';
+
+interface IProps {
+    label: string;
+    urls: Array<string>;
+    helperText: string;
+    fieldId: string;
+    onChange: (fieldId: string, urls: Array<string>) => void;
+}
+
+interface IState {
+    urls: Array<string>;
+}
+
+export class ArticleUrlFields extends React.Component<IProps, IState> {
+    constructor(props) {
+        super(props);
+
+        // local state is used, because onChange is debounced
+        this.state = {
+            urls: Array.isArray(props.urls) && props.urls.length > 0 ? props.urls : [],
+        };
+    }
+    removeUrl(index) {
+        this.setState({
+            urls: this.state.urls.filter((_, i) => i !== index),
+        }, () => {
+            this.props.onChange(this.props.fieldId, this.state.urls);
+        });
+    }
+    addUrl() {
+        this.setState({
+            urls: this.state.urls.concat('https://'),
+        }, () => {
+            this.props.onChange(this.props.fieldId, this.state.urls);
+        });
+    }
+    handleChange(index, event) {
+        const nextUrls = this.state.urls.map((currentValue, i) => {
+            if (i === index) {
+                return event.target.value;
+            } else {
+                return currentValue;
+            }
+        });
+
+        this.setState({
+            urls: nextUrls,
+        }, () => {
+            this.props.onChange(this.props.fieldId, this.state.urls);
+        });
+    }
+    render() {
+        const {label, helperText} = this.props;
+
+        return (
+            <div>
+                <label className="field__label">{label}</label>
+
+                {this.state.urls.map((url, i) => (
+                    <div key={i} className="space-between">
+                        <input type="text" value={url} onChange={this.handleChange.bind(this, i)} />
+                        <button type="button" onClick={() => this.removeUrl(i)}>
+                            <i className="icon-remove-sign" style={{display: 'block'}} />
+                        </button>
+                    </div>
+                ))}
+
+                <div>
+                    <button
+                        className="btn btn--primary"
+                        onClick={() => this.addUrl()}
+                        style={{marginTop: 10}}>{gettext('Add URL')}</button>
+                </div>
+
+                {
+                    helperText == null ? null : <div className="sd-editor__info-text">{helperText}</div>
+                }
+            </div>
+        );
+    }
+}
diff --git a/scripts/apps/authoring/authoring/directives/ArticleEditDirective.js b/scripts/apps/authoring/authoring/directives/ArticleEditDirective.js
@@ -63,6 +63,11 @@ export function ArticleEditDirective(
         templateUrl: 'scripts/apps/authoring/views/article-edit.html',
         link: function(scope, elem) {
             getLabelNameResolver().then((getLabelForFieldId) => {
+                scope.handleUrlsChange = function(fieldId, value) {
+                    scope.item.extra[fieldId] = value;
+                    scope.autosave(scope.item);
+                };
+
                 scope.toggleDetails = true;
                 scope.errorMessage = null;
                 scope.contentType = null;

diff --git a/scripts/apps/authoring/authoring/index.ts b/scripts/apps/authoring/authoring/index.ts
@@ -7,6 +7,8 @@ import * as filter from './filters';
 
 import '../suggest';
 import mediaModule from '../media';
+import {reactToAngular1} from 'superdesk-ui-framework';
+import {ArticleUrlFields} from './article-url-fields';
 
 angular.module('superdesk.apps.authoring.autosave', []).service('autosave', svc.AutosaveService);
 
@@ -76,6 +78,9 @@ angular.module('superdesk.apps.authoring', [
     .directive('sdRemoveTags', directive.RemoveTagsDirective)
     .directive('tansaScopeSync', directive.TansaScopeSyncDirective)
     .directive('sdItemActionByIntent', directive.ItemActionsByIntentDirective)
+    .component('sdArticleUrlFields',
+        reactToAngular1(ArticleUrlFields, ['label', 'urls', 'helperText', 'onChange', 'fieldId']),
+    )
 
     .filter('embeddedFilter', filter.EmbeddedFilter)
 

diff --git a/scripts/apps/authoring/views/article-edit.html b/scripts/apps/authoring/views/article-edit.html
@@ -674,3 +674,19 @@
 
     <div class="sd-editor__info-text" ng-if="helper_text[field._id]">{{field.helper_text}}</div>
 </div>
+
+<!-- Custom Url fields -->
+<div class="field" ng-repeat="field in fields track by field._id"
+    ng-if="field.field_type === 'urls'"
+    sd-width="{{editor[field._id].sdWidth || 'full'}}"
+    sd-validation-error="error[field._id.toLowerCase()]"
+    order="{{editor[field._id].order}}"
+    data-required="schema[field._id].required">
+
+    <sd-article-url-fields
+        label="field.display_name"
+        helper-text="helper_text[field._id]"
+        field-id="field._id"
+        urls="item.extra[field._id]"
+        on-change="handleUrlsChange"></sd-article-url-fields>
+</div>
diff --git a/scripts/apps/vocabularies/controllers/VocabularyConfigController.ts b/scripts/apps/vocabularies/controllers/VocabularyConfigController.ts
@@ -86,6 +86,7 @@ export function VocabularyConfigController($scope: IScope, $route, $routeParams,
         tab === 'vocabularies' && !fieldType || fieldType &&
         (tab === 'text-fields' && fieldType === 'text' ||
             tab === 'date-fields' && fieldType === 'date' ||
+            tab === 'urls-fields' && fieldType === 'urls' ||
             tab === 'related-content-fields' && MEDIA_TYPE_KEYS.includes(fieldType) ||
             tab === 'embed-fields' && fieldType === 'embed');
 

diff --git a/scripts/apps/vocabularies/views/settings.html b/scripts/apps/vocabularies/views/settings.html
@@ -21,6 +21,9 @@ <h2 class="sd-page__page-heading" translate>Metadata management</h2>
                 <li ng-class="{active: tab === 'related-content-fields'}">
                     <button ng-click="tab = 'related-content-fields'" translate>Related content</button>
                 </li>
+                <li ng-class="{active: tab === 'urls-fields'}">
+                    <button ng-click="tab = 'urls-fields'" translate>URLs</button>
+                </li>
             </ul>
         </div>
 

diff --git a/scripts/apps/vocabularies/views/vocabulary-config.html b/scripts/apps/vocabularies/views/vocabulary-config.html
@@ -31,6 +31,12 @@
           <i class="icon-plus-sign icon--white"></i>
           <span translate>Add New</span>
         </button>
+
+        <button class="btn btn--primary"
+          ng-click="createCustomField('urls')" ng-if="tab === 'urls-fields'">
+          <i class="icon-plus-sign icon--white"></i>
+          <span translate>Add New</span>
+        </button>
     </div>
 
     <div class="sd-page__content">

diff --git a/scripts/apps/workspace/content/services/ContentService.js b/scripts/apps/workspace/content/services/ContentService.js
@@ -320,7 +320,7 @@ export function ContentService(api, superdesk, templates, desks, packages, archi
             self._fieldsPromise = api.getAll('vocabularies', {
                 where: {
                     $or: [
-                        {field_type: {$in: ['text', 'date', 'media', 'embed']}},
+                        {field_type: {$in: ['text', 'date', 'media', 'embed', 'urls']}},
                         {service: {$exists: true}},
                     ],
                 },