Mage Portal / Teleport Plugin Coming Soon ...

[Randlore]

Originally Posted by Xrystal Hi Randlore, in case you haven't seen it yet I have just uploaded the fix to the bug you spotted about the same time I did . rofl. Anyway, if you want to try testing different sizes for the icons try adjusting these values in the mageports.lua file. Button:SetWidth(36); Button:SetHeight(36); Each time you change it though you will need to do a /rl to get the latest codefile incorporated. If a different number helps your set up let me know and I will shift it up higher in the file to where the other customizable values are. I am trying to avoid a config set up to minimize code but may incorporate slash commands to change those values while in game in a later version. Also, at the moment I haven't got it resizing buttons based on resolution like Scott does with the nUI base code but if needed I will look into that aspect too.

i have played with the button setin that helps out bit but only resize the buttons

i am lookin for a way to move them over abit to the left and up a bit more
like 1 or 2cm up and left how do i do that ??

ohh yea plz add the code for resizing the buttons based on resolution plz

this is what i ood love to get fixs the buttons and ley out where they sit on screen

[IMG][/IMG]

[spiel2001]

Xyrstal --

There's actually a mechanism built into the info panel plugin system already to make this more "automatic" -- the "plugin.sizeChanged" method passes you in a scale as well as height and width of the container.

There are a couple of options.

1) You can set the button size in that method using something like button.SetWidth( btnWidth * scale ) and find a value for btnWidth that makes it fit... then as the scale increases or decreases, hopefully the button would, too.

2) Take the width argument and divide it by the number of buttons you want to display across the panel and use the result to set the button height and width... that way the buttons always fit exactly across the width of the panel even if the panel size changes -- you can, of course, subtract a bit from the width to add that as a gap between the buttons, as well.

You could do something like this...

plugin.sizeChanged = function( scale, height, width )
    
    local cellWidth = width / 6;
    local btnSize = cellWidth * 0.95;
    local btnGap = cellWidth * 0.05;
    local verticalOffset = 0; -- how far up or down from center to put the button

    for i=1,6 do
        button[i]:SetWidth( btnSize );
        button[i]:SetHeight( btnSize );
    end

    button[1]:SetPoint( "RIGHT", button[2], "LEFT", -btnGap, 0 );
    button[2]:SetPoint( "RIGHT", button[3], "LEFT", -btnGap, 0 );
    button[3]:SetPoint( "RIGHT", plugin.container, "CENTER", -btnGap/2, verticalOffset );
    button[4]:SetPoint( "LEFT", plugin.container, "CENTER", btnGap/2, verticalOffset );
    button[5]:SetPoint( "LEFT", button[4], "RIGHT", btnGap, 0 );
    button[6]:SetPoint( "LEFT", button[5], "RIGHT", btnGap, 0 );
end

With something of that nature, no matter how much the size of the plugin changes, it will always center 6 buttons across the width of the window with a small gap between each button. You can probably figure out what I'm doing from there to tweak it.

This way your plugin works at all resolutions without the user having to tweak anything.

PS: Note... I'm using button[i] as a symbol for your buttons... I haven't looked at how you have it coded, so I'm generalizing. button[1] is your first button, button[2] your second button and so on.

[Xrystal]

Thanks Scott.

I will investigate that avenue tomorrow and see how I can get my code incorporated in there. Shouldn't be a problem from the looks of your example.

I pretty much have a frame created for the addon itself as if it was a separate addon and then I reparent it inside the panel. All the positioning of the objects are based on the TOPLEFT or TOPRIGHT of the frame with buttons 2 to x being based on the button in front with a padding space.

But should be able to implement something with the width value to make everything fit. Although looking at that screenshot the text doesn't look too comfortable where I have positioned them with that font - rofl.

Will see what I manage to get working tomorrow.

[Randlore]

yea sorry for the messin abot you have been doin for i love this plugin + nui itself

dude i am not a pc wizzkid sorry had a go at doin what you put up here

but keep messin it up somewhere

if pos plz make a auto resizeing programe for this so it will show up on the screen runing at 1024*768

i am not goin to mess about with the plugin anymore just goin to use it as it is on my screen for now

hopein for a fix in the next update

plz keep up the good work
one's more ty v-much for all your help

[Xrystal]

Rofl, attempt no 1 to set up auto sizing went and broke the whole infopanel framework and my addon - rofl.

