Giter VIP home page Giter VIP logo

bandcampenhancementsuite's People

Contributors

dependabot[bot] avatar emcniece avatar sabjorn 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

Watchers

 avatar  avatar  avatar  avatar  avatar

bandcampenhancementsuite's Issues

Playlists

Problem
BC currently only has one mechanism for storing music for future purchasing--the wishlist. The wishlist cannot be organized into categories. The wishlist page does have a player but you must click on every item in the wishlist to get it to play.

Solution
A playlist (and queue) system for organizing future purchases and providing an easy mechanism to listen sequentially through the playlist.

ACs
* queue is visible on the left side, resembles the visual appearance of the right hand side bandcamp elements (shopping cart, etc)
* a "+" symbol (button) appears:
* on the right side of the "preview" button allows adding to queue
* next to the track or album release page player
* clicking on "+" will:
* add album to queue
* turn on preview indicator flag
* Albums in queue are buttons which when clicked opens player (IFrame)

Future Considerations:

  • BuyMusicClub export

Application Preferences

It would be nice to be able to selective enable/disable features. This could then be extended for each feature to have some fine grained control (for example: configuring step size for jump forward/back audio feature; and/or changing the keybindings for the keyboard controls).

Ideally this would be a framework that is easily extended for each feature (each feature script talks to the background.js and acquires all the information it needs when it loads). Some sort of config struct could be used to unify the front/back end parameters.

Visually, nested menus would be good but to start off maybe just an omni list of controls?

Add Volume Slider

This was actually a request from Dan Godlovitch.

In essence, controlling volume on album pages with a slider would be nice. Even better would be adding the same functionality to the IFrame player.

This is relatively easy to do since the HTML5 audio element has volume control, e.g.:

let audio = document.querySelector("audio");
audio.volume = .3;

repeat button

your addon is superb. maybe it is possible to add repeat button for an album?

Distribute to app store from CI

#38 introduces a CI pipeline example using Github Workflows. It should be possible to create a workflow that publishes this extension to the Chrome store using this: https://github.com/marketplace/actions/chrome-extension-upload-publish

Secrets will have to be managed by the extension owner, and can be added & obfuscated in the repo settings.

If this is an appealing idea, a workflow could be triggered when a release is published, or when master branch is updated.

Add "clear cache" button to top of bandcamp page

now that preview state is cached, users should be able to easily clear the cache (for the page) by clicking a button at the top of the page. Ideally, inserted into the actual bandcamp menu.

Clicking on track position slider makes it jump around

Basically, if you click on the track playbar slider (the little nub that you used to have to grab to drag around) it will jump to another position in the playbar.

This isn't the worst thing but it's a bit strange. It might be an interaction between the original bandcamp code and BES.

It also might not make sense to fix this if a new player is going to be built.

Investigate Error Handling of chrome.runtime.connect

the error handling for chrome.runtime.connect throughout the extension may not actually be useful.

example:

try {
this.port = chrome.runtime.connect(null, { name: "bandcamplabelview" });
} catch (e) {
if (e.message.includes("Error in invocation of runtime.connect")) {
this.log.error(e);
return;
} else {
throw e;
}
}

The documentation seems to point to this method as not throwing errors...

Add Sponsorship Link

It may be that users want to support this project but never end up on the Github page. Adding the Sponsorship link to the extension in some way may help.

Potential place:

  • added next to player in some way
  • in extension browser_action page

tooltips for when history saved

Currently there is nothing to explicitly inform users that their preview has been saved. Instead it is an implicit change of the history flag UI element.

A tooltip can inform the users that an album preview state was saved by having it pop up above the history flag UI element.

Always Set First Track to Play on Album Page

Sometimes the first track cued up on an album page is not the first in the order of the album. While there may be artistic reasons for this, it's annoying.

Soltution:
have JS find first play button and click it twice quickly.

Investigate & optimize webpack build

