Collage {{ 'SAMPLE' | translate }}

{{ 'COLLAGE_WITH_LOCAL_PICTURES' | translate }}

{{ 'ONE_PICTURE' | translate }}

{{:: 'CODE' | translate}}

        HTML: 

            <pip-collage class="collage "
                         pip-srcs="srcs_1"
                         pip-multiple="false">
            </pip-collage>

        JS: 

            $scope.srcs_1 = ['images/square.jpg'];

{{ 'TWO_PICTURES' | translate }}

{{ 'THREE_PICTURES' | translate }}

{{ 'FOUR_PICTURES' | translate }}

{{ 'FIVE_PICTURES' | translate }}

{{ 'SIX_PICTURES' | translate }}

{{ 'SEVEN_PICTURES' | translate }}

{{ 'EIGHT_PICTURES' | translate }}

{{ 'NINE_PICTURES_SINGLE_SEGMENT' | translate }}

{{ 'TEN_PICTURES_MULTIPLY_SEGMENT' | translate }}

{{:: 'CODE' | translate}}

        HTML: 

            <pip-collage class="collage "
                         pip-srcs="srcs_10"
                         pip-multiple="true">
            </pip-collage>

        JS: 

            $scope.srcs_10 = [
                'images/square.jpg', 'images/vertical.jpg', 'images/horizontal.jpg', 'images/nonexisting.jpg',
                'images/square.jpg', 'images/vertical.jpg', 'images/horizontal.jpg', 'images/nonexisting.jpg',
                'images/square.jpg', 'images/vertical.jpg'
            ];

{{ 'COLLAGE_WITH_PICTURES_FROM_SERVER' | translate }}

{{ 'ONE_PICTURE' | translate }}

{{:: 'CODE' | translate}}

        HTML: 

            <pip-collage class="collage "
                         pip-picture-ids="pids_1"
                         pip-multiple="false">
            </pip-collage>

        JS: 

            $scope.pids_1 = ['56790b4960958daa664fd8c2'];

{{ 'TWO_PICTURES' | translate }}

{{ 'THREE_PICTURES' | translate }}

{{ 'FOUR_PICTURES' | translate }}

{{ 'SEVEN_PICTURES' | translate }}

{{ 'EIGHTEEN_PICTURES' | translate }}

{{:: 'CODE' | translate}}

        HTML: 

            <pip-collage class="collage "
                         pip-picture-ids="pids_18"
                         pip-multiple="true">
            </pip-collage>

        JS: 

            $scope.pids_18 = [
                '56790b4960958daa664fd8c2',
                '56790b4960958daa664fd8c1',
                '56790b4960958daa664fd8c4',
                '56790b4960958daa664fd8c3',
                '56790b4960958daa664fd8c5',
                '56790b4960958daa664fd8c6',
                '56790b4c60958daa664fd8c7',
                '56790b4c60958daa664fd8c8',
                '56790b4e60958daa664fd8c9',
                '56790b4f60958daa664fd8ca',
                '56790b4f60958daa664fd8cb',
                '56790b4f60958daa664fd8cc',
                '56790b5060958daa664fd8cd',
                '56790b5160958daa664fd8ce',
                '56790b5160958daa664fd8cf',
                '56790b5260958daa664fd8d0',
                '567911f060958daa664fd8ff',
                '567911f060958daa664fd8fe'
            ];