Merge pull request #239 from codeitcodes/patch-1

Author: benhatsor

bottomfloat.js

@@ -120,19 +120,17 @@ if (isMobile) {
   // update on screen resize
 
   bottomWrapper.style.setProperty('--window-height', window.innerHeight + 'px');
-
-  bottomWrapper.lastHeight = 0;
-
-  window.addEventListener('resize', () => {
-
-    if (bottomWrapper.lastHeight === window.innerHeight) {
-      return;
-    }
-
-    bottomWrapper.lastHeight = window.innerHeight;
+  
+  const landscape = window.matchMedia('(orientation: landscape)');
+  
+  landscape.addEventListener('change', () => {
 
     bottomWrapper.style.setProperty('--window-height', window.innerHeight + 'px');
-
+    
+    window.setTimeout(() => {  
+      bottomWrapper.style.setProperty('--window-height', window.innerHeight + 'px');
+    }, 50);
+    
   });
 
 }

filebrowser.js

@@ -2431,7 +2431,33 @@ function createNewFileInHTML() {
         // change selected file
         changeSelectedFile(treeLoc.join(), tempSHA, fileName, encodeUnicode('\r\n'), getFileLang(fileName),
                            [0, 0], [0, 0], true);
-            
+        
+        // close file view if open
+        if (liveView.classList.contains('file-open')) {
+
+          liveView.classList.add('notransition');
+          liveView.classList.remove('file-open');
+
+          onNextFrame(() => {
+
+            liveView.classList.remove('notransition');
+
+          });
+
+          // if on mobile device
+          if (isMobile) {
+
+            // update bottom float
+            bottomFloat.classList.remove('file-open');
+
+          } else {
+
+            liveToggle.classList.remove('file-open');
+
+          }
+
+        }
+        
         // if on mobile device
         if (isMobile) {
 
@@ -2797,17 +2823,26 @@ function toggleSidebar(open) {
 }
 
 
-function deleteModFileInHTML(fileEl) {
+async function deleteModFileInHTML(fileEl) {
 
   const fileSha = getAttr(fileEl, 'sha');
 
   deleteModFile(fileSha);
 
+  
   fileEl.classList.remove('modified');
 
   if (fileEl.classList.contains('selected')) {
 
-    loadFileInHTML(fileEl, fileSha);
+    const scrollPos = selectedFile.scrollPos;
+
+    await loadFileInHTML(fileEl, fileSha);
+
+    // prevent bottom float disappearing on mobile
+    if (isMobile) lastScrollTop = scrollPos[1];
+
+    // scroll to pos in code
+    cd.scrollTo(scrollPos[0], scrollPos[1]);
 
   }
 
@@ -3069,18 +3104,10 @@ function setupEditor() {
 
   // update on screen resize
 
-  let lastWidth;
-
-  window.addEventListener('resize', () => {
-
-    if (lastWidth === window.innerWidth) {
-      return;
-    }
-
-    lastWidth = window.innerWidth;
-
-    updateLineNumbersHTML();
-
+  const landscape = window.matchMedia('(orientation: landscape)');
+  
+  landscape.addEventListener('change', () => {
+    onNextFrame(updateLineNumbersHTML);
   });
 
 
@@ -3155,6 +3182,7 @@ function setupEditor() {
           // get selection language
           let selLang = Prism.util.getLanguage(cursorEl);
           if (selLang == 'javascript') selLang = 'js';
+          if (selLang == 'json') selLang = 'js';
           if (selLang == 'markup') selLang = 'html';
 
           // find syntax for language
@@ -3165,7 +3193,14 @@ function setupEditor() {
 
             // beautify
             beautifierOptions.indent_char = cd.options.tab[0];
-            const beautifiedText = beautifyLang(selText, beautifierOptions);
+            let beautifiedText = beautifyLang(selText, beautifierOptions);
+
+            // prevent deleting ending newline when beautifying
+            if (selText.endsWith('\n') && !beautifiedText.endsWith('\n')) {
+
+              beautifiedText += '\n';
+
+            }
 
             // compare current code with new code
             // if the code is different, swap it

full.css

@@ -1283,7 +1283,7 @@ body:not(.mobile) .sidebar .header .title .branch-icon:active {
   text-overflow: clip;
   background: hsl(220deg 86% 64% / 9%);
   box-shadow: 0 0 0 2px hsl(223deg 85% 66% / 70%);
-  transition: .18s .04s var(--ease-function);
+  transition: .18s var(--ease-function);
   transition-property: background, box-shadow;
 }
 

lib/codeit.js

@@ -1,7 +1,7 @@
 /*
 
    codeit.js
-   v3.1.1
+   v3.1.2
    MIT License
 
    https://codeit.codes
@@ -582,33 +582,72 @@ class CodeitElement extends HTMLElement {
         event.preventDefault();
 
         if (event.shiftKey) {
-
-          const before = cd.beforeCursor();
-
-          // get padding of line
-          let [padding, start] = getPadding(before);
-
-          // get caret pos in text
-          let pos = cd.getSelection();
-
-          if (padding.length > 0) {
-
-            const tabLength = cd.options.tab.length;
-
-            // remove full length tab
-
-            cd.setSelection(start + tabLength);
-
-            for (let i = 0; i < tabLength; i++) cd.deleteCurrentSelection();
-
-            pos.start -= tabLength;
-            pos.end -= tabLength;
-
+          
+          // get current selection
+          const s = window.getSelection();
+          
+          let selContents = s.toString();
+          
+          // if selection exists
+          if (!s.isCollapsed) {
+            
+            let lines = selContents.split('\n');
+            
+            // run on all lines
+            lines.forEach((line, index) => {
+              
+              // if line contains a tab
+              if (line.startsWith(cd.options.tab)) {
+                
+                // remove tab from line
+                lines[index] = line.slice(cd.options.tab.length);
+                
+              }
+              
+            });
+            
+            // join lines
+            selContents = lines.join('\n');
+            
+            
+            // delete selection
+            cd.deleteCurrentSelection();
+              
+            // insert un-tabbed selection
+            cd.insert(selContents, { moveToEnd: false });
+              
+            // get caret pos in text
+            const pos = cd.getSelection();
+              
             // restore pos in text
-            cd.setSelection(pos.start, pos.end);
-
+            cd.setSelection(pos.start, (pos.start + selContents.length));
+            
+          } else {
+            
+            let lastLine = cd.beforeCursor().split('\n');
+            lastLine = lastLine[lastLine.length-1];
+            
+            // if current line contains a tab
+            if (lastLine.startsWith(cd.options.tab)) {
+              
+              // remove tab from line
+              
+              // get caret pos in text
+              const pos = cd.getSelection();
+              
+              // select the tab
+              cd.setSelection((pos.start - lastLine.length), (pos.start - lastLine.length + cd.options.tab.length));
+              
+              // delete selection
+              cd.deleteCurrentSelection();
+              
+              // restore pos in text
+              cd.setSelection(pos.start - cd.options.tab.length);
+              
+            }
+            
           }
-
+  
         } else {
 
           // get current selection
@@ -621,29 +660,38 @@ class CodeitElement extends HTMLElement {
 
             if (selContents.includes('\n')) {
 
-              // tab lines in selection
+              // add tabs to selection string
               selContents = cd.options.tab + selContents.split('\n').join('\n' + cd.options.tab);
 
-              // insert tabbed selection
+              // delete selection
               cd.deleteCurrentSelection();
-              cd.insert(selContents);
+              
+              // insert tabbed selection
+              cd.insert(selContents, { moveToEnd: false });
+              
+              // get caret pos in text
+              const pos = cd.getSelection();
+              
+              // restore pos in text
+              cd.setSelection(pos.start, (pos.start + selContents.length));
 
             } else {
 
               // tab selection
-              const sel = cd.getSelection();
 
-              cd.setSelection(Math.min(sel.start, sel.end));
+              // get caret pos in text
+              const pos = cd.getSelection();
 
-              // insert tab at start of selection
-              cd.insert(cd.options.tab);
+              const start = Math.min(pos.start, pos.end);
+              const end = Math.max(pos.start, pos.end);
 
-              // reselect text
+              cd.setSelection(start);
 
-              sel.start += cd.options.tab.length;
-              sel.end += cd.options.tab.length;
+              // insert tab at start of selection
+              cd.insert(cd.options.tab, { moveToEnd: false });
 
-              cd.setSelection(sel.start, sel.end);
+              // restore pos in text
+              cd.setSelection(start, end + cd.options.tab.length);
 
             }
 

lib/plugins/codeit-autocomplete.js

@@ -31,6 +31,7 @@ CSSProps.push('flex');
 CSSProps.push('grid');
 CSSProps.push('gap');
 CSSProps.push('background');
+CSSProps.push('overflow');
 CSSProps.push('-webkit-user-select');
 
 const maxChar = 0;//4;

utils.js

@@ -311,9 +311,9 @@ if (isEmbed) {
 
 }
 
-window.addEventListener('resize', () => {
-
-  isLandscape = window.matchMedia('(orientation: landscape)').matches;
+window.matchMedia('(orientation: landscape)').addEventListener('change', (e) => {
+  
+  isLandscape = e.matches;
 
 });
 

worker/client-channel.js

@@ -4,7 +4,7 @@
 
 
 // update worker name when updating worker
-const WORKER_NAME = 'codeit-worker-v607';
+const WORKER_NAME = 'codeit-worker-v612';
 
 
 // internal paths