<a href="plugins/dialogs/index.html" class="button dh"><p>Dialogs</p></a>
<a href="plugins/events/index.html" class="button dh"><p>Events</p></a>
<a href="plugins/file/index.html" class="button dh"><p>File</p></a>
- <a href="
#" class="button dh"><p>FileTransfer</p></a>
+ <a href="
plugins/filetransfer/index.html" class="button dh"><p>FileTransfer</p></a>
<a href="plugins/globalization/globalization.html"" class="button dh"><p>Globalization</p></a>
<a href="plugins/media/media.html" class="button dh"><p>Media</p></a>
<a href="plugins/networkInformation/connection.html" class="button dh"><p>Network Information</p></a>
--- /dev/null
+<!DOCTYPE html>
+<!--
+/*
+ * Copyright (c) 2014-2015 Telerik AD
+ * Copyright (c) 2015 Samsung Electronics Co., Ltd All Rights Reserved
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+-->
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+ <meta name="format-detection" content="telephone=no" />
+ <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
+ <link href="styles/main.css" rel="stylesheet" type="text/css" />
+ <script type="text/javascript" src="../../lib/cordova.js"></script>
+ <script type="text/javascript" src="js/index.js"></script>
+ <title>File Transfer</title>
+ </head>
+
+ <body>
+ <header class="header">
+ <h1>File Transfer</h1>
+ </header>
+ <div class="content">
+ <div class="action-area ch20">
+ <button class="button dh" id="imgOper">Download image</button>
+ <button class="button dh" id="vidOper">Download video</button>
+ <button class="button dh" id="serverURL">Server URL</button>
+ </div>
+ <div class="result-area ch80">
+ <div class="results">
+ <div id="progress" class="desc"></div>
+ <div id="result" class="desc">
+ <ul class="left">
+ <li>Clicking the Dowload button downloads an image from the AppBuilder site and saves it on the device.</li>
+ <li>Clicking the Upload button allows you to pick an image and upload it to the server.</li>
+ <li>Clicking the Server URL button allows you to set a server URL address (default is http://www.filedropper.com/).</li>
+ </ul>
+ </div>
+ <div id="downloaded"></div>
+ </div>
+ <div class="separator"></div>
+ </div>
+ </div>
+ <footer class="footer">
+ <div>Cordova API Samples</div>
+ </footer>
+ </body>
+</html>
--- /dev/null
+/*
+ * Copyright (c) 2014-2015 Telerik AD
+ * Copyright (c) 2015 Samsung Electronics Co., Ltd All Rights Reserved
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var imagePath = null;
+var videoPath = null;
+var serverURL = 'http://www.filedropper.com/';
+
+
+var onProgressCB = function (progEvt) {
+ document.getElementById('progress').innerHTML = Math.round((100 *progEvt.loaded / progEvt.total)) + '%';
+ console.log(Math.round((100 * progEvt.loaded / progEvt.total)) + '%');
+};
+
+
+var downloadApp = function() {
+}
+
+
+downloadApp.prototype = {
+ run: function(imageUri, videoUri, imageFileName, videoFileName, folderName) {
+ var that = this,
+ filePath = '';
+
+ document.getElementById('imgOper').addEventListener('click', function() {
+ if (imagePath) { // upload
+ that.uploadImg();
+ } else { // upload
+ that.getFilesystem(
+ function(fileSystem) {
+ console.log('gotFS');
+ var filePath;
+ var urlPath = fileSystem.root.toURL();
+ filePath = urlPath + '\/' + imageFileName;
+ that.transferImage(imageUri, filePath)
+ },
+ function() {
+ console.log('failed to get filesystem');
+ }
+ );
+ }
+ });
+
+ document.getElementById('vidOper').addEventListener('click', function() {
+ if (videoPath) { // upload
+ that.uploadVid();
+ } else { // upload
+ that.getFilesystem(
+ function(fileSystem) {
+ console.log('gotFS');
+ var filePath;
+ var urlPath = fileSystem.root.toURL();
+ filePath = urlPath + '\/' + videoFileName;
+ that.transferVideo(videoUri, filePath)
+ },
+ function() {
+ console.log('failed to get filesystem');
+ }
+ );
+ }
+ });
+
+ document.getElementById('serverURL').addEventListener('click', function() {
+ document.getElementById('result').innerHTML =
+ '<div class="input-area"><input type="text" id="input_server_url" class="inputBox" placeholder="Server URL" value="' + serverURL + '"/></div>' +
+ '<div><button class="button dh" id="set_server_url">Set Server URL</button></div>' +
+ '<div><button class="button dh" id="cancel_server_url">Cancel</button></div>';
+ document.getElementById('imgOper').disabled = true;
+ document.getElementById('vidOper').disabled = true;
+ document.getElementById('set_server_url').addEventListener('click', function() {
+ serverURL = document.getElementById('input_server_url').value;
+ document.getElementById('result').innerHTML = '';
+ document.getElementById('imgOper').disabled = false;
+ document.getElementById('vidOper').disabled = false;
+ document.getElementById('downloaded').style.display = 'block';
+ });
+ document.getElementById('cancel_server_url').addEventListener('click', function() {
+ document.getElementById('result').innerHTML = '';
+ document.getElementById('imgOper').disabled = false;
+ document.getElementById('vidOper').disabled = false;
+ document.getElementById('downloaded').style.display = 'block';
+ });
+ document.getElementById('downloaded').style.display = 'none';
+ });
+ },
+
+ getFilesystem:function (success, fail) {
+ window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
+ window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, success, fail);
+ },
+
+ getFolder: function (fileSystem, folderName, success, fail) {
+ fileSystem.root.getDirectory(folderName, {create: true, exclusive: false}, success, fail)
+ },
+
+ transferImage: function (uri, filePath) {
+ var transfer = new FileTransfer();
+ transfer.onprogress = onProgressCB;
+ transfer.download(
+ uri,
+ filePath,
+ function(entry) {
+ imagePath = entry.toURL();
+
+ document.getElementById('downloaded').innerHTML = '<img id="downloadedContent"/>';
+ var image = document.getElementById('downloadedContent');
+ image.src = imagePath;
+ image.style.display = 'block';
+ image.display = imagePath;
+
+ document.getElementById('progress').innerHTML = '';
+ document.getElementById('result').innerHTML = 'File saved to: ' + imagePath;
+ document.getElementById('imgOper').innerHTML = 'Upload image';
+ },
+ function(error) {
+ document.getElementById('result').innerHTML = 'An error has occurred: Code = ' + error.code;
+ console.log('download error source ' + error.source);
+ console.log('download error target ' + error.target);
+ console.log('upload error code ' + error.code);
+ }
+ );
+ },
+
+ transferVideo: function (uri, filePath) {
+ var transfer = new FileTransfer();
+ transfer.onprogress = onProgressCB;
+ transfer.download(
+ uri,
+ filePath,
+ function(entry) {
+ videoPath = entry.toURL();
+ document.getElementById('downloaded').innerHTML = '<video id="downloadedContent" src="' + videoPath + '" controls></video>';
+
+ document.getElementById('progress').innerHTML = '';
+ document.getElementById('result').innerHTML = 'File saved to: ' + videoPath;
+ document.getElementById('vidOper').innerHTML = 'Upload video';
+ },
+ function(error) {
+ document.getElementById('result').innerHTML = 'An error has occurred: Code = ' + error.code;
+ console.log('download error source ' + error.source);
+ console.log('download error target ' + error.target);
+ console.log('upload error code ' + error.code);
+ }
+ );
+ },
+
+ uploadImg: function() {
+ var options = new FileUploadOptions();
+ options.fileKey = 'file';
+ options.fileName = imagePath.substr(imagePath.lastIndexOf('/') + 1);
+ options.mimeType = 'image/png';
+ options.params = {}; // if we need to send parameters to the server request
+ options.headers = {
+ Connection: 'Close'
+ };
+ options.chunkedMode = false;
+
+ var ft = new FileTransfer();
+ ft.onprogress = onProgressCB;
+ ft.upload(
+ imagePath,
+ encodeURI(serverURL),
+ onFileUploadSuccess,
+ onFileTransferFail,
+ options);
+
+ function onFileUploadSuccess (result) {
+ console.log('FileTransfer.upload');
+ console.log('Code = ' + result.responseCode);
+ console.log('Response = ' + result.response);
+ console.log('Sent = ' + result.bytesSent);
+ console.log('Link to uploaded file: ' + serverURL + result.response);
+ var response = result.response;
+
+ var destination = serverURL + response.substr(response.lastIndexOf('=') + 1);
+
+ document.getElementById('result').innerHTML = 'File uploaded to: ' +
+ destination +
+ "</br><button onclick=\"window.open('" + destination + "', '_blank', 'location=yes')\">Open Location</button>";
+ }
+
+ function onFileTransferFail (error) {
+ console.log('FileTransfer Error:');
+ console.log('Code: ' + error.code);
+ console.log('Source: ' + error.source);
+ console.log('Target: ' + error.target);
+ }
+ },
+ uploadVid: function() {
+ var options = new FileUploadOptions();
+ options.fileKey = 'file';
+ options.fileName = videoPath.substr(videoPath.lastIndexOf('/') + 1);
+ options.mimeType = "video/3gpp";
+ options.params = {}; // if we need to send parameters to the server request
+ options.headers = {
+ Connection: 'Close'
+ };
+ options.chunkedMode = false;
+
+ var ft = new FileTransfer();
+ ft.onprogress = onProgressCB;
+ ft.upload(
+ videoPath,
+ encodeURI(serverURL),
+ onFileUploadSuccess,
+ onFileTransferFail,
+ options);
+
+ function onFileUploadSuccess (result) {
+ console.log('FileTransfer.upload');
+ console.log('Code = ' + result.responseCode);
+ console.log('Response = ' + result.response);
+ console.log('Sent = ' + result.bytesSent);
+ console.log('Link to uploaded file: ' + serverURL + result.response);
+ var response = result.response;
+
+ var destination = serverURL + response.substr(response.lastIndexOf('=') + 1);
+
+ document.getElementById('result').innerHTML = 'File uploaded to: ' +
+ destination +
+ "</br><button onclick=\"window.open('" + destination + "', '_blank', 'location=yes')\">Open Location</button>";
+ }
+
+ function onFileTransferFail (error) {
+ console.log('FileTransfer Error:');
+ console.log('Code: ' + error.code);
+ console.log('Source: ' + error.source);
+ console.log('Target: ' + error.target);
+ }
+ }
+}
+
+
+function onDeviceReady() {
+ document.addEventListener('backbutton', function() {
+ window.history.back();
+ });
+ var that = this,
+ App = new downloadApp(),
+ imageFileName = 'sample.png',
+ videoFileName = 'sample.3gp',
+ imageUri = encodeURI('http://demo.joomlaworks.net/images/stories/demo/walkman/DSC00009.JPG'),
+ videoUri = encodeURI('http://www.sample-videos.com/video/3gp/240/big_buck_bunny_240p_1mb.3gp'),
+ folderName = 'test';
+
+ //navigator.splashscreen.hide();
+ App.run(imageUri, videoUri, imageFileName, videoFileName, folderName);
+}
+
+
+//Initialize function
+var init = function () {
+ document.addEventListener('deviceready', onDeviceReady, false);
+};
+
+window.onload = init;
--- /dev/null
+/*
+ * Copyright (c) 2014-2015 Telerik AD
+ * Copyright (c) 2015 Samsung Electronics Co., Ltd All Rights Reserved
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* apply a natural box layout model to all elements */
+* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
+
+html
+{
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+ height:100%;
+}
+
+body
+{
+ font-family: sans-serif, Arial, Segoe UI;
+ font-size: 16px;
+ margin: 0;
+ padding: 0;
+ height:100%;
+ padding: 60px 0px 24px 0px;
+ overflow:hidden;
+}
+
+/*width, height*/
+.clear {clear:both;}
+
+.ch10 {height:10%;}
+.ch20 {height:20%;}
+.ch30 {height:30%;}
+.ch40 {height:40%;}
+.ch50 {height:50%;}
+.ch60 {height:60%;}
+.ch70 {height:70%;}
+.ch80 {height:80%;}
+.ch90 {height:90%;}
+.ch100 {height:100%;}
+
+.cw10 {width:10%;}
+.cw20 {width:20%;}
+.cw30 {width:30%;}
+.cw40 {width:40%;}
+.cw50 {width:50%;}
+.cw60 {width:60%;}
+.cw70 {width:70%;}
+.cw80 {width:80%;}
+.cw90 {width:90%;}
+.cw100 {width:100%;}
+
+/*header*/
+.header
+{
+ position:absolute;
+ top: 0px;
+ left:0px;
+ width:100%;
+ height: 60px;
+ border:none;
+ background: #dedfe1;
+ background: -moz-linear-gradient(top, #ffffff 0%, #e6e6e6 100%);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e6e6e6));
+ background: -webkit-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
+ background: -o-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
+ background: -ms-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
+ background: linear-gradient(to bottom, #ffffff 0%,#e6e6e6 100%);
+ box-shadow: 0px 1px 0px 0px #fff;
+ -webkit-box-shadow: 0px 1px 0px 0px #fff;
+ -moz-box-shadow: 0px 1px 0px 0px #fff;
+ border-bottom: 1px solid #9ca1a5;
+ color: #639ecd;
+}
+.header > h1
+{
+ font-size: 30px;
+ font-weight: normal;
+ border-bottom: 4px solid #639ecd;
+ display: inline-block;
+ margin: 0 0 0 12px;
+ position:absolute;
+ bottom:0;
+ text-shadow: 0 1px 0 #fff;
+}
+
+/*content*/
+.content
+{
+ background:#f0f0f0;
+ min-height:100%;
+ height:100%;
+ overflow:hidden;
+}
+
+.content > .input-area,
+.content > .result-area > .results > #result > .input-area,
+.content > .action-area,
+.content > .result-area {
+ width: 100%;
+ border-top: 1px solid #9ca1a5;
+ position:relative;
+}
+.content > .input-area,
+.content > .action-area {
+ border-top-color:#fff;
+}
+.content > .input-area.ch100,
+.content > .action-areach100,
+.content > .result-area.ch100 {
+ border-top-color:transparent;
+}
+
+.content > .input-area > .inputBox,
+.content > .result-area > .results > #result > .input-area > .inputBox {
+ background-color: #fff;
+ font-size:20px;
+ color: #0c0c0c;
+ width: 290px;
+ padding: 7px 6px;
+ border-radius: 3px;
+ border-width: 1px;
+ border-style: solid;
+ border-color: rgb(180, 180, 180);
+ border-bottom-color: rgb(255, 255, 255);
+ box-shadow: 0 -1px 0 #3C3C3C;
+ margin-left:8px;
+ margin-top:10px;
+ position:relative;
+}
+.content > .input-area,
+.content > .result-area > .results > #result > .input-area {
+ text-align: left;
+}
+
+.content > .result-area > .results {
+ margin:0px;
+}
+
+.content > .result-area > .results > .desc {
+ font-size:12px;
+ color:#a7a9ad;
+ margin-top:10px;
+ text-align:center;
+}
+
+.content > .result-area > .results > .result-info > div:first-of-type {
+ color:#a7a9ad;
+ font-size:20px;
+ float:left;
+ text-align:right;
+ text-shadow: 0 1px 0 #fff;
+}
+.content > .result-area > .results > .result-info > div:first-of-type + div {
+ color:#414349;
+ font-size:20px;
+ margin-left:10px;
+ float:left;
+ text-shadow: 0 1px 0 #fff;
+}
+
+/*separator*/
+.content > .result-area > .separator
+{
+ height: 12px;
+ border: none;
+ background: -moz-linear-gradient(top, rgba(227, 227, 227, 1) 0%, rgba(240, 240, 240, 1) 100%);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(227, 227, 227, 1)), color-stop(100%, rgba(240, 240, 240, 1)));
+ background: -webkit-linear-gradient(top, rgba(227, 227, 227, 1) 0%, rgba(240, 240, 240, 1) 100%);
+ background: -o-linear-gradient(top, rgba(227, 227, 227, 1) 0%, rgba(240, 240, 240, 1) 100%);
+ background: -ms-linear-gradient(top, rgba(227, 227, 227, 1) 0%, rgba(240, 240, 240, 1) 100%);
+ background: linear-gradient(to bottom, rgba(227, 227, 227, 1) 0%, rgba(240, 240, 240, 1) 100%);
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ right: 0px;
+ margin: 1px;
+}
+
+/*footer*/
+.footer
+{
+ position:fixed;
+ bottom: 0px;
+ left:0px;
+ width:100%;
+ height: 24px;
+ background:#5f626a;
+ border-top:1px solid #42444a;
+ box-shadow: inset 0px 1px 7px 0px rgba(0,0,0,0.5);
+ -webkit-box-shadow: inset 0px 1px 7px 0px rgba(0,0,0,0.5);
+ -moz-box-shadow: inset 0px 1px 7px 0px rgba(0,0,0,0.5);
+}
+
+.footer div
+{
+ position:absolute;
+ right:12px;
+ top:4px;;
+ color: #afb1b5;
+ font-size:14px;
+}
+
+/*button*/
+.button
+{
+ border: 1px solid #8d9096;
+ border-radius: 3px;
+ color: #4d5d6b;
+ background: transparent;
+ margin-left:8px;
+ margin-top:12px;
+ width: 80px;
+ height: 32px;
+ display: inline;
+ float: left;
+}
+
+.button:active
+{
+ border: 1px solid #639ecd;
+ background-image: none;
+ background-color: #639ecd;
+ color: #fff;
+ box-shadow: inset 0px 1px 1px 0px rgba(0,0,0,0.3);
+ -webkit-box-shadow: inset 0px 1px 1px 0px rgba(0,0,0,0.3);
+ -moz-box-shadow: inset 0px 1px 1px 0px rgba(0,0,0,0.3);
+}
+
+.button:disabled,
+.button:disabled:hover,
+.button:disabled:active
+{
+ background: rgba(49, 52, 55, 0.1);
+ color: rgba(255, 255, 255, 0.5);
+ border: 1px solid rgba(255, 255, 255, 0.5);
+}
+.button.dh {
+ height:60px;
+}
+.button.dw {
+ width:auto;
+ height:auto;
+}
+#downloadedContent {
+ margin: 6px auto;
+ max-width: 280px;
+ max-height: 220px;
+}
+
+/* landscape */
+@media screen and (orientation:landscape) {
+ .button.dh {
+ height:32px;
+ width:120px;
+ }
+ #downloadedContent {
+ margin: 6px auto;
+ max-width: 220px;
+ max-height: 180px;
+ }
+}
+
+/*specific*/
+.content > .result-area > .results > .desc {
+ font-size:16px;
+ color:#639ecd;
+ word-wrap:break-word;
+}
+.result-area
+{
+ text-align:center;
+}
+.left{
+ text-align: left;
+}
projects / platform / core / api / cordova-plugins.git / commitdiff