Skip to content
Snippets Groups Projects
Commit 72a5d798 authored by Rickard Loland's avatar Rickard Loland
Browse files

Cleanup and comment index.html

parents 43382ba1 a495fba8
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
client/index.html
+ 4
− 16
View file @ 72a5d798
......@@ -18,31 +18,19 @@
NODE_ENV: 'production'
}
};
/*
* [polymer-root-path]
*
* Leave this line unchanged if you intend to serve your app from the root
* path (e.g., with URLs like `my.domain/` and `my.domain/view1`).
*
* If you intend to serve your app from a non-root path (e.g., with URLs
* like `my.domain/my-app/` and `my.domain/my-app/view1`), edit this line
* to indicate the path from which you'll be serving, including leading
* and trailing slashes (e.g., `/my-app/`).
*/
window.MyAppGlobals = {
rootPath: '/',
serverURL: 'http://localhost:8081/'
};
</script>
<!-- Load webcomponents, this needs to be activated once you have installed node -->
<script src="./node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
<!-- bootstrap -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
<!-- Import the main component -->
<script type="module" src="./router.js"></script>
</head>
<!--Basic html for all our pages with body, header and footer-->
<body>
<header>
<a href="http://localhost:8080"><h1>XYZ Forum</h1></a>
......@@ -67,7 +55,7 @@
</div>
</header>
<div class="content">
<div id="outlet"></div>
<div id="outlet"><!--Our lit-elements are loaded here--></div>
</div>
<div class="footer">
<f1>
......
client/js/createpost.js
+ 0
− 1
View file @ 72a5d798
......@@ -71,6 +71,5 @@ export class CreatePost extends LitElement {
</div>
`;
}
// Return user to homepage
}
customElements.define('create-post', CreatePost);
\ No newline at end of file
client/js/homepage.js
+ 29
− 62
View file @ 72a5d798
/* library */
import { LitElement, html, css } from '../node_modules/lit-element/lit-element';
/* global data */
var arrPost = [];
/**
* @brief Display all the post embeds according to page number.
*
* @param {*} postEmbedHTML
* @param {*} page
*/
function displayPostEmbed(postEmbedHTML, page) {
var start = page * 10 - 10;
postEmbedHTML.innerHTML = ``;
for(var i = start; i < page * 10; i++) {
if(arrPost[i] === undefined) break;
postEmbedHTML.innerHTML += arrPost[i];
}
}
/**
* @brief Class HomePage
*
*/
export class HomePage extends LitElement {
/**
* @brief Local styles
* @brief Local styles.
*
*/
static get styles() {
return [css `
......@@ -117,13 +103,12 @@ export class HomePage extends LitElement {
}`, css `
.comment {
margin-bottom: 10px;
}`, css `
`, css `
`
}`
];
}
/**
* @brief Properties
* @brief Define all global variables.
*
*/
static get properties() {
return {
......@@ -136,7 +121,8 @@ export class HomePage extends LitElement {
};
}
/**
* @brief Constructor
* @brief Get all posts on construction.
*
*/
constructor() {
super();
......@@ -168,10 +154,13 @@ export class HomePage extends LitElement {
);
}
/**
* @brief Render this HTML code to the webpage
* @brief Render this HTML code to the webpage.
*
*/
render() {
//if render is run without any posts, return empty html code
if(this.postKey === undefined) return html``;
//fill in array of indexes so it can be used in the map loop
for(var i = 0; i < this.postKey.length; i++) {
this.arrIndex[i] = i;
}
......@@ -200,8 +189,13 @@ export class HomePage extends LitElement {
<div id="stealthContainer">
<div id="stealthContent">
<span class="close" @click=${e => this.closeStealth()}\>&times;</span>
<<<<<<< HEAD
<div class="title" id="pageTitle">TITLE!</div>
<div class="description" id="pageDescription">DESCRIPTION...</div>
=======
<div class="title" id="pageTitle"></div>
<div class="description" id="pageDescription"></div>
>>>>>>> a495fba817e9e6c8eaeade724a8827d8e04f55a3
<form id="formComment" action="http://localhost:8081/createComment/" method="GET" class="form">
<div class="form-col">
<textarea id="comment" name="comment" rows="2" col="10"></textarea>
......@@ -210,25 +204,7 @@ export class HomePage extends LitElement {
<input type="submit" value="Post comment">
</button>
</form>
<div id="commentContainer">
<div class="comment">
<div class="commentPoster">
Author: 1
</div>
<div class="commentContent">
Lorum ipsum...
</div>
</div>
<div class="comment">
<div class="commentPoster">
Author: 1
</div>
<div class="commentContent">
Lorum ipsum...
</div>
</div>
</div>
<div id="commentContainer"></div>
</div>
</div>
</div>
......@@ -236,26 +212,9 @@ export class HomePage extends LitElement {
`;
}
/**
* @brief Run this function after render().
*/
updated() {
//get current user
/*fetch(
`${window.MyAppGlobals.serverURL}getUser`
).then(
res => res.json()
).then(
data => {
console.log(data);
}
);*/
}
/**
* @brief Update post embed according to page number
* @brief Display a post as a pop-up.
*
*/
updateEmbed() {
displayPostEmbed(this.shadowRoot.getElementById('postEmbedContainer'), this.shadowRoot.getElementById('sortPage').value);
}
displayPost(id) {
for(var i = 0; i < this.postKey.length; i++) {
if(this.postKey[i] == id) {
......@@ -279,6 +238,10 @@ export class HomePage extends LitElement {
}
);
}
/**
* @brief Display all the comments to a specific post.
*
*/
displayComment(arrComment) {
console.log(arrComment);
this.shadowRoot.getElementById('commentContainer').innerHTML = ``;
......@@ -295,6 +258,10 @@ export class HomePage extends LitElement {
`;
}
}
/**
* @brief Close post pop-up.
*
*/
closeStealth() {
this.shadowRoot.getElementById('stealthContainer').style.display = "none";
}
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment