Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
VideoLAN
VLC-iOS
Commits
40d92458
Commit
40d92458
authored
Nov 21, 2015
by
David Loiret
Browse files
remote playback: add openURL feature
parent
aeff6f6c
Changes
4
Hide whitespace changes
Inline
Side-by-side
Apple-TV/web/index.html
View file @
40d92458
...
...
@@ -23,6 +23,7 @@
</div>
</div>
<div
class=
"main"
>
<div
class=
"display-message"
></div>
<div
class=
"uploads"
>
<ul></ul>
</div>
...
...
@@ -30,6 +31,14 @@
<h1>
%%WEBINTF_DROPFILES%%
</h1>
<p>
%%WEBINTF_DROPFILES_LONG%%
</p>
</div>
<form
class=
"open-url"
>
<div>
<input
type=
"text"
placeholder=
"%%WEBINTF_OPEN_URL%%"
>
<button
type=
"submit"
class=
"submit-button"
>
+
</button>
</div>
</form>
<div
class=
"player-control"
>
<div
class=
"title"
></div>
...
...
Resources/web/playerControl.css
View file @
40d92458
.player-control
{
min-width
:
640px
;
position
:
relative
;
margin
:
auto
;
width
:
65%
;
...
...
@@ -9,7 +10,6 @@
-moz-box-sizing
:
border-box
;
font-family
:
Arial
,
sans-serif
;
padding
:
0
;
bottom
:
20px
;
z-index
:
2
;
opacity
:
1
;
box-shadow
:
0
0
10px
rgba
(
0
,
0
,
0
,
0.3
);
...
...
@@ -311,3 +311,78 @@
margin
:
-20px
10px
4px
11px
;
top
:
50%
}
.open-url
{
min-width
:
320px
;
width
:
40%
;
margin
:
20px
auto
20px
auto
;
}
.open-url
>
div
{
box-shadow
:
0
0
10px
rgba
(
0
,
0
,
0
,
0.3
);
}
.open-url
input
{
color
:
#fff
;
display
:
inline-block
;
border-radius
:
3px
0
0
3px
;
font-size
:
16px
;
padding
:
16px
0
16px
16px
;
width
:
90%
;
vertical-align
:
middle
;
border
:
none
;
}
.open-url
input
,
.open-url
.submit-button
{
background-color
:
#2a2a2a
;
height
:
38px
;
}
.open-url
input
:focus
{
outline
:
0
;
}
.open-url
.submit-button
{
display
:
inline-block
;
vertical-align
:
middle
;
border-radius
:
0
3px
3px
0
;
cursor
:
pointer
;
margin-left
:
-4px
;
width
:
10%
;
font-size
:
32px
;
line-height
:
32px
;
color
:
rgba
(
255
,
132
,
0
,
1
);
text-align
:
center
;
border
:
none
;
outline
:
none
;
font-weight
:
lighter
;
-moz-user-select
:
none
;
-webkit-user-select
:
none
;
user-select
:
none
;
font-family
:
Arial
,
Helvetica
,
sans-serif
;
}
.open-url
.submit-button
:hover
{
color
:
rgba
(
255
,
132
,
0
,
0.5
);
}
.display-message
{
opacity
:
0
;
position
:
fixed
;
background
:
#2a2a2a
;
padding
:
16px
;
bottom
:
70px
;
left
:
24px
;
text-align
:
center
;
border-radius
:
3px
;
box-shadow
:
0
0
2px
rgba
(
0
,
0
,
0
,
.12
),
0
2px
4px
rgba
(
0
,
0
,
0
,
.24
);
transition
:
opacity
200ms
,
-webkit-transform
300ms
cubic-bezier
(
0.165
,
0.840
,
0.440
,
1.000
);
white-space
:
nowrap
;
-webkit-transform
:
translateY
(
40px
);
transform
:
translateY
(
40px
);
color
:
#fff
;
}
.display-message.show
{
opacity
:
1
;
}
Resources/web/playerControl.js
View file @
40d92458
...
...
@@ -544,6 +544,14 @@ $(function() {
this
.
play
();
}
PlayerControl
.
prototype
.
openURL
=
function
(
options
)
{
options
=
options
||
{};
this
.
socket
.
sendMessage
({
type
:
'
openURL
'
,
url
:
options
.
url
});
};
/**
* Instanciation of the Ws class
*/
...
...
@@ -600,4 +608,51 @@ $(function() {
TYPE_MAP
[
type
](
message
);
});
$
(
'
form.open-url
'
).
on
(
'
submit
'
,
function
(
e
)
{
e
.
preventDefault
();
var
url
=
$
(
this
).
find
(
'
input
'
).
val
();
if
(
!
url
)
{
return
displayMessage
(
'
URL cannot be empty.
'
);
}
else
if
(
!
isURL
(
url
))
{
return
displayMessage
(
'
Not a valid URL.
'
);
}
displayMessage
(
'
URL sended successfully.
'
);
playerControl
.
openURL
({
url
:
url
});
//clear the form
$
(
this
).
find
(
'
input
'
).
val
(
''
);
});
/**
* Check if a given string is a URL
* Regex from https://gist.github.com/searls/1033143
* @param {string} str
* @returns {boolean}
*/
function
isURL
(
str
)
{
var
p
=
/
\b((?:
https
?
:
\/\/
|www
\d{0,3}[
.
]
|
[
a-z0-9.
\-]
+
[
.
][
a-z
]{2,4}\/)(?:[^\s
()<>
]
+|
\(([^\s
()<>
]
+|
(\([^\s
()<>
]
+
\)))
*
\))
+
(?:\(([^\s
()<>
]
+|
(\([^\s
()<>
]
+
\)))
*
\)
|
[^\s
`!()
\[\]
{};:'".,<>?«»“”‘’
]))
/i
;
return
p
.
test
(
str
);
}
//Display message to the user
var
TIMEOUT
=
null
;
var
DELAY
=
5000
;
function
displayMessage
(
message
)
{
$
(
'
.display-message
'
).
addClass
(
'
show
'
);
$
(
'
.display-message
'
).
text
(
message
);
if
(
TIMEOUT
)
{
clearTimeout
(
TIMEOUT
);
}
TIMEOUT
=
setTimeout
(
function
()
{
clearMessage
();
},
DELAY
);
}
function
clearMessage
()
{
if
(
TIMEOUT
)
{
clearTimeout
(
TIMEOUT
);
}
$
(
'
.display-message
'
).
removeClass
(
'
show
'
);
}
});
Resources/web/style.css
View file @
40d92458
...
...
@@ -166,7 +166,7 @@ div.main.drop {
}
.messageUpload
{
margin
:
10
0px
0px
;
margin
:
8
0px
0px
;
}
.messageUpload
h1
{
font-size
:
30px
;
...
...
@@ -544,4 +544,3 @@ div.main.drop {
#footer
a
{
color
:
rgb
(
255
,
132
,
0
);
}
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment