#384 improve style and error messagge

demo-shell-ng2/app/components/files/files.component.html

@@ -19,6 +19,7 @@
                 [contextMenuActions]="true"
                 [contentActions]="true"
                 (error)="onNavigationError($event)"
+                (success)="resetError()"
                 (preview)="showFile($event)"
                 (folderChange)="onFolderChanged($event)">
             <!--

ng2-components/ng2-alfresco-documentlist/src/components/document-list.html

@@ -1,6 +1,7 @@
 <alfresco-document-menu-action *ngIf="contentMenuActions"
-        [currentFolderPath]="currentFolderPath"
+                               [currentFolderPath]="currentFolderPath"
-        (onSuccess)="reload()">
+                               (onSuccess)="onActionMenuSuccess($event)"
+                               (onError)="onActionMenuError($event)">
 </alfresco-document-menu-action>
 <alfresco-datatable
     [data]="data"

ng2-components/ng2-alfresco-documentlist/src/components/document-list.ts

@@ -121,6 +121,9 @@ export class DocumentList implements OnInit, AfterContentInit {
     @Output()
     preview: EventEmitter<any> = new EventEmitter();
 
+    @Output()
+    success: EventEmitter<any> = new EventEmitter();
+
     @Output()
     error: EventEmitter<any> = new EventEmitter();
 
@@ -402,4 +405,13 @@ export class DocumentList implements OnInit, AfterContentInit {
             this.executeContentAction(node, action);
         }
     }
+
+    onActionMenuError(event) {
+        this.error.emit(event);
+    }
+
+    onActionMenuSuccess(event) {
+        this.reload();
+        this.success.emit(event);
+    }
 }

ng2-components/ng2-alfresco-documentlist/src/components/document-menu-action.css

@@ -71,4 +71,15 @@
 
 .mdl-menu__item-icon {
     margin-right: 32px;
+    margin-top: 10px;
+    margin-left: 10px;
+}
+
+.mdl-menu--bottom-left {
+    width: 200px;
+}
+
+.mdl-menu__text {
+    float: right;
+    margin-right: 22px;
 }

ng2-components/ng2-alfresco-documentlist/src/components/document-menu-action.html

@@ -1,22 +1,21 @@
 <div class="container">
     <div class="action">
         <button id="actions" class="mdl-button mdl-js-button mdl-button--raised">
-            <i class="material-icons">add</i> Create...
+            <i class="material-icons">add</i> {{ 'BUTTON.ACTION_CREATE' | translate }}
         </button>
         <ul alfresco-mdl-menu class="mdl-menu--bottom-left"
             [attr.for]="'actions'">
             <li class="mdl-menu__item"
                 (click)="showDialog()" >
                 <i class="material-icons mdl-menu__item-icon">folder</i>
-                New Folder
+                <span class="mdl-menu__text">{{ 'BUTTON.ACTION_NEW_FOLDER' | translate }}</span>
             </li>
         </ul>
     </div>
-    <div>{{message}}</div>
 </div>
 
 <dialog class="mdl-dialog" #dialog>
-    <h4 class="mdl-dialog__title">New folder</h4>
+    <h4 class="mdl-dialog__title">{{ 'BUTTON.ACTION_NEW_FOLDER' | translate }}</h4>
     <div class="mdl-dialog__content">
         <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
             <input
@@ -30,7 +29,7 @@
         </div>
     </div>
     <div class="mdl-dialog__actions">
-        <button type="button" (click)="createFolder(name.value)" class="mdl-button">Create</button>
+        <button type="button" (click)="createFolder(name.value)" class="mdl-button">{{ 'BUTTON.CREATE' | translate }}</button>
-        <button type="button" (click)="cancel()" class="mdl-button close">Cancel</button>
+        <button type="button" (click)="cancel()" class="mdl-button close">{{ 'BUTTON.CANCEL' | translate }}</button>
     </div>
 </dialog>

ng2-components/ng2-alfresco-documentlist/src/components/document-menu-action.ts

@@ -78,10 +78,11 @@ export class DocumentMenuAction implements OnInit {
                 error => {
                     let errorMessagePlaceholder = this.getErrorMessage(error.response);
                     if (errorMessagePlaceholder) {
-                        this.onError.emit({value: errorMessagePlaceholder});
                         this.message = this.formatString(errorMessagePlaceholder, [name]);
+                        this.onError.emit({message: this.message});
                         console.log(this.message);
                     } else {
+                        this.onError.emit(error);
                         console.log(error);
                     }
                 }

ng2-components/ng2-alfresco-documentlist/src/i18n/en.json

@@ -12,5 +12,11 @@
         "ft_ic_archive": "Archive file",
         "ft_ic_presentation": "Presentation file",
         "ft_ic_spreadsheet": "Spreadsheet file"
+    },
+    "BUTTON": {
+        "ACTION_CREATE": "Create...",
+        "ACTION_NEW_FOLDER": "New Folder",
+        "CREATE": "Create",
+        "CANCEL": "Cancel"
     }
 }