45 lines
1.4 KiB
HTML
45 lines
1.4 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html ng-app="app" flow-init
|
||
|
|
flow-file-added="!!{png:1,gif:1,jpg:1,jpeg:1}[$file.getExtension()]"
|
||
|
|
flow-files-submitted="$flow.upload()">
|
||
|
|
<head>
|
||
|
|
<title>Image</title>
|
||
|
|
<script src="../../bower_components/angular/angular.js"></script>
|
||
|
|
<script src="../../dist/ng-flow-standalone.js"></script>
|
||
|
|
<script src="app.js"></script>
|
||
|
|
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css"
|
||
|
|
rel="stylesheet"/>
|
||
|
|
<style>
|
||
|
|
.thumbnail {
|
||
|
|
max-width: 200px; max-height: 150px; line-height: 20px; margin-bottom: 5px;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<div class="container">
|
||
|
|
<h1>flow image example</h1>
|
||
|
|
<hr class="soften"/>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<div class="thumbnail" ng-hide="$flow.files.length">
|
||
|
|
<img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&text=no+image" />
|
||
|
|
</div>
|
||
|
|
<div class="thumbnail" ng-show="$flow.files.length">
|
||
|
|
<img flow-img="$flow.files[0]" />
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<a href="#" class="btn" ng-hide="$flow.files.length" flow-btn flow-attrs="{accept:'image/*'}">Select image</a>
|
||
|
|
<a href="#" class="btn" ng-show="$flow.files.length" flow-btn flow-attrs="{accept:'image/*'}">Change</a>
|
||
|
|
<a href="#" class="btn btn-danger" ng-show="$flow.files.length"
|
||
|
|
ng-click="$flow.cancel()">
|
||
|
|
Remove
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<p>
|
||
|
|
Only PNG,GIF,JPG files allowed.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|