diff --git a/composeApp/src/androidMain/kotlin/net/codinux/banking/ui/dialogs/EnterTanDialogPreview.kt b/composeApp/src/androidMain/kotlin/net/codinux/banking/ui/dialogs/EnterTanDialogPreview.kt index d2ddc0a..ef13d81 100644 --- a/composeApp/src/androidMain/kotlin/net/codinux/banking/ui/dialogs/EnterTanDialogPreview.kt +++ b/composeApp/src/androidMain/kotlin/net/codinux/banking/ui/dialogs/EnterTanDialogPreview.kt @@ -34,6 +34,19 @@ fun EnterTanDialogPreview_TanImage() { EnterTanDialog(TanChallengeReceived(tanChallenge) { }) { } } +@Preview +@Composable +fun EnterTanDialogPreview_TanImage_DecodingError() { + val tanMethod = TanMethod("photoTAN-Verfahren", TanMethodType.photoTan, "902", 6, AllowedTanFormat.Numeric) + val tanImage = TanImage("image/png", "", "Ja Hoppla, da ist dann wohl etwas schief gelaufen. Hinterfragen Sie Ihre eigene Existenz woran das liegen könnte!") + + val bank = BankViewInfo("10010010", "Ihr krasser Login Name", "Phantasie Bank", BankingGroup.Comdirect) + + val tanChallenge = TanChallenge(TanChallengeType.Image, ActionRequiringTan.GetAccountInfo, "Geben Sie die TAN ein", tanMethod.identifier, listOf(tanMethod), null, emptyList(), tanImage, null, bank) + + EnterTanDialog(TanChallengeReceived(tanChallenge) { }) { } +} + @Preview @Composable fun EnterTanDialogPreview_WithMultipleTanMedia() { // shows that dialog is really long if a TAN Image, select box for TAN Media, bank name, bank account, ... gets displayed @@ -65,5 +78,15 @@ fun EnterTanDialogPreview_Flickercode() { val bank = BankViewInfo("12345678", "SupiDupiNutzer", "Abzockbank", BankingGroup.Postbank) val tanChallenge = TanChallenge(TanChallengeType.Flickercode, ActionRequiringTan.GetAccountInfo, "Geben Sie die TAN ein", tanMethods.first().identifier, tanMethods, bank = bank, flickerCode = FlickerCode("100880077104", "0604800771040F")) + EnterTanDialog(TanChallengeReceived(tanChallenge) { }) { } +} + +@Preview +@Composable +fun EnterTanDialogPreview_Flickercode_DecodingError() { + val tanMethods = listOf(TanMethod("chipTAN Flickercode", TanMethodType.ChipTanFlickercode, "902")) + val bank = BankViewInfo("12345678", "SupiDupiNutzer", "Abzockbank", BankingGroup.Postbank) + val tanChallenge = TanChallenge(TanChallengeType.Flickercode, ActionRequiringTan.GetAccountInfo, "Geben Sie die TAN ein", tanMethods.first().identifier, tanMethods, bank = bank, flickerCode = FlickerCode("100880077104", "", decodingError = "Ja Hoppla, da ist dann wohl etwas schief gelaufen.")) + EnterTanDialog(TanChallengeReceived(tanChallenge) { }) { } } \ No newline at end of file diff --git a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/tan/ChipTanFlickerCodeView.kt b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/tan/ChipTanFlickerCodeView.kt index c1b9d9a..58fda29 100644 --- a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/tan/ChipTanFlickerCodeView.kt +++ b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/tan/ChipTanFlickerCodeView.kt @@ -14,6 +14,7 @@ import androidx.compose.ui.graphics.Color import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.dp import net.codinux.banking.client.model.tan.FlickerCode +import net.codinux.banking.ui.model.Config.NewLine import net.codinux.banking.ui.service.tan.Bit import net.codinux.banking.ui.service.tan.FlickerCodeAnimator import net.codinux.banking.ui.service.tan.Step @@ -99,49 +100,55 @@ fun ChipTanFlickerCodeView(flickerCode: FlickerCode, textColor: Color = Color.Bl Column(Modifier.fillMaxWidth()) { - Row(Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically) { - ImageSizeControls(true, true, textColor, { decreaseSize() }, { increaseSize() }) - - Spacer(Modifier.width(16.dp)) - - Text("Geschw.", color = textColor) - - IconButton({ decreaseFrequency() }, enabled = frequency - FrequencyStepSize > 0) { - Icon(Icons.AutoMirrored.Filled.DirectionsWalk, contentDescription = "Frequenz verkleinern", Modifier.size(28.dp), tint = textColor) - } - - IconButton({ increaseFrequency() }, enabled = frequency - FrequencyStepSize > 0) { - Icon(Icons.AutoMirrored.Filled.DirectionsRun, contentDescription = "Frequenz vergrößern", Modifier.size(28.dp), tint = textColor) - } - - IconButton({ toggleIsPaused() }) { - if (isPaused) { - Icon(Icons.Filled.PlayArrow, "FlickerCode Animation wieder starten", Modifier.size(28.dp), tint = textColor) - } else { - Icon(Icons.Filled.Pause, "FlickerCode Animation pausieren", Modifier.size(28.dp), tint = textColor) - } - } + flickerCode.decodingError?.let { + Text("Hier sollte eigentlich ein FlickerCode stehen, dieser konnte jedoch nicht dekodiert werden:${NewLine}${flickerCode.decodingError}", color = MaterialTheme.colors.error, modifier = Modifier.padding(vertical = 8.dp)) } - Row(Modifier.background(Color.Black).padding(vertical = 20.dp), verticalAlignment = Alignment.CenterVertically) { - Row(Modifier.fillMaxWidth().height(stripesHeight).background(Color.Black), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically) { - ChipTanFlickerCodeStripeView(step.bit1, stripesWidth, true) + flickerCode.parsedDataSet?.let { + Row(Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically) { + ImageSizeControls(true, true, textColor, { decreaseSize() }, { increaseSize() }) - Spacer(Modifier.width(spaceBetweenStripes)) + Spacer(Modifier.width(16.dp)) - ChipTanFlickerCodeStripeView(step.bit2, stripesWidth) + Text("Geschw.", color = textColor) - Spacer(Modifier.width(spaceBetweenStripes)) + IconButton({ decreaseFrequency() }, enabled = frequency - FrequencyStepSize > 0) { + Icon(Icons.AutoMirrored.Filled.DirectionsWalk, contentDescription = "Frequenz verkleinern", Modifier.size(28.dp), tint = textColor) + } - ChipTanFlickerCodeStripeView(step.bit3, stripesWidth) + IconButton({ increaseFrequency() }, enabled = frequency - FrequencyStepSize > 0) { + Icon(Icons.AutoMirrored.Filled.DirectionsRun, contentDescription = "Frequenz vergrößern", Modifier.size(28.dp), tint = textColor) + } - Spacer(Modifier.width(spaceBetweenStripes)) + IconButton({ toggleIsPaused() }) { + if (isPaused) { + Icon(Icons.Filled.PlayArrow, "FlickerCode Animation wieder starten", Modifier.size(28.dp), tint = textColor) + } else { + Icon(Icons.Filled.Pause, "FlickerCode Animation pausieren", Modifier.size(28.dp), tint = textColor) + } + } + } - ChipTanFlickerCodeStripeView(step.bit4, stripesWidth) + Row(Modifier.background(Color.Black).padding(vertical = 20.dp), verticalAlignment = Alignment.CenterVertically) { + Row(Modifier.fillMaxWidth().height(stripesHeight).background(Color.Black), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically) { + ChipTanFlickerCodeStripeView(step.bit1, stripesWidth, true) - Spacer(Modifier.width(spaceBetweenStripes)) + Spacer(Modifier.width(spaceBetweenStripes)) - ChipTanFlickerCodeStripeView(step.bit5, stripesWidth, true) + ChipTanFlickerCodeStripeView(step.bit2, stripesWidth) + + Spacer(Modifier.width(spaceBetweenStripes)) + + ChipTanFlickerCodeStripeView(step.bit3, stripesWidth) + + Spacer(Modifier.width(spaceBetweenStripes)) + + ChipTanFlickerCodeStripeView(step.bit4, stripesWidth) + + Spacer(Modifier.width(spaceBetweenStripes)) + + ChipTanFlickerCodeStripeView(step.bit5, stripesWidth, true) + } } } } diff --git a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/dialogs/EnterTanDialog.kt b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/dialogs/EnterTanDialog.kt index cb95c36..27fde21 100644 --- a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/dialogs/EnterTanDialog.kt +++ b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/dialogs/EnterTanDialog.kt @@ -24,6 +24,7 @@ import net.codinux.banking.ui.config.Colors import net.codinux.banking.ui.forms.CaptionText import net.codinux.banking.ui.forms.OutlinedTextField import net.codinux.banking.ui.forms.Select +import net.codinux.banking.ui.model.Config.NewLine import net.codinux.banking.ui.model.TanChallengeReceived import net.codinux.banking.ui.model.error.ErroneousAction import net.codinux.banking.ui.service.createImageBitmap @@ -142,6 +143,10 @@ fun EnterTanDialog(tanChallengeReceived: TanChallengeReceived, onDismiss: () -> } challenge.tanImage?.let { tanImage -> + tanImage.decodingError?.let { + Text("Hier sollte eigentlich das TAN Bild angezeigt werden, dieses konnte jedoch nicht dekodiert werden:$NewLine${tanImage.decodingError}", color = MaterialTheme.colors.error, modifier = Modifier.padding(vertical = 8.dp)) + } + if (tanImage.decodingSuccessful) { val imageBytes = Base64.decode(tanImage.imageBytesBase64) diff --git a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/service/tan/FlickerCodeAnimator.kt b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/service/tan/FlickerCodeAnimator.kt index ed6c732..a46a373 100644 --- a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/service/tan/FlickerCodeAnimator.kt +++ b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/service/tan/FlickerCodeAnimator.kt @@ -29,10 +29,12 @@ class FlickerCodeAnimator { fun animateFlickerCode(flickerCode: FlickerCode, showStep: (Step) -> Unit) { // TODO: find better coroutine scope stop() // stop may still running previous animation - animationJob = GlobalScope.launch(Dispatchers.Default) { - val steps = FlickerCodeStepsCalculator().calculateSteps(flickerCode.parsedDataSet) + flickerCode.parsedDataSet?.let { parsedDataSet -> + animationJob = GlobalScope.launch(Dispatchers.Default) { + val steps = FlickerCodeStepsCalculator().calculateSteps(parsedDataSet) - calculateAnimation(steps, showStep) + calculateAnimation(steps, showStep) + } } }