Attempt 2 .. no longer broke .. but hilarious layout .. think it needs reworking a bit but you have to see this

[spiel2001]

X marks the spot eh?

~lol~

At least the widths are right.

And, actually, it occurs to me that the problem is probably my fault... the verticalOffset should only be used with buttons 3 and 4 in my example... the other 4 buttons should have used 0 for the vOfs argument.

I'll edit my prior post to make the correction so you can see it.

My bad.

[Xrystal]

Rofl, that was a relief .. thought I was doing something drastically wrong somewhere

Well with that change things are a bit better but trying to work 2 rows in aren't working quite right yet.

My code for that function is as follows. I had to rearrange the order as it reported dependancy warnings and I had to remove my own anchoring code as it conflicted with it for some reason.

Edit: Grr dang it .. tabs not aligning properly in here but look fine in Visual Studio.

Edit 2 : Rofl and it also might help if I count how many there are .. should be 7 not 6. My original code didn't use hard coded element values but had it all in a for loop and positioned accordinly that way.

plugin.sizeChanged = function( scale, height, width )
	local options  = plugin.options;
	plugin.scale = scale;

	-- Grab addon information and unlock frame for movement
	local MagePortsFrame   = plugin.MagePorts;
	nUI_Movers:lockFrame( MagePortsFrame, false, nil );
	
	-- Resize and Reposition according to scale and size of new container
	MagePortsFrame:SetWidth( width ); 
	MagePortsFrame:SetHeight( height ); 
	
	-- Center Buttons across the container
    local cellWidth = ( width / 6 );
    local btnSize = cellWidth * 0.95;
    local btnGap = cellWidth * 0.05;
    local verticalOffset = width / 4; -- how far up or down from center to put the button

    for i=1,6 do
        MagePorts.PortalButtons[i]:SetWidth( btnSize );
        MagePorts.PortalButtons[i]:SetHeight( btnSize );
        MagePorts.TeleportButtons[i]:SetWidth( btnSize );
        MagePorts.TeleportButtons[i]:SetHeight( btnSize );
    end

	-- Reposition Portal Buttons and Fontstrings
    MagePorts.PortalButtons[3]:SetPoint( "RIGHT", plugin.container, "CENTER", -btnGap/2, verticalOffset );
    MagePorts.PortalButtons[2]:SetPoint( "RIGHT", MagePorts.PortalButtons[3], "LEFT", -btnGap, 0 );
    MagePorts.PortalButtons[1]:SetPoint( "RIGHT", MagePorts.PortalButtons[2], "LEFT", -btnGap, 0 );
    MagePorts.PortalButtons[4]:SetPoint( "LEFT", plugin.container, "CENTER", btnGap/2, verticalOffset );
    MagePorts.PortalButtons[5]:SetPoint( "LEFT", MagePorts.PortalButtons[4], "RIGHT", btnGap, 0 );
    MagePorts.PortalButtons[6]:SetPoint( "LEFT", MagePorts.PortalButtons[5], "RIGHT", btnGap, 0 );
	MagePortsFrame.PortalTitle:SetPoint( "BOTTOM", MagePorts.PortalButtons[1], "TOP", -btnGap, 0);
	MagePortsFrame.PortalCount:SetPoint( "BOTTOM", MagePorts.PortalButtons[6], "TOP", -btnGap, 0);	

	-- Reposition Teleport Buttons
    MagePorts.TeleportButtons[3]:SetPoint( "RIGHT", plugin.container, "CENTER", -btnGap/2, -verticalOffset );
    MagePorts.TeleportButtons[2]:SetPoint( "RIGHT", MagePorts.TeleportButtons[3], "LEFT", -btnGap, 0 );
    MagePorts.TeleportButtons[1]:SetPoint( "RIGHT", MagePorts.TeleportButtons[2], "LEFT", -btnGap, 0 );
    MagePorts.TeleportButtons[4]:SetPoint( "LEFT", plugin.container, "CENTER", btnGap/2, -verticalOffset );
    MagePorts.TeleportButtons[5]:SetPoint( "LEFT", MagePorts.TeleportButtons[4], "RIGHT", btnGap, 0 );
    MagePorts.TeleportButtons[6]:SetPoint( "LEFT", MagePorts.TeleportButtons[5], "RIGHT", btnGap, 0 );
	MagePortsFrame.TeleportTitle:SetPoint( "BOTTOM", MagePorts.TeleportButtons[1], "TOP", -btnGap, 0);
	MagePortsFrame.TeleportCount:SetPoint( "BOTTOM", MagePorts.TeleportButtons[6], "TOP", -btnGap, 0);	
	
	-- Lock addon frame for movement
	nUI_Movers:lockFrame( MagePortsFrame, true, nil );
