Kaonnull/localTube
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add: Format Selection

Browse Source
This commit is contained in:
Simon Hardt
2021-05-30 04:13:21 +02:00
parent ad73835904
commit 98fb1349a1
5 changed files with 1170 additions and 304 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
Modules/Website/db.yml Normal file
View File

@@ -0,0 +1,19 @@
Task:
id: integer
timestamp: ts
hash: string
url: string
audio_only: bool
status: int
format: optional string
File:
id: integer
hash: String
timestamp: ts
format: String
filename: String
local_path: String

1116
Modules/Website/index.html
View File

File diff suppressed because it is too large Load Diff

33
Modules/Website/src/Color.elm
View File

@@ -3,26 +3,13 @@ module Color exposing (..)
import Element
white : Element.Color
white =
Element.rgb 1 1 1
grey : Element.Color
grey =
Element.rgb 0.9 0.9 0.9
blue : Element.Color
blue =
Element.rgb 0 0 0.8
red : Element.Color
red =
Element.rgb 0.8 0 0
darkBlue : Element.Color
darkBlue =
Element.rgb 0 0 0.9
color =
{ blue = Element.rgb255 0x72 0x9F 0xCF
, darkCharcoal = Element.rgb255 0x2E 0x34 0x36
, lightBlue = Element.rgb255 0xC5 0xE8 0xF7
, darkBlue = Element.rgb 0 0 0.9
, lightGrey = Element.rgb255 0xE0 0xE0 0xE0
, white = Element.rgb255 0xFF 0xFF 0xFF
, grey = Element.rgb 0.9 0.9 0.9
, red = Element.rgb 0.8 0 0
}

34
Modules/Website/src/Files.elm
View File

