Enable 'bold' with ctrl+b on flutter web

README.md

@@ -1,4 +1,6 @@
-<a href="https://bulletjournal.us/home/index.html"><img src=
+
+<a href="https://bulletjournal.us/home/index.html">
+<img src=  
 "https://user-images.githubusercontent.com/122956/72955931-ccc07900-3d52-11ea-89b1-d468a6e2aa2b.png"  
  width="150px" height="150px"></a>  
   
@@ -8,7 +10,15 @@ Rich text editor and a [Quill] component for [Flutter].
   
 https://pub.dev/packages/flutter_quill  
   
-This library is a WYSIWYG editor built for the modern mobile platform only and web is not supported.
+This library is a WYSIWYG editor built for the modern mobile platform only and web is under development.  
+ 
+Default branch `master` is on channel `master`. To use channel `stable`, switch to branch `stable`.
+Branch `master` on channel `master` supports web. To run the app on web do the following:
+1) Change flutter channel to master using `flutter channel master`, followed by `flutter upgrade`.
+2) Enable web using `flutter config --enable-web` and restart the IDE.
+3) Upon successful execution of step 1 and 2 you should see `Chrome` as one of the devices which you run `flutter devices`.
+4) Run the app.
+
 For web development, [ReactQuill] is recommended to use for compatibility.  
   
 ---  

app/lib/pages/home_page.dart

@@ -4,6 +4,7 @@ import 'dart:io';
 
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
+import 'package:flutter_quill/models/documents/attribute.dart';
 import 'package:flutter_quill/models/documents/document.dart';
 import 'package:flutter_quill/widgets/controller.dart';
 import 'package:flutter_quill/widgets/default_styles.dart';
@@ -65,7 +66,25 @@ class _HomePageState extends State<HomePage> {
         color: Colors.grey.shade800,
         child: _buildMenuBar(context),
       ),
-      body: _buildWelcomeEditor(context),
+      body: RawKeyboardListener(
+        focusNode: FocusNode(),
+        onKey: (RawKeyEvent event) {
+          if (event.data.isControlPressed && event.character == 'b') {
+            if (_controller
+                .getSelectionStyle()
+                .attributes
+                .keys
+                .contains("bold")) {
+              _controller
+                  .formatSelection(Attribute.clone(Attribute.bold, null));
+            } else {
+              _controller.formatSelection(Attribute.bold);
+              print("not bold");
+            }
+          }
+        },
+        child: _buildWelcomeEditor(context),
+      ),
     );
   }
 

lib/widgets/editor.dart

@@ -11,7 +11,7 @@ import 'package:flutter_quill/models/documents/document.dart';
 import 'package:flutter_quill/models/documents/nodes/container.dart'
     as containerNode;
 import 'package:flutter_quill/models/documents/nodes/embed.dart';
-import 'package:flutter_quill/models/documents/nodes/leaf.dart';
+import 'package:flutter_quill/models/documents/nodes/leaf.dart' as leaf;
 import 'package:flutter_quill/models/documents/nodes/line.dart';
 import 'package:flutter_quill/models/documents/nodes/node.dart';
 import 'package:flutter_quill/widgets/image.dart';
@@ -73,16 +73,12 @@ abstract class RenderAbstractEditor {
   void selectPosition(SelectionChangedCause cause);
 }
 
-Widget _defaultEmbedBuilder(BuildContext context, Embed node) {
+Widget _defaultEmbedBuilder(BuildContext context, leaf.Embed node) {
   switch (node.value.type) {
-    case 'divider':
-      final style = QuillStyles.getStyles(context, true);
-      return Divider(
-        height: style.paragraph.style.fontSize * style.paragraph.style.height,
-        thickness: 2,
-        color: Colors.grey.shade200,
-      );
     case 'image':
+      if (kIsWeb) {
+        return SizedBox.shrink();
+      }
       String imageUrl = node.value.data;
       return imageUrl.startsWith('http')
           ? Image.network(imageUrl)
@@ -348,7 +344,7 @@ class _QuillEditorSelectionGestureDetectorBuilder
       }
       return false;
     }
-    Leaf segment = segmentResult.node as Leaf;
+    leaf.Leaf segment = segmentResult.node as leaf.Leaf;
     if (segment.style.containsKey(Attribute.link.key)) {
       var launchUrl = getEditor().widget.onLaunchUrl;
       if (launchUrl == null) {

lib/widgets/toolbar.dart

@@ -1,5 +1,6 @@
 import 'dart:io';
 
+import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_colorpicker/flutter_colorpicker.dart';
 import 'package:flutter_quill/models/documents/attribute.dart';
@@ -446,7 +447,15 @@ Widget _selectHeadingStyleButtonBuilder(
     height: iconSize * 1.77,
     fillColor: Theme.of(context).canvasColor,
     child: Text(
-      _valueToText[value],
+      !kIsWeb
+          ? _valueToText[value]
+          : _valueToText[value.key == "header"
+              ? Attribute.header
+              : (value.key == "h1")
+                  ? Attribute.h1
+                  : (value.key == "h2")
+                      ? Attribute.h2
+                      : Attribute.h3],
       style: TextStyle(fontSize: 13, fontWeight: FontWeight.w600),
     ),
     initialValue: value,