├── .gitignore ├── .npmignore ├── .travis.yml ├── .yo-rc.json ├── LICENSE.md ├── README.md ├── build.sh ├── demo.gif ├── demo ├── .editorconfig ├── .gitignore ├── config.xml ├── ionic.config.json ├── package.json ├── resources │ ├── android │ │ ├── icon │ │ │ ├── drawable-hdpi-icon.png │ │ │ ├── drawable-ldpi-icon.png │ │ │ ├── drawable-mdpi-icon.png │ │ │ ├── drawable-xhdpi-icon.png │ │ │ ├── drawable-xxhdpi-icon.png │ │ │ └── drawable-xxxhdpi-icon.png │ │ └── splash │ │ │ ├── drawable-land-hdpi-screen.png │ │ │ ├── drawable-land-ldpi-screen.png │ │ │ ├── drawable-land-mdpi-screen.png │ │ │ ├── drawable-land-xhdpi-screen.png │ │ │ ├── drawable-land-xxhdpi-screen.png │ │ │ ├── drawable-land-xxxhdpi-screen.png │ │ │ ├── drawable-port-hdpi-screen.png │ │ │ ├── drawable-port-ldpi-screen.png │ │ │ ├── drawable-port-mdpi-screen.png │ │ │ ├── drawable-port-xhdpi-screen.png │ │ │ ├── drawable-port-xxhdpi-screen.png │ │ │ └── drawable-port-xxxhdpi-screen.png │ ├── icon.png │ ├── ios │ │ ├── icon │ │ │ ├── icon-40.png │ │ │ ├── icon-40@2x.png │ │ │ ├── icon-40@3x.png │ │ │ ├── icon-50.png │ │ │ ├── icon-50@2x.png │ │ │ ├── icon-60.png │ │ │ ├── icon-60@2x.png │ │ │ ├── icon-60@3x.png │ │ │ ├── icon-72.png │ │ │ ├── icon-72@2x.png │ │ │ ├── icon-76.png │ │ │ ├── icon-76@2x.png │ │ │ ├── icon-83.5@2x.png │ │ │ ├── icon-small.png │ │ │ ├── icon-small@2x.png │ │ │ ├── icon-small@3x.png │ │ │ ├── icon.png │ │ │ └── icon@2x.png │ │ └── splash │ │ │ ├── Default-568h@2x~iphone.png │ │ │ ├── Default-667h.png │ │ │ ├── Default-736h.png │ │ │ ├── Default-Landscape-736h.png │ │ │ ├── Default-Landscape@2x~ipad.png │ │ │ ├── Default-Landscape~ipad.png │ │ │ ├── Default-Portrait@2x~ipad.png │ │ │ ├── Default-Portrait~ipad.png │ │ │ ├── Default@2x~iphone.png │ │ │ └── Default~iphone.png │ └── splash.png ├── src │ ├── app │ │ ├── app.component.ts │ │ ├── app.html │ │ ├── app.module.js │ │ ├── app.module.ts │ │ ├── app.scss │ │ └── main.ts │ ├── assets │ │ └── icon │ │ │ └── favicon.ico │ ├── declarations.d.ts │ ├── index.html │ ├── manifest.json │ ├── pages │ │ └── myList │ │ │ ├── myList.html │ │ │ ├── myList.scss │ │ │ └── myList.ts │ ├── service-worker.js │ └── theme │ │ └── variables.scss ├── tsconfig.json └── tslint.json ├── package.json ├── src ├── elastic-header.directive.ts ├── index.ts ├── package.json └── tsconfig.es5.json ├── tsconfig.json ├── tslint.json └── watch.js /.gitignore: -------------------------------------------------------------------------------- 1 | # Node 2 | node_modules/* 3 | npm-debug.log 4 | 5 | # TypeScript 6 | src/*.js 7 | src/*.map 8 | src/*.d.ts 9 | 10 | # JetBrains 11 | .idea 12 | .project 13 | .settings 14 | .idea/* 15 | *.iml 16 | 17 | # VS Code 18 | .vscode/* 19 | 20 | # Windows 21 | Thumbs.db 22 | Desktop.ini 23 | 24 | # Mac 25 | .DS_Store 26 | **/.DS_Store 27 | 28 | # Ngc generated files 29 | **/*.ngfactory.ts 30 | 31 | # Build files 32 | dist/* 33 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | # Node 2 | node_modules/* 3 | npm-debug.log 4 | 5 | build.sh 6 | .travis.yml 7 | .yo-rc.json 8 | watch.js 9 | .gitignore 10 | 11 | # DO NOT IGNORE TYPESCRIPT FILES FOR NPM 12 | # TypeScript 13 | # *.js 14 | # *.map 15 | # *.d.ts 16 | 17 | # JetBrains 18 | .idea 19 | .project 20 | .settings 21 | .idea/* 22 | *.iml 23 | 24 | # VS Code 25 | .vscode/* 26 | 27 | # Windows 28 | Thumbs.db 29 | Desktop.ini 30 | 31 | # Mac 32 | .DS_Store 33 | **/.DS_Store 34 | 35 | # Ngc generated files 36 | **/*.ngfactory.ts 37 | 38 | # Library files 39 | src 40 | build 41 | demo -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | sudo: false 3 | node_js: 4 | - '4.2.1' 5 | -------------------------------------------------------------------------------- /.yo-rc.json: -------------------------------------------------------------------------------- 1 | { 2 | "generator-angular2-library": { 3 | "promptValues": { 4 | "gitRepositoryUrl": "https://github.com/pablozandona/ionic2-elastic-header" 5 | } 6 | } 7 | } -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | ISC License (ISC) 2 | ================= 3 | 4 | Copyright (c) 2017, Pablo Zandoná 5 | 6 | Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies. 7 | 8 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 9 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # ionic2-elastic-header 2 | 3 | ***ionic2-elastic-header*** is a directive for Ionic 2 and Ionic 3 to cause headers to shrink and reveal. 4 | 5 | ![demo](demo.gif) 6 | 7 | ## Installation 8 | 9 | ```bash 10 | npm install ionic2-elastic-header --save 11 | ``` 12 | 13 | ### app.module.ts 14 | 15 | * Import ElasticHeaderModule; 16 | * Add ElasticHeaderModule in imports; 17 | 18 | ```typescript 19 | import { NgModule, ErrorHandler } from '@angular/core'; 20 | import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 21 | import { MyApp } from './app.component'; 22 | import { MyList } from '../pages/myList/myList'; 23 | import { ElasticHeaderModule } from "ionic2-elastic-header/dist"; 24 | 25 | @NgModule({ 26 | declarations: [ 27 | MyApp, 28 | MyList 29 | ], 30 | imports: [ 31 | IonicModule.forRoot(MyApp), 32 | ElasticHeaderModule //Add ElasticHeaderModule here 33 | ], 34 | bootstrap: [IonicApp], 35 | entryComponents: [ 36 | MyApp, 37 | MyList 38 | ], 39 | providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}] 40 | }) 41 | export class AppModule {} 42 | ``` 43 | 44 | ## Usage 45 | 46 | * Add `fullscreen` attribute in ``; 47 | * Assign a `#ioncontentID` attribute in ``; 48 | * Add `elasticHeader` attribute in ``, and assign with value of your #ioncontentID; 49 | 50 | ### myList.html 51 | 52 | ```html 53 | 54 | 55 | 56 | My List 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | {{item.name}} 65 | 66 | 67 | 68 | ``` 69 | 70 | ## Licence 71 | 72 | This project is licensed under the ISC license. See the [LICENSE](LICENSE.md) file for more info. 73 | -------------------------------------------------------------------------------- /build.sh: -------------------------------------------------------------------------------- 1 | # Clean up previous build files 2 | rm -rf build 3 | rm -rf dist 4 | 5 | # Define commands 6 | NGC="node node_modules/.bin/ngc" 7 | ROLLUP="node node_modules/.bin/rollup" 8 | 9 | # Run Angular Compiler to generate build directory 10 | $NGC -p src/tsconfig.es5.json 11 | 12 | # Run rollup to generate dist directory 13 | $ROLLUP build/index.js -o dist/index.js 14 | 15 | # Copy all files from build to dist, except for JavaScript files 16 | rsync -a --exclude=*.js build/ dist 17 | 18 | # Copy package.json to dist 19 | cp src/package.json dist/package.json 20 | 21 | # Clean up build directory 22 | rm -rf build 23 | -------------------------------------------------------------------------------- /demo.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo.gif -------------------------------------------------------------------------------- /demo/.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain consistent coding styles between different editors and IDEs 2 | # editorconfig.org 3 | 4 | root = true 5 | 6 | [*] 7 | indent_style = space 8 | indent_size = 2 9 | 10 | # We recommend you to keep these unchanged 11 | end_of_line = lf 12 | charset = utf-8 13 | trim_trailing_whitespace = true 14 | insert_final_newline = true 15 | 16 | [*.md] 17 | trim_trailing_whitespace = false -------------------------------------------------------------------------------- /demo/.gitignore: -------------------------------------------------------------------------------- 1 | # Specifies intentionally untracked files to ignore when using Git 2 | # http://git-scm.com/docs/gitignore 3 | 4 | *~ 5 | *.sw[mnpcod] 6 | *.log 7 | *.tmp 8 | *.tmp.* 9 | log.txt 10 | *.sublime-project 11 | *.sublime-workspace 12 | .vscode/ 13 | npm-debug.log* 14 | 15 | .idea/ 16 | .sass-cache/ 17 | .tmp/ 18 | .versions/ 19 | coverage/ 20 | dist/ 21 | node_modules/ 22 | tmp/ 23 | temp/ 24 | hooks/ 25 | platforms/ 26 | plugins/ 27 | plugins/android.json 28 | plugins/ios.json 29 | www/ 30 | $RECYCLE.BIN/ 31 | 32 | .DS_Store 33 | Thumbs.db 34 | UserInterfaceState.xcuserstate 35 | -------------------------------------------------------------------------------- /demo/config.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | myApp 4 | An awesome Ionic/Cordova app. 5 | Ionic Framework Team 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /demo/ionic.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "myList", 3 | "app_id": "" 4 | } 5 | -------------------------------------------------------------------------------- /demo/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ionic-hello-world", 3 | "author": "Ionic Framework", 4 | "homepage": "http://ionicframework.com/", 5 | "private": true, 6 | "scripts": { 7 | "clean": "ionic-app-scripts clean", 8 | "build": "ionic-app-scripts build", 9 | "ionic:build": "ionic-app-scripts build", 10 | "ionic:serve": "ionic-app-scripts serve" 11 | }, 12 | "dependencies": { 13 | "@angular/common": "4.0.0", 14 | "@angular/compiler": "4.0.0", 15 | "@angular/compiler-cli": "4.0.0", 16 | "@angular/core": "4.0.0", 17 | "@angular/forms": "4.0.0", 18 | "@angular/http": "4.0.0", 19 | "@angular/platform-browser": "4.0.0", 20 | "@angular/platform-browser-dynamic": "4.0.0", 21 | "ionic-angular": "3.0.0", 22 | "ionic2-elastic-header": "0.0.9", 23 | "ionicons": "3.0.0", 24 | "rxjs": "5.1.1", 25 | "sw-toolbox": "3.4.0", 26 | "zone.js": "^0.8.4" 27 | }, 28 | "devDependencies": { 29 | "@ionic/app-scripts": "1.3.0", 30 | "typescript": "~2.2.1" 31 | }, 32 | "cordovaPlugins": [ 33 | "cordova-plugin-whitelist", 34 | "cordova-plugin-statusbar", 35 | "cordova-plugin-console", 36 | "cordova-plugin-device", 37 | "cordova-plugin-splashscreen", 38 | "ionic-plugin-keyboard" 39 | ], 40 | "cordovaPlatforms": [], 41 | "description": "myApp: An Ionic project" 42 | } 43 | -------------------------------------------------------------------------------- /demo/resources/android/icon/drawable-hdpi-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/icon/drawable-hdpi-icon.png -------------------------------------------------------------------------------- /demo/resources/android/icon/drawable-ldpi-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/icon/drawable-ldpi-icon.png -------------------------------------------------------------------------------- /demo/resources/android/icon/drawable-mdpi-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/icon/drawable-mdpi-icon.png -------------------------------------------------------------------------------- /demo/resources/android/icon/drawable-xhdpi-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/icon/drawable-xhdpi-icon.png -------------------------------------------------------------------------------- /demo/resources/android/icon/drawable-xxhdpi-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/icon/drawable-xxhdpi-icon.png -------------------------------------------------------------------------------- /demo/resources/android/icon/drawable-xxxhdpi-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/icon/drawable-xxxhdpi-icon.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-land-hdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-land-hdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-land-ldpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-land-ldpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-land-mdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-land-mdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-land-xhdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-land-xhdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-land-xxhdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-land-xxhdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-land-xxxhdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-land-xxxhdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-port-hdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-port-hdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-port-ldpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-port-ldpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-port-mdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-port-mdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-port-xhdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-port-xhdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-port-xxhdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-port-xxhdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/android/splash/drawable-port-xxxhdpi-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/android/splash/drawable-port-xxxhdpi-screen.png -------------------------------------------------------------------------------- /demo/resources/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/icon.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-40.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-40.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-40@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-40@2x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-40@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-40@3x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-50.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-50.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-50@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-50@2x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-60.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-60.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-60@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-60@2x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-60@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-60@3x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-72.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-72@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-72@2x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-76.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-76.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-76@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-76@2x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-83.5@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-83.5@2x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-small.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-small.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-small@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-small@2x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon-small@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon-small@3x.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon.png -------------------------------------------------------------------------------- /demo/resources/ios/icon/icon@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/icon/icon@2x.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default-568h@2x~iphone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default-568h@2x~iphone.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default-667h.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default-667h.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default-736h.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default-736h.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default-Landscape-736h.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default-Landscape-736h.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default-Landscape@2x~ipad.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default-Landscape@2x~ipad.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default-Landscape~ipad.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default-Landscape~ipad.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default-Portrait@2x~ipad.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default-Portrait@2x~ipad.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default-Portrait~ipad.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default-Portrait~ipad.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default@2x~iphone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default@2x~iphone.png -------------------------------------------------------------------------------- /demo/resources/ios/splash/Default~iphone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/ios/splash/Default~iphone.png -------------------------------------------------------------------------------- /demo/resources/splash.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/resources/splash.png -------------------------------------------------------------------------------- /demo/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, ViewChild } from '@angular/core'; 2 | import { MyList } from '../pages/myList/myList'; 3 | import { Content } from "ionic-angular"; 4 | 5 | @Component({ 6 | templateUrl: 'app.html' 7 | }) 8 | export class MyApp { 9 | 10 | rootPage = MyList; 11 | 12 | constructor() { 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /demo/src/app/app.html: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /demo/src/app/app.module.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { 3 | var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; 4 | if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); 5 | else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; 6 | return c > 3 && r && Object.defineProperty(target, key, r), r; 7 | }; 8 | var core_1 = require("@angular/core"); 9 | var ionic_angular_1 = require("ionic-angular"); 10 | var app_component_1 = require("./app.component"); 11 | var myList_1 = require("../pages/myList/myList"); 12 | var ionic2_elastic_header_1 = require("ionic2-elastic-header"); 13 | var AppModule = (function () { 14 | function AppModule() { 15 | } 16 | return AppModule; 17 | }()); 18 | AppModule = __decorate([ 19 | core_1.NgModule({ 20 | declarations: [ 21 | app_component_1.MyApp, 22 | myList_1.MyList 23 | ], 24 | imports: [ 25 | ionic_angular_1.IonicModule.forRoot(app_component_1.MyApp), 26 | ionic2_elastic_header_1.ElasticHeaderModule 27 | ], 28 | bootstrap: [ionic_angular_1.IonicApp], 29 | entryComponents: [ 30 | app_component_1.MyApp, 31 | myList_1.MyList 32 | ], 33 | providers: [{ provide: core_1.ErrorHandler, useClass: ionic_angular_1.IonicErrorHandler }] 34 | }) 35 | ], AppModule); 36 | exports.AppModule = AppModule; 37 | -------------------------------------------------------------------------------- /demo/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule, ErrorHandler } from '@angular/core'; 2 | import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 3 | import { MyApp } from './app.component'; 4 | import { MyList } from '../pages/myList/myList'; 5 | import { BrowserModule } from "@angular/platform-browser"; 6 | import { ElasticHeaderModule } from "ionic2-elastic-header/dist"; 7 | 8 | @NgModule({ 9 | declarations: [ 10 | MyApp, 11 | MyList 12 | ], 13 | imports: [ 14 | ElasticHeaderModule, 15 | BrowserModule, 16 | IonicModule.forRoot(MyApp), 17 | ], 18 | bootstrap: [IonicApp], 19 | entryComponents: [ 20 | MyApp, 21 | MyList 22 | ], 23 | providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}] 24 | }) 25 | export class AppModule {} 26 | -------------------------------------------------------------------------------- /demo/src/app/app.scss: -------------------------------------------------------------------------------- 1 | // http://ionicframework.com/docs/v2/theming/ 2 | 3 | 4 | // App Global Sass 5 | // -------------------------------------------------- 6 | // Put style rules here that you want to apply globally. These 7 | // styles are for the entire app and not just one component. 8 | // Additionally, this file can be also used as an entry point 9 | // to import other Sass files to be included in the output CSS. 10 | // 11 | // Shared Sass variables, which can be used to adjust Ionic's 12 | // default Sass variables, belong in "theme/variables.scss". 13 | // 14 | // To declare rules for a specific mode, create a child rule 15 | // for the .md, .ios, or .wp mode classes. The mode class is 16 | // automatically applied to the element in the app. 17 | -------------------------------------------------------------------------------- /demo/src/app/main.ts: -------------------------------------------------------------------------------- 1 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 2 | 3 | import { AppModule } from './app.module'; 4 | 5 | platformBrowserDynamic().bootstrapModule(AppModule); 6 | -------------------------------------------------------------------------------- /demo/src/assets/icon/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pablozandona/ionic2-elastic-header/4e840cbf67e04acfe46f7fe88f1a725fe7fee537/demo/src/assets/icon/favicon.ico -------------------------------------------------------------------------------- /demo/src/declarations.d.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Declaration files are how the Typescript compiler knows about the type information(or shape) of an object. 3 | They're what make intellisense work and make Typescript know all about your code. 4 | 5 | A wildcard module is declared below to allow third party libraries to be used in an app even if they don't 6 | provide their own type declarations. 7 | 8 | To learn more about using third party libraries in an Ionic app, check out the docs here: 9 | http://ionicframework.com/docs/v2/resources/third-party-libs/ 10 | 11 | For more info on type definition files, check out the Typescript docs here: 12 | https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html 13 | */ 14 | declare module '*'; -------------------------------------------------------------------------------- /demo/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Ionic App 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /demo/src/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Ionic", 3 | "short_name": "Ionic", 4 | "start_url": "index.html", 5 | "display": "standalone", 6 | "icons": [{ 7 | "src": "assets/imgs/logo.png", 8 | "sizes": "512x512", 9 | "type": "image/png" 10 | }], 11 | "background_color": "#4e8ef7", 12 | "theme_color": "#4e8ef7" 13 | } -------------------------------------------------------------------------------- /demo/src/pages/myList/myList.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | My List 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | {{item.name}} 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /demo/src/pages/myList/myList.scss: -------------------------------------------------------------------------------- 1 | myList { 2 | 3 | } 4 | -------------------------------------------------------------------------------- /demo/src/pages/myList/myList.ts: -------------------------------------------------------------------------------- 1 | import {Component, ViewChild} from '@angular/core'; 2 | import {Content} from 'ionic-angular'; 3 | 4 | @Component({ 5 | selector: 'myList', 6 | templateUrl: 'myList.html' 7 | }) 8 | 9 | export class MyList { 10 | 11 | //add the elastic-header value 12 | 13 | // @ViewChild(Content) myContent: Content; 14 | 15 | items: any; 16 | 17 | constructor() { 18 | this.items = []; 19 | for(let i=0; i < 50; i++) { 20 | this.items.push({ name: `Person ${i}`}) 21 | } 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /demo/src/service-worker.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Check out https://googlechrome.github.io/sw-toolbox/docs/master/index.html for 3 | * more info on how to use sw-toolbox to custom configure your service worker. 4 | */ 5 | 6 | 7 | 'use strict'; 8 | importScripts('./build/sw-toolbox.js'); 9 | 10 | self.toolbox.options.cache = { 11 | name: 'ionic-cache' 12 | }; 13 | 14 | // pre-cache our key assets 15 | self.toolbox.precache( 16 | [ 17 | './build/main.js', 18 | './build/main.css', 19 | './build/polyfills.js', 20 | 'index.html', 21 | 'manifest.json' 22 | ] 23 | ); 24 | 25 | // dynamically cache any other local assets 26 | self.toolbox.router.any('/*', self.toolbox.cacheFirst); 27 | 28 | // for any other requests go to the network, cache, 29 | // and then only use that cached resource if your user goes offline 30 | self.toolbox.router.default = self.toolbox.networkFirst; -------------------------------------------------------------------------------- /demo/src/theme/variables.scss: -------------------------------------------------------------------------------- 1 | // Ionic Variables and Theming. For more info, please see: 2 | // http://ionicframework.com/docs/v2/theming/ 3 | $font-path: "../assets/fonts"; 4 | 5 | @import "ionic.globals"; 6 | 7 | 8 | // Shared Variables 9 | // -------------------------------------------------- 10 | // To customize the look and feel of this app, you can override 11 | // the Sass variables found in Ionic's source scss files. 12 | // To view all the possible Ionic variables, see: 13 | // http://ionicframework.com/docs/v2/theming/overriding-ionic-variables/ 14 | 15 | 16 | 17 | 18 | // Named Color Variables 19 | // -------------------------------------------------- 20 | // Named colors makes it easy to reuse colors on various components. 21 | // It's highly recommended to change the default colors 22 | // to match your app's branding. Ionic uses a Sass map of 23 | // colors so you can add, rename and remove colors as needed. 24 | // The "primary" color is the only required color in the map. 25 | 26 | $colors: ( 27 | primary: #387ef5, 28 | secondary: #32db64, 29 | danger: #f53d3d, 30 | light: #f4f4f4, 31 | dark: #222 32 | ); 33 | 34 | 35 | // App iOS Variables 36 | // -------------------------------------------------- 37 | // iOS only Sass variables can go here 38 | 39 | 40 | 41 | 42 | // App Material Design Variables 43 | // -------------------------------------------------- 44 | // Material Design only Sass variables can go here 45 | 46 | 47 | 48 | 49 | // App Windows Variables 50 | // -------------------------------------------------- 51 | // Windows only Sass variables can go here 52 | 53 | 54 | 55 | 56 | // App Theme 57 | // -------------------------------------------------- 58 | // Ionic apps can have different themes applied, which can 59 | // then be future customized. This import comes last 60 | // so that the above variables are used and Ionic's 61 | // default are overridden. 62 | 63 | @import "ionic.theme.default"; 64 | 65 | 66 | // Ionicons 67 | // -------------------------------------------------- 68 | // The premium icon font for Ionic. For more info, please see: 69 | // http://ionicframework.com/docs/v2/ionicons/ 70 | 71 | @import "ionic.ionicons"; 72 | 73 | 74 | // Fonts 75 | // -------------------------------------------------- 76 | 77 | @import "roboto"; 78 | @import "noto-sans"; 79 | -------------------------------------------------------------------------------- /demo/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "allowSyntheticDefaultImports": true, 4 | "declaration": false, 5 | "emitDecoratorMetadata": true, 6 | "experimentalDecorators": true, 7 | "lib": [ 8 | "dom", 9 | "es2015" 10 | ], 11 | "module": "es2015", 12 | "moduleResolution": "node", 13 | "sourceMap": true, 14 | "target": "es5" 15 | }, 16 | "include": [ 17 | "src/**/*.ts" 18 | ], 19 | "exclude": [ 20 | "node_modules" 21 | ], 22 | "compileOnSave": false, 23 | "atom": { 24 | "rewriteTsconfig": false 25 | } 26 | } -------------------------------------------------------------------------------- /demo/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "rules": { 3 | "no-duplicate-variable": true, 4 | "no-unused-variable": [ 5 | true 6 | ] 7 | }, 8 | "rulesDirectory": [ 9 | "node_modules/tslint-eslint-rules/dist/rules" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ionic2-elastic-header", 3 | "version": "0.0.10", 4 | "description": "Directive for Ionic 2 and Ionic 3 to cause headers to shrink and reveal.", 5 | "main": "./dist/index.js", 6 | "scripts": { 7 | "build": "./build.sh", 8 | "build:watch": "node ./watch.js", 9 | "lint": "tslint --type-check --project tsconfig.json src/**/*.ts", 10 | "test": "tsc && karma start" 11 | }, 12 | "repository": { 13 | "type": "git", 14 | "url": "https://github.com/pablozandona/ionic2-elastic-header" 15 | }, 16 | "author": { 17 | "name": "Pablo Zandoná", 18 | "email": "pablozandona@gmail.com" 19 | }, 20 | "keywords": [ 21 | "header", 22 | "shrink", 23 | "shrinking", 24 | "shrinkage", 25 | "reveal", 26 | "hiding", 27 | "hiding", 28 | "scroll", 29 | "ionic", 30 | "ionic2", 31 | "angular", 32 | "angular2", 33 | "directive" 34 | ], 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/pablozandona/ionic2-elastic-header/issues" 38 | }, 39 | "devDependencies": { 40 | "@angular/common": "4.0.0", 41 | "@angular/compiler": "4.0.0", 42 | "@angular/compiler-cli": "4.0.0", 43 | "@angular/core": "4.0.0", 44 | "@angular/forms": "4.0.0", 45 | "@angular/http": "4.0.0", 46 | "@angular/platform-browser": "4.0.0", 47 | "@angular/platform-browser-dynamic": "4.0.0", 48 | "@types/jasmine": "2.5.38", 49 | "@types/node": "~6.0.60", 50 | "codelyzer": "~2.0.0", 51 | "core-js": "^2.4.1", 52 | "ionic-angular": "^3.0.0", 53 | "jasmine-core": "~2.5.2", 54 | "jasmine-spec-reporter": "~3.2.0", 55 | "karma": "~1.4.1", 56 | "karma-chrome-launcher": "~2.0.0", 57 | "karma-cli": "~1.0.1", 58 | "karma-coverage-istanbul-reporter": "^0.2.0", 59 | "karma-jasmine": "~1.1.0", 60 | "karma-jasmine-html-reporter": "^0.2.2", 61 | "node-watch": "^0.5.2", 62 | "protractor": "~5.1.0", 63 | "rollup": "^0.41.6", 64 | "rxjs": "^5.3.0", 65 | "ts-node": "~2.0.0", 66 | "tslint": "~4.5.0", 67 | "typescript": "~2.2.0", 68 | "zone.js": "^0.8.4" 69 | }, 70 | "engines": { 71 | "node": ">=6.0.0" 72 | } 73 | } 74 | -------------------------------------------------------------------------------- /src/elastic-header.directive.ts: -------------------------------------------------------------------------------- 1 | import { Directive, ElementRef, Input, Renderer2 } from "@angular/core"; 2 | import { Content } from "ionic-angular"; 3 | 4 | @Directive({ 5 | selector: "[elasticHeader]" 6 | }) 7 | export class ElasticHeaderDirective { 8 | header: HTMLElement; 9 | headerHeight: number; 10 | lastScrollTop: number = 0; 11 | translateAmt: number = 0; 12 | 13 | @Input("elasticHeader") content: Content; 14 | 15 | constructor(public element: ElementRef, public renderer: Renderer2) {} 16 | 17 | ngOnInit() { 18 | this.header = this.element.nativeElement; 19 | this.content.ionScroll.subscribe(ev => 20 | requestAnimationFrame(() => this.updateElasticHeader(ev.scrollTop)) 21 | ); 22 | } 23 | 24 | // @HostListener("window:resize") 25 | // resize() { 26 | // this.headerHeight = this.header.clientHeight; 27 | // } 28 | // Right now header height doesn't change when window resized. If needed in the future, use this to prevent memory leak. 29 | 30 | updateElasticHeader(scrollTop: number) { 31 | !this.headerHeight && (this.headerHeight = this.header.clientHeight); 32 | 33 | if (this.lastScrollTop < 0) this.translateAmt = 0; 34 | else { 35 | this.translateAmt += (this.lastScrollTop - scrollTop) / 4; 36 | if (this.translateAmt > 0) this.translateAmt = 0; 37 | if (this.translateAmt < -this.headerHeight - 12) 38 | this.translateAmt = -this.headerHeight - 12; 39 | } 40 | this.renderer.setStyle( 41 | this.header, 42 | "transform", 43 | "translate(0," + this.translateAmt + "px)" 44 | ); 45 | this.lastScrollTop = scrollTop; 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /src/index.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { ElasticHeaderDirective } from './elastic-header.directive'; 4 | 5 | export * from './elastic-header.directive'; 6 | 7 | @NgModule({ 8 | imports: [ 9 | CommonModule 10 | ], 11 | declarations: [ 12 | ElasticHeaderDirective 13 | ], 14 | exports: [ 15 | ElasticHeaderDirective 16 | ] 17 | }) 18 | export class ElasticHeaderModule {} -------------------------------------------------------------------------------- /src/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ionic2-elastic-header", 3 | "version": "0.0.10", 4 | "repository": { 5 | "type": "git", 6 | "url": "https://github.com/pablozandona/ionic2-elastic-header" 7 | }, 8 | "author": { 9 | "name": "Pablo Zandoná", 10 | "email": "pablozandona@gmail.com" 11 | }, 12 | "keywords": [ 13 | "angular" 14 | ], 15 | "license": "MIT", 16 | "bugs": { 17 | "url": "https://github.com/pablozandona/ionic2-elastic-header/issues" 18 | }, 19 | "module": "ionic2-elastic-header.js", 20 | "typings": "ionic2-elastic-header.d.ts", 21 | "peerDependencies": { 22 | "ionic-angular": "^3.0.0", 23 | "@angular/core": "^4.0.0", 24 | "rxjs": "^5.3.0", 25 | "zone.js": "^0.8.4" 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /src/tsconfig.es5.json: -------------------------------------------------------------------------------- 1 | // This file is used by ngc to create the files in the build directory 2 | { 3 | "compilerOptions": { 4 | "declaration": true, 5 | "module": "es2015", 6 | "target": "es5", 7 | "baseUrl": ".", 8 | "stripInternal": true, 9 | "emitDecoratorMetadata": true, 10 | "experimentalDecorators": true, 11 | "moduleResolution": "node", 12 | "outDir": "../build", 13 | "rootDir": ".", 14 | "lib": [ 15 | "es2015", 16 | "dom" 17 | ], 18 | "skipLibCheck": true, 19 | // Don't auto-discover @types/node, it results in a /// { 20 | if (code === 0) { 21 | const timestamp = new Date().toISOString().replace(/T/, ' ').replace(/\..+/, ''); 22 | console.log(timestamp + ' finished build process, dist directory was successfully updated'); 23 | } 24 | }); 25 | } 26 | --------------------------------------------------------------------------------