frame-by-frame animation AddOn not working correctly

[lla]

Hey,
I created an addon which is implement a resource /progress bar as a "globe". So a health globe and a player sesource globe like mana.
I have a tga file which contains 46 frames that the code displays frame by frame.

My problem is the orb is not "progressing" correctly because it becomes oval rather than crop the missing resource (mana)
Also the animation is not too fluid, choppy and tearing.

Can I get any suggestion how to improve it and correct the above issues?

Many thanks in advance!

please see the code below:

local HalfSQRT2,LLAngle,LRAngle,UAngle=(2^0.5)/2,0.75*math.pi,0.25*math.pi,1.5*math.pi;
local function Vector(x,y,angle,dist) return x+math.cos(angle)*dist,y+math.sin(angle)*dist; end
local function CalcTexCoord(angle,percent)
    local LLx,LLy=Vector(1,1,LLAngle+angle,HalfSQRT2);
    local LRx,LRy=Vector(1,1,LRAngle+angle,HalfSQRT2);
    local ULx,ULy=Vector(LLx,LLy,UAngle+angle,percent);
    local URx,URy=Vector(LRx,LRy,UAngle+angle,percent);
    return ULx,ULy,LLx,LLy,URx,URy,LRx,LRy;
end
 
-- Create a frame to hold the texture object
local ManaFrame = CreateFrame("Frame", nil, UIParent)
ManaFrame:SetPoint("CENTER")
ManaFrame:SetSize(348, 348)

-- Create the texture object and set its texture, position, and size
local ManaOrb = ManaFrame:CreateTexture(nil, "ARTWORK")
ManaOrb:SetTexture("Interface\\HealthGlobeBlue") -- Set to whatever your texture is
ManaOrb:SetPoint("BOTTOM") -- Attach to bottom of frame
ManaOrb:SetSize(ManaFrame:GetSize()) -- Init to frame size

-- Create an animation group for the texture object
local animationGroup = ManaFrame:CreateAnimationGroup()

-- Create an animation for the texture object's tex coords
local animation = animationGroup:CreateAnimation("TexCoord")

-- Set the duration of the animation
animation:SetDuration(0.015) -- Set duration to 0.1 seconds per frame
animation:SetEndDelay(0.1) -- Set delay after animation ends to 1 second

-- Set up an array of tex coords to animate through
local texCoords = {
    {0, 1/46, 0, 1},
    {1/46, 2/46, 0, 1},
    {2/46, 3/46, 0, 1},
    {3/46, 4/46, 0, 1},
    {4/46, 5/46, 0, 1},
    {5/46, 6/46, 0, 1},
    {6/46, 7/46, 0, 1},
    {7/46, 8/46, 0, 1},
    {8/46, 9/46, 0, 1},
    {9/46, 10/46, 0, 1},
    {10/46, 11/46, 0, 1},
    {11/46, 12/46, 0, 1},
    {12/46, 13/46, 0, 1},
    {13/46, 14/46, 0, 1},
    {14/46, 15/46, 0, 1},
    {15/46, 16/46, 0, 1},
    {16/46, 17/46, 0, 1},
    {17/46, 18/46, 0, 1},
    {18/46, 19/46, 0, 1},
    {19/46, 20/46, 0, 1},
    {20/46, 21/46, 0, 1},
    {21/46, 22/46, 0, 1},
    {22/46, 23/46, 0, 1},
    {23/46, 24/46, 0, 1},
    {24/46, 25/46, 0, 1},
    {25/46, 26/46, 0, 1},
    {26/46, 27/46, 0, 1},
    {27/46, 28/46, 0, 1},
    {28/46, 29/46, 0, 1},
    {29/46, 30/46, 0, 1},
    {30/46, 31/46, 0, 1},
    {31/46, 32/46, 0, 1},
    {32/46, 33/46, 0, 1},
    {33/46, 34/46, 0, 1},
    {34/46, 35/46, 0, 1},
    {35/46, 36/46, 0, 1},
    {36/46, 37/46, 0, 1},
    {37/46, 38/46, 0, 1},
    {38/46, 39/46, 0, 1},
    {39/46, 40/46, 0, 1},
    {40/46, 41/46, 0, 1},
    {41/46, 42/46, 0, 1},
    {42/46, 43/46, 0, 1},
    {43/46, 44/46, 0, 1},
    {44/46, 45/46, 0, 1},
    {45/46, 1, 0, 1},
};

-- Set up an array of times for the animation to hit each frame
local times = {
    0,
    0.1,
    0.2,
    0.3,
    0.4,
    0.5,
    0.6,
    0.7,
    0.8,
    0.9,
    1,
    1.1,
    1.2,
    1.3,
    1.4,
    1.5,
    1.6,
    1.7,
    1.8,
    1.9,
    2,
    2.1,
    2.2,
    2.3,
    2.4,
    2.5,
    2.6,
    2.7,
    2.8,
    2.9,
    3,
    3.1,
    3.2,
    3.3,
    3.4,
    3.5,
    3.6,
    3.7,
    3.8,
    3.9,
    4,
    4.1,
    4.2,
    4.3,
    4.4,
    4.5,
    };


--animation:SetSmoothing("NONE");
animation:SetSmoothing("NONE");

-- Set the animation group to loop the animation
animationGroup:SetLooping("REPEAT");

local currentFrame = 1

-- Set the OnUpdate script for the animation
animation:SetScript("OnUpdate", function(self, elapsed)
  -- Calculate the current frame based on the elapsed time and the animation duration
  currentFrame = math.floor(elapsed / animation:GetDuration() * #texCoords) + 1
  -- Apply the current texCoord to the texture object
  ManaOrb:SetTexCoord(unpack(texCoords[currentFrame]))
end)

-- Set the OnFinished script for the animation
animation:SetScript("OnFinished", function(self)
    -- Reset the current frame
    currentFrame = 1
    -- Restart the animation
    animationGroup:Play()
  end)

-- Start the animation
animationGroup:Play();
 
ManaFrame.Unit="player";
ManaFrame:RegisterUnitEvent("UNIT_DISPLAYPOWER",ManaFrame.Unit);
ManaFrame:RegisterUnitEvent("UNIT_POWER_UPDATE",ManaFrame.Unit);
ManaFrame:RegisterUnitEvent("UNIT_MAXPOWER",ManaFrame.Unit);
ManaFrame:SetScript("OnEvent",function(self,event,...)

        local percent=UnitPower(self.Unit)/UnitPowerMax(self.Unit);
        ManaOrb:SetHeight(self:GetHeight()*percent);--  Adjust texture height
	   -- ManaOrb:SetTexCoord(0, 1, 1-percent, 1)
        ManaOrb.PercentValue=percent;-- Texcoord updates from OnUpdate script
        self:Show();
   
end);