How to use onsenui - 10 common examples

To help you get started, we’ve selected a few onsenui examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

btpka3 / btpka3.github.com / js / angular / my-ng4 / srcBak / app / ons-ex / setup.js View on Github

ons.ready(function() {
  // ons._defaultDeviceBackButtonHandler
  ons._deviceBackButtonDispatcher.enable();
  ons._defaultDeviceBackButtonHandler = ons._deviceBackButtonDispatcher.createHandler(window.document.body, () => {
    if (Object.hasOwnProperty.call(navigator, 'app')) {
      navigator.app.exitApp();
    } else {
      console.warn('Could not close the app. Is \'cordova.js\' included?\nError: \'window.navigator.app\' is undefined.');
    }
  });
  document.body._gestureDetector = new ons.GestureDetector(document.body);

  // Simulate Device Back Button on ESC press
  if (!ons.platform.isWebView()) {
    document.body.addEventListener('keydown', function(event) {
      if (event.keyCode === 27) {
        ons._deviceBackButtonDispatcher.fireDeviceBackButtonEvent();
      }
    })

Rudloff / openvegemap / js / main.js View on Github

filtersDialog: {
                init: filtersDialogInit,
                show: filtersDialogShow
            },
            preferencesDialog: {
                init: preferencesDialogInit,
                show: preferencesDialogShow
            },
            zoomToast: {
                init: zoomToastInit
            }
        };

        // Dialogs
        ons.createAlertDialog('templates/about.html').then(initDialog);
        ons.createAlertDialog('templates/geocode.html').then(initDialog);
        ons.createAlertDialog('templates/filters.html').then(initDialog);
        ons.createAlertDialog('templates/preferences.html').then(initDialog);
        ons.createAlertDialog('templates/popup.html').then(initDialog);
        ons.createAlertDialog('templates/zoom.html').then(initDialog);
        ons.createAlertDialog('templates/hours.html').then(initDialog);

        // Map events
        map.on('zoom', checkZoomLevel);
        map.on('locationfound', newLocation);

        // Handle deep links
        if (typeof universalLinks === 'object') {
            universalLinks.subscribe(null, handleDeepLink);
        }
    }

Rudloff / openvegemap / js / main.js View on Github

preferencesDialog: {
                init: preferencesDialogInit,
                show: preferencesDialogShow
            },
            zoomToast: {
                init: zoomToastInit
            }
        };

        // Dialogs
        ons.createAlertDialog('templates/about.html').then(initDialog);
        ons.createAlertDialog('templates/geocode.html').then(initDialog);
        ons.createAlertDialog('templates/filters.html').then(initDialog);
        ons.createAlertDialog('templates/preferences.html').then(initDialog);
        ons.createAlertDialog('templates/popup.html').then(initDialog);
        ons.createAlertDialog('templates/zoom.html').then(initDialog);
        ons.createAlertDialog('templates/hours.html').then(initDialog);

        // Map events
        map.on('zoom', checkZoomLevel);
        map.on('locationfound', newLocation);

        // Handle deep links
        if (typeof universalLinks === 'object') {
            universalLinks.subscribe(null, handleDeepLink);
        }
    }

Rudloff / openvegemap / js / main.js View on Github

init: filtersDialogInit,
                show: filtersDialogShow
            },
            preferencesDialog: {
                init: preferencesDialogInit,
                show: preferencesDialogShow
            },
            zoomToast: {
                init: zoomToastInit
            }
        };

        // Dialogs
        ons.createAlertDialog('templates/about.html').then(initDialog);
        ons.createAlertDialog('templates/geocode.html').then(initDialog);
        ons.createAlertDialog('templates/filters.html').then(initDialog);
        ons.createAlertDialog('templates/preferences.html').then(initDialog);
        ons.createAlertDialog('templates/popup.html').then(initDialog);
        ons.createAlertDialog('templates/zoom.html').then(initDialog);
        ons.createAlertDialog('templates/hours.html').then(initDialog);

        // Map events
        map.on('zoom', checkZoomLevel);
        map.on('locationfound', newLocation);

        // Handle deep links
        if (typeof universalLinks === 'object') {
            universalLinks.subscribe(null, handleDeepLink);
        }
    }

Rudloff / openvegemap / js / main.js View on Github

},
            preferencesDialog: {
                init: preferencesDialogInit,
                show: preferencesDialogShow
            },
            zoomToast: {
                init: zoomToastInit
            }
        };

        // Dialogs
        ons.createAlertDialog('templates/about.html').then(initDialog);
        ons.createAlertDialog('templates/geocode.html').then(initDialog);
        ons.createAlertDialog('templates/filters.html').then(initDialog);
        ons.createAlertDialog('templates/preferences.html').then(initDialog);
        ons.createAlertDialog('templates/popup.html').then(initDialog);
        ons.createAlertDialog('templates/zoom.html').then(initDialog);
        ons.createAlertDialog('templates/hours.html').then(initDialog);

        // Map events
        map.on('zoom', checkZoomLevel);
        map.on('locationfound', newLocation);

        // Handle deep links
        if (typeof universalLinks === 'object') {
            universalLinks.subscribe(null, handleDeepLink);
        }
    }

Rudloff / openvegemap / js / main.js View on Github

init: preferencesDialogInit,
                show: preferencesDialogShow
            },
            zoomToast: {
                init: zoomToastInit
            }
        };

        // Dialogs
        ons.createAlertDialog('templates/about.html').then(initDialog);
        ons.createAlertDialog('templates/geocode.html').then(initDialog);
        ons.createAlertDialog('templates/filters.html').then(initDialog);
        ons.createAlertDialog('templates/preferences.html').then(initDialog);
        ons.createAlertDialog('templates/popup.html').then(initDialog);
        ons.createAlertDialog('templates/zoom.html').then(initDialog);
        ons.createAlertDialog('templates/hours.html').then(initDialog);

        // Map events
        map.on('zoom', checkZoomLevel);
        map.on('locationfound', newLocation);

        // Handle deep links
        if (typeof universalLinks === 'object') {
            universalLinks.subscribe(null, handleDeepLink);
        }
    }

Rudloff / openvegemap / js / main.js View on Github

},
            filtersDialog: {
                init: filtersDialogInit,
                show: filtersDialogShow
            },
            preferencesDialog: {
                init: preferencesDialogInit,
                show: preferencesDialogShow
            },
            zoomToast: {
                init: zoomToastInit
            }
        };

        // Dialogs
        ons.createAlertDialog('templates/about.html').then(initDialog);
        ons.createAlertDialog('templates/geocode.html').then(initDialog);
        ons.createAlertDialog('templates/filters.html').then(initDialog);
        ons.createAlertDialog('templates/preferences.html').then(initDialog);
        ons.createAlertDialog('templates/popup.html').then(initDialog);
        ons.createAlertDialog('templates/zoom.html').then(initDialog);
        ons.createAlertDialog('templates/hours.html').then(initDialog);

        // Map events
        map.on('zoom', checkZoomLevel);
        map.on('locationfound', newLocation);

        // Handle deep links
        if (typeof universalLinks === 'object') {
            universalLinks.subscribe(null, handleDeepLink);
        }
    }

Rudloff / openvegemap / js / main.js View on Github

show: filtersDialogShow
            },
            preferencesDialog: {
                init: preferencesDialogInit,
                show: preferencesDialogShow
            },
            zoomToast: {
                init: zoomToastInit
            }
        };

        // Dialogs
        ons.createAlertDialog('templates/about.html').then(initDialog);
        ons.createAlertDialog('templates/geocode.html').then(initDialog);
        ons.createAlertDialog('templates/filters.html').then(initDialog);
        ons.createAlertDialog('templates/preferences.html').then(initDialog);
        ons.createAlertDialog('templates/popup.html').then(initDialog);
        ons.createAlertDialog('templates/zoom.html').then(initDialog);
        ons.createAlertDialog('templates/hours.html').then(initDialog);

        // Map events
        map.on('zoom', checkZoomLevel);
        map.on('locationfound', newLocation);

        // Handle deep links
        if (typeof universalLinks === 'object') {
            universalLinks.subscribe(null, handleDeepLink);
        }
    }

OnsenUI / OnsenUI / bindings / angular2 / src / directives / ons-splitter.ts View on Github

_createPageLoader() {
    const componentRefMap:WeakMap&gt; = new WeakMap&gt;();

    return new ons.PageLoader(
      ({page, parent, params}: any, done: Function) =&gt; {
        const injector = Injector.create({
          providers: [
            {provide: Params, useValue: new Params(params || {})},
            {provide: OnsSplitterContent, useValue: this}
          ],
          parent: this._injector
        });

        const factory = this._resolver.resolveComponentFactory(page);
        const pageComponentRef = this._viewContainer.createComponent(factory, 0, injector);
        const pageElement = pageComponentRef.location.nativeElement;
        componentRefMap.set(pageElement, pageComponentRef);

        this.element.appendChild(pageElement); // dirty fix to insert in correct position

OnsenUI / OnsenUI / bindings / angular2 / src / directives / ons-splitter.ts View on Github

_createPageLoader() {
    const componentRefMap:WeakMap&gt; = new WeakMap&gt;();

    return new ons.PageLoader(
      ({page, parent, params}: any, done: Function) =&gt; {
        this._zone.run(() =&gt; {
          const injector = Injector.create({
            providers: [
              {provide: Params, useValue: new Params(params || {})},
              {provide: OnsSplitterSide, useValue: this}
            ],
            parent: this._injector
          });

          const factory = this._resolver.resolveComponentFactory(page);
          const pageComponentRef = this._viewContainer.createComponent(factory, 0, injector);
          const pageElement = pageComponentRef.location.nativeElement;
          componentRefMap.set(pageElement, pageComponentRef);

          this.element.appendChild(pageElement); // dirty fix to insert in correct position

How to use onsenui - 10 common examples

To help you get started, we’ve selected a few onsenui examples, based on popular ways it is used in public projects.

onsenui

Package Health Score

Popular onsenui functions

Similar packages