diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
index 7670961..5fdbb39 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -2941,7 +2941,8 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                 break;
         }
     }
-
+    $rootScope.iniiaTextAreaValues = [];
+    $rootScope.initTextAreaValues = [];
     ///-----
     $rootScope.saveText = function () {
 
@@ -2976,12 +2977,59 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
             $rootScope.underlineText = $("#text_area").css("text-decoration");
             $rootScope.textArea = $("#text_area").val();
 
+
+            // code for horizonatl text going out
+            if (/\s/.test($rootScope.textArea)) {
+               
+            }
+            else
+            {
+                var contentWidthArray = [];
+                var contentWidth = Math.abs($rootScope.rectDimension[$rootScope.rectDimension.length - 1].width);
+                $("#atTextDiv").css({ "width": contentWidth, "font-size": $rootScope.fontSizes});
+                var text = $rootScope.textArea;
+                $("#textspan").empty();
+                $("#duptextspan").empty();
+                for (var i = 0; i <= text.length - 1; i++) {
+                    if (contentWidthArray.length > 0) {
+                        if (parseInt(contentWidthArray[0]) < $("#atTextDiv").width()) {
+                            $("#duptextspan").append(text[i]);
+                            $("#textspan").append(text[i]);
+                            contentWidthArray = [];
+                            contentWidthArray.push(Math.ceil($("#textspan").width()));
+                        }
+                        else {
+                            contentWidthArray = [];
+                            $("#duptextspan").append("\r\n");
+                            $("#textspan").append("\r\n");
+                            $("#duptextspan").append(text[i]);
+                            $("#textspan").text('');
+                            $("#textspan").append(text[i]);
+                            contentWidthArray.push(Math.ceil($("#textspan").width()));
+
+                        }
+                    }
+                    else {
+                        $("#duptextspan").text(text[i]);
+                        $("#textspan").text(text[i]);
+                        contentWidthArray = [];
+                        contentWidthArray.push(Math.ceil($("#textspan").width()));
+                    }
+                }
+                $rootScope.textArea = $("#duptextspan").text();
+                console.log($rootScope.textArea);
+            }
+            // code for horizonatl text going out
+
+
+
+
             // deleting previous text area
             $("#canvas").removeLayer($rootScope.TextID).drawLayers();
             $("#canvas").removeLayer($rootScope.TextAreaRectID).drawLayers();
             // Text After Saving in Rectangle 
             $rootScope.resetTextRect = $rootScope.ObjectIndex++;
-
+           
             $('#canvas').drawRect({
                 name: 'TextArea1_' + $rootScope.resetTextRect,
                 layer: true,
@@ -3001,6 +3049,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                     var TextAreaLayerName = layer.name;
                     var TextAreaLayerNameAftrSplit = TextAreaLayerName.split("_");
                     $rootScope.postFixLayerNumber = TextAreaLayerNameAftrSplit[1];
+                    $rootScope.iniiaTextAreaValues.push({ "name": layer.name, "width": layer.width, "height": layer.height });
                     if ($location.path() == "/module-item-view") {
                         $rootScope.initialTextAreaName = layer.name;
                         $rootScope.jcanvasObjectArray.push({ "name": layer.name, "x": layer.x, "y": layer.y, "width": layer.width, "height": layer.height });
@@ -3058,7 +3107,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
 
                         var _rectLayerOnSave = layer.name;
                         var _rectLayerOnSaveSplit = _rectLayerOnSave.split("_");
-                        var TextAreaRectName = "TextAreaNew_";
+                        var TextAreaRectName = "TextAreaNew_";  
                         var TextAreaRectNameConcatenated = TextAreaRectName.concat(_rectLayerOnSaveSplit[1]);
 
                         $rootScope.layerNameArr = layer.name;
@@ -3071,6 +3120,9 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                             if ($rootScope.TextPropertyArray[i].layerName == TextAreaRectNameConcatenated) {
 
                                 var textArrVal = $rootScope.TextPropertyArray[i].Rect_Text;
+                              // this line of code replace the line breaks and convert into a single line.
+                                textArrVal = textArrVal.replace(/(\r\n)/gm, "");
+                              
                                 $("#text_area").val(textArrVal);
                                 var fontStyleProp = $rootScope.TextPropertyArray[i].FontStyle;
                                 var fontWeightProp = fontStyleProp.split(" ");
@@ -3245,13 +3297,27 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                             console.log(layer.x + " " + layer.y);
                             console.log($rootScope.textXAxisAftrResize + " " + $rootScope.textYAxisAftrResize);
                             $rootScope.isTextAReaRectangleClicked = false;
-                            //if ((layer.x > $rootScope.textXAxisAftrResize) && (layer.y > $rootScope.textYAxisAftrResize) || (layer.x == $rootScope.textXAxisAftrResize) && (layer.y > $rootScope.textYAxisAftrResize) || (layer.x > $rootScope.textXAxisAftrResize) && (layer.y == $rootScope.textYAxisAftrResize)) {
-                            var CangedTextAreaName = 'TextAreaNew_' + $rootScope.postFixLayerNumber;
-                            $('#canvas').setLayer(CangedTextAreaName, {
-                                x: layer.x,
-                                y: layer.y
-                            });
-                            //}
+                            for (var i = 0; i <= $rootScope.iniiaTextAreaValues.length-1; i++) {
+
+                                if ($rootScope.iniiaTextAreaValues[i].name == layer.name) {
+
+                                    if (($rootScope.iniiaTextAreaValues[i].width == layer.width) || ($rootScope.iniiaTextAreaValues[i].height == layer.height))
+                                    {
+                                    }
+                                    else
+                                    {
+                                        var textAreaName = layer.name;
+                                        var textAreaNameAftrSplit = textAreaName.split("_");
+                                        var CangedTextAreaName = 'TextAreaNew_' + textAreaNameAftrSplit[1];
+                                        $('#canvas').setLayer(CangedTextAreaName, {
+                                            x: layer.x,
+                                            y: layer.y
+                                        });
+                                    }
+                                }
+
+                            }
+
                             $rootScope.textXAxisAftrResize = layer.x;
                             $rootScope.textYAxisAftrResize = layer.y;
 
@@ -3294,7 +3360,11 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
 
                     //$rootScope.TextPropertyArray.push({ Text1: '', Align: '', FontColor: '', FontSize: '', FontStyle: '', FontFamily: '' });
                     $rootScope.TextPropertyArray.push({ layerName: layer.name, Rect_Text: layer.text, Align: layer.align, FontColor: layer.fillStyle, FontSize: layer.fontSize, FontStyle: layer.fontStyle, FontFamily: layer.fontFamily, TextDecoration: $rootScope.underlineText });
+                },
+                dblclick: function (layer) {
+                    
                 }
+
             });
             $("#text_area").val('');
             $("#text_area").css({ " font-family": "Arial", "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
@@ -3350,7 +3420,50 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
 
             // deleting previous textarea
 
+        
+            // code for horizonatl text going out
+            if (/\s/.test(_modifiedText)) {
+              
+            }
+            else {
+                var contentWidthArray = [];
+                var contentWidth = Math.abs($rootScope.rectDimension[$rootScope.rectDimension.length - 1].width);
+                $("#atTextDiv").css({ "width": contentWidth, "font-size": _modifiedFontSize });
+                var text = _modifiedText;
+                $("#textspan").empty();
+                $("#duptextspan").empty();
+                for (var i = 0; i <= text.length - 1; i++) {
+                    if (contentWidthArray.length > 0) {
+                        if (parseInt(contentWidthArray[0]) < $("#atTextDiv").width()) {
+                            $("#duptextspan").append(text[i]);
+                            $("#textspan").append(text[i]);
+                            contentWidthArray = [];
+                            contentWidthArray.push(Math.ceil($("#textspan").width()));
+                        }
+                        else {
+                            contentWidthArray = [];
+                            $("#duptextspan").append("\r\n");
+                            $("#textspan").append("\r\n");
+                            $("#duptextspan").append(text[i]);
+                            $("#textspan").text('');
+                            $("#textspan").append(text[i]);
+                            contentWidthArray.push(Math.ceil($("#textspan").width()));
+
+                        }
+                    }
+                    else {
+                        $("#duptextspan").text(text[i]);
+                        $("#textspan").text(text[i]);
+                        contentWidthArray = [];
+                        contentWidthArray.push(Math.ceil($("#textspan").width()));
+                    }
+                }
+                _modifiedText = $("#duptextspan").text();
+                console.log(_modifiedText);
+            }
+            // code for horizonatl text going out
 
+            
             $("#canvas").removeLayer($rootScope.layerNameArr).drawLayers();
             $("#canvas").removeLayer($rootScope.rectTextArr).drawLayers();
 
@@ -3379,6 +3492,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                     var TextAreaLayerName = layer.name;
                     var TextAreaLayerNameAftrSplit = TextAreaLayerName.split("_");
                     $rootScope.postFixLayerNumberAftrEdit = TextAreaLayerNameAftrSplit[1];
+                    $rootScope.initTextAreaValues.push({ "name": layer.name, "width": layer.width, "height": layer.height });
                     if ($location.path() == "/module-item-view") {
                         $rootScope.jcanvasObjectArray.push({ "name": layer.name, "x": layer.x, "y": layer.y, "width": layer.width, "height": layer.height });
                     }
@@ -3442,6 +3556,8 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                         $rootScope.rectTextArr = RectNameAfterEditResult;
 
                         $rootScope.rectDimension.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
+                        // this line of code replace the line breaks and convert into a single line.
+                        _modifiedText = _modifiedText.replace(/(\r\n)/gm, "");
                         $("#text_area").val(_modifiedText);
                         $("#text_area").css("font-size", _modifiedFontSize);
                         $("#text_area").css("font-weight", _modifiedFontWeight);
@@ -3555,7 +3671,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                                 fillStyle: '#fff',
                                 strokeStyle: '#c33',
                                 strokeWidth: 2,
-                                width: 10, height: 10,
+                                width: 5, height: 5,
                                 cornerRadius: 3,
                                 click: function () {
                                     $rootScope.isTextAReaRectangleClickedAftrEdit = true;
@@ -3571,20 +3687,34 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                     }
                 },
                 change: function (layer) {
-
+                 
                     if ($rootScope.isTextAReaRectangleClickedAftrEdit == true) {
                         if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
                             console.log(layer.x + " " + layer.y);
                             console.log($rootScope.textXAxisAftrResize + " " + $rootScope.textYAxisAftrResize);
                             $rootScope.isTextAReaRectangleClickedAftrEdit = false;
-                            //if ((layer.x > $rootScope.textXAxisAftrResize) && (layer.y > $rootScope.textYAxisAftrResize) || (layer.x == $rootScope.textXAxisAftrResize) && (layer.y > $rootScope.textYAxisAftrResize) || (layer.x > $rootScope.textXAxisAftrResize) && (layer.y == $rootScope.textYAxisAftrResize)) {
-                            var CangedTextAreaName = 'TextAreaAfterEdit_' + $rootScope.postFixLayerNumberAftrEdit;
-                            $('#canvas').setLayer(CangedTextAreaName, {
-                                x: layer.x,
-                                y: layer.y
-                            });
-
-                            //}
+
+                            for (var i = 0; i <= $rootScope.initTextAreaValues.length - 1; i++) {
+
+                                if ($rootScope.initTextAreaValues[i].name == layer.name) {
+
+                                    if (($rootScope.initTextAreaValues[i].width == layer.width) || ($rootScope.initTextAreaValues[i].height == layer.height)) {
+
+                                    }
+                                    else {
+                                        var textAreaName = layer.name;
+                                        var textAreaNameAftrSplit = textAreaName.split("_");
+                                        var CangedTextAreaName = 'TextAreaAfterEdit_' + textAreaNameAftrSplit[1];
+                                        $('#canvas').setLayer(CangedTextAreaName, {
+                                            x: layer.x,
+                                            y: layer.y
+                                        });
+                                    }
+                                }
+
+                            }
+
+                           
                             $rootScope.editTextXAxisAftrResize = layer.x;
                             $rootScope.editTextYAxisAftrResize = layer.y;
                             if ($location.path() == "/module-item-view") {
diff --git a/400-SOURCECODE/AIAHTML5.Web/index.html b/400-SOURCECODE/AIAHTML5.Web/index.html
index 79711bb..9fa3d2e 100644
--- a/400-SOURCECODE/AIAHTML5.Web/index.html
+++ b/400-SOURCECODE/AIAHTML5.Web/index.html
@@ -778,7 +778,15 @@
                             </div>
                         </div>
                         <textarea class="form-control" id="text_area" rows="3" style="font-family: 'Verdana, sans-serif';font-size:14px; font-weight: normal; font-style: normal; color: #000; text-align: left; text-decoration: none;"></textarea>
-                    </div>
+                   
+                      <!--code for horizonatl text going out-->
+                        <div id="atTextDiv" style="float:left;">
+                            <span id="duptextspan" style="float: left; display: none;"></span>
+                            <span id="textspan" style="display:none;"></span>
+                        </div>
+                      <!--code for horizonatl text going out-->
+                    
+                     </div>
                     <div class="modal-footer">
                         <!--<button type="button" class="btn btn-default" ng-click="closeModal()" data-dismiss="modal">Close</button>-->
                         <button type="button" class="btn btn-default" ng-click="closeModal()" id="closeEditText" data-dismiss="modal">Close</button>