progresses on #5
parent
9b92b17e1d
commit
d294d1b116
|
@ -8,6 +8,7 @@
|
|||
// assets/public/js/form2js.js
|
||||
// assets/templates/actions.tmpl
|
||||
// assets/templates/base.tmpl
|
||||
// assets/templates/buttons.tmpl
|
||||
// assets/templates/editor.tmpl
|
||||
// assets/templates/frontmatter.tmpl
|
||||
// assets/templates/listing.tmpl
|
||||
|
@ -183,6 +184,24 @@ func templatesBaseTmpl() (*asset, error) {
|
|||
return a, err
|
||||
}
|
||||
|
||||
// templatesButtonsTmpl reads file data from disk. It returns an error on failure.
|
||||
func templatesButtonsTmpl() (*asset, error) {
|
||||
path := "D:\\Code\\Go\\src\\github.com\\hacdias\\caddy-filemanager\\assets\\templates\\buttons.tmpl"
|
||||
name := "templates/buttons.tmpl"
|
||||
bytes, err := bindataRead(path, name)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
fi, err := os.Stat(path)
|
||||
if err != nil {
|
||||
err = fmt.Errorf("Error reading asset info %s at %s: %v", name, path, err)
|
||||
}
|
||||
|
||||
a := &asset{bytes: bytes, info: fi}
|
||||
return a, err
|
||||
}
|
||||
|
||||
// templatesEditorTmpl reads file data from disk. It returns an error on failure.
|
||||
func templatesEditorTmpl() (*asset, error) {
|
||||
path := "D:\\Code\\Go\\src\\github.com\\hacdias\\caddy-filemanager\\assets\\templates\\editor.tmpl"
|
||||
|
@ -333,6 +352,7 @@ var _bindata = map[string]func() (*asset, error){
|
|||
"public/js/form2js.js": publicJsForm2jsJs,
|
||||
"templates/actions.tmpl": templatesActionsTmpl,
|
||||
"templates/base.tmpl": templatesBaseTmpl,
|
||||
"templates/buttons.tmpl": templatesButtonsTmpl,
|
||||
"templates/editor.tmpl": templatesEditorTmpl,
|
||||
"templates/frontmatter.tmpl": templatesFrontmatterTmpl,
|
||||
"templates/listing.tmpl": templatesListingTmpl,
|
||||
|
@ -395,6 +415,7 @@ var _bintree = &bintree{nil, map[string]*bintree{
|
|||
"templates": &bintree{nil, map[string]*bintree{
|
||||
"actions.tmpl": &bintree{templatesActionsTmpl, map[string]*bintree{}},
|
||||
"base.tmpl": &bintree{templatesBaseTmpl, map[string]*bintree{}},
|
||||
"buttons.tmpl": &bintree{templatesButtonsTmpl, map[string]*bintree{}},
|
||||
"editor.tmpl": &bintree{templatesEditorTmpl, map[string]*bintree{}},
|
||||
"frontmatter.tmpl": &bintree{templatesFrontmatterTmpl, map[string]*bintree{}},
|
||||
"listing.tmpl": &bintree{templatesListingTmpl, map[string]*bintree{}},
|
||||
|
|
|
@ -489,7 +489,7 @@ header p i {
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
header #search {
|
||||
#search {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
|
@ -501,29 +501,29 @@ header #search {
|
|||
transition: .1s ease all;
|
||||
}
|
||||
|
||||
header #search.active {
|
||||
#search.active {
|
||||
background-color: #fff;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .12);
|
||||
}
|
||||
|
||||
header #search.active i,
|
||||
header #search.active input {
|
||||
#search.active i,
|
||||
#search.active input {
|
||||
color: #212121;
|
||||
}
|
||||
|
||||
header #search i,
|
||||
header #search input {
|
||||
#search i,
|
||||
#search input {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
header #search i {
|
||||
#search i {
|
||||
margin-right: 0.3em;
|
||||
color: rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
||||
header #search input {
|
||||
#search input {
|
||||
min-width: 20em;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
|
@ -531,13 +531,13 @@ header #search input {
|
|||
background-color: transparent;
|
||||
}
|
||||
|
||||
header #search.active div {
|
||||
#search.active div {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
top: 100%;
|
||||
}
|
||||
|
||||
header #search div {
|
||||
#search div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
|
@ -555,30 +555,31 @@ header #search div {
|
|||
opacity: 0;
|
||||
}
|
||||
|
||||
header #search.active div i {
|
||||
#search.active div i,
|
||||
#sidebar #search.active div i {
|
||||
color: #ccc;
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
header #search::-webkit-input-placeholder {
|
||||
#search::-webkit-input-placeholder {
|
||||
/* WebKit, Blink, Edge */
|
||||
color: rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
||||
header #search:-moz-placeholder {
|
||||
#search:-moz-placeholder {
|
||||
opacity: 1;
|
||||
/* Mozilla Firefox 4 to 18 */
|
||||
color: rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
||||
header #search::-moz-placeholder {
|
||||
#search::-moz-placeholder {
|
||||
opacity: 1;
|
||||
/* Mozilla Firefox 19+ */
|
||||
color: rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
||||
header #search:-ms-input-placeholder {
|
||||
#search:-ms-input-placeholder {
|
||||
/* Internet Explorer 10-11 */
|
||||
color: rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
@ -611,6 +612,10 @@ header p {
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
header #open-nav {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#toolbar p a,
|
||||
#toolbar p a:hover,
|
||||
header p a,
|
||||
|
@ -664,6 +669,10 @@ header div:nth-child(2) {
|
|||
background-color: rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
header .action span {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.floating {
|
||||
position: fixed;
|
||||
bottom: 1em;
|
||||
|
@ -701,6 +710,9 @@ header div:nth-child(2) {
|
|||
}
|
||||
|
||||
|
||||
/* SIDEBAR */
|
||||
|
||||
|
||||
/* LISTING */
|
||||
|
||||
#listing {
|
||||
|
@ -970,8 +982,73 @@ i.spin {
|
|||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
header p a:first-of-type,
|
||||
header p i:first-of-type {
|
||||
header #prev {
|
||||
display: none;
|
||||
}
|
||||
header #open-nav {
|
||||
display: inline-block;
|
||||
}
|
||||
/* SIDEBAR */
|
||||
header> div:nth-child(2) {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: 999999;
|
||||
background-color: #fff;
|
||||
height: 100%;
|
||||
width: 95%;
|
||||
max-width: 20em;
|
||||
text-align: left;
|
||||
color: #212121;
|
||||
left: -100%;
|
||||
transition: .2s ease-in-out all;
|
||||
}
|
||||
header> div:nth-child(2).active {
|
||||
left: 0;
|
||||
}
|
||||
header #search {
|
||||
height: auto;
|
||||
background-color: transparent;
|
||||
color: #212121;
|
||||
padding: 0;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-radius: 0;
|
||||
display: block;
|
||||
}
|
||||
header #search input {
|
||||
color: #212121;
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
min-width: 0;
|
||||
}
|
||||
header #search i {
|
||||
color: #212121;
|
||||
display: inline-block;
|
||||
padding: .5em;
|
||||
margin: 0;
|
||||
}
|
||||
header> div:nth-child(2)> div {
|
||||
display: block;
|
||||
}
|
||||
header> div:nth-child(2) .action {
|
||||
border-radius: 0 !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
text-align: left;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
header> div:nth-child(2) .action:hover {
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
}
|
||||
header> div:nth-child(2) .action:hover i {
|
||||
background-color: transparent;
|
||||
}
|
||||
header> div:nth-child(2) .action i {
|
||||
border-radius: 0;
|
||||
}
|
||||
header> div:nth-child(2) .action span {}
|
||||
header> div:nth-child(2) .action i,
|
||||
header> div:nth-child(2) .action span {
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -357,11 +357,11 @@ var handleViewType = function(viewList) {
|
|||
|
||||
if (viewList == "true") {
|
||||
listing.classList.add('list');
|
||||
button.innerHTML = '<i class="material-icons">view_module</i>';
|
||||
button.innerHTML = '<i class="material-icons">view_module</i> <span>Switch view</span>';
|
||||
return false;
|
||||
}
|
||||
|
||||
button.innerHTML = '<i class="material-icons">view_list</i>';
|
||||
button.innerHTML = '<i class="material-icons">view_list</i> <span>Switch view</span>';
|
||||
listing.classList.remove('list');
|
||||
return false;
|
||||
}
|
||||
|
@ -766,6 +766,7 @@ document.addEventListener("editor", (event) => {
|
|||
* BOOTSTRAP *
|
||||
* *
|
||||
* * * * * * * * * * * * * * * */
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function(event) {
|
||||
// Add event to logout button
|
||||
document.getElementById("logout").addEventListener("click", event => {
|
||||
|
@ -783,6 +784,9 @@ document.addEventListener("DOMContentLoaded", function(event) {
|
|||
document.getElementById("open").addEventListener("click", openEvent);
|
||||
document.getElementById("delete").addEventListener("click", deleteEvent);
|
||||
document.getElementById("download").addEventListener("click", downloadEvent);
|
||||
document.getElementById("open-nav").addEventListener("click", event => {
|
||||
let sidebar = document.querySelector("header > div:nth-child(2)").classList.toggle("active");
|
||||
});
|
||||
|
||||
if (document.getElementById('listing')) {
|
||||
document.sendCostumEvent('listing');
|
||||
|
|
|
@ -27,6 +27,10 @@
|
|||
</a>
|
||||
{{ end }}
|
||||
|
||||
<div class="action" id="open-nav">
|
||||
<i class="material-icons">menu</i>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
<a href="{{ if eq .Config.BaseURL "" }}/{{ else }}{{ .Config.BaseURL }}{{ end }}">
|
||||
{{ if .Config.HugoEnabled }}Hugo{{ else }}File Manager{{ end }}
|
||||
|
@ -38,27 +42,7 @@
|
|||
</div>
|
||||
|
||||
<div>
|
||||
{{ if .IsDir}}
|
||||
|
||||
<div id="search">
|
||||
<i class="material-icons">storage</i>
|
||||
<input type="text" placeholder="Execute a command...">
|
||||
<div>Write your git, mercurial or svn command and press enter.</div>
|
||||
</div>
|
||||
|
||||
<div class="action" id="view">
|
||||
<i class="material-icons">view_headline</i>
|
||||
</div>
|
||||
<div class="action" id="upload">
|
||||
<i class="material-icons">file_upload</i>
|
||||
</div>
|
||||
{{ else }}
|
||||
{{ template "actions" . }}
|
||||
{{ end }}
|
||||
|
||||
<div class="action" id="logout">
|
||||
<i class="material-icons">exit_to_app</i>
|
||||
</div>
|
||||
{{ template "buttons" . }}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
{{ define "buttons" }}
|
||||
{{ if .IsDir}}
|
||||
|
||||
<div id="search">
|
||||
<i class="material-icons">storage</i>
|
||||
<input type="text" placeholder="Execute a command...">
|
||||
<div>Write your git, mercurial or svn command and press enter.</div>
|
||||
</div>
|
||||
|
||||
<div class="action" id="view">
|
||||
<i class="material-icons">view_headline</i> <span>Switch view</span>
|
||||
</div>
|
||||
<div class="action" id="upload">
|
||||
<i class="material-icons">file_upload</i> <span>Upload</span>
|
||||
</div>
|
||||
{{ else }}
|
||||
{{ template "actions" . }}
|
||||
{{ end }}
|
||||
|
||||
<div class="action" id="logout">
|
||||
<i class="material-icons">exit_to_app</i> <span>Logout</span>
|
||||
</div>
|
||||
{{ end }}
|
|
@ -82,7 +82,7 @@ func (p Page) PrintAsHTML(w http.ResponseWriter, templates ...string) (int, erro
|
|||
if p.Minimal {
|
||||
templates = append(templates, "actions", "minimal")
|
||||
} else {
|
||||
templates = append(templates, "actions", "base")
|
||||
templates = append(templates, "buttons", "actions", "base")
|
||||
}
|
||||
|
||||
var tpl *template.Template
|
||||
|
|
Loading…
Reference in New Issue