Resize polish and some other stuff

Leeous · May 6, 2019 · 04df256 · 04df256
1 parent 330c45d
commit 04df256
Show file tree

Hide file tree

Showing 6 changed files with 69 additions and 24 deletions.
diff --git a/README.md b/README.md
@@ -0,0 +1 @@
+# Garry's Mod Addon Tool
diff --git a/index.html b/index.html
@@ -62,6 +62,7 @@ <h3>Addon creation</h3>
                 </div>
                 <div id="addonIconPrompt">
                     <p>Please select an icon for your addon</p>
+                    <p style="font-size: 0.8em">Must be a JPEG/JPG</p>
                     <button class="button_normal fake_select" data-buttonclick="#addon_icon">Choose Directory</button>
                     <input id="addon_icon" class="real_select" type="file"/>
                     <div class="next_prompt">
@@ -72,7 +73,7 @@ <h3>Addon creation</h3>
                     <p>Do you already have a addon.json?</p>
                     <div>
                         <button class="button_normal transition_button removeBackOption" data-divtoshow="#jsonCreator" data-divtohide="#addonjsonPrompt" data-resize="500, 350">No</button>
-                        <button class="button_normal transition_button removeBackOption" data-divtoshow="#gmaPrep" data-divtohide="#addonjsonPrompt" data-resize="500, 250">Yes</button>
+                        <button class="button_normal transition_button removeBackOption" data-divtoshow="#gmaPrep" data-divtohide="#addonjsonPrompt" data-resize="500, 200">Yes</button>
                     </div>
                 </div>
                 <div id="jsonCreator">
@@ -152,30 +153,42 @@ <h3>Addon creation</h3>
                             <p><span style="font-size: .7em; color: grey; font-weight:500;">(file names seprated by a comma)</span></p>
                         </div>
                         <div class="next_prompt">
-                            <button id="jsonAddonValidate" class="transition_button" data-divtoshow="#gmaPrep" data-divtohide="#jsonCreator" data-resize="500, 250" disabled>Next</button>
+                            <button id="jsonAddonValidate" class="transition_button" data-divtoshow="#gmaPrep" data-divtohide="#jsonCreator" data-resize="500, 200" disabled>Next</button>
                         </div>
                     </div>
                 </div>
                 <div id="gmaPrep">
-                    <p>Created <span style="font-weight: 700">addon.json</span>!</p>
+                    <!-- <p>Created <span style="font-weight: 700">addon.json</span>!</p> -->
                     <h3>Create GMA for uploading to the Workshop?</h3>
-                    <button style="width: 150px;" class="button_normal transition_button" id="resetAddonCreation" data-divtohide="#create_new_addon" data-divtoshow="#addon_management_prompt" data-resize="500, 175">No</button>
-                    <button style="width: 150px;" id="createGMAFile" class="button_normal transition_button">Yes</button>
+                    <button style="width: 100px;" class="button_normal transition_button" id="resetAddonCreation" data-divtohide="#create_new_addon" data-divtoshow="#addon_management_prompt" data-resize="500, 175">No</button>
+                    <button style="width: 100px;" id="createGMAFile" class="button_normal transition_button">Yes</button>
                     <!-- <img src="src/img/loading.gif" style="display: block; margin-left: auto; margin-right: auto; width: 64px;" alt=""> -->
                 </div>
                 <div id="createGMA">
                     <p>Creating GMA...</p>
                     <img src="src/img/loading.gif" style="width: 64px; display: block; margin-left: auto; margin-right: auto; margin-top: 35px;" alt="">
                 </div>
                 <div id="uploadToWorkshopPrompt">
-                    <p>Upload to the Workshop?</p>
-                    <button class="button_normal">No</button>
-                    <button id="uploadCurrentGMA" class="button_normal">Yes</button>
+                    <h3>Upload to the Workshop?</h3>
+                    <button style="width: 100px;" class="button_normal">No</button>
+                    <button style="width: 100px;" id="uploadCurrentGMA" class="button_normal">Yes</button>
+                </div>
+                <div id="uploading">
+                    <p>Uploading to the workshop...</p>
+                    <img src="src/img/loading.gif" style="width: 64px; display: block; margin-left: auto; margin-right: auto; margin-top: 35px;" alt="">
+                </div>
+                <div id="new_addon">
+                    <p>Uploaded!</p>
+                    <p><a id="new_addon_link" style="color: white;" href="#">View on Steam</a></p>
+                    <button class="button_normal" style="width: 100px;">Done</button>
                 </div>
