Frame, Button

--[[
    createButton(
        x - أحداثي x للزر
        y - أحداثي y للزر
        w - عرض الزر
        h - أرتفاع الزر
        text - النص اللي يضهر داخله
        Color - لون مربع الزر
        textColor - لون النص
    )
]]
function createButton( x, y, w, h, text, Color, textColor )
    xOfset = 0;
    yOfset = 0;
    isVisableX = true;
    local MButton = {
        x = 0, y = 0,
        w = 80, h = 20,
        text = "Button",
        isVisable = isVisableX,
        textColor = tocolor( 236, 240, 241, 255 ),
        Color = tocolor( 231, 76, 60, 150 ),


        render = function ()
            if ( isVisableX == true ) then
                dxDrawRectangle( x + xOfset, y + yOfset, w, h, Color )
                dxDrawText( text, ( (x + xOfset) + (w/2) ) - (string.len(text)*3), ((y + yOfset) - 7) + (h/2)  )
            end
        end,

        setVisable = function ( visable )
            isVisableX = visable;
        end,

        setTextColor = function ( color )
            textColor = color;
        end,

        setTextColorRGBA = function ( r, g, b, a )
            textColor = tocolor( r, g, b, a )
        end,

        getText = function ( )
            return text;
        end,

        setText = function ( text2 )
            text = text2;
        end,

        setColor = function ( Color2 )
            Color = Color2;
        end,

        setColorRGBA = function ( r, g, b, a )
            Color = tocolor( r, g, b, a )
        end,

        setOfset = function ( ofx, ofy )
            xOfset = ofx;
            yOfset = ofy;
        end,

        setX = function (x2) x = x2 end,
        getX = function () return x; end,

        setY = function (y2) y = y2 end,
        getY = function () return y; end,

        setW = function (w2) w = w2 end,
        getW = function () return w; end,

        setH = function (h2) h = h2 end,
        getH = function () return h; end
    }
    local create = function ()
        MButton.x = x; MButton.y = y;
        MButton.w = w; MButton.h = h;
        MButton.text = text; MButton.Color = Color;
        MButton.textColor = textColor;
        return MButton;
    end

    return create()
end
--[[
    createFrame(
        x - أحداثي x للأطار
        y - أحداثي y للأطار
        w - عرض الأطار
        h - أرتفاع الأطار
        Title - عنوان الأطار
        Color - لون الأطار
        TitleBarColor - لون شريط العنوان
    )
]]
function createFrame( x, y, w, h, Title, Color, TitleBarColor )
    MFrame = {
        x = 0, y = 0,
        w = 400, h = 250,
        Title = "Frame",
        Color = tocolor( 120, 120, 120, 150 ),
        Color = tocolor( 120, 120, 120, 255 ),

        components = {

        },

        render = function ()
            dxDrawRectangle( x, y, w, h, Color, false)
            dxDrawRectangle( x, y, w, 15, TitleBarColor, false)
            dxDrawText( Title, x + 5, y )
            for k,v in pairs(MFrame.components) do
                v.render();
            end
        end,

        add = function ( comp )
            comp.setOfset(x, y)
            table.insert(MFrame.components, comp);
        end

    }

    function create()
        MFrame.x = x; MFrame.y = y;
        MFrame.w = w; MFrame.h = h;
        MFrame.Title = Title;
        MFrame.Color = Color; MFrame.TitleBarColor = TitleBarColor;
        return MFrame;
    end

    return create();
end


local Frame; -- نسوي متغير أساسي للأطار
local b1; -- ومتغير للزر

function renderer ( )
    Frame.render(); -- عرض الأطار
end

function init()
    ButtonColor = tocolor( 231, 76, 60, 255 ) -- نسوي متغير يعبر عن اللون
    textColor = tocolor( 236, 240, 241, 255 ) -- متغير ثاني يعبر عن لون الخط
    b1 = createButton( 10, 20, 80, 40, "Test Test", color, textColor ) -- أنشاء الزر

    FrameColor = tocolor( 231, 76, 60, 120 ) -- نسوي لون للأطار
    Frame = createFrame( 400, 400, 450, 250, "Frame", color, color ); -- أنشاء الأطار

    Frame.add(b1) -- أضافة الزر الى الأطار

    addEventHandler ( "onClientRender", root, renderer )
end

addEventHandler ( "onClientResourceStart", resourceRoot, init )