android/ios-adaption feature, markdown, and augment #6
					 4 changed files with 378 additions and 0 deletions
				
			
		
							
								
								
									
										3
									
								
								lib/emailView.dart
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										3
									
								
								lib/emailView.dart
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,3 @@
 | 
			
		|||
export 'emailViewStub.dart'
 | 
			
		||||
  if (dart.library.io) 'emailViewAndroid.dart'
 | 
			
		||||
  if (dart.library.js_interop) 'emailViewWeb.dart';
 | 
			
		||||
							
								
								
									
										95
									
								
								lib/emailViewAndroid.dart
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										95
									
								
								lib/emailViewAndroid.dart
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,95 @@
 | 
			
		|||
import 'package:crab_ui/collapsableEmailsAndroid.dart';
 | 
			
		||||
import 'package:flutter/material.dart';
 | 
			
		||||
// import 'dart:ui_web' as ui;
 | 
			
		||||
// import 'augment.dart';
 | 
			
		||||
// // import 'dart:js_interop' as js; //eventually for manipulating css
 | 
			
		||||
// import 'package:pointer_interceptor/pointer_interceptor.dart';
 | 
			
		||||
// import 'collapsableEmails.dart';
 | 
			
		||||
// import 'api_service.dart';
 | 
			
		||||
 | 
			
		||||
class EmailView extends StatefulWidget {
 | 
			
		||||
  final List<String> emailContent;
 | 
			
		||||
  final String from;
 | 
			
		||||
  final String name;
 | 
			
		||||
  final String to;
 | 
			
		||||
  final String subject;
 | 
			
		||||
  final String date;
 | 
			
		||||
  final String id;
 | 
			
		||||
  final List<String> messages;
 | 
			
		||||
 | 
			
		||||
  const EmailView({
 | 
			
		||||
    Key? key,
 | 
			
		||||
    required this.emailContent,
 | 
			
		||||
    required this.from,
 | 
			
		||||
    required this.name, // tf is name
 | 
			
		||||
    required this.to,
 | 
			
		||||
    required this.subject,
 | 
			
		||||
    required this.date,
 | 
			
		||||
    required this.id,
 | 
			
		||||
    required this.messages,
 | 
			
		||||
  }) : super(key: key);
 | 
			
		||||
  @override
 | 
			
		||||
  _EmailViewState createState() => _EmailViewState();
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
class _EmailViewState extends State<EmailView> {
 | 
			
		||||
  @override
 | 
			
