diff options
| -rw-r--r-- | controllers/editor.php | 3 | ||||
| -rw-r--r-- | lib/helpers.php | 2 | ||||
| -rw-r--r-- | public/editor/editor.js | 59 | ||||
| -rw-r--r-- | public/editor/style.css | 47 | ||||
| -rw-r--r-- | views/editor.php | 32 | ||||
| -rw-r--r-- | views/partials/appcache.php | 2 |
6 files changed, 120 insertions, 25 deletions
diff --git a/controllers/editor.php b/controllers/editor.php index caac4a3..15d65ef 100644 --- a/controllers/editor.php +++ b/controllers/editor.php @@ -21,7 +21,8 @@ $app->post('/editor/publish', function() use($app) { $app->response()['Content-type'] = 'application/json'; $app->response()->body(json_encode([ - 'location' => $r['location'] + 'location' => $r['location'], + 'response' => trim(htmlspecialchars($r['response'])) ])); } }); diff --git a/lib/helpers.php b/lib/helpers.php index 073d1e2..4f6b4c1 100644 --- a/lib/helpers.php +++ b/lib/helpers.php @@ -100,7 +100,7 @@ function micropub_post($endpoint, $params, $access_token) { $post = http_build_query(array_merge(array( 'h' => 'entry' ), $params)); - $post = preg_replace('/%5B[0-9]+%5D/', '%5B%5D', $post); + $post = preg_replace('/%5B[0-9]+%5D/', '%5B%5D', $post); // change [0] to [] curl_setopt($ch, CURLOPT_POSTFIELDS, $post); curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); curl_setopt($ch, CURLOPT_HEADER, true); diff --git a/public/editor/editor.js b/public/editor/editor.js index a0873d6..08c09b0 100644 --- a/public/editor/editor.js +++ b/public/editor/editor.js @@ -31,7 +31,13 @@ $(function () { }); $.post('/editor/test-login', {}, function(response) { - $('#publish_btn span').text(response.logged_in ? 'Publish' : 'Sign In'); + if(response.logged_in) { + $('.publish-dropdown .action-publish').removeClass('hidden'); + $('.publish-dropdown .action-signin').addClass('hidden'); + } else { + $('.publish-dropdown .action-publish').addClass('hidden'); + $('.publish-dropdown .action-signin').removeClass('hidden'); + } }); $('#publish_btn').click(function(){ @@ -42,28 +48,43 @@ $(function () { } }); - $('#--publish_btn').click(function(){ - if($('#publish_btn span').text() == 'Publish') { - - $.post('/editor/publish', { - name: $("#post-name").val(), - body: editor.serialize().content.value - }, function(response) { - if(response.location) { - reset_page().then(function(){ - window.location = response.location; - }); - } - }); + $('#new_btn').click(function(){ + if(confirm('This will discard your current post. Are you sure?')) { + reset_page(); + } + }); - } else { - var url = prompt("Enter your URL"); - window.location = '/auth/start?me=' + encodeURIComponent(url) + '&redirect=/editor'; + $('#signin-domain').on('keydown', function(e){ + if(e.keyCode == 13) { + $('#signin-btn').click(); } }); + $('#signin-btn').click(function(){ + window.location = '/auth/start?me=' + encodeURIComponent($('#signin-domain').val()) + '&redirect=/editor'; + }); + $('#publish-confirm').click(function(){ + $('#publish-help').addClass('hidden'); + $('#publish-in-progress').removeClass('hidden'); - $('#new_btn').click(function(){ - reset_page(); + $.post('/editor/publish', { + name: $("#post-name").val(), + body: editor.serialize().content.value + }, function(response) { + if(response.location) { + reset_page().then(function(){ + $('#publish-success-url').attr('href', response.location); + $('#publish-in-progress').addClass('hidden'); + $('#publish-error-debug').html('').addClass('hidden'); + $('#publish-error').addClass('hidden'); + $('#publish-success').removeClass('hidden'); + }); + } else { + $('#publish-in-progress').addClass('hidden'); + $('#publish-error-debug').html(response.response).removeClass('hidden'); + $('#publish-error').removeClass('hidden'); + $('#publish-success').addClass('hidden'); + } + }); }); }); diff --git a/public/editor/style.css b/public/editor/style.css index 2f76cdb..8cb602f 100644 --- a/public/editor/style.css +++ b/public/editor/style.css @@ -57,7 +57,7 @@ img { border: 0; } clear: both; } -.toolbar .btn { +.btn { height: 38px; -webkit-border-radius: 999px; -moz-border-radius: 999px; @@ -73,10 +73,35 @@ img { border: 0; } vertical-align: middle; cursor: pointer; } -.toolbar .btn:hover { +.btn:hover { border-color: #61a7ae; color: #51a1a8; } +.btn.btn-medium { + height: 30px; + padding: 0 16px; + font-size: 13px; +} +.btn.btn-small { + height: 26px; + padding: 0 16px; + font-size: 13px; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; +} + +input.form-field-small { + height: 24px; + margin-top: 1px; + font-size: 13px; + color: #51a1a8; + padding: 0 10px; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; + border: 1px #93dee5 solid; +} .publish-dropdown { position: absolute; @@ -86,6 +111,9 @@ img { border: 0; } background: white; width: 280px; min-height: 60px; + font-family: sans-serif; + font-size: 14px; + line-height: 18px; border: 1px solid #dbdbdb; -webkit-border-radius: 6px; -moz-border-radius: 6px; @@ -107,6 +135,21 @@ img { border: 0; } display: block; border: #dbdbdb 1px solid; } +.publish-dropdown .dropdown-content { + padding: 9px; +} +.publish-dropdown input { + font-family: sans-serif; +} +.publish-dropdown .helptext { + padding: 8px 4px 12px 4px; + color: #333; +} +pre#publish-error-debug { + overflow: scroll; + font-size: 11px; + line-height: 12px; +} .hidden { display: none; diff --git a/views/editor.php b/views/editor.php index eeb3c53..2383af5 100644 --- a/views/editor.php +++ b/views/editor.php @@ -47,7 +47,7 @@ <span class="item text"><span id="draft-status">Draft</span></span> </div> <div class="toolbar-right"> - <button class="btn" id="publish_btn"><span>Publish</span> <i class="fa fa-caret-down"></i></button> + <button class="btn" id="publish_btn">Publish <i class="fa fa-caret-down"></i></button> <button class="btn" id="new_btn">New</button> </div> <div class="clear"></div> @@ -55,6 +55,36 @@ <div class="publish-dropdown hidden"> <div class="arrow"></div> + <div class="dropdown-content action-publish"> + + <div style="float:right"><button class="btn btn-medium" id="publish-confirm">Publish Now</button></div> + <div style="clear:right;"></div> + + <div class="helptext" id="publish-help"> + <div>Clicking "Publish Now" will send a request to your Micropub endpoint.</div><br> + <div>The request will include two fields, "name" and "content", where the content will be the full HTML for this post.</div> + </div> + + <div class="helptext hidden" id="publish-in-progress"> + Posting... <!-- TODO replace this with a CSS animated spinner --> + </div> + + <div class="helptext hidden" id="publish-success"> + <div>It worked! The post is on your site!</div><br> + <div><a href="" id="publish-success-url">View your post</a></div> + </div> + + <div class="helptext hidden" id="publish-error"> + <div>Something went wrong! Below is the response from your Micropub endpoint.</div><br> + <pre id="publish-error-debug"></pre> + </div> + + </div> + <div class="dropdown-content action-signin hidden"> + <div class="helptext">You need to sign in before you can publish! Don't worry, your draft will still be here when you finish signing in.</div> + <input type="url" class="form-field-small" placeholder="yourdomain.com" id="signin-domain"> + <button class="btn btn-small" id="signin-btn">Sign In</button> + </div> </div> <div class="container"> diff --git a/views/partials/appcache.php b/views/partials/appcache.php index 0bc21a6..0a7addc 100644 --- a/views/partials/appcache.php +++ b/views/partials/appcache.php @@ -1,6 +1,6 @@ CACHE MANIFEST -# v3 +# v15 /editor /editor/style.css |