在付费模板上的onesignal cordova插件

时间:2018-02-27 16:38:20

标签: javascript cordova android-studio cordova-plugins onesignal

嘿,我会为cordova原生应用购买此模板。 https://codecanyon.net/item/playtube-youtube-full-mobile-application/18014341

我想添加一些信号插件。我阅读了信号指南,它说我添加了这段代码

2.1. Add the following to the bottom of the first javascript file that loads with your app.

This is <project-dir>/www/js/index.js for most Cordova projects.
Cordova

&#13;
&#13;
 // Add to index.js or the first page that loads with your app.
// For Intel XDK and please add this to your app.js.

document.addEventListener('deviceready', function () {
  // Enable to debug issues.
  // window.plugins.OneSignal.setLogLevel({logLevel: 4, visualLevel: 4});
  
  var notificationOpenedCallback = function(jsonData) {
    console.log('notificationOpenedCallback: ' + JSON.stringify(jsonData));
  };

  window.plugins.OneSignal
    .startInit("YOUR_APPID")
    .handleNotificationOpened(notificationOpenedCallback)
    .endInit();
  
  // Call syncHashedEmail anywhere in your app if you have the user's email.
  // This improves the effectiveness of OneSignal's "best-time" notification scheduling feature.
  // window.plugins.OneSignal.syncHashedEmail(userEmail);
}, false);
&#13;
&#13;
&#13;

但我不能这样做,因为在我的模板的app.js中没有deviceready func。 这是我的app.js

