mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 03:32:21 +08:00
Merge branch 'master' of github.com:driftyco/ionic2
This commit is contained in:
@ -46,7 +46,7 @@ import {BasicListsPage,
|
||||
BasicDividersPage,
|
||||
BasicInsetListsPage,
|
||||
ListHeadersPage,
|
||||
ThreeLineListsPage,
|
||||
MultilineListsPage,
|
||||
ThumbnailListsPage} from './lists/lists';
|
||||
|
||||
import {MenusPage} from './menus/menus';
|
||||
@ -152,7 +152,7 @@ export function getPageFor(hash) {
|
||||
'list-dividers': BasicDividersPage,
|
||||
'inset-list': BasicInsetListsPage,
|
||||
'list-headers': ListHeadersPage,
|
||||
'three-line-list': ThreeLineListsPage,
|
||||
'multiline-list': MultilineListsPage,
|
||||
'thumbnail-list': ThumbnailListsPage,
|
||||
|
||||
'menus': MenusPage,
|
||||
|
@ -64,10 +64,10 @@ export class AvatarListsPage {
|
||||
}
|
||||
|
||||
@Page({
|
||||
templateUrl: 'lists/three-lists.html',
|
||||
templateUrl: 'lists/multiline-lists.html',
|
||||
directives: [forwardRef(() => AndroidAttribute)]
|
||||
})
|
||||
export class ThreeLineListsPage {
|
||||
export class MultilineListsPage {
|
||||
constructor() {
|
||||
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
|
||||
<ion-navbar *navbar hide-back-button class="show-navbar android-attr">
|
||||
<ion-title>Three-line Items</ion-title>
|
||||
<ion-title>Multiline Items</ion-title>
|
||||
</ion-navbar>
|
||||
|
||||
<ion-content class="has-header">
|
||||
@ -37,6 +37,10 @@
|
||||
<p>Was scavaging around the other day and...</p>
|
||||
</ion-item>
|
||||
|
||||
</ion-list>
|
||||
|
||||
|
||||
<ion-list>
|
||||
<ion-header>
|
||||
Last Week
|
||||
</ion-header>
|
||||
@ -67,6 +71,7 @@
|
||||
<h3>You're My Only Hope</h3>
|
||||
<p>I've placed information vital to the survival...</p>
|
||||
</ion-item>
|
||||
|
||||
</ion-list>
|
||||
|
||||
|
||||
</ion-content>
|
@ -36,4 +36,5 @@ export * from 'ionic/components/segment/segment'
|
||||
export * from 'ionic/components/switch/switch'
|
||||
export * from 'ionic/components/tabs/tabs'
|
||||
export * from 'ionic/components/tabs/tab'
|
||||
export * from 'ionic/components/tap-click/tap-click'
|
||||
export * from 'ionic/components/toolbar/toolbar'
|
||||
|
@ -46,7 +46,7 @@ export class ItemSlidingOptionButton {
|
||||
* ```
|
||||
*/
|
||||
@Component({
|
||||
selector: 'ion-item-sliding,[ion-item-sliding]',
|
||||
selector: 'ion-item-sliding',
|
||||
inputs: [
|
||||
'sliding'
|
||||
],
|
||||
@ -68,6 +68,7 @@ export class ItemSliding {
|
||||
constructor(elementRef: ElementRef, renderer: Renderer, @Optional() @Host() list: List, zone: NgZone) {
|
||||
this._zone = zone;
|
||||
renderer.setElementClass(elementRef, 'item', true);
|
||||
renderer.setElementAttribute(elementRef, 'tappable', '');
|
||||
|
||||
this._isOpen = false;
|
||||
this._isSlideActive = false;
|
||||
|
@ -30,8 +30,8 @@
|
||||
min-height: 30px;
|
||||
font-weight: 500;
|
||||
width: 100%;
|
||||
z-index: 100;
|
||||
z-index: 1000;
|
||||
|
||||
&.sticky {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
|
@ -203,7 +203,8 @@ ion-note {
|
||||
|
||||
.item.activated,
|
||||
a.item.activated,
|
||||
button.item.activated {
|
||||
button.item.activated,
|
||||
.item.activated ion-item-sliding-content {
|
||||
background-color: $item-ios-activated-background-color;
|
||||
transition-duration: 0ms;
|
||||
}
|
||||
|
@ -246,13 +246,17 @@ ion-note {
|
||||
|
||||
.item,
|
||||
a.item,
|
||||
button.item {
|
||||
button.item,
|
||||
.item ion-item-sliding-content {
|
||||
transition: background-color $button-md-transition-duration $button-md-animation-curve;
|
||||
}
|
||||
|
||||
&.activated {
|
||||
.item.activated,
|
||||
a.item.activated,
|
||||
button.item.activated,
|
||||
.item.activated ion-item-sliding-content {
|
||||
background-color: $item-md-activated-background-color;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.item[no-lines] {
|
||||
|
@ -13,7 +13,7 @@
|
||||
</ion-item-options>
|
||||
</ion-item-sliding>
|
||||
|
||||
<ion-item-sliding text-wrap detail-push>
|
||||
<ion-item-sliding text-wrap detail-push class="activated">
|
||||
<h3>Adam Bradley</h3>
|
||||
<p>
|
||||
I think I figured out how to get more Mountain Dew
|
||||
|
@ -579,7 +579,7 @@ export class NavController extends Ion {
|
||||
|
||||
_setZIndex(enteringInstance, leavingInstance, direction) {
|
||||
if (!leavingInstance) {
|
||||
enteringInstance._zIndex = 0;
|
||||
enteringInstance._zIndex = 10;
|
||||
|
||||
} else if (direction === 'back') {
|
||||
// moving back
|
||||
|
@ -1,20 +1,3 @@
|
||||
// import {
|
||||
// ddescribe,
|
||||
// describe,
|
||||
// xdescribe,
|
||||
// it,
|
||||
// iit,
|
||||
// xit,
|
||||
// expect,
|
||||
// beforeEach,
|
||||
// afterEach,
|
||||
// AsyncTestCompleter,
|
||||
// inject,
|
||||
// beforeEachBindings
|
||||
// } from 'angular2/test';
|
||||
|
||||
// import {Compiler} from 'angular2/angular2';
|
||||
|
||||
import {
|
||||
NavController,
|
||||
Config,
|
||||
|
@ -65,3 +65,6 @@ tab-highlight {
|
||||
}
|
||||
}
|
||||
|
||||
[tab-bar-placement=bottom] tab-highlight {
|
||||
top: 0;
|
||||
}
|
||||
|
@ -18,3 +18,7 @@ md-ripple {
|
||||
|
||||
transform: scale(0.001) translateZ(0);
|
||||
}
|
||||
|
||||
ion-item-sliding md-ripple {
|
||||
z-index: 2;
|
||||
}
|
||||
|
@ -174,14 +174,14 @@ function getActivatableTarget(ele) {
|
||||
return null;
|
||||
}
|
||||
|
||||
function isActivatable(ele) {
|
||||
if (/^(A|BUTTON)$/.test(ele.tagName)) {
|
||||
export function isActivatable(ele) {
|
||||
if (ACTIVATABLE_ELEMENTS.test(ele.tagName)) {
|
||||
return true;
|
||||
}
|
||||
|
||||
let attributes = ele.attributes;
|
||||
for (let i = 0, l = attributes.length; i < l; i++) {
|
||||
if (/click|tappable/.test(attributes[i].name)) {
|
||||
if (ACTIVATABLE_ATTRIBUTES.test(attributes[i].name)) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
@ -200,3 +200,6 @@ function addListener(type, listener, useCapture) {
|
||||
function removeListener(type, listener) {
|
||||
doc.removeEventListener(type, listener);
|
||||
}
|
||||
|
||||
const ACTIVATABLE_ELEMENTS = /^(A|BUTTON)$/;
|
||||
const ACTIVATABLE_ATTRIBUTES = /tappable/;
|
||||
|
44
ionic/components/tap-click/test/tapClick.spec.ts
Normal file
44
ionic/components/tap-click/test/tapClick.spec.ts
Normal file
@ -0,0 +1,44 @@
|
||||
import * as tapClick from 'ionic/ionic';
|
||||
|
||||
export function run() {
|
||||
|
||||
describe("TapClick", () => {
|
||||
|
||||
describe("isActivatable", () => {
|
||||
|
||||
it('should be activatable on <a> element', () => {
|
||||
let ele = document.createElement('a');
|
||||
expect( tapClick.isActivatable(ele) ).toBe(true);
|
||||
});
|
||||
|
||||
it('should be activatable on <button> element', () => {
|
||||
let ele = document.createElement('button');
|
||||
expect( tapClick.isActivatable(ele) ).toBe(true);
|
||||
});
|
||||
|
||||
it('should be activatable on <ion-item-sliding> element', () => {
|
||||
let ele = document.createElement('ion-item-sliding');
|
||||
expect( tapClick.isActivatable(ele) ).toBe(true);
|
||||
});
|
||||
|
||||
it('should be not activatable on <ion-item> element', () => {
|
||||
let ele = document.createElement('ion-item');
|
||||
expect( tapClick.isActivatable(ele) ).toBe(false);
|
||||
});
|
||||
|
||||
it('should be not activatable on <div> element', () => {
|
||||
let ele = document.createElement('div');
|
||||
expect( tapClick.isActivatable(ele) ).toBe(false);
|
||||
});
|
||||
|
||||
it('should be activatable with "tappable" attribute', () => {
|
||||
let ele = document.createElement('div');
|
||||
ele.setAttribute('tappable', true);
|
||||
expect( tapClick.isActivatable(ele) ).toBe(true);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
}
|
@ -12,6 +12,13 @@
|
||||
"test:generators": "jasmine-node ./tooling/spec",
|
||||
"link": "npm install && gulp src && npm link"
|
||||
},
|
||||
"files": [
|
||||
"dist/css",
|
||||
"dist/fonts",
|
||||
"dist/js",
|
||||
"dist/src",
|
||||
"tooling"
|
||||
],
|
||||
"dependencies": {
|
||||
"@reactivex/rxjs": "5.0.0-alpha.4",
|
||||
"angular2": "2.0.0-alpha.44",
|
||||
|
Reference in New Issue
Block a user