end

[spiel2001]

First thing I spot is that verticalOffset should probably be calculated from "height / 4" not "width / 4"

[Xrystal]

Well done .. you erm passed my observation test perfectly with flying colors .. rofl .. actually noticed it myself .. makes it much better but still not quite right ..

And yes .. just realised I need to tweak it so that only no 4 is centered and the others around it now it is 7 buttons and not 6. Trying to make it a bit more flexible in case they add more ports in the future.

[spiel2001]

If you have seven buttons, not six, then instead of using two buttons as your anchors on each row, just use 1

button[4]:SetPoint( "CENTER", plugin.container, "CENTER", 0, verticalOffset );

button[3]:SetPoint( "RIGHT", button[4], "LEFT", -btnGap, 0 );
button[2]:SetPoint( "RIGHT", button[3], "LEFT", -btnGap, 0 );
button[1]:SetPoint( "RIGHT", button[2], "LEFT", -btnGap, 0 );

button[5]:SetPoint( "LEFT", button[4], "RIGHT", btnGap, 0 );
button[6]:SetPoint( "LEFT", button[5], "RIGHT", btnGap, 0 );
button[7]:SetPoint( "LEFT", button[6], "RIGHT", btnGap, 0 );

[spiel2001]

Originally Posted by Xrystal Well done .. you erm passed my observation test perfectly with flying colors .. rofl .. actually noticed it myself .. makes it much better but still not quite right ..

You might consider setting the points of the labels relative to the buttons rather than the container...

label1:SetPoint( "BOTTOMLEFT", button[1], "TOPLEFT", 0, 5 );
label2:SetPoint( "BOTTOMRIGHT", button[7], "TOPRIGHT", 0, 5);

This would set the two labels so they align at the left and right ends of the button row just slightly above the buttons in that row.

You might also consider setting the vertical offset to height/3 instead of height/4 since you only have two rows... that would position each row's vertical center right along the top third and bottom third.

[todd0168]

Wow, thanks a whole heaping bunch for this add-on. I absotively love it. Now I can clear out all those icons on my bars for more useful things like taunt emotes and the like. lol

[spiel2001]

Try this as a starting point maybe...

