diff --git a/packages/flutter_image_compress_web/lib/src/log.dart b/packages/flutter_image_compress_web/lib/src/log.dart index b5c77b9..8c028dc 100644 --- a/packages/flutter_image_compress_web/lib/src/log.dart +++ b/packages/flutter_image_compress_web/lib/src/log.dart @@ -1,9 +1,10 @@ -@JS('console') library log; -import 'package:js/js.dart'; +import 'dart:developer' as dev; +import 'dart:js_interop'; -external void log(dynamic tag, dynamic msg); +@JS('console.log') +external void log(JSAny? tag, JSAny? msg); bool showLog = false; @@ -15,7 +16,6 @@ void jsLog(dynamic tag, dynamic msg) { void dartLog(Object? msg) { if (showLog) { - // ignore: avoid_print - print(msg.toString()); + dev.log(msg.toString()); } } diff --git a/packages/flutter_image_compress_web/lib/src/pica.dart b/packages/flutter_image_compress_web/lib/src/pica.dart index da71774..7255d0c 100644 --- a/packages/flutter_image_compress_web/lib/src/pica.dart +++ b/packages/flutter_image_compress_web/lib/src/pica.dart @@ -1,34 +1,21 @@ -@JS() library pica; import 'dart:convert'; -import 'dart:html'; +import 'dart:js_interop'; import 'dart:typed_data'; import 'package:flutter_image_compress_platform_interface/flutter_image_compress_platform_interface.dart'; -import 'package:js/js.dart'; -import 'package:js/js_util.dart'; +import 'package:web/web.dart'; -import 'window.dart'; import 'log.dart' as logger; +import 'util.dart'; +import 'window.dart'; -@JS('pica.resize') -external dynamic resize( - ImageBitmap imageBitmap, - CanvasElement canvas, -); - -@JS() -@staticInterop -class Pica {} - -extension PicaExt on Pica { - external dynamic resize( - ImageBitmap imageBitmap, - CanvasElement canvas, +extension type Pica._(JSObject _) implements JSObject { + external JSPromise resize( + ImageBitmap from, + HTMLCanvasElement to, ); - - external dynamic init(); } Future resizeWithList({ @@ -39,14 +26,14 @@ Future resizeWithList({ int quality = 88, }) async { final Stopwatch stopwatch = Stopwatch()..start(); - final pica = jsWindow.pica() as Pica; + final pica = window.pica(); logger.jsLog('The pica instance', pica); logger.jsLog('src image buffer', buffer); logger.dartLog('src image buffer length: ${buffer.length}'); - final bitmap = await convertUint8ListToBitmap(buffer); + final bitmap = await buffer.toImageBitmap(); - final srcWidth = bitmap.width!; - final srcHeight = bitmap.height!; + final srcWidth = bitmap.width; + final srcHeight = bitmap.height; final ratio = srcWidth / srcHeight; @@ -55,8 +42,10 @@ Future resizeWithList({ logger.jsLog('target size', '$width x $height'); - final canvas = CanvasElement(width: width, height: height); - await promiseToFuture(pica.resize(bitmap, canvas)); + final canvas = HTMLCanvasElement(); + canvas.width = width; + canvas.height = height; + await pica.resize(bitmap, canvas).toDart; final blob = canvas.toDataUrl(format.type, quality / 100); final str = blob.split(',')[1]; diff --git a/packages/flutter_image_compress_web/lib/src/util.dart b/packages/flutter_image_compress_web/lib/src/util.dart new file mode 100644 index 0000000..35be11e --- /dev/null +++ b/packages/flutter_image_compress_web/lib/src/util.dart @@ -0,0 +1,15 @@ +library util; + +import 'dart:js_interop'; +import 'dart:typed_data'; + +import 'package:web/web.dart'; + +extension Uint8ListExtension on Uint8List { + Future toImageBitmap() async { + final buffer = this; + final blob = Blob([buffer.toJS].toJS); + final bitmap = await window.createImageBitmap(blob).toDart; + return bitmap; + } +} diff --git a/packages/flutter_image_compress_web/lib/src/window.dart b/packages/flutter_image_compress_web/lib/src/window.dart index c3af3a0..fdfc900 100644 --- a/packages/flutter_image_compress_web/lib/src/window.dart +++ b/packages/flutter_image_compress_web/lib/src/window.dart @@ -1,31 +1,8 @@ -@JS() library window; -import 'dart:html'; -import 'dart:typed_data'; +import 'package:web/web.dart'; +import 'pica.dart'; -import 'package:js/js.dart'; -import 'package:js/js_util.dart'; - -@JS() -@staticInterop -class JSWindow {} - -extension JSWindowExtension on JSWindow { - external Function get createImageBitmap; - external Function get pica; -} - -Future convertUint8ListToBitmap(Uint8List buffer) async { - final blob = Blob([buffer]); - - final result = await jsWindow.createImageBitmap(blob); - final bitmap = await promiseToFuture(result); - return bitmap; -} - -JSWindow get jsWindow => window as JSWindow; - -extension FutureDynamicExtension on dynamic { - Future toFuture() => promiseToFuture(this); +extension WindowExtension on Window { + external Pica pica(); } diff --git a/packages/flutter_image_compress_web/pubspec.yaml b/packages/flutter_image_compress_web/pubspec.yaml index 5ce0f1d..a067f3c 100644 --- a/packages/flutter_image_compress_web/pubspec.yaml +++ b/packages/flutter_image_compress_web/pubspec.yaml @@ -4,7 +4,7 @@ version: 0.1.4+1 repository: https://github.com/fluttercandies/flutter_image_compress environment: - sdk: '>=2.16.0 <4.0.0' + sdk: '>=3.3.0 <4.0.0' flutter: ">=2.5.0" dependencies: @@ -14,7 +14,7 @@ dependencies: sdk: flutter flutter_image_compress_platform_interface: ^1.0.5 - js: '>=0.6.0 <0.8.0' + web: ^0.5.1 dev_dependencies: flutter_test: