| /file.html |
|---|
| @@ -18,7 +18,7 @@ |
|---|
| <!-- DropZone --> |
| <link href="bower_components/dropzone/dist/min/dropzone.min.css" rel="stylesheet"> |
| <!-- TagsInput --> |
| <link href="bower_components/bootstrap-tagsinput/dist/bootstrap-tagsinput.css" rel="stylesheet"> |
| <link href="bower_components/bootstrap-tokenfield/dist/css/bootstrap-tokenfield.min.css" rel="stylesheet"> |
| |
| <!-- Site-wide style CCS --> |
| <link href="css/style.css" rel="stylesheet"> |
| @@ -112,7 +112,8 @@ |
|---|
| </div> |
| <label for="file-tags">Tags:</label> |
| <div class="input-group"> |
| <select id="file-tags" multiple class="form-control file-tags"></select> |
| <!-- <select id="file-tags" multiple class="form-control file-tags"></select> --> |
| <input type="text" class="form-control tokenfield file-tags" id="file-tags" data-minLength="3" data-delimiter=" "/> |
| </div> |
| <strong class="error text-danger" data-dz-errormessage></strong> |
| </div> |
| @@ -165,7 +166,9 @@ |
|---|
| <!-- Clipboard --> |
| <script src="bower_components/clipboard/dist/clipboard.min.js"></script> |
| <!-- TagsInput --> |
| <script src="bower_components/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js"></script> |
| <!-- <script src="bower_components/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js"></script> --> |
| <!-- BootStrap TokenField --> |
| <script src="bower_components/bootstrap-tokenfield/dist/bootstrap-tokenfield.min.js"></script> |
| <!-- Angular Initialization. --> |
| <script> |
| var app = angular.module('scratch', []); |
| @@ -207,22 +210,18 @@ |
|---|
| .previewElement |
| .querySelector('.file-tags') |
| .getAttribute('id'); |
| |
| |
| const tags = $('#' + tagsBoxID) |
| .tagsinput('items'); |
| .tokenfield('getTokens') |
| .map((token) => { |
| return token.value; |
| }); |
| |
| formData.append('tags', JSON.stringify(tags)); |
| |
| // And disable the tags bar. |
| const tagsContainerID = file |
| .previewElement |
| .querySelector('.bootstrap-tagsinput') |
| .getAttribute('id'); |
| |
| $('#' + tagsBoxID).attr('readonly', 'readonly'); |
| $('#' + tagsBoxID).attr('disabled', 'disabled'); |
| $('#' + tagsContainerID).attr('readonly', 'readonly'); |
| $('#' + tagsContainerID).attr('disabled', 'disabled'); |
| $('#' + tagsBoxID).tokenfield('readonly'); |
| $('#' + tagsBoxID).tokenfield('disable'); |
| |
| }).on('addedfile', (file) => { |
| // Hookup the start button. |
| @@ -316,27 +315,9 @@ |
|---|
| .previewElement |
| .querySelector('#file-tags') |
| .setAttribute('id', tagsBoxID); |
| |
| $('#' + tagsBoxID).tokenfield(); |
| |
| $('#' + tagsBoxID).tagsinput('refresh'); |
| |
| // Set the ID of the tags div. |
| const tagsContainerID = '_' + Math |
| .random() |
| .toString(36) |
| .substr(2, 9); |
| |
| // Add form control to tags list. |
| file |
| .previewElement |
| .querySelector('.bootstrap-tagsinput') |
| .classList |
| .add('form-control'); |
| |
| file |
| .previewElement |
| .querySelector('.bootstrap-tagsinput') |
| .setAttribute('id', tagsContainerID); |
| |
| }).on('totaluploadprogress', (progress) => { |
| document |
| .querySelector('#total-progress .progress-bar') |
