#:kivy 1.4
# Layout of the primary application

<ViewPanel>:
    # Covers 1/4 of the area
    image_file: 'a5lib/uix/letter.png'
    
    canvas:
        Color:
            rgb: (0.8,0.8,0.8)
        Rectangle:
            size: (self.size[0]-2,self.size[1]-2)
            pos: (self.pos[0]+1,self.pos[1]+1)
        
        # Keep the translated image in bounds
        StencilPush
        Rectangle:
            size: (self.size[0]-2,self.size[1]-2)
            pos: (self.pos[0]+1,self.pos[1]+1)

        StencilUse
        Color:
            rgb: (1, 1, 1)
        Quad:
            source: self.image_file
            points: self.corners

        StencilUnUse
        Rectangle:
            size: (self.size[0]-2,self.size[1]-2)
            pos: (self.pos[0]+1,self.pos[1]+1)

        StencilPop
        
        # Draw some reference ticks
        Color:
            rgb: (1, 0, 1)
        Line:
            points: (self.pos[0],self.pos[1]+self.size[1]/2.0,self.pos[0]+self.size[0],self.pos[1]+self.size[1]/2.0)
        Line:
            points: (self.pos[0]+self.size[0]/2.0,self.pos[1],self.pos[0]+self.size[0]/2.0,self.pos[1]+self.size[1])
        Line:
            points: (self.pos[0]+self.size[0]*0.25,self.pos[1]+self.size[1]*0.48,self.pos[0]+self.size[0]*0.25,self.pos[1]+self.size[1]*0.52)
        Line:
            points: (self.pos[0]+self.size[0]*0.75,self.pos[1]+self.size[1]*0.48,self.pos[0]+self.size[0]*0.75,self.pos[1]+self.size[1]*0.52)
        Line:
            points: (self.pos[0]+self.size[0]*0.48,self.pos[1]+self.size[1]*0.25,self.pos[0]+self.size[0]*0.52,self.pos[1]+self.size[1]*0.25)
        Line:
            points: (self.pos[0]+self.size[0]*0.48,self.pos[1]+self.size[1]*0.75,self.pos[0]+self.size[0]*0.52,self.pos[1]+self.size[1]*0.75)

<StatPanel>:
    orientation: 'vertical'
    tl: tl_id
    tr: tr_id
    bl: bl_id
    br: br_id
    ma: ma_id
    mb: mb_id
    mc: mc_id
    md: md_id
    off: off_id

    canvas:
        Color:
            rgb: (0.8,0.8,0.8)
        Rectangle:
            size: (self.size[0]-2,self.size[1]-2)
            pos: (self.pos[0]+1,self.pos[1]+1)

    Widget:
        size_hint: (1,0.05)

    BoxLayout:
        orientation: 'horizontal'
        size_hint: (1,0.1)
        
        # Left spacer
        Widget:
            size_hint: (None,1)
            size: (40,0)

        Label:
            text: 'Top Left'
            color: (0,0,0,1)
            size_hint: (None,1)
            size: (119,0)
            halign: 'left'
            bold: True

        # Realignment spacer
        Widget:
            size_hint: (None,1)
            size: (41,0)

        Label:
            id: tl_id
            size_hint: (None,1)
            size: (100,0)
            halign: 'left'
            color: (0,0,0,1)
            text: ''

    BoxLayout:
        orientation: 'horizontal'
        size_hint: (1,0.1)

        # Left spacer
        Widget:
            size_hint: (None,1)
            size: (40,0)

        Label:
            text: 'Top Right'
            color: (0,0,0,1)
            size_hint: (None,1)
            size: (123,0)
            halign: 'left'
            bold: True

        # Realignment spacer
        Widget:
            size_hint: (None,1)
            size: (37,0)

        Label:
            id: tr_id
            size_hint: (None,1)
            size: (100,0)
            color: (0,0,0,1)
            text: ''

    BoxLayout:
        orientation: 'horizontal'
        size_hint: (1,0.1)

        # Left spacer
        Widget:
            size_hint: (None,1)
            size: (40,0)

        Label:
            text: 'Bottom Left'
            color: (0,0,0,1)
            size_hint: (None,1)
            size: (142,0)
            halign: 'left'
            bold: True

        # Realignment spacer
        Widget:
            size_hint: (None,1)
            size: (18,0)

        Label:
            id: bl_id
            size_hint: (None,1)
            size: (100,0)
            color: (0,0,0,1)
            text: ''

    BoxLayout:
        orientation: 'horizontal'
        size_hint: (1,0.1)

        # Left spacer
        Widget:
            size_hint: (None,1)
            size: (40,0)

        Label:
            text: 'Bottom Right'
            color: (0,0,0,1)
            size_hint: (None,1)
            size: (150,0)
            halign: 'left'
            bold: True
        
        # Realignment spacer
        Widget:
            size_hint: (None,1)
            size: (10,0)

        Label:
            id: br_id
            size_hint: (None,1)
            size: (100,0)
            color: (0,0,0,1)
            text: ''
    
        
    Widget:
        size_hint: (1,0.05)
        
        canvas:
            Color:
                rgb: (0,0,0,1)
            Line:
                points: (self.pos[0]+self.size[0]*0.2,self.pos[1]+self.size[1]/2,self.pos[0]+self.size[0]*0.8,self.pos[1]+self.size[1]/2)

    BoxLayout:
        orientation: 'horizontal'
        size_hint: (1,0.1)

        Label:
            text: 'Matrix'
            color: (0,0,0,1)
            size_hint: (0.5,1)
            halign: 'left'
            bold: True

        Label:
            text: 'Offset'
            color: (0,0,0,1)
            size_hint: (0.5,1)
            halign: 'left'
            bold: True

        
    BoxLayout:
        orientation: 'horizontal'
        size_hint: (1,0.35)

        GridLayout:
            size_hint: (0.5,1)
            cols: 5
            rows: 2
            
            canvas:
                Color:
                    rgb: (0,0,0,1)
                Line:
                    points: (self.pos[0]+self.size[0]*0.1,self.pos[1]+self.size[1]*0.1,self.pos[0]+self.size[0]*0.1,self.pos[1]+self.size[1]*0.9)
                Line:
                    points: (self.pos[0]+self.size[0]*0.9,self.pos[1]+self.size[1]*0.1,self.pos[0]+self.size[0]*0.9,self.pos[1]+self.size[1]*0.9)
                Line:
                    points: (self.pos[0]+self.size[0]*0.1,self.pos[1]+self.size[1]*0.1,self.pos[0]+self.size[0]*0.2,self.pos[1]+self.size[1]*0.1)
                Line:
                    points: (self.pos[0]+self.size[0]*0.8,self.pos[1]+self.size[1]*0.1,self.pos[0]+self.size[0]*0.9,self.pos[1]+self.size[1]*0.1)
                Line:
                    points: (self.pos[0]+self.size[0]*0.1,self.pos[1]+self.size[1]*0.9,self.pos[0]+self.size[0]*0.2,self.pos[1]+self.size[1]*0.9)
                Line:
                    points: (self.pos[0]+self.size[0]*0.8,self.pos[1]+self.size[1]*0.9,self.pos[0]+self.size[0]*0.9,self.pos[1]+self.size[1]*0.9)
                    
            
            Widget
            
            Label:
                id: ma_id
                color: (0,0,0,1)
                text: ''

            Widget

            Label:
                id: mb_id
                color: (0,0,0,1)
                text: ''

            Widget

            Widget

            Label:
                id: mc_id
                color: (0,0,0,1)
                text: ''

            Widget

            Label:
                id: md_id
                color: (0,0,0,1)
                text: ''
        
            Widget

        Label:
            id: off_id
            color: (0,0,0,1)
            size_hint: (0.5,1)
            text: ''
            
    
    Widget:
        size_hint: (1,0.05)


