Files
rojo/plugin/src/App/Components/Spinner.lua
Reselim cae4c46669 New UI (#367)
* Add Flipper

* Remove old UI

* Add boilerplate UI

* Change plugin version

* Merge upstream

* Bunch of new UI changes

Too lazy to list them all in individual commits

* Touch ripple for buttons and a few other things

* Make the close button on the PluginGui work

* Set button state to guiEnabled

* Implement Connecting, NotConnected; add Header; don't update plugin button on render

* Replace mapLerpColor with mapLerp

* Update blendAlpha to be 0 without any values

* Add ActionFillTransparency to Theme.Button

* Suffix all Theme entries

* Update Flipper

* Add disconnect button

* Remove cancel button

* Add settings page

* Add scrollbar and dark theme support to settings

* Include settings in startSession

* Set context default value to nil

I always thought this was the name, lol...

* Add Error page

* Fix preloadAssets

* Fix preloadAssets import

* Update checkbox colors a little

* Add setting descriptions

* Fix scrolling frame in settings panel

* Remove .vscode

* Rename Throbber to Spinner

* Update merge

* Move Spinner images to assets

* Change casing of directories

* Remove old directories

* Add comments to getDerivedStateFromProps

* Account for offset in host TextBox size

* Turn width variables into constants

* Attempt to fix the comments

* Add a missing comma in Settings

* Remove a double space

* Remove Dummy object

* Move most of the Studio logic out of render

* Don't truncate port input

* Replace merge with Dictionary.merge

* Replace "Got it!" with "Okay"

* Add projectName to setStatus call

* Add Flipper to build.rs
2020-12-14 11:07:39 -08:00

66 lines
1.5 KiB
Lua

local RunService = game:GetService("RunService")
local Rojo = script:FindFirstAncestor("Rojo")
local Plugin = Rojo.Plugin
local Roact = require(Rojo.Roact)
local Theme = require(Plugin.App.Theme)
local Assets = require(Plugin.Assets)
local ROTATIONS_PER_SECOND = 1.75
local e = Roact.createElement
local Spinner = Roact.PureComponent:extend("Spinner")
function Spinner:init()
self.rotation, self.setRotation = Roact.createBinding(0)
end
function Spinner:render()
return Theme.with(function(theme)
return e("ImageLabel", {
Image = Assets.Images.Spinner.Background,
ImageColor3 = theme.Spinner.BackgroundColor,
ImageTransparency = self.props.transparency,
Size = UDim2.new(0, 24, 0, 24),
Position = self.props.position,
AnchorPoint = self.props.anchorPoint,
LayoutOrder = self.props.layoutOrder,
BackgroundTransparency = 1,
}, {
Foreground = e("ImageLabel", {
Image = Assets.Images.Spinner.Foreground,
ImageColor3 = theme.Spinner.ForegroundColor,
ImageTransparency = self.props.transparency,
Size = UDim2.new(1, 0, 1, 0),
Rotation = self.rotation:map(function(value)
return value * 360
end),
BackgroundTransparency = 1,
}),
})
end)
end
function Spinner:didMount()
self.stepper = RunService.RenderStepped:Connect(function(deltaTime)
local rotation = self.rotation:getValue()
rotation = rotation + deltaTime * ROTATIONS_PER_SECOND
rotation = rotation % 1
self.setRotation(rotation)
end)
end
function Spinner:willUnmount()
self.stepper:Disconnect()
end
return Spinner