<div class="entity-attribute entity-attribute-images<?php echo e(count($attribute->errors) == 0 ? '' : ' error'); ?> <?php echo e($attribute->class); ?>" title="<?php echo e(isset($attribute->errors[0]) ? $attribute->errors[0] : ''); ?>" ng-app="fileUpload" ng-controller="fileUploadController"> <?php echo Form::label($attribute->key, $attribute->label); ?> <div id="image-list-<?php echo e($attribute->key); ?>" class="image-list" ng-init='initFiles(<?php echo $attribute->getValueAsJson(); ?>)'> <data ng-init='uploadSizes = <?php echo $attribute->uploadSizes; ?>'></data> <data ng-init="dynamic = false"/></data> <data ng-init='subFolder = "<?php echo $attribute->subFolder; ?>"'></data> <?php /*Always set the attributekey*/ ?> <data ng-init='attributeKey = "<?php echo $attribute->key; ?>"'></data> <input name="<?php echo $attribute->key; ?>" type="hidden" value="{{ fileIds }}"/> <ul> <li class="new-image" ng-class="{disabled:files.length >= <?php echo $attribute->maxImages; ?>}"> <span class="disable-overlay" ng-show="files.length >= <?php echo $attribute->maxImages; ?>"></span> <button ngf-select="uploadFiles($files, $invalidFiles, <?php echo $attribute->maxImages; ?>)" multiple accept="image/*" <?php foreach($attribute->uploadRules as $rule => $value): ?> ngf-<?php echo $rule; ?>="<?php echo $value; ?>" <?php endforeach; ?> > </button> </li> </ul> <ul class="sortableOptions" ui-sortable="sortableOptions" ng-model="files"> <li ng-repeat="(index,f) in files" style="font:smaller" class="image-list-ng"> <span class="image-thumb"> <img src="{{f.thumb_image_url}}" width="50px" height="50px"/> </span> <span ng-hide="f.loading == true" class="deleteImage" ng-click="deleteImage(index)">&Cross;</span> <?php /*<span ng-click="moveImage(index,'left')" ng-show="index > 0" class="move-left move" ng-click="deleteImage(key)" >&larr;</span>*/ ?> <?php /*<span ng-click="moveImage(index,'right')" ng-show="files.length != 1 && index+1 < files.length" class="move-right move" ng-click="deleteImage(key)" >&rarr;</span>*/ ?> </li> </ul> <div class="fileUploadError" ng-show="errorMsg.toMany" ng-cloak> {{ errorMsg.toMany}} </div> <div class="fileUploadMessage" ng-show="files.length >= <?php echo $attribute->maxImages; ?> && !errorMsg.toMany" ng-cloak> <?php echo Config::get('kms::'.$lang.'/translations.maxOf'); ?> {{ maxImages }} <?php echo Config::get('kms::'.$lang.'/translations.imagesReached'); ?> </div> <div class="fileUploadError" ng-show="errFiles && errFiles.length != 0" ng-cloak> <strong><?php echo Config::get('kms::'.$lang.'/translations.problemsUploading'); ?></strong> <table class="errorTable"> <tr> <th><?php echo Config::get('kms::'.$lang.'/translations.file'); ?></th> <th><?php echo Config::get('kms::'.$lang.'/translations.error'); ?></th> <th><?php echo Config::get('kms::'.$lang.'/translations.value'); ?></th> <th><?php echo Config::get('kms::'.$lang.'/translations.required'); ?></th> </tr> <tr ng-repeat="f in errFiles"> <td>{{f.name}}</td> <?php /* Error type*/ ?> <td ng-show="f.$errorMessages.maxHeight"><?php echo Config::get('kms::'.$lang.'/translations.imagesTooHeight'); ?></td> <td ng-show="f.$errorMessages.minHeight"><?php echo Config::get('kms::'.$lang.'/translations.imagesTooShort'); ?></td> <td ng-show="f.$errorMessages.maxWidth"><?php echo Config::get('kms::'.$lang.'/translations.imagesTooLong'); ?></td> <td ng-show="f.$errorMessages.minWidth"><?php echo Config::get('kms::'.$lang.'/translations.imagesTooSmall'); ?></td> <td ng-show="f.$errorMessages.maxSize"><?php echo Config::get('kms::'.$lang.'/translations.imagesTooLarge'); ?></td> <td ng-show="f.$errorMessages.minSize"><?php echo Config::get('kms::'.$lang.'/translations.imagesTooSmallFormat'); ?></td> <?php /*File value*/ ?> <td ng-show="f.$errorMessages.maxHeight"> {{f.$ngfHeight}} <?php echo Config::get('kms::'.$lang.'/translations.pixels'); ?></td> <td ng-show="f.$errorMessages.minHeight"> {{f.$ngfHeight}} <?php echo Config::get('kms::'.$lang.'/translations.pixels'); ?></td> <td ng-show="f.$errorMessages.maxWidth"> {{f.$ngfWidth}} <?php echo Config::get('kms::'.$lang.'/translations.pixels'); ?></td> <td ng-show="f.$errorMessages.minWidth"> {{f.$ngfWidth}} <?php echo Config::get('kms::'.$lang.'/translations.pixels'); ?></td> <td ng-show="f.$errorMessages.maxSize">{{f.size / 1000000|number:1}}MB</td> <td ng-show="f.$errorMessages.minSize">{{f.size / 1000000|number:1}}MB</td> <?php /*Wanted value*/ ?> <td ng-show="f.$errorMessages.maxHeight">max. {{f.$errorParam}} <?php echo Config::get('kms::'.$lang.'/translations.pixels'); ?></td> <td ng-show="f.$errorMessages.minHeight">min. {{f.$errorParam}} <?php echo Config::get('kms::'.$lang.'/translations.pixels'); ?></td> <td ng-show="f.$errorMessages.maxWidth">max. {{f.$errorParam}} <?php echo Config::get('kms::'.$lang.'/translations.pixels'); ?></td> <td ng-show="f.$errorMessages.minWidth">min. {{f.$errorParam}} <?php echo Config::get('kms::'.$lang.'/translations.pixels'); ?></td> <td ng-show="f.$errorMessages.maxSize">max. {{f.$errorParam}}</td> <td ng-show="f.$errorMessages.minSize">min. {{f.$errorParam}}</td> </tr> </table> </div> <div class="clear"></div> </div> </div>