diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..45611bc
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,50 @@
+# Created by .ignore support plugin (hsz.mobi)
+### JetBrains template
+# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm
+
+*.iml
+
+## Directory-based project format:
+.idea/
+# if you remove the above rule, at least ignore the following:
+
+# User-specific stuff:
+# .idea/workspace.xml
+# .idea/tasks.xml
+# .idea/dictionaries
+
+# Sensitive or high-churn files:
+# .idea/dataSources.ids
+# .idea/dataSources.xml
+# .idea/sqlDataSources.xml
+# .idea/dynamic.xml
+# .idea/uiDesigner.xml
+
+# Gradle:
+# .idea/gradle.xml
+# .idea/libraries
+
+# Mongo Explorer plugin:
+# .idea/mongoSettings.xml
+
+## File-based project format:
+*.ipr
+*.iws
+
+## Plugin-specific files:
+
+# IntelliJ
+out/
+
+# mpeltonen/sbt-idea plugin
+.idea_modules/
+
+# JIRA plugin
+atlassian-ide-plugin.xml
+
+# Crashlytics plugin (for Android Studio and IntelliJ)
+com_crashlytics_export_strings.xml
+crashlytics.properties
+crashlytics-build.properties
+
+
diff --git a/codetest/bower.json b/codetest/bower.json
new file mode 100644
index 0000000..70584db
--- /dev/null
+++ b/codetest/bower.json
@@ -0,0 +1,19 @@
+{
+  "name": "frontend-interview-test-long",
+  "version": "1.0.0",
+  "homepage": "https://github.com/FrickenHamster/frontend-interview-test-long",
+  "authors": [
+    "Alexander Yan <frickenhamster@gmail.com>"
+  ],
+  "description": "A cool interview project",
+  "dependencies":
+  {
+    "angular": "1.2.x",
+    "angular-route": "1.2.x",
+    "angular-loader": "1.2.x",
+    "angular-mocks": "~1.2.x",
+    "angular-ui": null,
+    "angular-bootstrap": "~0.12.0",
+    "bootstrap": "~3.1.1"
+  }
+}
diff --git a/codetest/index.html b/codetest/index.html
index 5d26a66..4040a21 100644
--- a/codetest/index.html
+++ b/codetest/index.html
@@ -1,32 +1,53 @@
 <!DOCTYPE HTML >
-<html>
+<html ng-app="OntraApp">
 <head>
 	<title>The network</title>
+
+	<link rel="stylesheet" type="text/css" href="normalize.css"/>
+	<link rel="stylesheet" type="text/css" href="bower_components/angular-ui/build/angular-ui.css"/>
+	<link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap.css"/>
+	<link rel="stylesheet" type="text/css" href="styles.css"/>
+	<link rel="stylesheet" type="text/css" href="modal.css"/>
 	
-	<link rel="stylesheet" type="text/css" href="normalize.css" />
-	<link rel="stylesheet" type="text/css" href="styles.css" />
+
+	<script src="bower_components/angular/angular.js"></script>
+	<script src="bower_components/angular-route/angular-route.js"></script>
+	<script src="bower_components/angular-ui/build/angular-ui.js"></script>
+	<script src="bower_components/angular-bootstrap/ui-bootstrap.js"></script>
+	<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
+	<script src="js/app.js"></script>
+	<script src="js/controllers/TickerController.js"></script>
+	<script src="js/services/services.js"></script>
+	<script src="bower_components/jquery/dist/jquery.js"></script>
+	<script src="resources/jstorage.js"></script>
 </head>
 <body>
-	
-	<div id="header">
-		<div id="logo">
-			<img src="images/logo.png" alt="the network"/>
-		</div>	
-		<div id="search">
-			<form method="get" action="#">
-				<input type="search" name="terms" placeholder="Search...."/>
-				<input type="submit" value="Go"/>
-			</form>
-		</div>
-	</div>
-	
-	<div id="page">
 
+<div id="header" ng-controller="HeaderController">
+	<div id="logo">
+		<img src="images/logo.png" alt="the network"/>
 	</div>
-	
-	<div>
-		<p>This is a footer mesage</p>
+	<div id="search">
+		<form method="get" action="#">
+			<input type="search" name="terms" placeholder="Search...."/>
+			<input type="submit" value="Go"/>
+		</form>
 	</div>
-		
+	<!--<span style="vertical-align: middle; height: 100%; float:right; margin-right: 30px; margin-left: 20px; display: inline-block"></span>-->
+	<div id="headPicContainer">
+		<span class="vertImgHelper"></span> <img ng-src="{{profilePic}}" id="headerPic">
+	</div>
+	<a href ng-click="openPostModal()" class="topLink">Post an Update</a>
+	<a href="" class="topLink">Home</a>
+</div>
+
+<div ng-view id="page">
+
+</div>
+
+<div style="margin-left: auto; margin-right: auto; width: 200px;">
+	<p>This is a footer mesage</p>
+</div>
+
 </body>
 </html>
