diff --git a/README.md b/README.md index e2391dd..d18830f 100644 --- a/README.md +++ b/README.md @@ -29,6 +29,8 @@ Common mistakes you should be aware of, * not being logged into Steam will obviously cause uploads to fail +* you **must** have Garry's Mod installed to use this tool, since it utilizes `gmat.exe` and `gmpublish.exe` which can be found in `/GarrysMod/bin/` + Otherwise, [create an issue](https://github.com/Leeous/gmod-addon-tool/issues/new) or send me a tweet/DM. ### Social diff --git a/index.html b/index.html index fa7aa8e..94c3a91 100644 --- a/index.html +++ b/index.html @@ -42,14 +42,14 @@

Steam must be open!

What would you like to do?

- +
- +

Your addons

diff --git a/package.json b/package.json index 8cc9ae9..4f717a7 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,7 @@ "icon": "src/img/icon.png", "productName": "Garry's Mod Addon Tool", "linux": { - "target": "deb", + "target": "Snap", "icon": "src/img/icon.png", "synopsis": "A simple tool to update Garry's Mod workshop addons.", "description": "A simple tool to update Garry's Mod workshop addons.", diff --git a/src/css/style.css b/src/css/style.css index 5eeaad1..20686ec 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -10,7 +10,7 @@ body { } header, main, footer { - padding: 0 5px; + padding: 0 5px; } header input[type="file"] { @@ -279,23 +279,26 @@ header { cursor: pointer; font-size: .9em; padding: 5px 20px; - transform: ease 0.8s all; outline: none; border-radius: 0 5px 5px 0; - margin: 0; display: block; + transition: ease 0.2s all; +} + +.back_button:hover { + background-color: rgb(246, 79, 79); } #addonPreviewDetails { margin: 10px auto; } -#addonPreviewDetails th { +#addonPreviewDetails th, #addonPreviewExisting th { padding: 5px; background-color: #024B7F; } -#addonPreviewDetails td { +#addonPreviewDetails td, #addonPreviewExisting td { padding: 5px 15px; background-color: #0261A5; max-width: 250px; @@ -305,9 +308,49 @@ header { text-overflow: ellipsis; } +#addonPreviewExisting { + /* width: 100%; */ + /* padding: 2; */ + /* margin: 10px; */ + background: rgb(0, 85, 146); + display: grid; + /* margin: 25px auto; */ + justify-content: space-evenly; + grid-auto-flow: column; +} + +div#addonPreviewExisting div { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +#addonPreviewExisting th { + width: 100; +} + +#addonPreviewExisting td { + width: 100; +} + +#addonHeader { + display: flex; + flex-direction: row-reverse; + justify-content: flex-end; +} + +#addonStats { + margin: auto; + text-align: center; +} + #yourAddons { overflow-y: scroll; - height: 65%; + max-height: 81.2%; + display: flex; + flex-direction: column; + height: 100%; } #jsonTags { @@ -319,32 +362,61 @@ header { padding-top: 15px; } -.addon_existing { - font-weight: 500; - background-color: #048CEC; +.publishedAddon { + display: flex; + /* height: 100%; */ + user-select: none; + flex-direction: column; + /* width: 100%; */ + /* background-color: #024b7f; */ +} + +.publishedStats { + display: flex; + flex-direction: row; + justify-content: space-evenly; padding: 10px 0; - transition: ease 0.5s all; + background-color: #024b7f; } -.addon_existing:hover { - background-color: #43A3E8; - padding: 15px 0; +.publishedStats p { + padding: 0 10px 10px 10px; + margin: 10px 0 0 0; + cursor: default; } -.addon_existing .title { +.publishedTitle h1 { margin: 0; - cursor: default; + padding: 10px; + text-shadow: 0px 0px 4px black; } -.addon_link { - display: none; - margin-top: 5px; - margin-bottom: 0; +.publishedControls { + display: flex; + padding: 0; } -.addon_link a { - padding: 3px; +.publishedControls p { + width: 50%; + margin: 0; +} + +.publishedControls p a { + border: none; + background-color: #0261A5; color: white; + display: block; + font-weight: 800; + padding: 10px; + transition: ease 0.2s all; + text-decoration: none; + cursor: pointer; + outline: none; +} + +.publishedControls p a:hover { + background-color: #43a3e8; + letter-spacing: 1.5px; } .removeBackOption { @@ -397,7 +469,6 @@ header { #jsonIgnore p { font-weight: 700; - /* padding-right: 9px; */ } #jsonIgnore input[type="text"] { @@ -411,15 +482,12 @@ header { .jsonSectionHeader { font-weight: 700; width: 55px; - /* margin-top: 0; */ padding-left: 15px; letter-spacing: 1px; - /* white-space: nowrap; */ } .jsonGrid { display: grid; - /* margin-left: 10px; */ grid-template-columns: auto auto auto auto auto; } diff --git a/src/img/favs.png b/src/img/favs.png new file mode 100644 index 0000000..9c663f3 Binary files /dev/null and b/src/img/favs.png differ diff --git a/src/img/subs.png b/src/img/subs.png new file mode 100644 index 0000000..9da1116 Binary files /dev/null and b/src/img/subs.png differ diff --git a/src/img/views.png b/src/img/views.png new file mode 100644 index 0000000..47f32d0 Binary files /dev/null and b/src/img/views.png differ diff --git a/src/js/script.js b/src/js/script.js index 6dff58f..12613f9 100644 --- a/src/js/script.js +++ b/src/js/script.js @@ -241,6 +241,10 @@ $(document).ready(() => { } }); + $(".viewAddon").click((e) => { + console.log($(e.target).data("viewAddon")); + }); + $(".back_button").click((event) => { var target = event.target; var divToGoBack = $(target).data("forwards"); @@ -256,7 +260,6 @@ $(document).ready(() => { var target = event.target; 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") + "]"); @@ -296,10 +299,8 @@ $(document).ready(() => { $("#yourAddons").on("click", ".updateAddon", (event) => { var target = event.target; existingAddonId = $(target).data("id"); - $("#update_existing_addon").fadeOut(() => { - $("#create_new_addon .top div h3").text("Updating addon"); - $("#create_new_addon, #addonDirPrompt").fadeIn(); - }); + $("#create_new_addon .top div h3").text("Updating addon"); + goBack("#update_existing_addon", "#create_new_addon, #addonDirPrompt", [500, 250] ) }); // Tells server to create the GMA @@ -454,7 +455,11 @@ $(document).ready(() => { var addon = response.publishedfiledetails[i]; var addonObject = { "title": addon.title, - "id": addon.publishedfileid + "id": addon.publishedfileid, + "icon": addon.preview_url, + "views": addon.views, + "lifesubs": addon.lifetime_subscriptions, + "favs": addon.favorited } queuePosition++; addon_data.push(addonObject); @@ -488,6 +493,7 @@ $(document).ready(() => { width: resizeInfo[0], height: resizeInfo[1] }); + // if (resizeInfo[2] != null) {win.setResizable(resizeInfo[2])} } $(divToFadeIn).fadeIn(); }) @@ -499,7 +505,32 @@ $(document).ready(() => { // This check is done to make sure this only gets executed once if (!donePopulatingAddonList) { for (let i = 0; i < array.length; i++) { - $("#yourAddons").append("

" + array[i].title + "

"); + console.log(array) + $("#yourAddons").append(` +
+ + + +
+ `); donePopulatingAddonList = true; } @@ -511,21 +542,6 @@ $(document).ready(() => { donePopulatingAddonList = true; errorNote("Steam API: HTTP 429 error. Try again later."); } - - $(".addon_existing").hover((event) => { - var target = $(event.target); - var targetLink = $(target).find(".addon_link"); - $(targetLink).css("opacity", 0).slideDown("fast").animate({ opacity: 1 }, { queue: false, duration: "slow" }); - }, (event) => { - var target = $(event.target); - var targetLink = $(target).find(".addon_link"); - $(targetLink).slideUp("fast").animate({ opacity: 0 }, { queue: false, duration: "slow" }); - }); - - if (0 == addon_data.length) { - $("#yourAddons").append("

No addons found!

Either you don't have Steam open or haven't uploaded anything public.

"); - donePopulatingAddonList = true; - } } }