From fbe1cead669312f33a56d7db38f880a943db5891 Mon Sep 17 00:00:00 2001 From: Donna Wu Date: Tue, 10 Jul 2012 16:02:52 +0800 Subject: [PATCH 1/4] [Image] Only show default Tizen image for empty image in design view --- src/js/views/layout.js | 9 +++++++++ src/js/widgets.js | 2 +- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/src/js/views/layout.js b/src/js/views/layout.js index 4cca3620..e841b767 100644 --- a/src/js/views/layout.js +++ b/src/js/views/layout.js @@ -408,6 +408,15 @@ // these lines. $(domNode).removeAttr('disabled'); $(domNode).children().removeAttr('disabled'); + + // Set default src for empty image to make them show up + // TODO: This case may need to improve, such as we can show a box + // with "empty image" message to notice the user + if ((admNode.getType() === "Image") && (!admNode.getProperty('src'))) { + if ($(domNode).is('img')) { + $(domNode).attr('src', "src/css/images/widgets/tizen_image.svg"); + } + } } }); })(jQuery); diff --git a/src/js/widgets.js b/src/js/widgets.js index 87f6ea6c..648db007 100644 --- a/src/js/widgets.js +++ b/src/js/widgets.js @@ -662,7 +662,7 @@ var BWidgetRegistry = { properties: { src: { type: "url-uploadable", - defaultValue: "src/css/images/widgets/tizen_image.svg", + defaultValue: "", htmlAttribute: "src", forceAttribute: true }, From b3e6360161d6f0103c7dc294f4f8ca914dc6efff Mon Sep 17 00:00:00 2001 From: Donna Wu Date: Tue, 10 Jul 2012 17:15:17 +0800 Subject: [PATCH 2/4] [General] Add function to get DOM attribute object for ADM node property --- src/js/serialize.js | 35 ++++++++++++++++++++++------------- 1 file changed, 22 insertions(+), 13 deletions(-) diff --git a/src/js/serialize.js b/src/js/serialize.js index 5baeab2b..6293b3ea 100644 --- a/src/js/serialize.js +++ b/src/js/serialize.js @@ -56,13 +56,30 @@ var DEBUG = true, }; }, + getPropertyDomAttribute = function (node, propName, newValue) { + var attrName, attrMap, attrValue, propValue; + attrName = BWidget.getPropertyHTMLAttribute(node.getType(), propName); + propValue = newValue || node.getProperty(propName); + attrValue = propValue; + if (typeof attrName === "object") { + attrMap = attrName; + attrName = attrMap.name; + if (typeof attrMap.value === "function") + attrValue = attrMap.value(propValue); + else + attrValue = attrMap.value[propValue]; + } + return {"name": attrName, + "value": attrValue}; + }, + serializeADMNodeToDOM = function (node, domParent) { var uid, type, pid, selector, parentSelector = 'body', parentNode = null, template, props, id, selMap = {}, // maps selectors to attribute maps - attrName, attrValue, propValue, propDefault, + attrObject, propValue, propDefault, widget, regEx, wrapper, domNodes; // Check for valid node @@ -127,22 +144,14 @@ var DEBUG = true, // Apply any special ADMNode properties to the template before we // create the DOM Element instance for (var p in props) { - propValue = attrValue = node.getProperty(p); + propValue = node.getProperty(p); switch (p) { case "type": break; default: - attrName = BWidget.getPropertyHTMLAttribute(type, p); - if (typeof attrName === "object") { - var attrMap = attrName; - attrName = attrMap.name; - if (typeof attrMap.value === "function") - attrValue = attrMap.value(propValue); - else - attrValue = attrMap.value[propValue]; - } - if (attrName) { + attrObject = getPropertyDomAttribute(node, p); + if (attrObject.name) { propDefault = BWidget.getPropertyDefault(type, p); if (propValue !== propDefault || @@ -159,7 +168,7 @@ var DEBUG = true, } // add attribute mapping to corresponding selector - selMap[selector][attrName] = attrValue; + selMap[selector][attrObject.name] = attrObject.value; } } break; From 39de4c9060c9e324362af9bb754b9f7e517e65c7 Mon Sep 17 00:00:00 2001 From: Donna Wu Date: Tue, 10 Jul 2012 20:07:40 +0800 Subject: [PATCH 3/4] [General] Only use sandbox URL in design view and preview --- src/js/serialize.js | 29 +++++++++++++++++++++++++++++ src/js/views/layout.js | 1 + src/js/views/live.js | 2 +- src/js/views/property.js | 2 +- 4 files changed, 32 insertions(+), 2 deletions(-) diff --git a/src/js/serialize.js b/src/js/serialize.js index 6293b3ea..9467ba61 100644 --- a/src/js/serialize.js +++ b/src/js/serialize.js @@ -748,7 +748,36 @@ $(function() { return; } + function scanSandboxFiles (admNode, handler) { + var props, p, value, urlPath, pType, projectDir, attrObject, + relativeRule, innerFiles = []; + if (!($.rib.fsUtils.fs && $.rib.pmUtils && $.rib.pmUtils.getActive())) { + return; + } + relativeRule = /^[\w\-_]+(\/[\w\-_]+)*\.?[\w]+$/i; + props = admNode.getProperties(); + projectDir = $.rib.pmUtils.ProjectDir + "/" + $.rib.pmUtils.getActive() + "/"; + for (p in props) { + value = props[p]; + pType = BWidget.getPropertyType(admNode.getType(), p); + if (pType === "url-uploadable" && relativeRule.test(value)) { + urlPath = $.rib.fsUtils.pathToUrl(projectDir + value.replace(/^\//, "")); + handler && handler(p, value, urlPath); + } + } + return; + }; + /***************** export functions out *********************/ + $.rib.useSandboxUrl = function (admNode, domNode) { + scanSandboxFiles(admNode, function (property, relativePath, urlPath) { + var attrObject = getPropertyDomAttribute(admNode, property, urlPath); + // Set the new value for the domNode + if (attrObject && attrObject.name && attrObject.value) { + $(domNode).attr(attrObject.name, attrObject.value); + } + }) + }; // Export serialization functions into $.rib namespace $.rib.ADMToJSONObj = ADMToJSONObj; $.rib.JSONToProj = JSONToProj; diff --git a/src/js/views/layout.js b/src/js/views/layout.js index e841b767..cb342df0 100644 --- a/src/js/views/layout.js +++ b/src/js/views/layout.js @@ -417,6 +417,7 @@ $(domNode).attr('src', "src/css/images/widgets/tizen_image.svg"); } } + $.rib.useSandboxUrl(admNode, domNode); } }); })(jQuery); diff --git a/src/js/views/live.js b/src/js/views/live.js index 9c0a8d3e..f1a39619 100644 --- a/src/js/views/live.js +++ b/src/js/views/live.js @@ -314,7 +314,7 @@ }); liveDoc = widget.options.contentDocument[0]; liveDoc.open(); - liveDoc.writeln(generateHTML().html); + liveDoc.writeln(generateHTML(ADM.getDesignRoot(), $.rib.useSandboxUrl).html); liveDoc.close(); } }, diff --git a/src/js/views/property.js b/src/js/views/property.js index e40e2e86..124ab42e 100644 --- a/src/js/views/property.js +++ b/src/js/views/property.js @@ -174,7 +174,7 @@ target = $(this).prev("input:text"); saveDir = $.rib.pmUtils.ProjectDir + "/" + $.rib.pmUtils.getActive() + "/images/"; $.rib.fsUtils.uploadAndSave("image", saveDir, $(this).parent(), function (file) { - target.val(file.toURL()); + target.val("images/" + file.name); target.trigger('change'); }); }) From 25005cf6ab5f59f0988825702703fd3063dffa2a Mon Sep 17 00:00:00 2001 From: Donna Wu Date: Tue, 10 Jul 2012 22:35:17 +0800 Subject: [PATCH 4/4] [FileIo] Include uploaded images in exported package --- src/js/serialize.js | 25 ++++++++++++++++++++++--- 1 file changed, 22 insertions(+), 3 deletions(-) diff --git a/src/js/serialize.js b/src/js/serialize.js index 9467ba61..490d89e7 100644 --- a/src/js/serialize.js +++ b/src/js/serialize.js @@ -693,22 +693,41 @@ $(function() { files.push(iconPath); } ribFile && zip.add(projName + ".json", ribFile); - resultHTML = generateHTML(); + resultHTML = generateHTML(null, function (admNode, domNode){ + scanSandboxFiles(admNode, function (property, relativePath, urlPath) { + // Add the image file to the needed list + files.push({ + "src":urlPath, + "dst":relativePath}); + }) + }); 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); @@ -716,7 +735,7 @@ $(function() { i++; } try { - req.open("GET", file, true); + req.open("GET", srcPath, true); req.responseType = 'arraybuffer'; } catch (e) { alert(e);