DamusPurpleTranslationSetupView.swift (8082B)
1 // 2 // DamusPurpleTranslationSetupView.swift 3 // damus 4 // 5 // Created by Daniel D’Aquino on 2024-01-29. 6 // 7 8 import SwiftUI 9 10 fileprivate extension Animation { 11 static func content() -> Animation { 12 Animation.easeInOut(duration: 1.5).delay(0) 13 } 14 15 static func delayed_content() -> Animation { 16 Animation.easeInOut(duration: 1.5).delay(1) 17 } 18 } 19 20 struct DamusPurpleTranslationSetupView: View { 21 var damus_state: DamusState 22 var next_page: () -> Void 23 24 @State var start = false 25 @State var show_settings_change_confirmation_dialog = false 26 27 // MARK: - Helper functions 28 29 func update_user_settings_to_purple() { 30 if damus_state.settings.translation_service == .none { 31 set_translation_settings_to_purple() 32 self.next_page() 33 } 34 else { 35 show_settings_change_confirmation_dialog = true 36 } 37 } 38 39 func set_translation_settings_to_purple() { 40 damus_state.settings.translation_service = .purple 41 damus_state.settings.auto_translate = true 42 } 43 44 // MARK: - View layout 45 46 var body: some View { 47 VStack { 48 Image("damus-dark-logo") 49 .resizable() 50 .frame(width: 50, height: 50) 51 .clipShape(RoundedRectangle(cornerRadius: 10.0)) 52 .overlay( 53 RoundedRectangle(cornerRadius: 10) 54 .stroke(LinearGradient( 55 colors: [DamusColors.lighterPink.opacity(0.8), .white.opacity(0), DamusColors.deepPurple.opacity(0.6)], 56 startPoint: .topLeading, 57 endPoint: .bottomTrailing), lineWidth: 1) 58 ) 59 .shadow(radius: 5) 60 .padding(20) 61 .opacity(start ? 1.0 : 0.0) 62 .animation(.content(), value: start) 63 64 Text("You unlocked", comment: "Part 1 of 2 in message 'You unlocked automatic translations' the user gets when they sign up for Damus Purple" ) 65 .font(.largeTitle) 66 .fontWeight(.bold) 67 .foregroundStyle( 68 LinearGradient( 69 colors: [.black, .black, DamusColors.pink, DamusColors.lighterPink], 70 startPoint: start ? .init(x: -3, y: 4) : .bottomLeading, 71 endPoint: start ? .topTrailing : .init(x: 3, y: -4) 72 ) 73 ) 74 .scaleEffect(x: start ? 1 : 0.9, y: start ? 1 : 0.9) 75 .opacity(start ? 1.0 : 0.0) 76 .animation(.content(), value: start) 77 78 Image(systemName: "globe") 79 .resizable() 80 .frame(width: 96, height: 90) 81 .foregroundStyle( 82 LinearGradient( 83 colors: [.black, DamusColors.purple, .white, .white], 84 startPoint: start ? .init(x: -1, y: 1.5) : .bottomLeading, 85 endPoint: start ? .topTrailing : .init(x: 10, y: -11) 86 ) 87 ) 88 .animation(Animation.snappy(duration: 2).delay(0), value: start) 89 .shadow( 90 color: start ? DamusColors.purple.opacity(0.2) : DamusColors.purple.opacity(0.3), 91 radius: start ? 30 : 10 92 ) 93 .animation(Animation.snappy(duration: 2).delay(0), value: start) 94 .scaleEffect(x: start ? 1 : 0.8, y: start ? 1 : 0.8) 95 .opacity(start ? 1.0 : 0.0) 96 .animation(Animation.snappy(duration: 2).delay(0), value: start) 97 98 Text("Automatic translations", comment: "Part 1 of 2 in message 'You unlocked automatic translations' the user gets when they sign up for Damus Purple") 99 .font(.headline) 100 .fontWeight(.bold) 101 .foregroundStyle( 102 LinearGradient( 103 colors: [.black, .black, DamusColors.lighterPink, DamusColors.lighterPink], 104 startPoint: start ? .init(x: -3, y: 4) : .bottomLeading, 105 endPoint: start ? .topTrailing : .init(x: 3, y: -4) 106 ) 107 ) 108 .scaleEffect(x: start ? 1 : 0.9, y: start ? 1 : 0.9) 109 .opacity(start ? 1.0 : 0.0) 110 .animation(.content(), value: start) 111 .padding(.top, 10) 112 113 Text("As part of your Damus Purple membership, you get complimentary and automated translations. Would you like to enable Damus Purple translations?\n\nTip: You can always change this later in Settings → Translations", comment: "Message notifying the user that they get auto-translations as part of their service") 114 .lineSpacing(5) 115 .multilineTextAlignment(.center) 116 .foregroundStyle(.white.opacity(0.8)) 117 .padding(.horizontal, 20) 118 .padding(.top, 50) 119 .padding(.bottom, 20) 120 .opacity(start ? 1.0 : 0.0) 121 .animation(.delayed_content(), value: start) 122 123 Button(action: { 124 self.update_user_settings_to_purple() 125 }, label: { 126 HStack { 127 Spacer() 128 Text("Enable Purple auto-translations", comment: "Label for button that allows users to enable Damus Purple translations") 129 Spacer() 130 } 131 }) 132 .padding(.horizontal, 30) 133 .buttonStyle(GradientButtonStyle()) 134 .opacity(start ? 1.0 : 0.0) 135 .animation(.delayed_content(), value: start) 136 137 Button(action: { 138 self.next_page() 139 }, label: { 140 HStack { 141 Spacer() 142 Text("No, thanks", comment: "Label for button that allows users to reject enabling Damus Purple translations") 143 Spacer() 144 } 145 }) 146 .padding(.horizontal, 30) 147 .foregroundStyle(DamusColors.pink) 148 .opacity(start ? 1.0 : 0.0) 149 .padding() 150 .animation(.delayed_content(), value: start) 151 } 152 .background(content: { 153 ZStack { 154 Image("purple-blue-gradient-1") 155 .offset(CGSize(width: 300.0, height: -0.0)) 156 .opacity(start ? 1.0 : 0.2) 157 .background(.black) 158 Image("stars-bg") 159 .resizable(resizingMode: .stretch) 160 .frame(width: 500, height: 500) 161 .offset(x: -100, y: 50) 162 .scaleEffect(start ? 1 : 0.9) 163 .animation(.content(), value: start) 164 Image("purple-blue-gradient-1") 165 .offset(CGSize(width: 300.0, height: -0.0)) 166 .opacity(start ? 1.0 : 0.2) 167 168 } 169 }) 170 .onAppear(perform: { 171 withAnimation(.easeOut(duration: 6), { 172 start = true 173 }) 174 }) 175 .confirmationDialog( 176 NSLocalizedString("It seems that you already have a translation service configured. Would you like to switch to Damus Purple as your translator?", comment: "Confirmation dialog question asking users if they want their translation settings to be automatically switched to the Damus Purple translation service"), 177 isPresented: $show_settings_change_confirmation_dialog, 178 titleVisibility: .visible 179 ) { 180 Button(NSLocalizedString("Yes", comment: "User confirm Yes")) { 181 set_translation_settings_to_purple() 182 self.next_page() 183 }.keyboardShortcut(.defaultAction) 184 Button(NSLocalizedString("No", comment: "User confirm No"), role: .cancel) {} 185 } 186 } 187 } 188 189 #Preview { 190 DamusPurpleTranslationSetupView(damus_state: test_damus_state, next_page: {}) 191 }