1
0
Fork 0
mirror of https://github.com/anyproto/anytype-kotlin.git synced 2025-06-10 01:51:05 +09:00

#594: Open style toolbar from main toolbar (#758)

* #594: main toolbar style clicked + tests

* #594: fixes

* #594: run tests

* #594: fixes
This commit is contained in:
Konstantin Ivanov 2020-08-31 15:58:51 +03:00 committed by GitHub
parent 0709583844
commit 08d383ae4e
Signed by: github
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 308 additions and 144 deletions

View file

@ -46,8 +46,7 @@ data class ControlPanelState(
val config: StyleConfig? = null,
val props: Props? = null,
override val isVisible: Boolean,
val mode: StylingMode? = null,
val type: StylingType? = null
val mode: StylingMode? = null
) : Toolbar() {
companion object {
@ -56,8 +55,7 @@ data class ControlPanelState(
target = null,
config = null,
props = null,
mode = null,
type = null
mode = null
)
}
@ -176,7 +174,6 @@ data class ControlPanelState(
),
stylingToolbar = Toolbar.Styling(
isVisible = false,
type = null,
mode = null
),
mentionToolbar = Toolbar.MentionToolbar(

View file

@ -4,7 +4,6 @@ import com.agileburo.anytype.core_ui.common.Alignment
import com.agileburo.anytype.core_ui.common.Markup
import com.agileburo.anytype.core_ui.common.ThemeColor
import com.agileburo.anytype.core_ui.features.page.styling.StylingMode
import com.agileburo.anytype.core_ui.features.page.styling.StylingType
import com.agileburo.anytype.core_ui.state.ControlPanelState
import com.agileburo.anytype.core_ui.state.ControlPanelState.Companion.init
import com.agileburo.anytype.core_ui.state.ControlPanelState.Toolbar
@ -210,6 +209,7 @@ sealed class ControlPanelMachine {
override suspend fun reduce(state: ControlPanelState, event: Event) = when (event) {
is Event.OnSelectionChanged -> {
selection = event.selection
when {
state.focus == null -> state.copy()
state.stylingToolbar.isVisible -> {
@ -233,32 +233,12 @@ sealed class ControlPanelMachine {
is Event.StylingToolbar -> {
handleStylingToolbarEvent(event, state)
}
is Event.OnMarkupTextColorSelected -> state.copy(
stylingToolbar = state.stylingToolbar.copy(
type = StylingType.TEXT_COLOR
)
)
is Event.OnBlockTextColorSelected -> state.copy(
stylingToolbar = state.stylingToolbar.copy(
type = StylingType.TEXT_COLOR
)
)
is Event.OnBlockBackgroundColorSelected -> state.copy(
stylingToolbar = state.stylingToolbar.copy(
type = StylingType.BACKGROUND
)
)
is Event.OnBlockStyleSelected -> state.copy(
stylingToolbar = state.stylingToolbar.copy(
type = StylingType.STYLE
)
)
is Event.OnMarkupTextColorSelected -> state.copy()
is Event.OnBlockTextColorSelected -> state.copy()
is Event.OnBlockBackgroundColorSelected -> state.copy()
is Event.OnBlockStyleSelected -> state.copy()
is Event.OnAddBlockToolbarOptionSelected -> state.copy()
is Event.OnMarkupBackgroundColorSelected -> state.copy(
stylingToolbar = state.stylingToolbar.copy(
type = StylingType.BACKGROUND
)
)
is Event.OnMarkupBackgroundColorSelected -> state.copy()
is Event.OnMarkupContextMenuTextColorClicked -> {
selection = event.selection
val target = target(event.target)
@ -270,7 +250,6 @@ sealed class ControlPanelMachine {
stylingToolbar = state.stylingToolbar.copy(
isVisible = true,
mode = StylingMode.MARKUP,
type = StylingType.TEXT_COLOR,
target = target,
props = props
)
@ -287,7 +266,6 @@ sealed class ControlPanelMachine {
stylingToolbar = state.stylingToolbar.copy(
isVisible = true,
mode = StylingMode.MARKUP,
type = StylingType.BACKGROUND,
target = target,
props = props
)
@ -334,7 +312,6 @@ sealed class ControlPanelMachine {
stylingToolbar = state.stylingToolbar.copy(
isVisible = true,
mode = StylingMode.BLOCK,
type = StylingType.TEXT_COLOR,
target = target,
props = Toolbar.Styling.Props(
isBold = target.isBold,
@ -358,7 +335,6 @@ sealed class ControlPanelMachine {
stylingToolbar = state.stylingToolbar.copy(
isVisible = true,
mode = StylingMode.BLOCK,
type = StylingType.BACKGROUND,
target = target,
props = Toolbar.Styling.Props(
isBold = target.isBold,
@ -375,31 +351,16 @@ sealed class ControlPanelMachine {
}
is Event.OnBlockActionToolbarStyleClicked -> {
val target = target(event.target)
val config = event.target.getStyleConfig(
focus = null,
selection = null
)
val props = Toolbar.Styling.Props(
isBold = target.isBold,
isItalic = target.isItalic,
isStrikethrough = target.isStrikethrough,
isCode = target.isCode,
isLinked = target.isLinked,
color = target.color,
background = target.background,
alignment = target.alignment
)
state.copy(
mainToolbar = state.mainToolbar.copy(
isVisible = false
),
stylingToolbar = state.stylingToolbar.copy(
isVisible = true,
mode = StylingMode.BLOCK,
type = StylingType.STYLE,
mode = getModeForSelection(selection),
target = target(event.target),
config = config,
props = props
config = event.target.getStyleConfig(true, selection),
props = getPropsForSelection(target, selection)
)
)
}
@ -496,6 +457,29 @@ sealed class ControlPanelMachine {
}
}
private fun getModeForSelection(selection: IntRange?): StylingMode {
return if (selection != null && selection.first != selection.last) StylingMode.MARKUP
else StylingMode.BLOCK
}
private fun getPropsForSelection(target: Toolbar.Styling.Target, selection: IntRange?)
: Toolbar.Styling.Props {
return if (selection != null && selection.first != selection.last) {
getMarkupLevelStylingProps(target, selection)
} else {
Toolbar.Styling.Props(
isBold = target.isBold,
isItalic = target.isItalic,
isStrikethrough = target.isStrikethrough,
isCode = target.isCode,
isLinked = target.isLinked,
color = target.color,
background = target.background,
alignment = target.alignment
)
}
}
private fun getMarkupLevelStylingProps(
target: Toolbar.Styling.Target,
selection: IntRange
@ -584,21 +568,9 @@ sealed class ControlPanelMachine {
event: Event.StylingToolbar,
state: ControlPanelState
): ControlPanelState = when (event) {
is Event.StylingToolbar.OnBackgroundSlideSelected -> state.copy(
stylingToolbar = state.stylingToolbar.copy(
type = StylingType.BACKGROUND
)
)
is Event.StylingToolbar.OnColorSlideSelected -> state.copy(
stylingToolbar = state.stylingToolbar.copy(
type = StylingType.TEXT_COLOR
)
)
is Event.StylingToolbar.OnAlignmentSelected -> state.copy(
stylingToolbar = state.stylingToolbar.copy(
type = StylingType.STYLE
)
)
is Event.StylingToolbar.OnBackgroundSlideSelected -> state.copy()
is Event.StylingToolbar.OnColorSlideSelected -> state.copy()
is Event.StylingToolbar.OnAlignmentSelected -> state.copy()
is Event.StylingToolbar.OnClose -> state.copy(
stylingToolbar = Toolbar.Styling.reset(),
mainToolbar = state.mainToolbar.copy(

View file

@ -914,46 +914,14 @@ class PageViewModel(
}
}
fun onMarkupTextColorAction(color: String) {
Timber.d("STATE : ${controlPanelViewState.value}")
controlPanelInteractor.onEvent(
ControlPanelMachine.Event.OnMarkupTextColorSelected
)
viewModelScope.launch {
markupActionPipeline.send(
MarkupAction(
type = Markup.Type.TEXT_COLOR,
param = color
)
)
}
}
fun onStyleBackgroundSlideClicked() {
private fun onStyleBackgroundSlideClicked() {
controlPanelInteractor.onEvent(ControlPanelMachine.Event.StylingToolbar.OnBackgroundSlideSelected)
}
fun onStyleColorSlideClicked() {
private fun onStyleColorSlideClicked() {
controlPanelInteractor.onEvent(ControlPanelMachine.Event.StylingToolbar.OnColorSlideSelected)
}
fun onMarkupBackgroundColorAction(color: String) {
controlPanelInteractor.onEvent(
ControlPanelMachine.Event.OnMarkupBackgroundColorSelected
)
viewModelScope.launch {
markupActionPipeline.send(
MarkupAction(
type = Markup.Type.BACKGROUND_COLOR,
param = color
)
)
}
}
private fun onStyleToolbarMarkupAction(type: Markup.Type, param: String? = null) {
viewModelScope.launch {
markupActionPipeline.send(

View file

@ -68,8 +68,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -121,8 +120,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -174,8 +172,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -232,8 +229,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -285,8 +281,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -337,8 +332,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -381,8 +375,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -434,8 +427,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false,
@ -459,8 +451,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,
@ -502,8 +493,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,
@ -527,8 +517,7 @@ class ControlPanelStateReducerTest {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,
@ -607,8 +596,7 @@ class ControlPanelStateReducerTest {
color = "yellow",
background = "red"
),
mode = StylingMode.MARKUP,
type = null
mode = StylingMode.MARKUP
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -674,8 +662,7 @@ class ControlPanelStateReducerTest {
color = "yellow",
background = "red"
),
mode = StylingMode.MARKUP,
type = null
mode = StylingMode.MARKUP
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -744,8 +731,7 @@ class ControlPanelStateReducerTest {
color = "yellow",
background = "red"
),
mode = StylingMode.MARKUP,
type = null
mode = StylingMode.MARKUP
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -810,8 +796,7 @@ class ControlPanelStateReducerTest {
color = "yellow",
background = "red"
),
mode = StylingMode.MARKUP,
type = null
mode = StylingMode.MARKUP
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
@ -828,4 +813,252 @@ class ControlPanelStateReducerTest {
actual = result
)
}
@Test
fun `should show style toolbar in markup mode after main toolbar style clicked`() {
val id = MockDataFactory.randomUuid()
val block = Block(
id = id,
children = emptyList(),
content = Block.Content.Text(
text = "Foo Bar",
style = Block.Content.Text.Style.P,
marks = listOf(
Block.Content.Text.Mark(
range = 0..3,
type = Block.Content.Text.Mark.Type.BOLD
)
),
color = "yellow",
backgroundColor = "red",
align = Block.Align.AlignLeft
),
fields = Block.Fields.empty()
)
runBlocking {
reducer.reduce(
state = ControlPanelState.init(),
event = ControlPanelMachine.Event.OnFocusChanged(
id = id,
style = Block.Content.Text.Style.P
)
)
}
runBlocking {
reducer.reduce(
state = ControlPanelState.init(),
event = ControlPanelMachine.Event.OnSelectionChanged(selection = IntRange(0, 3))
)
}
val given = ControlPanelState(
focus = ControlPanelState.Focus(
id = id,
type = ControlPanelState.Focus.Type.P
),
mainToolbar = ControlPanelState.Toolbar.Main(
isVisible = true
),
stylingToolbar = ControlPanelState.Toolbar.Styling.reset(),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
),
mentionToolbar = ControlPanelState.Toolbar.MentionToolbar.reset()
)
val result = runBlocking {
reducer.reduce(
state = given,
event = ControlPanelMachine.Event.OnBlockActionToolbarStyleClicked(
target = block
)
)
}
val expected = ControlPanelState(
focus = ControlPanelState.Focus(
id = id,
type = ControlPanelState.Focus.Type.P
),
mainToolbar = ControlPanelState.Toolbar.Main(
isVisible = false
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = true,
target = ControlPanelState.Toolbar.Styling.Target(
text = "Foo Bar",
color = "yellow",
background = "red",
alignment = Alignment.START,
marks = listOf(
Markup.Mark(0, 3, Markup.Type.BOLD)
)
),
config = StyleConfig(
visibleTypes = listOf(
StylingType.STYLE,
StylingType.TEXT_COLOR,
StylingType.BACKGROUND
),
enabledAlignment = listOf(),
enabledMarkup = listOf(
Markup.Type.BOLD,
Markup.Type.ITALIC,
Markup.Type.STRIKETHROUGH,
Markup.Type.KEYBOARD,
Markup.Type.LINK
)
),
props = ControlPanelState.Toolbar.Styling.Props(
isBold = true,
isItalic = false,
isStrikethrough = false,
isCode = false,
isLinked = false,
alignment = Alignment.START,
color = "yellow",
background = "red"
),
mode = StylingMode.MARKUP
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
),
mentionToolbar = ControlPanelState.Toolbar.MentionToolbar.reset()
)
assertEquals(
expected = expected,
actual = result
)
}
@Test
fun `should show style toolbar in block mode after main toolbar style clicked`() {
val id = MockDataFactory.randomUuid()
val block = Block(
id = id,
children = emptyList(),
content = Block.Content.Text(
text = "Foo Bar",
style = Block.Content.Text.Style.P,
marks = listOf(
Block.Content.Text.Mark(
range = 0..3,
type = Block.Content.Text.Mark.Type.BOLD
)
),
color = "yellow",
backgroundColor = "red",
align = Block.Align.AlignCenter
),
fields = Block.Fields.empty()
)
runBlocking {
reducer.reduce(
state = ControlPanelState.init(),
event = ControlPanelMachine.Event.OnFocusChanged(
id = id,
style = Block.Content.Text.Style.P
)
)
}
runBlocking {
reducer.reduce(
state = ControlPanelState.init(),
event = ControlPanelMachine.Event.OnSelectionChanged(selection = IntRange(1, 1))
)
}
val given = ControlPanelState(
focus = ControlPanelState.Focus(
id = id,
type = ControlPanelState.Focus.Type.P
),
mainToolbar = ControlPanelState.Toolbar.Main(
isVisible = true
),
stylingToolbar = ControlPanelState.Toolbar.Styling.reset(),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
),
mentionToolbar = ControlPanelState.Toolbar.MentionToolbar.reset()
)
val result = runBlocking {
reducer.reduce(
state = given,
event = ControlPanelMachine.Event.OnBlockActionToolbarStyleClicked(
target = block
)
)
}
val expected = ControlPanelState(
focus = ControlPanelState.Focus(
id = id,
type = ControlPanelState.Focus.Type.P
),
mainToolbar = ControlPanelState.Toolbar.Main(
isVisible = false
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = true,
target = ControlPanelState.Toolbar.Styling.Target(
text = "Foo Bar",
color = "yellow",
background = "red",
alignment = Alignment.CENTER,
marks = listOf(
Markup.Mark(0, 3, Markup.Type.BOLD)
)
),
config = StyleConfig(
visibleTypes = listOf(
StylingType.STYLE,
StylingType.TEXT_COLOR,
StylingType.BACKGROUND
),
enabledAlignment = listOf(
Alignment.START,
Alignment.CENTER,
Alignment.END
),
enabledMarkup = listOf(
Markup.Type.BOLD,
Markup.Type.ITALIC,
Markup.Type.STRIKETHROUGH,
Markup.Type.KEYBOARD,
Markup.Type.LINK
)
),
props = ControlPanelState.Toolbar.Styling.Props(
isBold = false,
isItalic = false,
isStrikethrough = false,
isCode = false,
isLinked = false,
alignment = Alignment.CENTER,
color = "yellow",
background = "red"
),
mode = StylingMode.BLOCK
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = false
),
mentionToolbar = ControlPanelState.Toolbar.MentionToolbar.reset()
)
assertEquals(
expected = expected,
actual = result
)
}
}

View file

@ -102,8 +102,7 @@ class EditorMultiSelectModeTest : EditorPresentationTestSetup() {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,
@ -204,8 +203,7 @@ class EditorMultiSelectModeTest : EditorPresentationTestSetup() {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,
@ -324,8 +322,7 @@ class EditorMultiSelectModeTest : EditorPresentationTestSetup() {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,

View file

@ -108,8 +108,7 @@ class EditorScrollAndMoveTest : EditorPresentationTestSetup() {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,
@ -206,8 +205,7 @@ class EditorScrollAndMoveTest : EditorPresentationTestSetup() {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,
@ -308,8 +306,7 @@ class EditorScrollAndMoveTest : EditorPresentationTestSetup() {
),
stylingToolbar = ControlPanelState.Toolbar.Styling(
isVisible = false,
mode = null,
type = null
mode = null
),
multiSelect = ControlPanelState.Toolbar.MultiSelect(
isVisible = true,