2013-12-12 2 views
1

Я новичок в PouchDB, в настоящее время пытаюсь использовать Pouchdb в приложении Android Android Phonegap. Я использую приложение Todos Sample от http://pouchdb.com/getting-started.html.PouchDB on Phonegap (Android)

Он отлично работал в браузере, но не на Android (Jelly Bean 4.2), я использую HTC One Mini для тестирования приложения.

Вот мой код:

<!doctype html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <title>VanillaJS TodoMVC</title> 
    <link rel="stylesheet" href="style/base.css"> 
    <!--[if IE]> 
     <script src="style/ie.js"></script> 
    <![endif]--> 
    <script src="js/jquery-1.10.2.min.js" type="text/javascript"></script> 


    </head> 
    <body> 
    <section id="todoapp"> 
     <header id="header"> 
    <h1>todos</h1> 
    <input id="new-todo" placeholder="What needs to be done?" autofocus value=""> 
     </header> 
     <section id="main"> 
    <ul id="todo-list"></ul> 
     </section> 
     <footer id="footer"> 
    <span id="todo-count"></span> 
     <div id="sync-wrapper"> 
      <div id="sync-success">Currently syncing</div> 
      <div id="sync-error">There was a problem syncing</div> 
     </div> 
     </footer> 
    </section> 
    <script src="js/pouchdb-nightly.min.js"></script> 
    <script src="js/app.js"></script> 
    <script src="js/base.js"></script> 
    </body> 
</html> 

Вот app.js код:

document.addEventListener("deviceready", onDeviceReady, false); 

function onDeviceReady(){}  


