Animated GIF for Control Page

Posted on
Thu Jun 04, 2020 11:52 am
mgolden50 offline
User avatar
Posts: 247
Joined: Jan 29, 2007
Location: Chandler, AZ

Re: Animated GIF for Control Page

Dave,
Do you have a way I can send you a properly formatted version of the script?

Posted on
Thu Jun 04, 2020 2:42 pm
DaveL17 offline
User avatar
Posts: 6741
Joined: Aug 20, 2013
Location: Chicago, IL, USA

Re: Animated GIF for Control Page

Can you attach it to a post as a .txt file?

I came here to drink milk and kick ass....and I've just finished my milk.

[My Plugins] - [My Forums]

Posted on
Thu Jun 04, 2020 4:35 pm
jay (support) offline
Site Admin
User avatar
Posts: 18199
Joined: Mar 19, 2008
Location: Austin, Texas

Re: Animated GIF for Control Page

Not sure why it's not formatting in his previous post, but when I copy/paste it into a reply here it worked:

Code: Select all
#! /usr/bin/env python2.7
# -*- coding: utf-8 -*-
import os
"""
A prototype script for creating a "ticker tape" style animated, horizontally scrolling
long text string, for use on Indigo control pages based on the ImageMagick library.
"""

import subprocess
## Where the animated GIF image will reside.  Spaces must be escaped.
work_fldr = "/Library/Application\ Support/Perceptive\ Automation/Indigo\ 7.4/IndigoWebServer/images/controls/static/"
## This variable limits the character width of the "ticker tape" on the Control Page
## The pixel width of the initial .png frame image needs to be sufficient to accomodate
## the specified number of characters at the point size specified in the imageMagick
## setup
DisplayFieldLength = 29
## When finally interrated with Indigo, the line below will point to and Indigo varible.
char_List = "       Today: Sunny, with a high near 108. West wind 5 to 10 mph.      Tonight: Mostly clear, with a low around 78. West wind around 5 mph becoming calm in the evening. "
## The lines following convert the long string into a list of strings that are
## within the specified width and successively moved one character to the left
list_Of_Chars = []
list_Of_Display_FrameStrings = []
t = char_List
for i in range(len(t)):
   t = t[1:] + t[0]
   eachDisplayFrameCharList = t[0:DisplayFieldLength]
   eachDisplayrameString = "".join(eachDisplayFrameCharList)
## This is the final list of Display Field Strigs
   list_Of_Display_FrameStrings.append(eachDisplayrameString)
## Now comes the magic of ImageMagick which converts each display field string into
## a graphic image and combines it with a frame image copied from an initial frame
## template. the new .png frames are then given a sequential number and saved to be
## used by ImageMagic to create the final Gif animation file.
## First part of the output command string.

## The first ImageMagick command specifies the delay time that each animation frame
## waits before the next image is displayed and sets size in pixels of the text image
## within the frame image.
output_cmd = "/opt/local/bin/convert -delay 15 -size 200x27 "

## Next iterate through the items in the list_Of_Display_FrameStrings to create
## sequential frame images based on each sequential display string image.
## those images are saved as enumerated files that will be used to build the animation.
for num in range(1, len(list_Of_Display_FrameStrings) + 1):
   ## Build each frame image setting the font, font color, t texpoint size, and the
   ## reference to the text to be added to the frame image.
   proc = subprocess.Popen("/opt/local/bin/convert {0}bar.png -font arial -fill Goldenrod -pointsize 70 -gravity center  -annotate +10+17  '{1}' "
                            "{0}bar_frame{2}.png".format(work_fldr, list_Of_Display_FrameStrings[num - 1], num), stdout=subprocess.PIPE, stderr=subprocess.PIPE, shell=True)     
## For debugging, you can look at the shell's return.
    #print(proc.communicate())
    ## Add command to the output command string to save each new frame image.
    output_cmd += "-dispose previous -page +0+0 {0}bar_frame{1}.png ".format(work_fldr, num)