plugin.sizeChanged = function( scale, height, width )

    local options    = plugin.options;
    local numButtons = 7;
    plugin.scale     = scale;

    -- Grab addon information and unlock frame for movement
    local MagePortsFrame   = plugin.MagePorts;
    nUI_Movers:lockFrame( MagePortsFrame, false, nil );
    
    -- Resize and Reposition according to scale and size of new container
    MagePortsFrame:SetWidth( width ); 
    MagePortsFrame:SetHeight( height ); 
    
    -- Center Buttons across the container
    local cellWidth = ( width / numButtons );
    local btnSize = cellWidth * 0.95;
    local btnGap = cellWidth * 0.05;
    local verticalOffset = width / 3; -- wow far up or down from center to put the button

    for i=1,numButtons do
        MagePorts.PortalButtons[i]:SetWidth( btnSize );
        MagePorts.PortalButtons[i]:SetHeight( btnSize );
        MagePorts.TeleportButtons[i]:SetWidth( btnSize );
        MagePorts.TeleportButtons[i]:SetHeight( btnSize );
    end

    if (numButtons % 2) == 1 then -- an odd number of buttons

        local center = math.ceil( numButtons/2 ); -- it might be math.ceiling()

        MagePorts.PortalButtons[center]:SetPoint( "CENTER", plugin.container, "CENTER", 0, verticalOffset );
        MagePorts.TeleportButtons[center]:SetPoint( "CENTER", plugin.container, "CENTER", 0, -verticalOffset );

        for i=1,math.floor( numButtons/2 ) do

            MagePorts.PortalButtons[center-i]:SetPoint( "RIGHT", MagePorts.PortalButtons[center-i+1], "LEFT", -btnGap, 0 );
            MagePorts.TeleportButtons[center-i]:SetPoint( "RIGHT", MagePorts.TeleportButtons[center-i+1], "LEFT", -btnGap, 0 );

            MagePorts.PortalButtons[center+i]:SetPoint( "LEFT", MagePorts.PortalButtons[center+i-1], "RIGHT", btnGap, 0 );
            MagePorts.TeleportButtons[center+i]:SetPoint( "LEFT", MagePorts.TeleportButtons[center+i-1], "RIGHT", btnGap, 0 );

        end

    else -- an even number of buttons

        local center = math.floor( numButtons / 2 );

        MagePorts.PortalButtons[center]:SetPoint( "RIGHT", plugin.container, "CENTER", -btnGap/2, verticalOffset );
        MagePorts.TeleportButtons[center]:SetPoint( "RIGHT", plugin.container, "CENTER", -btnGap/2, -verticalOffset );

        MagePorts.PortalButtons[center+1]:SetPoint( "LEFT", plugin.container, "CENTER", btnGap/2, verticalOffset );
        MagePorts.TeleportButtons[center+1]:SetPoint( "LEFT", plugin.container, "CENTER", btnGap/2, -verticalOffset );

        for i=1,center-1 do

            MagePorts.PortalButtons[center-i]:SetPoint( "RIGHT", MagePorts.PortalButtons[center-i+1], "LEFT", -btnGap, 0 );
            MagePorts.TeleportButtons[center-i]:SetPoint( "RIGHT", MagePorts.TeleportButtons[center-i+1], "LEFT", -btnGap, 0 );

            MagePorts.PortalButtons[center+i+1]:SetPoint( "LEFT", MagePorts.PortalButtons[center+i], "RIGHT", btnGap, 0 );
            MagePorts.TeleportButtons[center+i+1]:SetPoint( "LEFT", MagePorts.TeleportButtons[center+i], "RIGHT", btnGap, 0 );

        end
    end

    MagePortsFrame.PortalTitle:SetPoint( "BOTTOMLEFT", MagePorts.PortalButtons[1], "TOPLEFT", 0, 5 );
    MagePortsFrame.PortalCount:SetPoint( "BOTTOMRIGHT", MagePorts.PortalButtons[numButtons], "TOPRIGHT", 0, 5 );    

    MagePortsFrame.TeleportTitle:SetPoint( "BOTTOMLEFT", MagePorts.TeleportButtons[1], "TOPLEFT", 0, 5 );
    MagePortsFrame.TeleportCount:SetPoint( "BOTTOMRIGHT", MagePorts.TeleportButtons[numButtons], "TOPRIGHT", 0, 5 );    
    
    nUI_Movers:lockFrame( MagePortsFrame, true, nil );

end

[Xrystal]

Rofl .. pretty much the same as what I did

So it works at my resolution (1280x1024) now to try it with the lower setting. Erm not so pretty at 1024 x 768 but thats the 2nd image.