\ No newline at end of file
diff --git a/codetest/js/app.js b/codetest/js/app.js
new file mode 100644
index 0000000..979ee07
--- /dev/null
+++ b/codetest/js/app.js
@@ -0,0 +1,20 @@
+/**
+ * Created by Hamster on 3/20/2015.
+ */
+'use strict';
+
+var ontra = angular.module('OntraApp',
+	[
+		'OntraApp.controllers',
+		'OntraApp.services',
+		'ngRoute',
+		'ui.bootstrap'
+	]).
+	config(['$routeProvider', function ($routeProvider)
+	{
+		$routeProvider.
+			when("/ticker", {templateUrl: "views/ticker.html", controller: "TickerController"}).
+			when('/clear', {templateUrl: "views/clear.html", controller: "ClearController"}).
+			otherwise({redirectTo: '/ticker/'});
+	}]);
+
diff --git a/codetest/js/controllers/TickerController.js b/codetest/js/controllers/TickerController.js
new file mode 100644
index 0000000..3530477
--- /dev/null
+++ b/codetest/js/controllers/TickerController.js
@@ -0,0 +1,134 @@
+/**
+ * Created by Hamster on 3/21/2015.
+ */
+'use strict'
+
+
+var ontraContollers = angular.module('OntraApp.controllers', []);
+
+//controller for main ticker page
+ontraContollers.controller('TickerController', ['$scope', 'UserService', 'PostService',
+		function ($scope, UserService, PostService)
+		{
+			//bound values
+			$scope.users = UserService.users;
+			$scope.userImageURL = $scope.users[UserService.getCurrentUser()].pic;
+			$scope.userName = $scope.users[UserService.getCurrentUser()].username;
+			$scope.postSets = [PostService.posts, PostService.localPosts];
+			
+			/*
+			* Add post from comment box by pressing enter
+			* */
+			$scope.submitComment = function(keyEvent, postId, content)
+			{
+				if (keyEvent.which === 13)
+				{
+					PostService.addComment(UserService.getCurrentUser(), postId, content.content);
+					content.content = "";
+				}
+			}
+		}]
+);
+
+//Controller for layout header
+ontraContollers.controller('HeaderController',
+	['$scope', '$modal', 'UserService',
+		function ($scope, $modal, UserService)
+		{
+			$scope.users = UserService.users;
+			
+			/*
+			* opens new post modal open
+			* called when Submit Post is pressed
+			* */
+			$scope.openPostModal = function ()
+			{
+				$modal.open({
+					templateUrl: 'views/post-modal.html',
+					controller: 'PostModalController',
+					windowClass: 'postModelWindow',
+					resolve: {
+						currentUser: function ()
+						{
+							return UserService.getCurrentUser();
+						}
+					}
+				})
+			}
+			//only one page so no binding for home
+		}
+	]
+);
+
+//modal window controller
+ontraContollers.controller('PostModalController',
+	['$scope', '$modalInstance', 'PostService', "currentUser",
+		function ($scope, $modalInstance, PostService, currentUser)
+		{
+			//bound variables;
+			$scope.postInput = "";
+			$scope.currentUser = currentUser;
+
+			/*
+			* enter pressed on modal window
+			* submits new post
+			* */
+			$scope.postModalKeyPress = function (keyEvent)
+			{
+				if (keyEvent.which === 13)
+				{
+					submitPost();
+				}
+			};
+
+			//set initial focus
+			$("#postModalInput").focus();
+
+			/*
+			* submit a new post
+			* closes modal window
+			* */
+			function submitPost()
+			{
+				PostService.makeLocalPost($scope.currentUser, $scope.postInput);
+
+				$modalInstance.dismiss('submitted post');
+			}
+
+		}
+	]
+);
+
+//helper directive to focus textarea when modal window opened
+ontraContollers.directive('focusMe', function ($timeout)
+{
+	return {
+		scope: {trigger: '@focusMe'},
+		link: function (scope, element)
+		{
+			scope.$watch('trigger', function (value)
+			{
+				if (value === "true")
+				{
+					$timeout(function ()
+					{
+						element[0].focus();
+					});
+				}
+			});
+		}
+	};
+});
+
+//controller to clear local storage
+ontraContollers.controller('ClearController',
+	['$location', '$timeout',
+		function ($location, $timeout)
+		{
+			$timeout(function(){
+				
+				$location.path('./#/ticket');
+			}, 1000);
+			$.jStorage.flush();
+			
+		}]);
\ No newline at end of file
diff --git a/codetest/js/services/services.js b/codetest/js/services/services.js
new file mode 100644
index 0000000..854d2d1
--- /dev/null
+++ b/codetest/js/services/services.js
@@ -0,0 +1,228 @@
+/**
+ * Created by Hamster on 3/22/2015.
+ */
+
+var ontraServices = angular.module('OntraApp.services', []);
+//service for user info
+ontraServices.factory('UserService', ['$http',
+		function ($http)
+		{
+			//users only loaded once and not edited, so it is binded directly
+			var userService = {users: [], hamError: ''};
+
+			//load user data
+			userService.loadUsers = function ()
+			{
+				$http({
+					method: 'GET',
+					url: 'data/users.json'
+				}).success(function (response)
+					{
+						for (var key in response)
+						{
+							userService.users[response[key].id] = response[key];
+						}
+					}
+				).error(function (data, status, headers, config)
+					{
+						var err = "Load User Error" + status;
+						userService.hamError = err;
+						console.log(err);
+					})
+			};
+
+			userService.loadUsers();
+
+			//current user implemented as function because I dunno
+			userService.getCurrentUser = function ()
+			{
+				return 5;
+			};
+			return userService;
+		}
+	]
+);
+
+ontraServices.factory('PostService', ['$http',
+		function ($http)
+		{
+			//posts and buffered posts are stored seperately and binded from parent object because they are updated
+			var postService = {posts: {data: []}, localPosts: {data: []}, bufferedComments: []};
+			var localStored = $.jStorage.get('local_posts', []);
+			postService.localPosts.data = localStored;
+			var commentStored = $.jStorage.get('bufferedComments', []);
+			postService.bufferComments = commentStored;
+
+			/*
+			* load comments to posts in json.
+			* called when json posts are loaded
+			* */
+			postService.loadBufferedComments = function ()
+			{
+				var commentStored = $.jStorage.get('bufferedComments', []);
+				postService.bufferComments = commentStored;
+				for (var i = 0; i < postService.bufferComments.length; i++)
+				{
+					var cmt = postService.bufferComments[i];
+					for (var j = 0; j < postService.posts.data.length; j++)
+					{
+						var post = postService.posts.data[j];
+						if (post.id == cmt.postId)
+						{
+							post.comments.push(cmt);
+							break;
+						}
+
+					}
+				}
+			};
+
+			//load posts from json
+			postService.loadPosts = function ()
+			{
+				$http({
+						method: 'GET',
+						url: 'data/posts.json'
+					}
+				).success(
+					function (response)
+					{
+						postService.posts.data = response;
+						postService.loadBufferedComments();
+					}
+				).error(function (data, status, headers, config)
+					{
+						var err = "Load Posts Error" + status;
+						userService.hamError = err;
+						console.log(err);
+					})
+			};
+
+			postService.loadPosts();
+
+			/*
+			* store buffered posts into local cache
+			* called when posts is modified and when commented added to buffered posts
+			* */
+			postService.storeLocalPosts = function (posts)
+			{
+				$.jStorage.set('local_posts', posts)
+				;
+			};
+			
+			/*
+			* store comments to json posts
+			* called when comments added to json posts
+			* */
+			postService.storeBufferComments = function (comments)
+			{
+				$.jStorage.set('bufferedComments', comments);
+			};
+
+			/*
+			* makes new local post
+			* called from modal window controller
+			* */
+			postService.makeLocalPost = function (userid, content)
+			{
+				var nn = getNewPostNumber;
+				var post = {id: nn, userId: userid, content: content, comments: []};
+				postService.localPosts.data.push(post);
+				postService.storeLocalPosts(postService.localPosts.data);
+
+			};
+
+			/*
+			* parent add comment function
+			* called from ticker controller
+			* */
+			postService.addComment = function (userid, postid, content)
+			{
+				for (var i = 0; i < postService.posts.data.length; i++)
+				{
+					var post = postService.posts.data[i];
+					if (post.id == postid)
+					{
+						var cmt = {
+							id: getNewPostNumber(),
+							postId: postid,
+							userId: userid,
+							date: "",
+							content: content
+						};
+						post.comments.push(cmt);
+						postService.bufferComments.push(cmt);
+						postService.storeBufferComments(postService.bufferComments);
+						break;
+					}
+				}
+				for (var i = 0; i < postService.localPosts.data.length; i++)
+				{
+					var post = postService.localPosts.data[i];
+					if (post.id == postid)
+					{
+						post.comments.push({
+							id: getNewPostNumber(),
+							postId: postid,
+							userId: userid,
+							date: "",
+							content: content
+						});
+						postService.storeLocalPosts(postService.localPosts.data);
+						break;
+					}
+				}
+			};
+
+			
+			/*
+			* Gets new post number for post or comment.
+			* Since it seems like posts and comments share an id system, I just set it to 1 + highest value
+			* */
+			function getNewPostNumber()
+			{
+				var nn = 1;
+				for (var i = 0; i < postService.posts.data.length; i++)
+				{
+					var post = postService.posts.data[i];
+					console.log(post);
+					if (post.id >= nn)
+					{
+						nn = post.id + 1;
+					}
+					for (var j = 0; j < post.comments.length; j++)
+					{
+						var comment = post.comments[j];
+						console.log(comment);
+						if (comment.id >= nn)
+						{
+							nn = comment.id + 1;
+						}
+					}
+				}
+				for (var i = 0; i < postService.localPosts.data.length; i++)
+				{
+					var post = postService.localPosts.data[i];
+					if (post.id >= nn)
+					{
+						nn = post.id + 1;
+					}
+					for (var j = 0; post.comments.length; j++)
+					{
+						var comment = post.comments[j];
+						if (comment.id >= nn)
+						{
+							nn = comment.id + 1;
+						}
+					}
+				}
+				return nn;
+			}
+
+
+			return postService;
+		}
+	]
+);
+	
+
diff --git a/codetest/modal.css b/codetest/modal.css
new file mode 100644
index 0000000..c3b552e
--- /dev/null
+++ b/codetest/modal.css
@@ -0,0 +1,32 @@
+
+
+#postModalContainer
+{
+    width: 400px;
+    height: 200px;
+    padding-left: 50px;
+    padding-top: 40px;
+}
+
+
+.modalTitle
+{
+    font-weight: bold;
+    font-size: 16px;
+    margin-bottom: 10px;
+}
+
+#postModalInput
+{
+    width: 300px;
+    height: 60px;
+    resize: none;
+
+    margin-bottom: 10px;
+}
+
+.modal-dialog
+{
+    width: 400px;
+    height: 200px;
+}
\ No newline at end of file
diff --git a/codetest/resources/jstorage.js b/codetest/resources/jstorage.js
new file mode 100644
index 0000000..1ac8fcc
--- /dev/null
+++ b/codetest/resources/jstorage.js
@@ -0,0 +1,996 @@
+/*
+ * ----------------------------- JSTORAGE -------------------------------------
+ * Simple local storage wrapper to save data on the browser side, supporting
+ * all major browsers - IE6+, Firefox2+, Safari4+, Chrome4+ and Opera 10.5+
+ *
+ * Author: Andris Reinman, andris.reinman@gmail.com
+ * Project homepage: www.jstorage.info
+ *
+ * Licensed under Unlicense:
+ *
+ * This is free and unencumbered software released into the public domain.
+ *
+ * Anyone is free to copy, modify, publish, use, compile, sell, or
+ * distribute this software, either in source code form or as a compiled
+ * binary, for any purpose, commercial or non-commercial, and by any
+ * means.
+ *
+ * In jurisdictions that recognize copyright laws, the author or authors
+ * of this software dedicate any and all copyright interest in the
+ * software to the public domain. We make this dedication for the benefit
+ * of the public at large and to the detriment of our heirs and
+ * successors. We intend this dedication to be an overt act of
+ * relinquishment in perpetuity of all present and future rights to this
+ * software under copyright law.
+ *
+ * THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+ * MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+ * IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
+ * OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
+ * ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+ * OTHER DEALINGS IN THE SOFTWARE.
+ *
+ * For more information, please refer to <http://unlicense.org/>
+ */
+
+/* global ActiveXObject: false */
+/* jshint browser: true */
+
+(function() {
+    'use strict';
+
+    var
+    /* jStorage version */
+        JSTORAGE_VERSION = '0.4.12',
+
+        /* detect a dollar object or create one if not found */
+        $ = window.jQuery || window.$ || (window.$ = {}),
+
+        /* check for a JSON handling support */
+        JSON = {
+            parse: window.JSON && (window.JSON.parse || window.JSON.decode) ||
+                String.prototype.evalJSON && function(str) {
+                    return String(str).evalJSON();
+            } ||
+                $.parseJSON ||
+                $.evalJSON,
+            stringify: Object.toJSON ||
+                window.JSON && (window.JSON.stringify || window.JSON.encode) ||
+                $.toJSON
+        };
+
+    // Break if no JSON support was found
+    if (typeof JSON.parse !== 'function' || typeof JSON.stringify !== 'function') {
+        throw new Error('No JSON support found, include //cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js to page');
+    }
+
+    var
+    /* This is the object, that holds the cached values */
+        _storage = {
+            __jstorage_meta: {
+                CRC32: {}
+            }
+        },
+
+        /* Actual browser storage (localStorage or globalStorage['domain']) */
+        _storage_service = {
+            jStorage: '{}'
+        },
+
+        /* DOM element for older IE versions, holds userData behavior */
+        _storage_elm = null,
+
+        /* How much space does the storage take */
+        _storage_size = 0,
+
+        /* which backend is currently used */
+        _backend = false,
+
+        /* onchange observers */
+        _observers = {},
+
+        /* timeout to wait after onchange event */
+        _observer_timeout = false,
+
+        /* last update time */
+        _observer_update = 0,
+
+        /* pubsub observers */
+        _pubsub_observers = {},
+
+        /* skip published items older than current timestamp */
+        _pubsub_last = +new Date(),
+
+        /* Next check for TTL */
+        _ttl_timeout,
+
+        /**
+         * XML encoding and decoding as XML nodes can't be JSON'ized
+         * XML nodes are encoded and decoded if the node is the value to be saved
+         * but not if it's as a property of another object
+         * Eg. -
+         *   $.jStorage.set('key', xmlNode);        // IS OK
+         *   $.jStorage.set('key', {xml: xmlNode}); // NOT OK
+         */
+        _XMLService = {
+
+            /**
+             * Validates a XML node to be XML
+             * based on jQuery.isXML function
+             */
+            isXML: function(elm) {
+                var documentElement = (elm ? elm.ownerDocument || elm : 0).documentElement;
+                return documentElement ? documentElement.nodeName !== 'HTML' : false;
+            },
+
+            /**
+             * Encodes a XML node to string
+             * based on http://www.mercurytide.co.uk/news/article/issues-when-working-ajax/
+             */
+            encode: function(xmlNode) {
+                if (!this.isXML(xmlNode)) {
+                    return false;
+                }
+                try { // Mozilla, Webkit, Opera
+                    return new XMLSerializer().serializeToString(xmlNode);
+                } catch (E1) {
+                    try { // IE
+                        return xmlNode.xml;
+                    } catch (E2) {}
+                }
+                return false;
+            },
+
+            /**
+             * Decodes a XML node from string
+             * loosely based on http://outwestmedia.com/jquery-plugins/xmldom/
+             */
+            decode: function(xmlString) {
+                var dom_parser = ('DOMParser' in window && (new DOMParser()).parseFromString) ||
+                    (window.ActiveXObject && function(_xmlString) {
+                        var xml_doc = new ActiveXObject('Microsoft.XMLDOM');
+                        xml_doc.async = 'false';
+                        xml_doc.loadXML(_xmlString);
+                        return xml_doc;
+                    }),
+                    resultXML;
+                if (!dom_parser) {
+                    return false;
+                }
+                resultXML = dom_parser.call('DOMParser' in window && (new DOMParser()) || window, xmlString, 'text/xml');
+                return this.isXML(resultXML) ? resultXML : false;
+            }
+        };
+
+
+    ////////////////////////// PRIVATE METHODS ////////////////////////
+
+    /**
+     * Initialization function. Detects if the browser supports DOM Storage
+     * or userData behavior and behaves accordingly.
+     */
+    function _init() {
+        /* Check if browser supports localStorage */
+        var localStorageReallyWorks = false;
+        if ('localStorage' in window) {
+            try {
+                window.localStorage.setItem('_tmptest', 'tmpval');
+                localStorageReallyWorks = true;
+                window.localStorage.removeItem('_tmptest');
+            } catch (BogusQuotaExceededErrorOnIos5) {
+                // Thanks be to iOS5 Private Browsing mode which throws
+                // QUOTA_EXCEEDED_ERRROR DOM Exception 22.
+            }
+        }
+
+        if (localStorageReallyWorks) {
+            try {
+                if (window.localStorage) {
+                    _storage_service = window.localStorage;
+                    _backend = 'localStorage';
+                    _observer_update = _storage_service.jStorage_update;
+                }
+            } catch (E3) { /* Firefox fails when touching localStorage and cookies are disabled */ }
+        }
+        /* Check if browser supports globalStorage */
+        else if ('globalStorage' in window) {
+            try {
+                if (window.globalStorage) {
+                    if (window.location.hostname == 'localhost') {
+                        _storage_service = window.globalStorage['localhost.localdomain'];
+                    } else {
+                        _storage_service = window.globalStorage[window.location.hostname];
+                    }
+                    _backend = 'globalStorage';
+                    _observer_update = _storage_service.jStorage_update;
+                }
+            } catch (E4) { /* Firefox fails when touching localStorage and cookies are disabled */ }
+        }
+        /* Check if browser supports userData behavior */
+        else {
+            _storage_elm = document.createElement('link');
+            if (_storage_elm.addBehavior) {
+
+                /* Use a DOM element to act as userData storage */
+                _storage_elm.style.behavior = 'url(#default#userData)';
+
+                /* userData element needs to be inserted into the DOM! */
+                document.getElementsByTagName('head')[0].appendChild(_storage_elm);
+
+                try {
+                    _storage_elm.load('jStorage');
+                } catch (E) {
+                    // try to reset cache
+                    _storage_elm.setAttribute('jStorage', '{}');
+                    _storage_elm.save('jStorage');
+                    _storage_elm.load('jStorage');
+                }
+
+                var data = '{}';
+                try {
+                    data = _storage_elm.getAttribute('jStorage');
+                } catch (E5) {}
+
+                try {
+                    _observer_update = _storage_elm.getAttribute('jStorage_update');
+                } catch (E6) {}
+
+                _storage_service.jStorage = data;
+                _backend = 'userDataBehavior';
+            } else {
+                _storage_elm = null;
+                return;
+            }
+        }
+
+        // Load data from storage
+        _load_storage();
+
+        // remove dead keys
+        _handleTTL();
+
+        // start listening for changes
+        _setupObserver();
+
+        // initialize publish-subscribe service
+        _handlePubSub();
+
+        // handle cached navigation
+        if ('addEventListener' in window) {
+            window.addEventListener('pageshow', function(event) {
+                if (event.persisted) {
+                    _storageObserver();
+                }
+            }, false);
+        }
+    }
+
+    /**
+     * Reload data from storage when needed
+     */
+    function _reloadData() {
+        var data = '{}';
+
+        if (_backend == 'userDataBehavior') {
+            _storage_elm.load('jStorage');
+
+            try {
+                data = _storage_elm.getAttribute('jStorage');
+            } catch (E5) {}
+
+            try {
+                _observer_update = _storage_elm.getAttribute('jStorage_update');
+            } catch (E6) {}
+
+            _storage_service.jStorage = data;
+        }
+
+        _load_storage();
+
+        // remove dead keys
+        _handleTTL();
+
+        _handlePubSub();
+    }
+
+    /**
+     * Sets up a storage change observer
+     */
+    function _setupObserver() {
+        if (_backend == 'localStorage' || _backend == 'globalStorage') {
+            if ('addEventListener' in window) {
+                window.addEventListener('storage', _storageObserver, false);
+            } else {
+                document.attachEvent('onstorage', _storageObserver);
+            }
+        } else if (_backend == 'userDataBehavior') {
+            setInterval(_storageObserver, 1000);
+        }
+    }
+
+    /**
+     * Fired on any kind of data change, needs to check if anything has
+     * really been changed
+     */
+    function _storageObserver() {
+        var updateTime;
+        // cumulate change notifications with timeout
+        clearTimeout(_observer_timeout);
+        _observer_timeout = setTimeout(function() {
+
+            if (_backend == 'localStorage' || _backend == 'globalStorage') {
+                updateTime = _storage_service.jStorage_update;
+            } else if (_backend == 'userDataBehavior') {
+                _storage_elm.load('jStorage');
+                try {
+                    updateTime = _storage_elm.getAttribute('jStorage_update');
+                } catch (E5) {}
+            }
+
+            if (updateTime && updateTime != _observer_update) {
+                _observer_update = updateTime;
+                _checkUpdatedKeys();
+            }
+
+        }, 25);
+    }
+
+    /**
+     * Reloads the data and checks if any keys are changed
+     */
+    function _checkUpdatedKeys() {
+        var oldCrc32List = JSON.parse(JSON.stringify(_storage.__jstorage_meta.CRC32)),
+            newCrc32List;
+
+        _reloadData();
+        newCrc32List = JSON.parse(JSON.stringify(_storage.__jstorage_meta.CRC32));
+
+        var key,
+            updated = [],
+            removed = [];
+
+        for (key in oldCrc32List) {
+            if (oldCrc32List.hasOwnProperty(key)) {
+                if (!newCrc32List[key]) {
+                    removed.push(key);
+                    continue;
+                }
+                if (oldCrc32List[key] != newCrc32List[key] && String(oldCrc32List[key]).substr(0, 2) == '2.') {
+                    updated.push(key);
+                }
+            }
+        }
+
+        for (key in newCrc32List) {
+            if (newCrc32List.hasOwnProperty(key)) {
+                if (!oldCrc32List[key]) {
+                    updated.push(key);
+                }
+            }
+        }
+
+        _fireObservers(updated, 'updated');
+        _fireObservers(removed, 'deleted');
+    }
+
+    /**
+     * Fires observers for updated keys
+     *
+     * @param {Array|String} keys Array of key names or a key
+     * @param {String} action What happened with the value (updated, deleted, flushed)
+     */
+    function _fireObservers(keys, action) {
+        keys = [].concat(keys || []);
+
+        var i, j, len, jlen;
+
+        if (action == 'flushed') {
+            keys = [];
+            for (var key in _observers) {
+                if (_observers.hasOwnProperty(key)) {
+                    keys.push(key);
+                }
+            }
+            action = 'deleted';
+        }
+        for (i = 0, len = keys.length; i < len; i++) {
+            if (_observers[keys[i]]) {
+                for (j = 0, jlen = _observers[keys[i]].length; j < jlen; j++) {
+                    _observers[keys[i]][j](keys[i], action);
+                }
+            }
+            if (_observers['*']) {
+                for (j = 0, jlen = _observers['*'].length; j < jlen; j++) {
+                    _observers['*'][j](keys[i], action);
+                }
+            }
+        }
+    }
+
+    /**
+     * Publishes key change to listeners
+     */
+    function _publishChange() {
+        var updateTime = (+new Date()).toString();
+
+        if (_backend == 'localStorage' || _backend == 'globalStorage') {
+            try {
+                _storage_service.jStorage_update = updateTime;
+            } catch (E8) {
+                // safari private mode has been enabled after the jStorage initialization
+                _backend = false;
+            }
+        } else if (_backend == 'userDataBehavior') {
+            _storage_elm.setAttribute('jStorage_update', updateTime);
+            _storage_elm.save('jStorage');
+        }
+
+        _storageObserver();
+    }
+
+    /**
+     * Loads the data from the storage based on the supported mechanism
+     */
+    function _load_storage() {
+        /* if jStorage string is retrieved, then decode it */
+        if (_storage_service.jStorage) {
+            try {
+                _storage = JSON.parse(String(_storage_service.jStorage));
+            } catch (E6) {
+                _storage_service.jStorage = '{}';
+            }
+        } else {
+            _storage_service.jStorage = '{}';
+        }
+        _storage_size = _storage_service.jStorage ? String(_storage_service.jStorage).length : 0;
+
+        if (!_storage.__jstorage_meta) {
+            _storage.__jstorage_meta = {};
+        }
+        if (!_storage.__jstorage_meta.CRC32) {
+            _storage.__jstorage_meta.CRC32 = {};
+        }
+    }
+
+    /**
+     * This functions provides the 'save' mechanism to store the jStorage object
+     */
+    function _save() {
+        _dropOldEvents(); // remove expired events
+        try {
+            _storage_service.jStorage = JSON.stringify(_storage);
+            // If userData is used as the storage engine, additional
+            if (_storage_elm) {
+                _storage_elm.setAttribute('jStorage', _storage_service.jStorage);
+                _storage_elm.save('jStorage');
+            }
+            _storage_size = _storage_service.jStorage ? String(_storage_service.jStorage).length : 0;
+        } catch (E7) { /* probably cache is full, nothing is saved this way*/ }
+    }
+
+    /**
+     * Function checks if a key is set and is string or numberic
+     *
+     * @param {String} key Key name
+     */
+    function _checkKey(key) {
+        if (typeof key != 'string' && typeof key != 'number') {
+            throw new TypeError('Key name must be string or numeric');
+        }
+        if (key == '__jstorage_meta') {
+            throw new TypeError('Reserved key name');
+        }
+        return true;
+    }
+
+    /**
+     * Removes expired keys
+     */
+    function _handleTTL() {
+        var curtime, i, TTL, CRC32, nextExpire = Infinity,
+            changed = false,
+            deleted = [];
+
+        clearTimeout(_ttl_timeout);
+
+        if (!_storage.__jstorage_meta || typeof _storage.__jstorage_meta.TTL != 'object') {
+            // nothing to do here
+            return;
+        }
+
+        curtime = +new Date();
+        TTL = _storage.__jstorage_meta.TTL;
+
+        CRC32 = _storage.__jstorage_meta.CRC32;
+        for (i in TTL) {
+            if (TTL.hasOwnProperty(i)) {
+                if (TTL[i] <= curtime) {
+                    delete TTL[i];
+                    delete CRC32[i];
+                    delete _storage[i];
+                    changed = true;
+                    deleted.push(i);
+                } else if (TTL[i] < nextExpire) {
+                    nextExpire = TTL[i];
+                }
+            }
+        }
+
+        // set next check
+        if (nextExpire != Infinity) {
+            _ttl_timeout = setTimeout(_handleTTL, Math.min(nextExpire - curtime, 0x7FFFFFFF));
+        }
+
+        // save changes
+        if (changed) {
+            _save();
+            _publishChange();
+            _fireObservers(deleted, 'deleted');
+        }
+    }
+
+    /**
+     * Checks if there's any events on hold to be fired to listeners
+     */
+    function _handlePubSub() {
+        var i, len;
+        if (!_storage.__jstorage_meta.PubSub) {
+            return;
+        }
+        var pubelm,
+            _pubsubCurrent = _pubsub_last,
+            needFired = [];
+
+        for (i = len = _storage.__jstorage_meta.PubSub.length - 1; i >= 0; i--) {
+            pubelm = _storage.__jstorage_meta.PubSub[i];
+            if (pubelm[0] > _pubsub_last) {
+                _pubsubCurrent = pubelm[0];
+                needFired.unshift(pubelm);
+            }
+        }
+
+        for (i = needFired.length - 1; i >= 0; i--) {
+            _fireSubscribers(needFired[i][1], needFired[i][2]);
+        }
+
+        _pubsub_last = _pubsubCurrent;
+    }
+
+    /**
+     * Fires all subscriber listeners for a pubsub channel
+     *
+     * @param {String} channel Channel name
+     * @param {Mixed} payload Payload data to deliver
+     */
+    function _fireSubscribers(channel, payload) {
+        if (_pubsub_observers[channel]) {
+            for (var i = 0, len = _pubsub_observers[channel].length; i < len; i++) {
+                // send immutable data that can't be modified by listeners
+                try {
+                    _pubsub_observers[channel][i](channel, JSON.parse(JSON.stringify(payload)));
+                } catch (E) {}
+            }
+        }
+    }
+
+    /**
+     * Remove old events from the publish stream (at least 2sec old)
+     */
+    function _dropOldEvents() {
+        if (!_storage.__jstorage_meta.PubSub) {
+            return;
+        }
+
+        var retire = +new Date() - 2000;
+
+        for (var i = 0, len = _storage.__jstorage_meta.PubSub.length; i < len; i++) {
+            if (_storage.__jstorage_meta.PubSub[i][0] <= retire) {
+                // deleteCount is needed for IE6
+                _storage.__jstorage_meta.PubSub.splice(i, _storage.__jstorage_meta.PubSub.length - i);
+                break;
+            }
+        }
+
+        if (!_storage.__jstorage_meta.PubSub.length) {
+            delete _storage.__jstorage_meta.PubSub;
+        }
+
+    }
+
+    /**
+     * Publish payload to a channel
+     *
+     * @param {String} channel Channel name
+     * @param {Mixed} payload Payload to send to the subscribers
+     */
+    function _publish(channel, payload) {
+        if (!_storage.__jstorage_meta) {
+            _storage.__jstorage_meta = {};
+        }
+        if (!_storage.__jstorage_meta.PubSub) {
+            _storage.__jstorage_meta.PubSub = [];
+        }
+
+        _storage.__jstorage_meta.PubSub.unshift([+new Date(), channel, payload]);
+
+        _save();
+        _publishChange();
+    }
+
+
+    /**
+     * JS Implementation of MurmurHash2
+     *
+     *  SOURCE: https://github.com/garycourt/murmurhash-js (MIT licensed)
+     *
+     * @author <a href='mailto:gary.court@gmail.com'>Gary Court</a>
+     * @see http://github.com/garycourt/murmurhash-js
+     * @author <a href='mailto:aappleby@gmail.com'>Austin Appleby</a>
+     * @see http://sites.google.com/site/murmurhash/
+     *
+     * @param {string} str ASCII only
+     * @param {number} seed Positive integer only
+     * @return {number} 32-bit positive integer hash
+     */
+
+    function murmurhash2_32_gc(str, seed) {
+        var
+            l = str.length,
+            h = seed ^ l,
+            i = 0,
+            k;
+
+        while (l >= 4) {
+            k =
+                ((str.charCodeAt(i) & 0xff)) |
+                ((str.charCodeAt(++i) & 0xff) << 8) |
+                ((str.charCodeAt(++i) & 0xff) << 16) |
+                ((str.charCodeAt(++i) & 0xff) << 24);
+
+            k = (((k & 0xffff) * 0x5bd1e995) + ((((k >>> 16) * 0x5bd1e995) & 0xffff) << 16));
+            k ^= k >>> 24;
+            k = (((k & 0xffff) * 0x5bd1e995) + ((((k >>> 16) * 0x5bd1e995) & 0xffff) << 16));
+
+            h = (((h & 0xffff) * 0x5bd1e995) + ((((h >>> 16) * 0x5bd1e995) & 0xffff) << 16)) ^ k;
+
+            l -= 4;
+            ++i;
+        }
+
+        switch (l) {
+            case 3:
+                h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
+                /* falls through */
+            case 2:
+                h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
+                /* falls through */
+            case 1:
+                h ^= (str.charCodeAt(i) & 0xff);
+                h = (((h & 0xffff) * 0x5bd1e995) + ((((h >>> 16) * 0x5bd1e995) & 0xffff) << 16));
+        }
+
+        h ^= h >>> 13;
+        h = (((h & 0xffff) * 0x5bd1e995) + ((((h >>> 16) * 0x5bd1e995) & 0xffff) << 16));
+        h ^= h >>> 15;
+
+        return h >>> 0;
+    }
+
+    ////////////////////////// PUBLIC INTERFACE /////////////////////////
+
+    $.jStorage = {
+        /* Version number */
+        version: JSTORAGE_VERSION,
+
+        /**
+         * Sets a key's value.
+         *
+         * @param {String} key Key to set. If this value is not set or not
+         *              a string an exception is raised.
+         * @param {Mixed} value Value to set. This can be any value that is JSON
+         *              compatible (Numbers, Strings, Objects etc.).
+         * @param {Object} [options] - possible options to use
+         * @param {Number} [options.TTL] - optional TTL value, in milliseconds
+         * @return {Mixed} the used value
+         */
+        set: function(key, value, options) {
+            _checkKey(key);
+
+            options = options || {};
+
+            // undefined values are deleted automatically
+            if (typeof value == 'undefined') {
+                this.deleteKey(key);
+                return value;
+            }
+
+            if (_XMLService.isXML(value)) {
+                value = {
+                    _is_xml: true,
+                    xml: _XMLService.encode(value)
+                };
+            } else if (typeof value == 'function') {
+                return undefined; // functions can't be saved!
+            } else if (value && typeof value == 'object') {
+                // clone the object before saving to _storage tree
+                value = JSON.parse(JSON.stringify(value));
+            }
+
+            _storage[key] = value;
+
+            _storage.__jstorage_meta.CRC32[key] = '2.' + murmurhash2_32_gc(JSON.stringify(value), 0x9747b28c);
+
+            this.setTTL(key, options.TTL || 0); // also handles saving and _publishChange
+
+            _fireObservers(key, 'updated');
+            return value;
+        },
+
+        /**
+         * Looks up a key in cache
+         *
+         * @param {String} key - Key to look up.
+         * @param {mixed} def - Default value to return, if key didn't exist.
+         * @return {Mixed} the key value, default value or null
+         */
+        get: function(key, def) {
+            _checkKey(key);
+            if (key in _storage) {
+                if (_storage[key] && typeof _storage[key] == 'object' && _storage[key]._is_xml) {
+                    return _XMLService.decode(_storage[key].xml);
+                } else {
+                    return _storage[key];
+                }
+            }
+            return typeof(def) == 'undefined' ? null : def;
+        },
+
+        /**
+         * Deletes a key from cache.
+         *
+         * @param {String} key - Key to delete.
+         * @return {Boolean} true if key existed or false if it didn't
+         */
+        deleteKey: function(key) {
+            _checkKey(key);
+            if (key in _storage) {
+                delete _storage[key];
+                // remove from TTL list
+                if (typeof _storage.__jstorage_meta.TTL == 'object' &&
+                    key in _storage.__jstorage_meta.TTL) {
+                    delete _storage.__jstorage_meta.TTL[key];
+                }
+
+                delete _storage.__jstorage_meta.CRC32[key];
+
+                _save();
+                _publishChange();
+                _fireObservers(key, 'deleted');
+                return true;
+            }
+            return false;
+        },
+
+        /**
+         * Sets a TTL for a key, or remove it if ttl value is 0 or below
+         *
+         * @param {String} key - key to set the TTL for
+         * @param {Number} ttl - TTL timeout in milliseconds
+         * @return {Boolean} true if key existed or false if it didn't
+         */
+        setTTL: function(key, ttl) {
+            var curtime = +new Date();
+            _checkKey(key);
+            ttl = Number(ttl) || 0;
+            if (key in _storage) {
+
+                if (!_storage.__jstorage_meta.TTL) {
+                    _storage.__jstorage_meta.TTL = {};
+                }
+
+                // Set TTL value for the key
+                if (ttl > 0) {
+                    _storage.__jstorage_meta.TTL[key] = curtime + ttl;
+                } else {
+                    delete _storage.__jstorage_meta.TTL[key];
+                }
+
+                _save();
+
+                _handleTTL();
+
+                _publishChange();
+                return true;
+            }
+            return false;
+        },
+
+        /**
+         * Gets remaining TTL (in milliseconds) for a key or 0 when no TTL has been set
+         *
+         * @param {String} key Key to check
+         * @return {Number} Remaining TTL in milliseconds
+         */
+        getTTL: function(key) {
+            var curtime = +new Date(),
+                ttl;
+            _checkKey(key);
+            if (key in _storage && _storage.__jstorage_meta.TTL && _storage.__jstorage_meta.TTL[key]) {
+                ttl = _storage.__jstorage_meta.TTL[key] - curtime;
+                return ttl || 0;
+            }
+            return 0;
+        },
+
+        /**
+         * Deletes everything in cache.
+         *
+         * @return {Boolean} Always true
+         */
+        flush: function() {
+            _storage = {
+                __jstorage_meta: {
+                    CRC32: {}
+                }
+            };
+            _save();
+            _publishChange();
+            _fireObservers(null, 'flushed');
+            return true;
+        },
+
+        /**
+         * Returns a read-only copy of _storage
+         *
+         * @return {Object} Read-only copy of _storage
+         */
+        storageObj: function() {
+            function F() {}
+            F.prototype = _storage;
+            return new F();
+        },
+
+        /**
+         * Returns an index of all used keys as an array
+         * ['key1', 'key2',..'keyN']
+         *
+         * @return {Array} Used keys
+         */
+        index: function() {
+            var index = [],
+                i;
+            for (i in _storage) {
+                if (_storage.hasOwnProperty(i) && i != '__jstorage_meta') {
+                    index.push(i);
+                }
+            }
+            return index;
+        },
+
+        /**
+         * How much space in bytes does the storage take?
+         *
+         * @return {Number} Storage size in chars (not the same as in bytes,
+         *                  since some chars may take several bytes)
+         */
+        storageSize: function() {
+            return _storage_size;
+        },
+
+        /**
+         * Which backend is currently in use?
+         *
+         * @return {String} Backend name
+         */
+        currentBackend: function() {
+            return _backend;
+        },
+
+        /**
+         * Test if storage is available
+         *
+         * @return {Boolean} True if storage can be used
+         */
+        storageAvailable: function() {
+            return !!_backend;
+        },
+
+        /**
+         * Register change listeners
+         *
+         * @param {String} key Key name
+         * @param {Function} callback Function to run when the key changes
+         */
+        listenKeyChange: function(key, callback) {
+            _checkKey(key);
+            if (!_observers[key]) {
+                _observers[key] = [];
+            }
+            _observers[key].push(callback);
+        },
+
+        /**
+         * Remove change listeners
+         *
+         * @param {String} key Key name to unregister listeners against
+         * @param {Function} [callback] If set, unregister the callback, if not - unregister all
+         */
+        stopListening: function(key, callback) {
+            _checkKey(key);
+
+            if (!_observers[key]) {
+                return;
+            }
+
+            if (!callback) {
+                delete _observers[key];
+                return;
+            }
+
+            for (var i = _observers[key].length - 1; i >= 0; i--) {
+                if (_observers[key][i] == callback) {
+                    _observers[key].splice(i, 1);
+                }
+            }
+        },
+
+        /**
+         * Subscribe to a Publish/Subscribe event stream
+         *
+         * @param {String} channel Channel name
+         * @param {Function} callback Function to run when the something is published to the channel
+         */
+        subscribe: function(channel, callback) {
+            channel = (channel || '').toString();
+            if (!channel) {
+                throw new TypeError('Channel not defined');
+            }
+            if (!_pubsub_observers[channel]) {
+                _pubsub_observers[channel] = [];
+            }
+            _pubsub_observers[channel].push(callback);
+        },
+
+        /**
+         * Publish data to an event stream
+         *
+         * @param {String} channel Channel name
+         * @param {Mixed} payload Payload to deliver
+         */
+        publish: function(channel, payload) {
+            channel = (channel || '').toString();
+            if (!channel) {
+                throw new TypeError('Channel not defined');
+            }
+
+            _publish(channel, payload);
+        },
+
+        /**
+         * Reloads the data from browser storage
+         */
+        reInit: function() {
+            _reloadData();
+        },
+
+        /**
+         * Removes reference from global objects and saves it as jStorage
+         *
+         * @param {Boolean} option if needed to save object as simple 'jStorage' in windows context
+         */
+        noConflict: function(saveInGlobal) {
+            delete window.$.jStorage;
+
+            if (saveInGlobal) {
+                window.jStorage = this;
+            }
+
+            return this;
+        }
+    };
+
+    // Initialize jStorage
+    _init();
+
+})();
\ No newline at end of file
diff --git a/codetest/styles.css b/codetest/styles.css
index 886f1ae..89643b3 100644
--- a/codetest/styles.css
+++ b/codetest/styles.css
@@ -3,8 +3,9 @@
  * 
  */
 
