convert app.isMobile to DEVICE.isMobile, fix CropImage angle!==0

src/ExcalidrawView.ts

@@ -392,7 +392,7 @@ export default class ExcalidrawView extends TextFileView {
     if (!this.excalidrawAPI || !this.file) {
       return;
     }
-    if (this.app.isMobile) {
+    if (DEVICE.isMobile) {
       const prompt = new Prompt(
         this.app,
         "Please provide filename",
@@ -1256,8 +1256,8 @@ export default class ExcalidrawView extends TextFileView {
   onload() {
     const apiMissing = Boolean(typeof this.containerEl.onWindowMigrated === "undefined")
     //@ts-ignore
-    if(!app.isMobile && !apiMissing) this.containerEl.onWindowMigrated(()=>this.leaf.rebuildView());
-    const doc = app.isMobile?document:this.containerEl.ownerDocument;
+    if(!DEVICE.isMobile && !apiMissing) this.containerEl.onWindowMigrated(()=>this.leaf.rebuildView());
+    const doc = DEVICE.isMobile?document:this.containerEl.ownerDocument;
     this.ownerDocument = doc;
     this.ownerWindow = this.ownerDocument.defaultView;
     this.plugin.getPackage(this.ownerWindow);
@@ -2161,7 +2161,7 @@ export default class ExcalidrawView extends TextFileView {
     this.semaphores.preventReload = false;
     const penEnabled =
       this.plugin.settings.defaultPenMode === "always" ||
-      (this.plugin.settings.defaultPenMode === "mobile" && app.isMobile);
+      (this.plugin.settings.defaultPenMode === "mobile" && DEVICE.isMobile);
     const api = this.excalidrawAPI;
     if (api) {
       //isLoaded flags that a new file is being loaded, isLoaded will be true after loadDrawing completes
@@ -2270,7 +2270,7 @@ export default class ExcalidrawView extends TextFileView {
     if(!this.semaphores.viewunload && this.toolsPanelRef?.current) {
       this.toolsPanelRef.current.setDirty(true);
     }
-    if(!this.app.isMobile) {
+    if(!DEVICE.isMobile) {
       if(requireApiVersion("0.16.0")) {
         //@ts-ignore
         this.leaf.tabHeaderInnerTitleEl.style.color="var(--color-accent)"
@@ -2297,7 +2297,7 @@ export default class ExcalidrawView extends TextFileView {
       this.previousSceneVersion = this.getSceneVersion(el);
     }
     this.diskIcon.querySelector("svg").removeClass("excalidraw-dirty");
-    if(!app.isMobile) {
+    if(!DEVICE.isMobile) {
       if(requireApiVersion("0.16.0")) {
         //@ts-ignore
         this.leaf.tabHeaderInnerTitleEl.style.color=""
@@ -4914,7 +4914,7 @@ export default class ExcalidrawView extends TextFileView {
     }
     const maxZoom = this.plugin.settings.zoomToFitMaxLevel;
     const elements = api.getSceneElements().filter((el:ExcalidrawElement)=>el.width<10000 && el.height<10000);
-    if((app.isMobile && elements.length>1000) || elements.length>2500) {
+    if((DEVICE.isMobile && elements.length>1000) || elements.length>2500) {
       if(justLoaded) api.scrollToContent();
       return;
     }

src/main.ts

@@ -42,7 +42,8 @@ import {
   LOCALE,
   IMAGE_TYPES,
   MD_TEXTELEMENTS,
-  setExcalidrawPlugin
+  setExcalidrawPlugin,
+  DEVICE
 } from "./constants/constants";
 import {
   VIRGIL_FONT,
@@ -381,7 +382,7 @@ export default class ExcalidrawPlugin extends Plugin {
   private getOpenObsidianDocuments(): Document[] {
     const visitedDocs = new Set<Document>();
     this.app.workspace.iterateAllLeaves((leaf)=>{
-      const ownerDocument = this.app.isMobile?document:leaf.view.containerEl.ownerDocument;   
+      const ownerDocument = DEVICE.isMobile?document:leaf.view.containerEl.ownerDocument;   
       if(!ownerDocument) return;        
       if(visitedDocs.has(ownerDocument)) return;
       visitedDocs.add(ownerDocument);
@@ -1087,7 +1088,7 @@ export default class ExcalidrawPlugin extends Plugin {
       name: t("NEW_IN_POPOUT_WINDOW"),
       checkCallback: (checking: boolean) => {
         if (checking) {
-          return !app.isMobile
+          return !DEVICE.isMobile;
         }
         this.createAndOpenDrawing(getDrawingFilename(this.settings), "popout-window");
       },
@@ -1159,7 +1160,7 @@ export default class ExcalidrawPlugin extends Plugin {
       name: t("NEW_IN_POPOUT_WINDOW_EMBED"),
       checkCallback: (checking: boolean) => {
         if (checking) {
-          return !app.isMobile && Boolean(this.app.workspace.getActiveViewOfType(MarkdownView));
+          return !DEVICE.isMobile && Boolean(this.app.workspace.getActiveViewOfType(MarkdownView));
         }
         insertDrawingToDoc("popout-window");
         return true;
@@ -2580,14 +2581,14 @@ export default class ExcalidrawPlugin extends Plugin {
 
         //!Temporary hack
         //https://discord.com/channels/686053708261228577/817515900349448202/1031101635784613968
-        if (this.app.isMobile && newActiveviewEV && !previouslyActiveEV) {
+        if (DEVICE.isMobile && newActiveviewEV && !previouslyActiveEV) {
           const navbar = document.querySelector("body>.app-container>.mobile-navbar");
           if(navbar && navbar instanceof HTMLDivElement) {
             navbar.style.position="relative";
           }
         }
 
-        if (this.app.isMobile && !newActiveviewEV && previouslyActiveEV) {
+        if (DEVICE.isMobile && !newActiveviewEV && previouslyActiveEV) {
           const navbar = document.querySelector("body>.app-container>.mobile-navbar");
           if(navbar && navbar instanceof HTMLDivElement) {
             navbar.style.position="";
@@ -2991,7 +2992,7 @@ export default class ExcalidrawPlugin extends Plugin {
     }
     if(opts.applyLefthandedMode) setLeftHandedMode(this.settings.isLeftHanded);
     if(opts.reEnableAutosave) this.settings.autosave = true;
-    this.settings.autosaveInterval = app.isMobile
+    this.settings.autosaveInterval = DEVICE.isMobile
     ? this.settings.autosaveIntervalMobile
     : this.settings.autosaveIntervalDesktop;
   }
@@ -3018,7 +3019,7 @@ export default class ExcalidrawPlugin extends Plugin {
   public triggerEmbedUpdates(filepath?: string) {
     const visitedDocs = new Set<Document>();
     app.workspace.iterateAllLeaves((leaf)=>{
-      const ownerDocument = app.isMobile?document:leaf.view.containerEl.ownerDocument;
+      const ownerDocument = DEVICE.isMobile?document:leaf.view.containerEl.ownerDocument;
       if(!ownerDocument) return;
       if(visitedDocs.has(ownerDocument)) return;
       visitedDocs.add(ownerDocument);
@@ -3231,7 +3232,7 @@ export default class ExcalidrawPlugin extends Plugin {
   }
 
   public async exportLibrary() {
-    if (this.app.isMobile) {
+    if (DEVICE.isMobile) {
       const prompt = new Prompt(
         this.app,
         "Please provide a filename",

src/settings.ts

@@ -8,7 +8,7 @@ import {
   TextComponent,
   TFile,
 } from "obsidian";
-import { GITHUB_RELEASES, VIEW_TYPE_EXCALIDRAW } from "./constants/constants";
+import { DEVICE, GITHUB_RELEASES, VIEW_TYPE_EXCALIDRAW } from "./constants/constants";
 import ExcalidrawView from "./ExcalidrawView";
 import { t } from "./lang/helpers";
 import type ExcalidrawPlugin from "./main";
@@ -674,7 +674,7 @@ export class ExcalidrawSettingTab extends PluginSettingTab {
         .setValue(this.plugin.settings.autosaveIntervalDesktop.toString())
         .onChange(async (value) => {
           this.plugin.settings.autosaveIntervalDesktop = parseInt(value);
-          this.plugin.settings.autosaveInterval = app.isMobile
+          this.plugin.settings.autosaveInterval = DEVICE.isMobile
             ? this.plugin.settings.autosaveIntervalMobile
             : this.plugin.settings.autosaveIntervalDesktop;
           this.applySettingsUpdate();
@@ -693,7 +693,7 @@ export class ExcalidrawSettingTab extends PluginSettingTab {
         .setValue(this.plugin.settings.autosaveIntervalMobile.toString())
         .onChange(async (value) => {
           this.plugin.settings.autosaveIntervalMobile = parseInt(value);
-          this.plugin.settings.autosaveInterval = app.isMobile
+          this.plugin.settings.autosaveInterval = DEVICE.isMobile
             ? this.plugin.settings.autosaveIntervalMobile
             : this.plugin.settings.autosaveIntervalDesktop;
           this.applySettingsUpdate();

src/utils/CropImage.ts

@@ -97,16 +97,12 @@ export class CropImage {
       withTheme: false,
       isMask: false,
     }
+    const isRotated = this.imageEA.getElements().some(el=>el.type === "image" && el.angle !== 0);
     const images = Object.values(this.imageEA.imagesDict);
-    if(images.length === 1) {
+    if(!isRotated && (images.length === 1)) {
       return images[0].dataURL;
     }
     return await this.imageEA.createPNGBase64(null,1,exportSettings,null,null,0);
-    const imageSVG = await this.imageEA.createSVG(null,false,exportSettings,null,null,0);
-    const svgData = new XMLSerializer().serializeToString(imageSVG);
-    return `data:image/svg+xml;base64,${btoa(unescape(encodeURIComponent(svgData)))}`;
-//    const blob = new Blob([svgString], { type: 'image/svg+xml' });
-//    return `data:image/svg+xml;base64,${await blobToBase64(blob)}`;
   }
 
   private async buildSVG(): Promise<SVGSVGElement> {

src/utils/Utils.ts

@@ -20,6 +20,7 @@ import {
   FRONTMATTER_KEYS,
   EXCALIDRAW_PLUGIN,
   getCommonBoundingBox,
+  DEVICE,
 } from "../constants/constants";
 import ExcalidrawPlugin from "../main";
 import { ExcalidrawElement } from "@zsviczian/excalidraw/types/excalidraw/element/types";
@@ -508,7 +509,7 @@ export const setDocLeftHandedMode = (isLeftHanded: boolean, ownerDocument:Docume
 export const setLeftHandedMode = (isLeftHanded: boolean) => {
   const visitedDocs = new Set<Document>();
   app.workspace.iterateAllLeaves((leaf) => {
-    const ownerDocument = app.isMobile?document:leaf.view.containerEl.ownerDocument;
+    const ownerDocument = DEVICE.isMobile?document:leaf.view.containerEl.ownerDocument;
     if(!ownerDocument) return;
     if(visitedDocs.has(ownerDocument)) return;
     visitedDocs.add(ownerDocument);