Commit Graph

265 Commits

Author SHA1 Message Date
Andrew
fc3865755f enhance(slideBox): fix selectedIndex bugs 2014-11-18 10:16:57 -07:00
Adam Bradley
5d6a33c1db style(*): jscs linter updates to nav improvements 2014-11-11 23:04:33 -06:00
Adam Bradley
39951ca99a refactor(): navigation improvements, Angular 1.3
#### Refactor:

* **Navigation:** Refactored navigation for improved performance,
reduce DOM manipulations, increase transition FPS, cached views,
smoother transitions, platform specific transitions with added
configurable controls for transition animation and direction.
* **Cached Views:** Previously as a user navigated an app, each leaving
view’s element and scope would be destroyed. If the same view was
accessed again then the app would have to recreate the element. Views
can now be cached to improve performance. When a view is navigated away
from, its element is left in the DOM, and its scope is disconnected
from the cycle. When navigating to a view which is already cached, its
scope is reconnected, and the existing element which was left in the
DOM becomes the active view. This also allows for scroll position of
previous views to be maintained (without skippy jumps). Config
variables can be used to disable view caching (set to 0), or change the
maximum number of views to cache.
* **Angular v1.3:** Upgraded Ionic’s to work with Angular v1.3. In
general Ionic just works with the upgrade, but the required change was
that animations in v1.3 uses promise, whereas in v1.2 animations used
callbacks.

#### Features:

* **Platform Specific Transitions:** Transitions between views now
default to the transition style appropriate for each platform. For
example, iOS will move forward by transitioning the entering view from
right to center, and the leaving view from center to left. However,
Android will transition with the entering view going from bottom to
center, covering the previous view, which remains stationary. Platform
transitions are automatically applied by default, but config variables
and custom CSS allows these defaults to be easily overridden.
* **Override Transition Type and Direction:** As a user navigates the
app, Ionic automatically applies the appropriate transition type for
the platform, and the direction the user is navigating. However, both
can be overridden in numerous ways: config variable, view attribute,
stateProvider property, or attribute on the button/link that initiated
the transition.
* **enable-menu-with-back-views:** The `enable-menu-with-back-views`
attribute determines if the side menu is enabled when the back button
is showing. When set to `false`, any buttons/links with the
`menuToggle` directive will be hidden, and the user cannot swipe to
open the menu. When going back to the root page of the side menu (the
page without a back button visible), then any menuToggle buttons will
show again, and menus will be enabled again.
* **menuClose:** Closes a side menu which is currently opened.
Additionally, the menuClose directive will now cause transitions to not
animate between views while the menu is being closed.
* **ionNavBackButton:** The back button icon and text will
automatically update to platform config defaults, such as adjusting to
the platform back icon. To take advantage of this, the
`ionNavBackButton` directive now should be empty, such as
`<ion-nav-back-button></ion-nav-back-button>`. The back button can
still be fully customized like it could before, but without any inner
content it knows to style using platform configs.
* **navBar button primary/secondary sides:** Primary and secondary
sides are now the recommended values for the `side` attribute, such as
`<ion-nav-buttons side="primary">`. Primary buttons generally map to
the left side of the header, and secondary buttons are generally on the
right side. However, their exact locations are platform specific. For
example, in iOS the primary buttons are on the far left of the header,
and secondary buttons are on the far right, with the header title
centered between them. For Android however, both groups of buttons are
on the far right of the header, with the header title aligned left.
Recommendation is to always use `primary` and `secondary` so buttons
correctly map to the side familiar to users of a platform. However, in
cases where buttons should always be on an exact side, both `left` and
`right` sides are still available.
* **navDirection:** An attribute directive that sets the direction
which the nav view transition should animate.
* **navTransition:** An attribute directive that sets the transition
type which the nav view transition should use when it animates. Using
`none` will disable an animation.

#### Breaking Changes:

