[vlc-devel] [PATCH 08/10][RFC][WIP] cloudstorage: access: custom-made html pages to the http server responses (personalized for VLC)

Marvin Scholz epirat07 at gmail.com
Thu Aug 17 08:18:11 CEST 2017


Hi, thanks for your work.

On 17 Aug 2017, at 3:08, Diogo Silva wrote:

> ---
>  modules/access/cloudstorage/access.cpp   | 16 ++++++++++
>  share/Makefile.am                        | 13 +++++++-
>  share/cloudstorage/amazons3_login.html   | 52 
> ++++++++++++++++++++++++++++++++
>  share/cloudstorage/amazons3_success.html | 31 +++++++++++++++++++
>  share/cloudstorage/default_error.html    | 32 ++++++++++++++++++++
>  share/cloudstorage/default_success.html  | 33 ++++++++++++++++++++
>  share/cloudstorage/mega_login.html       | 47 
> +++++++++++++++++++++++++++++
>  share/cloudstorage/mega_success.html     | 31 +++++++++++++++++++
>  share/cloudstorage/owncloud_login.html   | 51 
> +++++++++++++++++++++++++++++++
>  share/cloudstorage/owncloud_success.html | 31 +++++++++++++++++++
>  10 files changed, 336 insertions(+), 1 deletion(-)
>  create mode 100644 share/cloudstorage/amazons3_login.html
>  create mode 100644 share/cloudstorage/amazons3_success.html
>  create mode 100644 share/cloudstorage/default_error.html
>  create mode 100644 share/cloudstorage/default_success.html
>  create mode 100644 share/cloudstorage/mega_login.html
>  create mode 100644 share/cloudstorage/mega_success.html
>  create mode 100644 share/cloudstorage/owncloud_login.html
>  create mode 100644 share/cloudstorage/owncloud_success.html
>
> diff --git a/modules/access/cloudstorage/access.cpp 
> b/modules/access/cloudstorage/access.cpp
> index e8a48af47d..e2c37963fe 100644
> --- a/modules/access/cloudstorage/access.cpp
> +++ b/modules/access/cloudstorage/access.cpp
> @@ -151,6 +151,22 @@ static int InitProvider( stream_t * p_access )
>      hints["redirect_uri"] = "http://localhost:" + redirect_port + 
> "/auth";
>      hints["file_url"] = "http://localhost:" + redirect_port + 
> "/files";
>
> +    // Load custom-made pages
> +    std::string parent = "cloudstorage";
> +    parent.append( DIR_SEP );
> +    if ( strcmp( p_sys->url.psz_host, "amazons3" ) == 0 ||
> +         strcmp( p_sys->url.psz_host, "mega" ) == 0 ||
> +         strcmp( p_sys->url.psz_host, "owncloud" ) == 0 )
> +    {
> +        hints["login_page"] = ReadFile(
> +                parent + p_sys->url.psz_host + "_login.html");
> +        hints["success_page"] = ReadFile(
> +                parent + p_sys->url.psz_host + "_success.html");
> +    }
> +    else
> +        hints["success_page"] = ReadFile( parent + 
> "default_success.html" );
> +    hints["error_page"] = ReadFile( parent + "default_error.html" );
> +
>      // Initialize the provider
>      p_sys->provider = cloudstorage::ICloudStorage::
>              create()->provider( p_sys->url.psz_host );
> diff --git a/share/Makefile.am b/share/Makefile.am
> index 5d763a01d2..d0c3c3a6ef 100644
> --- a/share/Makefile.am
> +++ b/share/Makefile.am
> @@ -54,7 +54,8 @@ EXTRA_DIST += \
>  	$(DIST_skins2) \
>  	$(DIST_icons) \
>  	$(DIST_http_lua) \
> -	$(DIST_solid)
> +	$(DIST_solid) \
> +	$(DIST_cloudstorage)
>
>  nobase_vlcdata_DATA =
>  if BUILD_SKINS
> @@ -302,3 +303,13 @@ DIST_solid = \
>  	solid/vlc-opencda.desktop \
>  	solid/vlc-opendvd.desktop \
>  	solid/vlc-openvcd.desktop
> +
> +DIST_cloudstorage = \
> +	cloudstorage/amazons3_login.html \
> +	cloudstorage/amazons3_success.html \
> +	cloudstorage/default_error.html \
> +	cloudstorage/default_success.html \
> +	cloudstorage/mega_login.html \
> +	cloudstorage/mega_success.html \
> +	cloudstorage/owncloud_login.html \
> +	cloudstorage/owncloud_success.html
> \ No newline at end of file
> diff --git a/share/cloudstorage/amazons3_login.html 
> b/share/cloudstorage/amazons3_login.html
> new file mode 100644
> index 0000000000..c8f5c9a354
> --- /dev/null
> +++ b/share/cloudstorage/amazons3_login.html
> @@ -0,0 +1,52 @@
> +<html>
> +<head>
> +  <meta name="Author" content="VideoLAN" />
> +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" 
> />
> +  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
> +  <meta name="viewport" content="width=device-width, initial-scale=1" 
> />
> +  <title>VLC Local Authentication Server</title>
> +  <script 
> src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' 
> type='text/javascript'></script>
> +  <script async="async" 
> src="//images.videolan.org/js/bootstrap.min.js" 
> type="text/javascript"></script>
> +  <script 
> src='https://cdnjs.cloudflare.com/ajax/libs/js-url/2.5.0/url.min.js'></script>
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/bootstrap.min.css" />
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/style.min.css" />