The recent removal of jQuery (#37) resulted in a size reduction of content.js from 2.62MB to 1.96MB. It's a step in the right direction, but 2MB for a JS bundle is still huge.

The only major imports are winston and idb, and it's surprising that these two libraries would include so much code. I suspect that Webpack is polyfilling a lot of code, which may be unnecessary given that the deploy target is an update-enforced ES6-compatible browser.

Webpack should produce a smaller build if the compile target is changed, and if compression and minification for distribution builds are enabled.

Plugin loads on non bandcamp pages

Recently found that the preview button will show up on Twitter and mess things up there.

Should be some way to check if it is a bandcamp page.

Using *.bandcamp.com does not work because some pages are redirected from other domains.

1.1.0 Release

Didn't want to get into Git Projects yet so I'm just making an issue as a way to track what's remaining for this release.

  1. Update Readme with new features (volume, keyboard control, and mouse clicking)
  2. #52
  3. screenshot for volume control and mouse clicking

label_view Error in event handle

This error comes up on album pages:

Error in event handler: TypeError: Cannot read property 'classList' of null
    at LabelView.setHistory

it is likely caused by line 44 of label_view.js which does not check if historybox exists. On non-label pages these history boxes do not exist.

Skip through Track by Clicking Anywhere in Playbar

In the default Bandcamp player, to skip forward the playhead must be targeted with the mouse and dragged.

This feature would add youtube like scrubbing:

  • when user clicks anywhere on the audio timeline of the playing track, the playhead jumps to this location

Track previews of loaded pages

Currently, only clicking preview on an album will set the "previewed marker" to "true".

When album pages are loaded directly, they should also set the "previewed marker" to "true".

The major challenge for this feature is the fact that not all albums on a page will have the same domain and this will make using localStorage difficult. For example, on the moodhut discography, some albums are attached to https://penderstreetsteppers.bandcamp.com instead of https://moodhut.bandcamp.com. Sharing between subdomains is prohibited with browsers.

It looks like moving from localStorage and towards chrome.storage is the way to go.

Move Tracklist to be Directly Below the Player

This will allow the user to view the tracklist much more easily rather than having to scroll down to the bottom of the page (on some releases this is quite far down).

this can be done by moving:

<table class="track_list track_table" id="track_table"></table>

to be right under

<div class="inline_player "></div>

Hitting Data Storage Limit of Chrome Storage Implementation

Problem
The way Chrome Storage is implemented is flawed. It stores all data as one item but the maximum number of bytes of an item is too small:

from the documentation: QUOTA_BYTES_PER_ITEM 8,192

Potential Solutions

  • Check for runttime error and spill over to new item when limit is reached
    • this might require the first item to store a table of other items. like a rudimentary filesystem.
  • Create a application + db backend

User Facing Documentation for Features

The user facing documentation is sparse at best. All features should be documented including screenshots (or, better, interactive demo).

This documentation is needs better visibility of features on the Chrome store.

Batch Download

The current state allows users to download a .txt file which provides cURL commands to download their purchases.

However, it is possible to download the files via JS and server them after they have downloaded.

This would be a far easier and user friendly experience.

Waveforms can be Pre-Loaded

It turns out that the Ids for tracks are available on the player page in a application/ld+json

as show here this can be accessed with:

var jsonld = JSON.parse(document.querySelector('script[type="application/ld+json"]').innerText);

which results in this:

{
    "additionalProperty": [
        {
            "value": 1,
            "name": "featured_track_num",
            "@type": "PropertyValue"
        }
    ],
    "@id": "https://halfpastvibe.bandcamp.com/album/stonks-market",
    "keywords": "Electronic, House, dance, electro, techno, Berlin",
    "description": "Half Past Vibe Records is pleased to share \"Stonks Market.\"\r\n\r\nThis release marks the first release by Düsseldorf based producer and DJ Anodized. Usually a traditional Deutschland techno aficionado, with this release Anodized flexes his capacity for diversity through tracks flavoured with the roots of house.\r\n​\r\nAs an additional bonus feature, included in this release is an edit by label co-founder Dataist.\r\n​\r\nOur mission at Half Past Vibe Records is to develop and distribute bleeding-edge auditory dance solutions, to provide disc jockeys and electronic music professionals with the tools they need to deliver effective, high-quality performances and to engage their dancefloor customers.\r\n​\r\nWe're here to remind you: Just Be Yourself!",
    "datePublished": "19 Sep 2020 14:08:42 GMT",
    "numTracks": 4,
    "dateModified": "19 Sep 2020 14:08:42 GMT",
    "name": "Stonks Market",
    "@type": "MusicAlbum",
    "@context": "https://schema.org",
    "byArtist": {
        "additionalProperty": [
            {
                "value": 857243381,
                "name": "band_id",
                "@type": "PropertyValue"
            }
        ],
        "genre": "https://bandcamp.com/tag/electronic",
        "@id": "https://halfpastvibe.bandcamp.com",
        "description": "Record label leveraging the latest and greatest technological innovations of the twenty-first-century to deliver top-shelf house and techno to the masses.\n▼\t▼\t▼\[email protected]",
        "@type": "MusicGroup",
        "name": "Anodized",
        "sameAs": [
            "http://halfpastvibe.com",
            "https://github.com/halfpastviberecords",
            "https://soundcloud.com/halfpastviberecords"
        ],
        "image": "https://f4.bcbits.com/img/0021678655_10.jpg"
    },
    "comment": [
        {
            "text": [
                "Innovative, hard hitting mix out of techno, house and breakbeat vibes.",
                "Favorite track: strong disagreement about the quality of the beat"
            ],
            "author": {
                "url": "https://bandcamp.com/kzmrkndnsk",
                "name": "kzmrkndnsk",
                "@type": "Person",
                "image": "https://f4.bcbits.com/img/0021797610_10.jpg"
            },
            "@type": "Comment"
        }
    ],
    "image": "https://f4.bcbits.com/img/a4062273676_10.jpg",
    "track": {
        "@type": "ItemList",
        "numberOfItems": 4,
        "itemListElement": [
            {
                "@type": "ListItem",
                "position": 1,
                "item": {
                    "additionalProperty": [
                        {
                            "value": 2209953934,
                            "name": "track_id",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": 386.977,
                            "name": "duration_secs",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": "https://t4.bcbits.com/stream/bbbafadb1cafa4a1a8d4bee291e23371/mp3-128/2209953934?p=0&ts=1613221074&t=b026d5d048a5365ed8dbdcfd2294c663fdc5e852&token=1613221074_af77b23dd27eb66b6929783e2424bc37ab2a9813",
                            "name": "file_mp3-128",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": true,
                            "name": "streaming",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": 1,
                            "name": "tracknum",
                            "@type": "PropertyValue"
                        }
                    ],
                    "@id": "https://halfpastvibe.bandcamp.com/track/strong-disagreement-about-the-quality-of-the-beat",
                    "duration": "P00H06M26S",
                    "name": "strong disagreement about the quality of the beat",
                    "@type": [
                        "MusicRecording"
                    ]
                }
            },
            {
                "@type": "ListItem",
                "position": 2,
                "item": {
                    "additionalProperty": [
                        {
                            "value": 3907461273,
                            "name": "track_id",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": 343.451,
                            "name": "duration_secs",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": "https://t4.bcbits.com/stream/213906695805bd1580d52099d4e4c2f2/mp3-128/3907461273?p=0&ts=1613221074&t=0061592332e4c785ad520bac02a0bb92e29edcec&token=1613221074_9ec236532eec0f9af14863bbe6820ac2f516033e",
                            "name": "file_mp3-128",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": true,
                            "name": "streaming",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": 2,
                            "name": "tracknum",
                            "@type": "PropertyValue"
                        }
                    ],
                    "@id": "https://halfpastvibe.bandcamp.com/track/chomsky-chumps",
                    "duration": "P00H05M43S",
                    "name": "chomsky chumps",
                    "@type": [
                        "MusicRecording"
                    ]
                }
            },
            {
                "@type": "ListItem",
                "position": 3,
                "item": {
                    "additionalProperty": [
                        {
                            "value": 2405165665,
                            "name": "track_id",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": 363.944,
                            "name": "duration_secs",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": "https://t4.bcbits.com/stream/527dbc049decbb265c48d81a5437eb9d/mp3-128/2405165665?p=0&ts=1613221074&t=6b5440d61268283fc7a75f583c712c920a36a686&token=1613221074_a2e88965b1369e0e3618ff8e3c09d5f5274eca76",
                            "name": "file_mp3-128",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": true,
                            "name": "streaming",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": 3,
                            "name": "tracknum",
                            "@type": "PropertyValue"
                        }
                    ],
                    "@id": "https://halfpastvibe.bandcamp.com/track/anxious-stonks",
                    "duration": "P00H06M03S",
                    "name": "anxious stonks",
                    "@type": [
                        "MusicRecording"
                    ]
                }
            },
            {
                "@type": "ListItem",
                "position": 4,
                "item": {
                    "additionalProperty": [
                        {
                            "value": 1063313400,
                            "name": "track_id",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": 394.419,
                            "name": "duration_secs",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": "https://t4.bcbits.com/stream/75ec1922d40ef932e63a8e40ff09164c/mp3-128/1063313400?p=0&ts=1613221074&t=7640c2973549cd7391bc9275528bd40ffdf9e4bf&token=1613221074_c0f7969c6579b82e911dcd77f3a35e363308fac3",
                            "name": "file_mp3-128",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": true,
                            "name": "streaming",
                            "@type": "PropertyValue"
                        },
                        {
                            "value": 4,
                            "name": "tracknum",
                            "@type": "PropertyValue"
                        }
                    ],
                    "@id": "https://halfpastvibe.bandcamp.com/track/strong-disagreement-about-the-quality-of-the-beat-dataists-interdimensional-radio-edit",
                    "duration": "P00H06M34S",
                    "name": "strong disagreement about the quality of the beat (Dataist's Interdimensional Radio Edit)",
                    "@type": [
                        "MusicRecording"
                    ]
                }
            }
        ]
    },
    "albumRelease": [
        {
            "offers": {
                "url": "https://halfpastvibe.bandcamp.com/album/stonks-market#download-buy",
                "price": 4,
                "availability": "OnlineOnly",
                "@type": "Offer",
                "priceCurrency": "EUR",
                "priceSpecification": {
                    "minPrice": 4
                }
            },
            "@id": "https://halfpastvibe.bandcamp.com/album/stonks-market#download",
            "url": "https://halfpastvibe.bandcamp.com/album/stonks-market#download",
            "musicReleaseFormat": "DigitalFormat",
            "description": "Includes high-quality download in MP3, FLAC and more. Paying supporters also get unlimited streaming via the free Bandcamp app.",
            "@type": [
                "Product",
                "MusicRelease"
            ],
            "name": "Stonks Market",
            "image": "https://f4.bcbits.com/img/a4062273676_10.jpg"
        }
    ]
}

using this, the waveform could be generated on page load for all tracks (or, possible some subset) and then the waveform loaded on track play.


additionally, there is a different location where the audio stream can be accessed that uses the Bandcamp domain (this would remove the need for the extra domain privilege in the manifest). This url can be found by inspecting the audio element on a user's page when listening to a track.

Custom Homepage

Add artists and labels to page which is just a giant list of releases you can preview.

Keyboard hijacks searching when on page with player

from Chrome review:

"Great extension for bandcamp and I use it all the time but there is a bug with the keyboard shortcuts - the key events on an album page are hijacked even when the search bar is active, so that searching for more than one word delimited with spaces is impossible on an album page as pressing space just starts / stops the media. The workaround is to do your searching from the homepage or a label page. Will revise to 5* if this is fixed..."

Albums at top of page do not preview

Some labels have albums at the top of their pages which are formatted with larger photos. It is some sort of promo thing.

These albums do not get a preview button.

Import/Export Preview History (and other database stuff?)

IDB does not have any built in functionality to import/export database tables.

This is annoying for a few reasons. Right now, data is locked to a user's machine and so migrating to a different machine means their history is lost. Other database stuff (playlist, configurations, etc) may also be valuable to import/export.

This feature could take a few different approaches:

  1. every "service" that has it's own IDB store becomes responsible for creating an import/export component (likely this can be generalized/abstracted for re-use)
  2. the whole IDB, with all stores is able to be exported/imported.
  3. some combination of the above

Enable keyboard support on preview windows

Doing this will likely mean moving away from the IFrame currently used and creating a background service which loads the desired player page, modifies it, and then serves it to the user.

One Click Purchase

Problem:

adding a record to the cart takes too long.

Solution:

1-click add to cart.

Details:

When adding a purchase to the cart, here is the minimum request required:

curl 'https://halfpastvibe.bandcamp.com/cart/cb' \
  --data-raw 'req=add&item_type=a&item_id=3895330325&unit_price=1.50&quantity=1band_id=857243381&client_id=47553DD1BB1C596CB470D15D816841095A483E4E449BC0AEB354F655DA82EF15&sync_num=6' \
  --compressed

The client_id is likely the cart ID which appears to be available from a script tag on page load.

Potential Issues

It is easy to get the purchase price for releases that have a price but for "pay what you want" there is an issue. Perhaps a default value can be set (say 1 USD) but could be updated in configs by user.

Alternatively, there could be a field next to the "add to cart" button to input a price which would be automatically set to the correct value except for "pay what you want" where the user would be required to enter a number.

Improved Keyboard Shortcuts

, and . jump forward/backward 1s

CMD + Forward Arrow: jumps forward 10s
CMD + Back Arrow: jumps backwards 10s

CMD + Up Arrow: increase volume by 10%
CMD + Down Arrow: decrease volume by 10%

w: toggle waveform display

additionally, the values above should be adjustable with user config


this shows an interesting way of keeping track of multiple keypresses. Effectively registers that a key is pressed in a dictionary or array so that it persists as it's pressed. Then you can check different combinations.

Makes the above VERY easy to implement.

Keep Track of Previews

Problem: It can be hard to keep track of albums listened to. For example, after a computer restart the Bandcamp pages will be reloaded and you end up at the top of the screen.

Solution: Keep track of the albums which have had the preview button pushed. Make this visible and, possibly, store the "last previewed" somewhere for quick access.

Requirements
MVP:

  • store that a preview has been pushed (likely using localstorage api)
  • clear cache button

Nice to have

  • Keep track of latest previews and allow user to easily go to that page.

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.