@webhandle/tree-file-browser 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/README.md +144 -0
  2. package/client-lib/base-image-name.mjs +41 -0
  3. package/client-lib/data-to-image.mjs +45 -0
  4. package/client-lib/dynamic-load.mjs +21 -0
  5. package/client-lib/file-select-dialog.mjs +70 -0
  6. package/client-lib/form-answer-dialog.mjs +65 -0
  7. package/client-lib/format-bytes.mjs +10 -0
  8. package/client-lib/get-extension-from-mime.mjs +17 -0
  9. package/client-lib/get-file-image-stats.mjs +17 -0
  10. package/client-lib/get-image-stats.mjs +11 -0
  11. package/client-lib/image-browser-view-methods/create-directory.mjs +23 -0
  12. package/client-lib/image-browser-view-methods/delete.mjs +100 -0
  13. package/client-lib/image-browser-view-methods/drag-and-drop.mjs +57 -0
  14. package/client-lib/image-browser-view-methods/file-obj-manipulation.mjs +190 -0
  15. package/client-lib/image-browser-view-methods/sink.mjs +20 -0
  16. package/client-lib/image-browser-view-methods/upload.mjs +159 -0
  17. package/client-lib/image-browser-view-methods/utils.mjs +108 -0
  18. package/client-lib/image-browser-view-methods/view-interactions.mjs +96 -0
  19. package/client-lib/image-browser-view.mjs +227 -0
  20. package/client-lib/image-resize.mjs +32 -0
  21. package/client-lib/info-dialog.mjs +36 -0
  22. package/client-lib/load-styles.mjs +14 -0
  23. package/client-lib/make-image-set.mjs +75 -0
  24. package/client-lib/name-parts.mjs +24 -0
  25. package/client-lib/styles-loaded.mjs +18 -0
  26. package/less/components.less +357 -0
  27. package/package.json +80 -0
  28. package/public/tree-file-browser/resources/css/tree-browser.css +394 -0
  29. package/public/tree-file-browser/resources/css/tree-browser.css.map +1 -0
  30. package/public/tree-file-browser/resources/js/tree-file-browser.js +2 -0
  31. package/public/tree-file-browser/resources/js/tree-file-browser.js.map +1 -0
  32. package/server-lib/initialize-tree-browser-resources.cjs +17 -0
  33. package/server-lib/initialize-tree-browser-resources.mjs +15 -0
  34. package/views/load-browser-views.js +13 -0
  35. package/views/webhandle-tree-image-browser/extension-pill.tri +1 -0
  36. package/views/webhandle-tree-image-browser/guilded-file-upload-form.tri +11 -0
  37. package/views/webhandle-tree-image-browser/guilded-image-upload-form.tri +33 -0
  38. package/views/webhandle-tree-image-browser/image-browser-frame.tri +122 -0
  39. package/views/webhandle-tree-image-browser/variant-choice-box.tri +25 -0
