Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

FLUID-4238: Tweaks to reduce redundancy (but not lines of configurati…

…on) to new Image Gallery demo.
  • Loading branch information...
commit 55e881fe65ce08182bcc5787590c6fa4285ad17c 1 parent 0752e46
@colinbdclark colinbdclark authored
Showing with 44 additions and 46 deletions.
  1. +44 −46 js/uploader.js
View
90 js/uploader.js
@@ -55,21 +55,48 @@ var demo = demo || {};
fileSizeLimit: "20480",
fileUploadLimit: 0
},
+ // Boil Uploader's onFileSuccess and onFileError to match our component's semantics.
+ events: {
+ onImageSuccess: {
+ event: "onFileSuccess",
+ args: [
+ {
+ fileName: "{arguments}.0.name",
+ srcURL: "{arguments}.1"
+ }
+ ]
+ },
+ onError: {
+ event: "onFileError",
+ args: [
+ {
+ fileName: "{arguments}.0.name",
+ statusCode: "{arguments}.2"
+ }
+ ]
+ }
+ },
listeners: {
- onFileSuccess: "{imagesView}.showFile",
- onFileError: "{errorsView}.showError"
+ onImageSuccess: "{imagesView}.render",
+ onError: "{errorsView}.render"
}
}
},
imagesView: {
- type: "demo.imageGallery.imagesView",
- container: "{imageGallery}.dom.images"
+ type: "demo.imageGallery.simpleRenderer",
+ container: "{imageGallery}.dom.images",
+ options: {
+ template: "<img src='%srcURL' alt='%fileName' class='image-frame' />"
+ }
},
errorsView: {
- type: "demo.imageGallery.errorsView",
- container: "{imageGallery}.dom.errors"
+ type: "demo.imageGallery.simpleRenderer",
+ container: "{imageGallery}.dom.errors",
+ options: {
+ template: "<div>%fileName failed to upload. HTTP status code: %statusCode</div>"
+ }
},
settings: {
@@ -124,52 +151,23 @@ var demo = demo || {};
that.loadUploaderTemplate();
};
- demo.imageGallery.renderAndAppend = function(container, template, values) {
- var renderedMarkup = fluid.stringTemplate(template, values);
- container.append(renderedMarkup);
- };
/**
- * ImagesView manages the displayed images area of the page.
+ * SimpleRenderer injects a single element rendered from a string template into the DOM.
*/
- fluid.defaults("demo.imageGallery.imagesView", {
+ fluid.defaults("demo.imageGallery.simpleRenderer", {
gradeNames: ["fluid.viewComponent", "autoInit"],
- invokers: {
- showFile: {
- funcName: "demo.imageGallery.renderAndAppend",
- args: [
- "{imagesView}.container",
- "{imagesView}.options.imageMarkup",
- {
- fileName: "{arguments}.0.name",
- srcURL: "{arguments}.1"
- }
- ]
- }
- },
- imageMarkup: "<img src='%srcURL' alt='%fileName' class='image-frame' />"
+ finalInitFunction: "demo.imageGallery.simpleRenderer.init",
+ template: ""
});
- /**
- * ErrorsView displays any server errors to the user.
- */
- fluid.defaults("demo.imageGallery.errorsView", {
- gradeNames: ["fluid.viewComponent", "autoInit"],
- invokers: {
- showError: {
- funcName: "demo.imageGallery.renderAndAppend",
- args: [
- "{errorsView}.container",
- "{errorsView}.options.errorMarkup",
- {
- fileName: "{arguments}.0.name",
- statusCode: "{arguments}.2"
- }
- ]
- }
- },
- errorMarkup: "<div>%fileName failed to upload. HTTP status code: %statusCode</div>"
- });
+ demo.imageGallery.simpleRenderer.init = function (that) {
+ that.render = function (values) {
+ var renderedMarkup = fluid.stringTemplate(that.options.template, values);
+ that.container.append(renderedMarkup);
+ };
+ };
+
/**
* Settings controls the form that allow a user to customize the Uploader's options.
Please sign in to comment.
Something went wrong with that request. Please try again.