Skip to content
This repository has been archived by the owner on Mar 28, 2024. It is now read-only.

Commit

Permalink
fix(inline string bug): style lost when change cell to inline string,…
Browse files Browse the repository at this point in the history
… input error

fix
  • Loading branch information
tubiaoge committed Sep 27, 2020
1 parent 68e9b86 commit 405d90b
Show file tree
Hide file tree
Showing 3 changed files with 140 additions and 36 deletions.
101 changes: 94 additions & 7 deletions src/controllers/inlineString.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,10 @@ import {getFontStyleByCell, textTrim} from "../global/getdata";
import {selectTextContent,selectTextContentCross,selectTextContentCollapse} from '../global/cursorPos';
import locale from '../locale/locale';
import Store from '../store';
import { connect } from "net";

export const inlineStyleAffectAttribute = {"bl":1, "it":1 , "ff":1, "cl":1, "un":1,"fs":1,"fc":1};
export const inlineStyleAffectCssName = {"font-weight":1, "font-style":1 , "font-family":1, "text-decoration":1, "border-bottom":1,"font-size":1,"color":1};

export function isInlineStringCell(cell){
let isIs = cell && cell.ct!=null && cell.ct.t=="inlineStr" && cell.ct.s!=null && cell.ct.s.length>0;
Expand Down Expand Up @@ -68,10 +70,16 @@ export function updateInlineStringFormat(cell, attr, value, $input){
let endOffset = range.endOffset, startOffset = range.startOffset;

if($textEditor.length>0){
if(startContainer===endContainer){
let span = startContainer.parentNode, spanIndex;
if(startContainer===endContainer){
let span = startContainer.parentNode, spanIndex, inherit=false;

let content = span.innerHTML;

let fullContent = $textEditor.html();
if(fullContent.substr(0,5) != "<span"){
inherit = true;
}

let left="" , mid="" , right="";
let s1=0, s2=startOffset, s3 = endOffset, s4=content.length;
left = content.substring(s1, s2);
Expand All @@ -80,7 +88,14 @@ export function updateInlineStringFormat(cell, attr, value, $input){

let cont = "";
if(left!=""){
cont += "<span style='"+ span.style.cssText +"'>" + left + "</span>";
let cssText = span.style.cssText;
if(inherit){
let box = $(span).closest("#luckysheet-input-box").get(0);
if(box!=null){
cssText = extendCssText(box.style.cssText, cssText);
}
}
cont += "<span style='"+ cssText +"'>" + left + "</span>";
}

if(mid!=""){
Expand All @@ -94,12 +109,26 @@ export function updateInlineStringFormat(cell, attr, value, $input){
// cssText = removeClassWidthCss(cssText, attr);

let cssText = getCssText(span.style.cssText, attr, value);

if(inherit){
let box = $(span).closest("#luckysheet-input-box").get(0);
if(box!=null){
cssText = extendCssText(box.style.cssText, cssText);
}
}

cont += "<span style='"+ cssText +"'>" + mid + "</span>";
}

if(right!=""){
cont += "<span style='"+ span.style.cssText +"'>" + right + "</span>";
let cssText = span.style.cssText;
if(inherit){
let box = $(span).closest("#luckysheet-input-box").get(0);
if(box!=null){
cssText = extendCssText(box.style.cssText, cssText);
}
}
cont += "<span style='"+ cssText +"'>" + right + "</span>";
}

if(startContainer.parentNode.tagName=="SPAN"){
Expand All @@ -121,8 +150,8 @@ export function updateInlineStringFormat(cell, attr, value, $input){
}

selectTextContent($textEditor.find("span").get(seletedNodeIndex));
}
else{
}
else{
if(startContainer.parentNode.tagName=="SPAN" && endContainer.parentNode.tagName=="SPAN"){
let startSpan = startContainer.parentNode, startSpanIndex;
let endSpan = endContainer.parentNode, endSpanIndex;
Expand Down Expand Up @@ -195,7 +224,7 @@ export function updateInlineStringFormat(cell, attr, value, $input){

selectTextContentCross(spans.get(startSeletedNodeIndex), spans.get(endSeletedNodeIndex));
}
}
}
}
else if($functionbox.length>0){

Expand Down Expand Up @@ -526,6 +555,64 @@ function getCssText(cssText, attr, value){
return cssText;
}

function extendCssText(origin, cover, isLimit=true){
let originArray = origin.split(";");
let coverArray = cover.split(";");
let newCss = "";

let addKeyList = {};
for(let i=0;i<originArray.length;i++){
let so = originArray[i], isAdd=true;
so = so.toLowerCase();
let okey = textTrim(so.substr(0, so.indexOf(':')));
let ovalue = textTrim(so.substr(so.indexOf(':') + 1));

if(isLimit){
if(!(okey in inlineStyleAffectCssName)){
continue;
}
}

for(let a=0;a<coverArray.length;a++){
let sc = coverArray[a];
sc = sc.toLowerCase();
let ckey = textTrim(sc.substr(0, sc.indexOf(':')));
let cvalue = textTrim(sc.substr(sc.indexOf(':') + 1));

if(okey==ckey){
newCss += ckey + ":" + cvalue + ";";
isAdd = false;
continue;
}
}

if(isAdd){
newCss += okey + ":" + ovalue + ";";
}

addKeyList[okey] = 1;
}

for(let a=0;a<coverArray.length;a++){
let sc = coverArray[a];
sc = sc.toLowerCase();
let ckey = textTrim(sc.substr(0, sc.indexOf(':')));
let cvalue = textTrim(sc.substr(sc.indexOf(':') + 1));

if(isLimit){
if(!(ckey in inlineStyleAffectCssName)){
continue;
}
}

if(!(ckey in addKeyList)){
newCss += ckey + ":" + cvalue + ";";
}
}

return newCss;
}




Expand Down
8 changes: 5 additions & 3 deletions src/controllers/keyboard.js
Original file line number Diff line number Diff line change
Expand Up @@ -856,10 +856,10 @@ export function keyboardInitial(){
formulaMoveEvent("right", ctrlKey, shiftKey,event);
}
else if (!((kcode >= 112 && kcode <= 123) || kcode <= 46 || kcode == 144 || kcode == 108 || event.ctrlKey || event.altKey || (event.shiftKey && (kcode == 37 || kcode == 38 || kcode == 39 || kcode == 40 || kcode == keycode.WIN || kcode == keycode.WIN_R || kcode == keycode.MENU))) || kcode == 8 || kcode == 32 || kcode == 46 || (event.ctrlKey && kcode == 86)) {
if(event.target.id!="luckysheet-input-box" && event.target.id!="luckysheet-rich-text-editor"){
// if(event.target.id!="luckysheet-input-box" && event.target.id!="luckysheet-rich-text-editor"){
formula.functionInputHanddler($("#luckysheet-functionbox-cell"), $("#luckysheet-rich-text-editor"), kcode);
setCenterInputPosition(Store.luckysheetCellUpdate[0], Store.luckysheetCellUpdate[1], Store.flowdata);
}
// }

}
}).keyup(function (e) {
Expand All @@ -872,7 +872,9 @@ export function keyboardInitial(){

//输入框中文输入后 shift 和 空格 处理
if(parseInt($("#luckysheet-input-box").css("top")) > 0 && (kcode == 13 || kcode == 16 || kcode == 32)){
formula.functionInputHanddler($("#luckysheet-functionbox-cell"), $("#luckysheet-rich-text-editor"), kcode);
// if(event.target.id=="luckysheet-input-box" || event.target.id=="luckysheet-rich-text-editor"){
// formula.functionInputHanddler($("#luckysheet-functionbox-cell"), $("#luckysheet-rich-text-editor"), kcode);
// }
}

e.preventDefault();
Expand Down
67 changes: 41 additions & 26 deletions src/global/formula.js
Original file line number Diff line number Diff line change
Expand Up @@ -1220,11 +1220,12 @@ const luckysheetformula = {

let curv = Store.flowdata[r][c];
let isPrevInline = isInlineStringCell(curv);
let isCurInline = (inputText.slice(0, 1) != "=" && inputHtml.indexOf("span")>-1);
let isCurInline = (inputText.slice(0, 1) != "=" && inputHtml.substr(0,5) == "<span");
if(!value && !isCurInline && isPrevInline){
delete curv.ct.s;
curv.ct.t = "g";
curv.ct.fa = "General";
value = "";
}
else if(isCurInline){
if (getObjType(curv) != "object") {
Expand All @@ -1247,7 +1248,7 @@ const luckysheetformula = {
value = value || $input.text();

if(!isCurInline){
if(isRealNull(value)){
if(isRealNull(value) && !isPrevInline){
if(curv == null || (isRealNull(curv.v) && curv.spl == null)){
_this.cancelNormalSelected();
return;
Expand Down Expand Up @@ -3229,7 +3230,7 @@ const luckysheetformula = {

let _this = this;

let $functionbox = $to,
let $copy = $to,
$editer = $input;
let value1 = $editer.html(),
value1txt = $editer.text();
Expand Down Expand Up @@ -3265,39 +3266,53 @@ const luckysheetformula = {
_this.createRangeHightlight();
}

$functionbox.html(value);

$copy.html(value);
_this.rangestart = false;
_this.rangedrag_column_start = false;
_this.rangedrag_row_start = false;

_this.rangeHightlightselected($editer, kcode);

}
else if(value1txt.substr(0, 1) != "=" && (kcode != 229 || value.length == 1)){
else if(value1txt.substr(0, 1) != "=" ){
//&& value1.indexOf("span")>-1
// $editer.html(value1);
let w = window.getSelection();
if(w!=null && w.type!="None"){
let range = w.getRangeAt(0);
let c = range.startContainer;

if(c.id=="luckysheet-rich-text-editor" || $(c).closest("#luckysheet-rich-text-editor")){
$functionbox.html(value);
}
else if(c.id=="luckysheet-functionbox-cell" || $(c).closest("#luckysheet-functionbox-cell")){
if(value1.indexOf("span")>-1){
// let w = window.getSelection();
// if(w!=null && w.type!="None"){
// let range = w.getRangeAt(0);
// let c = range.startContainer;

}
else{
$editer.html(value);
}
}
// if(c.id=="luckysheet-rich-text-editor" || $(c).closest("#luckysheet-rich-text-editor")){
// $functionbox.html(value);
// }
// else if(c.id=="luckysheet-functionbox-cell" || $(c).closest("#luckysheet-functionbox-cell")){
// if(value1.indexOf("span")>-1){

// }
// else{
// $editer.html(value);
// }
// }

// }
// console.trace();
// console.log(value, $copy.attr("id"));

if($copy.attr("id")=="luckysheet-rich-text-editor"){
if($copy.html().substr(0,5) == "<span"){

}
else{
$copy.html(value);
}
}
else{
$copy.html(value);
}

}

_this.rangestart = false;
_this.rangedrag_column_start = false;
_this.rangedrag_row_start = false;

_this.rangeHightlightselected($editer, kcode);

}, 1);
},
functionHTMLGenerate: function(txt) {
Expand Down

0 comments on commit 405d90b

Please sign in to comment.