@@ -0,0 +1,122 @@
1
+ <div class="image-browser-frame">
2
+ <div class="directory-side">
3
+ <div class="treebox">
4
+
5
+ </div>
6
+ <div class="directory-controls">
7
+ <button type="button" class="btn create-directory" title="create new directory">
8
+ <span class="material-icons thumbnail-icon">
9
+ create_new_folder
10
+ </span>
11
+ </button>
12
+ <button type="button" class="btn delete-directory" title="delete selected directory">
13
+ <span class="material-icons thumbnail-icon">
14
+ folder_delete
15
+ </span>
16
+ </button>
17
+ </div>
18
+ </div>
19
+ <div class="node-view">
20
+ <div class="view-controls">
21
+ <div class="left">
22
+ <input name="filter" type="text" placeholder="filter" />
23
+ <button class="clear-filter">&times;</button>
24
+ </div>
25
+ <div class="right">
26
+ <span class="view-icons">
27
+ <button type="button" class="show-large-tiles" title="show big tiles" data-show-class="grid-large">
28
+ <span class="material-icons thumbnail-icon">
29
+ grid_view
30
+ </span>
31
+ </button>
32
+ <button type="button" class="show-small-tiles" title="show small tiles"
33
+ data-show-class="grid-small">
34
+ <span class="material-icons thumbnail-icon">
35
+ grid_on
36
+ </span>
37
+ </button>
38
+ <button type="button" class="show-list-rows" title="show as rows" data-show-class="rows">
39
+ <span class="material-icons thumbnail-icon">
40
+ list
41
+ </span>
42
+ </button>
43
+ <button type="button" class="show-list-text" title="show as list" data-show-class="list-text">
44
+ <span class="material-icons thumbnail-icon">
45
+ table_rows
46
+ </span>
47
+ </button>
48
+ </span>
49
+
50
+ </div>
51
+ </div>
52
+ <div class="node-content">
53
+ <div class="box-holder">
54
+ <div class="choice-boxes">
55
+ </div>
56
+ </div>
57
+ </div>
58
+ <div class="bottom-controls">
59
+ <div class="file-controls">
60
+ <button type="button" class="btn delete-file" title="delete selected file(s)">
61
+ <span class="material-icons thumbnail-icon">
62
+ delete
63
+ </span>
64
+ </button>
65
+ <button type="button" class="btn upload-file" title="upload file(s)">
66
+ <span class="material-icons thumbnail-icon">
67
+ upload
68
+ </span>
69
+ </button>
70
+ </div>
71
+
72
+ </div>
73
+ </div>
74
+ <div class="drop-cover file-drop-cover">
75
+ <div class="drop-type literal">
76
+ <div class="msg">
77
+ <h2>
78
+ Just Do It
79
+ </h2>
80
+ <p>
81
+ We won't mess the files at all, just upload them.
82
+ </p>
83
+ </div>
84
+ </div>
85
+ </div>
86
+ <div class="drop-cover img-drop-cover">
87
+ <div class="drop-type guided-upload">
88
+ <div class="msg">
89
+ <h2>Guided Upload</h2>
90
+ <p>
91
+ Let us help you rename, and resize (if needed), the files by asking you questions
92
+ </p>
93
+ </div>
94
+ </div>
95
+ <div class="drop-type automatic">
96
+ <div class="msg">
97
+ <h2>
98
+ Web Safe
99
+ </h2>
100
+ <p>
101
+ We'll rename the files so they fit better with the web and create multiple formats images.
102
+ </p>
103
+ </div>
104
+ </div>
105
+ <div class="drop-type literal">
106
+ <div class="msg">
107
+ <h2>
108
+ Just Do It
109
+ </h2>
110
+ <p>
111
+ We won't mess the files at all, just upload them.
112
+ </p>
113
+ </div>
114
+ </div>
115
+
116
+ </div>
117
+ <div class="hidden-elements">
118
+ <input name="fileUpload" type="file" placeholder="Upload a file" />
119
+
120
+ </div>
121
+
122
+ </div>
@@ -0,0 +1,25 @@
1
+ <div class="variant-choice-box">
2
+ <div class="img">
3
+ __!this.thumbnail??'<span class="material-icons thumbnail-icon">' + thumbnailIcon + '</span>'__
4
+ __this.thumbnail??'<img class="thumbnail-image" src="' + thumbnail + '" />'__
5
+ </div>
6
+ <div class="size-line">
7
+ __size__
8
+ </div>
9
+ <div class="bottom">
10
+ <div class="content">
11
+ <div class="basename">
12
+ __baseName__
13
+ </div>
14
+ <div class="extensions">
15
+ __extensions::./extension-pill__
16
+ </div>
17
+ </div>
18
+ <div class="actions">
19
+ <button class="details">
20
+ <span class="material-icons">more_vert</span>
21
+ </button>
22
+ </div>
23
+ </div>
24
+
25
+ </div>