Browse Source

add loading indicator to post buttons

fixes #42
pull/64/head
Aaron Parecki 8 years ago
parent
commit
926546106e
No known key found for this signature in database GPG Key ID: 276C2817346D6056
  1. 4
      public/css/style.css
  2. 8
      views/new-bookmark.php
  3. 4
      views/new-favorite.php
  4. 5
      views/new-itinerary.php
  5. 5
      views/new-repost.php

4
public/css/style.css

@ -197,3 +197,7 @@ body {
.callout table { .callout table {
margin-bottom: 0; margin-bottom: 0;
} }
.notice-pad {
margin-top: 20px;
}

8
views/new-bookmark.php

@ -69,11 +69,17 @@ $(function(){
$("#btn_post").click(function(){ $("#btn_post").click(function(){
if($("#note_bookmark").val() == "") {
return false;
}
var syndications = []; var syndications = [];
$("#syndication-container button.btn-info").each(function(i,btn){ $("#syndication-container button.btn-info").each(function(i,btn){
syndications.push($(btn).data('syndicate-to')); syndications.push($(btn).data('syndicate-to'));
}); });
$("#btn_post").addClass("loading disabled").text("Working...");
$.post("/micropub/post", { $.post("/micropub/post", {
'bookmark-of': $("#note_bookmark").val(), 'bookmark-of': $("#note_bookmark").val(),
name: $("#note_name").val(), name: $("#note_name").val(),
@ -86,6 +92,7 @@ $(function(){
$("#test_success").removeClass('hidden'); $("#test_success").removeClass('hidden');
$("#test_error").addClass('hidden'); $("#test_error").addClass('hidden');
$("#post_href").attr("href", response.location); $("#post_href").attr("href", response.location);
$("#note_form").addClass('hidden');
// $("#note_bookmark").val(""); // $("#note_bookmark").val("");
// $("#note_content").val(""); // $("#note_content").val("");
@ -95,6 +102,7 @@ $(function(){
} else { } else {
$("#test_success").addClass('hidden'); $("#test_success").addClass('hidden');
$("#test_error").removeClass('hidden'); $("#test_error").removeClass('hidden');
$("#btn_post").removeClass("loading disabled").text("Post");
} }
}); });

4
views/new-favorite.php

@ -1,7 +1,7 @@
<div class="narrow"> <div class="narrow">
<?= partial('partials/header') ?> <?= partial('partials/header') ?>
<div style="clear: both;">
<div style="clear: both;" class="notice-pad">
<div class="alert alert-success hidden" id="test_success"><strong>Success! We found a Location header in the response!</strong><br>Your post should be on your website now!<br><a href="" id="post_href">View your post</a></div> <div class="alert alert-success hidden" id="test_success"><strong>Success! We found a Location header in the response!</strong><br>Your post should be on your website now!<br><a href="" id="post_href">View your post</a></div>
<div class="alert alert-danger hidden" id="test_error"><strong>Your endpoint did not return a Location header.</strong><br>See <a href="/creating-a-micropub-endpoint">Creating a Micropub Endpoint</a> for more information.</div> <div class="alert alert-danger hidden" id="test_error"><strong>Your endpoint did not return a Location header.</strong><br>See <a href="/creating-a-micropub-endpoint">Creating a Micropub Endpoint</a> for more information.</div>
</div> </div>
@ -38,6 +38,7 @@ $(function(){
} }
$("#btn_post").click(function(){ $("#btn_post").click(function(){
$("#btn_post").addClass("loading disabled").text("Working...");
var syndications = []; var syndications = [];
$("#syndication-container button.btn-info").each(function(i,btn){ $("#syndication-container button.btn-info").each(function(i,btn){
@ -61,6 +62,7 @@ $(function(){
} else { } else {
$("#test_success").addClass('hidden'); $("#test_success").addClass('hidden');
$("#test_error").removeClass('hidden'); $("#test_error").removeClass('hidden');
$("#btn_post").removeClass("loading disabled").text("Post");
} }
}); });

5
views/new-itinerary.php

@ -1,7 +1,7 @@
<div class="narrow"> <div class="narrow">
<?= partial('partials/header') ?> <?= partial('partials/header') ?>
<div style="clear: both;">
<div style="clear: both;" class="notice-pad">
<div class="alert alert-success hidden" id="test_success"><strong>Success! We found a Location header in the response!</strong><br>Your post should be on your website now!<br><a href="" id="post_href">View your post</a></div> <div class="alert alert-success hidden" id="test_success"><strong>Success! We found a Location header in the response!</strong><br>Your post should be on your website now!<br><a href="" id="post_href">View your post</a></div>
<div class="alert alert-danger hidden" id="test_error"><strong>Your endpoint did not return a Location header.</strong><br>See <a href="/creating-a-micropub-endpoint">Creating a Micropub Endpoint</a> for more information.</div> <div class="alert alert-danger hidden" id="test_error"><strong>Your endpoint did not return a Location header.</strong><br>See <a href="/creating-a-micropub-endpoint">Creating a Micropub Endpoint</a> for more information.</div>
</div> </div>
@ -177,6 +177,7 @@ $(function(){
var category = csv_to_array($("#note_category").val()); var category = csv_to_array($("#note_category").val());
$("#btn_post").addClass("loading disabled").text("Working...");
$.post("/micropub/postjson", { $.post("/micropub/postjson", {
data: JSON.stringify({ data: JSON.stringify({
"type": "h-entry", "type": "h-entry",
@ -191,9 +192,11 @@ $(function(){
$("#test_success").removeClass('hidden'); $("#test_success").removeClass('hidden');
$("#test_error").addClass('hidden'); $("#test_error").addClass('hidden');
$("#post_href").attr("href", response.location); $("#post_href").attr("href", response.location);
$("#note_form").addClass("hidden");
} else { } else {
$("#test_success").addClass('hidden'); $("#test_success").addClass('hidden');
$("#test_error").removeClass('hidden'); $("#test_error").removeClass('hidden');
$("#btn_post").removeClass("loading disabled").text("Post");
} }
}); });

5
views/new-repost.php

@ -1,7 +1,7 @@
<div class="narrow"> <div class="narrow">
<?= partial('partials/header') ?> <?= partial('partials/header') ?>
<div style="clear: both;">
<div style="clear: both;" class="notice-pad">
<div class="alert alert-success hidden" id="test_success"><strong>Success! We found a Location header in the response!</strong><br>Your post should be on your website now!<br><a href="" id="post_href">View your post</a></div> <div class="alert alert-success hidden" id="test_success"><strong>Success! We found a Location header in the response!</strong><br>Your post should be on your website now!<br><a href="" id="post_href">View your post</a></div>
<div class="alert alert-danger hidden" id="test_error"><strong>Your endpoint did not return a Location header.</strong><br>See <a href="/creating-a-micropub-endpoint">Creating a Micropub Endpoint</a> for more information.</div> <div class="alert alert-danger hidden" id="test_error"><strong>Your endpoint did not return a Location header.</strong><br>See <a href="/creating-a-micropub-endpoint">Creating a Micropub Endpoint</a> for more information.</div>
</div> </div>
@ -27,6 +27,7 @@
$(function(){ $(function(){
$("#btn_post").click(function(){ $("#btn_post").click(function(){
$("#btn_post").addClass("loading disabled").text("Working...");
$.post("/repost", { $.post("/repost", {
url: $("#note_url").val() url: $("#note_url").val()
@ -37,11 +38,13 @@ $(function(){
$("#test_success").removeClass('hidden'); $("#test_success").removeClass('hidden');
$("#test_error").addClass('hidden'); $("#test_error").addClass('hidden');
$("#post_href").attr("href", response.location); $("#post_href").attr("href", response.location);
$("#note_form").addClass('hidden');
window.location = response.location; window.location = response.location;
} else { } else {
$("#test_success").addClass('hidden'); $("#test_success").addClass('hidden');
$("#test_error").removeClass('hidden'); $("#test_error").removeClass('hidden');
$("#btn_post").removeClass("loading disabled").text("Post");
} }
}); });

Loading…
Cancel
Save