add browse functionality
parent
686a909e23
commit
edf0a453a3
File diff suppressed because one or more lines are too long
|
@ -2467,7 +2467,7 @@ h2 {
|
|||
margin: .83em 0;
|
||||
}
|
||||
|
||||
header {
|
||||
nav {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
@ -2480,7 +2480,7 @@ header {
|
|||
color: #eee;
|
||||
}
|
||||
|
||||
header nav ul {
|
||||
nav ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: -webkit-box;
|
||||
|
@ -2494,21 +2494,21 @@ header nav ul {
|
|||
display: flex;
|
||||
}
|
||||
|
||||
header nav ul li {
|
||||
nav ul li {
|
||||
list-style-type: none;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
header nav ul li:last-child {
|
||||
nav ul li:last-child {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
header nav img {
|
||||
nav img {
|
||||
height: 2em;
|
||||
}
|
||||
|
||||
header nav ul li a {
|
||||
nav ul li a {
|
||||
padding: .5em;
|
||||
line-height: 2em;
|
||||
display: block;
|
||||
|
@ -2517,11 +2517,11 @@ header nav ul li a {
|
|||
transition: .5s ease background-color;
|
||||
}
|
||||
|
||||
header nav ul li a:hover {
|
||||
nav ul li a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.57);
|
||||
}
|
||||
|
||||
main {
|
||||
.main {
|
||||
position: fixed;
|
||||
top: 3em;
|
||||
left: 0;
|
||||
|
@ -2530,6 +2530,16 @@ main {
|
|||
overflow: auto;
|
||||
}
|
||||
|
||||
header {
|
||||
color: #fff;
|
||||
background-color: #37474f;
|
||||
padding: .67em 0;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: 1.5em auto;
|
||||
width: 80%;
|
||||
|
|
|
@ -1,29 +1,29 @@
|
|||
body {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
color: #212121;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
color : #212121;
|
||||
height : 100%;
|
||||
width : 100%;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: .83em 0;
|
||||
}
|
||||
|
||||
header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 3em;
|
||||
width: 100%;
|
||||
nav {
|
||||
position : fixed;
|
||||
top : 0;
|
||||
left : 0;
|
||||
height : 3em;
|
||||
width : 100%;
|
||||
background-color: #263238;
|
||||
padding: 0 1em;
|
||||
box-sizing: border-box;
|
||||
z-index: 999;
|
||||
color: #eee;
|
||||
padding : 0 1em;
|
||||
box-sizing : border-box;
|
||||
z-index : 999;
|
||||
color : #eee;
|
||||
}
|
||||
|
||||
header nav ul {
|
||||
margin: 0;
|
||||
nav ul {
|
||||
margin : 0;
|
||||
padding: 0;
|
||||
display: -webkit-box;
|
||||
/* OLD - iOS 6-, Safari 3.1-6 */
|
||||
|
@ -36,45 +36,55 @@ header nav ul {
|
|||
display: flex;
|
||||
}
|
||||
|
||||
header nav ul li {
|
||||
nav ul li {
|
||||
list-style-type: none;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
display : inline-block;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
header nav ul li:last-child {
|
||||
nav ul li:last-child {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
header nav img {
|
||||
nav img {
|
||||
height: 2em;
|
||||
}
|
||||
|
||||
header nav ul li a {
|
||||
padding: .5em;
|
||||
line-height: 2em;
|
||||
display: block;
|
||||
nav ul li a {
|
||||
padding : .5em;
|
||||
line-height : 2em;
|
||||
display : block;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
transition: .5s ease background-color;
|
||||
color : inherit;
|
||||
transition : .5s ease background-color;
|
||||
}
|
||||
|
||||
header nav ul li a:hover {
|
||||
nav ul li a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.57);
|
||||
}
|
||||
|
||||
main {
|
||||
.main {
|
||||
position: fixed;
|
||||
top: 3em;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: calc(100% - 3em);
|
||||
top : 3em;
|
||||
left : 0;
|
||||
width : 100%;
|
||||
height : calc(100% - 3em);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
header {
|
||||
color : #fff;
|
||||
background-color: #37474f;
|
||||
padding : .67em 0;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: 1.5em auto;
|
||||
width: 80%;
|
||||
margin : 1.5em auto;
|
||||
width : 80%;
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
|
@ -84,26 +94,26 @@ main {
|
|||
|
||||
/* EDITOR STYLE */
|
||||
.editor .sidebar {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 3em;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
height: calc(100% - 3em);
|
||||
width: 25%;
|
||||
position : fixed;
|
||||
left : 0;
|
||||
top : 3em;
|
||||
overflow-y : auto;
|
||||
overflow-x : hidden;
|
||||
height : calc(100% - 3em);
|
||||
width : 25%;
|
||||
background-color: #37474f;
|
||||
color: #ddd;
|
||||
box-sizing: border-box;
|
||||
padding: 1.5em 1em;
|
||||
color : #ddd;
|
||||
box-sizing : border-box;
|
||||
padding : 1.5em 1em;
|
||||
}
|
||||
|
||||
.editor .container {
|
||||
position: fixed;
|
||||
top: 3em;
|
||||
right: 0;
|
||||
overflow: hidden;
|
||||
height: calc(100% - 6em);
|
||||
width: 75%;
|
||||
position : fixed;
|
||||
top : 3em;
|
||||
right : 0;
|
||||
overflow : hidden;
|
||||
height : calc(100% - 6em);
|
||||
width : 75%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
@ -113,13 +123,13 @@ main {
|
|||
|
||||
.editor #preview-area,
|
||||
.editor textarea {
|
||||
position: relative;
|
||||
position : relative;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
border: 0;
|
||||
padding: 1.5em 10%;
|
||||
font-size: 1.05em;
|
||||
height : 100%;
|
||||
width : 100%;
|
||||
border : 0;
|
||||
padding : 1.5em 10%;
|
||||
font-size : 1.05em;
|
||||
}
|
||||
|
||||
.editor #preview-area *:first-child {
|
||||
|
@ -127,7 +137,7 @@ main {
|
|||
}
|
||||
|
||||
.editor textarea {
|
||||
resize: none;
|
||||
resize : none;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
|
@ -136,36 +146,36 @@ main {
|
|||
}
|
||||
|
||||
.editor input {
|
||||
width: 100%;
|
||||
width : 100%;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
border: 0;
|
||||
border-radius: 5px;
|
||||
padding: .5em 1em;
|
||||
box-sizing: border-box;
|
||||
color : rgba(255, 255, 255, 0.3);
|
||||
border : 0;
|
||||
border-radius : 5px;
|
||||
padding : .5em 1em;
|
||||
box-sizing : border-box;
|
||||
}
|
||||
|
||||
.editor input:focus {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
color : rgba(255, 255, 255, 0.7);
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.editor h3 {
|
||||
font-size: 1em;
|
||||
font-size : 1em;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
margin : 0;
|
||||
}
|
||||
|
||||
.action-bar {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 75%;
|
||||
position : fixed;
|
||||
bottom : 0;
|
||||
right : 0;
|
||||
width : 75%;
|
||||
background-color: #455a64;
|
||||
height: 3em;
|
||||
display: flex;
|
||||
padding: .5em 1em;
|
||||
box-sizing: border-box;
|
||||
height : 3em;
|
||||
display : flex;
|
||||
padding : .5em 1em;
|
||||
box-sizing : border-box;
|
||||
}
|
||||
|
||||
.action-bar .left {
|
||||
|
@ -178,31 +188,31 @@ main {
|
|||
|
||||
/* FORMS ELEMENTS */
|
||||
form input {
|
||||
color: rgba(0, 0, 0, 0.41);
|
||||
width: 15em;
|
||||
line-height: 1.25em;
|
||||
margin: .5em 0;
|
||||
border: 1px solid #fff;
|
||||
transition: .5s ease-out all;
|
||||
color : rgba(0, 0, 0, 0.41);
|
||||
width : 15em;
|
||||
line-height : 1.25em;
|
||||
margin : .5em 0;
|
||||
border : 1px solid #fff;
|
||||
transition : .5s ease-out all;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
form input:focus {
|
||||
color: inherit;
|
||||
outline: 0;
|
||||
color : inherit;
|
||||
outline : 0;
|
||||
border-bottom: 1px solid #2196f3;
|
||||
}
|
||||
|
||||
form label {
|
||||
width: 10.5em;
|
||||
width : 10.5em;
|
||||
display: inline-block;
|
||||
margin: .1em 0 0;
|
||||
margin : .1em 0 0;
|
||||
}
|
||||
|
||||
form fieldset {
|
||||
border: 0;
|
||||
margin: 1em 0 0;
|
||||
padding: 1em 0 0;
|
||||
border : 0;
|
||||
margin : 1em 0 0;
|
||||
padding : 1em 0 0;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
|
@ -212,16 +222,16 @@ form legend {
|
|||
|
||||
button,
|
||||
input[type="submit"] {
|
||||
border: 0;
|
||||
color: #fff;
|
||||
margin: 0;
|
||||
padding: .5em 1em;
|
||||
border-radius: 10px;
|
||||
font-size: .9em;
|
||||
width: auto;
|
||||
line-height: 1em;
|
||||
border : 0;
|
||||
color : #fff;
|
||||
margin : 0;
|
||||
padding : .5em 1em;
|
||||
border-radius : 10px;
|
||||
font-size : .9em;
|
||||
width : auto;
|
||||
line-height : 1em;
|
||||
background-color: #bbb;
|
||||
transition: .3s ease all;
|
||||
transition : .3s ease all;
|
||||
}
|
||||
|
||||
button,
|
||||
|
@ -256,12 +266,12 @@ input[type="submit"].default:active {
|
|||
|
||||
button.add {
|
||||
vertical-align: middle;
|
||||
border-radius: 50%;
|
||||
height: 1.5em;
|
||||
width: 1.5em;
|
||||
font-size: .7em;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
border-radius : 50%;
|
||||
height : 1.5em;
|
||||
width : 1.5em;
|
||||
font-size : .7em;
|
||||
padding : 0;
|
||||
opacity : 0;
|
||||
}
|
||||
|
||||
h3:hover > button.add {
|
||||
|
|
|
@ -1,14 +1,47 @@
|
|||
package browse
|
||||
|
||||
import (
|
||||
"log"
|
||||
"net/http"
|
||||
"strings"
|
||||
|
||||
"github.com/hacdias/caddy-hugo/page"
|
||||
"github.com/mholt/caddy/middleware"
|
||||
"github.com/mholt/caddy/middleware/browse"
|
||||
)
|
||||
|
||||
// Execute sth
|
||||
func Execute(w http.ResponseWriter, r *http.Request) (int, error) {
|
||||
page := new(page.Page)
|
||||
page.Title = "Browse"
|
||||
return page.Render(w, r, "browse")
|
||||
if r.URL.Path[len(r.URL.Path)-1] != '/' {
|
||||
http.Redirect(w, r, r.URL.Path+"/", http.StatusTemporaryRedirect)
|
||||
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)
|
||||
}
|
||||
|
|
|
@ -91,7 +91,7 @@ func Execute(w http.ResponseWriter, r *http.Request) (int, error) {
|
|||
}
|
||||
|
||||
page := new(page.Page)
|
||||
page.Title = "Edit"
|
||||
page.Name = "Edit"
|
||||
page.Body = inf
|
||||
return page.Render(w, r, "edit", "frontmatter")
|
||||
}
|
||||
|
|
|
@ -85,6 +85,7 @@ func sortByTitle(config []*frontmatter) {
|
|||
}
|
||||
|
||||
sort.Strings(keys)
|
||||
// TODO: http://golang.org/pkg/sort/#Interface
|
||||
cnf := make([]*frontmatter, len(config))
|
||||
|
||||
for index, title := range keys {
|
||||
|
|
25
page/page.go
25
page/page.go
|
@ -1,9 +1,9 @@
|
|||
package page
|
||||
|
||||
import (
|
||||
"html/template"
|
||||
"log"
|
||||
"net/http"
|
||||
"text/template"
|
||||
|
||||
"github.com/hacdias/caddy-hugo/assets"
|
||||
"github.com/hacdias/caddy-hugo/utils"
|
||||
|
@ -19,12 +19,24 @@ var funcMap = template.FuncMap{
|
|||
|
||||
// Page type
|
||||
type Page struct {
|
||||
Title string
|
||||
Body interface{}
|
||||
Name string
|
||||
Body interface{}
|
||||
}
|
||||
|
||||
// Render the page
|
||||
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" {
|
||||
templates = append(templates, "base_minimal")
|
||||
} else {
|
||||
|
@ -38,7 +50,7 @@ func (p *Page) Render(w http.ResponseWriter, r *http.Request, templates ...strin
|
|||
|
||||
if err != nil {
|
||||
log.Print(err)
|
||||
return 500, err
|
||||
return new(template.Template), err
|
||||
}
|
||||
|
||||
if i == 0 {
|
||||
|
@ -49,10 +61,9 @@ func (p *Page) Render(w http.ResponseWriter, r *http.Request, templates ...strin
|
|||
|
||||
if err != nil {
|
||||
log.Print(err)
|
||||
return 500, err
|
||||
return new(template.Template), err
|
||||
}
|
||||
}
|
||||
|
||||
tpl.Execute(w, p)
|
||||
return 200, nil
|
||||
return tpl, nil
|
||||
}
|
||||
|
|
|
@ -61,7 +61,7 @@ func Execute(w http.ResponseWriter, r *http.Request) (int, error) {
|
|||
}
|
||||
|
||||
page := new(page.Page)
|
||||
page.Title = "Settings"
|
||||
page.Name = "Settings"
|
||||
page.Body = f
|
||||
return page.Render(w, r, "settings", "frontmatter")
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<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 rel="stylesheet" href="/admin/assets/css/main.min.css">
|
||||
|
@ -14,18 +14,16 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<ul>
|
||||
<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"><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 id="logout" href="#logout"><i class="fa fa-sign-out"></i> Logout</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<div id="container">
|
||||
<nav>
|
||||
<ul>
|
||||
<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"><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 id="logout" href="#logout"><i class="fa fa-sign-out"></i> Logout</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="main" id="container">
|
||||
{{ template "content" . }}
|
||||
</div>
|
||||
<footer>
|
||||
|
|
|
@ -1,5 +1,61 @@
|
|||
{{ define "content" }}
|
||||
<header>
|
||||
<div class="content">
|
||||
<h1>{{.Path}}</h1>
|
||||
{{ $path := .Path }}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<a href="/admin/settings">Settings</a>
|
||||
<div class="content">
|
||||
{{if .CanGoUp}}
|
||||
<a href=".." class="up" title="Up one level">⬑</a>
|
||||
{{else}}
|
||||
<div class="up"> </div>
|
||||
{{end}}
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<th>
|
||||
{{if and (eq .Sort "name") (ne .Order "desc")}}
|
||||
<a href="?sort=name&order=desc">Name ▲</a>
|
||||
{{else if and (eq .Sort "name") (ne .Order "asc")}}
|
||||
<a href="?sort=name&order=asc">Name ▼</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 ▲</a>
|
||||
{{else if and (eq .Sort "size") (ne .Order "asc")}}
|
||||
<a href="?sort=size&order=asc">Size ▼</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 ▲</a>
|
||||
{{else if and (eq .Sort "time") (ne .Order "asc")}}
|
||||
<a href="?sort=time&order=asc">Modified ▼</a>
|
||||
{{else}}
|
||||
<a href="?sort=time&order=asc">Modified</a>
|
||||
{{end}}
|
||||
</th>
|
||||
</tr>
|
||||
{{range .Items}}
|
||||
<tr>
|
||||
<td>
|
||||
{{if .IsDir}}📂<a href="{{.URL}}">{{.Name}}</a>{{else}}
|
||||
📄<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>
|
||||
{{ end }}
|
||||
|
|
Loading…
Reference in New Issue