Clients/Client2018/content/internal/Chat/Modules/LuaChat/Components/ChatInputBarTablet.lua

local CoreGui = game:GetService("CoreGui")
local PlayerService = game:GetService("Players")

local Modules = CoreGui.RobloxGui.Modules
local Common = Modules.Common
local LuaChat = Modules.LuaChat

local Constants = require(LuaChat.Constants)
local Create = require(LuaChat.Create)
local DialogInfo = require(LuaChat.DialogInfo)
local getInputEvent = require(LuaChat.Utils.getInputEvent)
local Intent = DialogInfo.Intent
local SetRoute = require(LuaChat.Actions.SetRoute)
local Signal = require(Common.Signal)
local Text = require(LuaChat.Text)

local FFlagLuaChatShareGameToChatFromChat = settings():GetFFlag("LuaChatShareGameToChatFromChat")

local GAME_ICON = "rbxasset://textures/ui/LuaChat/icons/ic-game.png"
local PRESSED_GAME_ICON = "rbxasset://textures/ui/LuaChat/icons/ic-game-pressed-24x24.png"
local SEND_BUTTON_IMAGE = "rbxasset://textures/ui/LuaChat/graphic/send-white.png"
local SEND_ICON = "rbxasset://textures/ui/LuaChat/icons/ic-send.png"

local GAME_ICON_BOTTOM_PADDING = 8
local MIN_TEXT_HEIGHT = 36
local RIGHT_BUTTON_WIDTH = 52
local RIGHT_BUTTON_HEIGHT = 48
local SEND_BUTTON_BOTTOM_PADDING = 16
local TEXT_FRAME_HEIGHT_DIFF = 28

local function isMessageValid(text)
	if #text >= 160 then
		return false
	end

	-- Only whitespace
	if text:match("^%s*$") then
		return false
	end

	return true
end

local ChatInputBar = {}

function ChatInputBar.new(appState)
	local self = {}
	self.appState = appState
	self.sendButtonEnabled = false
	self.SendButtonPressed = Signal.new()
	self.UserChangedText = Signal.new()
	self.blockUserChangedText = true
	self._analytics = appState.analytics

	self.rbx = Create.new "TextButton" {
		Name = "ChatInputBar",
		Text = "",
		AutoButtonColor = false,
		BackgroundColor3 = Constants.Color.WHITE,
		BorderSizePixel = 0,
		Size = UDim2.new(1, 0, 0, 64),

		Create.new "Frame" {
			Name = "TopBorder",
			Size = UDim2.new(1, 0, 0, 1),
			BackgroundColor3 = Constants.Color.GRAY3,
			BorderSizePixel = 0,
			Position = UDim2.new(0, 0, 0, 0),
		},

		Create.new "Frame" {
			Name = "InputBarFrame",
			Size = UDim2.new(1, -68, 1, -12),
			Position = UDim2.new(0, 12, 0, 6),
			BackgroundTransparency = 1,

			Create.new "TextBox" {
				Name = "InputText",
				BackgroundTransparency = 1,
				Size = UDim2.new(1, 0, 1, 0),
				Position = UDim2.new(0, 0, 0, 0),
				Text = "",
				Font = Enum.Font.SourceSans,
				TextSize = Constants.Font.FONT_SIZE_18,
				TextColor3 = Constants.Text.INPUT,
				TextXAlignment = Enum.TextXAlignment.Left,
				TextYAlignment = Enum.TextYAlignment.Center,
				TextWrapped = true,
				OverlayNativeInput = true,
				ClearTextOnFocus = false,
				ManualFocusRelease = true,
				MultiLine = true,
				PlaceholderText = appState.localization:Format("Feature.Chat.Label.ChatInputPlaceholder"),
				PlaceholderColor3 = Constants.Text.INPUT_PLACEHOLDER,
			}
		},

		Create.new "ImageButton" {
			Name = "GameButton",
			BackgroundTransparency = 1,
			Size = UDim2.new(0, RIGHT_BUTTON_WIDTH, 0, RIGHT_BUTTON_HEIGHT),
			AnchorPoint = Vector2.new(0, 0),
			Position = UDim2.new(1, -RIGHT_BUTTON_WIDTH, 1, -RIGHT_BUTTON_HEIGHT - GAME_ICON_BOTTOM_PADDING),
			Visible = FFlagLuaChatShareGameToChatFromChat,

			Create.new "ImageLabel" {
				Name = "GameIcon",
				BackgroundTransparency = 1,
				Size = UDim2.new(0, 24, 0, 24),
				AnchorPoint = Vector2.new(0.5, 0.5),
				Position = UDim2.new(0.5, 0, 0.5, 0),
				Image = GAME_ICON,
			}
		},

		Create.new "ImageButton" {
			Name = "SendButton",
			BackgroundTransparency = 1,
			Size = UDim2.new(0, 32, 0, 32),
			AnchorPoint = Vector2.new(0, 1),
			Position = UDim2.new(1, -12 - 32, 1, -SEND_BUTTON_BOTTOM_PADDING),
			Image = SEND_BUTTON_IMAGE,
			ImageColor3 = Constants.Color.GRAY3,
			Visible = not FFlagLuaChatShareGameToChatFromChat,

			Create.new "ImageLabel" {
				Name = "Icon",
				BackgroundTransparency = 1,
				Size = UDim2.new(0, 16, 0, 16),
				Position = UDim2.new(0.5, 1, 0.5, 0),
				AnchorPoint = Vector2.new(0.5, 0.5),
				Image = SEND_ICON,
			}
		},
	}

	self.rbx.TouchTap:Connect(function()
		--Sink this tap so the keyboard doesn't close
	end)

	self.textBox = self.rbx.InputBarFrame.InputText

	self.textBox.Focused:Connect(function()
		self.blockUserChangedText = false
	end)

	self.textBox.FocusLost:Connect(function()
		if #self.textBox.Text <= 0 then
			self:Reset()
		end
	end)

	self.textBox:GetPropertyChangedSignal("Text"):Connect(function()
		local text = self.textBox.Text
		if FFlagLuaChatShareGameToChatFromChat then
			self:RightButtonVisibility(string.len(text) == 0)
		end
		local sizeY = Text.GetTextHeight(text, self.textBox.Font, self.textBox.TextSize, self.textBox.AbsoluteSize.X)
		local maxTextHeight = Text.GetTextHeight("A\nB\nC\nD\nE", self.textBox.Font, self.textBox.TextSize,
			self.textBox.AbsoluteSize.X) * 0.95

		if sizeY < MIN_TEXT_HEIGHT then
			sizeY = MIN_TEXT_HEIGHT
		elseif sizeY > maxTextHeight then
			sizeY = maxTextHeight
		end

		self.rbx.Size = UDim2.new(1, 0, 0, sizeY + TEXT_FRAME_HEIGHT_DIFF)

		if isMessageValid(text) then
			self:SetSendButtonEnabled(true)
		else
			self:SetSendButtonEnabled(false)
		end

		if not self.blockUserChangedText then
			self.UserChangedText:Fire()
		end
	end)

	getInputEvent(self.rbx.SendButton):Connect(function()
		self:SendMessage()
	end)

	if FFlagLuaChatShareGameToChatFromChat then
		getInputEvent(self.rbx.GameButton):Connect(function()
			self:ReportBrowseGamesButtonTappedEvent()
			if self.textBox:IsFocused() then
				self.textBox:ReleaseFocus()
			end
			appState.store:dispatch(SetRoute(Intent.BrowseGames, {}))
		end)

		self.rbx.GameButton.InputBegan:Connect(function()
			self:SetGameButtonIcon(true)
		end)

		self.rbx.GameButton.InputEnded:Connect(function()
			self:SetGameButtonIcon(false)
		end)
	end

	setmetatable(self, ChatInputBar)
	return self
