From 679b9b108101b67ad56b4fdf35ec2bd0568d8d84 Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Thu, 9 Nov 2023 15:44:54 +0100
Subject: Renamed "bubble" to "message", added message group merging

---
 tpl/views/bubble-group.pug  |  59 ------------------------
 tpl/views/bubble.pug        |  31 -------------
 tpl/views/message-group.pug | 110 ++++++++++++++++++++++++++++++++++++++++++++
 tpl/views/message.pug       |  31 +++++++++++++
 4 files changed, 141 insertions(+), 90 deletions(-)
 delete mode 100644 tpl/views/bubble-group.pug
 delete mode 100644 tpl/views/bubble.pug
 create mode 100644 tpl/views/message-group.pug
 create mode 100644 tpl/views/message.pug

(limited to 'tpl/views')

diff --git a/tpl/views/bubble-group.pug b/tpl/views/bubble-group.pug
deleted file mode 100644
index dcdbe73..0000000
--- a/tpl/views/bubble-group.pug
+++ /dev/null
@@ -1,59 +0,0 @@
-mixin view-bubble-group
-    +view('bubble-group', 'Bubble group')
-        .c-box.l-overflow(style='resize: vertical')
-            +bubble-group('Volpeon')(compact=true arrow=true left=true)
-                +bubble('Volpeon')(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= 'Compact bubbles test'
-                    +slot('time')= '12:34'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= loremIpsum
-                    +slot('time')= '12:35'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= 'qwertzuiop'
-                    +slot('time')= '12:36'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= '🐈️🦊️'
-                    +slot('time')= '12:38'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= loremIpsum
-                    +slot('time')= '12:39'
-
-        .c-box.l-overflow(style='resize: vertical')
-            +bubble-group('Volpeon')(compact=true right=true)
-                strong= 'Volpeon'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= 'Compact bubbles test'
-                    +slot('time')= '12:34'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= loremIpsum
-                    +slot('time')= '12:35'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= 'qwertzuiop'
-                    +slot('time')= '12:36'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= '🐈️🦊️'
-                    +slot('time')= '12:38'
-                +bubble()(compact=true class='l-bubble-group__bubble')
-                    +slot('body')= loremIpsum
-                    +slot('time')= '12:39'
-
-        .c-box.l-overflow(style='resize: vertical')
-            +bubble-group('Volpeon')
-                +bubble()(class='l-bubble-group__bubble')
-                    +slot('header')
-                        .l-media.l-media--flush
-                            .l-media__block.l-media__block--main
-                                strong= 'Volpeon'
-                                small.u-ml-100= '@volpeon@mk.vulpes.one'
-                            small.l-media__block
-                                = '5 minutes ago'
-                                +icon('lock')(class='u-ml-100')
-                    +slot('body')= 'Full width bubbles test'
-                +bubble()(class='l-bubble-group__bubble')
-                    +slot('body')= loremIpsum
-                +bubble()(class='l-bubble-group__bubble')
-                    +slot('body')= 'qwertzuiop'
-                +bubble()(class='l-bubble-group__bubble')
-                    +slot('body')= '🐈️🦊️'
-                +bubble()(class='l-bubble-group__bubble')
-                    +slot('body')= loremIpsum
diff --git a/tpl/views/bubble.pug b/tpl/views/bubble.pug
deleted file mode 100644
index 84d0912..0000000
--- a/tpl/views/bubble.pug
+++ /dev/null
@@ -1,31 +0,0 @@
-mixin view-bubble
-    +view('bubble', 'Bubble')
-        .c-box
-            +bubble('Volpeon')(compact=true)
-                +slot('body')= loremIpsum
-                +slot('time')
-                    = '12:34'
-                    +icon('lock')(class='u-ml-100')
-
-        .c-box
-            +bubble('Volpeon')(compact=true, highlight=true)
-                +slot('body')= loremIpsum
-
-        .c-box.u-themed.t-hi
-            +bubble()(compact=true theme='t-def')
-                +slot('body')= loremIpsum
-
-        .c-box.l-overflow(style='resize: vertical')
-            +bubble('Volpeon')(avatar=true)
-                +slot('header')
-                    .l-media.l-media--flush
-                        .l-media__block.l-media__block--main
-                            strong= 'Volpeon'
-                            small.u-ml-100= '@volpeon@mk.vulpes.one'
-                        small.l-media__block
-                            = '5 minutes ago'
-                            +icon('lock')(class='u-ml-100')
-                +slot('body')
-                    = loremIpsum
-                    = loremIpsum
-                    = loremIpsum
diff --git a/tpl/views/message-group.pug b/tpl/views/message-group.pug
new file mode 100644
index 0000000..3d1166f
--- /dev/null
+++ b/tpl/views/message-group.pug
@@ -0,0 +1,110 @@
+mixin sample-message-group
+    +message-group('Volpeon')&attributes(attributes)
+        +message()(theme=attributes.theme group=true compact=attributes.compact)
+            +slot('header')
+                strong= 'Volpeon'
+            +slot('body')
+                block
+            +slot('time')= '12:34'
+
+mixin view-message-group
+    +view('message-group', 'Message group')
+        .c-box.l-overflow(style='resize: vertical')
+            +message-group('Volpeon')
+                +message('Volpeon')(group=true)
+                    +slot('body')= 'Inline messages test'
+                    +slot('time')= '12:35'
+                +message()(group=true)
+                    +slot('body')= loremIpsum
+                    +slot('time')= '12:35'
+                +message()(group=true)
+                    +slot('body')= 'qwertzuiop'
+                    +slot('time')= '12:35'
+                +message()(group=true)
+                    +slot('body')= '🐈️🦊️'
+                    +slot('time')= '12:35'
+                +message()(group=true)
+                    +slot('body')= loremIpsum
+                    +slot('time')= '12:35'
+
+        .c-box.l-overflow(style='resize: vertical')
+            +message-group('Volpeon')(compact=true arrow=true left=true)
+                +message('Volpeon')(theme='t-up' compact=true group=true)
+                    +slot('body')= 'Compact bubble messages test'
+                    +slot('time')= '12:34'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= loremIpsum
+                    +slot('time')= '12:35'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= 'qwertzuiop'
+                    +slot('time')= '12:36'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= '🐈️🦊️'
+                    +slot('time')= '12:38'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= loremIpsum
+                    +slot('time')= '12:39'
+
+        .c-box.l-overflow(style='resize: vertical')
+            +message-group('Volpeon')(compact=true right=true)
+                strong.l-message-group__message= 'Volpeon'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= 'Compact bubble messages test'
+                    +slot('time')= '12:34'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= loremIpsum
+                    +slot('time')= '12:35'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= 'qwertzuiop'
+                    +slot('time')= '12:36'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= '🐈️🦊️'
+                    +slot('time')= '12:38'
+                +message()(theme='t-up' compact=true group=true)
+                    +slot('body')= loremIpsum
+                    +slot('time')= '12:39'
+
+        .c-box.l-overflow(style='resize: vertical')
+            +message-group('Volpeon')
+                +message()(theme='t-up' group=true)
+                    +slot('header')
+                        .l-media.l-media--flush
+                            .l-media__block.l-media__block--main
+                                strong= 'Volpeon'
+                                small.u-ml-100= '@volpeon@mk.vulpes.one'
+                            small.l-media__block
+                                = '5 minutes ago'
+                                +icon('lock')(class='u-ml-100')
+                    +slot('body')= 'Full width bubble messages test'
+                +message()(theme='t-up' group=true)
+                    +slot('body')= loremIpsum
+                +message()(theme='t-up' group=true)
+                    +slot('body')= 'qwertzuiop'
+                +message()(theme='t-up' group=true)
+                    +slot('body')= '🐈️🦊️'
+                +message()(theme='t-up' group=true)
+                    +slot('body')= loremIpsum
+
+        .c-box.l-overflow(style='resize: vertical')
+            +sample-message-group()(merge=false)= 'Inline message group merging'
+            +sample-message-group()(merge=true)= 'qwertzuiop'
+            +sample-message-group()(merge=true)= '🐈️🦊️'
+            +sample-message-group()(merge=true)= loremIpsum
+
+        .c-box.l-overflow(style='resize: vertical')
+            +sample-message-group()(theme='t-up' merge=false)= 'Bubble message group merging'
+            +sample-message-group()(theme='t-up' merge=true)= 'qwertzuiop'
+            +sample-message-group()(theme='t-up' merge=true)= '🐈️🦊️'
+            +sample-message-group()(theme='t-up' merge=true)= loremIpsum
+
+        .c-box.l-overflow(style='resize: vertical')
+            +sample-message-group()(theme='t-up' merge=false compact=true arrow=true left=true)= 'Bubble message group merging'
+            +sample-message-group()(theme='t-up' merge=true compact=true arrow=true left=true)= 'qwertzuiop'
+            +sample-message-group()(theme='t-up' merge=true compact=true arrow=true left=true)= '🐈️🦊️'
+            +sample-message-group()(theme='t-up' merge=true compact=true arrow=true left=true)= loremIpsum
+
+        .c-box.l-overflow(style='resize: vertical')
+            +sample-message-group()(theme='t-up' merge=false compact=true arrow=true right=true)= 'Bubble message group merging'
+            +sample-message-group()(theme='t-up' merge=true compact=true arrow=true right=true)= 'qwertzuiop'
+            +sample-message-group()(theme='t-up' merge=true compact=true arrow=true right=true)= '🐈️🦊️'
+            +sample-message-group()(theme='t-up' merge=true compact=true arrow=true right=true)= loremIpsum
diff --git a/tpl/views/message.pug b/tpl/views/message.pug
new file mode 100644
index 0000000..f256e41
--- /dev/null
+++ b/tpl/views/message.pug
@@ -0,0 +1,31 @@
+mixin view-message
+    +view('message', 'Message')
+        .c-box
+            +message('Volpeon')(compact=true theme='t-up')
+                +slot('body')= loremIpsum
+                +slot('time')
+                    = '12:34'
+                    +icon('lock')(class='u-ml-100')
+
+        .c-box
+            +message('Volpeon')(compact=true highlight=true theme='t-up')
+                +slot('body')= loremIpsum
+
+        .c-box.u-themed.t-hi
+            +message()(compact=true bubble=true theme='t-def')
+                +slot('body')= loremIpsum
+
+        .c-box.l-overflow(style='resize: vertical')
+            +message('Volpeon')(avatar=true theme='t-up')
+                +slot('header')
+                    .l-media.l-media--flush
+                        .l-media__block.l-media__block--main
+                            strong= 'Volpeon'
+                            small.u-ml-100= '@volpeon@mk.vulpes.one'
+                        small.l-media__block
+                            = '5 minutes ago'
+                            +icon('lock')(class='u-ml-100')
+                +slot('body')
+                    = loremIpsum
+                    = loremIpsum
+                    = loremIpsum
-- 
cgit v1.2.3-70-g09d2