itsscb/filebrowser
1
0
Fork 0
mirror of https://github.com/filebrowser/filebrowser.git synced 2025-11-03 19:03:16 +00:00
Code Issues Packages Projects Releases 1 Wiki Activity

add browse functionality

Browse Source
This commit is contained in:
Henrique Dias 2015-09-17 17:41:31 +01:00
parent 686a909e23
commit edf0a453a3
10 changed files with 258 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
assets/css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

26
assets/css/src/main.css
View File

@ -2467,7 +2467,7 @@ h2 {
margin: .83em 0; margin: .83em 0;
} }
header { nav {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
@ -2480,7 +2480,7 @@ header {
color: #eee; color: #eee;
} }
header nav ul { nav ul {
margin: 0; margin: 0;
padding: 0; padding: 0;
display: -webkit-box; display: -webkit-box;
@ -2494,21 +2494,21 @@ header nav ul {
display: flex; display: flex;
} }
header nav ul li { nav ul li {
list-style-type: none; list-style-type: none;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
} }
header nav ul li:last-child { nav ul li:last-child {
margin-left: auto; margin-left: auto;
} }
header nav img { nav img {
height: 2em; height: 2em;
} }
header nav ul li a { nav ul li a {
padding: .5em; padding: .5em;
line-height: 2em; line-height: 2em;
display: block; display: block;
@ -2517,11 +2517,11 @@ header nav ul li a {
transition: .5s ease background-color; transition: .5s ease background-color;
} }
header nav ul li a:hover { nav ul li a:hover {
background-color: rgba(255, 255, 255, 0.57); background-color: rgba(255, 255, 255, 0.57);
} }
main { .main {
position: fixed; position: fixed;
top: 3em; top: 3em;
left: 0; left: 0;
@ -2530,6 +2530,16 @@ main {
overflow: auto; overflow: auto;
} }
header {
color: #fff;
background-color: #37474f;
padding: .67em 0;
}
header h1 {
margin: 0;
}
.content { .content {
margin: 1.5em auto; margin: 1.5em auto;
width: 80%; width: 80%;

214
assets/css/src/sass/main.scss
View File

@ -1,29 +1,29 @@
body { body {
font-family: 'Roboto', sans-serif; font-family: 'Roboto', sans-serif;
color: #212121; color : #212121;
height: 100%; height : 100%;
width: 100%; width : 100%;
} }
h2 { h2 {
margin: .83em 0; margin: .83em 0;
} }
header { nav {
position: fixed; position : fixed;
top: 0; top : 0;
left: 0; left : 0;
height: 3em; height : 3em;
width: 100%; width : 100%;
background-color: #263238; background-color: #263238;
padding: 0 1em; padding : 0 1em;
box-sizing: border-box; box-sizing : border-box;
z-index: 999; z-index : 999;
color: #eee; color : #eee;
} }
header nav ul { nav ul {
margin: 0; margin : 0;
padding: 0; padding: 0;
display: -webkit-box; display: -webkit-box;
/* OLD - iOS 6-, Safari 3.1-6 */ /* OLD - iOS 6-, Safari 3.1-6 */
@ -36,45 +36,55 @@ header nav ul {
display: flex; display: flex;
} }
header nav ul li { nav ul li {
list-style-type: none; list-style-type: none;
display: inline-block; display : inline-block;
vertical-align: middle; vertical-align : middle;
} }
header nav ul li:last-child { nav ul li:last-child {
margin-left: auto; margin-left: auto;
} }
header nav img { nav img {
height: 2em; height: 2em;
} }
header nav ul li a { nav ul li a {
padding: .5em; padding : .5em;
line-height: 2em; line-height : 2em;
display: block; display : block;
text-decoration: none; text-decoration: none;
color: inherit; color : inherit;
transition: .5s ease background-color; transition : .5s ease background-color;
} }
header nav ul li a:hover { nav ul li a:hover {
background-color: rgba(255, 255, 255, 0.57); background-color: rgba(255, 255, 255, 0.57);
} }
main { .main {
position: fixed; position: fixed;
top: 3em; top : 3em;
left: 0; left : 0;
width: 100%; width : 100%;
height: calc(100% - 3em); height : calc(100% - 3em);
overflow: auto; overflow: auto;
} }
header {
color : #fff;
background-color: #37474f;
padding : .67em 0;
}
header h1 {
margin: 0;
}
.content { .content {
margin: 1.5em auto; margin : 1.5em auto;
width: 80%; width : 80%;
max-width: 800px; max-width: 800px;
} }
@ -84,26 +94,26 @@ main {
/* EDITOR STYLE */ /* EDITOR STYLE */
.editor .sidebar { .editor .sidebar {
position: fixed; position : fixed;
left: 0; left : 0;
top: 3em; top : 3em;
overflow-y: auto; overflow-y : auto;
overflow-x: hidden; overflow-x : hidden;
height: calc(100% - 3em); height : calc(100% - 3em);
width: 25%; width : 25%;
background-color: #37474f; background-color: #37474f;
color: #ddd; color : #ddd;
box-sizing: border-box; box-sizing : border-box;
padding: 1.5em 1em; padding : 1.5em 1em;
} }
.editor .container { .editor .container {
position: fixed; position : fixed;
top: 3em; top : 3em;
right: 0; right : 0;
overflow: hidden; overflow : hidden;
height: calc(100% - 6em); height : calc(100% - 6em);
width: 75%; width : 75%;
box-sizing: border-box; box-sizing: border-box;
} }
@ -113,13 +123,13 @@ main {
.editor #preview-area, .editor #preview-area,
.editor textarea { .editor textarea {
position: relative; position : relative;
box-sizing: border-box; box-sizing: border-box;
height: 100%; height : 100%;
width: 100%; width : 100%;
border: 0; border : 0;
padding: 1.5em 10%; padding : 1.5em 10%;
font-size: 1.05em; font-size : 1.05em;
} }
.editor #preview-area *:first-child { .editor #preview-area *:first-child {
@ -127,7 +137,7 @@ main {
} }
.editor textarea { .editor textarea {
resize: none; resize : none;
font-family: monospace; font-family: monospace;
} }
@ -136,36 +146,36 @@ main {
} }
.editor input { .editor input {
width: 100%; width : 100%;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
color: rgba(255, 255, 255, 0.3); color : rgba(255, 255, 255, 0.3);
border: 0; border : 0;
border-radius: 5px; border-radius : 5px;
padding: .5em 1em; padding : .5em 1em;
box-sizing: border-box; box-sizing : border-box;
} }
.editor input:focus { .editor input:focus {
color: rgba(255, 255, 255, 0.7); color : rgba(255, 255, 255, 0.7);
border: 0; border: 0;
} }
.editor h3 { .editor h3 {
font-size: 1em; font-size : 1em;
font-weight: bold; font-weight: bold;
margin: 0; margin : 0;
} }
.action-bar { .action-bar {
position: fixed; position : fixed;
bottom: 0; bottom : 0;
right: 0; right : 0;
width: 75%; width : 75%;
background-color: #455a64; background-color: #455a64;
height: 3em; height : 3em;
display: flex; display : flex;
padding: .5em 1em; padding : .5em 1em;
box-sizing: border-box; box-sizing : border-box;
} }
.action-bar .left { .action-bar .left {
@ -178,31 +188,31 @@ main {
/* FORMS ELEMENTS */ /* FORMS ELEMENTS */
form input { form input {
color: rgba(0, 0, 0, 0.41); color : rgba(0, 0, 0, 0.41);
width: 15em; width : 15em;
line-height: 1.25em; line-height : 1.25em;
margin: .5em 0; margin : .5em 0;
border: 1px solid #fff; border : 1px solid #fff;
transition: .5s ease-out all; transition : .5s ease-out all;
background-color: transparent; background-color: transparent;
} }
form input:focus { form input:focus {
color: inherit; color : inherit;
outline: 0; outline : 0;
border-bottom: 1px solid #2196f3; border-bottom: 1px solid #2196f3;
} }
form label { form label {
width: 10.5em; width : 10.5em;
display: inline-block; display: inline-block;
margin: .1em 0 0; margin : .1em 0 0;
} }
form fieldset { form fieldset {
border: 0; border : 0;
margin: 1em 0 0; margin : 1em 0 0;
padding: 1em 0 0; padding : 1em 0 0;
border-top: 1px solid rgba(255, 255, 255, 0.25); border-top: 1px solid rgba(255, 255, 255, 0.25);
} }
@ -212,16 +222,16 @@ form legend {
button, button,
input[type="submit"] { input[type="submit"] {
border: 0; border : 0;
color: #fff; color : #fff;
margin: 0; margin : 0;
padding: .5em 1em; padding : .5em 1em;
border-radius: 10px; border-radius : 10px;
font-size: .9em; font-size : .9em;
width: auto; width : auto;
line-height: 1em; line-height : 1em;
background-color: #bbb; background-color: #bbb;
transition: .3s ease all; transition : .3s ease all;
} }
button, button,
@ -256,12 +266,12 @@ input[type="submit"].default:active {
button.add { button.add {
vertical-align: middle; vertical-align: middle;
border-radius: 50%; border-radius : 50%;
height: 1.5em; height : 1.5em;
width: 1.5em; width : 1.5em;
font-size: .7em; font-size : .7em;
padding: 0; padding : 0;
opacity: 0; opacity : 0;
} }
h3:hover > button.add { h3:hover > button.add {

39
browse/browse.go
View File

@ -1,14 +1,47 @@
package browse package browse
import ( import (
"log"
"net/http" "net/http"
"strings"
"github.com/hacdias/caddy-hugo/page" "github.com/hacdias/caddy-hugo/page"
"github.com/mholt/caddy/middleware"
"github.com/mholt/caddy/middleware/browse"
) )
// Execute sth // Execute sth
func Execute(w http.ResponseWriter, r *http.Request) (int, error) { func Execute(w http.ResponseWriter, r *http.Request) (int, error) {
page := new(page.Page) if r.URL.Path[len(r.URL.Path)-1] != '/' {
page.Title = "Browse" http.Redirect(w, r, r.URL.Path+"/", http.StatusTemporaryRedirect)
return page.Render(w, r, "browse") return 0, nil
}
r.URL.Path = strings.Replace(r.URL.Path, "/admin/browse", "", 1)
if r.URL.Path == "" {
r.URL.Path = "/"
}
tpl, err := page.GetTemplate(r, "browse")
if err != nil {
log.Print(err)
return 500, err
}
b := browse.Browse{
Next: middleware.HandlerFunc(func(w http.ResponseWriter, r *http.Request) (int, error) {
return 404, nil
}),
Root: "./",
Configs: []browse.Config{
browse.Config{
PathScope: "/",
Template: tpl,
},
},
}
return b.ServeHTTP(w, r)
} }

2
edit/edit.go
View File

@ -91,7 +91,7 @@ func Execute(w http.ResponseWriter, r *http.Request) (int, error) {
} }
page := new(page.Page) page := new(page.Page)
page.Title = "Edit" page.Name = "Edit"
page.Body = inf page.Body = inf
return page.Render(w, r, "edit", "frontmatter") return page.Render(w, r, "edit", "frontmatter")
} }

1
frontmatter/frontmatter.go
View File

@ -85,6 +85,7 @@ func sortByTitle(config []*frontmatter) {
} }
sort.Strings(keys) sort.Strings(keys)
// TODO: http://golang.org/pkg/sort/#Interface
cnf := make([]*frontmatter, len(config)) cnf := make([]*frontmatter, len(config))
for index, title := range keys { for index, title := range keys {

25
page/page.go
View File

@ -1,9 +1,9 @@
package page package page
import ( import (
"html/template"
"log" "log"
"net/http" "net/http"
"text/template"
"github.com/hacdias/caddy-hugo/assets" "github.com/hacdias/caddy-hugo/assets"
"github.com/hacdias/caddy-hugo/utils" "github.com/hacdias/caddy-hugo/utils"
@ -19,12 +19,24 @@ var funcMap = template.FuncMap{
// Page type // Page type
type Page struct { type Page struct {
Title string Name string
Body interface{} Body interface{}
} }
// Render the page // Render the page
func (p *Page) Render(w http.ResponseWriter, r *http.Request, templates ...string) (int, error) { func (p *Page) Render(w http.ResponseWriter, r *http.Request, templates ...string) (int, error) {
tpl, err := GetTemplate(r, templates...)
if err != nil {
log.Print(err)
return 500, err
}
tpl.Execute(w, p)
return 200, nil
}
func GetTemplate(r *http.Request, templates ...string) (*template.Template, error) {
if r.Header.Get("X-PJAX") == "true" { if r.Header.Get("X-PJAX") == "true" {
templates = append(templates, "base_minimal") templates = append(templates, "base_minimal")
} else { } else {
@ -38,7 +50,7 @@ func (p *Page) Render(w http.ResponseWriter, r *http.Request, templates ...strin
if err != nil { if err != nil {
log.Print(err) log.Print(err)
return 500, err return new(template.Template), err
} }
if i == 0 { if i == 0 {
@ -49,10 +61,9 @@ func (p *Page) Render(w http.ResponseWriter, r *http.Request, templates ...strin
if err != nil { if err != nil {
log.Print(err) log.Print(err)
return 500, err return new(template.Template), err
} }
} }
tpl.Execute(w, p) return tpl, nil
return 200, nil
} }

2
settings/settings.go
View File

@ -61,7 +61,7 @@ func Execute(w http.ResponseWriter, r *http.Request) (int, error) {
} }
page := new(page.Page) page := new(page.Page)
page.Title = "Settings" page.Name = "Settings"
page.Body = f page.Body = f
return page.Render(w, r, "settings", "frontmatter") return page.Render(w, r, "settings", "frontmatter")
} }

24
templates/base_full.tmpl
View File

@ -6,7 +6,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#fff"> <meta name="theme-color" content="#fff">
<title>{{ .Title }}</title> <title>{{ .Name }}</title>
<link href='https://fonts.googleapis.com/css?family=Roboto:400,700,400italic,700italic' rel='stylesheet' type='text/css'> <link href='https://fonts.googleapis.com/css?family=Roboto:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="/admin/assets/css/main.min.css"> <link rel="stylesheet" href="/admin/assets/css/main.min.css">
@ -14,18 +14,16 @@
</head> </head>
<body> <body>
<header> <nav>
<nav> <ul>
<ul> <li><a href="/"><i class="fa fa-home fa-lg"></i> Home</a></li>
<li><a href="/"><i class="fa fa-home fa-lg"></i> Home</a></li> <li><a href="/admin/browse/content"><i class="fa fa-newspaper-o"></i> Content</a></li>
<li><a href="/admin/browse/content"><i class="fa fa-newspaper-o"></i> Content</a></li> <li><a href="/admin/browse"><i class="fa fa-folder-o"></i> Browse</a></li>
<li><a href="/admin/browse"><i class="fa fa-folder-o"></i> Browse</a></li> <li><a href="/admin/settings"><i class="fa fa-cog"></i> Settings</a></li>
<li><a href="/admin/settings"><i class="fa fa-cog"></i> Settings</a></li> <li><a id="logout" href="#logout"><i class="fa fa-sign-out"></i> Logout</a></li>
<li><a id="logout" href="#logout"><i class="fa fa-sign-out"></i> Logout</a></li> </ul>
</ul> </nav>
</nav> <div class="main" id="container">
</header>
<div id="container">
{{ template "content" . }} {{ template "content" . }}
</div> </div>
<footer> <footer>

58
templates/browse.tmpl
View File

@ -1,5 +1,61 @@
{{ define "content" }} {{ define "content" }}
<header>
<div class="content">
<h1>{{.Path}}</h1>
{{ $path := .Path }}
</div>
</header>
<main> <main>
<a href="/admin/settings">Settings</a> <div class="content">
{{if .CanGoUp}}
<a href=".." class="up" title="Up one level">&#11025;</a>
{{else}}
<div class="up">&nbsp;</div>
{{end}}
<table>
<tr>
<th>
{{if and (eq .Sort "name") (ne .Order "desc")}}
<a href="?sort=name&order=desc">Name &#9650;</a>
{{else if and (eq .Sort "name") (ne .Order "asc")}}
<a href="?sort=name&order=asc">Name &#9660;</a>
{{else}}
<a href="?sort=name&order=asc">Name</a>
{{end}}
</th>
<th>
{{if and (eq .Sort "size") (ne .Order "desc")}}
<a href="?sort=size&order=desc">Size &#9650;</a>
{{else if and (eq .Sort "size") (ne .Order "asc")}}
<a href="?sort=size&order=asc">Size &#9660;</a>
{{else}}
<a href="?sort=size&order=asc">Size</a>
{{end}}
</th>
<th class="hideable">
{{if and (eq .Sort "time") (ne .Order "desc")}}
<a href="?sort=time&order=desc">Modified &#9650;</a>
{{else if and (eq .Sort "time") (ne .Order "asc")}}
<a href="?sort=time&order=asc">Modified &#9660;</a>
{{else}}
<a href="?sort=time&order=asc">Modified</a>
{{end}}
</th>
</tr>
{{range .Items}}
<tr>
<td>
{{if .IsDir}}&#128194;<a href="{{.URL}}">{{.Name}}</a>{{else}}
&#128196;<a href="/admin/edit{{ $path }}{{.URL}}">{{.Name}}</a>{{end}}
</td>
<td>{{.HumanSize}}</td>
<td class="hideable">{{.HumanModTime "01/02/2006 3:04:05 PM -0700"}}</td>
</tr>
{{end}}
</table>
</div>
</main> </main>
{{ end }} {{ end }}