* **Animation CSS:** The CSS for view transitions have changed. This is
a breaking change only if Ionic apps had customized Ionic’s animation
CSS.
* **$ionicPlatformDefaults:** Platform config variables are no longer
in the $ionicPlatformDefaults constant, but within `$ionicConfig`.
* **$ionicViewService:** In the navigation refactoring,
$ionicViewService was split up into two factories, `$ionicViewSwitcher`
and `$ionicHistory`. The `$ionicHistory` is largely what
`$ionicViewService`, but between the two factories there is a better
separation of concerns for improved testing.
* **navClear:** The navClear directive was created to do what the new
side menu `enable-menu-with-back-views` attribute accomplishes.
Additionally, the new `navTransition` and `navDirection` directives are
more useful and granular than the navClear directive.
* **scrollView.rememberScrollPosition:** This method has been removed
since it is no longer needed with cached views.

#### Deprecated:

* **ionView.title:** The `ionView` directive used the `title`
attribute, but this can cause the tooltip to show up on desktop
browsers. The `title` attribute will still work for backwards
compatibility, but we now recommend using `view-title`, such as
`<ion-view view-title=”My Title”>`.
* **ionNavView animation attribute removed:** The animation attribute
is no longer used for nav views. Instead use `$ionicConfig`.
* **ionNavBar animation attribute removed:** The animation attribute is
no longer used for nav bars. Instead use `$ionicConfig`.
2014-11-11 14:43:10 -06:00
Andrew
8b1bef3ea1 refactor(ionSlideBox): use live nodeList to preserve ordering 2014-11-05 13:52:12 -07:00
Adam Bradley
8651b022e6 Merge pull request #2383 from AleksMeshkov/master
fix(keyboard): disabled scroll/focus for readonly elements
2014-10-30 20:20:38 -05:00
Perry Govier
8ee83777f7 fix(scroll): calling ionic scroll methods blur any selected input elements. Closes #2244 2014-10-27 16:45:01 -05:00
Perry Govier
8fae474252 fix(tap): prevent possible click error in specifc android devices. Fixes #2235 2014-10-24 15:58:12 -05:00
Aleksey Meshkov
6e0bdb3128 disabled scroll focus for readonly elements 2014-10-11 15:31:30 +04:00
Andrew
4ae4354fae amend(gestures): undo accidental change from slidebox commit 2014-10-08 13:20:06 -06:00
Andrew
7ef9ad74cf fix(slidebox): refactor for performance and stability
Closes #2336. Closes #2317. Closes #2290. Closes #2228. Closes #2067.
Closes #1890. Closes #1865. Closes #1850. Closes #1755. Closes #1688.
Closes #1578. Closes #1501. Closes #1353. Closes #1342. Closes #782.
Closes #416. Closes #2288.

BREAKING CHANGE: The slideBox's API has undergone many changes.

