Fixes to highlighter behavior

This commit is contained in:
MrOtherGuy 2020-09-03 12:06:45 +03:00
parent 83a9a5da77
commit ecd9010083

View file

@ -231,13 +231,19 @@ function createCategories(){
const Highlighter = new(function(){ const Highlighter = new(function(){
let state = 0; const state = new (function(){
let current = 0;
let previous = 0;
this.now = ()=>current;
this.previous = ()=>previous;
this.set = function(a){ previous = current; current = a; return}
})();
let pointer = 0; let pointer = 0;
let token = ""; let token = "";
function createToken(type){ function createToken(type,c){
let n = document.createElement("span"); let n = document.createElement("span");
n.textContent = token; n.textContent = c || token;
n.className = (`token ${type}`); n.className = (`token ${type}`);
token = ""; token = "";
return n return n
@ -248,27 +254,37 @@ const Highlighter = new(function(){
node.removeChild(e) node.removeChild(e)
} }
let c; let c;
let curly = false;
while(pointer < text.length){ while(pointer < text.length){
c = text[pointer]; c = text[pointer];
const currentState = state.now();
curly = currentState != 2 && (c === "{" || c === "}");
if(!curly){
token+=c; token+=c;
switch(state){ }
switch(currentState){
case 0: case 0:
switch(c){ switch(c){
case "/": case "/":
if(text[pointer+1] === "*"){ if(text[pointer+1] === "*"){
state = 2; state.set(2);
if(token.length > 1){
token = token.slice(0,-1);
node.appendChild(createToken("selector"));
token += "/"
}
} }
break; break;
case "{": case "{":
state = 3; state.set(3);
node.appendChild(createToken("selector")); node.appendChild(createToken("selector"));
break; break;
case "}":
node.appendChild(createToken("text"));
break;
case "@": case "@":
state = 5; state.set(5);
break
default:
false
} }
break; break;
@ -279,50 +295,44 @@ const Highlighter = new(function(){
if(text[pointer+1] === "/"){ if(text[pointer+1] === "/"){
token += "/"; token += "/";
pointer++; pointer++;
state = 0; state.set(state.previous());
node.appendChild(createToken("comment")); node.appendChild(createToken("comment"));
} }
break;
default:
false
} }
break; break;
case 3: case 3:
switch(c){ switch(c){
case "/":
if(text[pointer+1] === "*"){
state.set(2);
}
break;
case ":": case ":":
node.appendChild(createToken("property")); node.appendChild(createToken("property"));
state = 4; state.set(4);
break; break;
case "}": case "}":
node.appendChild(createToken("text")); node.appendChild(createToken("text"));
state = 0; state.set(0);
break;
default:
false
} }
break; break;
case 4: case 4:
switch(c){ switch(c){
case ";": case ";":
node.appendChild(createToken("value")); node.appendChild(createToken("value"));
state = 3; state.set(3);
break; break;
case "}": case "}":
node.appendChild(createToken("value")); node.appendChild(createToken("value"));
state = 0; state.set(0);
break;
default:
false
} }
break; break;
case 5: case 5:
switch(c){ switch(c){
case " ": case " ":
node.appendChild(createToken("atrule")); node.appendChild(createToken("atrule"));
state = 6; state.set(6);
default:
false
} }
break; break;
case 6: case 6:
@ -330,23 +340,21 @@ const Highlighter = new(function(){
case ";": case ";":
case "{": case "{":
node.appendChild(createToken("atvalue")); node.appendChild(createToken("atvalue"));
state = 0; state.set(0);
break;
default:
false
} }
break break
default: default:
false false
} }
curly && node.appendChild(createToken("curly",c));
pointer++ pointer++
} }
node.appendChild(createToken("text")); node.appendChild(createToken("text"));
token = ""; token = "";
state = 0; state.set(0);
pointer = 0; pointer = 0;
return return