+.nav, .pagination, .carousel, .panel-title a { cursor: pointer; }
+
 html{
-	height: 100%;
 }
 
 body{
@@ -20,7 +21,6 @@ body{
 	
 	font-size: 13px;
 	min-width: 800px;
-	
 }
 
 br{
@@ -32,6 +32,8 @@ br{
 	background: rgba( 0, 0, 0, 0.7);
 	padding: 10px 5px;
 	box-shadow: 0px 1px 5px #fff;
+	
+	height:70px;
 }
 
 
@@ -53,6 +55,11 @@ br{
     width: 300px;
     margin-top: 1em;
 }
+#search input[name="terms"]:focus
+{
+	box-shadow: 0 0 15px 3px #fff;
+}
+
 #search input[name="terms"]{
 	width: 250px;
 	padding: 2px 3px;
@@ -73,22 +80,193 @@ br{
 }
 
 #search input[type="submit"]:hover{
+	border-color: #2b542c;
+	background-color: #730375;
+}
+
+#headPicContainer
+{
+	float:right;
+	height: 100%;
+	margin-right: 30px;
+	margin-left: 10px;
+}
+
+.vertImgHelper
+{
+	display: inline-block;
+	height: 100%;
+	vertical-align: middle;
+}
+
+#headerPic
+{
+	max-width: 25px;
+	max-height: 25px;
 	
+	vertical-align: middle;
 }
 
+.topLink
+{
+	float: right;
+	font-size: 16px;
+	color: #ffffff;
 
+	text-decoration: none;
+	line-height: 50px;
+	height: 50px;
+
+	margin-right: 15px;
+}
 
 
 
 /*page content*/
 
 #page{
-	width: 800px;
+	/*width: 800px;*/
 	
 	/*background: rgba( 255, 255, 255, 0.3 );
 	border: 1px solid #ffffff;*/
 	margin: 10px auto 0px;
 	padding: 1em 2em;
+	width: 100%;
+	height: auto;
+	float:left;
 }
 
 
