Merged
Merge Request #830 · created by Ayush Jain


Text horizontal issue


From textHorizontalIssue into Develop-IPAD-MAC

Merged by Nikita Kulshreshtha

3 participants

400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
... ... @@ -2943,15 +2943,18 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
2943 2943 }
2944 2944 $rootScope.iniiaTextAreaValues = [];
2945 2945 $rootScope.initTextAreaValues = [];
  2946 + $rootScope.textWidth = [];
  2947 + $rootScope.duplicatetextWidth = [];
  2948 + $rootScope.resieTextArray = [];
  2949 + $rootScope.duplicateResizeTextArray = [];
  2950 + $rootScope.aaaa = 0;
  2951 + $rootScope.aaaa1 = 0;
2946 2952 ///-----
2947 2953 $rootScope.saveText = function () {
2948 2954  
2949 2955 document.getElementById('modelbackground').style.display = "none";
2950 2956 $rootScope.selectedBGColorForTextArea = $("#drawTextBGColorpicker span.minicolors-swatch-color").css('background-color');
2951 2957  
2952   -
2953   -
2954   -
2955 2958 // this part will work first time when save button will be clicked
2956 2959 if ($rootScope.IsTextAlreadySave == false) {
2957 2960  
... ... @@ -2965,8 +2968,6 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
2965 2968 }
2966 2969 }
2967 2970  
2968   -
2969   -
2970 2971 // getting textarea style properties
2971 2972 $rootScope.fontSizes = $("#text_area").css("font-size");
2972 2973 $rootScope.fontWeight = $("#text_area").css("font-weight");
... ... @@ -2977,7 +2978,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
2977 2978 $rootScope.underlineText = $("#text_area").css("text-decoration");
2978 2979 $rootScope.textArea = $("#text_area").val();
2979 2980  
2980   -
  2981 +
2981 2982 // code for horizonatl text going out
2982 2983 if (/\s/.test($rootScope.textArea)) {
2983 2984  
... ... @@ -2993,9 +2994,21 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
2993 2994 for (var i = 0; i <= text.length - 1; i++) {
2994 2995 if (contentWidthArray.length > 0) {
2995 2996 if (parseInt(contentWidthArray[0]) < $("#atTextDiv").width()) {
  2997 +
2996 2998 $("#duptextspan").append(text[i]);
2997 2999 $("#textspan").append(text[i]);
2998 3000 contentWidthArray = [];
  3001 + if ($rootScope.textWidth.length > 0) {
  3002 + $rootScope.aaaa1 = $("#textspan").width();
  3003 + $rootScope.aaaa1 = $rootScope.aaaa1 - $rootScope.aaaa;
  3004 + $rootScope.aaaa = $rootScope.aaaa + $rootScope.aaaa1;
  3005 + $rootScope.textWidth.push({ "id": "", "width": $rootScope.aaaa1, "character": text[i] });
  3006 + }
  3007 + else
  3008 + {
  3009 + $rootScope.textWidth.push({ "id": "", "width": $("#textspan").width(), "character": text[i] });
  3010 + }
  3011 +
2999 3012 contentWidthArray.push(Math.ceil($("#textspan").width()));
3000 3013 }
3001 3014 else {
... ... @@ -3005,6 +3018,10 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3005 3018 $("#duptextspan").append(text[i]);
3006 3019 $("#textspan").text('');
3007 3020 $("#textspan").append(text[i]);
  3021 + $rootScope.aaaa = 0;
  3022 + $rootScope.aaaa1 = 0;
  3023 + $rootScope.aaaa = $("#textspan").width();
  3024 + $rootScope.textWidth.push({ "id": "", "width": $("#textspan").width(), "character": text[i] });
3008 3025 contentWidthArray.push(Math.ceil($("#textspan").width()));
3009 3026  
3010 3027 }
... ... @@ -3013,9 +3030,12 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3013 3030 $("#duptextspan").text(text[i]);
3014 3031 $("#textspan").text(text[i]);
3015 3032 contentWidthArray = [];
  3033 + $rootScope.textWidth.push({ "id": "", "width": $("#textspan").width(), "character": text[i] });
  3034 + $rootScope.aaaa = $("#textspan").width();
3016 3035 contentWidthArray.push(Math.ceil($("#textspan").width()));
3017 3036 }
3018 3037 }
  3038 + console.log($rootScope.textWidth);
3019 3039 $rootScope.textArea = $("#duptextspan").text();
3020 3040 console.log($rootScope.textArea);
3021 3041 }
... ... @@ -3054,6 +3074,12 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3054 3074 $rootScope.initialTextAreaName = layer.name;
3055 3075 $rootScope.jcanvasObjectArray.push({ "name": layer.name, "x": layer.x, "y": layer.y, "width": layer.width, "height": layer.height });
3056 3076 }
  3077 +
  3078 + for (var i = 0; i <= $rootScope.textWidth.length - 1; i++) {
  3079 + if ($rootScope.textWidth[i].id == "") {
  3080 + $rootScope.textWidth[i].id = layer.name;
  3081 + }
  3082 + }
3057 3083 },
3058 3084 dragstop: function (layer) {
3059 3085  
... ... @@ -3070,7 +3096,6 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3070 3096 },
3071 3097  
3072 3098 click: function (layer) {
3073   -
3074 3099 if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
3075 3100 //jcanvas property
3076 3101 layer.draggable = true;
... ... @@ -3291,12 +3316,15 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3291 3316 }
3292 3317 },
3293 3318 change: function (layer) {
3294   -
  3319 +
  3320 +
3295 3321 if ($rootScope.isTextAReaRectangleClicked == true) {
  3322 +
3296 3323 if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
3297 3324 console.log(layer.x + " " + layer.y);
3298 3325 console.log($rootScope.textXAxisAftrResize + " " + $rootScope.textYAxisAftrResize);
3299 3326 $rootScope.isTextAReaRectangleClicked = false;
  3327 +
3300 3328 for (var i = 0; i <= $rootScope.iniiaTextAreaValues.length-1; i++) {
3301 3329  
3302 3330 if ($rootScope.iniiaTextAreaValues[i].name == layer.name) {
... ... @@ -3313,6 +3341,40 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3313 3341 x: layer.x,
3314 3342 y: layer.y
3315 3343 });
  3344 +
  3345 + $("#textspan").empty();
  3346 + $("#duptextspan").empty();
  3347 + var textWidthCounter = 0;
  3348 + var textAftrResize;
  3349 + for (var i = 0; i <= $rootScope.resieTextArray.length - 1; i++) {
  3350 + if($rootScope.resieTextArray[i].layerName == CangedTextAreaName)
  3351 + {
  3352 + if (/(\r\n)/gm.test($rootScope.resieTextArray[i].Rect_Text) || /\s/.test($rootScope.resieTextArray[i].Rect_Text)) {
  3353 + textAftrResize = ($rootScope.resieTextArray[i].Rect_Text).replace(/(\r\n)/gm, "");
  3354 + for (var i = 0;i <= $rootScope.textWidth.length - 1; i++) {
  3355 + if ($rootScope.textWidth[i].id == layer.name) {
  3356 + textWidthCounter = textWidthCounter + $rootScope.textWidth[i].width;
  3357 + if (textWidthCounter < layer.width) {
  3358 + $("#duptextspan").append($rootScope.textWidth[i].character);
  3359 + $("#textspan").append($rootScope.textWidth[i].character);
  3360 + }
  3361 + else {
  3362 + $("#duptextspan").append("\r\n");
  3363 + $("#textspan").append("\r\n");
  3364 + $("#duptextspan").append($rootScope.textWidth[i].character);
  3365 + $("#textspan").text('');
  3366 + $("#textspan").append($rootScope.textWidth[i].character);
  3367 + textWidthCounter = 0;
  3368 + }
  3369 + }
  3370 + }
  3371 + textAftrResize = $("#duptextspan").text();
  3372 + $('#canvas').setLayer(CangedTextAreaName, {
  3373 + text: textAftrResize,
  3374 + });
  3375 + }
  3376 + }
  3377 + }
3316 3378 }
3317 3379 }
3318 3380  
... ... @@ -3354,17 +3416,11 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3354 3416 maxWidth: Math.abs($rootScope.rectDimension[$rootScope.rectDimension.length - 1].width),
3355 3417 maxHeight: Math.abs($rootScope.rectDimension[$rootScope.rectDimension.length - 1].height),
3356 3418 add: function (layer) {
3357   - // console.log(layer.x + " " + layer.y);
3358 3419 $rootScope.textXAxisAftrResize = layer.x;
3359 3420 $rootScope.textYAxisAftrResize = layer.y;
3360   -
3361   - //$rootScope.TextPropertyArray.push({ Text1: '', Align: '', FontColor: '', FontSize: '', FontStyle: '', FontFamily: '' });
3362 3421 $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 });
3363   - },
3364   - dblclick: function (layer) {
3365   -
  3422 + $rootScope.resieTextArray.push({ layerName: layer.name, Rect_Text: layer.text });
3366 3423 }
3367   -
3368 3424 });
3369 3425 $("#text_area").val('');
3370 3426 $("#text_area").css({ " font-family": "Arial", "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
... ... @@ -3438,6 +3494,16 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3438 3494 $("#duptextspan").append(text[i]);
3439 3495 $("#textspan").append(text[i]);
3440 3496 contentWidthArray = [];
  3497 + if ($rootScope.duplicatetextWidth.length > 0) {
  3498 + $rootScope.aaaa1 = $("#textspan").width();
  3499 + $rootScope.aaaa1 = $rootScope.aaaa1 - $rootScope.aaaa;
  3500 + $rootScope.aaaa = $rootScope.aaaa + $rootScope.aaaa1;
  3501 + $rootScope.duplicatetextWidth.push({ "id": "", "width": $rootScope.aaaa1, "character": text[i] });
  3502 + }
  3503 + else
  3504 + {
  3505 + $rootScope.duplicatetextWidth.push({ "id": "", "width": $("#textspan").width(), "character": text[i] });
  3506 + }
3441 3507 contentWidthArray.push(Math.ceil($("#textspan").width()));
3442 3508 }
3443 3509 else {
... ... @@ -3447,6 +3513,10 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3447 3513 $("#duptextspan").append(text[i]);
3448 3514 $("#textspan").text('');
3449 3515 $("#textspan").append(text[i]);
  3516 + $rootScope.aaaa = 0;
  3517 + $rootScope.aaaa1 = 0;
  3518 + $rootScope.aaaa = $("#textspan").width();
  3519 + $rootScope.duplicatetextWidth.push({ "id": "", "width": $("#textspan").width(), "character": text[i] });
3450 3520 contentWidthArray.push(Math.ceil($("#textspan").width()));
3451 3521  
3452 3522 }
... ... @@ -3455,9 +3525,12 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3455 3525 $("#duptextspan").text(text[i]);
3456 3526 $("#textspan").text(text[i]);
3457 3527 contentWidthArray = [];
  3528 + $rootScope.duplicatetextWidth.push({ "id": "", "width": $("#textspan").width(), "character": text[i] });
  3529 + $rootScope.aaaa = $("#textspan").width();
3458 3530 contentWidthArray.push(Math.ceil($("#textspan").width()));
3459 3531 }
3460 3532 }
  3533 + console.log($rootScope.duplicatetextWidth);
