{"id":1858,"date":"2015-08-03T21:14:19","date_gmt":"2015-08-03T20:14:19","guid":{"rendered":"http:\/\/johnjohnston.info\/106\/?p=1858"},"modified":"2015-08-03T21:14:19","modified_gmt":"2015-08-03T20:14:19","slug":"gifmovie-a-plugin","status":"publish","type":"post","link":"https:\/\/johnjohnston.info\/106\/gifmovie-a-plugin\/","title":{"rendered":"GifMovie a Plugin"},"content":{"rendered":"

I am much<\/em> more excited about this than it warrants.<\/p>\n

<\/p>\n

Hopefully just above this text you will see a canvas still image with a play button. Clicking on that should load a gif and an audio loop.<\/p>\n

I’ve played with this sort of thing before<\/a> but this is a bit more serious. A WordPress plugin!<\/p>\n

There are a few plugins fro freezing a gif until clicked, the purpose of these is usually to save bandwidth, my plugin certainly does not. What is does in alows you to add a shortcode to a blog post:<\/p>\n

[gifmovie gif=\"gifurl\" mp3=\"mp3url\"]<\/code><\/p>\n

Where gifurl and mp3urls are proper urls.<\/p>\n

So the one on this page looks like:<\/p>\n

[gifmovie gif=\"http:\/\/johnjohnston.info\/106\/wp-content\/uploads\/2013\/09\/beautifulface-360.gif\" mp3=\"http:\/\/johnjohnston.info\/106\/wp-content\/uploads\/2015\/08\/210569__oceanictrancer__119-bpm-house-loop.mp3\"]<\/code><\/p>\n

When the page loads this turns into a img tag with the gif with a data-mp3 attribute equal to the MP3. Some javascript then, hides the gif and creates a canvas element showing a frame. It adds code to handle clicks. These click hide the canvas, show the gif and play the sound.<\/p>\n

I’ve been using the plugin for a few prisoner106 posts<\/a> so am going to count this as a prisoner106 post. It seem to have worked with out any problem. I’d consider it in Beta.<\/p>\n

If you are interested in trying out the plugin leave me a comment or send me a DM.<\/strong><\/p>\n

Audio Credits:\u00a0Freesound.org – “119 bpm house loop” by oceanictrancer<\/a> licensed under the Creative Commons 0 License.<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

I am much more excited about this than it warrants. Hopefully just above this text you will see a canvas still image with a play button. Clicking on that should load a gif and an audio loop. I’ve played with this sort of thing before but this is a bit more serious. A WordPress plugin! … Continue reading “GifMovie a Plugin”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[74,64],"tags":[66,46],"class_list":["post-1858","post","type-post","status-publish","format-standard","hentry","category-animatedgif","category-audio","tag-plugin","tag-wordpress"],"better_featured_image":null,"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p3RLlC-tY","_links":{"self":[{"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/posts\/1858","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/comments?post=1858"}],"version-history":[{"count":3,"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/posts\/1858\/revisions"}],"predecessor-version":[{"id":1861,"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/posts\/1858\/revisions\/1861"}],"wp:attachment":[{"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/media?parent=1858"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/categories?post=1858"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/johnjohnston.info\/106\/wp-json\/wp\/v2\/tags?post=1858"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}