pleroma-fe

commit: af3b2e3dc9043e66806be85869d867e6b0d23c3c
parent 74e5bb9104551bfd8105ef6780c40502e9087adc
Author: Henry Jameson <me@hjkos.com>
Date:   Thu, 19 Sep 2024 20:37:14 +0300

temp

Diffstat:
M
src/services/theme_data/iss_deserializer.js
44
++++++++++++++++++++++++++++++++++++++++++--
M
src/services/theme_data/theme_data_3.service.js
30
++++++++++++++++++++++++++++--
A
test/unit/specs/services/theme_data/iss_deserializer.spec.js
47
+++++++++++++++++++++++++++++++++++++++++++++++

3 files changed, 117 insertions(+), 4 deletions(-)
diff --git a/src/services/theme_data/iss_deserializer.js b/src/services/theme_data/iss_deserializer.js
@@ -1,3 +1,43 @@
-export const deserializer (string) {
-let level = 0
+// this works nearly the same as HTML tree converter
+export const deserialize = (input) => {
+  const buffer = []
+  let textBuffer = ''
+
+  const getCurrentBuffer = () => {
+    let current = buffer[buffer.length - 1][1]
+    if (current == null) {
+      current = { name: null, content: [] }
+    }
+    buffer.push(current)
+    return current
+  }
+
+  // Processes current line buffer, adds it to output buffer and clears line buffer
+  const flushText = (content) => {
+    if (textBuffer === '') return
+    if (content) {
+      getCurrentBuffer().content.push(textBuffer)
+    } else {
+      getCurrentBuffer().name = textBuffer
+    }
+    textBuffer = ''
+  }
+
+  for (let i = 0; i < input.length; i++) {
+    const char = input[i]
+
+    if (char === ';') {
+      flushText(true)
+    } else if (char === '{') {
+      flushText(false)
+    } else if (char === '}') {
+      buffer.push({ name: null, content: [] })
+      textBuffer = ''
+    } else {
+      textBuffer += char
+    }
+  }
+
+  flushText()
+  return buffer
 }
diff --git a/src/services/theme_data/theme_data_3.service.js b/src/services/theme_data/theme_data_3.service.js
@@ -23,6 +23,9 @@ import {
   findRules
 } from './iss_utils.js'
 import { parseCssShadow } from './css_utils.js'
+import {
+  serialize
+} from './iss_serializer.js'
 
 // Ensuring the order of components
 const components = {
@@ -504,9 +507,32 @@ export const init = ({
     console.debug('Eager processing took ' + (t2 - t1) + ' ms')
   }
 
+  // optimization to traverse big-ass array only once instead of twice
+  const eager = []
+  const lazy = []
+
+  result.forEach(x => {
+    if (typeof x === 'function') {
+      lazy.push(x)
+    } else {
+      eager.push(x)
+    }
+  })
+
+  const serializedData = serialize(eager)
+  const file = new File(serializedData, 'ruleset.piss')
+  const blobUrl = URL.createObjectURL(file)
+  const a = document.createElement('a')
+  a.href = blobUrl
+  a.download = 'ruleset.piss'
+  document.body.appendChild(a)
+  a.dispatchEvent(new MouseEvent('click'))
+  URL.revokeObjectURL(blobUrl)
+  document.body.removeChild(a)
+
   return {
-    lazy: result.filter(x => typeof x === 'function'),
-    eager: result.filter(x => typeof x !== 'function'),
+    lazy,
+    eager,
     staticVars,
     engineChecksum
   }
diff --git a/test/unit/specs/services/theme_data/iss_deserializer.spec.js b/test/unit/specs/services/theme_data/iss_deserializer.spec.js
@@ -0,0 +1,47 @@
+import { deserialize } from 'src/services/theme_data/iss_deserializer.js'
+
+/* eslint-disable quotes */
+const testData = ```
+    Root {
+        --accent: color | #e2b188;
+        --badgeNotification: color | #e15932;
+        --bg: color | #0f161e;
+        --cBlue: color | #81beea;
+        --cGreen: color | #5dc94a;
+        --cOrange: color | #ffc459;
+        --cRed: color | #d31014;
+        --defaultButtonBevel: shadow | $borderSide(#FFFFFF, top, 0.2) | $borderSide(#000000, bottom, 0.2);
+        --defaultButtonHoverGlow: shadow | 0 0 4 --text;
+        --defaultButtonShadow: shadow | 0 0 2 #000000;
+        --defaultInputBevel: shadow | $borderSide(#FFFFFF, bottom, 0.2)| $borderSide(#000000, top, 0.2);
+        --fg: color | #151e2b;
+        --font: generic | sans-serif;
+        --link: color | #e2b188;
+        --monoFont: generic | monospace;
+        --pressedButtonBevel: shadow | $borderSide(#FFFFFF, bottom, 0.2)| $borderSide(#000000, top, 0.2);
+        --selectionBackground: color | --accent;
+        --selectionText: color | $textColor(--accent, --text, no-preserve);
+        --text: color | #b9b9ba;
+        --wallpaper: color | #0c1118;
+        background: transparent;
+        opacity: 0;
+    }
+
+    Root Underlay {
+        background: #000000;
+        opacity: 0.6;
+    }
+
+    Root Underlay, test {
+        background: #000000;
+        opacity: 0.6;
+    }
+    ```
+
+describe.only('html_tree_converter', () => {
+  describe('convertHtmlToTree', () => {
+    it('should parse ISS correctly', () => {
+      console.log(deserialize(testData))
+    })
+  })
+})