+#ticker
+{
+	padding-left: 10%;
+}
+
+#userSection
+{
+	float: left;
+	width: 250px;
+	height: 60px;
+	vertical-align: text-bottom;
+	
+	background-color: #ffffff;
+	border: 0 solid;
+	border-radius: 8px;
+
+	margin-left: calc(50% - 600px);
+	/*margin-right: 100px;*/
+	
+	padding-left: 5px;
+	padding-top: 5px;
+}
+
+#userSectionName
+{
+	display: table-cell;
+	vertical-align: bottom;
+	height: 54px;
+}
+
+#tickerMain
+{
+	/*float: left;*/
+	width: 525px;
+	height: 100%;
+
+	display: block;
+	margin-left: auto;
+	margin-right: auto;
+	
+	
+	
+	border-radius: 8px;
+	background-color: #f7f7f7;
+	
+	padding-left: 5px;
+	padding-right: 5px;
+	padding-top: 15px;
+}
+
+
+.tickerpost
+{
+	display: inline-block;
+	width:100%;
+	margin-bottom: 30px;
+	margin-right: 10px;
+}
+
+.postArea
+{
+	height:auto;
+	
+	min-height: 50px;
+}
+
+.postContent
+{
+	padding-left: 60px;
+}
+
+.postusername
+{
+	font-weight: bold;
+	color: #0279c9;
+}
+
+.postProfilePic
+{
+	float:left;
+	
+	max-width: 50px;
+	max-height: 50px;
+}
+
+.commentArea
+{
+	width: auto;
+	margin-left: 55px;
+	
+	background-color: #ededed;
+}
+
+.commentContainer
+{
+	min-height: 30px;
+
+	padding-top: 5px;
+}
+
+.commentProfilePic
+{
+	float:left;
+	
+	margin-left: 5px;
+	margin-top: 10px;
+	margin-right: 5px;
+	
+	max-width: 25px;
+	max-height: 25px;
+	vertical-align: top;
+}
+
+.commentInput
+{
+	width: calc(100% - 15px);
+	height: 18px;
+	margin-top: 2px;
+	margin-bottom: 2px;
+	margin-left: 2px;
+	
+	resize: none;
+	overflow: hidden;
+}
+
+.borderthing
+{
+	height: 1px;
+	width: calc(100% - 4px);
+	background-color: #d8d8d8;
+
+	margin: 5px auto;
+}
diff --git a/codetest/views/clear.html b/codetest/views/clear.html
new file mode 100644
index 0000000..af81c4e
--- /dev/null
+++ b/codetest/views/clear.html
@@ -0,0 +1,3 @@
+<div>
+	CLEARING
+</div>
diff --git a/codetest/views/post-modal.html b/codetest/views/post-modal.html
new file mode 100644
index 0000000..934ac70
--- /dev/null
+++ b/codetest/views/post-modal.html
@@ -0,0 +1,9 @@
+
+
+<div id="postModalContainer">
+	<form name="postForm" style="margin-left: auto; margin-right: auto;">
+		<div class="modalTitle">Status Update</div>
+		<textarea id="postModalInput" ng-keypress="postModalKeyPress($event)" name="content" ng-model="postInput" placeholder="whats on your mind?" focus-me="true"></textarea>
+		<div>hit enter to post</div>
+	</form>
+</div>
diff --git a/codetest/views/ticker.html b/codetest/views/ticker.html
new file mode 100644
index 0000000..0bd2bec
--- /dev/null
+++ b/codetest/views/ticker.html
@@ -0,0 +1,39 @@
+<!--<div id="ticker">-->
+<div id="userSection">
+	<img ng-src="{{userImageURL}}" style="margin-right: 4px; float:left">
+	<div id="userSectionName">{{userName}}</div>
+</div>
+<div id="tickerMain">
+	{{localPosts.length}}
+	<div style="font-size: 16px; font-weight: bold; margin-bottom: 20px;">Updates</div>
+	<div ng-repeat="set in postSets">
+		<div ng-repeat="post in set.data" class="tickerpost">
+			<div class="postArea">
+				<img ng-src="{{users[post.userId].pic}}" class="postProfilePic">
+
+				<div class="postContent">
+					<div class="postusername">{{users[post.userId].username}}</div>
+					{{post.content}}
+				</div>
+			</div>
+			<div class="commentArea">
+				<div ng-repeat="comment in post.comments" class="commentContainer">
+					<div style="display: inline-block; width: 100%;">
+						<span style="display: inline-block; vertical-align: top;"></span><img
+							ng-src="{{users[comment.userId].pic}}" class="commentProfilePic">
+
+						<div style="padding-left: 40px;">
+							<div class="postusername">{{users[comment.userId].username}}</div>
+							{{comment.content}}
+						</div>
+					</div>
+					<div class="borderthing"></div>
+				</div>
+				<input class="commentInput" placeholder="post a comment" ng-model="commentInput.content" ng-keypress="submitComment($event, post.id, commentInput)">
+			</div>
+		</div>
+	</div>
+</div>
+
+
+<!--</div>-->
\ No newline at end of file
