added media view to edit page

pull/8/head
Stephen Searles 7 years ago
parent e959b41f2c
commit 733594be70
  1. 20
      media.go
  2. 35
      templates.go

@ -222,15 +222,27 @@ func (ch *CaddyHugo) serveMediaPage(w http.ResponseWriter, r *http.Request) (int
io.WriteString(w, `<html> io.WriteString(w, `<html>
<head><style> <head><style>
.img { float: left; text-align: center; max-width: 19.9vw; min-height: 120px;} iframe { height: 100%; }
.img { display: inline-block; text-align: center; max-width: 19.9vw; min-height: 120px;}
.copy { cursor: pointer; } .copy { cursor: pointer; }
@media (max-width: 800px) {
.img {
width: 50%;
max-width: 50%;
}
body {
min-height: 300px;
}
}
</style></head> </style></head>
<body> <body>
<div style="position: fixed; top: 0; height: 10vh; width: 100%;"> <div style="position: fixed; top: 0; height: 10vh; width: 100%; background-color: white;">
<div style="float: left; width: 100%; height: 10vh;">
`) `)
io.WriteString(w, UploadPage("media")) io.WriteString(w, UploadPage("media"))
io.WriteString(w, "</div>")
io.WriteString(w, `</div>
<div style="display: inline-block; width: 100%; height: 10vh;"></div>
`)
if ch.Media != nil { if ch.Media != nil {
media, err := ch.Media.Walk() media, err := ch.Media.Walk()
if err != nil { if err != nil {

@ -137,6 +137,11 @@ var EditPage = `<html>
width: 100%; width: 100%;
border: none; border: none;
} }
a {
text-decoration: underline;
text-decoration-style: dotted;
cursor: pointer;
}
</style> </style>
<link rel="stylesheet" href="/hugo/simplemde.css" /> <link rel="stylesheet" href="/hugo/simplemde.css" />
<script src="https://unpkg.com/vue"></script> <script src="https://unpkg.com/vue"></script>
@ -145,10 +150,16 @@ var EditPage = `<html>
<body> <body>
<div id="container" > <div id="container" >
<div id="lastSaved"> <div id="header">
<span v-if="ltime >serverLtime && (sendQueue.length > 0 || sentRecently.length > 0)">last saved ${ lastSaved.from(now) }, saving</span> <div id="lastSaved">
<span v-else>saved</span> <span v-if="ltime >serverLtime && (sendQueue.length > 0 || sentRecently.length > 0)">last saved ${ lastSaved.from(now) }, saving</span>
<span v-if="connectionError">, ${connectionError}</span> <span v-else>saved</span>
<span v-if="connectionError">, ${connectionError}</span>
</div>
<div>
<a id="sideview-toggle-media">media</a>
<a id="sideview-toggle-draft">draft</a>
</div>
</div> </div>
<div id="editor-wrapper"> <div id="editor-wrapper">
<textarea id="editor">{{ .LoadContent }}</textarea> <textarea id="editor">{{ .LoadContent }}</textarea>
@ -156,6 +167,21 @@ var EditPage = `<html>
<div id="draft"><iframe src="{{ .IframeSource }}">Loading draft...</iframe></div> <div id="draft"><iframe src="{{ .IframeSource }}">Loading draft...</iframe></div>
</div> </div>
<script> <script>
var iframe = document.querySelector("#draft > iframe");
document.onclick = function (event) {
var iframe = document.querySelector("#draft > iframe");
switch (event.target.id) {
case "sideview-toggle-media":
iframe.src = "/hugo/media";
break;
case "sideview-toggle-draft":
iframe.src = "{{ .IframeSource }}";
break;
}
}
var uiBindings = { var uiBindings = {
ltime: 0, ltime: 0,
serverLtime: 0, serverLtime: 0,
@ -200,7 +226,6 @@ var EditPage = `<html>
// Create WebSocket connection. // Create WebSocket connection.
var socket = connect(); var socket = connect();
var iframe = document.querySelector("#draft > iframe");
const sawChangesBumpsTo = 10; const sawChangesBumpsTo = 10;

Loading…
Cancel
Save