-
             </div>
         </div>
     </div>
+    <div id="errorNote">
+        <p>Error: <span id="error"></span></p>
+        <button class="button_normal">Okay</button>
+    </div>
     <div id="checkmarkNote">
         <img src="src/img/checkmark.png" alt="">
         <p>Saved!</p>

diff --git a/index.js b/index.js
@@ -30,6 +30,7 @@ function createWindow() {
           backgroundColor: "#262626",
           titleBarStyle: "hidden",
           frame: false,
+          icon: "src/img/icon.png",
           webPreferences: {
               nodeIntegration: true
           }
@@ -77,9 +78,9 @@ ipcMain.on('checkIfDirectoryExists', (event, file) => {
 })
 
 ipcMain.on('getAddonInfo', () => {
-  console.log('trying to get addon info')
+  console.log('Trying to get addon info...')
   sendClientAddonInfo()
-  console.log(settings.get('gmodDirectory'))
+  console.log("User's Gmod Directory:" + settings.get('gmodDirectory'))
 })
 
 var ADDON_IDS = []
@@ -95,8 +96,7 @@ function sendClientAddonInfo() {
         fixedArray[i] = fixedArray[i].replace('/r', '');
         ADDON_IDS.push([fixedArray[i].substr(0, 11).replace(/\s/g, '').toString()])
     }
-
-    console.log('sent to client!')
+    console.log('Sent to client!')
     mainWindow.webContents.send('message', ADDON_IDS);
   });
 }
@@ -105,6 +105,7 @@ ipcMain.on('createJsonFile', (event, json, dir) => {
   console.log(json, dir)
   fs.writeFileSync(dir + "\\addon.json", json, 'utf8', (err) => {
     console.log("An error occured while writing JSON Object to File.\n", err);
+    mainWindow.webContents.send('error', "Error writing directory.");
   })
 })
 
@@ -118,16 +119,23 @@ ipcMain.on('createGMAFile', (event, addonDir) => {
     var addonGMADir = fixedArray;
     console.log("GMA location: " + addonGMADir);
     mainWindow.webContents.send('addonGMALocation', addonGMADir);
-  })
-})
+  });
+});
 
 ipcMain.on('uploadToWorkshop', (event, gmaDir, iconDir) => {
   const gmpublish = spawn(settings.get('gmodDirectory') + '\\bin\\gmpublish.exe', ['create', '-icon', iconDir, '-addon', gmaDir]);
   gmpublish.stdout.on('data', (data) => {
-    console.log(data.toString());
+    var arrayOfOutput = data.toString().split('\n')
+    var fixedArray = arrayOfOutput.slice(arrayOfOutput.length - 8, arrayOfOutput.length - 7)
+    fixedArray = fixedArray[0].replace(/\D/, '')
+    fixedArray = fixedArray.substr(5, fixedArray.length)
+    console.log(fixedArray)
+    mainWindow.webContents.send('currentAddonID', fixedArray);
   })
 })
 
 
 
+
+
 // gmpublish.exe create -icon path/to/image512x512.jpg -addon path/to/gma.gma
diff --git a/src/css/style.css b/src/css/style.css
@@ -164,7 +164,7 @@ header {
     text-align: center;
 }
 
-#update_existing_addon, #directory_selection, #create_new_addon, #jsonCreator, #gmaPrep, #addonjsonPrompt, #addon_management_prompt, #createGMA, #uploadToWorkshopPrompt, #addonIconPrompt {
+#update_existing_addon, #directory_selection, #create_new_addon, #jsonCreator, #gmaPrep, #addonjsonPrompt, #addon_management_prompt, #createGMA, #uploadToWorkshopPrompt, #addonIconPrompt, #uploading, #new_addon, #errorNote {
     display: none;
 }
 