plugin.sizeChanged = function( scale, height, width )
	local options  = plugin.options;
	plugin.scale = scale;

	-- Grab addon information and unlock frame for movement
	local MagePortsFrame   = plugin.MagePorts;
	nUI_Movers:lockFrame( MagePortsFrame, false, nil );
	
	-- Resize and Reposition according to scale and size of new container
	MagePortsFrame:SetWidth( width ); 
	MagePortsFrame:SetHeight( height ); 
	
	-- Center Buttons across the container
	local cellCount = #MagePorts.PortalButtons;
    local cellWidth = ( width / cellCount );
    local btnSize = cellWidth * 0.95;
    local btnGap = cellWidth * 0.05;
    local verticalOffsetPortal = height / 5; -- how far up or down from center to put the button
    local verticalOffsetTeleport = height / 4;

    for i=1,cellCount do
        MagePorts.PortalButtons[i]:SetWidth( btnSize );
        MagePorts.PortalButtons[i]:SetHeight( btnSize );
        MagePorts.TeleportButtons[i]:SetWidth( btnSize );
        MagePorts.TeleportButtons[i]:SetHeight( btnSize );
    end
    
    local odd = ( cellCount % 2 ) == 1;
    local midwayLeft = nil;
    local midwayRight = nil;
    if ( odd ) then 
		midwayLeft = math.ceil( cellCount / 2 );
	else
		midwayLeft = math.floor( cellCount / 2 );
		midwayRight = midwayLeft + 1;
	end

	-- Reposition Portal Buttons and Fontstrings
	if ( not midwayRight ) then
		MagePorts.PortalButtons[midwayLeft]:SetPoint( "CENTER", plugin.container, "CENTER", btnGap/2, verticalOffsetPortal);
		MagePorts.TeleportButtons[midwayLeft]:SetPoint( "CENTER", plugin.container, "CENTER", btnGap/2, -verticalOffsetTeleport);
	else
	    MagePorts.PortalButtons[midwayLeft]:SetPoint( "RIGHT", plugin.container, "CENTER", -btnGap/2, verticalOffsetPortal );
		MagePorts.PortalButtons[midwayRight]:SetPoint( "LEFT", plugin.container, "CENTER", btnGap/2, verticalOffsetPortal );
	    MagePorts.TeleportButtons[midwayLeft]:SetPoint( "RIGHT", plugin.container, "CENTER", -btnGap/2, -verticalOffsetTeleport );
		MagePorts.TeleportButtons[midwayRight]:SetPoint( "LEFT", plugin.container, "CENTER", btnGap/2, -verticalOffsetTeleport );
	end
	for i = 1, midwayLeft - 1 do	
		MagePorts.PortalButtons[i]:SetPoint( "RIGHT", MagePorts.PortalButtons[i+1], "LEFT", -btnGap, 0 );
		MagePorts.TeleportButtons[i]:SetPoint( "RIGHT", MagePorts.TeleportButtons[i+1], "LEFT", -btnGap, 0 );
	end
	for i = midwayLeft + 1, cellCount do	
		MagePorts.PortalButtons[i]:SetPoint( "LEFT", MagePorts.PortalButtons[i-1], "RIGHT", btnGap, 0 );
		MagePorts.TeleportButtons[i]:SetPoint( "LEFT", MagePorts.TeleportButtons[i-1], "RIGHT", btnGap, 0 );
	end
	MagePortsFrame.PortalTitle:SetPoint( "BOTTOMLEFT", MagePorts.PortalButtons[1], "TOPLEFT", -btnGap, 0);
	MagePortsFrame.PortalCount:SetPoint( "BOTTOMRIGHT", MagePorts.PortalButtons[cellCount], "TOPRIGHT", -btnGap, 0);	
	MagePortsFrame.TeleportTitle:SetPoint( "BOTTOMLEFT", MagePorts.TeleportButtons[1], "TOPLEFT", -btnGap, 0);
	MagePortsFrame.TeleportCount:SetPoint( "BOTTOMRIGHT", MagePorts.TeleportButtons[cellCount], "TOPRIGHT", -btnGap, 0);	
	
	-- Lock addon frame for movement
	nUI_Movers:lockFrame( MagePortsFrame, true, nil );
end

[spiel2001]

You might want to consider changing the button sizes some -- smaller button size and wider gap... it might look better.

local btnSize = cellSize * 0.8;
local btnGap = cellSize * 0.1;

or something. Smaller buttons with more white space between them might have a better visual appeal.

Otherwise it's looking good. I may well end up incorporating this directly into the default distribution at some point... seems like a great solution for mages and as Todd points out, frees up a lot of action bar space for mages.

[Xrystal]

Rofl, tell me about it. That was the main reason I started using Bartender was for the extra bar options And even with using Cryolysis for buff options to free up even more space I still have almost every button filled with one thing or another.

And that would be cool to integrate it at a later date. I've tried to write the addon so that I can easily grab out the non nUI stuff for those that want it without using nUI in preference to others out there that are more visually appealing

Edit: Well finally have a few slash commands situated to adjust the cooldown counter size, alpha levels of the buttons and auto update interval and the values are stored in saved variables across the account so once one is set up you're fine the rest of the way.

And after incorporating those last suggested changes the final screenshot is as follows :

[spiritwulf]

Very nice work Xrystal. I wolnt be using it but very nice all the same.
Autobar takes care of all my extra button needs. Has sections for portals on my mage etc. Got it setup as a collapsing sidebar on the rightside of the screen.

[spiel2001]

Xyrstal -- that looks absolutely awesome.... great job and thanks for having taken it on.

[Dramber]

Very nice indeed!
*Downloads shiny new addon*

[Xrystal]

Originally Posted by spiel2001 Xyrstal -- that looks absolutely awesome.... great job and thanks for having taken it on.

Aww .. *blush* .. twas nothing. Got to learn about secure buttons so it was real cool.