@@ -1,5 +1,6 @@
module Files exposing (..)
import Debug exposing (toString)
import Element exposing (..)
import Element.Background as Background
import Element.Border as Border
@@ -10,7 +11,6 @@ import Http
import Json.Decode exposing (Decoder, int, list, string, succeed)
import Json.Decode.Pipeline exposing (required)
import String exposing (left)
import Debug exposing (toString)
type alias File =
@@ -109,13 +109,23 @@ queryFiles =
-- View --
shadow : Attr decorative msg
shadow =
cardShadow : Attr decorative msg
cardShadow =
Border.shadow
{ offset = ( 2, 2 )
, size = 2
, blur = 2
, color = rgb 0.5 0.5 0.5
{ offset = ( 0, 4 )
, size = 4
, blur = 8
, color = rgba 0 0 0 0.2
}
cardShadowOver : Attr decorative msg
cardShadowOver =
Border.shadow
{ offset = ( 0, 4 )
, size = 8
, blur = 16
, color = rgba 0 0 0 0.2
}
@@ -123,11 +133,13 @@ viewFile : File -> Element Msg
viewFile file =
el
[ width fill
, Background.color (rgb 0.8 0.8 0.8)
-- , Background.color (rgb 0.8 0.8 0.8)
, padding 10
, Border.rounded 3
, shadow
, cardShadow
, height (px 110)
, mouseOver [ cardShadowOver ]
]
(Element.column
[ width fill
@@ -181,7 +193,7 @@ view model =
, height shrink
, centerX
, spacing 36
, padding 10
, padding 20
]
[ el
[ Region.heading 1
@@ -202,7 +214,7 @@ view model =
Element.column
[ width fill
, centerX
, spacing 10
, spacing 20
]
(List.map viewFile model.files)
]

232
Modules/Website/src/MainPage.elm
View File

@@ -11,11 +11,15 @@ import Http
import Json.Decode exposing (Decoder, int, string, succeed)
import Json.Decode.Pipeline exposing (required)
import Json.Encode as Encode
import List exposing (map3)
import Tuple exposing (mapBoth)
import Html exposing (form)
type alias Form =
{ url : String
, test : Bool
, audio_only : Bool
, format : Format
}
@@ -28,18 +32,62 @@ initModel : Model
initModel =
{ form =
{ url = ""
, test = True
, audio_only = False
, format = Auto
}
}
type Msg
= UpdateForm Form
| UpdateFormAudioOnlyChanged Bool
| UpdateFormFormatChnaged Format
| PostForm Form
| PostResult (Result Http.Error PostFormResponse)
| None
type AudioFormats
= MP3
| OPUS
| AAC
| WAV
audioFormatName : AudioFormats -> String
audioFormatName format =
case format of
MP3 -> "mp3"
OPUS -> "opus"
AAC -> "aac"
WAV -> "wav"
type VideoFormats
= FLV
| MP4
| OGG
| WEBM
videoFormatName : VideoFormats -> String
videoFormatName format =
case format of
FLV -> "flv"
MP4 -> "mp4"
OGG -> "ogg"
WEBM -> "wav"
type Format
= Auto
| AudioFormat AudioFormats
| VideoFormat VideoFormats
formatName : Format -> String
formatName format =
case format of
Auto -> "Auto"
AudioFormat audio -> audioFormatName audio
VideoFormat video -> videoFormatName video
-- -- Request -- --
@@ -57,8 +105,18 @@ formDecoder =
formPostEncoder : Form -> Encode.Value
formPostEncoder form =
Encode.object
[ ( "url", Encode.string form.url )
Encode.object <|
List.concat
[ [ ( "url", Encode.string form.url ) ]
, if form.audio_only then
[ ( "audio_only", Encode.bool form.audio_only ) ]
else
[]
, if form.format == Auto then
[]
else
[( "format", Encode.string <| formatName form.format )]
]
@@ -72,6 +130,26 @@ update msg model =
UpdateForm new_form ->
( { model | form = new_form }, Cmd.none )
UpdateFormAudioOnlyChanged _ ->
let
form =
model.form
new_form =
{ form | audio_only = not form.audio_only, format = Auto }
in
( { model | form = new_form }, Cmd.none )
UpdateFormFormatChnaged format ->
let
form =
model.form
new_form =
{ form | format = format }
in
( { model | form = new_form }, Cmd.none )
PostForm form ->
( model
, Http.post
@@ -98,6 +176,99 @@ updateUrl form new_url =
-- -- view -- --
audioOnlyCheckbox : Bool -> Element msg
audioOnlyCheckbox isChecked =
let
knob =
el
[ width <| px 36
, height <| px 36
, Border.rounded 6
, Border.width 2
, Border.color color.blue
, Background.color color.white
]
none
in
el
[ width <| px 120
, height <| px 48
, centerY
, padding 4
, Border.rounded 6
, Border.width 2
, Border.color color.blue
, Background.color <|
if isChecked then
color.lightBlue
else
color.white
]
<|
row [ width fill ] <|
if isChecked then
[ el [ centerX ] <| text "Audio", knob ]
else
[ knob, el [ centerX ] <| text "Video" ]
type ButtonPosition
= First
| Mid
| Last
--formatButton : ButtonPosition -> String -> OptionState -> Element Msg
formatButton : ButtonPosition -> String -> Input.OptionState -> Element msg
formatButton position label state =
let
borders =
case position of
First ->
{ left = 2, right = 2, top = 2, bottom = 2 }
Mid ->
{ left = 0, right = 2, top = 2, bottom = 2 }
Last ->
{ left = 0, right = 2, top = 2, bottom = 2 }
corners =
case position of
First ->
{ topLeft = 6, bottomLeft = 6, topRight = 0, bottomRight = 0 }
Mid ->
{ topLeft = 0, bottomLeft = 0, topRight = 0, bottomRight = 0 }
Last ->
{ topLeft = 0, bottomLeft = 0, topRight = 6, bottomRight = 6 }
in
el
[ paddingEach { left = 20, right = 20, top = 10, bottom = 10 }
, Border.roundEach corners
, Border.widthEach borders
, Border.color color.blue
, Background.color <|
if state == Input.Selected then
color.lightBlue
else
color.white
]
<|
el [ centerX, centerY ] <|
text label
formatOption format position =
Input.optionWith format <| formatButton position <| formatName format
view : Model -> Element Msg
view model =
Element.column
@@ -118,7 +289,7 @@ view model =
[ spacing 12
, below
(el
[ Font.color red
[ Font.color color.red
, Font.size 14
, alignRight
, moveDown 6
@@ -131,21 +302,52 @@ view model =
, onChange = \new -> updateUrl model.form new |> UpdateForm
, label = Input.labelAbove [ Font.size 14 ] (text "Video Url")
}
, Element.row
[ spacing 10 ]
[ Input.checkbox [ width shrink, Font.size 20 ]
{ onChange = UpdateFormAudioOnlyChanged
, icon = audioOnlyCheckbox
, checked = model.form.audio_only
, label =
Input.labelHidden <|
if model.form.audio_only then
"Audo"
else
"Video"
}
, Input.radioRow
[ Border.rounded 6 ]
{ onChange = UpdateFormFormatChnaged
, selected = Just model.form.format
, label = Input.labelLeft [ paddingEach { bottom = 0, top = 0, left = 15, right = 20 } ] <| text "Format:"
, options =
List.concat
[ [ Input.optionWith Auto <| formatButton First "Auto" ]
, if model.form.audio_only then
[ formatOption (AudioFormat MP3) Mid
, formatOption (AudioFormat OPUS) Mid
, formatOption (AudioFormat AAC) Mid
, formatOption (AudioFormat WAV) Last
]
else
[ formatOption (VideoFormat FLV) Mid
, formatOption (VideoFormat MP4) Mid
, formatOption (VideoFormat OGG) Mid
, formatOption (VideoFormat WEBM)Last
]
]
}
]
, Input.button
[ Background.color blue
, Font.color white
, Border.color darkBlue
[ Background.color color.blue
, Font.color color.white
, Border.color color.darkBlue
, paddingXY 32 16
, Border.rounded 3
]
{ onPress = Just (PostForm model.form)
, label = Element.text "Download"
}
, Input.checkbox
[]
{ checked = model.form.test
, icon = Input.defaultCheckbox
, label = Input.labelRight [] (text "Test")
, onChange = \_ -> None
}
]