## The last part of the output command string
output_cmd += "-loop 0 {0}bar_animation.gif".format(work_fldr)
## Next to last call ImageMagick to actually build the GIF animation usinge the command
## composed in the preceding line
proc1 = subprocess.Popen(output_cmd, stdout=subprocess.PIPE, stderr=subprocess.PIPE, shell=True)

## Finally, emove all of the .png files that were used to create the animaton--since next animated strings may have different file counts
fileCount = len(list_Of_Display_FrameStrings)
for n in range (0,fileCount):
#     print((work_fldr+"bar_frame"+str(n)+".png"))
   try:
      cmd_rm = "rm -rf "+work_fldr+"bar_frame"+str(n)+".png"
      os.system(cmd_rm)
   #os.remove ("/Library/Application\ Support/Perceptive\ Automation/Indigo\ 7.4/IndigoWebServer/images/controls/static/bar_frame1.png")
   except OSError as err:
      print("rm -rf "+work_fldr+"bar_frame"+str(n)+".png")

Jay (Indigo Support)
Twitter | Facebook | LinkedIn

Posted on
Thu Jun 04, 2020 5:01 pm
DaveL17 offline
User avatar
Posts: 6741
Joined: Aug 20, 2013
Location: Chicago, IL, USA

Re: Animated GIF for Control Page

Thanks Jay! I will have a look and see what's what.

I came here to drink milk and kick ass....and I've just finished my milk.

[My Plugins] - [My Forums]

Posted on
Thu Jun 04, 2020 5:43 pm
mgolden50 offline
User avatar
Posts: 247
Joined: Jan 29, 2007
Location: Chandler, AZ

Re: Animated GIF for Control Page

Hi Dave,

Text file attached hope this works.

Mike
Attachments
Animated GIF Scrolling Text Generator v0.2 copy.txt
(2.74 KiB) Downloaded 167 times

Posted on
Thu Jun 04, 2020 5:59 pm
DaveL17 offline
User avatar
Posts: 6741
Joined: Aug 20, 2013
Location: Chicago, IL, USA

Re: Animated GIF for Control Page

I've dressed up the code a bit--hopefully, it will make it a bit easier for others to follow and use within Indigo. I'm afraid I've never used "APNG Assembler" before, so I can't provide any insights on that front.

Code: Select all
#! /usr/bin/env python2.7
# -*- coding: utf-8 -*-

"""
A prototype script for creating a "ticker tape" style animated, horizontally scrolling
long text string, for use on Indigo control pages based on the ImageMagick library.
"""

import os
import subprocess
try:
    import indigo
except ImportError:
    pass

# Where the animated GIF image will reside. Spaces must be escaped.
work_folder = "/Library/Application\ Support/Perceptive\ Automation/Indigo\ 7.4/IndigoWebServer/images/controls/static/"

# This variable limits the character width of the "ticker tape" on the Control
# Page The pixel width of the initial .png frame image needs to be sufficient
# to accommodate the specified number of characters at the point size
# specified in the imageMagick setup
display_field_length = 29

# When finally interrated with Indigo, the line below will point to and Indigo variable.
char_list = u"       Today: Sunny, with a high near 108. West wind 5 to 10 mph.      Tonight: Mostly clear, with a low around 78. West wind around 5 mph becoming calm in the evening."

# The lines following convert the long string into a list of strings that are
# within the specified width and successively moved one character to the left.
list_of_display_frame_strings = []

for i in range(len(char_list)):
    char_list = char_list[1:] + char_list[0]
    each_display_frame_char_list = char_list[0:display_field_length]
    each_display_frame_string = "".join(each_display_frame_char_list)

    # This is the final list of Display Field Strings
    list_of_display_frame_strings.append(each_display_frame_string)

# Now comes the magic of ImageMagick which converts each display field string
# into a graphic image and combines it with a frame image copied from an
# initial frame template. the new .png frames are then given a sequential
# number and saved to be used by ImageMagic to create the final GIF animation
# file. First part of the output command string.
#
# The first ImageMagick command specifies the delay time that each animation
# frame waits before the next image is displayed and sets size in pixels of the
# text image within the frame image.
output_cmd = "/opt/local/bin/convert -delay 15 -size 200x27 "

# Next iterate through the items in the list_Of_Display_FrameStrings to create
# sequential frame images based on each sequential display string image. Those
# images are saved as enumerated files that will be used to build the
# animation.
for num in range(1, len(list_of_display_frame_strings) + 1):
    # Build each frame image setting the font, font color, text point size,
    # and the reference to the text to be added to the frame image.
    proc = subprocess.Popen("/opt/local/bin/convert {0}bar.png -font arial -fill Goldenrod -pointsize 70 -gravity center -annotate +10+17 '{1}' {0}bar_frame{2}.png".format(
                            work_folder, list_of_display_frame_strings[num - 1], num), stdout=subprocess.PIPE, stderr=subprocess.PIPE, shell=True)

    # For debugging, you can look at the shell's return.
    # indigo.server.log(proc.communicate())

    # Add command to the output command string to save each new frame image.
    output_cmd += "-dispose previous -page +0+0 {0}bar_frame{1}.png ".format(work_folder, num)

# The last part of the output command string
output_cmd += "-loop 0 {0}bar_animation.gif".format(work_folder)

# Next to last call ImageMagick to actually build the GIF animation using the
# command composed in the preceding line.
proc1 = subprocess.Popen(output_cmd, stdout=subprocess.PIPE, stderr=subprocess.PIPE, shell=True)

# Finally, remove all of the .png files that were used to create the animation--since next animated strings may have different file counts.
file_count = len(list_of_display_frame_strings)
for n in range(0, file_count):
    try:
        indigo.server.log(u"{0}bar_frame{1}.png".format(work_folder, n))
        cmd_rm = "rm -rf {0}bar_frame{1}.png".format(work_folder, n)
        os.system(cmd_rm)
    except OSError as err:
        indigo.server.log(u"rm -rf {0}bar_frame{1}.png".format(work_folder, n))

I came here to drink milk and kick ass....and I've just finished my milk.

[My Plugins] - [My Forums]

Posted on
Thu Jun 04, 2020 6:22 pm
mgolden50 offline
User avatar
Posts: 247
Joined: Jan 29, 2007
Location: Chandler, AZ

Re: Animated GIF for Control Page

Thanks Dave,

The only help I think I need is how to make a call to the following CLI command with the correct form of reference to the list of png frames in work_fldr created by your code.

apngasm -o outfile.png frame1.png frame2.png frame3.png... through frame.png

I imagine its something equivalent to the popen mechanism you used in your code. but I just don't get the syntax yet.

Anyone else have an idea how to do this.

Thanks,

Mike

Posted on
Thu Jun 04, 2020 7:46 pm
DaveL17 offline
User avatar
Posts: 6741
Joined: Aug 20, 2013
Location: Chicago, IL, USA

Re: Animated GIF for Control Page

mgolden50 wrote:
Thanks Dave,

The only help I think I need is how to make a call to the following CLI command with the correct form of reference to the list of png frames in work_fldr created by your code.

apngasm -o outfile.png frame1.png frame2.png frame3.png... through frame.png

I imagine its something equivalent to the popen mechanism you used in your code. but I just don't get the syntax yet.

Anyone else have an idea how to do this.

Thanks,

Mike

IIRC, popen generally expects arguments in the form of a list--so it would be something like:
Code: Select all
subprocess.popen(["apngasm", "-o", "outfile.png", "frame1.png", "frame2.png", "frame3.png", "frame.png"])

or if you use the shell=True argument then it's all as one long string.
Code: Select all
subprocess.popen("apngasm -o outfile.png frame1.png frame2.png frame3.png frame.png", shell=True)

I came here to drink milk and kick ass....and I've just finished my milk.

