update main page from react

This commit is contained in:
YouROK
2020-12-04 16:55:20 +03:00
parent 78940295ad
commit 9cf6b6f03e
11 changed files with 5 additions and 671 deletions

View File

@@ -2,16 +2,9 @@ package pages
import (
"github.com/gin-gonic/gin"
"server/web/pages/template"
)
func mainPage(c *gin.Context) {
c.HTML(200, "mainPage", nil)
}
func apijsPage(c *gin.Context) {
c.HTML(200, "apijsPage", nil)
}
func mainjsPage(c *gin.Context) {
c.HTML(200, "mainjsPage", nil)
c.Data(200, "text/html; charset=utf-8", []byte(template.MainPage))
}

View File

@@ -1,17 +1,9 @@
package pages
import (
"server/web/pages/template"
"github.com/gin-gonic/gin"
)
var temp *template.Template
func SetupRoute(route *gin.Engine) {
temp = template.InitTemplate(route)
route.GET("/", mainPage)
// route.GET("/api.js", apijsPage)
// route.GET("/main.js", mainjsPage)
}

View File

@@ -1,87 +0,0 @@
package template
const apiJS = `
// Torrents
function addTorrent(link, title, poster, save, done, fail){
torrent("add",link,null,title,poster,save,done,fail);
}
function getTorrent(hash, done, fail){
torrent("get",null,hash,null,null,null,done,fail);
}
function remTorrent(hash, done, fail){
torrent("rem",null,hash,null,null,null,done,fail);
}
function listTorrent(done, fail){
torrent("list",null,null,null,null,null,done,fail);
}
function dropTorrent(hash, done, fail){
torrent("drop",null,hash,null,null,null,done,fail);
}
function torrent(action, link, hash, title, poster, save, done, fail){
var req = JSON.stringify({ action:action, link: link, title: title, poster: poster, save_to_db: save});
$.post('/torrents',req)
.done(function( data ) {
if (done)
done(data);
})
.fail(function( data ) {
if (fail)
fail(data);
});
}
//
// Settings
function getSettings(done, fail){
sendApi("get",null,"/settings",done,fail);
}
function setSettings(sets, done, fail){
sendApi("set",sets,"/settings",done,fail);
}
//
// Viewed
function listViewed(done, fail){
sendApi("list",null,"/viewed",done,fail);
}
function setViewed(hash, index, done, fail){
var obj = {"hash":hash, "file_index":index};
sendApi("set",obj,"/viewed",done,fail);
}
function remViewed(hash, index, done, fail){
var obj = {"hash":hash, "file_index":index};
sendApi("rem",obj,"/viewed",done,fail);
}
//
function sendApi(action, obj, path, done, fail){
if (obj==null)
obj={};
obj[action]=action;
var req = JSON.stringify(obj);
$.post(path,req)
.done(function( data ) {
if (done)
done(data);
})
.fail(function( data ) {
if (fail)
fail(data);
});
}
function humanizeSize(size) {
if (typeof size == 'undefined' || size == 0)
return "";
var i = Math.floor( Math.log(size) / Math.log(1024) );
return ( size / Math.pow(1024, i) ).toFixed(2) * 1 + ' ' + ['B', 'kB', 'MB', 'GB', 'TB'][i];
}
`

File diff suppressed because one or more lines are too long

View File

@@ -1,27 +0,0 @@
package template
import (
"server/version"
)
const header = `
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="` + faviconB64 + `" rel="icon" type="image/x-icon">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.5.1.min.js" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.5.4/umd/popper.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js" integrity="sha384-LtrjvnR4Twt/qOuYxE721u19sVFLVSA4hf/rRt6PrZTmiPltdZcI7q7PXQBYTKyf" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.11.0/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.4.0/backbone-min.js"></script>
<title>TorrServer ` + version.Version + `</title>
</head>
`

View File