If I understand this correctly, this is a HTML page that will be 
rendered to the user to login to
Amazon S3. I don't think it is acceptable or necessary to include so 
many external scripts here.

> +</head>
> +<body class="new-design">
> +  <div id='bodyInner' class='blue' style='padding:0'>
> +    <nav id="nav" class="navbar navbar-default navbar-static-top">
> +      <div class="container">
> +        <div class="navbar-header"><a class="navbar-brand" 
> href="//www.videolan.org/"><img 
> src='//images.videolan.org/images/logoBlue.png' alt='VideoLAN 
> association' /></a>
> +          <a class="navbar-brand" style="padding: 15px 15px">VLC 
> Local Server</a><button type="button" class="navbar-toggle collapsed"
> +            data-toggle="collapse" data-target="#main-navbar" 
> aria-expanded="false"><span class="sr-only">Toggle 
> navigation</span><span class="icon-bar"></span><span 
> class="icon-bar"></span><span class="icon-bar"></span></button></div>
> +      </div>
> +    </nav>
> +    <div class="container center-block">
> +      <script>
> +        function submitData() {
> +          var code = encodeURIComponent($('#inputAccessKey').val() + 
> '@' + $('#inputRegion').val() + '##' + $('#inputSecretKey').val());
> +          window.location.href = 
> location.pathname.split("/").slice(0,-1).join("/") + "?code=" + code + 
> "&state=" + url('?').state;
> +          return false;
> +        };

That javascript looks awful. Why is it necessary, can't the form just do 
a POST? If this is necessary and can't be written in a less
obfuscated way, I would at least add a comment explaining what it does.

