Git-Mirrors/RetroShare
1
0
Fork 0
mirror of https://github.com/RetroShare/RetroShare.git synced 2024-12-27 08:29:26 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

webui: List forums, sort friends

Browse Source
This commit is contained in:
zeners 2016-02-20 18:03:27 +01:00
parent 34957b857a
commit fdb93c3f8d
7 changed files with 160 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
libresapi/src/webui-src/README.md
View File

@ -1,52 +1,52 @@
A new approach to build a webinterface for RS
=============================================
1. get JSON encoded data from the backend, data contains a state token
2. render data with mithril.js
3. ask the backend if the state token from step 1 expired. If yes, then start again with step 1.
Steps 1. and 3. are common for most things, only Step 2. differs. This allows to re-use code for steps 1. and 3.
BUILD / DEVELOPMENT
------------
- install tools
sudo apt-get install TODO (insert package names for nodejs, ruby, sass here)
- run this once in webui-src directory, to install more tools
npm install
- start build
npm run watch
- the build process watches files for changes, and rebuilds and reloads the page. Build output is in ./public
- use the --webinterface 9090 command line parameter to enable webui in retroshare-nogui
- set the --docroot parameter of retroshare-nogui to point to the "libresapi/src/webui-src/public" directory
(or symlink from /usr/share/RetroShare06/webui on Linux, ./webui on Windows)
- retroshare-gui does not have a --docroot parameter. Use symlinks then.
CONTRIBUTE
----------
- if you are a web developer or want to become one
get in contact!
- lots of work to do, i need you!
TODO
----
[ ] make stylesheets or find reusable sass/css components
google material design has nice rules for color, spacing and everything: https://www.google.de/design/spec/material-design/introduction.html
[ ] find icons, maybe use google material design iconfont
[ ] use urls/mithril routing for the menu. urls could replace state stored in rs.content
[ ] drag and drop private key upload and import
[ ] link from peer location to chat (use urls and mithril routing)
[ ] add/remove friend, own cert
[ ] downloads, search
[ ] make reusable infinite list controller, the js part to load data from Pagination.h (tweak Pagination.h to make everything work)
should provide forward, backward and follow-list-end
[ ] backend: view/create identities
[ ] backend: chat lobby participants list
[ ] chat: send_message
[ ] backend: chat typing notifications
[ ] make routines to handle retroshare links
[ ] backend: edit shared folders
[ ] backend: view shared files
[ ] redirect if a url is not usable in the current runstate (e.g. redirect from login page to home page, after login)
[ ] sort friendslist
A new approach to build a webinterface for RS
=============================================
1. get JSON encoded data from the backend, data contains a state token
2. render data with mithril.js
3. ask the backend if the state token from step 1 expired. If yes, then start again with step 1.
Steps 1. and 3. are common for most things, only Step 2. differs. This allows to re-use code for steps 1. and 3.
BUILD / DEVELOPMENT
------------
- install tools
sudo apt-get install TODO (insert package names for nodejs, ruby, sass here)
- run this once in webui-src directory, to install more tools
npm install
- start build
npm run watch
- the build process watches files for changes, and rebuilds and reloads the page. Build output is in ./public
- use the --webinterface 9090 command line parameter to enable webui in retroshare-nogui
- set the --docroot parameter of retroshare-nogui to point to the "libresapi/src/webui-src/public" directory
(or symlink from /usr/share/RetroShare06/webui on Linux, ./webui on Windows)
- retroshare-gui does not have a --docroot parameter. Use symlinks then.
CONTRIBUTE
----------
- if you are a web developer or want to become one
get in contact!
- lots of work to do, i need you!
TODO
----
[ ] make stylesheets or find reusable sass/css components
google material design has nice rules for color, spacing and everything: https://www.google.de/design/spec/material-design/introduction.html
[ ] find icons, maybe use google material design iconfont
[X] use urls/mithril routing for the menu. urls could replace state stored in rs.content
[X] drag and drop private key upload and import
[ ] link from peer location to chat (use urls and mithril routing)
[X] add/remove friend, own cert
[X] downloads, search
[ ] make reusable infinite list controller, the js part to load data from Pagination.h (tweak Pagination.h to make everything work)
should provide forward, backward and follow-list-end
[ ] backend: view/create identities
[ ] backend: chat lobby participants list
[ ] chat: send_message
[ ] backend: chat typing notifications
[ ] make routines to handle retroshare links
[ ] backend: edit shared folders
[ ] backend: view shared files
[ ] redirect if a url is not usable in the current runstate (e.g. redirect from login page to home page, after login)
[X] sort friendslist

14
libresapi/src/webui-src/app/chat.js
View File

@ -117,7 +117,13 @@ function lobby(lobbyid){
module.exports = {
frame: function(content, right){
return m(".chat.container", [
m(".chat.header", "headerbar"),
m(".chat.header", [
m(
"h2",
{style:{margin:"0px"}},
"chat"
)
]),
m(".chat.left", [
m("div.chat.header[style=position:relative]","lobbies:"),
m("br"),
@ -136,7 +142,11 @@ module.exports = {
);
};
return this.frame(
m("div", "please select lobby"),
m(
"div",
{style: {margin:"10px"}},
"please select lobby"
),
m("div","right"));
}
}

64
libresapi/src/webui-src/app/forums.js Normal file
View File

@ -0,0 +1,64 @@
"use strict";
var m = require("mithril");
var rs = require("retroshare");
module.exports = {view: function(){
return m("div",[
m("h2","forums"),
m("hr"),
/*
m("div.btn2", {
onclick: function (){
m.route("/addforum");
}
},"< create new forum >"),
*/
m("ul",
rs.list("forums",
function(item){
return m("li",[
m("h2",item.name),
m("div",{style:{margin:"10px"}},
[
item.description != ""
? [
m("span", "Description: "
+ item.description),
m("br")]
: [],
m("span","messages visible: "
+ item.visible_msg_count),
]
),
/*
item.subscribed
? [
m(
"span.btn2",
{style:{padding:"0px"}},
"unsubscribe"
),
" ",
m(
"span.btn2",
{style:{padding:"0px", margin:"10px"}},
"enter"
),
m("hr", {style: {color:"silver"}}),
]
: [
m(
"span.btn2",
{style:{padding:"0px", margin:"10px"}},
"subscribe"
),
]
*/
]);
},
rs.sort("name")
)
)
]);
}}

3
libresapi/src/webui-src/app/identities.js
View File

@ -15,7 +15,8 @@ module.exports = {view: function(){
m("ul",
rs.list("identity/own", function(item){
return m("li",[m("h2",item.name)]);
})
},
rs.sort("name"))
)
]);
}}

4
libresapi/src/webui-src/app/menudef.js
View File

@ -63,6 +63,10 @@ module.exports = { nodes: [
runstate: "running_ok.*",
counter: rs.counting("transfers/downloads")
},
{
name: "forums",
runstate: "running_ok.*",
},
{
name: "chat",
runstate: "running_ok.*",

1
libresapi/src/webui-src/app/peers.js
View File

@ -14,6 +14,7 @@ module.exports = {view: function(){
m("h3","waiting_server"),
]);
};
peers = peers.sort(rs.sort("name"));
//building peerlist (prebuild for counting)
var online = 0;

28
libresapi/src/webui-src/app/retroshare.js
View File

@ -280,16 +280,19 @@ rs.counting = function(path, counterfnkt) {
}
return "";
}
}
};
// listing data-elements
rs.list = function(path, buildfktn){
rs.list = function(path, buildfktn, sortfktn){
var list = rs(path);
if (list === undefined|| list == null) {
return "< waiting for server ... >"
};
if (sortfktn != undefined && sortfktn != null) {
list=list.sort(sortfktn);
}
return list.map(buildfktn);
}
};
//remember additional data (feature of last resort)
rs.memory = function(path, args){
@ -304,3 +307,22 @@ rs.memory = function(path, args){
return item.memory;
};
//return sorting-function for string, based on property name
//using: list.sort(rs.sort("name"));
// -----
//innersort: cascading sorting - using:
//list.sort(rs.sort("type",rs.sort("name")))
rs.sort = function(name, innersort){
return function(a,b){
if (a[name].toLowerCase() == b[name].toLowerCase()) {
if (innersort === undefined) {
return 0
}
return innersort(a,b);
} else if (a[name].toLowerCase() < b[name].toLowerCase()) {
return -1
} else {
return 1
}
}
}