asdasd

Author: mateon-360

OddJobb/.gitignore

@@ -0,0 +1,2 @@
+# android
+/platforms/

OddJobb/www/index.html

@@ -52,7 +52,7 @@
 					  <a href="#" class="item-link list-button">Submit a new post</a>
 					</li>
 					<li>
-					  <a href="#" class="item-link list-button">View current posts</a>
+					  <a href="postList.html" class="item-link list-button close-panel">View current posts</a>
 					</li>
 					<li>
 					  <a href="messages.html" class="item-link list-button">Messages</a>

OddJobb/www/js/my-app.js

@@ -12,7 +12,7 @@ var mainView = myApp.addView('.view-main', {
 });
 
 // Handle Cordova Device Ready Event
-$$(document).on('deviceready', function() {
+$$(document).on('deviceready', function () {
     console.log("Device is ready!");
 });
 
@@ -22,30 +22,56 @@ $$(document).on('deviceready', function() {
 // Option 1. Using page callback for page (for "about" page in this case) (recommended way):
 myApp.onPageInit('about', function (page) {
     // Do something here for "about" page
-
+    myApp.alert('Here comes About page');
 })
 
 //Messages Page
 myApp.onPageInit('messages', function (page) {
     messagesMain();
+})
 
+myApp.onPageInit('post', function (page) {
+    console.log(page.query);
+    /*
+    1. Do AJAX call to get post based on postID
+    2. Generate post data!
+    */
 
 })
 
+myApp.onPageInit('postList', function (page) {
+    console.log('posted!');
 
-// Option 2. Using one 'pageInit' event handler for all pages:
-$$(document).on('pageInit', function (e) {
-    // Get page data from event data
-    var page = e.detail.page;
+    /*
+    1. Do AJAX call
+    2. Put data into Array
+    3. Set array
+    */
+    const posts = [
+        /*
+        {
+            title: 'Need people to show shovel for me tomorrow!',
+            text: 'House is not too large, so should not be an issue!',
+            price: '5',
+            postalCode: '5'
+            
+        }*/
+    ];
 
-    if (page.name === 'about') {
-        // Following code will be executed for page with data-page attribute equal to "about"
-        myApp.alert('Here comes About page');
+    for (var i = 0; i < 50; i++) {
+        posts.push({
+            item: i
+        });
     }
-})
 
-// Option 2. Using live 'pageInit' event handlers for each page
-$$(document).on('pageInit', '.page[data-page="about"]', function (e) {
-    // Following code will be executed for page with data-page attribute equal to "about"
-    myApp.alert('Here comes About page');
+    const myList = myApp.virtualList('.list-block.virtual-list', {
+        items: posts,
+        template:
+        '<li>' +
+        '<a href="post.html?postID={{item}}" class="item-link item-content">' +
+        '<div>{{item}}</div>' +
+        '</a>' +
+        '</div>' +
+        '</li>'
+    });
 })

OddJobb/www/post.html

@@ -0,0 +1,22 @@
+<!-- Top Navbar-->
+<div class="navbar">
+    <div class="navbar-inner">
+        <div class="left">
+            <a href="#" class="back link">
+                <i class="icon icon-back"></i>
+                <span>Back</span>
+            </a>
+        </div>
+        <div class="center sliding">Posts</div>
+        <div class="right">
+            <a href="#" class="link icon-only open-panel"><i class="icon icon-bars"></i></a>
+        </div>
+    </div>
+</div>
+
+<div class="pages">
+    <div data-page="post" class="page">
+        <div class="page-content">
+        </div>
+    </div>
+</div>

OddJobb/www/postList.html

@@ -0,0 +1,25 @@
+<!-- Top Navbar-->
+<div class="navbar">
+    <div class="navbar-inner">
+        <div class="left">
+            <a href="#" class="back link">
+                <i class="icon icon-back"></i>
+                <span>Back</span>
+            </a>
+        </div>
+        <div class="center sliding">Posts</div>
+        <div class="right">
+            <a href="#" class="link icon-only open-panel"><i class="icon icon-bars"></i></a>
+        </div>
+    </div>
+</div>
+
+<div class="pages">
+    <div data-page="postList" class="page">
+        <div class="page-content">
+            <div class="test list-block virtual-list">
+                <!-- keep it empty -->
+            </div>
+        </div>
+    </div>
+</div>