Fix code style and folder structure of the feature

This commit is contained in:
Matheus Faustino 2018-08-06 22:50:00 -03:00
parent 9b6475e30f
commit 457e05025d
12 changed files with 82 additions and 38 deletions

View File

@ -1187,10 +1187,10 @@
"retrieveBckp": {
"message": "Import styles"
},
"bckpDropboxStyles": {
"syncDropboxStyles": {
"message": "Dropbox Export"
},
"retrieveDropboxBckp": {
"retrieveDropboxSync": {
"message": "Dropbox Import"
},
"overwriteFileExport": {
@ -1203,22 +1203,22 @@
"message": "You don't have a file to import."
},
"connectingDropbox": {
"message": "Connecting Dropbox."
"message": "Connecting Dropbox..."
},
"gettingStyles": {
"message": "Getting all styles."
"message": "Getting all styles..."
},
"compactStyles": {
"message": "Compacting styles."
"zipStyles": {
"message": "Zipping styles..."
},
"descompactStyles": {
"message": "Descompating styles."
"unzipStyles": {
"message": "Unzipping styles..."
},
"readingStyles": {
"message": "Reading styles."
"message": "Reading styles..."
},
"uploadingFile": {
"message": "Uploading File."
"message": "Uploading File..."
},
"optionsBadgeNormal": {
"message": "Background color"

View File

@ -167,10 +167,11 @@
<script src="js/sections-equal.js" async></script>
<script src="js/storage-util.js" async></script>
<script src="vendor/dropbox/dropbox-sdk.js" async></script>
<script src="vendor/zipjs/zip.js" defer></script>
<script src="manage/compress-text.js" defer></script>
<script src="manage/import-export-dropbox.js" async></script>
<script src="sync/vendor/dropbox/dropbox-sdk.js" async></script>
<script src="sync/vendor/zipjs/zip.js" defer></script>
<script src="sync/compress-text.js" defer></script>
<script src="sync/cross-browser-functions.js" defer></script>
<script src="sync/import-export-dropbox.js" async></script>
</head>
<body id="stylus-manage" i18n-dragndrop-hint="dragDropMessage">
@ -370,8 +371,8 @@
<div id="backup-buttons">
<button id="file-all-styles" i18n-text="bckpInstStyles"></button>
<button id="unfile-all-styles" i18n-text="retrieveBckp"></button>
<button id="sync-dropbox-export" i18n-text="bckpDropboxStyles"></button>
<button id="sync-dropbox-import" i18n-text="retrieveDropboxBckp"></button>
<button id="sync-dropbox-export" i18n-text="syncDropboxStyles"></button>
<button id="sync-dropbox-import" i18n-text="retrieveDropboxSync"></button>
</div>
</details>

View File

@ -1,10 +1,16 @@
/* global messageBox */
/* global zip */
'use strict';
onDOMready().then(() => {
zip.workerScriptsPath = '/vendor/zipjs/';
zip.workerScriptsPath = '/sync/vendor/zipjs/';
});
/**
* @param {String} filename
* @param {String} text content of the file as text
* @returns {Promise<Blob>} resolves to a blob object representing the zip file
*/
function createZipFileFromText(filename, text) {
return new Promise((resolve, reject) => {
zip.createWriter(new zip.BlobWriter('application/zip'), writer => {
@ -17,6 +23,10 @@ function createZipFileFromText(filename, text) {
});
}
/**
* @param {Object} blob object of zip file
* @returns {Promise<String>} resolves to a string the content of the first file of the zip
*/
function readZipFileFromBlob(blob) {
return new Promise((resolve, reject) => {
zip.createReader(new zip.BlobReader(blob), zipReader => {

View File

@ -0,0 +1,26 @@
'use strict';
/**
* @returns {String} returns a redirect URL to be used in |launchWebAuthFlow|
*/
function getRedirectUrlAuthFlow() {
const browserApi = typeof browser === 'undefined' ? chrome : browser;
return browserApi.identity.getRedirectURL();
}
/**
* @param {Object} details based on chrome api
* @param {string} details.url url that initiates the auth flow
* @param {boolean} details.interactive if it is true a window will be displayed
* @return {Promise} returns the url containing the token for extraction
*/
function launchWebAuthFlow(details) {
if (typeof browser === 'undefined') {
return new Promise(resolve => {
chrome.identity.launchWebAuthFlow(details, resolve);
});
}
return browser.identity.launchWebAuthFlow(details);
}

View File

@ -1,4 +1,9 @@
/* global messageBox */
/* global Dropbox */
/* global createZipFileFromText */
/* global readZipFileFromBlob */
/* global launchWebAuthFlow */
/* global getRedirectUrlAuthFlow */
'use strict';
const DROPBOX_API_KEY = '';
@ -29,11 +34,10 @@ function hasDropboxAccessToken() {
}
function requestDropboxAccessToken() {
const browserApi = typeof browser === 'undefined' ? chrome : browser;
const client = new Dropbox.Dropbox({clientId: DROPBOX_API_KEY});
const authUrl = client.getAuthenticationUrl(browserApi.identity.getRedirectURL());
const authUrl = client.getAuthenticationUrl(getRedirectUrlAuthFlow());
return browserApi.identity.launchWebAuthFlow({url: authUrl, interactive: true})
return launchWebAuthFlow({url: authUrl, interactive: true})
.then(urlReturned => {
const params = new URLSearchParams(new URL(urlReturned).hash.replace('#', ''));
chromeLocal.setValue('dropbox_access_token', params.get('access_token'));
@ -46,10 +50,11 @@ function uploadFileDropbox(client, stylesText) {
}
$('#sync-dropbox-export').onclick = () => {
const title = t('syncDropboxStyles');
messageProgressBar({title: title, text: t('connectingDropbox')});
messageProgressBar({title: t('bckpDropboxStyles'), text: t('connectingDropbox')});
hasDropboxAccessToken().then(token => token || requestDropboxAccessToken())
hasDropboxAccessToken()
.then(token => token || requestDropboxAccessToken())
.then(token => {
const client = new Dropbox.Dropbox({
clientId: DROPBOX_API_KEY,
@ -68,46 +73,47 @@ $('#sync-dropbox-export').onclick = () => {
})
// file deleted with success, get styles and create a file
.then(() => {
messageProgressBar({title: t('bckpDropboxStyles'), text: t('gettingStyles')});
messageProgressBar({title: title, text: t('gettingStyles')});
return API.getStyles().then(styles => JSON.stringify(styles, null, '\t'));
})
// create zip file
.then(stylesText => {
messageProgressBar({title: t('bckpDropboxStyles'), text: t('compactStyles')});
messageProgressBar({title: title, text: t('zipStyles')});
return createZipFileFromText(FILENAME_ZIP_FILE, stylesText);
})
// create file dropbox
.then(zipedText =>{
messageProgressBar({title: t('bckpDropboxStyles'), text: t('uploadingFile')});
.then(zipedText => {
messageProgressBar({title: title, text: t('uploadingFile')});
return uploadFileDropbox(client, zipedText);
return uploadFileDropbox(client, zipedText);
})
// gives feedback to user
.then(() => messageProgressBar({title: t('bckpDropboxStyles'), text: t('exportSavedSuccess')}))
.then(() => messageProgressBar({title: title, text: t('exportSavedSuccess')}))
// handle not found cases and cancel action
.catch(error => {
console.log(error);
// saving file first time
if (error.status === API_ERROR_STATUS_FILE_NOT_FOUND) {
API.getStyles()
.then(styles => {
messageProgressBar({title: t('bckpDropboxStyles'), text: t('gettingStyles')});
messageProgressBar({title: title, text: t('gettingStyles')});
return JSON.stringify(styles, null, '\t');
})
.then(stylesText => {
messageProgressBar({title: t('bckpDropboxStyles'), text: t('compactStyles')});
messageProgressBar({title: title, text: t('zipStyles')});
return createZipFileFromText(FILENAME_ZIP_FILE, stylesText);
})
.then(zipedText => {
messageProgressBar({title: t('bckpDropboxStyles'), text: t('uploadingFile')});
messageProgressBar({title: title, text: t('uploadingFile')});
return uploadFileDropbox(client, zipedText);
})
.then(() => messageProgressBar({title: t('bckpDropboxStyles'), text: t('exportSavedSuccess')}))
.then(() => messageProgressBar({title: title, text: t('exportSavedSuccess')}))
.catch(err => messageBox.alert(err));
return;
@ -124,10 +130,11 @@ $('#sync-dropbox-export').onclick = () => {
};
$('#sync-dropbox-import').onclick = () => {
const title = t('retrieveDropboxSync');
messageProgressBar({title: title, text: t('connectingDropbox')});
messageProgressBar({title: t('retrieveDropboxBckp'), text: t('connectingDropbox')});
hasDropboxAccessToken().then(token => token || requestDropboxAccessToken())
hasDropboxAccessToken()
.then(token => token || requestDropboxAccessToken())
.then(token => {
const client = new Dropbox.Dropbox({
clientId: DROPBOX_API_KEY,
@ -136,12 +143,12 @@ $('#sync-dropbox-import').onclick = () => {
return client.filesDownload({path: '/' + DROPBOX_FILE})
.then(response => {
messageProgressBar({title: t('retrieveDropboxBckp'), text: t('descompactStyles')});
messageProgressBar({title: title, text: t('unzipStyles')});
return readZipFileFromBlob(response.fileBlob);
})
.then(zipedFileBlob => {
messageProgressBar({title: t('retrieveDropboxBckp'), text: t('readingStyles')});
messageProgressBar({title: title, text: t('readingStyles')});
const fileBlob = zipedFileBlob;