tried to get this shit working but it still isnt

caylazabel · Jan 19, 2017 · 48777f3 · 48777f3
1 parent d80040b
commit 48777f3
Show file tree

Hide file tree

Showing 10 changed files with 1,270 additions and 13 deletions.
diff --git a/public/Scripts/controllers/aboutController.js b/public/Scripts/controllers/aboutController.js
@@ -0,0 +1,12 @@
+'use strict';
+
+(function(module) {
+  const aboutController = {};
+
+  aboutController.init = function(){
+    $('.tab-content').hide();
+    $('#about').show();
+  }
+
+  module.aboutController = aboutController;
+})(window);
diff --git a/public/Scripts/controllers/articleController.js b/public/Scripts/controllers/articleController.js
@@ -0,0 +1,14 @@
+'use strict';
+
+(function(module) {
+  const articleController = {};
+
+  articleController.init = function(){
+
+    Article.fetchAll(articleView.initIndexPage);
+    $('.tab-content').hide();
+    $('#articles').fadeIn();
+  }
+
+  module.articleController = articleController;
+})(window);
diff --git a/public/Scripts/controllers/routes.js b/public/Scripts/controllers/routes.js
@@ -0,0 +1,7 @@
+'use strict';
+
+page('/', articleController.init);
+page('/about', aboutController.init);
+
+
+page();
diff --git a/public/Scripts/article.js → public/Scripts/models/article.js b/public/Scripts/article.js → public/Scripts/models/article.js
@@ -1,7 +1,7 @@
 'use strict';
 
 
