function temp() {   
        var imggg = [];
        $.when(
              $.ajax({
                  async: false,
                  type: "POST",
                  url: "/HomeInner/getAllImages",
                  datatype: "json",
                  success: function (data) {
                      imggg = data.split("|");


                  }
              })
            ).done(function () {


            });

        var index = 0;
        $scope.alldocument = [];
       
        //here problem is that when i=0   we loading first image  and for that image loading  some time required here and  in between that time i becomes 1 (ie. i==1) and next processing start

        //OUR AIM IS THAT WE HAVE TO WAIT SYSTEM TO PROCESS ALL FIRST IMAGE FUNCTIONALITY AND THEN GO FOR SECOND IMAGE

        for (var i = 0; i < imggg.length; i++) {        
            //here having some fun
            var img = new Image();
        
            img.onload = function () {
                var b_canvas1 = document.getElementById("printcanvas");
                var canvasContext = b_canvas1.getContext("2d");
                canvasContext.clearRect(0, 0, b_canvas1.width, b_canvas1.height);

                canvasContext.drawImage(img, 0, 0, img.width * 0.65, img.height * 0.65);

                //here also we having lot of functionality of having 1000 line of code and after that

                var img1=new Image();
                img1.onload=function(){
                  //here we made images from canvas
                    $("#print_images").append("<img src='" + img1.src + "'  width='713' height='434'/>");
                }

                img1.src=b_canvas1.toDataUrl();
            }

            img.src = imggg[i];
        }
   

    }