Git Product home page Git Product logo

sapic's Introduction

Website GitHub Workflow Status Discord GitHub

Steam Artwork Profile Image Cropper (SAPIC)

Crops Steam Profile backgrounds into showcases.

We use BrowserStack for testing:

Uses BrowserStack

sapic's People

Contributors

8dion8 avatar altfoxie avatar ari-party avatar theoddball avatar truecarry avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

sapic's Issues

Suggestion, Other showcases?

How about one artwork showcase and possibility to change one of the other artwork showcase into a different showcase?

This would make a profile more unique or in line with a theme, to also show achievements for Level 20-.

Login button

After logging into steam using the login button you are redirected to the depreciated URL next.steam.design

Stops at ffmpeg-core initialization (on Firefox)

Using both Firefox and Firefox private (incognito) mode the converter stops at ffmpeg-core initialization.

logs:

 use ffmpeg.wasm v0.9.5
load ffmpeg-core
loading ffmpeg-core
fetch ffmpeg-core.worker.js script
worker object URL=blob:https://steam.design/9d86ec8c-f261-44f8-9207-e08c1dc2f01f
download ffmpeg-core script (~25 MB) from https://unpkg.com/@ffmpeg/[email protected]/dist/ffmpeg-core.js
initialize ffmpeg-core

This is the error shown in the console
image
I switched to chrome and ffmpeg-core was successfully initialized and loaded.

Screenshot Showcase affecting Artwork Showcase

Issue: While small images are enabled, manually resizing the Screenshot Showcase will increase the size of the Artwork showcase. It does not matter which showcase is on top for this to occur.
image

Steps to reproduce:

  1. Disable long images.
  2. Drag bottom of the image in the Screenshot Showcase.

Noteworthy items:

  1. Resizing the Artwork Showcase resets the bug.
  2. The bug is not simply visual as downloading the zip gives the bugged images.

Possibly add a LICENSE to the repo

Just a while ago there were some issues with https://steam.design and I offered a temporary fix hosted on another url.

Soon after posting on the Discord I was banned without given reason. I can only guess this project is not to be redistributed and I'm sorry for violating this. I was only trying to help others, so I suggest adding a license! This will help other people know if this happens again in the future. I immediately shut down my distribution.

Even just a "don't distribute" in the README would help. Thank you for all your hard work.

Long artwork shows number underneath

If the user has more than 2 artworks uploaded and set to public, even with long artworks there'll be a "+x" icon under the artwork to the right, shifting the showcase that's under it further down.
image

Steps to reproduce:

  1. Have at least one public uploaded artwork
  2. Create a pair of long artworks for a given background at https://steam.design/
  3. Upload both here using this for an invisible title and the code $J('#image_width').val('1000');$J('#image_height').val('1'); for long artwork support
  4. Edit the Steam profile to add the artwork showcase, then select the pair just uploaded
  5. Go back to the Steam profile to view the result

This is not exactly a problem with Steam.Design, but there could be an option there to counter this effect if stacking "transparent" showcases, because if, for example, there's a screenshot showcase under the artwork one, Steam.Design will generate the images as if the showcases were closer together, but if the issue mentioned happens, they'll be slightly further apart.

For now, making all other artworks private seems to be the most reliable option to counter this.

I can't download background

Hello
I can't download the background due to a missing button.
Browser google chrome 78.0.3904.97 version Windows 10
problem

Screenshot showcase is misaligned

If you use the outputted images in a screenshot showcase instead of artwork, they are misaligned. This could require an option in the menu window.
Needs further investigation.

Add option to choose color scheme for profile

Steam has ability to set custom color schemes:
DefaultTheme, SummerTheme, MidnightTheme, SteelTheme, CosmicTheme, DarkModeTheme are already available for all users for free.

However, there are a lot of other colors schemes from 'Game Profiles' Point Shop section which you can't preview with your background.

When you set color scheme it changes class in body. In my opinion we can parse all available color schemes and make an option to choose color scheme
image

Filter broken

The background filter at the top of the page is not working. Its spitting out the following error:

Uncaught TypeError: Cannot read property 'value' of undefined at main.js:formatted:14056

-Vinnie

Customize cropping issues.

Selecting "Shorten Right Image" on artwork showcase works visually but the downloaded image is full size.
image

And this is the result.
image

Binary code background is misaligned after crop

I attached two pics, one with how it's supposed to look vs how it looks
I used the crop for featured artwork version, in a featured artwork showcase

On steam.design it looks aligned properly.
I also tried to switch between Full Screen/Original in Steam's background settings, but it didn't help.

The link to the background is [this]
chrome_ZB6ENfHSBD
steam_bpbzbRTq62

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.