@@ -232,6 +232,11 @@ header {
     margin: 0
 }
 
+.addon_existing a {
+    color: white;
+    display: none;
+}
+
 .removeBackOption {
     width: 100px;
 }

diff --git a/src/img/icon.png b/src/img/icon.png
diff --git a/src/js/script.js b/src/js/script.js
@@ -144,9 +144,6 @@ $(document).ready(() => {
             $('#addonIconCheck').css('background-color', '#56bd56');
             $('#addonIconCheck').prop('disabled', false);
             $('#addonIconCheck').css('cursor', 'pointer');
-            win.setBounds({
-                height: 350
-            })
         } else {
             $('#addonIconCheck').css('background-color', '#0f0f0f');
             $('#addonIconCheck').prop('disabled', true);
@@ -193,6 +190,7 @@ $(document).ready(() => {
         var divToGoBack = $(target).data('divtohide');
         var divToShow = $(target).data('divtoshow');
         console.log(divToGoBack, divToShow)
+        // Checks for resize data, if it exists, pass it to goBack()
         if ($(target).data('resize') != null) {
             var resizeInfo = JSON.parse("[" + $(target).data('resize') + "]");
         }
@@ -203,7 +201,7 @@ $(document).ready(() => {
         $('#back_button_addon_creation').fadeOut();
     })
 
-    // General function for transitioning between div tags
+    // General function for transitioning between div tags (with a shitty name)
     function goBack(divToFadeOut, divToFadeIn, resizeInfo) {
         $(divToFadeOut).fadeOut(() => {
             if (resizeInfo != null) {
@@ -221,7 +219,7 @@ $(document).ready(() => {
         // This check is done to make sure this only gets executed once
         if (!donePopulatingAddonList) {
             for (let i = 0; i < addon_data.length; i++) {
-                $('#yourAddons').append("<div class='addon_existing'><p>" + addon_data[i].title + "</p></div>");
+                $('#yourAddons').append("<div class='addon_existing'><p>" + addon_data[i].title + "</p><a href='steam://url/CommunityFilePage/" + addon_data[i].id + "'>View on Steam</a></div>");
                 donePopulatingAddonList = true;
             }
             // Make sure if nothing is returned to let the user know
@@ -237,6 +235,12 @@ $(document).ready(() => {
         }
     }
 
+    // $('.addon_existing').hover((event) => {
+    //     console.log('hello')
+    //     var target = $(event.target);
+    //     $(this).find('a:last').fadeIn();
+    // })
+
     $('.typeCheckbox').on('click', (event) => {
         var target = $(event.target);
         if (jsonCheckboxCount < 2 && target.is(":checked")) {
@@ -347,18 +351,32 @@ $(document).ready(() => {
 
     $("#createGMAFile").click(() => {
         $('#gmaPrep').fadeOut(() => {
+            win.setBounds({height: 225})
             $('#createGMA').fadeIn();
             ipcRenderer.send('createGMAFile', currentNewAddon);  
         });
     })
-
+    
     $("#uploadCurrentGMA").click(() => {
         ipcRenderer.send('uploadToWorkshop', addonGMADir, addonIcon);
+        $('#uploadToWorkshopPrompt').fadeOut(() => {
+            win.setBounds({height: 225})
+            $('#uploading').fadeIn();
+        })
     })
-
+
+    ipcRenderer.on('currentAddonID', (event, newAddonID) => {
+        $('#uploading').fadeOut(() => {
+            win.setBounds({height: 200})
+            $('#new_addon_link').attr('href', 'steam://url/CommunityFilePage/' + newAddonID)
+            $('#new_addon').fadeIn()
+        })
+    })
+
     ipcRenderer.on('addonGMALocation', (event, addonGMA) => {
         addonGMADir = addonGMA;
         $('#createGMA').fadeOut(() => {
+            win.setBounds({height: 200})
             $("#uploadToWorkshopPrompt").fadeIn();
         })
     })