[My Plugins] - [My Forums]

Posted on
Sun Jun 07, 2020 12:24 pm
mgolden50 offline
User avatar
Posts: 247
Joined: Jan 29, 2007
Location: Chandler, AZ

Re: Animated GIF for Control Page

Hi again Dave,

Victory!!!

I now have APNG Assembler Python code that will programmatically create both GIF and APNG animations for horizontally scrolling text strings.

However, I think that realtime Indigo Control Page APNG creation might be generally useful for a lot of folks--allowing the content of animations to be modified on the fly while continuously displaying on a Control Page on Safari.

The debugging of the required command line string was fairly nit-picky. The sample terminal command I developed is:

apngasm -F -d 40 -o /Library/Application\ Support/Perceptive\ Automation/Indigo\ 7.4/IndigoWebServer/images/controls/static/bar_animation.png /Library/Application\ Support/Perceptive\ Automation/Indigo\ 7.4/IndigoWebServer/images/controls/static/bar_frame10.png

When this string worked in terminal,I was only a matter of making it a popen Python command modeled on what you did with ImageMagick. Thanks again for the coaching and examples with ImageMagick.

I may start drinking milk !!!

The [code][/code] function is still not working for me on the forum web site so I'm attaching the code as a text file again.
The flags under the message box shows that BBCode is On.

Thanks again for all of your support.

Mike
Attachments
bar_animation2.png
bar_animation2.png (286.4 KiB) Viewed 6787 times
bar_animation1.png
bar_animation1.png (322.94 KiB) Viewed 6787 times
Animation Generator for GIF and APNG Formats.txt
(3.64 KiB) Downloaded 174 times

Posted on
Sun Jun 07, 2020 2:00 pm
DaveL17 offline
User avatar
Posts: 6741
Joined: Aug 20, 2013
Location: Chicago, IL, USA

Re: Animated GIF for Control Page

Hey, congratulations. I'm glad you were able to find something that will work for you. One suggestion would be to look at whether you could increase the number of frames in the animation. It would (at least theoretically) make the scroll smoother.

Well done!

I came here to drink milk and kick ass....and I've just finished my milk.

[My Plugins] - [My Forums]

Posted on
Sun Jun 07, 2020 2:21 pm
mgolden50 offline
User avatar
Posts: 247
Joined: Jan 29, 2007
Location: Chandler, AZ

Re: Animated GIF for Control Page

To do that I would need to find a way to make ImageMagic interpolate between a frame and the next frame that is shifted by one character.. Baically shifting the image partial characters worth of pixels to the left. Do you know if Imagick has the capability to do that? I'll do some looking into it. I agree that the character by character scrolling is a bit rough.

Posted on
Sun Jun 07, 2020 3:42 pm
DaveL17 offline
User avatar
Posts: 6741
Joined: Aug 20, 2013
Location: Chicago, IL, USA

Re: Animated GIF for Control Page

Unfortunately, I don't think ImageMagick has the capability to do that.

I came here to drink milk and kick ass....and I've just finished my milk.

[My Plugins] - [My Forums]

Posted on
Tue Jun 09, 2020 9:37 am
mgolden50 offline
User avatar
Posts: 247
Joined: Jan 29, 2007
Location: Chandler, AZ

Re: Animated GIF for Control Page

I have a new wrinkle with the APNG image on a control page on Safari.
When I update the animation content that change is not reflected on the page until I manually refresh the browser.
Is there a way to refresh the browser or the image automatically?

Posted on
Tue Jun 09, 2020 1:06 pm
DaveL17 offline
User avatar
Posts: 6741
Joined: Aug 20, 2013
Location: Chicago, IL, USA

Re: Animated GIF for Control Page

What I typically do in those cases is load the image as a Refreshing Image URL object.

I came here to drink milk and kick ass....and I've just finished my milk.

[My Plugins] - [My Forums]

Who is online

Users browsing this forum: No registered users and 0 guests