Image_manager.js 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221
  1. //Image Manager Control Script
  2. //Global Variables
  3. var csdirectory = "";//Current Selected Directory
  4. var previewMode = true;
  5. var sendmode = 0;
  6. var selectedFiles = [];
  7. //SendMode define the mode to move files.
  8. // 0 - Do not sent
  9. // 1 - Sent only selected
  10. // 2 - Sent All
  11. // 3 - Delete Selected
  12. $( document ).ready(function() {
  13. //Hide the notification bar
  14. $('#nfb').hide();
  15. //Hide the confirm box
  16. $('#confirmbox').hide();
  17. //Enable Preview mode as default
  18. $("#btn1").attr('class','ts button active');
  19. //Unselect all checkbox to prevent browser memory.
  20. toggleFalse();
  21. });
  22. //Check if the foldername contain illegal characters
  23. $('#fileNameInput').on('input',function(e){
  24. $('#fileNameInput').val($('#fileNameInput').val().replace(/[^A-Za-z0-9]/g, ""));
  25. });
  26. //Check if the user confirm folder creation
  27. $("#fileNameInput").on('keyup', function (e) {
  28. if (e.keyCode == 13) {
  29. if ($('#fileNameInput').val() != ""){
  30. $.ajax({
  31. data: 'name=' + $('#fileNameInput').val(),
  32. url: 'new_folder.php',
  33. method: 'POST', // or GET
  34. success: function(msg) {
  35. console.log(msg);
  36. if (msg == "DONE"){
  37. location.reload();
  38. }else{
  39. showNotifiy("Something went wrong on the server side :(");
  40. }
  41. }
  42. });
  43. }else{
  44. $('#filenamer').fadeOut('fast');
  45. }
  46. }
  47. });
  48. //Management finished
  49. function done(){
  50. $("body").fadeOut(1000,function(){
  51. window.location.href = "index.php";
  52. })
  53. }
  54. //Starting a new folder
  55. function newfolder(){
  56. $('#filenamer').show();
  57. $('#fileNameInput').focus();
  58. showNotifiy('Enter the folder name and press Enter to create new folder.');
  59. }
  60. //Check all checkbox
  61. function toggle() {
  62. checkboxes = document.getElementsByName('box2check');
  63. for(var i=0, n=checkboxes.length;i<n;i++) {
  64. checkboxes[i].checked = true;
  65. }
  66. }
  67. //Uncheck all checkbox
  68. function toggleFalse() {
  69. checkboxes = document.getElementsByName('box2check');
  70. for(var i=0, n=checkboxes.length;i<n;i++) {
  71. checkboxes[i].checked = false;
  72. }
  73. }
  74. function ConfirmAction(){
  75. $('#confirmbox').fadeOut('slow');
  76. if (selectedFiles.length != 0 && sendmode != 0){
  77. //There are action and files prepared to be sent
  78. $.ajax({
  79. data: 'files=' + selectedFiles + '&opr=' + sendmode + '&dir=' + csdirectory,
  80. url: 'Image_mover.php',
  81. method: 'POST', // or GET
  82. success: function(msg) {
  83. console.log(msg);
  84. if (msg == "DONE"){
  85. location.reload();
  86. }else{
  87. showNotifiy("Something went wrong on the server side :(");
  88. }
  89. }
  90. });
  91. }
  92. }
  93. function MoveFile(mode){
  94. $('#confirmbox').css('background', 'rgba(0,0,0,0.7)');
  95. if (csdirectory == "" && mode != 3){
  96. //No selected folder target
  97. showNotifiy("No target folder selected.");
  98. }else{
  99. $('#confirmbox').fadeIn('slow');
  100. var msg = "Error. Please refresh this page."
  101. sendmode = mode;
  102. if (mode == 1){
  103. //Get all the checked ids
  104. var all, checked, notChecked;
  105. all = $("input:checkbox");
  106. checked = all.filter(":checked");
  107. notChecked = all.not(":checked");
  108. var checkedIds = checked.map(function() {
  109. return this.id;
  110. });
  111. msg = "Are you sure that you want to sent the these files to '" + csdirectory +"' ? <br> This process cannot be undo. List of files to be moved:<br>";
  112. selectedFiles = [];
  113. for (var i = 0, len = checkedIds.length; i < len; i++){
  114. //console.log(GetFileNameFromID(checkedIds[i]));
  115. var filename = GetFileNameFromID(checkedIds[i]);
  116. msg += filename + " -> " + filename.replace("uploads/",csdirectory + "/") + "<br>";
  117. selectedFiles.push(filename);
  118. }
  119. console.log(selectedFiles);
  120. }else if (mode == 2){
  121. var all, checked, notChecked;
  122. all = $("input:checkbox");
  123. var Ids = all.map(function() {
  124. return this.id;
  125. });
  126. msg = "All files under 'Unsorted' will be moved to '" + csdirectory + "'. Are you sure?<br> This process cannot be undo. List of files to be moved:<br>";
  127. selectedFiles = [];
  128. for (var i = 0, len = Ids.length; i < len; i++){
  129. //console.log(GetFileNameFromID(checkedIds[i]));
  130. var filename = GetFileNameFromID(Ids[i]);
  131. msg += filename + " -> " + filename.replace("uploads/",csdirectory + "/") + "<br>";
  132. selectedFiles.push(filename);
  133. }
  134. } else if (mode == 3){
  135. $('#confirmbox').css('background', 'rgba(124,66,70,0.8)'); //DARKER:rgba(84,44,47,0.7)
  136. var all, checked, notChecked;
  137. all = $("input:checkbox");
  138. checked = all.filter(":checked");
  139. notChecked = all.not(":checked");
  140. var checkedIds = checked.map(function() {
  141. return this.id;
  142. });
  143. msg = "All selected files will be DELETED. Are you sure?<br> This process cannot be undo. List of files TO BE DELETED:<br>";
  144. selectedFiles = [];
  145. for (var i = 0, len = checkedIds.length; i < len; i++){
  146. //console.log(GetFileNameFromID(checkedIds[i]));
  147. var filename = GetFileNameFromID(checkedIds[i]);
  148. msg += "[REMOVE] " + filename + "<br>";
  149. selectedFiles.push(filename);
  150. }
  151. }
  152. $('#confirminfo').html(msg);
  153. }
  154. }
  155. function GetFileNameFromID(divid){
  156. return $("#" + divid + "-rfp").html();
  157. }
  158. function TogglePreview(){
  159. if (previewMode == true){
  160. $("#btn1").attr('class','ts button');
  161. showNotifiy("Preview Mode Disabled.");
  162. previewMode = false;
  163. $("#previewWindow").attr("src","img/Photo_manager.png");
  164. }else{
  165. $("#btn1").attr('class','ts button active');
  166. showNotifiy("Preview Mode Enabled.");
  167. previewMode = true;
  168. }
  169. }
  170. //Show preview if clicked
  171. function showPreview(divid){
  172. if (previewMode == true){
  173. var src = $("#" + divid + "-rfp").html();
  174. $("#previewWindow").attr("src",src);
  175. if($("#" + divid + "-rfp").length == 0) {
  176. console.log('DIV NOT FOUND');
  177. }
  178. }
  179. //Update other information
  180. $('#ImageName').html($("#" + divid + "-ofn").html() + "." + $("#" + divid + "-ext").html());
  181. $('#fileext').html($("#" + divid + "-ext").html());
  182. $('#storagename').html($("#" + divid + "-rfp").html());
  183. $('#imgsize').html($("#" + divid + "-size").html());
  184. //$('#targetdir').html($("#" + divid + "-rfp").html());
  185. }
  186. //Change active focus of folder
  187. function selectFolder(foldername){
  188. $("#" + foldername).attr('class','item active');
  189. if (csdirectory != ""){
  190. $("#" + csdirectory).attr('class','item');
  191. }
  192. csdirectory = foldername;
  193. $('#targetdir').html(foldername);
  194. }
  195. //Simple function for poping out the notification bar
  196. function showNotifiy(text){
  197. $('#nfbtxt').html(text);
  198. $('#nfb').stop().fadeIn('slow').delay(2000).fadeOut('slow');
  199. }