Commit Graph

32 Commits

Author SHA1 Message Date
Andy Joslin
986dbac893 refactor(ionList): more expressive, declarative (breaking change)
Closes #1024.

BREAKING CHANGE: ion-list syntax has changed in favor of simplicity &
flexibility.

Relevant documentation:
[ionList](http://ionicframework.com/docs/api/directive/ionList),
[ionItem](http://ionicframework.com/docs/api/directive/ionItem),
[ionOptionButton](http://ionicframework.com/docs/api/directive/ionOptionButton),
[ionReorderButton](http://ionicframework.com/docs/api/directive/ionReorderButton),
[ionDeleteButton](http://ionicframework.com/docs/api/directive/ionDeleteButton),
[$ionicListDelegate](http://ionicframework.com/docs/api/service/$ionicListDelegate).

To migrate, change your code from this:

```html
<ion-list option-buttons="[{text:'hello',type:'button-positive',onTap:tap()}]"
          on-delete="onDelete(el)"
          delete-icon="ion-minus-circled"
          can-delete="true"
          show-delete="shouldShowDelete"
          on-reorder="onReorder(el, startIndex, toIndex)"
          reorder-icon="ion-navicon"
          can-reorder="true"
          show-reorder="shouldShowReorder">
  <ion-item ng-repeat="item in items">
    {{item}}
  </ion-item>
</ion-list>
```

To this:

```html
<ion-list show-delete="shouldShowDelete"
          show-reorder="shouldShowReorder">
  <ion-item ng-repeat="item in items">
    {{item}}
    <ion-delete-button class="ion-minus-circled"
                       ng-click="onDelete(item)">
    </ion-delete-button>
    <ion-reorder-button class="ion-navicon"
                       ng-click="onReorder(item, $fromIndex, $toIndex)">
    </ion-reorder-button>
    <ion-option-button class="button-positive" ng-click="tap()">
      Hello
    </ion-option-button>
  </ion-item>
</ion-list>
```
2014-04-04 10:12:16 -06:00
flmu
f847c20847 feat($ionicScrollDelegate): add scrollBy(left,top,animate) to delegate
Closes #987
2014-03-31 05:43:13 -06:00
Andy Joslin
d2bdf4302b refactor(): remove deprecated $parse dependency from controllers 2014-03-25 07:48:26 -06:00
Andy Joslin
dd13e986d1 docs(ionScrollController): fix typo (s/scroll/scrollTo) 2014-03-25 07:46:05 -06:00
Andy Joslin
c6dec3c472 refactor(delegates): s/getByHandle/$getByHandle for clarity 2014-03-24 20:51:14 -06:00
Andy Joslin
5567b08c4b delegates: add tabbar, update docs 2014-03-24 20:35:55 -06:00
Andy Joslin
621a355706 docs: update delegate docs to be more concise & clear 2014-03-24 19:40:10 -06:00
Andy Joslin
ffeaab5adc ionSlideBox: add $ionicSlideBoxDelegate with new features 2014-03-24 19:40:10 -06:00
Andy Joslin
0658699338 refactor(Delegate): use forHandle method 2014-03-24 16:58:15 -06:00
Andy Joslin
c276545180 ionSideMenu: add $ionicSideMenuDelegate with new features 2014-03-24 16:48:59 -06:00
Andy Joslin
c1d2571d5e scroll: add $ionicScrollDelegate with new pattern
Addresses #877
2014-03-24 15:58:22 -06:00
Andy Joslin
38acea337a refactor(controllers): assign to parent scope if possible 2014-03-21 10:08:09 -05:00
Andy Joslin
4e1140702b ionicScrollController: do not try to remember scorll if no viewId 2014-03-19 16:51:34 -06:00
Andy Joslin
b6a73f0807 test(ionicScrollController): fix PhantomJS weirdness 2014-03-19 13:25:35 -06:00
Andy Joslin
abe9e65c6f docs(ionicScrollController): make rememberScrollPosition example clearer 2014-03-19 13:06:35 -06:00
Andy Joslin
245e2199c6 docs(ionicScrollController): write docs 2014-03-19 12:21:18 -06:00
Andy Joslin
dbe4e3901d feat(ionic): remove all delegates
BREAKING CHANGE: $ionicScrollDelegate, $ionicSlideBoxDelegate, and
$ionicSideMenuDelegate have been removed.

  - $ionicScrollDelegate has been changed to $ionicScrollController.
    Documentation:
    [ionContent](
    http://ajoslin.github.io/docs/nightly/api/directive/ionContent),
    [ionScroll](
    http://ajoslin.github.io/docs/nightly/api/directive/ionScroll)

    Change your code from this:

    ```html
    <ion-content ng-controller="MyCtrl">
      <button ng-click="scrollBottom()">Scroll to bottom!</button>
    </ion-content>
    ```
    ```js
    function MyCtrl($scope, $ionicScrollDelegate) {
      $scope.scrollBottom = function() {
        $ionicScrollDelegate.scrollBottom();
      };
    }
    ```

    To this:

    ```html
    <!-- optional attr controller-bind, see docs -->
    <ion-content ng-controller="MyCtrl">
      <button ng-click="scrollBottom()">Scroll to bottom!</button>
    </ion-content>
    ```
    ```js
    function MyCtrl($scope) {
      $scope.scrollBottom = function() {
        $scope.$ionicScrollController.scrollBottom();
      };
    }
    ```

  - $ionicSideMenuDelegate has been changed to
    $ionicSideMenusController. Documentation:
    [ionSideMenus](http://ajoslin.github.io/docs/nightly/api/directive/ionSideMenus)

    Change your code from this:

    ```html
    <ion-side-menus>
      <ion-side-menu side="left">Side Menu Left</ion-side-menu>
      <ion-pane ion-side-menu-content ng-controller="MyCtrl">
        <button ng-click="toggleLeftMenu()">
          Toggle Left Menu!
        </button>
      </ion-pane>
    </ion-side-menus>
    ```
    ```js
    function MyCtrl($scope, $ionicSideMenuDelegate) {
      $scope.toggleLeftMenu = function() {
        $ionicSideMenuDelegate.toggleLeft();
      };
    }
    ```

    To this:

    ```html
    <!-- optional attr controller-bind, see documentation -->
    <ion-side-menus>
      <ion-side-menu side="left">Side Menu Left</ion-side-menu>
      <ion-pane ion-side-menu-content ng-controller="MyCtrl">
        <button ng-click="toggleLeftMenu()">
          Toggle Left Menu!
        </button>
      </ion-pane>
    </ion-side-menus>
    ```
    ```js
    function MyCtrl($scope) {
      $scope.toggleLeftMenu = function() {
        $scope.$ionicSideMenuController.toggleLeft();
      };
    }
    ```

  - $ionicSlideBoxDelegate has been removed and upgraded to
    $ionicSlideBoxController. It had only one method that
    was unneeded.  [Documentation](
    http://ajoslin.github.io/docs/nightly/api/directive/ionSlideBox)
2014-03-19 11:51:07 -06:00
Andy Joslin
5a0efecef6 feat($ionicScrollDelegate): rememberScrollPosition, scrollToRememberedPosition
/**
 * @ngdoc method
 * @name $ionicScrollDelegate#rememberScrollPosition
 * @description
 *
 * When this scroll area is destroyed, its last scroll position will be
 * saved using the given id.
 *
 * @param {string} id The identifier for this saved scroll position.
 */

/**
 * @ngdoc method
 * @name $ionicScrollDelegate#scrollToRememberedPosition
 * @description
 *
 * If a scroll position was remembered using the given id, loads the
 * remembered scroll position and scrolls there.
 *
 * @param {string} id The identifier for this saved scroll position.
 * @param {boolean=} shouldAnimate Whether to animate the scroll.
 */
2014-03-17 08:39:23 -06:00
Andy Joslin
cc0a4ef775 test(sideMenu2): update test to reflect changes 2014-03-17 07:48:56 -06:00
Andy Joslin
4715a118e0 refactor($ionicScrollDelegate): make it a factory from current scope
BREAKING CHANGE: $ionicScrollDelegate no longer works globally; you must
create a new instance of each time you use it.  The actual methods on
each instance of $ionicScrollDelegate are the same, however.

Change your code from this:

```js
function MyController($scope, $ionicScrollDelegate) {
  $scope.scrollTop = function() {
    $ionicScrollDelegate.scrollTop();
  };
}
```

To this:

```js
function MyController($scope, $ionicScrollDelegate) {
  var delegate = $ionicScrollDelegate($scope);
  $scope.scrollTop = function() {
    delegate.scrollTop();
  };
}
```
2014-03-17 07:21:20 -06:00
Andy Joslin
4980d09fb3 refact(ionContent): make docs match src 2014-03-11 19:34:30 -06:00
Andy Joslin
69e54fe44e chore(ionicScrollController): remove accidental test-code 2014-03-11 16:49:29 -06:00
Andy Joslin
573df56db4 feat(ionRefresher): allow custom text & icons
Closes #760

BREAKING CHANGE: on-refresh and on-refresh-opening are no longer on the
ion-content directive.  They are on the ion-refresher. In addition,
on-refresh-opening has been renamed to on-pulling.

Change your code from this:

```html
<ion-content on-refresh="onRefresh()"
  on-refresh-opening="onRefreshOpening()">
  <ion-refresher></ion-refresher>
</ion-content>
```

To this:

```html
<ion-content>
  <ion-refresher on-refresh="onRefresh()"
    on-pulling="onRefreshOpening()">
  </ion-refresher>
</ion-content>
```
2014-03-11 16:40:12 -06:00
Andy Joslin
f9766fcf16 docs(): Add docs for ionicViewState, polish other docs 2014-03-10 21:16:09 -06:00
Andy Joslin
b406305b19 refactor(ionicContent): use $-prefix for onRefresh and onScroll events
Closes #675
2014-02-25 11:18:25 -05:00
Adam Bradley
a5471aeeb5 change classList fallback for multiple args 2014-02-18 22:58:21 -06:00
Adam Bradley
42f39bbf3c remove two classNames in one call 2014-02-18 20:34:12 -06:00
Andy Joslin
a5d964734f fix(scrollView): fix error from checking device before ready 2014-02-17 11:57:20 -05:00
Andy Joslin
9327ac71c7 fix(android): when keyboard comes up, ensure input is in view
This requires us to set fullscreen="false" in our cordova apps.

Uses the resize event to determine when the keyboard has been shown,
then broadcasts an event from the activeElement: 'scrollChildIntoView',
which is caught by the nearest parent scrollView.  The scrollView will
then see if that element is within the new device's height (since the
keyboard resizes the screen), and if not scroll it into view.

Additionally, when the keyboard resizes the screen we add a
`.hide-footer` class to the body, which will hide tabbars and footer
bars while the keyboard is opened.

For now, this is android only.

Closes #314.
2014-02-12 09:45:35 -05:00
Andy Joslin
c119498d1b feat($ionicScrollDelegate): add scrollTo(left,top,animate) to delegate
Also moves $ionicScrollDelegate.register to $ionicScroll controller,
and makes `<scroll>` directive be registered with $ionicScrollDelegate.
2014-02-11 13:40:45 -05:00
Andy Joslin
c41e5371e7 refactor(scroll): make refresher be detected after timeout 2014-02-07 12:07:41 -05:00
Andy Joslin
7f4b28d9da feat(list): reordering scrolls page, reordering performance better
Fixes #521. Reordering now uses webkitTransform instead of
element.style.left.  Additionally, as you drag the drag-element to the
top or bottom of the scroll-area, it will scroll it up or down as
allowed.

Refactors necessary: Common code from `<content>` and `<scroll>` moved
into js/ext/angular/controllers/ionicScrollController.  Then `<content>`
and `<scroll>` expose the controller, and `<list>` can require it.

`<list>` then uses the controller (if exists) to pass the scrollView and
scrollEl to ReorderDrag, and ReorderDrag uses that to scroll.

Additionally, js/ext/angular/test/controller/ionicScrollController tests
much functionality that was untested before.
2014-02-06 15:04:23 -05:00