Fixed a lot of stuff

Author: nikini

README.md

@@ -75,6 +75,12 @@ The possible options for it are:
 ## Problems or suggestions
 Let us know or submit a PR! And, please, don't hesitate to contribute. :heart:
 
+## Changelog
+
+#### v0.0.7
+ * Changed to work with Ionic 2 RC-5
+ * Made a temporary fix for orientationchange bug in ios
+ * Fixed a problem that was causing apps to not build
 
 ## Credits
 Ciprian Mocanu - [@nikini](http://github.com/nikini)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ionic-gallery-modal",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "description": "Ionic 2 Gallery Modal (to preview photos)",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -24,6 +24,7 @@
   "license": "MIT",
   "devDependencies": {
     "@angular/compiler": "^2.2.1",
+    "@types/core-js": "^0.9.35",
     "@types/node": "^6.0.57",
     "copyfiles": "^1.0.0",
     "gulp": "^3.9.1",
@@ -53,7 +54,7 @@
     "dist"
   ],
   "repository": {
-    "type" : "git",
-    "url" : "https://github.com/nikini/ionic-gallery-modal.git"
+    "type": "git",
+    "url": "https://github.com/nikini/ionic-gallery-modal.git"
   }
 }

src/gallery-modal/gallery-modal.html

@@ -1,4 +1,4 @@
-<ion-content #content class="gallery-modal">
+<ion-content #content class="gallery-modal" (window:resize)="resize($event)" (window:orientationchange)="orientationChange($event)">
   <button class="close-button" ion-button icon-only (click)="dismiss()">
     <ion-icon name="{{ closeIcon }}"></ion-icon>
   </button>

src/gallery-modal/gallery-modal.ts

@@ -1,5 +1,5 @@
-import { Component, ViewChild, ViewEncapsulation } from '@angular/core';
-import { ViewController, NavParams, Slides, Content } from 'ionic-angular';
+import { Component, ViewChild, ViewEncapsulation, ElementRef } from '@angular/core';
+import { ViewController, NavParams, Slides, Content, Platform } from 'ionic-angular';
 import { Photo } from '../interfaces/photo-interface';
 import { Subject }    from 'rxjs/Subject';
 
@@ -22,7 +22,7 @@ export class GalleryModal {
   private closeIcon: string = 'arrow-back';
   private parentSubject: Subject<any> = new Subject();
 
-  constructor(private viewCtrl: ViewController, params: NavParams) {
+  constructor(private viewCtrl: ViewController, params: NavParams, private element: ElementRef, private platform: Platform) {
     this.photos = params.get('photos') || [];
     this.closeIcon = params.get('closeIcon') || 'arrow-back';
     this.initialSlide = params.get('initialSlide') || 0;
@@ -37,7 +37,22 @@ export class GalleryModal {
   }
 
   private resize(event) {
-    this.parentSubject.next(event);
+    this.slider.update();
+
+    let width = this.element['nativeElement'].offsetWidth;
+    let height = this.element['nativeElement'].offsetHeight;
+
+    this.parentSubject.next({
+      width: width,
+      height: height,
+    });
+  }
+
+  private orientationChange(event) {
+    // TODO: See if you can remove timeout
+    window.setTimeout(() => {
+      this.resize(event);
+    }, 150);
   }
 
   /**

src/zoomable-image/zoomable-image.html

@@ -1,4 +1,4 @@
-<ion-scroll #ionScrollContainer scrollX="true" scrollY="true" zoom="false" (window:resize)="resize($event)">
+<ion-scroll #ionScrollContainer scrollX="true" scrollY="true" zoom="false">
   <div #container class="image">
     <img #image src="{{ src }}" alt="" />
   </div>

src/zoomable-image/zoomable-image.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, OnDestroy, Input, Output, ViewChild, EventEmitter, ViewEncapsulation, ElementRef } from '@angular/core';
+import { Component, OnInit, OnDestroy, Input, Output, ViewChild, EventEmitter, ViewEncapsulation } from '@angular/core';
 import { ViewController, Gesture, Scroll } from 'ionic-angular';
 import { Subject }    from 'rxjs/Subject';
 
@@ -56,7 +56,7 @@ export class ZoomableImage implements OnInit, OnDestroy {
 
   private imageElement: any;
 
-  constructor(private elementRef: ElementRef) {
+  constructor() {
   }
 
   public ngOnInit() {
@@ -100,13 +100,8 @@ export class ZoomableImage implements OnInit, OnDestroy {
    * Called every time the window gets resized
    */
   public resize(event) {
-    let node = this.elementRef.nativeElement;
-
-    if (node.parentElement) {
-      node = node.parentElement;
-    }
     // Set the wrapper dimensions first
-    this.setWrapperDimensions(node.offsetWidth, node.offsetHeight);
+    this.setWrapperDimensions(event.width, event.height);
 
     // Get the image dimensions
     this.setImageDimensions();
@@ -118,7 +113,7 @@ export class ZoomableImage implements OnInit, OnDestroy {
    * @param  {number} width
    * @param  {number} height
    */
-  private setWrapperDimensions(width:number = 0, height:number = 0) {
+  private setWrapperDimensions(width:number, height:number) {
     this.dimensions.width = width || window.innerWidth;
     this.dimensions.height = height || window.innerHeight;
   }
@@ -290,7 +285,7 @@ export class ZoomableImage implements OnInit, OnDestroy {
    *
    * @param  {number} scale
    */
-  private animateScale(scale:number = 1) {
+  private animateScale(scale:number) {
     this.scale += (scale - this.scale) / 5;
 
     if (Math.abs(this.scale - scale) <= 0.1) {

tsconfig.json

@@ -2,13 +2,18 @@
   "compilerOptions": {
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
-    "target": "es6",
+    "target": "es5",
     "module": "commonjs",
     "moduleResolution": "node",
     "removeComments": true,
     "sourceMap": true,
     "outDir": "dist-final",
-    "types" : ["node"],
+    "typeRoots": [
+      "node_modules/@types"
+    ],
+    "types": [
+      "core-js"
+    ],
     "declaration": true
   },
   "include": [

typings.json

@@ -1,4 +1,5 @@
 {
   "globalDependencies": {
+    "es6-shim": "registry:dt/es6-shim#0.31.2+20160726072212"
   }
 }