@@ -1,88 +0,0 @@
// Torrents
function addTorrent(link, title, poster, save) {
torrent("add", link, null, title, poster, save, done, fail);
}
function getTorrent(hash, done, fail) {
torrent("get", null, hash, null, null, null, done, fail);
}
function remTorrent(hash, done, fail) {
torrent("rem", null, hash, null, null, null, done, fail);
}
function listTorrent(done, fail) {
torrent("list", null, null, null, null, null, done, fail);
}
function dropTorrent(hash, done, fail) {
torrent("drop", null, hash, null, null, null, done, fail);
}
function torrent(action, link, hash, title, poster, save, done, fail) {
var req = JSON.stringify({action: action, link: link, title: title, poster: poster, save_to_db: save});
$.post('/torrents', req)
.done(function (data) {
if (done)
done(data);
})
.fail(function (data) {
if (fail)
fail(data);
});
}
//
// Settings
function getSettings(done, fail) {
sendApi("get", null, "/settings", done, fail);
}
function setSettings(sets, done, fail) {
sendApi("set", sets, "/settings", done, fail);
}
//
// Viewed
function listViewed(done, fail) {
sendApi("list", null, "/viewed", done, fail);
}
function setViewed(hash, index, done, fail) {
var obj = {"hash": hash, "file_index": index};
sendApi("set", obj, "/viewed", done, fail);
}
function remViewed(hash, index, done, fail) {
var obj = {"hash": hash, "file_index": index};
sendApi("rem", obj, "/viewed", done, fail);
}
//
function sendApi(action, obj, path, done, fail) {
if (obj == null)
obj = {};
obj[action] = action;
var req = JSON.stringify(obj);
$.post(path, req)
.done(function (data) {
if (done)
done(data);
})
.fail(function (data) {
if (fail)
fail(data);
});
}
function humanizeSize(size) {
if (typeof size == 'undefined' || size == 0)
return "";
var i = Math.floor(Math.log(size) / Math.log(1024));
return (size / Math.pow(1024, i)).toFixed(2) * 1 + ' ' + ['B', 'kB', 'MB', 'GB', 'TB'][i];
}

View File

@@ -1,155 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>TorrServer</title>
<meta charset="utf-8"/>
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width"/>
<script src="https://unpkg.com/react@latest/umd/react.development.js" crossorigin="anonymous"></script>
<script src="https://unpkg.com/react-dom@latest/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@material-ui/core@latest/umd/material-ui.development.js" crossorigin="anonymous"></script>
<script src="https://unpkg.com/babel-standalone@latest/babel.min.js" crossorigin="anonymous"></script>
<!-- Fonts to support Material Design -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"/>
<!-- Icons to support Material Design -->
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
error: null,
version: "",
};
}
componentDidMount() {
fetch("/echo")
.then(res => res.text())
.then(
(txt) => {
this.setState({
version: txt
});
}
);
}
componentDidUpdate() {
document.title = 'TorrServer ' + this.state.version;
}
render() {
return (
<Container maxWidth="sm">
<div style={'marginTop: 24'}>
<Typography variant="h4" component="h1" gutterBottom>
CDN v4-beta example
</Typography>
<ProTip/>
<Copyright/>
</div>
</Container>
);
}
}
class TorrentList extends React.Component {
constructor(props) {
super(props);
this.state = {date: new Date()};
}
componentDidMount() {
this.timerID = setInterval(
() => this.tick(),
1000
);
}
componentWillUnmount() {
clearInterval(this.timerID);
}
tick() {
this.setState({
date: new Date()
});
}
render() {
return (
<div>
<h1>Привет, мир!</h1>
<h2>Сейчас {this.state.date.toLocaleTimeString()}.</h2>
</div>
);
}
}
const {
colors,
CssBaseline,
ThemeProvider,
Typography,
Container,
makeStyles,
createMuiTheme,
Box,
SvgIcon,
Link,
} = MaterialUI;
// Create a theme instance.
const theme = createMuiTheme({
palette: {
primary: {
main: '#556cd6',
},
secondary: {
main: '#19857b',
},
error: {
main: colors.red.A400,
},
background: {
default: '#fff',
},
},
});
function LightBulbIcon(props) {
return (
<SvgIcon {...props}>
<path d="M9 21c0 .55.45 1 1 1h4c.55 0 1-.45 1-1v-1H9v1zm3-19C8.14 2 5 5.14 5 9c0 2.38 1.19 4.47 3 5.74V17c0 .55.45 1 1 1h6c.55 0 1-.45 1-1v-2.26c1.81-1.27 3-3.36 3-5.74 0-3.86-3.14-7-7-7zm2.85 11.1l-.85.6V16h-4v-2.3l-.85-.6C7.8 12.16 7 10.63 7 9c0-2.76 2.24-5 5-5s5 2.24 5 5c0 1.63-.8 3.16-2.15 4.1z"/>
</SvgIcon>
);
}
const useStyles = makeStyles(theme => ({
root: {
margin: theme.spacing(6, 0, 3),
},
lightBulb: {
verticalAlign: 'middle',
marginRight: theme.spacing(1),
},
}));
ReactDOM.render(
<ThemeProvider theme={theme}>
<CssBaseline/>
<App/>
</ThemeProvider>,
document.getElementById('root')
);
</script>
</body>
</html>