&#13;
&#13;
(function () {

  "use strict";

  var serverURL = 'http://sehirdegundem.net/server/';

  // Return the number of elements of an object
  function objectLength(obj) {
    var result = 0;
    for(var prop in obj) {
      if (obj.hasOwnProperty(prop)) {
        result++;
      }
    }
    return result;
  }

  // Return fusion of two objects
  function extend(a, b){
    for(var key in b)
        if(b.hasOwnProperty(key))
            a[key] = b[key];
    return a;
  }

  // Preload all of the images, and display the videos in the DOM
  function preload(videos){
    var posts_to_load = objectLength(videos);
    var posts_loaded = 0;

    $$.each(videos, function(index, video){
      var thumbnail = new Image();
      thumbnail.onload = function () {
        posts_loaded = posts_loaded + 1;
        if(posts_loaded == posts_to_load){
          displayVideos(videos);
        }
      };
      thumbnail.src = video.thumbnail;
    });
  }

  // Display the videos in the DOM
  function displayVideos(videos){
    $$.each(videos, function(index, video) {
      $$('#post-list').append(
        '<li>'+
          '<a href="video.html?idvideo='+ video.id +'">'+
            '<div class="post-thumbnail"><img src="'+video.thumbnail+'" alt=""></div>'+
            '<div class="post-infos">'+
              '<div class="post-title">'+
                '<span>'+video.title+'</span>'+
              '</div>'+
              '<div class="post-views"><i class="icon-demo icon-eye"></i>'+ video.views + ' görüntüleme</div>'+
              '<div class="post-date"><i class="ion-android-time"></i>'+video.date+' yüklendi</div>'+
            '</div>'+
          '</a>'+
        '</li>'
      );
    });
  }

  // Display the comments in the DOM
  function displayComments(comments){
    $$.each(comments, function(index, comment){
      $$('#comment-list').append(
        '<li>'+
          '<img class="comment-avatar" src="'+comment.avatar+'" onerror="this.src = \'img/avatar-default.jpg\';">'+
          '<div class="comment-details">'+
            '<span class="comment-author">'+comment.username+'</span>'+
            '<span class="comment-date">'+comment.date+'</span>'+
            '<span class="comment-content">'+comment.comment+'</span>'+
            '<span class="comment-likes"><i class="demo-icon icon-thumbs-up"></i> '+comment.likes+'</span>'+
          '</div>'+
        '</li>'
      );
    });
  }

  // Display a message in the main view when the user is not connected to Internet
  function noConnexion(){
    $$('#post-list').html('<div class="no-connexion"><i class="icon ion-wifi"></i>İnternet Bağlantısı Yok<p>İnternet bağlantınızın olduğundan emin olduktan sonra yenilemek için aşağı doğru hızlıca çekin</p></div>');
  }

  // Check if it's a correct email
  function validateEmail(email) {
    var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    return re.test(email);
  }

  var app = new Framework7;
  var $$ = Dom7;
  var viewMain = app.addView('#view-main');
  var pullToRefreshPosts = $$('#content-posts');

  var cachedPosts = [];
  var nextPageToken = '';

  var isLoading = false;
  var isInfiniteScroll = true;

  var currentPlaylistID = '';
  
  

  // At the opening of the application, retrieves videos
  $$.ajax({
    url: serverURL + 'getVideos.php',
    dataType: 'json',
    timeout: 8000,
    success: function(result){

      cachedPosts = result.videos;
      nextPageToken = result.nextPageToken;

      preload(result.videos);

      // If they are the last videos
      if(result.nextPageToken == 'end'){
        // Remove the infinite scroll
        app.detachInfiniteScroll($$('#content-posts'));
        $$('#infinite-loader').remove();
        isInfiniteScroll = false;
      }
    },
    error: function(){
      noConnexion();
    }
  });


  // When pullToRefresh is called
  pullToRefreshPosts.on('refresh', function (e) {
    $$.ajax({
      url: serverURL + 'getVideos.php?playlistid=' + currentPlaylistID,
      dataType: 'json',
      timeout: 8000,
      success: function(result){

        // If there are no new videos
        if (typeof myVar != "undefined") {
          if(cachedPosts[Object.keys(cachedPosts)[0]].id == result.videos[Object.keys(result.videos)[0]].id){
            app.pullToRefreshDone(pullToRefreshPosts);
          }
        }
        else{

          cachedPosts = result.videos;
          nextPageToken = result.nextPageToken;

          $$('#post-list').html('');
          preload(result.videos);
          app.pullToRefreshDone(pullToRefreshPosts);

          if(result.nextPageToken == 'end'){
            app.detachInfiniteScroll($$('#content-posts'));
            $$('#infinite-loader').remove();
            isInfiniteScroll = false;
          }
        }
      },
      error: function(){
        noConnexion();
        app.pullToRefreshDone(pullToRefreshPosts);
      }
    });
  });

  // When infiniteScroll is called
  $$('#content-posts').on('infinite', function () {
    // Exit, if infiniteLoadingInterviews in progress
    if (isLoading) return;
    isLoading = true;

    // Retrives next videos with the token
    $$.ajax({
      url: serverURL + 'getVideos.php?playlistid=' + currentPlaylistID + '&token=' + nextPageToken,
      dataType: 'json',
      timeout: 8000,
      success: function(result){

        // Add videos to the local array
        cachedPosts = extend(cachedPosts, result.videos);
        nextPageToken = result.nextPageToken;

        // Display videos
        preload(result.videos);

        if(result.nextPageToken == 'end'){
          app.detachInfiniteScroll($$('#content-posts'));
          $$('#infinite-loader').remove();
          isInfiniteScroll = false;
        }
        isLoading = false;
      },
      error: function(){
        noConnexion();
        isLoading = false;
      }
    });
  });

  var commentsLoading = false;
  var nextPageTokenComments = '';

  // When a post video is openened
  app.onPageInit('video', function(page){

    commentsLoading = true;

    $$('#view-main .back-hidden').toggleClass('back-hidden back-visible');

    // Id of the video
    var videoID = page.query.idvideo;

    // Replace elements on the video page
    $$('#content-video .page-video-title').html(cachedPosts[videoID].title);
    $$('#content-video .page-video-views').html(cachedPosts[videoID].views+' views');
    $$('#content-video .page-video-likes-count').html(cachedPosts[videoID].likes);
    $$('#content-video .page-video-dislikes-count').html(cachedPosts[videoID].dislikes);
    $$('#content-video .page-video-progress').attr({
      max: parseInt(cachedPosts[videoID].likes.replace(/ /g, '')) + parseInt(cachedPosts[videoID].dislikes.replace(/ /g, '')),
      value: parseInt(cachedPosts[videoID].likes.replace(/ /g, '')) + parseInt(cachedPosts[videoID].dislikes.replace(/ /g, '')) - parseInt(cachedPosts[videoID].dislikes.replace(/ /g,""))
    });
    $$('#content-video .page-video-username').html(cachedPosts[videoID].username);
    $$('#content-video .page-video-date').html(cachedPosts[videoID].date);
    $$('#content-video .page-video-description').html(cachedPosts[videoID].description);
    $$('#content-video #video-iframe').attr('src', 'https://www.youtube.com/embed/'+videoID+'?autoplay=0&controls=0&showinfo=0&rel=0');
    $$('#content-video .page-video-comments-count').html(cachedPosts[videoID].comments);

    // Retrieves comments
    $$.ajax({
      url: serverURL + 'getComments.php?videoID='+videoID,
      dataType: 'json',
      timeout: 8000,
      success: function(result){
        nextPageTokenComments = result.nextPageToken;
        displayComments(result.comments);
        commentsLoading = false;
        // If they are the last comments
        if(result.nextPageToken == 'end'){
          app.detachInfiniteScroll($$('#content-video'));
          $$('#infinite-loader-comments').remove();
        }
      },
      error: function(){
        commentsLoading = false;
      }
    });

    // When comments infinite scroll is triggered
    $$('#content-video').on('infinite', function () {
      if (commentsLoading) return;
      commentsLoading = true;

      // Retrieves next comments
      $$.ajax({
        url: serverURL + 'getComments.php?videoID=' + videoID + '&token='+nextPageTokenComments,
        dataType: 'json',
        timeout: 8000,
        success: function(result){
          nextPageTokenComments = result.nextPageToken;
          displayComments(result.comments);
          commentsLoading = false;

          if(result.nextPageToken == 'end'){
            app.detachInfiniteScroll($$('#content-video'));
            $$('#infinite-loader-comments').remove();
          }
        },
        error: function(){
          commentsLoading = false;
        }
      });
    });
  });

  // When back arrow is clicked
  app.onPageBack('video', function(e){
    $$('#view-main .back-visible').toggleClass('back-hidden back-visible');
  });

  // At the opening of the app, retrieves user infos (for about page and playlists)
  $$.ajax({
    url: serverURL + 'getUserInfos.php',
    dataType: 'json',
    timeout: 8000,
    success: function(result){

      /****** About page *******/

      $$('#view-about .about-author').html(result.title);
      $$('#view-about .about-website-text').html(result.website);
      $$('#view-about .about-followers .about-count').html(result.subscriberCount);
      $$('#view-about .about-videos .about-count').html(result.videoCount);
      $$('#view-about .about-views .about-count').html(result.viewCount);
      $$('#view-about .about-description').html(result.description);

      var social = result.social;
      for(var network in social){
        var url = social[network];
        $$('#view-about .about-icons').append('<a href="' + url + '" class="external" target="_blank"><i class="icon ion-' + network + '"></i></a>');
      }

      /****** Playlists *******/

      // Add the playlists
      $$('#playlists').append('<a id="'+result.playlistId+'"><li class="all-videos">Tüm Videolar</a>');
      $$.each(result.playlists, function(index, playlist){
        $$('#playlists').append('<a id="'+playlist.id+'"><li>'+playlist.title + ' <span class="playlist-count">(' + playlist.count + ')</span></li></a>');
      });

      // When a playlist is clicked
      $$('#playlists a').on('click', function(){
        app.closePanel();

        // If we are in the video page, then go back
        if($$('.navbar-inner .left').hasClass('back-visible')){
          viewMain.router.back();
        }

        currentPlaylistID = $$(this).attr('id');

        // If the infinite preloaded was removed previously, then we add it again
        if(!isInfiniteScroll){
          app.attachInfiniteScroll($$('#content-posts'));
          isInfiniteScroll = true;
          $$('#content-posts').append('<span id="infinite-loader" class="preloader"></span>');
        }

        // Retrieves the playlist videos
        $$('#post-list').html('');
        $$.ajax({
          url: serverURL + 'getVideos.php?playlistid=' + $$(this).attr('id'),
          dataType: 'json',
          timeout: 8000,
          success: function(result){

            cachedPosts = result.videos;
            nextPageToken = result.nextPageToken;

            preload(result.videos);

            if(result.nextPageToken == 'end'){
              app.detachInfiniteScroll($$('#content-posts'));
              $$('#infinite-loader').remove();
              isInfiniteScroll = false;
            }
          },
          error: function(){
            console.log("Make sure your are connected to Internet");
          }
        });
      });
    },
    error: function(){
      console.log("Make sure your are connected to Internet");
    }
  });


  // Contact form
  $$('#contact-submit').on('click', function(){
    // Check if one or more fields are empty
    if($$('#contact-name').val() == '' || $$('#contact-email').val() == '' || $$('#contact-subject').val() == '' || $$('#contact-message').val() == ''){
      if($$('#contact-name').val() == ''){
        $$('#contact-name').attr('placeholder', 'Required');
      }
      if($$('#contact-email').val() == ''){
        $$('#contact-email').attr('placeholder', 'Required');
      }
      if($$('#contact-subject').val() == ''){
        $$('#contact-subject').attr('placeholder', 'Required');
      }
      if($$('#contact-message').val() == ''){
        $$('#contact-message').attr('placeholder', 'Required');
      }
    }
    else{
      // Check if it's a correct mail
      if(validateEmail($$('#contact-email').val())){
        // Send the mail
        $$.ajax({
          url: serverURL + 'mail.php?name=' + $$('#contact-name').val() + '&email=' + $$('#contact-mail').val() + '&subject=' + $$('#contact-name').val() + '&message=' + $$('#contact-message').val(),
          dataType: 'text',
          timeout: 8000,
          success: function(result){
            if(result == "success"){
              $$('#contact-name').val('');
              $$('#contact-email').val('');
              $$('#contact-subject').val('');
              $$('#contact-message').val('');

              app.addNotification({
                 title: 'Gönderildi',
                 message: 'Mesajınız başırıyla gönderildi!'
             });
            }
          },
          error: function(){
            console.log("Mesaj gönderilirken hata oluştu");
          }
        });
      }
      else{
        $$('#contact-email').attr('placeholder', 'Incorrect mail');
      }
    }
  });

}());
&#13;
&#13;
&#13;