(function() { 

    'use strict'; 

    var ENTER_KEY = 13; 
    var newTodoDom = document.getElementById('new-todo'); 
    var syncDom = document.getElementById('sync-wrapper'); 

    // EDITING STARTS HERE (you dont need to edit anything above this line) 

    var db = new PouchDB('todos'); 
    var remoteCouch = false; 

    db.info(function(err, info) { 
    db.changes({ 
     since: info.update_seq, 
     continuous: true, 
     onChange: showTodos 
    }); 
    }); 

    // We have to create a new todo document and enter it in the database 
    function addTodo(text) { 
     var todo = { 
     _id: new Date().toISOString(), 
     title: text, 
     completed: false 
     }; 

     db.put(todo, function callback(err, result) { 
     if(!err) { 
      console.log('Successfully posted a todo!'); 
     } 
     }); 
    } 

    // Show the current list of todos by reading them from the database 
    function showTodos() { 
     db.allDocs({include_docs: true, descending:true}, function(err,doc) { 
      redrawTodosUI(doc.rows); 
     }); 
    } 

    function checkboxChanged(todo, event) { 
     todo.completed = event.target.checked; 
     db.put(todo); 
    } 

    // User pressed the delete button for a todo, delete it 
    function deleteButtonPressed(todo) { 
     db.remove(todo); 
    } 

    // The input box when editing a todo has blurred, we should save 
    // the new title or delete the todo if the title is empty 
    function todoBlurred(todo, event) { 
     var trimmedText = event.target.value.trim(); 

     if(!trimmedText) { 
     db.remove(todo); 
     } else { 
     todo.title = trimmedText; 
     db.put(todo); 
     } 
    } 

    // Initialise a sync with the remote server 
    function sync() { 
    } 

    // EDITING STARTS HERE (you dont need to edit anything below this line) 

    // There was some form or error syncing 
    function syncError() { 
    syncDom.setAttribute('data-sync-state', 'error'); 
    } 

    // User has double clicked a todo, display an input so they can edit the title 
    function todoDblClicked(todo) { 
    var div = document.getElementById('li_' + todo._id); 
    var inputEditTodo = document.getElementById('input_' + todo._id); 
    div.className = 'editing'; 
    inputEditTodo.focus(); 
    } 

    // If they press enter while editing an entry, blur it to trigger save 
    // (or delete) 
    function todoKeyPressed(todo, event) { 
    if (event.keyCode === ENTER_KEY) { 
     var inputEditTodo = document.getElementById('input_' + todo._id); 
     inputEditTodo.blur(); 
    } 
    } 

    // Given an object representing a todo, this will create a list item 
    // to display it. 
    function createTodoListItem(todo) { 
    var checkbox = document.createElement('input'); 
    checkbox.className = 'toggle'; 
    checkbox.type = 'checkbox'; 
    checkbox.addEventListener('change', checkboxChanged.bind(this, todo)); 

    var label = document.createElement('label'); 
    label.appendChild(document.createTextNode(todo.title)); 
    label.addEventListener('dblclick', todoDblClicked.bind(this, todo)); 

    var deleteLink = document.createElement('button'); 
    deleteLink.className = 'destroy'; 
    deleteLink.addEventListener('click', deleteButtonPressed.bind(this, todo)); 

    var divDisplay = document.createElement('div'); 
    divDisplay.className = 'view'; 
    divDisplay.appendChild(checkbox); 
    divDisplay.appendChild(label); 
    divDisplay.appendChild(deleteLink); 

    var inputEditTodo = document.createElement('input'); 
    inputEditTodo.id = 'input_' + todo._id; 
    inputEditTodo.className = 'edit'; 
    inputEditTodo.value = todo.title; 
    inputEditTodo.addEventListener('keypress', todoKeyPressed.bind(this, todo)); 
    inputEditTodo.addEventListener('blur', todoBlurred.bind(this, todo)); 

    var li = document.createElement('li'); 
    li.id = 'li_' + todo._id; 
    li.appendChild(divDisplay); 
    li.appendChild(inputEditTodo); 

    if (todo.completed) { 
     li.className += 'complete'; 
     checkbox.checked = true; 
    } 

    return li; 
    } 

    function redrawTodosUI(todos) { 
    var ul = document.getElementById('todo-list'); 
    ul.innerHTML = ''; 
    todos.forEach(function(todo) { 
     ul.appendChild(createTodoListItem(todo.doc)); 
    }); 
    } 

    function newTodoKeyPressHandler(event) { 
    if (event.keyCode === ENTER_KEY) { 
     addTodo(newTodoDom.value); 
     newTodoDom.value = ''; 
    } 
    } 

    function addEventListeners() { 
    newTodoDom.addEventListener('keypress', newTodoKeyPressHandler, false); 
    } 

    addEventListeners(); 
    showTodos(); 

    if (remoteCouch) { 
    sync(); 
    } 

})(); 

Проблема: Когда я добавить ToDos, после того, как пресс-enter..it ничего не появляется .. Интересно, что локальная база данных на моем телефоне Android еще не создана.

Надеюсь, что кто-то может помочь мне ... любой ответ будет признателен!

Спасибо

+0

Вам повезло? Похоже, прошло какое-то время с тех пор, как вы отправили сообщение. –

ответ

0

я имел две проблемы с PouchDB работы с Android версий ранее, чем 4.2.

  1. Функции atob и btoa не поддерживались. Я в конечном итоге не использовал их, хотя, простите меня, я не помню точно, как я прокомментировал/взломал их. Я, конечно, не заменил их прокладкой.

  2. Почему-то порядок предпочтений indexdb, leveldb, websql не работал на меня. Я должен был специально сказать использование websql. Я увидел некоторый код, который обнаружил, что вы используете phonegap/cordova, а затем использует websql (который переводится как sqllite на Android), но по какой-то причине он тоже не работает.

Надеюсь, что это поможет!

0

У меня также такая же проблема в моем проекте. он отлично работает на версии 4.0.3 для Android, но не работает на 4.1 и 4.2.2 Я много искал в Интернете и обнаружил, что проблема в новой платформе для Android не в pouchdb. Если и действительно хотите работать на локальном хранилище просто использовать IndexedDB

Смотрите эту ссылку https://github.com/daleharvey/pouchdb/issues/504

Смежные вопросы