1 <html><head><title>Roo/bootstrap/CardUploader.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty">
2 <span class="jsdoc-comment">/*
7 * @class Roo.bootstrap.CardUploader
8 * @extends Roo.bootstrap.Button
9 * Bootstrap Card Uploader class - it's a button which when you add files to it, adds cards below with preview and the name...
10 * @cfg {Number} errorTimeout default 3000
11 * @cfg {Array} images an array of ?? Img objects ??? when loading existing files..
12 * @cfg {Array} html The button text.
16 * Create a new CardUploader
17 * @param {Object} config The config object
20 </span><span class="jsdoc-var">Roo.bootstrap.CardUploader </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
24 </span><span class="jsdoc-var">Roo.bootstrap.CardUploader.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
27 </span><span class="jsdoc-var">this.fileCollection </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.MixedCollection</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">) {
28 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">r.data.id
29 </span><span class="jsdoc-syntax">});
31 </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
32 </span><span class="jsdoc-comment">// raw events
35 * When a image is clicked on - and needs to display a slideshow or similar..
36 * @param {Roo.bootstrap.Card} this
37 * @param {Object} The image information data
40 </span><span class="jsdoc-string">'preview' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
41 </span><span class="jsdoc-comment">/**
43 * When a the download link is clicked
44 * @param {Roo.bootstrap.Card} this
45 * @param {Object} The image information data contains
47 </span><span class="jsdoc-string">'download' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
49 </span><span class="jsdoc-syntax">});
52 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.CardUploader</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Input</span><span class="jsdoc-syntax">, {
55 </span><span class="jsdoc-var">errorTimeout </span><span class="jsdoc-syntax">: 3000,
57 </span><span class="jsdoc-var">images </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
59 </span><span class="jsdoc-var">fileCollection </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
60 </span><span class="jsdoc-var">allowBlank </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
62 </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
65 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
66 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'form-group' </span><span class="jsdoc-syntax">,
67 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
70 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
71 </span><span class="jsdoc-comment">//cls : 'input-group-addon',
72 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
74 </span><span class="jsdoc-syntax">},
77 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,
78 </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">,
79 </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">,
80 </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.value</span><span class="jsdoc-syntax">,
81 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'d-none form-control'
82 </span><span class="jsdoc-syntax">},
85 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,
86 </span><span class="jsdoc-var">multiple </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'multiple'</span><span class="jsdoc-syntax">,
87 </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'file'</span><span class="jsdoc-syntax">,
88 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'d-none roo-card-upload-selector'
89 </span><span class="jsdoc-syntax">},
92 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-card-uploader-button-container w-100 mb-2'
93 </span><span class="jsdoc-syntax">},
95 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'card-columns roo-card-uploader-container'
96 </span><span class="jsdoc-syntax">}
102 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
105 </span><span class="jsdoc-var">getChildContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() </span><span class="jsdoc-comment">/// what children are added to.
106 </span><span class="jsdoc-syntax">{
107 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.containerEl</span><span class="jsdoc-syntax">;
110 </span><span class="jsdoc-var">getButtonContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() </span><span class="jsdoc-comment">/// what children are added to.
111 </span><span class="jsdoc-syntax">{
112 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">".roo-card-uploader-button-container"</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
115 </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
118 </span><span class="jsdoc-var">Roo.bootstrap.Input.prototype.initEvents.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
120 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
121 </span><span class="jsdoc-var">this.addxtype</span><span class="jsdoc-syntax">({
122 </span><span class="jsdoc-var">xns</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
124 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
125 </span><span class="jsdoc-var">container_method </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'getButtonContainer' </span><span class="jsdoc-syntax">,
126 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.html</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// fix changable?
127 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'w-100 '</span><span class="jsdoc-syntax">,
128 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
129 </span><span class="jsdoc-string">'click' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
130 </span><span class="jsdoc-var">t.onClick</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
138 </span><span class="jsdoc-var">this.urlAPI </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">window.createObjectURL </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">window</span><span class="jsdoc-syntax">) ||
139 (</span><span class="jsdoc-var">window.URL </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">URL.revokeObjectURL </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">URL</span><span class="jsdoc-syntax">) ||
140 (</span><span class="jsdoc-var">window.webkitURL </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">webkitURL</span><span class="jsdoc-syntax">);
145 </span><span class="jsdoc-var">this.selectorEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-card-upload-selector'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
147 </span><span class="jsdoc-var">this.selectorEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'change'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onFileSelected</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
148 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.images</span><span class="jsdoc-syntax">) {
149 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
150 </span><span class="jsdoc-var">this.images.forEach</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">img</span><span class="jsdoc-syntax">) {
151 </span><span class="jsdoc-var">t.addCard</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">img</span><span class="jsdoc-syntax">)
153 </span><span class="jsdoc-var">this.images </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
155 </span><span class="jsdoc-var">this.containerEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-card-uploader-container'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
161 </span><span class="jsdoc-var">onClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
163 </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
165 </span><span class="jsdoc-var">this.selectorEl.dom.click</span><span class="jsdoc-syntax">();
169 </span><span class="jsdoc-var">onFileSelected </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
171 </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
173 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectorEl.dom.files</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.selectorEl.dom.files.length</span><span class="jsdoc-syntax">){
174 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
177 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectorEl.dom.files</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">){
178 </span><span class="jsdoc-var">this.addFile</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
179 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
187 </span><span class="jsdoc-var">addFile </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">)
190 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">){
191 </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">"Add file by name?"</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// should not happen
192 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
195 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">file </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.urlAPI</span><span class="jsdoc-syntax">){
196 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
199 </span><span class="jsdoc-comment">// file;
202 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
205 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">url </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">_this.urlAPI.createObjectURL</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
207 </span><span class="jsdoc-var">this.addCard</span><span class="jsdoc-syntax">({
208 </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap.CardUploader.ID</span><span class="jsdoc-syntax">--,
209 </span><span class="jsdoc-var">is_uploaded </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
210 </span><span class="jsdoc-var">src </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">url</span><span class="jsdoc-syntax">,
211 </span><span class="jsdoc-var">srcfile </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">,
212 </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">file.name</span><span class="jsdoc-syntax">,
213 </span><span class="jsdoc-var">mimetype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">file.type</span><span class="jsdoc-syntax">,
214 </span><span class="jsdoc-var">preview </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
215 </span><span class="jsdoc-var">is_deleted </span><span class="jsdoc-syntax">: 0
220 </span><span class="jsdoc-comment">/**
221 * addCard - add an Attachment to the uploader
222 * @param data - the data about the image to upload
226 title : "Title of file",
228 src : "http://.....",
229 srcfile : { the File upload object },
230 mimetype : file.type,
239 </span><span class="jsdoc-var">addCard </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">)
241 </span><span class="jsdoc-comment">// hidden input element?
242 // if the file is not an image...
243 //then we need to use something other that and header_image
244 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
245 </span><span class="jsdoc-comment">// remove.....
246 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">footer </span><span class="jsdoc-syntax">= [
248 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
249 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'CardFooter'</span><span class="jsdoc-syntax">,
250 </span><span class="jsdoc-var">items</span><span class="jsdoc-syntax">: [
252 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
253 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Element'</span><span class="jsdoc-syntax">,
254 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'d-flex'</span><span class="jsdoc-syntax">,
255 </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">: [
258 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
259 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
260 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">String.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"<small>{0}</small>"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">data.title</span><span class="jsdoc-syntax">),
261 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'col-10 text-left'</span><span class="jsdoc-syntax">,
262 </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">,
263 </span><span class="jsdoc-var">weight</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'link'</span><span class="jsdoc-syntax">,
264 </span><span class="jsdoc-var">fa </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'download'</span><span class="jsdoc-syntax">,
265 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
266 </span><span class="jsdoc-var">click </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
268 </span><span class="jsdoc-var">t.fireEvent</span><span class="jsdoc-syntax">( </span><span class="jsdoc-string">"download"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">);
274 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
275 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
276 </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'max-height: 28px; '</span><span class="jsdoc-syntax">,
277 </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">,
278 </span><span class="jsdoc-var">weight</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'danger'</span><span class="jsdoc-syntax">,
279 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'col-2'</span><span class="jsdoc-syntax">,
280 </span><span class="jsdoc-var">fa </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'times'</span><span class="jsdoc-syntax">,
281 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
282 </span><span class="jsdoc-var">click </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
283 </span><span class="jsdoc-var">t.removeCard</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">data.id</span><span class="jsdoc-syntax">)
295 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addxtype</span><span class="jsdoc-syntax">(
298 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
299 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Card'</span><span class="jsdoc-syntax">,
300 </span><span class="jsdoc-var">closeable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
301 </span><span class="jsdoc-var">header </span><span class="jsdoc-syntax">: !</span><span class="jsdoc-var">data.mimetype.match</span><span class="jsdoc-syntax">(/image/) && !</span><span class="jsdoc-var">data.preview </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">"Document"</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
302 </span><span class="jsdoc-var">header_image </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">data.mimetype.match</span><span class="jsdoc-syntax">(/image/) ? </span><span class="jsdoc-var">data.src </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">data.preview</span><span class="jsdoc-syntax">,
303 </span><span class="jsdoc-var">header_image_fit_square</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// fixme - we probably need to use the 'Img' element to do stuff like this.
304 </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">,
305 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
307 </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">footer</span><span class="jsdoc-syntax">,
308 </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
309 </span><span class="jsdoc-var">Roo.bootstrap.Card.prototype.initEvents.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
310 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">card </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
311 </span><span class="jsdoc-var">this.imgEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.card-img-top'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
312 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imgEl</span><span class="jsdoc-syntax">) {
313 </span><span class="jsdoc-var">this.imgEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() { </span><span class="jsdoc-var">t.fireEvent</span><span class="jsdoc-syntax">( </span><span class="jsdoc-string">"preview"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">); }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
314 </span><span class="jsdoc-var">this.imgEl.set</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-string">'pointer' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'cursor' </span><span class="jsdoc-syntax">});
317 </span><span class="jsdoc-var">this.getCardFooter</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'p-1'</span><span class="jsdoc-syntax">);
324 </span><span class="jsdoc-comment">// dont' really need ot update items.
325 // this.items.push(cn);
326 </span><span class="jsdoc-var">this.fileCollection.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">);
328 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">data.srcfile</span><span class="jsdoc-syntax">) {
329 </span><span class="jsdoc-var">this.updateInput</span><span class="jsdoc-syntax">();
330 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
333 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
334 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">reader </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">FileReader</span><span class="jsdoc-syntax">();
335 </span><span class="jsdoc-var">reader.addEventListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"load"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
336 </span><span class="jsdoc-var">data.srcdata </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">reader.result</span><span class="jsdoc-syntax">;
337 </span><span class="jsdoc-var">_t.updateInput</span><span class="jsdoc-syntax">();
339 </span><span class="jsdoc-var">reader.readAsDataURL</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">data.srcfile</span><span class="jsdoc-syntax">);
344 </span><span class="jsdoc-var">removeCard </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">)
347 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">card </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.fileCollection.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">);
348 </span><span class="jsdoc-var">card.data.is_deleted </span><span class="jsdoc-syntax">= 1;
349 </span><span class="jsdoc-var">card.data.src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">/// delete the source - so it reduces size of not uploaded images etc.
350 //this.fileCollection.remove(card);
351 //this.items = this.items.filter(function(e) { return e != card });
352 // dont' really need ot update items.
353 </span><span class="jsdoc-var">card.el.dom.parentNode.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">card.el.dom</span><span class="jsdoc-syntax">);
354 </span><span class="jsdoc-var">this.updateInput</span><span class="jsdoc-syntax">();
358 </span><span class="jsdoc-var">reset</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
360 </span><span class="jsdoc-var">this.fileCollection.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">card</span><span class="jsdoc-syntax">) {
361 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">card.el.dom </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">card.el.dom.parentNode</span><span class="jsdoc-syntax">) {
362 </span><span class="jsdoc-var">card.el.dom.parentNode.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">card.el.dom</span><span class="jsdoc-syntax">);
365 </span><span class="jsdoc-var">this.fileCollection.clear</span><span class="jsdoc-syntax">();
366 </span><span class="jsdoc-var">this.updateInput</span><span class="jsdoc-syntax">();
369 </span><span class="jsdoc-var">updateInput </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
371 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">= [];
372 </span><span class="jsdoc-var">this.fileCollection.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
373 </span><span class="jsdoc-var">data.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.data</span><span class="jsdoc-syntax">);
376 </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">JSON.stringify</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">);
386 </span><span class="jsdoc-var">Roo.bootstrap.CardUploader.ID </span><span class="jsdoc-syntax">= -1;</span></code></body></html>