diff --git a/CHANGELOG.md b/CHANGELOG.md index eee650b8ba..e9e9c95c25 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,33 @@ + +# 2.0.0-alpha.51 (2016-1-21) + +### Breaking Changes + +##### Angular was updated to Beta 1 + +* Update the version of Angular in your `package.json` file: + + ``` + "angular2": "2.0.0-beta.1", + ``` + +##### Ionicons were moved + +* Install ionicons (this will be added in the starters): `npm install --save ionicons` +* Modify the sass `include` in your `ionic.config.js` file: + + ``` + sass: { + src: ['app/theme/app.+(ios|md).scss'], + dest: 'www/build/css', + include: [ + 'node_modules/ionic-framework', + 'node_modules/ionicons/dist/scss' + ] + }, + ``` + + # 2.0.0-alpha.48 (2016-1-7) diff --git a/gulpfile.js b/gulpfile.js index 89ad502a4a..c49b9d6ae5 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -396,7 +396,16 @@ gulp.task('copy.scss', function() { gulp.task('copy.libs', function() { var merge = require('merge2'); - var webAnimations = gulp.src('scripts/resources/web-animations-js/web-animations.min.js') + var webAnimations = gulp.src([ + 'scripts/resources/web-animations-js/web-animations.min.js', + 'node_modules/systemjs/node_modules/es6-module-loader/dist/es6-module-loader.src.js', + 'node_modules/systemjs/dist/system.src.js', + 'node_modules/angular2/bundles/angular2-polyfills.js', + 'node_modules/angular2/bundles/angular2.dev.js', + 'node_modules/angular2/bundles/router.dev.js', + 'node_modules/angular2/bundles/http.dev.js', + 'node_modules/rxjs/bundles/Rx.js' + ]) .pipe(gulp.dest('dist/js')); var libs = gulp.src([ @@ -447,40 +456,39 @@ gulp.task('package', ['src.release'], function(done){ ]) .pipe(gulp.dest(distDir)); - var inquirer = require('inquirer'); - inquirer.prompt([ - { - type: 'input', - name: 'ionicVersion', - message: '\n\nWhat ionic-framework alpha version number will this be?' - }, - { - type: 'input', - name: 'angularVersion', - message: '\nWhat angular2 beta version number is a peer dependency?' - } - ], function(answers) { - var packageTemplate = _.template(fs.readFileSync('scripts/npm/package.json')); - fs.writeFileSync(distDir + '/package.json', packageTemplate(answers)); - - done(); - }); + var templateVars = {}; + var packageJSON = require('./package.json'); + templateVars.ionicVersion = packageJSON.version; + templateVars.angularVersion = packageJSON.dependencies.angular2; + var packageTemplate = _.template(fs.readFileSync('scripts/npm/package.json')); + fs.writeFileSync(distDir + '/package.json', packageTemplate(templateVars)); + done(); }); gulp.task('publish', ['package'], function(done){ - var spawn = require('child_process').spawn; - var npmCmd = spawn('npm', ['publish', './dist']); + var semver = require('semver'); + var fs = require('fs'); + var err = false; + + var npmCmd = spawn('npm', ['pack', './dist']); npmCmd.stdout.on('data', function (data) { console.log(data.toString()); }); npmCmd.stderr.on('data', function (data) { + err = true; console.log('npm err: ' + data.toString()); }); npmCmd.on('close', function() { + // update package.json + if (!err) { + var packageJSON = require('./package.json'); + packageJSON.version = semver.inc(packageJSON.version, 'prerelease', 'alpha'); + fs.writeFileSync('package.json', JSON.stringify(packageJSON, null, 2)); + } done(); }); diff --git a/ionic/components/button/button-fab.scss b/ionic/components/button/button-fab.scss index b4f607a3cb..1762615177 100644 --- a/ionic/components/button/button-fab.scss +++ b/ionic/components/button/button-fab.scss @@ -19,9 +19,6 @@ $button-fab-size: 56px !default; overflow: hidden; - transition: .2s linear; - transition-property: background-color; - font-size: 14px; ion-icon { diff --git a/ionic/components/button/button.ios.scss b/ionic/components/button/button.ios.scss index b0d17e7bb6..b5cad1f3e4 100644 --- a/ionic/components/button/button.ios.scss +++ b/ionic/components/button/button.ios.scss @@ -157,7 +157,7 @@ $button-ios-small-icon-font-size: 1.3em !default; .button-clear { border-color: transparent; - color: color-shade($button-ios-color); + color: $button-ios-color; background-color: transparent; &.activated { @@ -167,7 +167,7 @@ $button-ios-small-icon-font-size: 1.3em !default; &:hover:not(.disable-hover) { opacity: 0.6; - color: color-shade($button-ios-color); + color: $button-ios-color; } } @@ -178,7 +178,7 @@ $button-ios-small-icon-font-size: 1.3em !default; @mixin ios-button-clear($color-name, $color-value) { .button-clear-#{$color-name} { - $fg-color: color-shade($color-value); + $fg-color: $color-value; border-color: transparent; background-color: transparent; color: $fg-color; @@ -188,7 +188,7 @@ $button-ios-small-icon-font-size: 1.3em !default; } &:hover:not(.disable-hover) { - color: color-shade($fg-color); + color: $fg-color; } } diff --git a/ionic/components/button/button.md.scss b/ionic/components/button/button.md.scss index 0443114710..ac5fe0ef34 100644 --- a/ionic/components/button/button.md.scss +++ b/ionic/components/button/button.md.scss @@ -18,6 +18,8 @@ $button-md-transition-duration: 300ms !default; $button-md-clear-hover-background-color: rgba(158, 158, 158, 0.1) !default; $button-md-clear-active-background-color: rgba(158, 158, 158, 0.2) !default; +$button-md-outline-ripple-opacity: 0.25 !default; + $button-md-fab-box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.14), 0 4px 5px rgba(0, 0, 0, 0.1) !default; $button-md-fab-box-shadow-active: 0 5px 15px 0 rgba(0, 0, 0, 0.4), 0 4px 7px 0 rgba(0, 0, 0, 0.1) !default; @@ -143,13 +145,12 @@ $button-md-small-icon-font-size: 1.4em !default; &.activated { opacity: 1; - color: $background-md-color; - background-color: $button-md-color; box-shadow: none; + background-color: transparent; } md-ripple { - background-color: ripple-background-color($button-md-color); + background-color: rgba($button-md-color, $button-md-outline-ripple-opacity); } } @@ -166,8 +167,11 @@ $button-md-small-icon-font-size: 1.4em !default; color: $fg-color; &.activated { - color: $background-md-color; - background-color: $fg-color; + background-color: transparent; + } + + md-ripple { + background-color: rgba($fg-color, $button-md-outline-ripple-opacity); } } @@ -182,7 +186,7 @@ $button-md-small-icon-font-size: 1.4em !default; opacity: 1; box-shadow: none; background-color: transparent; - color: color-shade($button-md-color); + color: $button-md-color; &.activated { background-color: $button-md-clear-active-background-color; @@ -190,7 +194,8 @@ $button-md-small-icon-font-size: 1.4em !default; } &:hover:not(.disable-hover) { - color: color-shade($button-md-color); + + color: $button-md-color; } } @@ -201,7 +206,7 @@ $button-md-small-icon-font-size: 1.4em !default; @mixin md-button-clear($color-name, $color-value) { .button-clear-#{$color-name} { - $fg-color: color-shade($color-value); + $fg-color: $color-value; border-color: transparent; background-color: transparent; color: $fg-color; @@ -213,7 +218,7 @@ $button-md-small-icon-font-size: 1.4em !default; } &:hover:not(.disable-hover) { - color: color-shade($fg-color); + color: $fg-color; } } } @@ -235,6 +240,10 @@ $button-md-small-icon-font-size: 1.4em !default; border-radius: 50%; box-shadow: $button-md-fab-box-shadow; + transition: box-shadow $button-md-transition-duration $button-md-animation-curve, + background-color $button-md-transition-duration $button-md-animation-curve, + color $button-md-transition-duration $button-md-animation-curve; + &.activated { box-shadow: $button-md-fab-box-shadow-active; } diff --git a/ionic/components/button/button.scss b/ionic/components/button/button.scss index 02297c4072..1de2ba7a9c 100644 --- a/ionic/components/button/button.scss +++ b/ionic/components/button/button.scss @@ -15,6 +15,7 @@ $button-round-border-radius: 64px !default; align-items: center; justify-content: center; transition: background-color, opacity 100ms linear; + z-index: 0; white-space: nowrap; text-overflow: ellipsis; diff --git a/ionic/components/ion.ts b/ionic/components/ion.ts index 79b9c29267..e46ad3ed71 100644 --- a/ionic/components/ion.ts +++ b/ionic/components/ion.ts @@ -14,7 +14,7 @@ export class Ion { private _id: string; constructor(protected elementRef: ElementRef) { - this._id = 'i-' + ids++; + this._id = 'i' + ids++; } getElementRef() { diff --git a/ionic/components/menu/test/basic/index.ts b/ionic/components/menu/test/basic/index.ts index 2cad458b9e..a23df1a89c 100644 --- a/ionic/components/menu/test/basic/index.ts +++ b/ionic/components/menu/test/basic/index.ts @@ -5,13 +5,12 @@ import {App, IonicApp, Page, NavController, Alert} from 'ionic/ionic'; templateUrl: 'page1.html' }) class Page1 { - constructor(nav: NavController) { - this.nav = nav; - } + constructor(private nav: NavController) {} + presentAlert() { let alert = Alert.create({ title: "New Friend!", - body: "Your friend, Obi wan Kenobi, just accepted your friend request!", + message: "Your friend, Obi wan Kenobi, just accepted your friend request!", cssClass: 'my-alert', buttons: ['Ok'] }); @@ -26,9 +25,8 @@ class Page3 {} @Page({templateUrl: 'page2.html'}) class Page2 { - constructor(nav: NavController) { - this.nav = nav; - } + constructor(private nav: NavController) {} + page3() { this.nav.push(Page3); } @@ -40,8 +38,7 @@ class Page2 { }) class E2EApp { - constructor(app: IonicApp) { - this.app = app; + constructor(private app: IonicApp) { this.rootView = Page1; this.changeDetectionCount = 0; diff --git a/ionic/components/nav/nav-controller.ts b/ionic/components/nav/nav-controller.ts index 2ca22392ab..4ce4a4e4e9 100644 --- a/ionic/components/nav/nav-controller.ts +++ b/ionic/components/nav/nav-controller.ts @@ -254,6 +254,11 @@ export class NavController extends Ion { let views = pages.map(p => new ViewController(p.page, p.params)); let enteringView = this._insert(0, views); + // if animation wasn't set to true then default it to NOT animate + if (opts.animate !== true) { + opts.animate = false; + } + // set the nav direction to "back" if it wasn't set opts.direction = opts.direction || 'back'; @@ -458,7 +463,7 @@ export class NavController extends Ion { * in and become the active page. * * @param {number} insertIndex The index where you want to insert the page - * @param {Array<{page: Type, params?: any}>} insertPages An array of objects, each with a `page` and optionally `params` property + * @param {Array<{page: Type, params=: any}>} insertPages An array of objects, each with a `page` and optionally `params` property * @param {object} [opts={}] Any options you want to use pass to transtion * @returns {Promise} Returns a promise when the pages have been inserted into the navigation stack */ @@ -1187,7 +1192,7 @@ export class NavController extends Ion { // remove the page from its container let index = viewContainer.indexOf(hostViewRef); - if (index !== -1) { + if (!hostViewRef.destroyed && index !== -1) { viewContainer.remove(index); } }); @@ -1205,11 +1210,11 @@ export class NavController extends Ion { let navbarTemplateRef = view.getNavbarTemplateRef(); if (navbarContainerRef && navbarTemplateRef) { - let navbarView = navbarContainerRef.createEmbeddedView(navbarTemplateRef); + let navbarViewRef = navbarContainerRef.createEmbeddedView(navbarTemplateRef); view.addDestroy(() => { - let index = navbarContainerRef.indexOf(navbarView); - if (index > -1) { + let index = navbarContainerRef.indexOf(navbarViewRef); + if (!navbarViewRef.destroyed && index > -1) { navbarContainerRef.remove(index); } }); @@ -1566,4 +1571,4 @@ const STATE_REMOVE_AFTER_TRANS = 'remove_after_trans'; const STATE_FORCE_ACTIVE = 'force_active'; const INIT_ZINDEX = 10; -let ctrlIds = -1; \ No newline at end of file +let ctrlIds = -1; diff --git a/ionic/components/tabs/tab-button.ts b/ionic/components/tabs/tab-button.ts index 399ab1d7bb..bf8a1e4341 100644 --- a/ionic/components/tabs/tab-button.ts +++ b/ionic/components/tabs/tab-button.ts @@ -1,6 +1,7 @@ import {Component, Directive, ElementRef, Optional, Host, forwardRef, ViewContainerRef, HostListener, EventEmitter, Output, Input, Renderer} from 'angular2/core'; import {Tab} from './tab'; +import {Ion} from '../ion'; import {Config} from '../../config/config'; @@ -20,17 +21,18 @@ import {Config} from '../../config/config'; '[class.disable-hover]': 'disHover' } }) -export class TabButton { +export class TabButton extends Ion { private disHover: boolean; private hasTitle: boolean; private hasIcon: boolean; private hasTitleOnly: boolean; private hasIconOnly: boolean; - + @Input() tab: Tab; @Output() select: EventEmitter = new EventEmitter(); - - constructor(config: Config) { + + constructor(config: Config, elementRef: ElementRef) { + super(elementRef); this.disHover = (config.get('hoverCSS') === false); } diff --git a/ionic/components/tabs/tabs.ios.scss b/ionic/components/tabs/tabs.ios.scss index 8ca9c39771..7312b896c9 100644 --- a/ionic/components/tabs/tabs.ios.scss +++ b/ionic/components/tabs/tabs.ios.scss @@ -41,7 +41,6 @@ ion-tabs[tabbarPlacement=top] tabbar { } .tab-button-text { - margin-bottom: 0; min-height: $tabbar-ios-item-font-size + 1; font-size: $tabbar-ios-item-font-size; } diff --git a/ionic/components/toolbar/toolbar.ios.scss b/ionic/components/toolbar/toolbar.ios.scss index 47283e87ab..f40aa79cbd 100644 --- a/ionic/components/toolbar/toolbar.ios.scss +++ b/ionic/components/toolbar/toolbar.ios.scss @@ -61,7 +61,8 @@ ion-navbar-section { .toolbar-title { font-size: $toolbar-ios-title-font-size; - font-weight: 500; + font-weight: 600; + margin-top: 1px; text-align: center; pointer-events: auto; color: $toolbar-ios-text-color; @@ -134,12 +135,12 @@ ion-buttons[right] { @mixin ios-bar-button-default($color-name, $color-value) { .bar-button-#{$color-name} { - $fg-color: color-shade($color-value); + $fg-color: $color-value; color: $fg-color; background-color: transparent; &:hover:not(.disable-hover) { - color: color-shade($fg-color); + color: $fg-color; } &.activated { @@ -256,6 +257,7 @@ ion-buttons[right] { .back-button { margin: 0; + margin-top: 2px; min-height: 3.2rem; line-height: 1; order: map-get($toolbar-order-ios, back-button); @@ -267,7 +269,11 @@ ion-buttons[right] { display: inherit; margin: 0; min-width: 18px; - font-size: 3.2rem; + font-size: 3.3rem; +} + +.back-button-text { + letter-spacing: -0.01em; } @@ -284,6 +290,12 @@ ion-buttons[right] { padding: 0 6px; font-size: 2.8rem; } + + // TODO remove the !important flag - temporary hack until we can remove the element style + // on transition + &.activated { + opacity: 0.4 !important; + } } .bar-button-menutoggle[end], diff --git a/ionic/components/toolbar/toolbar.md.scss b/ionic/components/toolbar/toolbar.md.scss index e716193d14..ad3acdae00 100644 --- a/ionic/components/toolbar/toolbar.md.scss +++ b/ionic/components/toolbar/toolbar.md.scss @@ -136,16 +136,12 @@ ion-buttons[right] { @mixin md-bar-button-default($color-name, $color-value) { .bar-button-#{$color-name} { - $fg-color: color-shade($color-value); + $fg-color: $color-value; color: $fg-color; background-color: transparent; &:hover:not(.disable-hover) { - color: color-shade($fg-color); - } - - &.activated { - opacity: 0.4; + color: $fg-color; } } diff --git a/ionic/platform/storage/local-storage.ts b/ionic/platform/storage/local-storage.ts index 454537d45c..5d9b2c8af9 100644 --- a/ionic/platform/storage/local-storage.ts +++ b/ionic/platform/storage/local-storage.ts @@ -30,7 +30,7 @@ import {StorageEngine} from './storage'; * @see {@link /docs/v2/platform/storage/ Storage Platform Docs} */ export class LocalStorage extends StorageEngine { - constructor() { + constructor(options={}) { super(); } diff --git a/ionic/platform/storage/storage.ts b/ionic/platform/storage/storage.ts index 6ef19eaca5..abd6cc2e74 100644 --- a/ionic/platform/storage/storage.ts +++ b/ionic/platform/storage/storage.ts @@ -56,7 +56,6 @@ export interface IStorageEngine { */ export class StorageEngine { constructor(options={}) { - throw Error("constructor(options={}) not implemented for this storage engine"); } get(key, value) { throw Error("get() not implemented for this storage engine"); diff --git a/ionic/themes/default.scss b/ionic/themes/default.scss index 8b58770a76..005835e87b 100644 --- a/ionic/themes/default.scss +++ b/ionic/themes/default.scss @@ -4,7 +4,7 @@ $colors: ( - primary: #387ef5, + primary: #327eff, secondary: #32db64, danger: #f53d3d, light: #f4f4f4, diff --git a/package.json b/package.json index 9cca29f9f9..1cb2d21232 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "private": "true", "name": "ionic2", - "version": "2.0.0-alpha.48", + "version": "2.0.0-alpha.52", "license": "Apache-2.0", "repository": { "type": "git", @@ -54,7 +54,7 @@ "gulp-watch": "^4.2.4", "html-entities": "^1.1.3", "htmlparser2": "^3.8.3", - "ionic-cz-conventional-changelog": "^0.2.0", + "ionic-cz-conventional-changelog": "^1.0.0", "jasmine-node": "^1.14.5", "js-yaml": "^3.4.2", "karma": "^0.12.31", diff --git a/scripts/README.md b/scripts/README.md index 2f91c5047b..c0d278a5f7 100644 --- a/scripts/README.md +++ b/scripts/README.md @@ -32,3 +32,10 @@ ### Running Tests 1. `gulp karma` + + +# Releasing + +1. Pull latest code +2. `gulp publish` +3. Sit back and have a beer :beer: (or wine :wine_glass:) diff --git a/scripts/e2e/e2e.template.html b/scripts/e2e/e2e.template.html index 64129f4479..876f90fb23 100644 --- a/scripts/e2e/e2e.template.html +++ b/scripts/e2e/e2e.template.html @@ -5,18 +5,19 @@ - - + + + - - - - - - - - - + + + + + + + + +