Tag: javascript

Posted on
by

I am pretty pleased with On this Flickr Day and already find it fascinating to see photos from the same day across the years.

I left this with a few todos and have made progress.

  1. Create a way to produce JSON rather than a web page with PHP. I could then bring the thumbnails into this site using JavaScript.
    • Was fairly simple when I found json_encode($data,JSON_PRETTY_PRINT); for php. That could be fetched with JavaScript from my new index page.
  2. Add some sort of lightbox to see the images larger.
  3. Change the layout & appearance.
    • Worked a little on this especially for mobile. Using a css grid on desktop. I want to keep it as simple as possible.Still need a bit of a tidy. While I was searching I found out about Masonry which look like a nice way to go eventually. Introducing CSS Grid Lanes | WebKit is a good read.
  4. Figure out a simple way to update the database without completely rebuilding it.
    • Just checking the last 100 photos on flickr once a day with a cron job. I just truncated the original script that built the database. I’ve uploaded a photo or two most days recently and it seems to be working. I could probably cut the numbers checked to 50, as I don’t upload many photos.
  5. Decide on any extra fields and recreate the database.
    • Not done, but I think I want to add in a smaller image size so I can pull the json into WordPress and add tiny thumbs to my on this day page.
  6. Figure out why I can’t get location information from the database with PHP I can with bash.
    • This sorted itself out once I check there was some location data for the image in the json when it is received.

I’ve continued to talk to claude.ai a bit in the process. But I’ve been careful to ask for it to discuss approaches & not give me code. I’ve tried to describe my ideas and situation and finish with Can you run through some options & idea, without code? or similar. This has been really helpful. I continue to search for answers to problems with DuckDuckGo too as in the pre ai days.

Posted on
by
Screenshot of On This Flickr Day webpage

On This Flickr Day There is a bit more work on making this look nice, but it is a start.

I’ve been thinking about this for a while. A way to show Flickr photos taken “on this day”.

I’ve used the Flickr API occasionally over the years, but calling it directly would take too much time. You would need to page through all the photos 500 at a time until you had all the photos.

So I thought I might build a personal database with the information I needed. This could be updated weekly. I then could pull the information from that in one go. Especially if I store the days and months individually for each photo.

This is somewhat outside my skill set. I’ve used the Flickr Api but do not really know much about databases. In the dim past I think I’ve created them once or twice and used from PHP but with lots of searching.

I planned:

  • Create a local sqlite database on my mac
  • Move it to a server
  • access it from a web page with JavaScript via a PHP file to read the database.

I’ve got some way toward that. I did need a bit of help from claude.ai to get the bash sorted. I’ve just used simple PHP on the webpage so far and managed that with the odd search when I’ve hit an error.

I’ve been thinking a bit about using AI for this sort of thing. My current approach is to use it for specific questions. For example, asking is this a sensible approach, or asking for hep with a line. Rather than write me a whole script to do x, y or z. So I start a script then ask for help when stuck. In the same way I’d have to look up docs or search for the answer to a problem.

Hopefully my next step will be to, after a short interval, go through any files and comment as to what is going on to reinforce my learning.

As I am a complete amateur and do not have anyone to chat about this with, I find using AI quite good fun if I make sure to tell it not to give me whole solutions.

The other thing I’ve been trying with AI is to run any files through asking for them to give any security recommendations.

Next Steps

  • Create a way to produce JSON rather than a web page with PHP. I could then bring the thumbnails into this site using JavaScript.
  • Add some sort of lightbox to see the images larger, change the layout & appearance.
  • Figure out a simple way to update the database without completely rebuilding it.
  • Decide on any extra fields and recreate the database.
  • Figure out why I can’t get location information from the database with PHP I can with bash.

Posted on
by

I’ve been thinking of my approach to the daily create. At the start of the month I was loosely connected to the Reclaim Open 2025 conference via Combobulating where a few of my posts here were combobulated with others as a way of talking about ds106 as part of a wild web.

I didn’t manage to take part as much as I liked, but had some fun, and thought a bit about the daily create. I don’t take the daily part very seriously at the moment. My contributions are often old things I’ve had on my hard drive or recycled attempts at creates gone by.

Strangely this week I’ve done more than usual. But two were recycled, one was a photo and one was a quick image edit.

Today I made more of an effort, I’d looked at the prompt in the morning and it didn’t click with me. Then I saw Kevin’s toot:

dial in a daily call us and we will inspire you to create or to remix; or maube it will be an invitation to write a story or a poem; or perhaps a call to share a photo or a piece of art. the unexpected is part of the appeal.
call today to get inspired.