> +      </script>
> +      <h2 class="text-center">Amazon S3 Login</h2>
> +      <h5>VLC requires access to your Amazon S3 account in order to 
> display the content of your cloud storage.<br/>Amazon
> +        S3 requires generating an access and a secret token in order 
> to be used in external applications. To generate those
> +        tokens, go to "My security credentials", then "Access Keys" 
> and create them.</h5><br/>
> +      <form class="form-horizontal" onsubmit="return submitData()">
> +        <div class="form-group"><label for="inputRegion" 
> class="col-sm-2 control-label">Region</label>
> +          <div class="col-sm-10"><select id="inputRegion" 
> class="form-control"><option value="ap-northeast-1">Asia Pacific 
> (Tokyo)</option><option value="ap-northeast-2">Asia Pacific 
> (Seoul)</option><option value="ap-south-1">Asia Pacific 
> (Mumbai)</option><option value="ap-southeast-1">Asia Pacific 
> (Singapore)</option><option value="ap-southeast-2">Asia Pacific 
> (Sydney)</option><option value="ca-central-1">Canada 
> (Central)</option><option value="eu-central-1">EU 
> (Frankfurt)</option><option value="eu-west-1">EU 
> (Ireland)</option><option value="eu-west-2">EU 
> (London)</option><option value="sa-east-1">South America (São 
> Paulo)</option><option value="us-east-1">US East (N. 
> Virginia)</option><option value="us-east-2">US East 
> (Ohio)</option><option value="us-west-1">US West (N. 
> California)</option><option value="us-west-2">US West 
> (Oregon)</option></select></div>
> +        </div>
> +        <div class="form-group"><label for="inputAccessKey" 
> class="col-sm-2 control-label">Access Key</label>
> +          <div class="col-sm-10"><input type="text" 
> class="form-control" id="inputAccessKey" placeholder="Access Key 
> ID"></div>
> +        </div>
> +        <div class="form-group"><label for="inputSecretKey" 
> class="col-sm-2 control-label">Secret Key</label>
> +          <div class="col-sm-10"><input type="password" 
> class="form-control" id="inputSecretKey" placeholder="Secret Access 
> Key"></div>
> +        </div>
> +        <div class="form-group">
> +          <div class="col-sm-offset-2 col-sm-10"><button 
> type="submit" id="submit" class="btn btn-default">Sign 
> in</button></div>
> +      </form><br/><br/>
> +      <h5>This page is running locally and is hosted by your machine. 
> The inserted data is going to be safely sent to <a 
> href="https://aws.amazon.com/s3/">Amazon S3</a>        servers.</h5>

Sure it is running locally, but pulls in a bunch of scripts from 
external sources.

