Navigation

    Monaca & Onsen UI
    • Register
    • Login
    • Search
    • Tags
    • Users
    • Blog
    • Playground
    1. Home
    2. jcdenton
    J
    • Flag Profile
    • Profile
    • Following
    • Followers
    • Blocks
    • Topics
    • Posts
    • Best
    • Groups
    Save
    Saving

    jcdenton

    @jcdenton

    3
    Reputation
    27
    Posts
    2175
    Profile views
    0
    Followers
    0
    Following
    Joined Last Online
    Website students.ceid.upatras.gr/~besarat

    jcdenton Follow

    Posts made by jcdenton

    • RE: Onsen error on app start

      @munsterlander , @Yudhi-Darmawan
      Thanks for the response.

      Actually in all my projects I load Onsen and the rest of .js files at the end with no issues at all.
      The issues appeared after updating Onsen to latest versions but I managed to fix it without moving the declaration of the js files, but by changing how I organized Onsen components in my html files ( split and separate them in files).

      The errors were appearing only when I was using the tabbar component.

      posted in Developer Corner
      J
      jcdenton
    • Lexicon app for people who live in Sweden

      Lexin is well known tranlating service in Sweden!

      LexiconMe is an app for iOS and Android built with Onsen, which uses this service. This app is suitable for people who live in Sweden because of their work or university etc. but they are not from there.

      • Find and save words for offline use
      • Multilingual support

      LexiconMe will be extended (currently in development) to an advanced language assistant service that will include tests using efficient learning methods such as Leitner System (flashcards).

      If someone believes that this app can help him then download it and share your feedback

      Android: https://play.google.com/store/apps/details?id=gr.lexicon.team&hl=en
      iOS : https://itunes.apple.com/gr/app/lexiconme/id1171904585?mt=8

      posted in Showcase
      J
      jcdenton
    • An (recommendation) app for tv shows

      Hello,

      I worked with a team a few months ago and we built an application for tv series called tvSeeker! try it out if you like and share your feedback.

      Find information and add shows to your collection and tvSeeker will send notifications prior to airdate of each show. Apart from the basics tvSeeker applies simple maths to recommend (offline) shows based on your tastes. Now we are in the process of building a more advanced online recommendation service.

      Google play link: https://play.google.com/store/apps/details?id=shows.uniteam.gr&hl=en

      posted in Showcase
      J
      jcdenton
    • Onsen error on app start

      1 error :
      Uncaught (in promise) TypeError: Cannot read property ‘_compileAndLink’ of undefined at Object.window.ons.TabbarElement.rewritables.link

      2 error :
      Uncaught (in promise) TypeError: Cannot read property ‘_link’ of undefined

      0_1476817774842_Screen Shot 2016-10-18 at 22.06.32.png

      Starting page is defined like this:

      <!DOCTYPE html>
      <html ng-app="app">
          <head>
              <meta http-equiv="Content-Security-Policy" content="default-src * gap://ready; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"><!-- default-src 'self' gap://ready -->
              <meta name="format-detection" content="telephone=no">
              <meta name="msapplication-tap-highlight" content="no">
              <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
              <link rel="stylesheet" type="text/css" href="css/font_awesome/css/font-awesome.min.css">
              <link rel="stylesheet" type="text/css" href="css/ionicons/css/ionicons.min.css">
              <link rel="stylesheet" type="text/css" href="css/material-design-iconic-font/css/material-design-iconic-font.min.css">
              <link rel="stylesheet" type="text/css" href="css/onsenui.css"/>
              <link rel="stylesheet" href="css/onsen-css-components-dark-theme.css">
              <link rel="stylesheet" href="css/app.css"/>
              <title>Title</title>
          </head>
          <body>
      
          <ons-page>
              <!--<ons-toolbar>{{}}</ons-toolbar>-->
              <ons-tabbar position="auto" animation="slide">
                  <ons-tab page="templates/live.html" icon="ion-university, material:md-graduation-cap" label="Page1" active></ons-tab>
                  <ons-tab page="templates/program.html" icon="ion-ios-calendar, material:md-calendar" label="Page2"></ons-tab>
                  <ons-tab page="templates/social.html" icon="ion-share, material:md-share" label="Page3"></ons-tab>
              </ons-tabbar>
          </ons-page>
      
              <script type="text/javascript" src="js/onsenui.min.js"></script>
              <script type="text/javascript" src="js/angular.min.js"></script>
              <script type="text/javascript" src="js/angular-onsenui.min.js"></script>
              <script type="text/javascript" src="cordova.js"></script>
      		<script src="js/app.js"></script>
      		<script src="js/appServices.js"></script>
          </body>
      </html>
      

      each page (tab-item) is in a different html file.

      Why Onsen throws these errors?

      Thanks in advance

      posted in Developer Corner
      J
      jcdenton
    • Onsen calendar using carousel

      Hello,

      I am trying to create a calendar for my application. I have found this directive :
      https://github.com/twinssbc/AngularJS-ResponsiveCalendar

      which works really well and they have created a version of the same directive for Ionic framework:
      https://github.com/twinssbc/Ionic-Calendar

      I managed to convert the latter to work with OnsenUI. The thing is that the directive keeps only 3 carousel items and as you swipe left or right it computes the adjacent months/days/weeks and refreshes.

      In Ionic you can add a property to tell to the carousel to always loop (like infinite carousel). That way there are only 3 carousel items but you can loop continuously around them. How can the same behavior be achieved in Onsen?

      here is the CodePen link of the directive working with OnsenUI: https://codepen.io/jc86/pen/dpZBXV

      posted in Developer Corner
      J
      jcdenton
    • RE: ons-popover use page controller or pass controller $scope

      @Fran-Diox Ok… I see, I did not set the target at all!
      thanks again

      posted in Developer Corner
      J
      jcdenton
    • RE: ons-popover use page controller or pass controller $scope

      @Fran-Diox, Apart from the $scope issue, it seems when using the popover from template I am getting Error: Invalid target exception.

      I changed the popover code in the tutorial to match the one of the dialogs (but using popover instead) to see if the popover will show in browser (in case something is wrong in my setup) but it throws the same error again. Check this codePen to see the error yourself.

      Thanks in advance

      posted in Developer Corner
      J
      jcdenton
    • RE: ons-popover use page controller or pass controller $scope

      @Fran-Diox Thanks for your response. I’ ve seen the tutorial, but my problem is that I don’t use $scope in my controller and passing the variable that holds the controller (i.e var vm = this;) like this : ons.createPopover('languagesPop.html',{ parentScope: vm }) is not working.

      posted in Developer Corner
      J
      jcdenton
    • ons-popover use page controller or pass controller $scope

      I have this page:

      <div ng-controller="pageController as ctrl">
      <ons-page>
              <ons-toolbar>
                  <div class="left">
                      <ons-toolbar-button ng-click="menu.left.open()" modifier="material"><ons-icon icon="md-menu" size="24px"></ons-icon></ons-toolbar-button>
                  </div>
                  <div class="center">Title</div>
                  <div class="right">
                      <ons-toolbar-button modifier="material" ng-click="popover.show($event)"><ons-icon icon="md-more-vert" size="24px"></ons-icon></ons-toolbar-button>
                  </div>
              </ons-toolbar>
              <ons-list>
                  <ons-list-item ons-lazy-repeat="ctrl.delegate">
                      <div class="center">
                          {{ item}}
                      </div>
                  </ons-list-item>
              </ons-list>
          </ons-page>
      
          <ons-popover cancelable cover-target direction="down" var="popover">
              <ons-list>
                  <ons-list-item ng-repeat="lang in ctrl.langs">
                      {{lang}}
                  </ons-list-item>
              </ons-list>
          </ons-popover>
      </div>
      

      The obvious reason I wrap the page and popover element inside a div is to share the same controller. It’s working but It doesn’t feel right.

      In the above example, I am using controllerAs syntax and saving the controller (this) to a variable (i.e var vm = this;).
      How can the popover access the page’s controller variables and functions using this syntax? (In dialogs, I can pass the $scope variable as option to have the desired behavior). No matter what I’ve tried, I couldn’t get to a nice solution.

      Thanks in advance.

      posted in Developer Corner
      J
      jcdenton
    • RE: How to Disable same page load on ons-splitter-side

      @Fran-Diox ok thanks! Will check it out.

      posted in Onsen UI
      J
      jcdenton