-(fuction(contents){
+(fuction(contents) {
 function Article (works) {
 
   Object.keys(works).forEach(e => this[e] = works[e]);
@@ -23,8 +23,9 @@ return template(this);
 };
 
 Article.loadAll = rows  => {
-  rows.sort((a,b)) => (newDate(b.publishedOn)) - (newDate(a.publishedOn)));
-
+  rows.sort((a,b)) => (new Date(b.publishedOn)) - (new Date(a.publishedOn)));
+  Article.all = rows.map(ele => new Article(ele));
+};
 
 
 // Article.loadAll = function(rawData) {
@@ -35,12 +36,6 @@ Article.loadAll = rows  => {
 // rawData.forEach(function(ele) {
 //   Article.all.push(new Article(ele));
 
-Article.all = rawData.map(function(ele){
-  return new Article(ele);
-  });
-};
-
-
 Article.fetchAll = callback => {
   $.get('/articles/all')
   .then(
@@ -98,6 +93,14 @@ Article.numberWordsByAuthor = () => {
     })
   };
 
+  Article.stats = () => {
+    return {
+      numArticles: Article.all.length,
+      numWords: Article.numberWordsAll(),
+      Authors: Article.allAuthors(),
+    }
+  };
+
   Article.truncateTable = callback => {
     $.ajax({
       url: '/articles/truncate',

diff --git a/public/Scripts/views/adminView.js b/public/Scripts/views/adminView.js
@@ -0,0 +1,15 @@
+(function() {
+  const adminView = {
+
+    initAdminPage : () => {
+      let template = Handlebars.compile($('#author-template').text());
+      Article.numberWordsByAuthor().forEach(stat => {
+        $('.author-stats').append(template(stat));
+      });
+      $('#blog-stats .articles').text(Article.all.length);
+      $('#blog-stats .words').text(Article.numberWordsAll());
+    }
+  };
+
+  Article.fetchAll(adminView.initAdminPage);
+})();
diff --git a/public/Scripts/articleView.js → public/Scripts/views/articleView.js b/public/Scripts/articleView.js → public/Scripts/views/articleView.js
diff --git a/public/Scripts/views/newArticle.js b/public/Scripts/views/newArticle.js
@@ -0,0 +1,30 @@
+(function() {
+  const newArticle = {};
+
+  newArticle.initNewArticlePage = function() {
+    $('.tab-content').show();
+    $('#export-field').hide();
+    $('#article-json').on('focus', function() {
+      $(this).select();
+    });
+    $('#new-form').on('change', newArticle.create);
+  };
+
+  newArticle.create = function() {
+    $('#articles').empty();
+    let formArticle = new Article({
+      title: $('#article-title').val(),
+      author: $('#article-author').val(),
+      authorUrl: $('#article-author-url').val(),
+      category: $('#article-category').val(),
+      body: $('#article-body').val(),
+      publishedOn: $('#article-published:checked').length ? new Date() : null
+    });
+    $('#articles').append(formArticle.toHtml('#article-template'));
+    $('pre code').each((i, block) => hljs.highlightBlock(block));
+    $('#export-field').show();
+    $('#article-json').val(JSON.stringify(formArticle) + ',');
+  };
+
+  newArticle.initNewArticlePage();
+})();
diff --git a/public/admin.html b/public/admin.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>My Portfolio</title>
+    <link rel="stylesheet" href="styles/normalize.css">
+    <link rel="stylesheet" href="styles/icons.css">
+    <link rel="stylesheet" href="styles/base.css">
+    <link rel="stylesheet" href="styles/layout.css">
+    <link rel="stylesheet" href="styles/modules.css">
+    <link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
+
+    <script id="author-template" type="text/x-handlebars-template">
+      <li><strong>{{name}}</strong>: {{numberWords}} words written</li>
+    </script>
+  </head>
+  <body>
+    <header class="site-header clearfix">
+      <section class="heading-group-h1 pull-left">
+        <h1>
+          CAYLA ZABEL
+        </h1>
+      </section>
+      <nav class="main-nav">
+        <div class="icon-menu"></div>
+        <ul>
+          <li class="tab"><a href="index.html" class="icon-home"></a>Blog</li>
+          <li class="tab"><a href="admin.html"></a>Stats</li>
+          <li class="tab"><a href="new.html">New Article</a></li>
+        </ul>
+      </nav>
+    </header>
+    <main class="clearfix">
+      <h1>Blog Stats</h1>
+      <section id="blog-stats">
+        <dt>Total articles:</dt> <dd class="articles"></dd>
+        <dt>Total words:</dt> <dd class="words"></dd>
+        <h2>Author Stats</h2>
+        <p><em>Details on who is writing, and how much writing they are doing...</em></p>
+        <ul class="author-stats">
+        </ul>
+      </section>
+    </main>
+    <footer>
+      &copy; 2017 Code Fellows | Static Blog | Happy Ipsum!
+    </footer>
+
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
+
+
+  </body>
+</html>
diff --git a/public/index.html b/public/index.html
@@ -32,8 +32,8 @@ <h3>{{author}}</h3>
       <nav class="main-nav">
 
         <ul>
-          <li><a href="#" class="tab" data-content="projects"> Work </a></li>
-          <li><a href="#" class="tab" data-content="about_me"> About Me </a></li>
+          <li><a href="/" class="tab" data-content="projects"> Work </a></li>
+          <li><a href="/about" class="tab" data-content="about_me"> About Me </a></li>
           <li><a href="github.com/caylazabel"><img src="styles/img/gitttt.png" style="width:6%; height: 6%"></a>
           </li>
           <li><a href="http://www.linkedin.com/in/cayla-zabel-806464a4"><img src="styles/img/linkedin.png" style="width:6%; height: 6%"> </a></li>
@@ -62,11 +62,23 @@ <h4>&copy; 2017 Cayla Zabel | Portfolio | Happy Ipsum!</h4>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.6/handlebars.js"></script>
-<script src="scripts/arrayArticles.js"></script>
+
+<!-- <script src="scripts/arrayArticles.js"></script>
 <script src="scripts/article.js"></script>
-<script src="scripts/articleView.js"></script>
+<script src="scripts/articleView.js"></script> -->
+
+
+  <script src="/vendor/scripts/page.js"></script>
+
+
+  <script src="/scripts/models/article.js"></script>
+  <script src="/scripts/views/articleView.js"></script>
+  <script src="/scripts/views/newArticle.js"></script>
 
+  <script type="text/javascript" src="/scripts/controllers/articleController.js"></script>
+  <script type="text/javascript" src="/scripts/controllers/aboutController.js"></script>
 
+  <script type="text/javascript" src="/scripts/controllers/routes.js"></script>
 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.4/jquery.backstretch.min.js"></script>