# That feeling when you've spent ages trying to get a keypress event working only to realise it doesn't work for non-printable characters and has been deprecated anyway. Switch to keydown and it works first time.
# Liked ten recent thoughts – rebeccatoh.co...
I couldn't help but think of "Fear is the path to the dark side. Fear leads to anger. Anger leads to hate. Hate leads to suffering" when reading number 6 as Rebecca originally wrote "Circumstances trigger thoughts. Thoughts lead to emotions. Emotions influence our actions."
# Front end media uploads in action:
# In the interests of keeping everything 'front end' I've added a new toggle to my 'new post' form:
Clicking/tapping this reveals a new form (held in an iframe) that lets me upload a file to the WordPress media library and returns the full path so I can copy/paste straight into a post - as I've done with the screenshot above.
The original version performed the upload okay but that was it, I then had to find out how to add the proper metadata so that the image actually appeared in the library.
# Liked MJD 59,163 - Venkatesh Rao...
Quantity has a quality all its own... Right now, I’m trying to engineer my next “process.”
# Progress, but nested queries are driving me insane:
# Because the display-time changes are in functions.php it means they can be used anywhere and not just on the garden pages, like this: [[digital garden]]
Obviously, as this is a display-time change, it only takes effect on the site itself and won't carry through to the RSS/JSON feeds so I probably won't use it often.
# During quiet spells at work (well, at home but you know what I mean) I've been firmly in "because I can" territory with the digital garden functionality.
Having already implemented a display-time function to display page links in wiki-style '[[]]' notation I wanted to do something similar for external links. Being normal pages I could just enter them using Markdown but I wanted it to be visually apparent and in keeping with the internal formatting so opted for '{{}}' delimiters.
I didn't stop there, oh no; and this is where things get completely unnecessary and nerdy. I decided to create an onkeypress event for the textarea that inserts the delimiters at the cursor position or surrounds highlighted text.
Why?
Because I can.
# Over the past couple of weeks I have been thinking about how to move forward with the blog or, rather, with writing in general after the Great Notes Catastrophy.
The way the blog operates has changed over time but there's more that can be done to make it more individual, more personal. With that in mind I've been reading about digital gardens again.
If you've been reading for a while you may remember that I tried this before, using a wiki plugin but it didn't work out at the time.
I've said so many times about being a fast writer but feel that I'm finally ready to slow down. Updating my notes over a period of time (even if it was just to convince myself I was still interested) showed me that I could return, adding new thoughts without the pressure of having to finish or hit publish.
I didn't want to do something as intense as a wiki (I installed Obsidian on my MacBook a while back but just haven't touched it) but wanted to do something more permanent than a blog post whilst still being just as casual.
I don't think a notes app on my phone is really the ideal place for this so wondered about something on the blog; it would have to be simple enough to manage in a mobile browser. What if I took the inline editing from the blog and applied it to pages?
Over the past couple of days I've, therefore, come up with a rudimentary solution which includes the following features:
- new page templates for the "garden"
- the ability to create and delete pages programatically
- the same inline editing as with posts
- wiki style links between pages using "[[ ]]" delimiters that are automatically translated to working HTML tags on display.
- a parent/child system (so far only one layer deep) to group pages correctly
Home/Index:
Page:
As with the Post functionality, all controls are hidden if you don't have permission to use them. I plan to increase the number of child layers once I work out the logic for multiple nested queries but this will do for a start.
I'm really happy with how it's come together in such a short space of time and hope that I'll make use of this more as it's a "roll your own" solution. I imagine it being the staging area for thoughts that could become posts as well as a resource to link to from elsewhere.
# Trying to get something working so having to enable debugging. There may be errors.
# On the subject of poetry, tonight is Guy Fawkes Night here in the UK (some other places too) and who can forget the rhyme associated with it:
Remember, remember the fifth of November,
Gunpowder, treason and plot.
But wait, that's not a rhyme. Still, it's all that most people know. It wasn't until I was in my twenties that I learned the next bit, thanks to Neil Gaiman's Sandman:
I see no reason why gunpowder treason,
Should ever be forgot.
Who said comics never teach you anything?
The first two lines were the version I was taught as a child but, apparently, the original began "Please to remember" - a turn of phrase no longer used so hardly surprising it was altered. There are also a couple of variations of the third line.
Even more recently I discovered that there was more; it continues:
Guy Fawkes, Guy Fawkes, t’was his intent
To blow up the King and Parli’ment.
Three-score barrels of powder below
To prove old England’s overthrow;
By God’s providence he was catch’d
With a dark lantern and burning match.
Holler boys, Holler boys, let the bells ring.
Holler boys, holler boys, God save the King!
Then the source of the tradition to place "Guys" on the bonfire:
And what should we do with him? Burn him!
Just as the UK national anthem drops the verse talking about the "Rebellious Scots to crush" so the Guy Fawkes rhyme no longer includes a section about killing the Pope by choking, burning or hanging with a rope - depending on the version.
It's ironic that we call it Guy Fawkes Night when he was just the explosives expert drafted in to set the powder and light the fuse, not the ring leader many assume him to have been. The price of being caught red handed.
# Sleep on it, rest.
Resist the urge,
To scream, to shout, to get upset or anxious.
There is no rush to be first,
Just to be right.
But be prepared to fight -
Only the right battles.
It's not a war.
No, it's life: yours and mine,
Everyone's.
And it's precious;
Not to be wasted on the petty or the false.
So rest,
Sleep on it.
Tomorrow it will all become clear.
# Liked As a former social media analyst, I'm quitting Twitter - David Hates Things...
"It's rather ironic, then, that the reason I want to quit Twitter is that it delivered on its promise of connecting the world in a global community."
Via Doug Belshaw
# Liked 100 Words for a COVID-19 world - Nicholas Bate...
"More human being, less human doing."
# It's curious how the phrase "to sleep, perchance to dream" is so often used in the wrong context. I suppose it's a good soundbite. Hamlet says this during the "to be or not to be" soliloquy but he is actually talking about the release of death - likely by suicide - and that not even this may release him from his mental anguish:
For in that sleep of death what dreams may come,
When we have shuffled off this mortal coil,
Must give us pause.
Ay, there's the rub indeed.
# Happy Halloween or Samhain or All Hallows Eve, however you refer to it. No pumpkin this year so here's Pikachu from 2018:
# My notes app has crashed and taken all the notes and ideas with it.
Not happy.
# What would be pretty cool is if I could get the new post and edit forms working through AJAX so that the page didn't need to reload. I've done a few searches and got some basic ideas but it's a whole new area that I haven't touched on before.
# I previously detailed how the post form operates so thought I'd do the same for the inline editing. The two work on the same principles but there is an additional step involved with editing rather than just posting: you have to pull in the post content but it's easier than it sounds as it's all done within the loop.
First, I've contained the code within the loop inside a DIV, this is given a unique ID to be used later:
<?php while ( $today_query->have_posts() ) : $today_query->the_post(); ?>
<div id="post<?php echo $post->ID; ?>"> // container div for post
<?php
// code in the loop to display the post
?>
</div>
Still within the loop, but after the code used to display the normal post, I have the form used to do the editing. It is in a hidden DIV by default which is, again, given a unique ID and is only visible if logged in and the current_user_can( 'edit_posts' ). The form contains a hidden input which holds the current post ID as its value and the textarea holds the original post content:
<?php
if (current_user_can( 'edit_posts' )) {
?>
<div id="edit<?php echo $post->ID; ?>" style="display: none;"> //container div for edit form
<form id="form<?php echo $post->ID; ?>" name="form<?php echo $post->ID; ?>" action="" method="post">
<input type="hidden" id="updatepost" name="updatepost" value="<?php echo $post->ID; ?>">
<textarea id="newcontent" name="newcontent"><?php the_content();?></textarea>
<?php
echo '<a onclick="quit(' . $post->ID . ')"><span style="float:left;" class="dashicons dashicons-dismiss"></span></a>';
?>
<input style="float:right;" type="submit" name="submit" id="submit" value="Update">
</form>
</div>
<?php } ?>
Inserted within the first DIV, just before the post content, is a WordPress dashicon used to toggle to 'edit mode' - for my theme this is a separate template called content.php. In the editing form, I have another dashicon to switch back and dismiss the form.
// toggle inserted before each post - within loop code
if (current_user_can( 'edit_posts' )) {
echo '<a style="display: none;" class="editicon" onclick="toggleEdit(' . $post->ID . ')"><span class="dashicons dashicons-edit"></span></a>';
}
Both dashicons have an onclick event which triggers a simple JavaScript function to toggle the display states of the normal post content and edit form:
<script>
function toggleEdit(e) {
let post = "post" + e;
let edit = "edit" + e;
document.getElementById(post).style.display='none';
document.getElementById(edit).style.display='block';
}
function quit(e) {
let post = "post" + e;
let edit = "edit" + e;
document.getElementById(post).style.display='block';
document.getElementById(edit).style.display='none';
}
</script>
I could have used a single function with an if...else statement but kept it separate on this occasion.
The edit form method is post and there is no action specified so it reload the same page. This means I need to process the form output so, at the start of the page is the code to do that:
<?php
// Update post
if ( isset($_POST['updatepost']) && ($_POST['newcontent'] !='') ) {
$body = stripslashes($_POST['newcontent']);
$ID = $_POST['updatepost'];
$update_post = array(
'ID' => $ID,
'post_content' => $body,
);
wp_update_post($update_post);
}
?>
After a quick check to ensure that the post content isn't empty and that a post ID has been passed it's a simple matter of creating a post array and updating the specified post. It is recommended to use stripslashes() when dealing with HTML form content via $_POST just in case of any issues.
And that's it. Inline post editing without having to go to wp-admin.
# Liked MJD 59,143 - Venkatesh Rao...
"You’ll be pivoting towards either greater engagement or greater detachment. You’ll either help invent the future, or retreat with the declining age and turn into a producer of nostalgia."