Merge pull request #1 from hgareeballa/noajax

Noajax
hgareeballa · Oct 12, 2020 · d374ae0 · d374ae0
2 parents cf72757 + b9fe975
commit d374ae0
Show file tree

Hide file tree

Showing 13 changed files with 88 additions and 77 deletions.
diff --git a/app.js b/app.js
@@ -2,6 +2,7 @@ var createError = require('http-errors');
 var express = require('express');
 var path = require('path');
 var logger = require('morgan');
+var expressLayouts = require('express-ejs-layouts');
 //var db = require('./config/db');
 
 
@@ -21,10 +22,11 @@ var indexRouter = require('./routes/index')(nav);
 var booksRouter = require('./routes/books')(nav);
 var usersRouter = require('./routes/users')(nav);
 var authRouter = require('./routes/auth')(nav);
-var bookRouter = require('./routes/bookRouter')();
+var bookRouter = require('./routes/bookRouter')(nav);
 
 var app = express();
-
+app.use(expressLayouts);
+//app.set("layout extractScripts", true);
 // view engine setup
 app.set('views', path.join(__dirname, 'views'));
 app.set('view engine', 'ejs');

diff --git a/cont/bookCont.js b/cont/bookCont.js
@@ -1,8 +1,9 @@
 const myDB = require("../config/all-repo");
 
