Skip to content
This repository was archived by the owner on Mar 14, 2020. It is now read-only.

[FileIO] Export and import support for uploaded images #107

Closed
DonnaWuDongxia wants to merge 3 commits into from
Closed

[FileIO] Export and import support for uploaded images #107

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fa7bf14
[General] Change Sandbox URL when export and import project
DonnaWuDongxia Jun 25, 2012
a61d22c
[General] Fix bug for fsUtils.pathToUrl
DonnaWuDongxia Jun 29, 2012
af0e968
[FileIO] Export uploaded files, import related files
DonnaWuDongxia Jun 29, 2012
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/js/fs.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -157,7 +157,7 @@ $(function() {
console.log("String type is needed for file which is to be read.");
return false;
}
var url = fsUtils.fs.root.toURL() + path;
var url = fsUtils.fs.root.toURL() + path.replace(/^\//, "");
return url;
},

Expand Down
130 changes: 118 additions & 12 deletions src/js/projects.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -348,16 +348,25 @@ $(function () {
* used to create a project, such as: { "name": XXX, "theme":XXXX }
* @param {function()=} success Success callback.
* @param {function(FileError)=} error Error callback.
* @param {ADMNode}[optional] design An ADM design used to create a project.
* @param {Object}[optional] data Extra data provided to create project, may contains:
* {
* "pid": pid,
* "design": design
* ....
* }
*
* success callback passed the pid of the new created project.
* error callback passed the generated file error.
*
* @return {None}.
*/
pmUtils.createProject = function (properties, success, error, design) {
pmUtils.createProject = function (properties, success, error, data) {
var newPid, successHandler, buildDesign, errorHandler;
newPid = pmUtils.getValidPid();
if (data && data.pid) {
newPid = data.pid;
} else {
newPid = pmUtils.getValidPid();
}
buildDesign = function () {
var newDesign, newPage, config;
// build a new design
Expand All @@ -383,8 +392,8 @@ $(function () {
pmUtils.setProperties(newPid, properties);
pmUtils.setProperty(newPid, "accessDate", new Date());

if (design && (design instanceof ADMNode)) {
ADM.setDesignRoot(design);
if (data && data.design && (data.design instanceof ADMNode)) {
ADM.setDesignRoot(data.design);
} else {
ADM.setDesignRoot(buildDesign());
}
Expand Down Expand Up @@ -498,7 +507,9 @@ $(function () {
successHandler = function (result) {
var design, project;
project = $.rib.JSONToProj(result);
design = project.design;
if (project && project.design) {
design = project.design;
}
if (design && (design instanceof ADMNode)) {
// set current pid as active pid
pmUtils._activeProject = pid;
Expand Down Expand Up @@ -598,14 +609,32 @@ $(function () {
* @return {Bool} True if success, false when fails.
*/
pmUtils.exportProject = function () {
var pid, pInfo, design, obj, resultProject;
var pid, pInfo, design, obj, resultProject, extraHandler;
pid = pmUtils.getActive();
pInfo = pmUtils._projectsInfo[pid];
if (!pInfo) {
console.error("Error: Invalid pid for project");
}
design = ADM.getDesignRoot();
obj = $.rib.ADMToJSONObj(design);
// deep copy of current design
design = ADM.copySubtree(ADM.getDesignRoot());
extraHandler = function (node, object) {
var props, p, value, pType, rootUrl, projectDir;
// change sandbox URL
rootUrl = $.rib.fsUtils.fs.root.toURL();
projectDir = rootUrl.replace(/\/$/, "") + pmUtils.ProjectDir + "/" + pid + "/";
props = node.getProperties();
for (p in props) {
value = props[p];
pType = BWidget.getPropertyType(node.getType(), p);
if (pType === "url-uploadable") {
value = value.replace(projectDir, "{projectFolder}");
value = value.replace(rootUrl, "{fsRoot}");
// change the related object
object.properties[p] = value;
}
}
};
obj = $.rib.ADMToJSONObj(design, extraHandler);
// Following is for the serializing part
if (typeof obj === "object") {
obj.pInfo = pInfo;
Expand Down Expand Up @@ -641,18 +670,95 @@ $(function () {
var reader = new FileReader();

reader.onloadend = function(e) {
var properties, design, resultProject;
resultProject = $.rib.zipToProj(e.target.result);
var properties, design, designData, designRule,
copyRule, copyFiles, data, zip, successHandler,
resultProject, extraHandler, newPid, projectDir, rootUrl;
data = e.target.result;
// new pid for imported project
newPid = pmUtils.getValidPid();
designRule = /\.(json|rib)$/i;
copyRule = /^images\//i;
copyFiles = [];
try {
zip = new ZipFile(data);
zip.filelist.forEach(function(zipInfo, idx, array){
if (designRule.test(zipInfo.filename)) {
designData = zip.extract(zipInfo.filename);
}
if (copyRule.test(zipInfo.filename)) {
copyFiles.push(zipInfo.filename);
}
});
} catch (e) {
// tried to use as json
console.log(e);
console.warn("Failed to parse imported file as zip, try JSON.");
designData = data;
}

rootUrl = $.rib.fsUtils.fs.root.toURL();
projectDir = pmUtils.ProjectDir + "/" + newPid + "/";
// extra Handler when build ADM tree
extraHandler = function (node, obj) {
var props, p, value, pType;
props = node.getProperties();
for (p in props) {
value = props[p];
pType = BWidget.getPropertyType(node.getType(), p);
if (pType === "url-uploadable") {
value = value.replace("{projectFolder}", $.rib.fsUtils.pathToUrl(projectDir));
value = value.replace("{fsRoot}", rootUrl);
// set the new value for the property
node.setProperty(p, value);
}
}
};
resultProject = $.rib.JSONToProj(designData, extraHandler);
if (!resultProject) {
alert("Invalid imported project.");
return;
}
// Get properties from imported file
properties = resultProject.pInfo || {"name":"Imported Project"};
design = resultProject.design;
successHandler = function () {
var copyHandler, count;
if (copyFiles.length <= 0) {
success && success();
return;
}
count = 0;
copyHandler = function (dirEntry) {
if (!dirEntry.isDirectory) {
console.error(dirEntry.fullPath + " is not a directory to save files in sandbox.");
return;
}
// copy needed files to sandbox
$.each(copyFiles, function(i, fileName) {
$.rib.fsUtils.write(projectDir + fileName, zip.extract(fileName), function (newFile) {
count++;
if (count === copyFiles.length) {
success && success();
}
}, function(e) {
count++;
console.error("Error when copy " + projectDir + fileName + " to sandbox.");
$.rib.fsUtils.onError(e);
}, false, true);
});
}
$.rib.fsUtils.pathToEntry(projectDir + "images", copyHandler, function(e) {
// if "images/" directory not exist then create it
if (e.code === FileError.NOT_FOUND_ERR) {
$.rib.fsUtils.mkdir(projectDir + "images", copyHandler);
} else {
$.rib.fsUtils.onError(e);
}
});
};

if (design && (design instanceof ADMNode)) {
$.rib.pmUtils.createProject(properties, success, error, design);
$.rib.pmUtils.createProject(properties, successHandler, error, {"pid": newPid, "design": design});
} else {
console.error("Imported project failed");
error && error();
Expand Down
74 changes: 47 additions & 27 deletions src/js/serialize.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -386,27 +386,6 @@ $(function() {
}
}

/*
* This function is to find valid design.json in imported file and build ADMTree according it
*/
function zipToProj(data) {
var zip, designData, ribRule;
// Accept file subffixed with ".json" or ".rib"
ribRule = /\.(json|rib)$/i;
try {
zip = new ZipFile(data);
zip.filelist.forEach(function(zipInfo, idx, array) {
// use file suffixed with ".json" or ".rib", case insensitive
if (ribRule.test(zipInfo.filename)) {
designData = zip.extract(zipInfo.filename);
}
});
} catch (e) {
designData = data;
}
return JSONToProj(designData);
}

/*******************************************************
* ADM to JSON Direction
******************************************************/
Expand Down Expand Up @@ -647,7 +626,8 @@ $(function() {
'src/css/images/icons-36-black.png',
'src/css/images/icon-search-black.png',
'src/css/images/web-ui-fw_noContent.png',
'src/css/images/web-ui-fw_volume_icon.png'
'src/css/images/web-ui-fw_volume_icon.png',
'src/css/images/widgets/tizen_image.svg'
];

function getDefaultHeaderFiles (type) {
Expand Down Expand Up @@ -684,30 +664,71 @@ $(function() {
files.push(iconPath);
}
ribFile && zip.add(projName + ".json", ribFile);
resultHTML = generateHTML();
resultHTML = generateHTML(null, function (admNode, domNode) {
var props, p, value, pType, rootUrl, newPath, attrName, attrValue;
// change sandbox URL for index.html
rootUrl = $.rib.fsUtils.fs.root.toURL();
props = admNode.getProperties();
for (p in props) {
value = props[p];
pType = BWidget.getPropertyType(admNode.getType(), p);
// if the value type is url-uploadable, and value is in sandbox
if ((pType === "url-uploadable") && (value.indexOf(rootUrl) === 0)) {
// put all sandbox images as "images/fileName"
newPath = "images" + value.substr(value.lastIndexOf('/'), value.length);
// add the image file to the needed list
files.push({"src":value,
"dst":newPath});
// change the attribute for serialized DOM element
attrName = BWidget.getPropertyHTMLAttribute(admNode.getType(), p);
if (typeof attrName === "object") {
if (typeof attrName.value === "function") {
attrValue = attrName.value(newPath);
} else {
attrValue = attrName.value[newPath];
}
attrName = attrName.name;
} else {
attrValue = newPath;
}
domNode.attr(attrName, attrValue);
}
}
});
resultHTML && zip.add("index.html", resultHTML.html);
// projName now is the whole package name
projName = projName + '.' + type;

i = 0;
files.forEach(function (file, index) {
var req, srcPath, dstPath;
// We have to do ajax request not using jquery as we can't get "arraybuffer" response from jquery
var req = window.ActiveXObject ? new window.ActiveXObject( "Microsoft.XMLHTTP" ): new XMLHttpRequest();
req = window.ActiveXObject ? new window.ActiveXObject( "Microsoft.XMLHTTP" ): new XMLHttpRequest();
if ((typeof file === "object") && file.dst && file.src) {
srcPath = file.src;
dstPath = file.dst;
} else if(typeof file === "string") {
srcPath = file;
dstPath = file;
} else {
console.error("Envalid path for exported Zip.");
return;
}
req.onload = function() {
var uIntArray = new Uint8Array(this.response);
var charArray = new Array(uIntArray.length);
for (var j = 0; j < uIntArray.length; j ++) {
charArray[j] = String.fromCharCode(uIntArray[j]);
}
zip.add(file, btoa(charArray.join('')), {base64:true});
zip.add(dstPath, btoa(charArray.join('')), {base64:true});
if (i === files.length - 1){
var content = zip.generate(true);
exportFile(projName, content, true);
}
i++;
}
try {
req.open("GET", file, true);
req.open("GET", srcPath, true);
req.responseType = 'arraybuffer';
} catch (e) {
alert(e);
Expand Down Expand Up @@ -743,7 +764,6 @@ $(function() {
// Export serialization functions into $.rib namespace
$.rib.ADMToJSONObj = ADMToJSONObj;
$.rib.JSONToProj = JSONToProj;
$.rib.zipToProj = zipToProj;

$.rib.getDefaultHeaders = getDefaultHeaders;
$.rib.getDesignHeaders = getDesignHeaders;
Expand Down