这里是index.html

&#13;
&#13;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>PlayTube</title>
<!-- CSS-->
<link rel="stylesheet" href="css/framework7.ios.min.css">
<link rel="stylesheet" href="css/framework7.ios.colors.min.css">
<link rel="stylesheet" href="css/ionicons.css">
<link rel="stylesheet" href="css/fontello.css">
<link rel="stylesheet" href="css/style.css">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("body").on("click",".toolbar.tabbar .banner320x50 .ic320x50 .kapat320x50",function(){
$(this).parents(".banner320x50").hide();

});
});
</script>
</head>
<body>
<div class="statusbar-overlay"></div>
<div class="panel-overlay"></div>
<!-- Swipe Pannel -->
<div class="panel panel-right panel-reveal">
<span class="panel-title">Listeler</span>
<ul id="playlists"></ul>
</div>
<div class="views tabs">
<!-- Main view - Home -->
<div id="view-main" class="view view-main tab active">
<div class="navbar">
<div class="navbar-inner">
<div class="left back-hidden">
<a href="#" class="link back"><i class="demo-icon icon-reply"></i></a>
</div>
<div class="center"><img src="img/logo.png" alt=""></div>
<div class="right">
<a href="#" data-panel="right" class="link open-panel"><i class="demo-icon ion-navicon"></i></a>
</div>
</div>
</div>
<div class="pages navbar-fixed">
<div class="page">
<div id="content-posts" class="page-content pull-to-refresh-content infinite-scroll" data-distance="50">
<div class="pull-to-refresh-layer">
<span class="preloader"></span>
<div class="pull-to-refresh-arrow"></div>
</div>
<ul class="post-list" id="post-list"></ul>
<span id="infinite-loader" class="preloader"></span>
</div>
</div>
</div>
</div>
<!-- View About -->
<div id="view-about" class="view tab">
<div class="navbar">
<div class="navbar-inner">
<div class="center"><img src="img/logo.png" alt=""></div>
</div>
</div>
<div class="pages navbar-fixed">
<div data-page="index" class="page">
<div class="page-content">
<img class="about-banner" src="img/banner.jpg" alt="">
<img class="about-avatar" src="img/avatar.jpg" alt="">
<div class="about-content">
<div class="about-author">Xioyuna</div>
<div class="about-website"><i class="icon ion-ios-world-outline"></i><span class="about-website-text">youtube.com/username</span></div>
<div class="about-stats">
<div class="about-followers"><span class="about-count">12K</span><br /><span class="about-label">Takipçi</span></div>
<div class="about-videos"><span class="about-count">42</span><br /><span class="about-label">Video</span></div>
<div class="about-views"><span class="about-count">2.3M</span><br /><span class="about-label">izlenme</span></div>
</div>
<div class="about-description">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
</div>
<div class="about-icons"></div>
</div>
</div>
</div>
</div>
<!-- View contact -->
<div id="view-contact" class="view tab">
<div class="navbar">
<div class="navbar-inner">
<div class="center"><img src="img/logo.png" alt=""></div>
</div>
</div>
<div class="pages navbar-fixed">
<div data-page="index" class="page">
<div class="page-content">
<h2>iletişim</h2>
<div class="form-block">
<i class="icon ion-ios-person-outline"></i>
<input id="contact-name" type="text" placeholder="Ad Soyad">
</div>
<div class="form-block">
<i class="icon ion-ios-email-outline"></i>
<input id="contact-email" type="text" placeholder="Email Adresi">
</div>
<div class="form-block">
<i class="icon ion-ios-grid-view-outline"></i>
<input id="contact-subject" type="text" placeholder="Konu">
</div>
<div class="form-block form-message">
<i class="icon ion-ios-chatbubble-outline"></i>
<textarea id="contact-message" placeholder="Mesajınız"></textarea>
</div>
<input id="contact-submit" type="submit" value="Gönder" class="submit-button">
</div>
</div>
</div>
</div>
<!-- Tab bar -->
<div id="banner"></div>
<div class="toolbar tabbar tabbar-labels">
<div class="banner320x50">
	<div class="ic320x50">
		<div class="kapat320x50">X</div>
		<!-- BANNER BAŞLANGIÇ -->
		<img src="http://sehirdegundem.net/reklam/banner.png" />
		<!-- BANNER BİTİŞ -->
	</div>
</div>
<div class="toolbar-inner">
<a href="#view-main" class="tab-link active">
<i class="icon ion-home"></i>
</a>
<a href="#view-about" class="tab-link">
<i class="icon ion-person"></i>
</a>
<a href="#view-contact" class="tab-link">
<i class="icon ion-email"></i>
</a>
</div>
</div>
</div>
<!-- Scripts -->
<script type="text/javascript" src="js/framework7.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
&#13;
&#13;
&#13;

帮我看看我该如何添加?帮助请

0 个答案:

没有答案