end

function ChatInputBar:Reset()
	self.blockUserChangedText = true
	self.textBox.Text = ""
	self.textBox:ResetKeyboardMode()
	self.blockUserChangedText = false
end

function ChatInputBar:RightButtonVisibility(isInputBoxEmpty)
	self.rbx.SendButton.Visible = not isInputBoxEmpty
	self.rbx.GameButton.Visible = isInputBoxEmpty
end

function ChatInputBar:SendMessage()
	local text = self.textBox.Text
	if not isMessageValid(text) then
		return
	end

	self:Reset()
	self.SendButtonPressed:Fire(text)
end

function ChatInputBar:SetSendButtonEnabled(value)
	if self.sendButtonEnabled == value then
		return
	end
	self.sendButtonEnabled = value

	local color = value and Constants.Color.BLUE_PRIMARY or Constants.Color.GRAY3
	self.rbx.SendButton.ImageColor3 = color
end

function ChatInputBar:SetGameButtonIcon(isPressed)
	if isPressed then
		self.rbx.GameButton.GameIcon.Image = PRESSED_GAME_ICON
	else
		self.rbx.GameButton.GameIcon.Image = GAME_ICON
	end
end

function ChatInputBar:GetHeight()
	return self.rbx.Size.Y.Offset
end

function ChatInputBar:ReportBrowseGamesButtonTappedEvent()
	local eventContext = "touch"
	local eventName = "chooseGameToShare"

	local player = PlayerService.LocalPlayer
	local userId = "UNKNOWN"
	if player then
		userId = tostring(player.UserId)
	end

	local additionalArgs = {
		uid = userId,
		cid = self.appState.store:getState().ChatAppReducer.ActiveConversationId
	}

	self._analytics.EventStream:setRBXEventStream(eventContext, eventName, additionalArgs)
end

ChatInputBar.__index = ChatInputBar
return ChatInputBar