Merge branch 'preview-misc-fixes-2' into preview-misc-fixes-2-themed

README.md

@@ -14,7 +14,7 @@ If you're looking for the 2016 Angular 2 DSpace UI prototype, you can find it [h
 Quick start
 -----------
 
-**Ensure you're running [Node](https://nodejs.org) >= `v8.0.x`, [npm](https://www.npmjs.com/) >= `v3.x` and [yarn](https://yarnpkg.com) >= `v0.20.x`**
+**Ensure you're running [Node](https://nodejs.org) >= `v8.0.x`, [npm](https://www.npmjs.com/) >= `v5.x` and [yarn](https://yarnpkg.com) >= `v1.x`**
 
 ```bash
 # clone the repo
@@ -65,7 +65,7 @@ Requirements
 ------------
 
 -	[Node.js](https://nodejs.org), [npm](https://www.npmjs.com/), and [yarn](https://yarnpkg.com)
--	Ensure you're running node >= `v5.x`, npm >= `v3.x` and yarn >= `v0.20.x`
+-	Ensure you're running node >= `v8.x`, npm >= `v5.x` and yarn >= `v1.x`
 
 If you have [`nvm`](https://github.com/creationix/nvm#install-script) or [`nvm-windows`](https://github.com/coreybutler/nvm-windows) installed, which is highly recommended, you can run `nvm install --lts && nvm use` to install and start using the latest Node LTS.
 

package.json

@@ -10,9 +10,6 @@
   "engines": {
     "node": ">=8.0.0"
   },
-  "config": {
-    "wp_cmd": "node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js"
-  },
   "scripts": {
     "global": "npm install -g @angular/cli marked node-gyp nodemon node-nightly npm-check-updates npm-run-all rimraf typescript ts-node typedoc webpack webpack-bundle-analyzer pm2 rollup",
     "clean:coverage": "rimraf coverage",
@@ -26,9 +23,9 @@
     "prebuild": "yarn run clean:dist",
     "prebuild:aot": "yarn run prebuild",
     "prebuild:prod": "yarn run prebuild",
-    "build": "$npm_package_config_wp_cmd --progress --mode development",
+    "build": "node ./webpack/run-webpack.js --progress --mode development",
-    "build:aot": "$npm_package_config_wp_cmd --env.aot --env.server --mode development && $npm_package_config_wp_cmd --env.aot --env.client --mode development",
+    "build:aot": "node ./webpack/run-webpack.js --env.aot --env.server --mode development && node ./webpack/run-webpack.js --env.aot --env.client --mode development",
-    "build:prod": "$npm_package_config_wp_cmd --env.aot --env.server --mode production && $npm_package_config_wp_cmd --env.aot --env.client --mode production",
+    "build:prod": "node ./webpack/run-webpack.js --env.aot --env.server --mode production && node ./webpack/run-webpack.js --env.aot --env.client --mode production",
     "postbuild:prod": "yarn run rollup",
     "rollup": "rollup -c rollup.config.js",
     "prestart": "yarn run build:prod",
@@ -43,7 +40,7 @@
     "server": "node dist/server.js",
     "server:watch": "nodemon dist/server.js",
     "server:watch:debug": "nodemon --debug dist/server.js",
-    "webpack:watch": "$npm_package_config_wp_cmd -w --mode development",
+    "webpack:watch": "node ./webpack/run-webpack.js -w --mode development",
     "watch": "yarn run build && npm-run-all -p webpack:watch server:watch",
     "watch:debug": "yarn run build && npm-run-all -p webpack:watch server:watch:debug",
     "predebug": "yarn run build",

src/app/+item-page/simple/item-page.component.ts

@@ -1,5 +1,5 @@
 
-import { mergeMap, filter, map, take } from 'rxjs/operators';
+import { mergeMap, filter, map, take, tap } from 'rxjs/operators';
 import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
@@ -41,11 +41,6 @@ export class ItemPageComponent implements OnInit {
    */
   itemRD$: Observable<RemoteData<Item>>;
 
-  /**
-   * The item's thumbnail
-   */
-  thumbnail$: Observable<Bitstream>;
-
   /**
    * The view-mode we're currently on
    */
@@ -64,9 +59,5 @@ export class ItemPageComponent implements OnInit {
       redirectToPageNotFoundOn404(this.router)
     );
     this.metadataService.processRemoteData(this.itemRD$);
-    this.thumbnail$ = this.itemRD$.pipe(
-      map((rd: RemoteData<Item>) => rd.payload),
-      filter((item: Item) => hasValue(item)),
-      mergeMap((item: Item) => item.getThumbnail()));
   }
 }

src/app/navbar/navbar.component.ts

@@ -116,7 +116,7 @@ export class NavbarComponent extends MenuComponent implements OnInit {
         model: {
           type: MenuItemType.LINK,
           text: 'menu.section.statistics',
-          link: '#'
+          link: ''
         } as LinkMenuItemModel,
         index: 2
       },

src/app/thumbnail/thumbnail.component.html

@@ -1,4 +1,4 @@
 <div class="thumbnail">
-  <img *ngIf="thumbnail && thumbnail.content" [src]="thumbnail.content" (error)="errorHandler($event)" class="img-fluid"/>
+  <img [src]="src | dsSafeUrl" (error)="errorHandler($event)" class="img-fluid"/>
-  <img *ngIf="!thumbnail || !thumbnail.content" [src]="defaultImage | dsSafeUrl" class="img-fluid"/>
 </div>
+

src/app/thumbnail/thumbnail.component.ts

@@ -1,5 +1,6 @@
-import { Component, Input } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { Bitstream } from '../core/shared/bitstream.model';
+import { hasValue } from '../shared/empty.util';
 
 /**
  * This component renders a given Bitstream as a thumbnail.
@@ -12,19 +13,26 @@ import { Bitstream } from '../core/shared/bitstream.model';
   styleUrls: ['./themes/thumbnail.component.mantis.scss'],
   templateUrl: './thumbnail.component.html'
 })
-export class ThumbnailComponent {
+export class ThumbnailComponent implements OnInit {
 
   @Input() thumbnail: Bitstream;
 
-  data: any = {};
-
   /**
    * The default 'holder.js' image
    */
   @Input() defaultImage? = 'data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2293%22%20height%3D%22120%22%20viewBox%3D%220%200%2093%20120%22%20preserveAspectRatio%3D%22none%22%3E%3C!--%0ASource%20URL%3A%20holder.js%2F93x120%3Ftext%3DNo%20Thumbnail%0ACreated%20with%20Holder.js%202.8.2.%0ALearn%20more%20at%20http%3A%2F%2Fholderjs.com%0A(c)%202012-2015%20Ivan%20Malopinsky%20-%20http%3A%2F%2Fimsky.co%0A--%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%3C!%5BCDATA%5B%23holder_1543e460b05%20text%20%7B%20fill%3A%23AAAAAA%3Bfont-weight%3Abold%3Bfont-family%3AArial%2C%20Helvetica%2C%20Open%20Sans%2C%20sans-serif%2C%20monospace%3Bfont-size%3A10pt%20%7D%20%5D%5D%3E%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_1543e460b05%22%3E%3Crect%20width%3D%2293%22%20height%3D%22120%22%20fill%3D%22%23FFFFFF%22%2F%3E%3Cg%3E%3Ctext%20x%3D%2235.6171875%22%20y%3D%2257%22%3ENo%3C%2Ftext%3E%3Ctext%20x%3D%2210.8125%22%20y%3D%2272%22%3EThumbnail%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E';
 
+  src: string;
   errorHandler(event) {
     event.currentTarget.src = this.defaultImage;
   }
 
+  ngOnInit(): void {
+      if (hasValue(this.thumbnail) && this.thumbnail.content) {
+        this.src = this.thumbnail.content;
+      } else {
+        this.src = this.defaultImage
+      }
+  }
+
 }

webpack/run-webpack.js

@@ -0,0 +1,13 @@
+const path = require('path');
+const child_process = require('child_process');
+
+const heapSize = 4096;
+const webpackPath = path.join('node_modules', 'webpack', 'bin', 'webpack.js');
+
+const params = [
+  '--max_old_space_size=' + heapSize,
+  webpackPath,
+  ...process.argv.slice(2)
+];
+
+child_process.spawn('node', params, { stdio:'inherit' });