3461 3534 _modifiedText = $("#duptextspan").text();
3462 3535 console.log(_modifiedText);
3463 3536 }
... ... @@ -3466,12 +3539,11 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3466 3539  
3467 3540 $("#canvas").removeLayer($rootScope.layerNameArr).drawLayers();
3468 3541 $("#canvas").removeLayer($rootScope.rectTextArr).drawLayers();
3469   -
3470 3542 $rootScope.resetTextRectSave = $rootScope.ObjectIndexSave++;
3471 3543 $rootScope.resetTextSave = $rootScope.ObjectIndexSave++;
3472   -
  3544 +
3473 3545 // generating new text area
3474   - // $('#canvas')
  3546 +
3475 3547 // Draw rect as wide as the text
3476 3548 $('#canvas').drawRect({
3477 3549 name: 'TextAreaAfterEditRect_' + $rootScope.resetTextSave,
... ... @@ -3493,9 +3565,19 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3493 3565 var TextAreaLayerNameAftrSplit = TextAreaLayerName.split("_");
3494 3566 $rootScope.postFixLayerNumberAftrEdit = TextAreaLayerNameAftrSplit[1];
3495 3567 $rootScope.initTextAreaValues.push({ "name": layer.name, "width": layer.width, "height": layer.height });
  3568 +
  3569 + for (var i = 0; i <= $rootScope.duplicatetextWidth.length - 1; i++) {
  3570 + if ($rootScope.duplicatetextWidth[i].id == "") {
  3571 + $rootScope.duplicatetextWidth[i].id = layer.name;
  3572 + }
  3573 + }
  3574 +
  3575 +
3496 3576 if ($location.path() == "/module-item-view") {
3497 3577 $rootScope.jcanvasObjectArray.push({ "name": layer.name, "x": layer.x, "y": layer.y, "width": layer.width, "height": layer.height });
3498 3578 }
  3579 +
  3580 +
3499 3581 },
3500 3582 dragstop: function (layer) {
3501 3583  
... ... @@ -3573,7 +3655,6 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3573 3655  
3574 3656 //khushbu
3575 3657 var CurrentFontFamily = _modifiedFontFamily;
3576   - // alert(CurrentFontFamily);
3577 3658 // CurrentFontFamily = CurrentFontFamily.replace(/'/g, "");
3578 3659 var CurrentFontSize = parseInt(_modifiedFontSize);
3579 3660 $("#selected-font-family option[value=" + CurrentFontFamily + "]").prop('selected', true);
... ... @@ -3687,13 +3768,13 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3687 3768 }
3688 3769 },
3689 3770 change: function (layer) {
3690   -
  3771 +
3691 3772 if ($rootScope.isTextAReaRectangleClickedAftrEdit == true) {
3692 3773 if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
3693 3774 console.log(layer.x + " " + layer.y);
3694 3775 console.log($rootScope.textXAxisAftrResize + " " + $rootScope.textYAxisAftrResize);
3695 3776 $rootScope.isTextAReaRectangleClickedAftrEdit = false;
3696   -
  3777 +
3697 3778 for (var i = 0; i <= $rootScope.initTextAreaValues.length - 1; i++) {
3698 3779  
3699 3780 if ($rootScope.initTextAreaValues[i].name == layer.name) {
... ... @@ -3709,6 +3790,39 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3709 3790 x: layer.x,
3710 3791 y: layer.y
3711 3792 });
  3793 + $("#textspan").empty();
  3794 + $("#duptextspan").empty();
  3795 + var textWidthCounter = 0;
  3796 + var textAftrResize;
  3797 + for (var i = 0; i <= $rootScope.duplicateResizeTextArray.length - 1; i++) {
  3798 + if ($rootScope.duplicateResizeTextArray[i].layerName == CangedTextAreaName) {
  3799 + if (/(\r\n)/gm.test($rootScope.duplicateResizeTextArray[i].Rect_Text) || /\s/.test($rootScope.duplicateResizeTextArray[i].Rect_Text)) {
  3800 + textAftrResize = ($rootScope.duplicateResizeTextArray[i].Rect_Text).replace(/(\r\n)/gm, "");
  3801 + for (var i = 0; i <= $rootScope.duplicatetextWidth.length - 1; i++) {
  3802 + if ($rootScope.duplicatetextWidth[i].id == layer.name) {
  3803 + textWidthCounter = textWidthCounter + $rootScope.duplicatetextWidth[i].width;
  3804 + if (textWidthCounter < layer.width) {
  3805 + $("#duptextspan").append($rootScope.duplicatetextWidth[i].character);
  3806 + $("#textspan").append($rootScope.duplicatetextWidth[i].character);
  3807 + }
  3808 + else {
  3809 + $("#duptextspan").append("\r\n");
  3810 + $("#textspan").append("\r\n");
  3811 + $("#duptextspan").append($rootScope.duplicatetextWidth[i].character);
  3812 + $("#textspan").text('');
  3813 + $("#textspan").append($rootScope.duplicatetextWidth[i].character);
  3814 + textWidthCounter = 0;
  3815 + }
  3816 + }
  3817 + }
  3818 + textAftrResize = $("#duptextspan").text();
  3819 + $('#canvas').setLayer(CangedTextAreaName, {
  3820 + text: textAftrResize,
  3821 + });
  3822 + }
  3823 + }
  3824 + }
  3825 +
3712 3826 }
3713 3827 }
3714 3828  
... ... @@ -3757,6 +3871,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
3757 3871 // console.log(layer.x + " " + layer.y);
3758 3872 $rootScope.editTextXAxisAftrResize = layer.x;
3759 3873 $rootScope.editTextYAxisAftrResize = layer.y;
  3874 + $rootScope.duplicateResizeTextArray.push({ layerName: layer.name, Rect_Text: layer.text });
3760 3875 }
3761 3876 });
3762 3877  
... ...