Skip to content

Commit 7e8c262

Browse files
danialfariddanialfarid
authored
Make multiline comments.
Remove the second line comment tags and make them 2 spaces tab to fit better in the view.
1 parent 229207f commit 7e8c262

File tree

1 file changed

+68
-66
lines changed

1 file changed

+68
-66
lines changed

‎README.md

Lines changed: 68 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -154,103 +154,104 @@ At least one of the `ngf-select` or `ngf-drop` are mandatory for the plugin to l
154154

155155
```html
156156
<div|button|input type="file"|ngf-select|ngf-drop...
157-
ngf-select="" or "upload($files, ...)" <!-- called when files are selected or cleared -->
158-
ngf-drop="" or "upload($files, ...)" <!-- called when files being dropped -->
159-
<!-- You can use ng-model or ngf-change instead of specifying function for ngf-drop and ngf-select -->
160-
<!-- function parameters are the same as ngf-change -->
157+
ngf-select="" or "upload($files, ...)" <!-- called when files are selected or cleared -->
158+
ngf-drop="" or "upload($files, ...)" <!-- called when files being dropped
159+
You can use ng-model or ngf-change instead of specifying function for ngf-drop and ngf-select
160+
function parameters are the same as ngf-change -->
161161
ngf-change="upload($files, $file, $newFiles, $duplicateFiles, $invalidFiles, $event)"
162162
<!-- called when files are selected, dropped, or cleared -->
163-
ng-model="myFiles" <!-- binds the valid selected/dropped file or files to the scope model -->
164-
<!-- could be an array or single file depending on ngf-multiple and ngf-keep values. -->
163+
ng-model="myFiles" <!-- binds the valid selected/dropped file or files to the scope model
164+
could be an array or single file depending on ngf-multiple and ngf-keep values. -->
165165
ngf-model-options="{updateOn: 'change click drop dropUrl paste', allowInvalid: false, debounce: 0}"
166-
<!-- updateOn could be used to disable resetting on click, or updating on paste, browser image drop, etc. -->
167-
<!-- allowInvalid default is false could allow invalid files in the model -->
168-
<!-- debouncing will postpone model update (miliseconds). See angular ng-model-options for more details. -->
166+
<!-- updateOn could be used to disable resetting on click, or updating on paste, browser
167+
image drop, etc. allowInvalid default is false could allow invalid files in the model
168+
debouncing will postpone model update (miliseconds). See angular ng-model-options for more details. -->
169169
ngf-model-invalid="invalidFile(s)" <!-- binds the invalid selected/dropped file or files to this model. -->
170-
ngf-before-model-change="beforeChange($files, ...)" <!-- called after file select/drop and before -->
171-
<!-- model change, validation and resize is processed -->
170+
ngf-before-model-change="beforeChange($files, ...)" <!-- called after file select/drop and before
171+
model change, validation and resize is processed -->
172172
ng-disabled="boolean" <!-- disables this element -->
173173
ngf-select-disabled="boolean" <!-- default false, disables file select on this element -->
174174
ngf-drop-disabled="boolean" <!-- default false, disables file drop on this element -->
175175
ngf-multiple="boolean" <!-- default false, allows selecting multiple files -->
176-
ngf-keep="true|false|'distinct'" <!-- default false, keep the previous ng-model files and -->
177-
<!-- append the new files. "'distinct'" removes duplicate files -->
178-
<!-- $newFiles and $duplicateFiles are set in ngf-change/select/drop functions. -->
179-
ngf-fix-orientation="boolean" <!-- default false, would rotate the jpeg image files that have -->
180-
<!-- exif orientation data. See #745. Could be a boolean function like shouldFixOrientation($file) -->
181-
<!-- to decide wethere to fix that file or not. -->
176+
ngf-keep="true|false|'distinct'" <!-- default false, keep the previous ng-model files and
177+
append the new files. "'distinct'" removes duplicate files
178+
$newFiles and $duplicateFiles are set in ngf-change/select/drop functions. -->
179+
ngf-fix-orientation="boolean" <!-- default false, would rotate the jpeg image files that have
180+
exif orientation data. See #745. Could be a boolean function like shouldFixOrientation($file)
181+
to decide wethere to fix that file or not. -->
182182

183183
*ngf-capture="'camera'" or "'other'" <!-- allows mobile devices to capture using camera -->
184184
*ngf-accept="'image/*'" <!-- standard HTML accept attr, browser specific select popup window -->
185185

186186
+ngf-allow-dir="boolean" <!-- default true, allow dropping files only for Chrome webkit browser -->
187-
+ngf-include-dir="boolean" <!-- default false, include directories in the dropped file array. -->
188-
<!-- You can detect if they are directory or not by checking the type === 'directory'. -->
187+
+ngf-include-dir="boolean" <!-- default false, include directories in the dropped file array.
188+
You can detect if they are directory or not by checking the type === 'directory'. -->
189189
+ngf-drag-over-class="{pattern: 'image/*', accept:'acceptClass', reject:'rejectClass', delay:100}"
190190
or "'myDragOverClass'" or "calcDragOverClass($event)"
191-
<!-- default "dragover". drag over css class behaviour. could be a string, a function -->
192-
<!-- returning class name or a json object. -->
193-
<!-- accept/reject class only works in Chrome, validating only the file mime type. -->
194-
<!-- if pattern is not specified ngf-pattern will be used. See following docs for more info. -->
195-
+ngf-drag="drag($isDragging, $class, $event)" <!-- function called on drag over/leave events. -->
196-
<!-- $isDragging: boolean true if is dragging over(dragover), false if drag has left (dragleave) -->
197-
<!-- $class is the class that is being set for the element calculated by ngf-drag-over-class -->
198-
+ngf-drop-available="dropSupported" <!-- set the value of scope model to true or false based on file -->
199-
<!-- drag&drop support for this browser -->
191+
<!-- default "dragover". drag over css class behaviour. could be a string, a function
192+
returning class name or a json object.
193+
accept/reject class only works in Chrome, validating only the file mime type.
194+
if pattern is not specified ngf-pattern will be used. See following docs for more info. -->
195+
+ngf-drag="drag($isDragging, $class, $event)" <!-- function called on drag over/leave events.
196+
$isDragging: boolean true if is dragging over(dragover), false if drag has left (dragleave)
197+
$class is the class that is being set for the element calculated by ngf-drag-over-class -->
198+
+ngf-drop-available="dropSupported" <!-- set the value of scope model to true or false
199+
based on file drag&drop support for this browser -->
200200
+ngf-stop-propagation="boolean" <!-- default false, whether to propagate drag/drop events. -->
201201
+ngf-hide-on-drop-not-available="boolean" <!-- default false, hides element if file drag&drop is not -->
202-
+ngf-enable-firefox-paste="boolean" <!-- *experimental* default false, enable firefox image paste by making element contenteditable -->
202+
+ngf-enable-firefox-paste="boolean" <!-- *experimental* default false, enable firefox image paste
203+
by making element contenteditable -->
203204

204205
ngf-resize="{width: 100, height: 100, quality: .8, type: 'image/jpeg',
205206
ratio: '1:2', centerCrop: true, pattern='.jpg', restoreExif: false}"
206-
or resizeOptions() <!-- a function returning a promise which resolves into the options. -->
207-
<!-- resizes the image to the given width/height or ratio. Quality is optional between 0.1 and 1.0), -->
208-
<!-- type is optional convert it to the given image type format. -->
209-
<!-- centerCrop true will center crop the image if it does not fit within the given width/height or ratio. -->
210-
<!-- centerCrop false (default) will not crop the image and will fit it within the given width/height or ratio -->
211-
<!-- so the resulting image width (or height) could be less than given width (or height). -->
212-
<!-- pattern is to resize only the files that their name or type matches the pattern similar to ngf-pattern. -->
213-
<!-- restoreExif boolean default true, will restore exif info on the resized image. -->
207+
or resizeOptions() <!-- a function returning a promise which resolves into the options.
208+
resizes the image to the given width/height or ratio. Quality is optional between 0.1 and 1.0),
209+
type is optional convert it to the given image type format.
210+
centerCrop true will center crop the image if it does not fit within the given width/height or ratio.
211+
centerCrop false (default) will not crop the image and will fit it within the given width/height or ratio
212+
so the resulting image width (or height) could be less than given width (or height).
213+
pattern is to resize only the files that their name or type matches the pattern similar to ngf-pattern.
214+
restoreExif boolean default true, will restore exif info on the resized image. -->
214215
ngf-resize-if="$width > 1000 || $height > 1000" or "resizeCondition($file, $width, $height)"
215216
<!-- apply ngf-resize only if this function returns true. To filter specific images to be resized. -->
216-
ngf-validate-after-resize="boolean" <!-- default false, if true all validation will be run after -->
217-
<!-- the images are being resized, so any validation error before resize will be ignored. -->
217+
ngf-validate-after-resize="boolean" <!-- default false, if true all validation will be run after
218+
the images are being resized, so any validation error before resize will be ignored. -->
218219

219220
<!-- validations: -->
220221
ngf-max-files="10" <!-- maximum number of files allowed to be selected or dropped, validate error name: maxFiles -->
221-
ngf-pattern="'.pdf,.jpg,video/*,!.jog'" <!-- comma separated wildcard to filter file names and types allowed -->
222-
<!-- you can exclude specific files by ! at the beginning. -->
223-
<!-- validate error name: pattern -->
222+
ngf-pattern="'.pdf,.jpg,video/*,!.jog'" <!-- comma separated wildcard to filter file names and
223+
types allowed you can exclude specific files by ! at the beginning. validate error name: pattern -->
224224
ngf-min-size, ngf-max-size, ngf-max-total-size="100" in bytes or "'10KB'" or "'10MB'" or "'10GB'"
225-
<!-- validate as form.file.$error.maxSize=true and file.$error='maxSize' -->
226-
<!-- ngf-max-total-size is for multiple file select and validating the total size of all files. -->
225+
<!-- validate as form.file.$error.maxSize=true and file.$error='maxSize'
226+
ngf-max-total-size is for multiple file select and validating the total size of all files. -->
227227
ngf-min-height, ngf-max-height, ngf-min-width, ngf-max-width="1000" in pixels only images
228-
<!-- validate error names: minHeight, maxHeight, minWidth, maxWidth -->
229-
ngf-ratio="8:10,1.6" <!-- list of comma separated valid aspect ratio of images in float or 2:3 format -->
230-
<!-- validate error name: ratio -->
228+
<!-- validate error names: minHeight, maxHeight, minWidth, maxWidth -->
229+
ngf-ratio="8:10,1.6" <!-- list of comma separated valid aspect ratio of images in float or 2:3 format
230+
validate error name: ratio -->
231231
ngf-min-ratio, ngf-max-ratio="8:10" <!-- min or max allowed aspect ratio for the image. -->
232232
ngf-dimensions="$width > 1000 || $height > 1000" or "validateDimension($file, $width, $height)"
233-
<!-- validate the image dimensions, validate error name: dimensions -->
233+
<!-- validate the image dimensions, validate error name: dimensions -->
234234
ngf-min-duration, ngf-max-duration="100.5" in seconds or "'10s'" or "'10m'" or "'10h'" only audio, video
235-
<!-- validate error name: maxDuration -->
235+
<!-- validate error name: maxDuration -->
236236
ngf-duration="$duration > 1000" or "validateDuration($file, $duration)"
237-
<!-- validate the media duration, validate error name: duration -->
237+
<!-- validate the media duration, validate error name: duration -->
238238

239239
ngf-validate="{size: {min: 10, max: '20MB'}, width: {min: 100, max:10000}, height: {min: 100, max: 300}
240240
ratio: '2x1', duration: {min: '10s', max: '5m'}, pattern: '.jpg'}"
241-
shorthand form for above validations in one place.
242-
ngf-validate-fn="validate($file)" <!-- custom validation function, return boolean or string containing the error. -->
243-
<!-- validate error name: validateFn -->
244-
ngf-validate-async-fn="validate($file)" <!-- custom validation function, return a promise that resolve to -->
245-
<!-- boolean or string containing the error. validate error name: validateAsyncFn -->
246-
ngf-validate-force="boolean" <!-- default false, if true file.$error will be set if the dimension or duration -->
247-
<!-- values for validations cannot be calculated for example image load error or unsupported video by the browser. -->
248-
<!-- by default it would assume the file is valid if the duration or dimension cannot be calculated by the browser. -->
249-
ngf-ignore-invalid="'pattern maxSize'" <!-- ignore the files that fail the specified validations. They will -->
250-
<!-- just be ignored and will not show up in ngf-model-invalid or make the form invalid. -->
251-
<!-- space separated list of validate error names. -->
252-
ngf-run-all-validations="boolean" <!-- default false. Runs all the specified validate directives. By default -->
253-
<!-- once a validation fails for a file it would stop running other validations for that file. -->
241+
<!-- shorthand form for above validations in one place. -->
242+
ngf-validate-fn="validate($file)" <!-- custom validation function, return boolean or string
243+
containing the error. validate error name: validateFn -->
244+
ngf-validate-async-fn="validate($file)" <!-- custom validation function, return a promise that
245+
resolve to boolean or string containing the error. validate error name: validateAsyncFn -->
246+
ngf-validate-force="boolean" <!-- default false, if true file.$error will be set if
247+
the dimension or duration values for validations cannot be calculated for example
248+
image load error or unsupported video by the browser. by default it would assume the file
249+
is valid if the duration or dimension cannot be calculated by the browser. -->
250+
ngf-ignore-invalid="'pattern maxSize'" <!-- ignore the files that fail the specified validations.
251+
They will just be ignored and will not show up in ngf-model-invalid or make the form invalid.
252+
space separated list of validate error names. -->
253+
ngf-run-all-validations="boolean" <!-- default false. Runs all the specified validate directives.
254+
By default once a validation fails for a file it would stop running other validations for that file. -->
254255

255256
>Upload/Drop</div>
256257

@@ -265,9 +266,10 @@ At least one of the `ngf-select` or `ngf-drop` are mandatory for the plugin to l
265266
<img|audio|video|div
266267
*ngf-src="file" <!-- To preview the selected file, sets src attribute to the file data url. -->
267268
*ngf-background="file" <!-- sets background-image style to the file data url. -->
268-
ngf-resize="{width: 20, height: 20, quality: 0.9}" <!-- only for image resizes the image before setting it -->
269-
<!-- as src or background image. quality is optional. -->
270-
ngf-no-object-url="true or false" <!-- see #887 to force base64 url generation instead of object url. Default false -->
269+
ngf-resize="{width: 20, height: 20, quality: 0.9}" <!-- only for image resizes the image
270+
before setting it as src or background image. quality is optional. -->
271+
ngf-no-object-url="true or false" <!-- see #887 to force base64 url generation instead of
272+
object url. Default false -->
271273
>
272274

273275
<div|span|...

0 commit comments

Comments
 (0)