BookStack Code Mirror - bookstack/blob - resources/views/pages/parts/image-manager.blade.php

1 <div components="image-manager dropzone"

2 option:dropzone:url="{{ url('/images/gallery?' . http_build_query(['uploaded_to' => $uploaded_to ?? 0])) }}"

3 option:dropzone:success-message="{{ trans('components.image_upload_success') }}"

4 option:dropzone:error-message="{{ trans('errors.image_upload_error') }}"

5 option:dropzone:upload-limit="{{ config('app.upload_limit') }}"

6 option:dropzone:upload-limit-message="{{ trans('errors.server_upload_limit') }}"

7 option:dropzone:zone-text="{{ trans('components.image_dropzone_drop') }}"

8 option:dropzone:file-accept="image/*"

9 option:dropzone:allow-multiple="true"

10 option:image-manager:uploaded-to="{{ $uploaded_to ?? 0 }}"

11 class="image-manager">

12

13 <div component="popup"

14 refs="image-manager@popup"

15 class="popup-background">

16 <div class="popup-body" tabindex="-1">

17

18 <div class="popup-header primary-background">

19 <div class="popup-title">{{ trans('components.image_select') }}</div>

20 <button refs="dropzone@selectButton image-manager@uploadButton" type="button">

21 <span>@icon('upload')</span>

22 <span>{{ trans('components.image_upload') }}</span>

23 </button>

24 <button refs="popup@hide"

25 type="button"

26 title="{{ trans('common.close') }}"

27 class="popup-header-close">@icon('close')</button>

28 </div>

29

30 <div component="tabs"

31 option:tabs:active-under="880"

32 refs="dropzone@drop-target"

33 class="flex-container-column image-manager-body">

34 <div class="tab-container">

35 <div role="tablist" class="hide-over-m mb-none">

36 <button id="image-manager-list-tab"

37 aria-selected="true"

38 aria-controls="image-manager-list"

39 role="tab">{{ trans('components.image_list') }}</button>

40 <button id="image-manager-info-tab"

41 aria-selected="true"

42 aria-controls="image-manager-info"

43 role="tab">{{ trans('components.image_details') }}</button>

44 </div>

45 </div>

46 <div class="flex-container-row flex-fill flex">

47 <div id="image-manager-list"

48 tabindex="0"

49 role="tabpanel"

50 aria-labelledby="image-manager-list-tab"

51 class="image-manager-content">

52 <div class="image-manager-filter-bar flex-container-row wrap justify-space-between">

53 <div class="primary-background image-manager-filter-bar-bg"></div>

54 <div>

55 <form refs="image-manager@searchForm" role="search" class="contained-search-box floating mx-m my-s">

56 <input refs="image-manager@searchInput"

57 placeholder="{{ trans('components.image_search_hint') }}"

58 type="search">

59 <button refs="image-manager@cancelSearch"

60 title="{{ trans('common.search_clear') }}"

61 type="button"

62 hidden="hidden"

63 class="cancel">@icon('close')</button>

64 <button type="submit"

65 title="{{ trans('common.search') }}">@icon('search')</button>

66 </form>

67 </div>

68 <div class="tab-container bordered mx-m my-s">

69 <div role="tablist" class="image-manager-filters flex-container-row mb-none">

70 <button refs="image-manager@filterTabs"

71 data-filter="all"

72 role="tab"

73 aria-selected="true"

74 type="button"

75 title="{{ trans('components.image_all_title') }}">@icon('images')</button>

76 <button refs="image-manager@filterTabs"

77 data-filter="book"

78 role="tab"

79 aria-selected="false"

80 type="button"

81 title="{{ trans('components.image_book_title') }}">@icon('book', ['class' => 'svg-icon'])</button>

82 <button refs="image-manager@filterTabs"

83 data-filter="page"

84 role="tab"

85 aria-selected="false"

86 type="button"

87 title="{{ trans('components.image_page_title') }}">@icon('page', ['class' => 'svg-icon'])</button>

88 </div>

89 </div>

90 </div>

91 <div refs="image-manager@listContainer" class="image-manager-list"></div>

92 <div refs="image-manager@loadMore" class="load-more" hidden>

93 <button type="button" class="button small outline">Load More</button>

94 </div>

95 </div>

96

97 <div id="image-manager-info"

98 tabindex="0"

99 role="tabpanel"

100 aria-labelledby="image-manager-info-tab"

101 class="image-manager-sidebar flex-container-column">

102

103 <div refs="image-manager@dropzoneContainer">

104 <div refs="dropzone@status-area"></div>

105 </div>

106

107 <div refs="image-manager@form-container-placeholder" class="p-m text-small text-muted">

108 <p>{{ trans('components.image_intro') }}</p>

109 <p refs="image-manager@upload-hint">{{ trans('components.image_intro_upload') }}</p>

110 </div>

111

112 <div refs="image-manager@formContainer" class="inner flex">

113 </div>

114 </div>

115 </div>

116 </div>

117

118 <div class="popup-footer">

119 <button refs="image-manager@selectButton" type="button" class="hidden button">

120 {{ trans('components.image_select_image') }}

121 </button>

122 </div>

123

124 </div>

125 </div>

126 </div>