-function bookCont() {
+function bookCont(nav) {
     async function allBooks(req, res) {
         res.render("grid_view", {
+            nav,
             title: 'Gridview Books Title',
             name: 'Book',
             fields: [{ id: 'id', name: 'ID' }, { id: 'title', name: 'Book Title' }, { id: 'author', name: 'Book Title' },],
@@ -16,6 +17,7 @@ function bookCont() {
 
     async function allBooksRo(req, res) {
         res.render("grid_view_ro", {
+            nav,
             title: 'Gridview Books Title',
             name: 'Book',
             fields: [{ id: 'id', name: 'ID' }, { id: 'title', name: 'Book Title' }, { id: 'author', name: 'Book Title' },],

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -10,6 +10,7 @@
     "debug": "~2.6.9",
     "ejs": "~2.6.1",
     "express": "~4.16.1",
+    "express-ejs-layouts": "^2.5.0",
     "express-session": "^1.17.1",
     "http-errors": "~1.6.3",
     "knex": "^0.21.6",

diff --git a/public/js/helper.js b/public/js/helper.js
@@ -1,3 +1,16 @@
+basket
+  .require(
+    { url: '/js/jquery-3.5.1.min.js' },
+    { url: '/js/jquery.easyui.min.js' }
+  )
+  .then(function () {
+    // Success
+    console.log('Loading Done!');
+  }, function (error) {
+    // There was an error fetching the script
+    console.log(error);
+  });
+
 function loadpage(url) {
   $.ajax({
     url: url,

diff --git a/routes/bookRouter.js b/routes/bookRouter.js
@@ -1,10 +1,11 @@
 var express = require("express");
 var bookRouter = express.Router();
-var { allBooks, allBooksRo, allBooksdatawithlimit, deleteBook, addBook, updateBook, getRowsWithSort } = require('../cont/bookCont')();
+
 var midware = require('../cont/midware');
 var myDB = require('../config/all-repo');
 
-function router() {
+function router(nav) {
+    var { allBooks, allBooksRo, allBooksdatawithlimit, deleteBook, addBook, updateBook, getRowsWithSort } = require('../cont/bookCont')(nav);
     //bookRouter.use(midware);
     bookRouter.route("/").get((req, res) => {
         allBooks(req, res);

diff --git a/routes/index.js b/routes/index.js
@@ -2,11 +2,11 @@ var express = require("express");
 var indexRouter = express.Router();
 
 /* GET home page. */
-function router(nav){
+function router(nav) {
   indexRouter.route("/").get((req, res) => {
     res.render("index", {
       nav,
-      title: "SignUp Page TGA",
+      title: "Home Page TGA",
     });
   });
   indexRouter.route("/home").get((req, res) => {
@@ -19,6 +19,6 @@ function router(nav){
     req.logout();
     res.redirect('/home');
   });
-return indexRouter;
+  return indexRouter;
 }
 module.exports = router;
diff --git a/routes/users.js b/routes/users.js
@@ -8,10 +8,11 @@ function router(nav) {
   const { getAll, getByid, midware, deleteRecordById } = myCont(nav);
   //userRouter.use(midware);
   userRouter.route("/").get((req, res) => {
-    res.render("users");
+    res.render("users", { nav, title: 'Users Page' });
   });
   userRouter.route("/new").get((req, res) => {
     res.render("grid_view", {
+      nav,
       title: 'Gridview Users Title',
       name: 'User',
       fields: [{ id: 'id', name: 'ID' }, { id: 'username', name: 'User Name' }, { id: 'password', name: 'Password' },],

diff --git a/views/grid_view.ejs b/views/grid_view.ejs
@@ -4,9 +4,9 @@
     <meta charset="UTF-8">
     <title>Basic CRUD Application - jQuery EasyUI CRUD Demo</title>
 </head>
-<h2><%=title %></h2>
+
 <table id="dg" title="<%=name %> View" class="easyui-datagrid" style="width:100%;height:500px" toolbar="#toolbar"
-    pagination="true" rownumbers="true" fitColumns="true" singleSelect="true">
+    url='<%=loadurl %>' pagination="true" rownumbers="true" fitColumns="true" singleSelect="true">
     <thead>
         <tr>
             <% fields.forEach(function(field){ %>
@@ -106,7 +106,7 @@
         }
     }
 </script>
-<!--<script type="text/javascript" src="/js/jquery.easyui.min.js"></script>-->
+<!-- <script type="text/javascript" src="/js/jquery.easyui.min.js"></script> -->
 <script>
     basket.require({ url: '/js/jquery.easyui.min.js' });
     $('#dg').datagrid({ url: '<%=loadurl %>' });    

diff --git a/views/grid_view_ro.ejs b/views/grid_view_ro.ejs
@@ -4,9 +4,9 @@
     <meta charset="UTF-8">
     <title>Basic CRUD Application - jQuery EasyUI CRUD Demo</title>
 </head>
-<h2><%=title %></h2>
+
 <table id="dg" title="<%=name %> View" class="easyui-datagrid" style="width:100%;height:500px" pagination="true"
-    rownumbers="true" fitColumns="true" singleSelect="true">
+    url='<%=loadurl %>' rownumbers="true" fitColumns="true" singleSelect="true">
     <thead>
         <tr>
             <% fields.forEach(function(field){ %>

diff --git a/views/home.ejs b/views/home.ejs
@@ -1,10 +1,9 @@
+<!-- Body -->
 
-  <!-- Body -->
-  <body class="text-center">
-    <div class="container">
-      <h1><%= title %></h1>
-      <p>Welcome to <%= title %></p>
-      Click Here to <a href="#" onclick="loadpage('/auth/signin')">Sign In</a>
-    </div>
-  </body>
-
+<body class="text-center">
+  <div class="container">
+    <h1><%= title %></h1>
+    <p>Welcome to <%= title %></p>
+    Click Here to <a href="/auth/signin">Sign In</a>
+  </div>
+</body>
diff --git a/views/index.ejs b/views/index.ejs
@@ -1,54 +1,2 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-  <title><%= title %></title>
-</head>
-<!-- Header -->
-<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
-  <a class="navbar-brand" href="#"><%= title %></a>
-  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
-    aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
-    <span class="navbar-toggler-icon"></span>
-  </button>
-
-  <div class="collapse navbar-collapse" id="navbarSupportedContent">
-    <ul class="navbar-nav mr-auto">
-      <% nav.forEach(function(nv){ %>
-      <li class="nav-item active">
-        <a class="nav-link" href="#" onclick="loadpage('<%=nv.link %>');"><%=nv.title %> <span
-            class="sr-only"></span></a>
-      </li>
-      <% }); %>
-    </ul>
-  </div>
-</nav>
-
-<!-- Body -->
-
-<body class="text-center">
-  <div class="container" id="mymain">Home Page</div>
-</body>
-
-</html>
-<script src="/js/basket.full.min.js"></script>
-<script src="/js/helper.js"></script>
-<link rel="stylesheet" href="/css/bootstrap.min.css" />
-<link rel="stylesheet" type="text/css" href="/css/themes/material-blue/easyui.css">
-<link rel="stylesheet" type="text/css" href="/css/themes/icon.css">
-<link rel="stylesheet" type="text/css" href="/css/themes/color.css">
-
-<script>
-  basket
-    .require(
-      { url: '/js/jquery-3.5.1.min.js' },
-      { url: '/js/jquery.easyui.min.js' }
-    )
-    .then(function () {
-      // Success
-      console.log('Loading Done!');
-    }, function (error) {
-      // There was an error fetching the script
-      console.log(error);
-    });
-</script>
+<%=title %>
+<h1>Index Page</h1>
diff --git a/views/layout.ejs b/views/layout.ejs
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title><%= title %></title>
+    <link rel="stylesheet" href="/css/bootstrap.min.css" />
+    <link rel="stylesheet" type="text/css" href="/css/themes/material-blue/easyui.css">
+    <link rel="stylesheet" type="text/css" href="/css/themes/icon.css">
+    <link rel="stylesheet" type="text/css" href="/css/themes/color.css">
+    <script src="/js/basket.full.min.js"></script>
+    <script src="/js/helper.js"></script>
+</head>
+<!-- Header -->
+-------------------
+<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
+    <a class="navbar-brand" href="#">[[<%= title %>]]</a>
+    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
+        aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+        <span class="navbar-toggler-icon"></span>
+    </button>
+
+    <div class="collapse navbar-collapse" id="navbarSupportedContent">
+        <ul class="navbar-nav mr-auto">
+            <% nav.forEach(function(nv){ %>
+            <li class="nav-item active">
+                <a class="nav-link" href="<%=nv.link %>"><%=nv.title %> <span class="sr-only"></span></a>
+            </li>
+            <% }); %>
+        </ul>
+    </div>
+</nav>
+
+<!-- Body -->
+
+<body class="text-center">
+    <div class="container" id="mymain"><%-body%></div>
+</body>
+
+</html>