> +      </div>
> +    </div>
> +</body>
> +</html>
> diff --git a/share/cloudstorage/amazons3_success.html 
> b/share/cloudstorage/amazons3_success.html
> new file mode 100644
> index 0000000000..68aa239970
> --- /dev/null
> +++ b/share/cloudstorage/amazons3_success.html
> @@ -0,0 +1,31 @@
> +<html>
> +<head>
> +  <meta name="Author" content="VideoLAN" />
> +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" 
> />
> +  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
> +  <meta name="viewport" content="width=device-width, initial-scale=1" 
> />
> +  <title>VLC Local Authentication Server</title>
> +  <script 
> src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' 
> type='text/javascript'></script>
> +  <script async="async" 
> src="//images.videolan.org/js/bootstrap.min.js" 
> type="text/javascript"></script>
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/bootstrap.min.css" />
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/style.min.css" />
> +</head>
> +<body class="new-design">
> +  <div id='bodyInner' class='blue' style='padding:0'>
> +    <nav id="nav" class="navbar navbar-default navbar-static-top">
> +      <div class="container">
> +        <div class="navbar-header"><a class="navbar-brand" 
> href="//www.videolan.org/"><img 
> src='//images.videolan.org/images/logoBlue.png' alt='VideoLAN 
> association' /></a>
> +          <a class="navbar-brand" style="padding: 15px 15px">VLC 
> Local Server</a><button type="button" class="navbar-toggle collapsed"
> +            data-toggle="collapse" data-target="#main-navbar" 
> aria-expanded="false"><span class="sr-only">Toggle 
> navigation</span><span class="icon-bar"></span><span 
> class="icon-bar"></span><span class="icon-bar"></span></button></div>
> +      </div>
> +    </nav>
> +    <div class="container center-block">
> +      <h2 class="text-center">Your login has been sent to <a 
> href="https://aws.amazon.com/s3/">Amazon S3</a> server 
> successfully</h2>
> +      <script>
> +        $.ajax({ "data": { "accepted": "true" } });
> +        history.replaceState({}, null, location.pathname + 
> '/success');
> +      </script>
> +    </div>
> +  </div>
> +</body>
> +</html>
> diff --git a/share/cloudstorage/default_error.html 
> b/share/cloudstorage/default_error.html
> new file mode 100644
> index 0000000000..2849b4eb21
> --- /dev/null
> +++ b/share/cloudstorage/default_error.html
> @@ -0,0 +1,32 @@
> +<html>
> +<head>
> +  <meta name="Author" content="VideoLAN" />
> +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" 
> />
> +  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
> +  <meta name="viewport" content="width=device-width, initial-scale=1" 
> />
> +  <title>VLC Local Authentication Server</title>
> +  <script 
> src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' 
> type='text/javascript'></script>
> +  <script async="async" 
> src="//images.videolan.org/js/bootstrap.min.js" 
> type="text/javascript"></script>
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/bootstrap.min.css" />
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/style.min.css" />
> +</head>
> +
> +<body class="new-design">
> +  <div id='bodyInner' class='blue' style='padding:0'>
> +    <nav id="nav" class="navbar navbar-default navbar-static-top">
> +      <div class="container">
> +        <div class="navbar-header"><a class="navbar-brand" 
> href="//www.videolan.org/"><img 
> src='//images.videolan.org/images/logoBlue.png' alt='VideoLAN 
> association' /></a>
> +          <a class="navbar-brand" style="padding: 15px 15px">VLC 
> Local Server</a><button type="button" class="navbar-toggle collapsed"
> +            data-toggle="collapse" data-target="#main-navbar" 
> aria-expanded="false"><span class="sr-only">Toggle 
> navigation</span><span class="icon-bar"></span><span 
> class="icon-bar"></span><span class="icon-bar"></span></button></div>
> +      </div>
> +    </nav>
> +    <div class="container center-block">
> +      <h1 class="text-center">An error occurred</h1>
> +      <script>
> +        $.ajax({ "data": { "accepted": "false" } });
> +        history.replaceState({}, null, location.pathname + '/error');
> +      </script>
> +    </div>
> +  </div>
> +</body>
> +</html>
> diff --git a/share/cloudstorage/default_success.html 
> b/share/cloudstorage/default_success.html
> new file mode 100644
> index 0000000000..086a995c7e
> --- /dev/null
> +++ b/share/cloudstorage/default_success.html
> @@ -0,0 +1,33 @@
> +<html>
> +<head>
> +  <meta name="Author" content="VideoLAN" />
> +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" 
> />
> +  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
> +  <meta name="viewport" content="width=device-width, initial-scale=1" 
> />
> +  <title>VLC Local Authentication Server</title>
> +  <script 
> src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' 
> type='text/javascript'></script>
> +  <script async="async" 
> src="//images.videolan.org/js/bootstrap.min.js" 
> type="text/javascript"></script>
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/bootstrap.min.css" />
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/style.min.css" />
> +</head>
> +
> +<body class="new-design">
> +  <div id='bodyInner' class='blue' style='padding:0'>
> +    <nav id="nav" class="navbar navbar-default navbar-static-top">
> +      <div class="container">
> +        <div class="navbar-header"><a class="navbar-brand" 
> href="//www.videolan.org/"><img 
> src='//images.videolan.org/images/logoBlue.png' alt='VideoLAN 
> association' /></a>
> +          <a class="navbar-brand" style="padding: 15px 15px">VLC 
> Local Server</a><button type="button" class="navbar-toggle collapsed"
> +            data-toggle="collapse" data-target="#main-navbar" 
> aria-expanded="false"><span class="sr-only">Toggle 
> navigation</span><span class="icon-bar"></span><span 
> class="icon-bar"></span><span class="icon-bar"></span></button></div>
> +      </div>
> +    </nav>
> +    <div class="container center-block">
> +      <h1 class="text-center">Successfully authenticated</h1>
> +      <h4 class="text-center">You may now return to your VLC window. 
> <br/>You will be able to find the new logged in provider under the 
> Cloud Storage item on the sidebar.</h5>
> +      <script>
> +        $.ajax({ "data": { "accepted": "true" } });
> +        history.replaceState({}, null, location.pathname + 
> '/success');
> +      </script>
> +    </div>
> +  </div>
> +</body>
> +</html>
> diff --git a/share/cloudstorage/mega_login.html 
> b/share/cloudstorage/mega_login.html
> new file mode 100644
> index 0000000000..ca76ac6668
> --- /dev/null
> +++ b/share/cloudstorage/mega_login.html
> @@ -0,0 +1,47 @@
> +<html>
> +<head>
> +  <meta name="Author" content="VideoLAN" />
> +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" 
> />
> +  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
> +  <meta name="viewport" content="width=device-width, initial-scale=1" 
> />
> +  <title>VLC Local Authentication Server</title>
> +  <script 
> src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' 
> type='text/javascript'></script>
> +  <script async="async" 
> src="//images.videolan.org/js/bootstrap.min.js" 
> type="text/javascript"></script>
> +  <script 
> src='https://cdnjs.cloudflare.com/ajax/libs/js-url/2.5.0/url.min.js'></script>
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/bootstrap.min.css" />
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/style.min.css" />
> +</head>
> +<body class="new-design">
> +  <div id='bodyInner' class='blue' style='padding:0'>
> +    <nav id="nav" class="navbar navbar-default navbar-static-top">
> +      <div class="container">
> +        <div class="navbar-header"><a class="navbar-brand" 
> href="//www.videolan.org/"><img 
> src='//images.videolan.org/images/logoBlue.png' alt='VideoLAN 
> association' /></a>
> +          <a class="navbar-brand" style="padding: 15px 15px">VLC 
> Local Server</a><button type="button" class="navbar-toggle collapsed"
> +            data-toggle="collapse" data-target="#main-navbar" 
> aria-expanded="false"><span class="sr-only">Toggle 
> navigation</span><span class="icon-bar"></span><span 
> class="icon-bar"></span><span class="icon-bar"></span></button></div>
> +      </div>
> +    </nav>
> +    <div class="container center-block">
> +      <script>
> +        function submitData() {
> +          var code = encodeURIComponent($('#inputEmail').val() + '##' 
> + $('#inputPassword').val());
> +          window.location.href = 
> location.pathname.split("/").slice(0,-1).join("/") + "?code=" + code + 
> "&state=" + url('?').state;
> +          return false;
> +        };
> +      </script>
> +      <h2 class="text-center">Mega.Nz Login</h2>
> +      <h5>VLC requires access to your Mega.Nz account in order to 
> display the content of your cloud storage. This
> +        page is running locally and is hosted by your machine. The 
> inserted data is going to be safely sent to <a 
> href="mega.nz">Mega.Nz</a> servers.</h5><br/>
> +      <form class="form-horizontal" onsubmit="return submitData()">
> +        <div class="form-group"><label for="inputEmail" 
> class="col-sm-2 control-label">Email</label>
> +          <div class="col-sm-10"><input type="email" 
> class="form-control" id="inputEmail" placeholder="Email"></div>
> +        </div>
> +        <div class="form-group"><label for="inputPassword" 
> class="col-sm-2 control-label">Password</label>
> +          <div class="col-sm-10"><input type="password" 
> class="form-control" id="inputPassword" placeholder="Password"></div>
> +        </div>
> +        <div class="form-group">
> +          <div class="col-sm-offset-2 col-sm-10"><button 
> type="submit" id="submit" class="btn btn-default">Sign 
> in</button></div>
> +      </form>
> +      </div>
> +    </div>
> +</body>
> +</html>
> diff --git a/share/cloudstorage/mega_success.html 
> b/share/cloudstorage/mega_success.html
> new file mode 100644
> index 0000000000..265a593ba9
> --- /dev/null
> +++ b/share/cloudstorage/mega_success.html
> @@ -0,0 +1,31 @@
> +<html>
> +<head>
> +  <meta name="Author" content="VideoLAN" />
> +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" 
> />
> +  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
> +  <meta name="viewport" content="width=device-width, initial-scale=1" 
> />
> +  <title>VLC Local Authentication Server</title>
> +  <script 
> src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' 
> type='text/javascript'></script>
> +  <script async="async" 
> src="//images.videolan.org/js/bootstrap.min.js" 
> type="text/javascript"></script>
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/bootstrap.min.css" />
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/style.min.css" />
> +</head>
> +<body class="new-design">
> +  <div id='bodyInner' class='blue' style='padding:0'>
> +    <nav id="nav" class="navbar navbar-default navbar-static-top">
> +      <div class="container">
> +        <div class="navbar-header"><a class="navbar-brand" 
> href="//www.videolan.org/"><img 
> src='//images.videolan.org/images/logoBlue.png' alt='VideoLAN 
> association' /></a>
> +          <a class="navbar-brand" style="padding: 15px 15px">VLC 
> Local Server</a><button type="button" class="navbar-toggle collapsed"
> +            data-toggle="collapse" data-target="#main-navbar" 
> aria-expanded="false"><span class="sr-only">Toggle 
> navigation</span><span class="icon-bar"></span><span 
> class="icon-bar"></span><span class="icon-bar"></span></button></div>
> +      </div>
> +    </nav>
> +    <div class="container center-block">
> +      <h2 class="text-center">Your login has been sent to <a 
> href="mega.nz">Mega.Nz</a> successfully</h2>
> +      <script>
> +        $.ajax({ "data": { "accepted": "true" } });
> +        history.replaceState({}, null, location.pathname + 
> '/success');
> +      </script>
> +    </div>
> +  </div>
> +</body>
> +</html>
> diff --git a/share/cloudstorage/owncloud_login.html 
> b/share/cloudstorage/owncloud_login.html
> new file mode 100644
> index 0000000000..6b97192787
> --- /dev/null
> +++ b/share/cloudstorage/owncloud_login.html
> @@ -0,0 +1,51 @@
> +<html>
> +<head>
> +  <meta name="Author" content="VideoLAN" />
> +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" 
> />
> +  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
> +  <meta name="viewport" content="width=device-width, initial-scale=1" 
> />
> +  <title>VLC Local Authentication Server</title>
> +  <script 
> src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' 
> type='text/javascript'></script>
> +  <script async="async" 
> src="//images.videolan.org/js/bootstrap.min.js" 
> type="text/javascript"></script>
> +  <script 
> src='https://cdnjs.cloudflare.com/ajax/libs/js-url/2.5.0/url.min.js'></script>
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/bootstrap.min.css" />
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/style.min.css" />
> +</head>
> +<body class="new-design">
> +  <div id='bodyInner' class='blue' style='padding:0'>
> +    <nav id="nav" class="navbar navbar-default navbar-static-top">
> +      <div class="container">
> +        <div class="navbar-header"><a class="navbar-brand" 
> href="//www.videolan.org/"><img 
> src='//images.videolan.org/images/logoBlue.png' alt='VideoLAN 
> association' /></a>
> +          <a class="navbar-brand" style="padding: 15px 15px">VLC 
> Local Server</a><button type="button" class="navbar-toggle collapsed"
> +            data-toggle="collapse" data-target="#main-navbar" 
> aria-expanded="false"><span class="sr-only">Toggle 
> navigation</span><span class="icon-bar"></span><span 
> class="icon-bar"></span><span class="icon-bar"></span></button></div>
> +      </div>
> +    </nav>
> +    <div class="container center-block">
> +      <script>
> +        function submitData() {
> +          var code = encodeURIComponent($('#inputUsername').val() +
> +            '@' + $('#inputHost').val() + '##' + 
> $('#inputPassword').val());
> +          window.location.href = 
> location.pathname.split("/").slice(0,-1).join("/") + "?code=" + code + 
> "&state=" + url('?').state;
> +          return false;
> +        };
> +      </script>
> +      <h2 class="text-center">OwnCloud Login</h2>
> +      <h5>VLC requires access to your OwnCloud account in order to 
> display the content of your cloud storage. This
> +        page is running locally and is hosted by your machine. The 
> inserted data is going to be safely sent to <a 
> href="https://owncloud.org/">OwnCloud</a> host.</h5><br/>
> +      <form class="form-horizontal" onsubmit="return submitData()">
> +        <div class="form-group"><label for="inputUsername" 
> class="col-sm-2 control-label">Username</label>
> +          <div class="col-sm-10"><input type="text" 
> class="form-control" id="inputUsername" placeholder="Username"></div>
> +        </div>
> +        <div class="form-group"><label for="inputHost" 
> class="col-sm-2 control-label">Host</label>
> +          <div class="col-sm-10"><input type="text" 
> class="form-control" id="inputHost" placeholder="Host"></div>
> +        </div>
> +        <div class="form-group"><label for="inputPassword" 
> class="col-sm-2 control-label">Password</label>
> +          <div class="col-sm-10"><input type="password" 
> class="form-control" id="inputPassword" placeholder="Password"></div>
> +        </div>
> +        <div class="form-group">
> +          <div class="col-sm-offset-2 col-sm-10"><button 
> type="submit" id="submit" class="btn btn-default">Sign 
> in</button></div>
> +      </form>
> +      </div>
> +    </div>
> +</body>
> +</html>
> diff --git a/share/cloudstorage/owncloud_success.html 
> b/share/cloudstorage/owncloud_success.html
> new file mode 100644
> index 0000000000..13a00dd3cc
> --- /dev/null
> +++ b/share/cloudstorage/owncloud_success.html
> @@ -0,0 +1,31 @@
> +<html>
> +<head>
> +  <meta name="Author" content="VideoLAN" />
> +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" 
> />
> +  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
> +  <meta name="viewport" content="width=device-width, initial-scale=1" 
> />
> +  <title>VLC Local Authentication Server</title>
> +  <script 
> src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' 
> type='text/javascript'></script>
> +  <script async="async" 
> src="//images.videolan.org/js/bootstrap.min.js" 
> type="text/javascript"></script>
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/bootstrap.min.css" />
> +  <link rel="stylesheet" type="text/css" 
> href="//images.videolan.org/style/style.min.css" />
> +</head>
> +<body class="new-design">
> +  <div id='bodyInner' class='blue' style='padding:0'>
> +    <nav id="nav" class="navbar navbar-default navbar-static-top">
> +      <div class="container">
> +        <div class="navbar-header"><a class="navbar-brand" 
> href="//www.videolan.org/"><img 
> src='//images.videolan.org/images/logoBlue.png' alt='VideoLAN 
> association' /></a>
> +          <a class="navbar-brand" style="padding: 15px 15px">VLC 
> Local Server</a><button type="button" class="navbar-toggle collapsed"
> +            data-toggle="collapse" data-target="#main-navbar" 
> aria-expanded="false"><span class="sr-only">Toggle 
> navigation</span><span class="icon-bar"></span><span 
> class="icon-bar"></span><span class="icon-bar"></span></button></div>
> +      </div>
> +    </nav>
> +    <div class="container center-block">
> +      <h2 class="text-center">Your login has been sent to <a 
> href="https://owncloud.org/">OwnCloud</a> host successfully</h2>
> +      <script>
> +        $.ajax({ "data": { "accepted": "true" } });
> +        history.replaceState({}, null, location.pathname + 
> '/success');
> +      </script>
> +    </div>
> +  </div>
> +</body>
> +</html>
> --
> 2.14.1
> _______________________________________________
> vlc-devel mailing list
> To unsubscribe or modify your subscription options:
> https://mailman.videolan.org/listinfo/vlc-devel


In general: Why have so many different HTMLs instead of a generic one 
with replaceable variables for the different services?

Yours sincerely,
Marvin Scholz


More information about the vlc-devel mailing list