View File

@@ -1,47 +0,0 @@
(function() {
const Torrent = Backbone.Model.extend({
defaults: function() {
return {
title: "",
torr: {},
url:"/torrents"
};
},
remove: function() {
this.destroy();
},
fetch: function (){
const collection = this;
getTorrent(this.torr.hash, function (torr){
console.log(torr);
collection.reset(torr);
})
}
});
var TorrentList = Backbone.Collection.extend({
model: Torrent,
update: function(){
listTorrent(function(torrs){
// torrs.forEach(tr=>
//
// )
Torrents.create({title:""});
console.log(Torrents);
},function (error) {
console.log(error);
});
}
});
var AppView = Backbone.View.extend({
el: $("#torrents"),
initialize: function() {
Torrents.update();
},
});
var Torrents = new TorrentList;
var App = new AppView;
})();

File diff suppressed because one or more lines are too long

View File

@@ -1,50 +0,0 @@
package template
const mainJS = `
(function() {
const Torrent = Backbone.Model.extend({
defaults: function() {
return {
title: "",
torr: {},
url:"/torrents"
};
},
remove: function() {
this.destroy();
},
fetch: function (){
const collection = this;
getTorrent(this.torr.hash, function (torr){
console.log(torr);
collection.reset(torr);
})
}
});
var TorrentList = Backbone.Collection.extend({
model: Torrent,
update: function(){
listTorrent(function(torrs){
// torrs.forEach(tr=>
//
// )
Torrents.create({title:""});
console.log(Torrents);
},function (error) {
console.log(error);
});
}
});
var AppView = Backbone.View.extend({
el: $("#torrents"),
initialize: function() {
Torrents.update();
},
});
var Torrents = new TorrentList;
var App = new AppView;
})();
`

View File

@@ -1,47 +0,0 @@
package template
import (
"html/template"
"github.com/gin-gonic/gin"
)
var ctx *gin.Engine
type Template struct {
templates *template.Template
}
func InitTemplate(c *gin.Engine) *Template {
temp := new(Template)
temp.parsePage("mainPage", mainPage)
// temp.parsePage("apijsPage", apiJS)
// temp.parsePage("mainjsPage", mainJS)
c.SetHTMLTemplate(temp.templates)
return temp
}
func (t *Template) render(c *gin.Context, code int, name string, data interface{}) {
c.HTML(code, name, data)
}
func (t *Template) parsePage(name, page string) error {
s := page
var tmpl *template.Template
if t.templates == nil {
t.templates = template.New(name)
}
if name == t.templates.Name() {
tmpl = t.templates
} else {
tmpl = t.templates.New(name)
}
tmpl.Delims("<<", ">>")
_, err := tmpl.Parse(s)
if err != nil {
return err
}
return nil
}