kev/Onionr
1
0
Fork 0
Code Issues 24 Pull Requests Projects Releases 2 Wiki Activity

added popular board selector

Browse Source
This commit is contained in:
Kevin Froman 2020-03-29 18:51:12 -05:00
parent 7bb4a7680a
commit 160469f50f
5 changed files with 96 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
static-data/www/board/board.js
View File

@ -251,4 +251,10 @@ newPostForm.onsubmit = function(){
return false return false
} }
resetCirclePickers = function(){
document.getElementById('recommendedBoards').value = ""
document.getElementById('popularBoards').value = ""
}
document.getElementById('feedIDInput').onchange = resetCirclePickers

1
static-data/www/board/default-circle-picker.js
View File

@ -22,4 +22,5 @@ recommendedIDs = document.getElementById('recommendedBoards')
recommendedIDs.onchange = function(){ recommendedIDs.onchange = function(){
document.getElementById('feedIDInput').value = recommendedIDs.value document.getElementById('feedIDInput').value = recommendedIDs.value
getBlocks() getBlocks()
resetCirclePickers()
} }

64
static-data/www/board/index.html
View File

@ -8,25 +8,26 @@
<title> <title>
Circles Circles
</title> </title>
<link rel='shortcut icon' type='image/ico' href='/shared/images/favicon.ico'> <link rel="shortcut icon" type="image/ico" href="/shared/images/favicon.ico">
<link rel='stylesheet' href='/shared/main/PNotifyBrightTheme.css'> <link rel="stylesheet" href="/shared/main/PNotifyBrightTheme.css">
<link rel="stylesheet" href="/shared/fontawesome-free-5.10.2/css/all.min.css"> <link rel="stylesheet" href="/shared/fontawesome-free-5.10.2/css/all.min.css">
<link rel="stylesheet" href="/gettheme"> <link rel="stylesheet" href="/gettheme">
<link rel="stylesheet" href="theme.css"> <link rel="stylesheet" href="theme.css">
<script defer src="/shared/base32.js"></script> <script defer src="/shared/base32.js"></script>
<script defer src="/shared/identicon.js"></script> <script defer src="/shared/identicon.js"></script>
<script defer src='/shared/node_modules/pnotify/dist/iife/PNotify.js'></script> <script defer src="/shared/node_modules/pnotify/dist/iife/PNotify.js"></script>
<script defer src='/shared/node_modules/pnotify/dist/iife/PNotifyButtons.js'></script> <script defer src="/shared/node_modules/pnotify/dist/iife/PNotifyButtons.js"></script>
<script defer src="/shared/useridenticons.js"></script> <script defer src="/shared/useridenticons.js"></script>
<script defer src='/shared/misc.js'></script> <script defer src="/shared/misc.js"></script>
<script defer src='/shared/navbar.js'></script> <script defer src="/shared/navbar.js"></script>
<script defer src="/shared/main/apicheck.js"></script> <script defer src="/shared/main/apicheck.js"></script>
<script defer src="detect-plaintext-storage.js"></script> <script defer src="detect-plaintext-storage.js"></script>
<script defer src='sethumanreadable.js'></script> <script defer src="sethumanreadable.js"></script>
<script defer src="default-circle-picker.js"></script> <script defer src="default-circle-picker.js"></script>
<script defer src="sort-posts.js"></script> <script defer src="sort-posts.js"></script>
<script defer src='board.js'></script> <script defer src="board.js"></script>
<script defer src='autorefresh.js'></script> <script defer src="autorefresh.js"></script>
<script defer src="popular.js"></script>
</head> </head>
<body> <body>
@ -114,22 +115,43 @@
<a class="button is-static">Circle Name</a> <a class="button is-static">Circle Name</a>
</p> </p>
<p class="control is-expanded"> <p class="control is-expanded">
<input id='feedIDInput' class="input" placeholder="Board name" value="global"> <input id="feedIDInput" class="input" placeholder="Board name" value="global">
</p> </p>
<p class="control"> <p class="control">
<a class="button is-success" id='refreshFeed'>Refresh Feed</a> <a class="button is-success" id="refreshFeed">Refresh Feed</a>
</p> </p>
</div> </div>
<label for="recommendedBoards">Main Circles:</label> <div class="field">
<select id="recommendedBoards"> <div class="columns">
<option value="global">Global</option> <div class="column is-2">
<option value="onionr">Onionr</option> <div class="control">
<option value="games">Games</option> <label for="recommendedBoards" class="label">Default Circles:</label>
<option value="politics">Politics</option> <div class="select">
<option value="tech">Tech</option> <select id="recommendedBoards">
<option value="random">Random</option> <option value=""></option>
<option value="privacy">Privacy</option> <option value="global">Global</option>
</select> <option value="onionr">Onionr</option>
<option value="games">Games</option>
<option value="politics">Politics</option>
<option value="tech">Tech</option>
<option value="random">Random</option>
<option value="privacy">Privacy</option>
</select>
</div>
</div>
</div>
<div class="column is-2">
<div class="control">
<label for="popularBoards" class="label">Popular Circles:</label>
<div class="select">
<select id="popularBoards">
<option value="">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</option>
</select>
</div>
</div>
</div>
</div>
</div>
<p class="control"> <p class="control">
<br> <br>
Note: All posts in Circles are publicly accessible. Note: All posts in Circles are publicly accessible.

45
static-data/www/board/popular.js Normal file
View File

@ -0,0 +1,45 @@
/*
Onionr - Private P2P Communication
Load popular boards and show them in the UI. Handle selections of popular boards.
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
fetch('/circles/getpopular/8', {
method: 'GET',
headers: {
"token": webpass
}})
.then((popular) => popular.text())
.then(function(popular) {
var popularSelect = document.getElementById('popularBoards')
let boards = popular.split(',')
for (board of boards){
let newOption = document.createElement('option')
if (board == ""){continue}
newOption.value = board
newOption.innerText = board.charAt(0).toUpperCase() + board.slice(1)
console.debug(board)
popularSelect.appendChild(newOption)
}
})
document.getElementById('popularBoards').onchange = function(){
document.getElementById('feedIDInput').value = document.getElementById('popularBoards').value
getBlocks()
resetCirclePickers()
}

2
static-data/www/board/theme.css
View File

@ -8,4 +8,4 @@
body{ body{
background-color: #212224; background-color: #212224;
color: white; color: white;
} }