		||||
  Widget build(BuildContext context) {
 | 
			
		||||
    return Scaffold(
 | 
			
		||||
      appBar: AppBar(
 | 
			
		||||
        title: Text(widget.name),
 | 
			
		||||
      ),
 | 
			
		||||
      body: Padding(
 | 
			
		||||
        padding: const EdgeInsets.all(8.0),
 | 
			
		||||
        child: Column(
 | 
			
		||||
          children: [
 | 
			
		||||
            Row(
 | 
			
		||||
              children: [
 | 
			
		||||
                Expanded(
 | 
			
		||||
                  child: Text(
 | 
			
		||||
                    widget.subject,
 | 
			
		||||
                    style: TextStyle(fontSize: 15),
 | 
			
		||||
                    overflow: TextOverflow.visible,
 | 
			
		||||
                    softWrap: true,
 | 
			
		||||
                  ),
 | 
			
		||||
                ),
 | 
			
		||||
              ],
 | 
			
		||||
            ),
 | 
			
		||||
            Row(
 | 
			
		||||
              children: [
 | 
			
		||||
                Text(
 | 
			
		||||
                  'from ${widget.name}',
 | 
			
		||||
                  style: TextStyle(fontSize: 8),
 | 
			
		||||
                ),
 | 
			
		||||
                Text(
 | 
			
		||||
                  '<${widget.from}>',
 | 
			
		||||
                  style: TextStyle(fontSize: 8),
 | 
			
		||||
                ),
 | 
			
		||||
                Spacer(),
 | 
			
		||||
                Text(
 | 
			
		||||
                  widget.date,
 | 
			
		||||
                  textAlign: TextAlign.right,
 | 
			
		||||
                )
 | 
			
		||||
              ],
 | 
			
		||||
            ),
 | 
			
		||||
            Row(
 | 
			
		||||
              children: [
 | 
			
		||||
                Text(
 | 
			
		||||
                  'to ${widget.to.toString()}',
 | 
			
		||||
                  style: TextStyle(fontSize: 8),
 | 
			
		||||
                )
 | 
			
		||||
              ],
 | 
			
		||||
            ),
 | 
			
		||||
            Expanded(
 | 
			
		||||
              child: CollapsableEmails(
 | 
			
		||||
                thread: widget.messages, 
 | 
			
		||||
                threadHTML: widget.emailContent, 
 | 
			
		||||
                threadIDs: widget.id,
 | 
			
		||||
              ),
 | 
			
		||||
            ),
 | 
			
		||||
          ],
 | 
			
		||||
        ),
 | 
			
		||||
      ) 
 | 
			
		||||
    );
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										39
									
								
								lib/emailViewStub.dart
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										39
									
								
								lib/emailViewStub.dart
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,39 @@
 | 
			
		|||
import 'package:flutter/material.dart';
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
class EmailView extends StatefulWidget {
 | 
			
		||||
  final List<String> emailContent;
 | 
			
		||||
  final String from;
 | 
			
		||||
  final String name;
 | 
			
		||||
  final String to;
 | 
			
		||||
  final String subject;
 | 
			
		||||
  final String date;
 | 
			
		||||
  final String id;
 | 
			
		||||
  final List<String> messages;
 | 
			
		||||
 | 
			
		||||
  const EmailView({
 | 
			
		||||
    Key? key,
 | 
			
		||||
    required this.emailContent,
 | 
			
		||||
    required this.from,
 | 
			
		||||
    required this.name,
 | 
			
		||||
    required this.to,
 | 
			
		||||
    required this.subject,
 | 
			
		||||
    required this.date,
 | 
			
		||||
    required this.id,
 | 
			
		||||
    required this.messages,
 | 
			
		||||
  }) : super(key: key);
 | 
			
		||||
  @override
 | 
			
		||||
  _EmailViewState createState() => _EmailViewState();
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
class _EmailViewState extends State<EmailView> {
 | 
			
		||||
  @override
 | 
			
		||||
  Widget build(BuildContext context) {
 | 
			
		||||
    return Scaffold(
 | 
			
		||||
    body: Center(
 | 
			
		||||
      child: Text(" emailview stub, not supported")
 | 
			
		||||
    )
 | 
			
		||||
    );
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										241
									
								
								lib/emailViewWeb.dart
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										241
									
								
								lib/emailViewWeb.dart
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,241 @@
 | 
			
		|||
import 'package:flutter/material.dart';
 | 
			
		||||
import 'dart:ui_web' as ui;
 | 
			
		||||
import 'augment.dart';
 | 
			
		||||
// import 'dart:js_interop' as js; //eventually for manipulating css
 | 
			
		||||
import 'package:pointer_interceptor/pointer_interceptor.dart';
 | 
			
		||||
import 'collapsableEmails.dart';
 | 
			
		||||
import 'api_service.dart';
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
class EmailView extends StatefulWidget {
 | 
			
		||||
  final List<String> emailContent;
 | 
			
		||||
  final String from;
 | 
			
		||||
  final String name;
 | 
			
		||||
  final String to;
 | 
			
		||||
  final String subject;
 | 
			
		||||
  final String date;
 | 
			
		||||
  final String id;
 | 
			
		||||
  final List<String> messages;
 | 
			
		||||
 | 
			
		||||
  const EmailView({
 | 
			
		||||
    Key? key,
 | 
			
		||||
    required this.emailContent,
 | 
			
		||||
    required this.from,
 | 
			
		||||
    required this.name,
 | 
			
		||||
    required this.to,
 | 
			
		||||
    required this.subject,
 | 
			
		||||
    required this.date,
 | 
			
		||||
    required this.id,
 | 
			
		||||
    required this.messages,
 | 
			
		||||
  }) : super(key: key);
 | 
			
		||||
  @override
 | 
			
		||||
  _EmailViewState createState() => _EmailViewState();
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
class _EmailViewState extends State<EmailView> {
 | 
			
		||||
  //html css rendering thing
 | 
			
		||||
  late Key iframeKey;
 | 
			
		||||
  late String currentContent;
 | 
			
		||||
  late String viewTypeId; //make this a list too???
 | 
			
		||||
  Future<List<Map<String, dynamic>>>? _markerPositionsFuture;
 | 
			
		||||
  // TextEditingController _jumpController = TextEditingController();
 | 
			
		||||
  final hardcodedMarkers = [
 | 
			
		||||
    {'id': 'marker1', 'x': 50, 'y': 100},
 | 
			
		||||
    {'id': 'marker2', 'x': 150, 'y': 200},
 | 
			
		||||
    {'id': 'marker3', 'x': 250, 'y': 300},
 | 
			
		||||
  ];
 | 
			
		||||
 | 
			
		||||
  @override
 | 
			
		||||
  void initState() {
 | 
			
		||||
    super.initState();
 | 
			
		||||
    print("thread id? ${widget.id}");
 | 
			
		||||
    List<String> currentContent = widget
 | 
			
		||||
        .emailContent; //html of the email/ actually entire thread, gives me little space to play in between
 | 
			
		||||
    // i wonder if the other attributes change? because if so i have to add like some zooms in and out of the emails, as in collapse
 | 
			
		||||
    // _registerViewFactory(currentContent);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  // void _registerViewFactory(List<String> currentContent) { // i think this doesnt work anymore
 | 
			
		||||
  //   setState(() { //update to do item per item
 | 
			
		||||
  //   // each item to have itsviewtype ID
 | 
			
		||||
  // // is this necessarey here??
 | 
			
		||||
 | 
			
		||||
  // //could just move to collapsable
 | 
			
		||||
 | 
			
		||||
  //     viewTypeId = 'iframe-${DateTime.now().millisecondsSinceEpoch}';
 | 
			
		||||
  //     final emailHTML = web.document.createElement('div') as web.HTMLDivElement
 | 
			
		||||
  //       ..id = viewTypeId
 | 
			
		||||
  //       ..innerHTML = currentContent[0].toJS; // temporarily index because it has to do all of them
 | 
			
		||||
  //     emailHTML.style
 | 
			
		||||
  //       ..width = '100%'
 | 
			
		||||
  //       ..height = '100%'
 | 
			
		||||
  //       ..overflow = 'auto'
 | 
			
		||||
  //       ..scrollBehavior = 'smooth';
 | 
			
		||||
 | 
			
		||||
  //     ui.platformViewRegistry.registerViewFactory(
 | 
			
		||||
  //       viewTypeId,
 | 
			
		||||
  //       (int viewId) => emailHTML,
 | 
			
		||||
  //     );
 | 
			
		||||
  //   });
 | 
			
		||||
  // }
 | 
			
		||||
 | 
			
		||||
  void _scrollToNumber(String spanId) {
 | 
			
		||||
    AugmentClasses.handleJump(spanId);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  // TODO: void _invisibility(String )  //to make purple numbers not visible
 | 
			
		||||
 | 
			
		||||
  @override
 | 
			
		||||
  Widget build(BuildContext context) {
 | 
			
		||||
    // print("thread id ${widget.id}");
 | 
			
		||||
    ApiService.currThreadID = widget.id;
 | 
			
		||||
    return Scaffold(
 | 
			
		||||
        appBar: AppBar(
 | 
			
		||||
          title: Text(widget.name),
 | 
			
		||||
        ),
 | 
			
		||||
        body: Stack(
 | 
			
		||||
          children: [
 | 
			
		||||
            Column(
 | 
			
		||||
              children: [
 | 
			
		||||
                EmailToolbar(
 | 
			
		||||
                  onJumpToSpan: _scrollToNumber,
 | 
			
		||||
                  onButtonPressed: () => {},
 | 
			
		||||
                  // AugmentClasses.handleJump(viewTypeId, '1');
 | 
			
		||||
                  // print("button got pressed?");
 | 
			
		||||
 | 
			
		||||
                  //   _registerViewFactory(r"""
 | 
			
		||||
                  // <h1>Welcome to My Website</h1>
 | 
			
		||||
                  // <p>This is a simple HTML page.</p>
 | 
			
		||||
                  // <h2>What is HTML?</h2>
 | 
			
		||||
                  // <p>HTML (HyperText Markup Language) is the most basic building~ block of the Web. It defines the meaning and structure of web content. Other technologies besides HTML are generally used to describe a web page's appearance/presentation (CSS) or functionality/behavior (JavaScript).</p>
 | 
			
		||||
                  // <h3>Here's a simple list:</h3>
 | 
			
		||||
                  // <ul>
 | 
			
		||||
                  //     <li>HTML elements are the building blocks of HTML pages</li>
 | 
			
		||||
                  //     <li>HTML uses tags like <code><tag></code> to organize and format content</li>
 | 
			
		||||
                  //     <li>CSS is used with HTML to style pages</li>
 | 
			
		||||
                  // </ul>
 | 
			
		||||
                  // <p>Copyright © 2023</p>
 | 
			
		||||
                  // """);
 | 
			
		||||
                  //   print("change");
 | 
			
		||||
                  // widget.emailContent = r"
 | 
			
		||||
 | 
			
		||||
                  //
 | 
			
		||||
                ),
 | 
			
		||||
                Row(
 | 
			
		||||
                  // title of email
 | 
			
		||||
                  children: [
 | 
			
		||||
                    Text(
 | 
			
		||||
                      widget.subject,
 | 
			
		||||
                      style: TextStyle(fontSize: 30),
 | 
			
		||||
                    ),
 | 
			
		||||
                  ],
 | 
			
		||||
                ),
 | 
			
		||||
                Row(
 | 
			
		||||
                  children: [
 | 
			
		||||
                    Text(
 | 
			
		||||
                      'from ${widget.name}',
 | 
			
		||||
                      style: TextStyle(fontSize: 18),
 | 
			
		||||
                    ),
 | 
			
		||||
                    Text(
 | 
			
		||||
                      '<${widget.from}>',
 | 
			
		||||
                      style: TextStyle(fontSize: 18),
 | 
			
		||||
                    ),
 | 
			
		||||
                    Spacer(),
 | 
			
		||||
                    Text(
 | 
			
		||||
                      '${widget.date}',
 | 
			
		||||
                      textAlign: TextAlign.right,
 | 
			
		||||
                    )
 | 
			
		||||
                  ],
 | 
			
		||||
                ),
 | 
			
		||||
                // TODO: make a case where if one of these is the user's email it just says me :)))))
 | 
			
		||||
                Row(
 | 
			
		||||
                  children: [
 | 
			
		||||
                    Text(
 | 
			
		||||
                      'to ${widget.to.toString()}',
 | 
			
		||||
                      style: TextStyle(fontSize: 15),
 | 
			
		||||
                    )
 | 
			
		||||
                  ],
 | 
			
		||||
                ),
 | 
			
		||||
                Expanded(
 | 
			
		||||
                  child: CollapsableEmails(
 | 
			
		||||
                    //change here
 | 
			
		||||
                    thread: widget.messages,  //this wont work in serializable
 | 
			
		||||
                    threadHTML: widget.emailContent,
 | 
			
		||||
                    threadIDs: widget.id,
 | 
			
		||||
                  ),
 | 
			
		||||
                ),
 | 
			
		||||
                // Expanded(
 | 
			
		||||
                //   child: HtmlElementView(
 | 
			
		||||
                //     key: UniqueKey(),
 | 
			
		||||
                //     viewType: viewTypeId,
 | 
			
		||||
                //   ),
 | 
			
		||||
                // ),
 | 
			
		||||
              ],
 | 
			
		||||
            ),
 | 
			
		||||
 | 
			
		||||
            // Overlay widgets dynamically based on marker positions
 | 
			
		||||
            // FutureBuilder<List<Map<String, dynamic>>>(
 | 
			
		||||
            //   future: _markerPositionsFuture,
 | 
			
		||||
            //   builder: (context, snapshot) {
 | 
			
		||||
            //     print("FutureBuilder state: ${snapshot.connectionState}");
 | 
			
		||||
            //     if (snapshot.connectionState == ConnectionState.waiting) {
 | 
			
		||||
            //       return Center(child: CircularProgressIndicator());
 | 
			
		||||
            //     }
 | 
			
		||||
            //     if (snapshot.hasError) {
 | 
			
		||||
            //       print("Error in FutureBuilder: ${snapshot.error}");
 | 
			
		||||
            //       return Center(child: Text('error loading markers'));
 | 
			
		||||
            //     }
 | 
			
		||||
            //     if (snapshot.hasData && snapshot.data != null) {
 | 
			
		||||
            //       final markers = snapshot.data!;
 | 
			
		||||
            //       return Stack(
 | 
			
		||||
            //         children: markers.map((marker) {
 | 
			
		||||
            //           return Positioned(
 | 
			
		||||
            //             left: marker['x'].toDouble(),
 | 
			
		||||
            //             top: marker['y'].toDouble(),
 | 
			
		||||
            //             child: GestureDetector(
 | 
			
		||||
            //               onTap: () {
 | 
			
		||||
            //                 print('Tapped on ${marker['id']}');
 | 
			
		||||
            //               },
 | 
			
		||||
            //               child: Container(
 | 
			
		||||
            //                 width: 50,
 | 
			
		||||
            //                 height: 50,
 | 
			
		||||
            //                 color: Colors.red,
 | 
			
		||||
            //                 child: Center(
 | 
			
		||||
            //                   child: Text(
 | 
			
		||||
            //                     marker['id'],
 | 
			
		||||
            //                     style: TextStyle(color: Colors.white),
 | 
			
		||||
            //                   ),
 | 
			
		||||
            //                 ),
 | 
			
		||||
            //               ),
 | 
			
		||||
            //             ),
 | 
			
		||||
            //           );
 | 
			
		||||
            //         }).toList(),
 | 
			
		||||
            //       );
 | 
			
		||||
            //     }
 | 
			
		||||
 | 
			
		||||
            //     return SizedBox.shrink(); // No markers found
 | 
			
		||||
            //   },
 | 
			
		||||
            // ),
 | 
			
		||||
            // Red widget overlay
 | 
			
		||||
            // Positioned(
 | 
			
		||||
            //   left: 8, // Adjust based on your desired position
 | 
			
		||||
            //   top: 100 + 44 + 5, // Adjust based on your desired position
 | 
			
		||||
            //   child: IgnorePointer(
 | 
			
		||||
            //     ignoring: true, // Ensures the iframe remains interactive
 | 
			
		||||
            //     child: Container(
 | 
			
		||||
            //       color: Colors.red,
 | 
			
		||||
            //       width: 100,
 | 
			
		||||
            //       height: 50,
 | 
			
		||||
            //       child: Center(
 | 
			
		||||
            //         child: Text(
 | 
			
		||||
            //           'Overlay',
 | 
			
		||||
            //           style: TextStyle(color: Colors.white),
 | 
			
		||||
            //         ),
 | 
			
		||||
            //       ),
 | 
			
		||||
            //     ),
 | 
			
		||||
            //   ),
 | 
			
		||||
            // ),
 | 
			
		||||
          ],
 | 
			
		||||
        ));
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
		Loading…
	
	Add table
		
		Reference in a new issue