Added keyboard shortcut with ctrl+b

README.md

@@ -1,29 +1,37 @@
-<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>
 
-# FlutterQuill
+<a href="https://bulletjournal.us/home/index.html"><img src=  
-
+"https://user-images.githubusercontent.com/122956/72955931-ccc07900-3d52-11ea-89b1-d468a6e2aa2b.png"  
-Rich text editor and a [Quill] component for [Flutter].
+ width="150px" height="150px"></a>  
-
+  
-https://pub.dev/packages/flutter_quill
+# FlutterQuill  
-
+  
-This library is a WYSIWYG editor built for the modern mobile platform only and web is not supported.
+Rich text editor and a [Quill] component for [Flutter].  
-For web development, [ReactQuill] is recommended to use for compatibility.
+  
-
+https://pub.dev/packages/flutter_quill  
----
+  
-
+This library is a WYSIWYG editor built for the modern mobile platform only and web is under development.  
-<img width="484" alt="1" src="https://user-images.githubusercontent.com/122956/103142422-9bb19c80-46b7-11eb-83e4-dd0538a9236e.png">
+  
-<img width="484" alt="1" src="https://user-images.githubusercontent.com/122956/103142455-0531ab00-46b8-11eb-89f8-26a77de9227f.png">
+To run the app on web do the following:
-<img width="484" alt="1" src="https://user-images.githubusercontent.com/122956/102963021-f28f5a00-449c-11eb-8f5f-6e9dd60844c4.png">
+1) Change flutter channel to master using `flutter channel master`, followed by `flutter upgrade`.
-<img width="484" alt="1" src="https://user-images.githubusercontent.com/122956/102977404-c9c88e00-44b7-11eb-9423-b68f3b30b0e0.png">
+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`.
-One client and affiliated collaborator of **[FlutterQuill]** is Bullet Journal App: https://bulletjournal.us/home/index.html
+4) Run the app.
-
+
-You can also join [Slack Group] for discussion.
+For web development, [ReactQuill] is recommended to use for compatibility.  
-
+  
-[Quill]: https://quilljs.com
+---  
-[Flutter]: https://github.com/flutter/flutter
+  
-[FlutterQuill]: https://pub.dev/packages/flutter_quill
+<img width="484" alt="1" src="https://user-images.githubusercontent.com/122956/103142422-9bb19c80-46b7-11eb-83e4-dd0538a9236e.png">  
-[ReactQuill]: https://github.com/zenoamaro/react-quill
+<img width="484" alt="1" src="https://user-images.githubusercontent.com/122956/103142455-0531ab00-46b8-11eb-89f8-26a77de9227f.png">  
-[Slack Group]: https://join.slack.com/t/bulletjournal1024/shared_invite/zt-fys7t9hi-ITVU5PGDen1rNRyCjdcQ2g
+<img width="484" alt="1" src="https://user-images.githubusercontent.com/122956/102963021-f28f5a00-449c-11eb-8f5f-6e9dd60844c4.png">  
+<img width="484" alt="1" src="https://user-images.githubusercontent.com/122956/102977404-c9c88e00-44b7-11eb-9423-b68f3b30b0e0.png">  
+  
+One client and affiliated collaborator of **[FlutterQuill]** is Bullet Journal App: https://bulletjournal.us/home/index.html  
+  
+You can also join [Slack Group] for discussion.  
+  
+[Quill]: https://quilljs.com  
+[Flutter]: https://github.com/flutter/flutter  
+[FlutterQuill]: https://pub.dev/packages/flutter_quill  
+[ReactQuill]: https://github.com/zenoamaro/react-quill  
+[Slack Group]: https://join.slack.com/t/bulletjournal1024/shared_invite/zt-fys7t9hi-ITVU5PGDen1rNRyCjdcQ2g

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

@@ -76,12 +76,15 @@ abstract class RenderAbstractEditor {
 Widget _defaultEmbedBuilder(BuildContext context, leaf.Embed node) {
   switch (node.value.type) {
     case 'image':
-      final style = QuillStyles.getStyles(context, true);
+      if (kIsWeb) {
-      return Divider(
+        return SizedBox.shrink();
-        height: style.paragraph.style.fontSize * style.paragraph.style.height,
+      } else {
-        thickness: 2,
+        String imageUrl = node.value.data;
-        color: Colors.grey.shade200,
+        return imageUrl.startsWith('http')
-      );
+            ? Image.network(imageUrl)
+            : Image.asset(imageUrl);
+      }
+      break;
 
     default:
       throw UnimplementedError(

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,13 +447,15 @@ Widget _selectHeadingStyleButtonBuilder(
     height: iconSize * 1.77,
     fillColor: Theme.of(context).canvasColor,
     child: Text(
-      _valueToText[value.key == "header"
+      !kIsWeb
-          ? Attribute.header
+          ? _valueToText[value]
-          : (value.key == "h1")
+          : _valueToText[value.key == "header"
-              ? Attribute.h1
+              ? Attribute.header
-              : (value.key == "h2")
+              : (value.key == "h1")
-                  ? Attribute.h2
+                  ? Attribute.h1
-                  : Attribute.h3],
+                  : (value.key == "h2")
+                      ? Attribute.h2
+                      : Attribute.h3],
       style: TextStyle(fontSize: 13, fontWeight: FontWeight.w600),
     ),
     initialValue: value,