Which made me think. I wonder if I could do something like the original project without any of the really hard or expensive bits. Maybe a webpage that would speak a random Daily Create? I did a bit of combobulating of some ideas and things I’d found and stored.

  • I knew that the daily create runs on WordPress and that you can access WordPress posts via an api. I’ve played with that before. So I just tested the endpoint to the posts in Firefox as it renders json nicely.
  • I thought I recalled that JavaScript can do text to speech so I searched for more information and found a nice, simple example.
  • I copied a very simple php cache I used a while back and adapted it to pull down the posts from the daily create.
  • I copied some code from an example from Tom Woodward to get me started. Pointing it at the php which would get the daily’s once a day and hence be less of a strain on that site and speed things up.
  • After looking for some phone images I decided to go mobile with a crude div with rounded corners.
  • Working on my raspberry pi meant I could edit and update quickly so just bashed through, borrowing and adapting some JavaScript from the speech example and Tom’s code. Some css from the speech example. The meta tags from a previous daily create. Since I had got the content of the daily posts I added a view of those too.

I came up with this: TDC 5054 Phone DS106, which reads out a random daily create challenge.

Given I’d already run way over the idea of doing tdc is 15 minutes I stopped quite quickly. There are a lot of things I could improve.

  • Proper colour change on the button, handing up a call you do not like.
  • Not loading another till the first was finished or hung up.
  • And maybe a text button to reply to the create on mastodon.
  • Some error checking & tidy code 😉
  • A calendar view of the creates would have been cool.
  • Make it nicer looking, maybe go with a tin can telephone metaphor.
  • Is a nicer voice possible?

But life is short, I’ve learnt a bit, had some fun and perhaps I’ll get a like or two.

This sort of thing, where I take the daily create in a different direction, make it into a couple of hours play, practise some “skills” and think a bit, is my favourite type of daily create. And because the rules of DS106 are flexible & porous I feel “successful”.

Update, while I was writing this Alan added it to the Daily Create site menus. Adds a bit of pressure to keep the pi running and maybe tackle some of the improvements.

Featured image public’s domain from Wikimedia Commons.

Posted on
by

Likes Pseudo code and kitchen-table conversations by Dave Winer.

I read a lot of negative stuff about chatGPT. Dave Winer seems upbeat. Even though he mentions that a lot of programmers will lose work, he is positive about chatGPT. There are a couple of laugh out loud moments and lots of ideas to chew on, even if you are not a programmer. An enjoyable listen.

Posted on
by
Liked Useless Build: Pug in a Rug by Tim Builds Useless Websites (youtube.com)
A website where you can pay your dues to the pug in a rug, by honoring it with your eyes. - The website https://puginarug.com​ - The code https://github.com/tholman/puginarug

Pretty delightful video showing how the The Pug In A Rug Site/page was made. Simple enough for me to learn from.

I usually do not use YouTube videos for learning preferring text or text and image. This video hit the sweet spot for me.

It also felt like Tim was working it out as he went along, developing ideas and fixing mistakes.

Posted on
by
Replied to Re: Browser Bookmarklets for Giving Credit by Aaron DavisAaron Davis (collect.readwriterespond.com)
I am all in on this Chris, but I just can’t seem to get it to work. I created the bookmarklet, highlighted the name and clicked the bookmarklet, but there was no pop-up. I must admit, I do not use many bookmarklets, only Alan Levine’s really. I may therefore have to dig into this a bit further a...

Hi Aaron,

I am glad you posted this. I like bookmarklets. I run one a bit like this via AppleScript on my mac. This has an advantage of letting me add a keyboard to send straight to the clipboard.

I am going to add the indieweb mark up to that using Chris’s script for reference. Like you I couldn’t get it working at first I had to mess around with he single and double quotes. This works for me:


javascript:(function(){let text = "";if (window.getSelection() != '') {text = window.getSelection().toString() + '\n';}var tocopy = '<p><small><cite class="h-cite via"><abbr title="via">ᔥ</abbr> <span class="p-author h-card">"' + text + '"</span> in <a class="u-url p-name" href="' + location.href + '" target="_blank" rel="noopener noreferrer" >' + document.title + '</a> (<time class="dt-published">' + document.lastModified + '</time>)</cite></small></p>';;d=document;d.body.appendChild(Object.assign(d.createElement('textarea'),{value:tocopy})).select();d.execCommand('copy');})()

view raw

via-indie-web-bookmarklet

hosted with ❤ by GitHub

I’ve not got much of a handle on JavaScript so YMMV.

Posted on
by
Replied to re: document.designMode by Aaron DavisAaron Davis (collect.readwriterespond.com)
document.designMode is another useful tool when teaching the web and manipulation of content.

Hi Aaron,

Thanks for this, a useful replacement for Mozzila’s x-ray for learning, teaching and playing with the web.

I wondered about using this on iOS and found I could make the simplest of shortcuts.

document.designMode='on';

completion();

I’ve not used a shortcut for running JavaScript in mobile Safari before so useful to learn about completion()