- **`<ion-slide-box>`** attributes have changed (see
  [documentation](http://ionicframework.com/docs/api/directive/ionSlideBox)):

  * `active-slide` has changed to `selected`. Change your code from
  this:

    ```html
    <ion-slide-box active-slide="activeSlideIndex"></ion-slide-box>
    ```

    To this:

    ```html
    <ion-slide-box selected="activeSlideIndex"></ion-slide-box>
    ```

  * `does-continue` has changed to `loop`.  Change your code from this:

    ```html
    <ion-slide-box does-continue="shouldLoop"></ion-slide-box>
    ```

    To this:

    ```html
    <ion-slide-box loop="shouldLoop"></ion-slide-box>
    ```

  * `auto-play` and `slide-interval` have been merged into `auto-play`.
  Change your code from this:

    ```html
    <!-- autoPlay is on -->
    <ion-slide-box auto-play="true" slide-interval="1000">
    </ion-slide-box>
    <!-- autoPlay is off -->
    <ion-slide-box auto-play="false" slide-interval="1000">
    </ion-slide-box>
    ```

    To this:

    ```html
    <!-- autoPlay is on -->
    <ion-slide-box auto-play="1000"></ion-slide-box>
    <!-- autoPlay is off -->
    <ion-slide-box auto-play="false"></ion-slide-box>
    ```

  * `show-pager` and `pager-click` have been removed. Use
  a child `<ion-slide-pager>` element. See the [`ion-slide-pager`
  documentation](http://ionicframework.com/docs/api/directive/ionSlidePager).
  Change your code from this:

  ```html
  <!-- pager using default click action -->
  <ion-slide-box show-pager="true">
  </ion-slide-box>
  <!-- pager with custom click action -->
  <ion-slide-box show-pager="true" pager-click="doSomething(index)">
  </ion-slide-box>
  ```

  To this:

  ```html
  <ion-slide-box>
    <!-- pager using default click action -->
    <ion-slide-pager></ion-slide-pager>
  </ion-slide-box>
  <ion-slide-box>
    <!-- pager with custom click action -->
    <ion-slide-pager ng-click="doSomething(index)"></ion-slide-pager>
  </ion-slide-box>
  ```

- **`$ionicSlideBoxDelegate`** methods have changed (see
  [documentation](http://ionicframework.com/docs/api/service/$ionicSlideBoxDelegate)):

  - `update()` has been removed. slideBox updates on its own now.

  - `stop()` has been removed. See `autoPlay()` below.

  - `start()` hass been removed. See `autoPlay()` below.

  - `slide(newIndex[, speed])` has been renamed to `select(newIndex[,
    speed]);

  - `currentIndex()` has been renamed to `selected()`.

  - `slidesCount()` has been renamed to `count()`.

  - New method `$ionicSlideBoxDelegate.autoPlay()`. Change your code
    from this:

    ```js
    // stop auto sliding
    $ionicSlideBoxDelegate.stop();
    // later... start auto sliding
    $ionicSlideBoxDelegate.start();
    ```

    To this:

    ```js
    var autoPlaySpeed = 3000; //wait 3000 seconds between changing slide
    // stop auto sliding
    $ionicSlideBoxDelegate.autoPlay(false);
    // later... start auto sliding
    $ionicSlideBoxDelegate.autoPlay(autoPlaySpeed);
    ```

  - `previous()` now returns the index of the previous slide and does
    not select. Change your code from this:

    ```js
    // select previous slide
    $ionicSlideBoxDelegate.previous();
    ```

    To this:

    ```js
    // select previous slide
    $ionicSlideBoxDelegate.select( $ionicSlideBoxDelegate.previous() );
    ```
  - `next()` now returns the index of the next slide and does
    not select. Change your code from this:

    ```js
    // select next slide
    $ionicSlideBoxDelegate.next();
    ```

    To this:

    ```js
    // select next slide
    $ionicSlideBoxDelegate.select( $ionicSlideBoxDelegate.next() );
    ```
2014-10-08 11:09:15 -06:00
Mathias Muller
147685c12e #2234: Fix test typo
IE11 do not have endEvent.target.classList so do not run right side of
the test
2014-10-06 10:00:25 +02:00
Perry Govier
10068e2219 chore(tap): commenting out console.log() 2014-09-26 15:57:00 -05:00
Adam Bradley
a1af665feb Merge pull request #2230 from chaffeqa/patch-2
fix(load): correctly handle window loaded states
2014-09-16 19:59:21 -05:00
chaffeqa
6b29d44ce3 Correctly handle window loaded states
Previously if this script was executed after the window was loaded, none of the callbacks would fire.

See https://developer.mozilla.org/en-US/docs/Web/API/document.readyState for definition of detecting the `load` event.

TODO: Potentially this is redundent, since maybe using `ionic.DomUtil.ready` would mean one less listener.  However I don't know if the listeners attached to `ionic.Platform.ready` require the `document.readyState` to be `complete` rather than only `interactive`.

Linked to #2229
2014-09-16 19:11:19 -04:00
chaffeqa
1f96d971f1 Correctly handle DOM Ready states
Previously, if the script was loaded while in `document.readyState` of `interactive`, the `domReady` function is never called.

See https://developer.mozilla.org/en-US/docs/Web/API/document.readyState for explanation of the proper detection of `DOMContentLoaded`
2014-09-16 19:03:35 -04:00
Adam Bradley
1c62ed7fca chore(): remove console.log 2014-09-16 00:00:08 -05:00
Adam Bradley
74de015c22 fix(keyboard): android scroll stuck
When a state change happens, ensure the keyboard is hidden. When a
keyboard is hidden, ensure all pending timers our cleared. When
resetting scrollView, ensure it’s only doing it when it has to.
For testing: #1670 #2192
2014-09-14 23:18:57 -05:00
Adam Bradley
02a29f872e style(): else on same line 2014-09-10 14:12:54 -05:00
Adam Bradley
74bc1ce17b Merge pull request #2154 from karbon001/master
refactor(keyboard): add WP8 support for keyboard show
2014-09-10 13:27:51 -05:00
Adam Bradley
77847f4963 fix(keyboard): screen.height fallback for window.innerHeight
Closes #2168
2014-09-10 12:50:51 -05:00
Perry Govier
b1f94da27e fix(platform): fullscreen method will not offset footer by 20px 2014-09-09 17:05:03 -05:00
Raymond Camden
9c370fdd3a Update platform.js
I added a bit of detail to ready function to remind folks that - in the context of a web browser - even though ready has fired it is *NOT* going to allow for device specific features. It may be too obvious, but I really think a reminder here will help.
2014-09-08 11:19:04 -05:00
Krzysztof Kawalec
2cd4156a6c Adding support for the state show in hardware keyboard for WP8. 2014-09-06 20:08:37 +02:00
Adam Bradley
150f116e53 refactor(platform): do not console.error on device get
With user agent fallbacks, its unnecessary to print out errors if the
device plugin isn’t there.
2014-09-04 23:38:01 -05:00
Adam Bradley
caf1272186 fix(scroll): remove isContentEditable from ignoreScrollStart
If an element isContentEditable, do not ignoreScrollStart incase users
are using contenteditable elements to scroll. This may have originally
been put in because it disabled text selection, and moving the text
cursor on touch. But this doesn’t seem to be the case anymore, so it
may have been put in for platform versions we no longer support. Also
fix the data-prevent-scroll dataset attribute. Closes #2091
2014-08-29 23:35:07 -05:00
Adam Bradley
df57858521 fix(menuContent): gestures do not stop_browser_behavior
The gestures which were being added to side menu content were also
adding the `disable-user-behavior` class, which disabled
contenteditable elements. Now passing in the gesture option
stop_browser_behavior=false, along with adding the options param to the
gestures service. Fixes #421
2014-08-29 22:25:55 -05:00
Andrew Smith
5f80f76376 Clone properties for contenteditable divs. Fixes #1897 2014-08-25 16:10:36 +08:00
Andrew
ce5807a022 refactor(domUtil): remove centerElementByMargin. Use flex containers. 2014-08-20 14:17:54 -06:00
Perry Govier
840c014b27 fix(item): clicks climb 5 levels looking for an item to activate, but not 6. Fixes #1921 2014-08-19 14:20:35 -05:00
Adam D Richman
c94c735de9 Fixes some misspellings in utils/dom.js 2014-08-10 21:59:03 -07:00
Adam Bradley
944d2595af fix(sideMenu): fix stopping content scrolling
When a list was within a side menu it could scroll up and down, but if
the user happened to drag a little bit on the X axis, then it would try
to open the side menu and the Y scroll of the content stopped. Closes
#1541
2014-08-07 12:22:28 -05:00
Andrew
7ddb57e60b feat(collectionRepeat): other children of ion-content element fit in
Closes #1920. Closes #1866. Closes #1380.
2014-08-06 10:32:40 -06:00
Andrew
d4b9ed44fa chore(): remove ionic animation, add collide dependency 2014-08-05 11:56:46 -06:00
Andrew
7e20424a87 test(platform): fix unit tests for setting platform to null 2014-07-21 08:22:07 -06:00
rysi3k
5da1ecd0e2 fix(scrollView): cloned input for keyboard-scroll now matches original
Closes #1721
2014-07-07 13:24:09 -06:00
Andrew
685111ef89 refactor(tap): use !! to check boolean in classList check 2014-07-07 12:28:17 -06:00
Andrew
5bf75321fc fix(tap): only check classList on tap target if it has classList
Closes #1677
2014-07-07 12:26:36 -06:00
Perry Govier
889482e048 fix(tap): fire input behavior when tap/clicking file input label. Closes #1699 2014-07-02 18:27:07 -05:00
Tim Lancina
f2f55199b9 fix(scrollView): clonedInputs get placeholder text if any 2014-06-23 11:42:58 -05:00
Adam Bradley
2e3b854658 fix(tap): get containing label of deeply nested element
The `tapContainingElement` method was not working correctly to climb up
the DOM of a clicked element to potentially find an ancestor label
element. Closes #1643
2014-06-18 15:03:52 -05:00
Tim Lancina
ad08b341ce fix(keyboard):don't setKeyboardShow on date/time inputs
Closes #1638.
2014-06-18 14:33:34 -05:00
Adam Bradley
a057734631 fix(cancelAnimationFrame): polyfill in ionic.DomUtil 2014-06-16 12:49:54 -05:00
Andy Joslin
ae8136d21d fix(utils/dom): do not add rAF polyfill to window
A pull request (#1430) was merged that added a requestAnimationFrame polyfill to
the window on platforms that do not have rAF.  This was overlooked.
This now has created conflicts with Angular 1.2.17 on Android browsers
that do not have requestAnimationFrame.

The problem was that a polyfill for requestAnimationFrame was put onto the
window for Android <4.3. AngularJS would then check if
window.requestAnimationFrame existed.  Angular's check passed, and then
it would try to use cancelAnimationFrame which was undefined.

Now, nothing on the window is changed.
2014-06-16 16:21:33 +00:00
Adam Bradley
8da9f34ba2 fix(tap): error when releasing outside of browser
Closes #1612
2014-06-12 20:23:13 -05:00
Andrew Joslin
05dd7b1864 feat(ionic.Platform): add ionic.Platform.setGrade() function
Closes #1104
2014-06-11 11:15:33 -06:00
Adam Bradley
772459df1e fix(tap): ignoreScrollStart w/ data-tap-disabled
If an element, or one of its ancestors, has the `data-tap-disabled`
attribute, then it should not start the scroll. Closes #1505
2014-06-10 10:18:18 -05:00
Adam Bradley
f5bb023ef7 fix(tap): cancel simulated click w/ hold events
Gesture hold event and ionic’s tap will both fire since the tap has no
strict duration between its start and end (a click will always fire no
matter how long the press is held). If a hold event fires from
ionic.Gesture, then the simulated click which would fire on
touchend/mouseup should be canceled.
2014-06-09 22:00:35 -05:00
Adam Bradley
a43980bbcc Merge pull request #1430 from malixsys/patch-4
fix(rAF): fixing requestAnimationFrame & cancelAnimationFrame
2014-06-05 20:01:16 -07:00
Jared Smith
e88659c6f8 fix(ionScroll): let zoom work on android devices
Closes #1440
2014-06-04 13:56:26 -06:00
Ryan Gonzalez
f02bd6c659 docs(domUtil): Correcting getParentOrSelfWithClass documentation. It previously duplicated getParentWithClass. Closes #1535 2014-06-02 12:38:05 -05:00