# Primary Application GUI
<MainPanel>:
    parapanel: param_id
    statpanel: stat_id
    origpanel: orig_id
    tranpanel: tran_id
    
    # Left side of GUI
    BoxLayout:
        orientation: 'vertical'
        size: (300,680)
        size_hint: (None,1)

        Label:
            text: 'Original'
            size: (300,40)
            bold: True
            size_hint: (None,None)
        
        # Original Image View
        ViewPanel:
            id: orig_id
            corners: [self.pos[0]+self.size[0]/4,self.pos[1]+self.size[1]/4,self.pos[0]+3*self.size[0]/4,self.pos[1]+self.size[1]/4,self.pos[0]+3*self.size[0]/4,self.pos[1]+3*self.size[1]/4,self.pos[0]+self.size[0]/4,self.pos[1]+3*self.size[1]/4]
            size: (300,300)
            size_hint: (None,None)
    
        Label:
            text: 'Transformed'
            size: (300,40)
            bold: True
            size_hint: (None,None)

        # Transformed Image View
        ViewPanel:
            id: tran_id
            size: (300,300)
            size_hint: (None,None)
    
    # Right side of GUI
    BoxLayout:
        orientation: 'vertical'
        size_hint: (None,None)
        size: (380,680)

        Label:
            text: 'Quad Coordinates'
            size: (380,40)
            bold: True
            size_hint: (None,None)
        
        StatPanel:
            id: stat_id
            size: (400,300)

        # Control Panel
        BoxLayout:
            orientation: 'horizontal'
            size_hint: (None,None)
            size: (380,40)

            Button:
                text: 'File'
                size_hint: (0.2,1)
                bold: True
                on_press: root.on_load_press()

            Button:
                text: 'Add'
                size_hint: (0.2,1)
                bold: True
                on_press: root.parapanel.add_tab()

            Button:
                text: 'Del'
                size_hint: (0.2,1)
                bold: True
                on_press: root.parapanel.del_tab()

            Button:
                text: 'Up'
                size_hint: (0.2,1)
                bold: True
                on_press: root.parapanel.shuffle_current_tab(True)
            
            Button:
                text: 'Down'
                size_hint: (0.2,1)
                bold: True
                on_press: root.parapanel.shuffle_current_tab(False)

        # Transform Parameters
        DynamicTabbedPanel:
            id: param_id
            size_hint: (None,None)
            size: (380,300)
            tab_pos: 'right_top'
            tab_width: 40