diff --git a/DEVELOPER.md b/DEVELOPER.md
new file mode 100644
index 0000000..afcc07a
--- /dev/null
+++ b/DEVELOPER.md
@@ -0,0 +1,79 @@
+# Developer readme
+
+This mockup app runs using Kivy, wsgiref and pywebview (desktop only) on Python >= 2.7.13. This document describes how to test it.
+
+## Architecture
+
+To ensure compatibility with Android, the application was split in two parts:
+
+1. The UI's main.py (main_desktop.py for desktop computers)
+2. The background webserver as a service, in service/main.py
+
+When one launch main.py, the call to `AndroidService('ZimAndroidWebserver', 'running').start()` will launch whatever is in `service/main.py`.
+
+`android.txt` is a simple file describing how to present the app in the Kivy Launcher (necessary else it won't display). It is useless for APK packaging.
+
+## Running on desktop
+
+To run on desktop, simply install pywebview module and then run `main_desktop.py`. Should work on Windows, Linux and MacOSX.
+
+## Running on Android
+
+The easiest way is to launch via the Kivy Launcher app.
+
+A good development environment consists of:
+
+1. Bluestacks emulator
+2. TotalCommander app to copy from the Bluestacks shared folder in `sdcard/windows/BstSharedFolder` to `sdcard/kivy`.
+3. Kivy Launcher, to launch the app without needing compilation (just need to copy the project folder into `sdcard/kivy`).
+4. Launch `C:\Program Files (x86)\BlueStacks\HD-Adb.exe logcat > C:\temp\logcat.txt` to enable logcat debug log (necessary to track down errors and bugs).
+
+Once you have all of these, it becomes very easy and fast to test any change you do, just copy/paste the new version of the scripts over the old ones in `sdcard/kivy`.
+
+Note that Kivy Launcher has some limitations:
+
+* Partial implementation of native Python libraries (eg, no wsgiref) and variables (eg, no IPv6 variables). However, the launcher supports any pure Python library, so wsgiref can be supported by copying the folder from python libs.
+
+A limitation of Kivy for GUI is that for the moment it is not possible to add any other widget when using a webview (except for the magicians at [kivy-gmaps](https://github.com/tito/kivy-gmaps)).
+
+However, using Kivy, it is possible to do pretty much anything that can be done via Java: use plyer to access Android libraries in a pythonic way (but with limited functionality), or pyjnius to have full access (but with less pythonic syntax).
+
+## Compiling an APK
+
+To compile an APK, one need to use python-for-android (P4A), by the same authors as Kivy.
+
+P4A can compile pretty much anything, but it needs a backend. For the moment, there are a few ones: SDL2 (default for Kivy apps) and flask. But potentially anything can be a backend, just a recipe is needed.
+
+If the application is made with Kivy, we can use Buildozer, which is another layer on P4A to make building easier by using a buildozer.spec file instead of commandline arguments to P4A.
+
+P4A can only run on Linux at the moment, so a good solution is to use the Kivy Virtual Machine. [Read this post for more info on the steps necessary](https://github.com/jaap-karssenberg/zim-android-mockapp/issues/4#issuecomment-354473348).
+
+Here are the steps:
+
+* Use the [Kivy VirtualBox machine image](https://kivy.org/docs/guide/packaging-android-vm.html).
+* Update python-for-android (to avoid the ["Invalid or unsupported command list" error](https://github.com/kivy/python-for-android/issues/1070)) by installing from github: `pip install git+https://github.com/kivy/python-for-android.git`. In case you have issues with the latest release, I used the [commit 8829312fd187121384939627ec09354657821ae9](https://github.com/kivy/python-for-android/commit/8829312fd187121384939627ec09354657821ae9) specifically.
+* Install [dependencies](https://python-for-android.readthedocs.io/en/latest/quickstart/#installing-dependencies) (replace openjdk-7-jdk by openjdk-8-jdk).
+* Continue the python-for-android install tutorial from ["Installing Android SDK"](https://python-for-android.readthedocs.io/en/latest/quickstart/#installing-android-sdk) onwards.
+* Note: be sure to clean up `/home/kivy/.local/share/python-for-android/dists/' whenever you want to recompile your APK cleanly (particularly if you had errors during compilation because of wrong arguments).
+* If you get an error complaining that ant compilation failed because of `android-sdk/tools/ant/build.xml` not found, it means that p4a did not update their codebase yet, because the Android SDK does not contain ant/build.xml file anymore. Then what you need to do is to use an older Android SDK [as explained here](https://stackoverflow.com/questions/42912824/the-ant-folder-is-suddenly-missing-from-android-sdk-did-google-remove-it), such as android-sdk-r25.2.5.
+* Another error will popup: `(use -source 7 or higher to enable multi-catch statement) `. This complains that P4A uses multi-catch statements, but it compiles against a too old version of the Java SDK. What you need to do is to edit the `android-sdk/tools/ant/build.xml` file: change this:
+
+```xml
+
+
+```
+to:
+
+```xml
+
+
+```
+* Then finally, go to the application root folder and use this command to launch the compilation (make sure to change accordingly the path to your zim-android-mockup project folder):
+
+`p4a apk --private $HOME/Desktop/zim-android-mockapp --package=org.zimandroid.zim --name "ZimAndroid" --version 0.1 --bootstrap=webview --requirements=python2,flask,pywebview,wsgiref --port=23950`
+
+This should generate an APK alright! Note that this command was done on a pure pywebview build (no android webview), thus it may now need some changes to work again.
+
+## Authors
+
+Stephen Larroque & Jaap Karssenberg
\ No newline at end of file
diff --git a/README.md b/README.md
index bace325..efa7d1a 100644
--- a/README.md
+++ b/README.md
@@ -5,3 +5,7 @@ Mock app to start development of a zim android app
See the related wiki pages at:
https://github.com/jaap-karssenberg/zim-android-mockapp/wiki
+Here is a screenshot of the current stage (mockup wsgi webserver on Android as a service + webview UI):
+
+
+
diff --git a/TODO.md b/TODO.md
new file mode 100644
index 0000000..e882653
--- /dev/null
+++ b/TODO.md
@@ -0,0 +1,42 @@
+# TODO
+
+## Webview UI
+
+* Python 3 compatibility for webview on Android: https://github.com/kollivier/pyeverywhere/blob/master/src/pew/kivy_pew/webview.py
+* Back button goes back in history (instead of quitting): https://github.com/suchyDev/Kivy-Dynamic-Screens-Template/blob/master/screens/screenwebview.py
+
+## Zim reading
+
+* Converter Zim note -> HTML (with minimal dependencies to be maximally compatible with Android)
+* Make the wsgi server a dynamic content generator
+* Build notes tree
+* Allow to setup config from wsgi server (Zim notes location, store multiple zim notes "books"/folder to quickly jump from one to the other, etc)
+
+## Zim editing
+
+WYSIWYG would be perfect but will be challenging. Basically, there are two ways:
+
+* using a textarea that gets styled, but it can get out of sync very easily with the hidden underlying content.
+* using contentEditable property of div and MutationObserver.
+
+This last option seems the best. The idea would be to do both block-level and inline-level markup parsing, by sending the changes back to the webserver, which would add the content to the origin Zim note and convert to HTML to send back to the current window, in order to show a nicely formatted text.
+
+BUT: need to find an ergonomic way to enable contentEditable=True, because it cannot be all the time enabled (else links are unclickable!) -> an "Edit mode" link, at the top of the screen and which would always be contentEditable=False, would be a good way! Or by double tapping a text area (and double tapping again would disable).
+
+The best tutorial is probably this one:
+
+[DIY tutorial using contentEditable property of div and MutationObserver](http://pothibo.com/2015/3/building-a-markdown-editor) ([mirror here](https://web.archive.org/web/20170616192810/http://pothibo.com/2015/3/building-a-markdown-editor))
+
+Here are some projects implementing this approach for Markdown, can be good for inspiration:
+
+* A Python based one to convert back and forth to Markdown (can be a good inspiration): http://md-wysiwyg.sourceforge.net/
+* https://github.com/IonicaBizau/medium-editor-markdown
+* https://github.com/sofish/pen#readme
+* https://github.com/bergie/hallo
+* http://marklighteditor.com/ (quite interesting as it allows on the fly rendering after typing markup, instead of highlighting and clicking on a button - this would be super useful on a mobile app)
+* [Another list of WYSIWYG Markdown editors](https://softwarerecs.stackexchange.com/a/30531/16275).
+
+## Packaging
+
+Make a python-for-android or Buildozer packaging recipe.
+
diff --git a/android.txt b/android.txt
new file mode 100644
index 0000000..1810875
--- /dev/null
+++ b/android.txt
@@ -0,0 +1,3 @@
+title=ZimAndroid
+author=Jaap Karssenberg & Stephen Larroque
+orientation=portrait
diff --git a/icon.png b/icon.png
new file mode 100644
index 0000000..9a401b6
Binary files /dev/null and b/icon.png differ
diff --git a/img/zimandroidmockup.png b/img/zimandroidmockup.png
new file mode 100644
index 0000000..b2cecab
Binary files /dev/null and b/img/zimandroidmockup.png differ
diff --git a/main.py b/main.py
new file mode 100644
index 0000000..f7f157d
--- /dev/null
+++ b/main.py
@@ -0,0 +1,76 @@
+#!/usr/bin/python
+
+print('ZIMDEBUGCLIENT')
+
+__version__ = '0.1'
+
+import sys
+import time
+
+from kivy.app import App
+
+from kivy.uix.widget import Widget
+from kivy.clock import Clock
+from jnius import autoclass
+from android.runnable import run_on_ui_thread
+
+
+WebView = autoclass('android.webkit.WebView')
+WebViewClient = autoclass('android.webkit.WebViewClient')
+activity = autoclass('org.renpy.android.PythonActivity').mActivity
+
+class Wv(Widget):
+ def __init__(self, **kwargs):
+ super(Wv, self).__init__(**kwargs)
+ Clock.schedule_once(self.create_webview, 0)
+
+ @run_on_ui_thread
+ def create_webview(self, *args):
+ webview = WebView(activity)
+ settings = webview.getSettings()
+ settings.setJavaScriptEnabled(True)
+ #settings.setUseWideViewPort(True) # enables viewport html meta tags
+ #settings.setLoadWithOverviewMode(True) # uses viewport
+ #settings.setSupportZoom(True) # enables zoom
+ #settings.setBuiltInZoomControls(True) # enables zoom controls
+ wvc = WebViewClient()
+ webview.setWebViewClient(wvc)
+ activity.setContentView(webview)
+ webview.loadUrl('http://localhost:23950')
+ #webview.loadUrl('http://10.0.2.2:23950') # use 10.0.2.2 on Android emulators to access local host of PARENT computer
+ #webview.loadData(html, "text/html", "utf-8") # to directly load html content
+
+
+class WebviewApp(App):
+ def build(self):
+ return Wv()
+
+
+class WebserverService(App):
+ def build(self):
+ self.start_service()
+
+ def start_service(self):
+ from android import AndroidService
+ service = AndroidService('ZimAndroidWebserver', 'running') # this will launch what is in the folder service/main.py as a service
+ service.start('ZimAndroidWebserver service started')
+ self.service = service
+
+ def stop_service(self):
+ if self.service:
+ self.service.stop()
+ self.service = None
+
+ def on_stop(self): # TODO: does not work! We need to close the service on leaving!
+ self.stop_service()
+
+
+if __name__ == '__main__':
+ webserver = WebserverService()
+ webserver.run()
+ time.sleep(0.1)
+ webserver.stop_service() # workaround because service might still be running on exit
+ time.sleep(0.5)
+ webserver.start_service()
+ time.sleep(1.0) # wait a long time just to make extra sure the webserver is running before showing the webview (else there is no refresh button!)
+ WebviewApp().run()
diff --git a/main_desktop.py b/main_desktop.py
new file mode 100755
index 0000000..f3c3b6c
--- /dev/null
+++ b/main_desktop.py
@@ -0,0 +1,52 @@
+#!/usr/bin/python
+
+import sys
+
+from threading import Thread, Lock
+import logging
+import webview
+from time import sleep
+from service.main import run_server
+
+server_lock = Lock()
+
+logger = logging.getLogger(__name__)
+
+
+def url_ok(url, port):
+ """
+ Ensure the webserver is correctly launched before giving the hand to the user
+ """
+ # Use httplib on Python 2
+ try:
+ from http.client import HTTPConnection
+ except ImportError:
+ from httplib import HTTPConnection
+
+ try:
+ conn = HTTPConnection(url, port)
+ conn.request("GET", "/")
+ r = conn.getresponse()
+ return r.status == 200
+ except:
+ logger.exception("Server not started")
+ return False
+
+def start_server():
+ logger.debug("Starting server")
+ t = Thread(target=run_server)
+ t.daemon = True
+ t.start()
+ logger.debug("Checking server")
+
+ while not url_ok("127.0.0.1", 23950):
+ sleep(0.1)
+
+ logger.debug("Server started")
+
+def main():
+ start_server() # need to start the server as a thread ; in Android this is unnecessary as it will be started as a (background) service
+ webview.create_window("ZimAndroid", "http://localhost:23950", min_size=(640, 480)) # this is a blocking command, nothing can be executed after! (or only in a thread launched before)
+
+if __name__ == '__main__':
+ main()
diff --git a/pages/index.html b/pages/index.html
index 802e98a..72792b3 100644
--- a/pages/index.html
+++ b/pages/index.html
@@ -20,6 +20,7 @@ Index
diff --git a/pages/page1.html b/pages/page1.html
index 96c5cc2..2a79c5f 100644
--- a/pages/page1.html
+++ b/pages/page1.html
@@ -12,19 +12,19 @@
nav ul li {display:inline; margin:5px;}
-