jon
/
Quill
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

add alt text input 

* now you can enter alt text for photos. see https://www.w3.org/TR/micropub/#uploading-a-photo-with-alt-text for details
* if the note has alt text, then the request is sent as JSON instead
pull/82/head
Aaron Parecki 7 years ago
parent
202a7876ec
commit
bb5fd837d1
No known key found for this signature in database GPG Key ID: 276C2817346D6056
1 changed files with 93 additions and 73 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 166
      views/new-post.php

166
views/new-post.php
View File

@ -125,7 +125,11 @@
Choose File <input type="file" name="note_photo" id="note_photo" accept="image/*">
</label>
<input type="url" id="note_photo_url" class="form-control" placeholder="Paste image URL">
<div style="margin-bottom: 1em;">
<input type="url" id="note_photo_url" class="form-control" placeholder="Paste image URL">
</div>
<input type="text" id="note_photo_alt" class="form-control" placeholder="Image alt text">
</div>
<div class="modal-footer">
@ -150,14 +154,14 @@
<img style="width:100%;">
</div>
<input type="text" id="note_photo_alt" class="form-control hidden" placeholder="Image alt text">
<input type="text" id="note_edit_photo_alt" class="form-control" placeholder="Image alt text">
<input type="hidden" id="modal_edit_photo_index">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<!-- <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> -->
<button type="button" class="btn btn-danger remove-btn" data-dismiss="modal">Remove</button>
<!-- <button type="button" class="btn btn-primary save-btn">Save</button> -->
<button type="button" class="btn btn-primary save-btn">Save</button>
</div>
</div>
</div>
@ -255,7 +259,7 @@ function saveNoteState() {
$("#syndication-container button.btn-info").each(function(i,btn){
state.syndications[$(btn).data('syndicate-to')] = 'selected';
});
console.log("saving",state);
// console.log("saving",state);
localforage.setItem('current-note', state);
}
@ -306,6 +310,7 @@ function addNewPhoto() {
// Reset modal
$("#note_photo").val("");
$("#note_photo_url").val("");
$("#note_photo_alt").val("");
$("#modal_photo_preview").addClass("hidden");
$("#note_photo_button").removeClass("hidden");
$("#note_photo_url").removeClass("hidden");
@ -360,11 +365,13 @@ $(function(){
if($("#note_photo_url").val()) {
photos.push({
url: $("#note_photo_url").val(),
alt: $("#note_photo_alt").val(),
external: true
});
} else {
photos.push({
url: URL.createObjectURL(document.getElementById("note_photo").files[0]),
alt: $("#note_photo_alt").val(),
file: document.getElementById("note_photo").files[0],
external: false
});
@ -375,6 +382,11 @@ $(function(){
});
$("#edit-photo-modal .save-btn").click(function(){
var index = $("#modal_edit_photo_index").val();
photos[index].alt = $("#note_edit_photo_alt").val();
refreshPhotoPreviews();
saveNoteState();
$("#edit-photo-modal").modal('hide');
});
$("#edit-photo-modal .remove-btn").click(function(){
@ -394,8 +406,13 @@ $(function(){
function refreshPhotoPreviews() {
$("#photo-previews").html("");
for(i=0; i<photos.length; i++) {
console.log(photos[i]);
$("#photo-previews").append('<span><img src="'+photos[i].url+'"></span>');
var img = document.createElement('img');
img.setAttribute('src', photos[i].url);
img.setAttribute('alt', photos[i].alt);
img.setAttribute('title', photos[i].alt);
var span = document.createElement('span');
span.appendChild(img);
$("#photo-previews").append(span);
}
if(photos.length == 0) {
$("#photo-previews").addClass("hidden");
@ -403,7 +420,6 @@ function refreshPhotoPreviews() {
$("#photo-previews").removeClass("hidden");
}
$("#photo-previews img").unbind("click").bind("click", function(){
console.log("Photo was tapped: "+$(this).attr("src"));
$("#modal_edit_photo_preview img").attr("src", $(this).attr("src"));
var index = false;
for(i=0; i<photos.length; i++) {
@ -411,6 +427,7 @@ function refreshPhotoPreviews() {
index = i;
}
}
$("#note_edit_photo_alt").val(photos[index].alt);
$("#modal_edit_photo_index").val(index);
$("#edit-photo-modal").modal();
});
@ -575,42 +592,66 @@ $(function(){
var category = csv_to_array($("#note_category").val());
var formData = new FormData();
var entry = {};
var doMultipart = false;
var hasAltText = false;
if(v=$("#note_content").val()) {
formData.append("content", v);
entry['content'] = v;
}
if(v=$("#note_in_reply_to").val()) {
formData.append("in-reply-to", v);
entry['in-reply-to'] = v;
}
if(v=$("#note_location").val()) {
formData.append("location", v);
entry['location'] = v;
}
if(category.length > 0) {
for(var i in category) {
formData.append("category[]", category[i]);
}
entry['category'] = category;
}
if(syndications.length > 0) {
for(var i in syndications) {
formData.append("<?= $this->user->micropub_syndicate_field ?>[]", syndications[i]);
}
entry["<?= $this->user->micropub_syndicate_field ?>"] = syndications;
}
if(v=$("#note_slug").val()) {
formData.append("<?= $this->user->micropub_slug_field ?>", v);
entry["<?= $this->user->micropub_slug_field ?>"] = v;
}
if(photos.length == 1) {
if(photos[0].external) {
formData.append("photo", photos[0].url);
function appendPhotoToFormData(photo, prop) {
if(photo.external) {
if(photo.alt) {
hasAltText = true;
formData.append(prop+"[value]", photo.url);
formData.append(prop+"[alt]", photo.alt);
entry['photo'].push({
value: photo.url,
alt: photo.alt
})
} else {
formData.append(prop, photo.url);
entry['photo'].push(photo.url);
}
} else {
formData.append("photo", photos[0].file);
formData.append(prop, photo.file);
doMultipart = true;
}
}
if(photos.length == 1) {
entry['photo'] = [];
appendPhotoToFormData(photos[0], "photo");
} else {
entry['photo'] = [];
for(i=0; i<photos.length; i++) {
if(photos[i].external) {
formData.append("photo[]", photos[i].url);
} else {
formData.append("photo[]", photos[i].file);
}
appendPhotoToFormData(photos[i], "photo[]");
}
}
@ -619,71 +660,50 @@ $(function(){
// This will be stripped by Quill before it's sent to the Micropub endpoint
formData.append("null","null");
var request = new XMLHttpRequest();
request.open("POST", "/micropub/multipart");
request.onreadystatechange = function() {
if(request.readyState == XMLHttpRequest.DONE) {
// console.log(request.responseText);
try {
var response = JSON.parse(request.responseText);
localforage.removeItem('current-note');
if(response.location) {
window.location = response.location;
// console.log(response.location);
} else {
$("#test_response").html(response.response).removeClass('hidden');
$("#test_success").addClass('hidden');
$("#test_error").removeClass('hidden');
}
} catch(e) {
$("#test_success").addClass('hidden');
$("#test_error").removeClass('hidden');
$("#btn_post").addClass("loading disabled").text("Working...");
if(doMultipart || !hasAltText) {
var request = new XMLHttpRequest();
request.open("POST", "/micropub/multipart");
request.onreadystatechange = function() {
if(request.readyState == XMLHttpRequest.DONE) {
handle_post_response(request.responseText);
}
$("#btn_post").removeClass("loading disabled").text("Post");
}
request.send(formData);
} else {
$.post("/micropub/postjson", {
data: JSON.stringify({
"type": "h-entry",
"properties": entry
})
}, function(response) {
handle_post_response(response);
});
}
$("#btn_post").addClass("loading disabled").text("Working...");
request.send(formData);
/*
$.post("/micropub/multipart", {
content: $("#note_content").val(),
'in-reply-to': $("#note_in_reply_to").val(),
location: $("#note_location").val(),
category: category,
slug: $("#note_slug").val(),
'<?= $this->user->micropub_syndicate_field ?>': syndications
}, function(data){
var response = JSON.parse(data);
if(response.location != false) {
$("#note_form").slideUp(200, function(){
$(window).scrollTop($("#test_success").position().top);
});
$("#test_success").removeClass('hidden');
$("#test_error").addClass('hidden');
$("#post_href").attr("href", response.location);
$("#note_content").val("");
$("#note_in_reply_to").val("");
$("#note_category").val("");
$("#note_slug").val("");
return false;
});
function handle_post_response(response) {
try {
if(typeof response == "string") {
response = JSON.parse(response);
}
localforage.removeItem('current-note');
if(response.location) {
window.location = response.location;
// console.log(response.location);
} else {
$("#test_response").html(response.response).removeClass('hidden');
$("#test_success").addClass('hidden');
$("#test_error").removeClass('hidden');
}
$("#last_response_date").html("(just now)");
$("#test_request").html(response.request);
$("#last_request_container").show();
$("#test_response").html(response.response);
});
*/
return false;
});
} catch(e) {
$("#test_success").addClass('hidden');
$("#test_error").removeClass('hidden');
}
$("#btn_post").removeClass("loading disabled").text("Post");
}
function location_error(msg) {
$("#note_location_msg").val(msg);

Write Preview
Loading…
Cancel
Save