CSGOFloat -> CSFloat

README.md

@@ -1,11 +1,11 @@
 <p align="center">
-  <a href="https://csgofloat.com/">
-    <img width="600" src="https://csgofloat.com/assets/full_logo.png"/>
+  <a href="https://csfloat.com/">
+    <img width="600" src="https://csfloat.com/assets/full_logo.png"/>
   </a>
 </p>
 
 [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/Step7750/CSGOFloat/LICENSE)
-[![Website](https://img.shields.io/website-up-down-green-red/https/csgofloat.com.svg)](https://csgofloat.com)
+[![Website](https://img.shields.io/website-up-down-green-red/https/csfloat.com.svg)](https://csfloat.com)
 [![Chrome Web Store](https://img.shields.io/chrome-web-store/d/jjicbefpemnphinccgikpdaagjebbnhg.svg)](https://chrome.google.com/webstore/detail/csgofloat-market-checker/jjicbefpemnphinccgikpdaagjebbnhg)
 [![Chrome Web Store](https://img.shields.io/chrome-web-store/stars/jjicbefpemnphinccgikpdaagjebbnhg.svg)](https://chrome.google.com/webstore/detail/csgofloat-market-checker/jjicbefpemnphinccgikpdaagjebbnhg)
 [![Chrome Web Store](https://img.shields.io/chrome-web-store/rating-count/jjicbefpemnphinccgikpdaagjebbnhg.svg)](https://chrome.google.com/webstore/detail/csgofloat-market-checker/jjicbefpemnphinccgikpdaagjebbnhg)

manifest.json

@@ -1,7 +1,7 @@
 {
     "manifest_version": 3,
-    "name": "CSGOFloat Market Checker",
-    "short_name": "CSGOFloat",
+    "name": "CSFloat Market Checker",
+    "short_name": "CSFloat",
     "version": "3.1.0",
     "description": "Dedicated API for fetching the float value, paint seed, and screenshots of CS:GO items on the Steam Market or Inventories",
     "icons": {

src/README.md

@@ -33,7 +33,7 @@ Typically, only being able to access the DOM (ie. HTML env) of the page is not e
 changes to the page for your extension.
 
 Historically, many extensions would use on-demand script injection into the page in order to retrieve a variable,
-call a function, or mutate page-JS state. This is what our extension [used to do](https://github.com/csgofloat/extension/blob/ca85d56e3b268330537daf6bc6be7837213cc7a4/lib/bridge.js)
+call a function, or mutate page-JS state. This is what our extension [used to do](https://github.com/csfloat/extension/blob/ca85d56e3b268330537daf6bc6be7837213cc7a4/lib/bridge.js)
 and what others like CSGO-Trader [currently do](https://github.com/gergelyszabo94/csgo-trader-extension/blob/216df0e4eb6c481c893426d2324b93da026e92d3/extension/src/utils/injection.js#L4) (as of 2022/10/01).
 
 Pros
@@ -50,13 +50,13 @@ Cons
 Since Steam's Content Security Policy restrictions are applied to the content script's AJAX requests, typically event messaging to the background
 script is done. The background script is not restricted and will perform the request for us and send back the result.
 
-This is the mechanism you'd need to use whenever you fetch an HTTPS resource (like `https://api.csgofloat.com`).
+This is the mechanism you'd need to use whenever you fetch an HTTPS resource (like `https://api.csfloat.com`).
 
 A naiive example would be:
 
 `content_script.js`
 ```javascript
-chrome.runtime.sendMessage({type1: 'https://api.csgofloat.com/?url=steam://....'}, (response) => {
+chrome.runtime.sendMessage({type1: 'https://api.csfloat.com/?url=steam://....'}, (response) => {
     // do something
 });
 ```
@@ -81,11 +81,11 @@ Cons
 * Type-checking is _hard_, easy to lose context of what you expect a request to return
 
 
-### How CSGOFloat's Extension Works
+### How CSFloat's Extension Works
 
 #### Accessing the Page's JS runtime
 
-Almost the entirety of CSGOFloat's Extension runs within the page context and **not** the content script.
+Almost the entirety of CSFloat's Extension runs within the page context and **not** the content script.
 
 This allows us to easily access page globals, call Steam's functions, override their functions. Additionally, this gives a clear
 consistent environment to think about as a developer.
@@ -99,7 +99,7 @@ script. This effectively tells Chrome to re-run the script, but in the page inst
 Now that our scripts run within the page, we still want to be able to make AJAX requests to other domains outside of
 Steam's Content Security Policy.
 
-CSGOFloat's Extension similarly uses the mechanism of making the actual request in a background script, but
+CSFloat's Extension similarly uses the mechanism of making the actual request in a background script, but
 creates an abstraction layer on top.
 
 Dubbed the "bridge", it allows for **type safe** request and response handling between the page and background script.
@@ -117,7 +117,7 @@ You can find more details in `/bridge`.
 When try to mutate a page, you also want the ability to create new UI components, potentially _reusing_ the styling
 on the page. For example, you'd create a component that shows the float for a given item.
 
-CSGOFloat's Extension uses Web Components via the library [Lit](https://lit.dev/). Each UI mutation is a separate
+CSFloat's Extension uses Web Components via the library [Lit](https://lit.dev/). Each UI mutation is a separate
 component that has its own state management and rendering logic.
 
 You can find our components in `/components`.

src/background_ff.html

@@ -5,7 +5,7 @@
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>CSGOFloat Background</title>
+  <title>CSFloat Background</title>
   <script type="module" src="./background.js"></script>
 </head>
 <body>

src/global.css

@@ -1,8 +1,8 @@
-.csgofloat-stickers-container {
+.csfloat-stickers-container {
     float: right;
 }
 
-.csgofloat-easy-inspect {
+.csfloat-easy-inspect {
     position: absolute;
     height: 74px;
     width: 74px;
@@ -15,18 +15,18 @@
     font-size: 20px;
 }
 
-.market_recent_listing_row:hover .csgofloat-easy-inspect {
+.market_recent_listing_row:hover .csfloat-easy-inspect {
     display: initial;
 }
 
 /* Powers animation for shining float boxes */
-.csgofloat-shine {
+.csfloat-shine {
     overflow: hidden;
 }
 
 /* Based on https://jsfiddle.net/AntonTrollback/nqQc7/ */
-.csgofloat-shine:after {
-    animation: csgofloat-shine-frames 4s ease-in-out infinite;
+.csfloat-shine:after {
+    animation: csfloat-shine-frames 4s ease-in-out infinite;
     content: '';
     position: absolute;
     top: -110%;
@@ -46,7 +46,7 @@
     );
 }
 
-@keyframes csgofloat-shine-frames {
+@keyframes csfloat-shine-frames {
     50% {
         opacity: 1;
         top: -30%;

src/lib/bridge/client.ts

@@ -25,7 +25,7 @@ export async function ClientSend<Req, Resp>(handler: RequestHandler<Req, Resp>,
         return new Promise((resolve, reject) => {
             // @ts-ignore Bad types
             runtimeNamespace().runtime.sendMessage(
-                window.CSGOFLOAT_EXTENSION_ID || chrome.runtime.id,
+                window.CSFLOAT_EXTENSION_ID || chrome.runtime.id,
                 bundle,
                 // @ts-ignore Bad types
                 (resp: InternalResponseBundle) => {

src/lib/bridge/handlers/execute_script.ts

@@ -17,8 +17,8 @@ export const ExecuteScriptOnPage = new PrivilegedHandler(
             world: 'MAIN',
             args: [chrome.runtime.id, chrome.runtime.getURL('src/model_frame.html')],
             func: function ExtensionId(extensionId, modelFrameUrl) {
-                window.CSGOFLOAT_EXTENSION_ID = extensionId;
-                window.CSGOFLOAT_MODEL_FRAME_URL = modelFrameUrl;
+                window.CSFLOAT_EXTENSION_ID = extensionId;
+                window.CSFLOAT_MODEL_FRAME_URL = modelFrameUrl;
             },
         });
 

src/lib/bridge/types.ts

@@ -7,7 +7,7 @@ export interface RequestHandler<Req, Resp> {
 }
 
 export enum Version {
-    V1 = 'CSGOFLOAT_V1',
+    V1 = 'CSFLOAT_V1',
 }
 
 export interface InternalRequestBundle {

src/lib/components/common/item_holder_metadata.ts

@@ -35,7 +35,7 @@ export abstract class ItemHolderMetadata extends FloatElement {
                 -webkit-text-fill-color: transparent;
             }
 
-            .csgofloat-shine-fade-text {
+            .csfloat-shine-fade-text {
                 font-weight: 1000;
                 -webkit-text-stroke: 1px black;
             }
@@ -83,7 +83,7 @@ export abstract class ItemHolderMetadata extends FloatElement {
                 <span class="seed"
                     >${formatSeed(this.itemInfo)}
                     ${fadePercentage !== undefined
-                        ? html`<span class="fade ${rank && rank <= 5 ? 'csgofloat-shine-fade-text' : ''}"
+                        ? html`<span class="fade ${rank && rank <= 5 ? 'csfloat-shine-fade-text' : ''}"
                               >(${floor(fadePercentage, 1)}%)</span
                           >`
                         : nothing}</span
@@ -141,6 +141,6 @@ export abstract class ItemHolderMetadata extends FloatElement {
         // Make the inventory box coloured ;)
         $J(this).parent().css('color', 'black');
         $J(this).parent().find('img').css('background-color', getRankColour(rank));
-        $J(this).parent().addClass('csgofloat-shine');
+        $J(this).parent().addClass('csfloat-shine');
     }
 }

src/lib/components/custom.ts

@@ -55,7 +55,7 @@ export class FloatElement extends LitElement {
     ];
 
     static tag(): string {
-        return `csgofloat-${camelToDashCase(this.name)}`;
+        return `csfloat-${camelToDashCase(this.name)}`;
     }
 
     static elem(): any {

src/lib/components/filter/filter_container.ts

@@ -36,11 +36,11 @@ export class FilterContainer extends FloatElement {
         return html`
             ${this.filters.map((filter) => {
                 return html`<div>
-                    <csgofloat-filter-view .filter="${filter}"></csgofloat-filter-view>
+                    <csfloat-filter-view .filter="${filter}"></csfloat-filter-view>
                     <hr />
                 </div>`;
             })}
-            <csgofloat-filter-creator @newFilter="${this.onNewFilter}"></csgofloat-filter-creator>
+            <csfloat-filter-creator @newFilter="${this.onNewFilter}"></csfloat-filter-creator>
         `;
     }
 

src/lib/components/filter/filter_creator.ts

@@ -90,14 +90,14 @@ export class FilterCreator extends FloatElement {
             >
                 ${this.error ? 'X' : '✓'}
             </div>
-            <csgofloat-steam-button
+            <csfloat-steam-button
                 ?hidden="${this.error || !this.expression}"
                 class="add-btn"
                 .text="${'Add Filter'}"
                 @click="${this.onAddFilter}"
-            ></csgofloat-steam-button>
+            ></csfloat-steam-button>
             <div class="compile-error">${(this.expression && this.error) || nothing}</div>
-            <csgofloat-filter-help ?hidden="${!this.showHelp}"></csgofloat-filter-help>
+            <csfloat-filter-help ?hidden="${!this.showHelp}"></csfloat-filter-help>
         `;
     }
 

src/lib/components/filter/filter_help.ts

@@ -11,7 +11,7 @@ export class FilterHelp extends FloatElement {
 
             <b>Note: </b> If multiple filters match an item, it will be highlighted with the average colour<br><br>
 
-            <b>New: </b> You can now filter based on <a href="https://db.csgofloat.com">FloatDB</a> ranks and item price!<br><br>
+            <b>New: </b> You can now filter based on <a href="https://db.csfloat.com">FloatDB</a> ranks and item price!<br><br>
 
             <b>Examples: </b>
             <ul>

src/lib/components/filter/filter_view.ts

@@ -46,18 +46,18 @@ export class FilterView extends FloatElement {
                     value="${this.filter.getColour()}"
                 />
                 <div class="expression">${this.filter.getExpression()}</div>
-                <csgofloat-steam-button
+                <csfloat-steam-button
                     .text="${'Global'}"
                     .type="${this.filter.getIsGlobal() ? 'green_white' : 'grey_white'}"
                     @click="${this.onToggleGlobal}"
                     class="global-btn"
-                ></csgofloat-steam-button>
-                <csgofloat-steam-button
+                ></csfloat-steam-button>
+                <csfloat-steam-button
                     .text="${'Remove'}"
                     .type="${'grey_white'}"
                     @click="${this.onRemove}"
                     class="remove-btn"
-                ></csgofloat-steam-button>
+                ></csfloat-steam-button>
             </div>
         `;
     }

src/lib/components/inventory/selected_item_info.ts

@@ -97,7 +97,7 @@ export class SelectedItemInfo extends FloatElement {
                 <div>Float: ${this.itemInfo.floatvalue.toFixed(14)} ${renderClickableRank(this.itemInfo)}</div>
                 <div>Paint Seed: ${formatSeed(this.itemInfo)}</div>
                 ${fadePercentage !== undefined ? html`<div>Fade: ${floor(fadePercentage, 5)}%</div>` : nothing}
-                ${this.renderListOnCSGOFloat()} ${this.renderFloatMarketListing()}
+                ${this.renderListOnCSFloat()} ${this.renderFloatMarketListing()}
             </div>
         `;
     }
@@ -109,8 +109,8 @@ export class SelectedItemInfo extends FloatElement {
 
         return html`
             <div class="market-btn-container">
-                <a class="market-btn" href="https://csgofloat.com/item/${this.stallListing.id}" target="_blank">
-                    <img src="https://csgofloat.com/assets/full_logo.png" height="21" style="margin-right: 5px;" />
+                <a class="market-btn" href="https://csfloat.com/item/${this.stallListing.id}" target="_blank">
+                    <img src="https://csfloat.com/assets/full_logo.png" height="21" style="margin-right: 5px;" />
                     <span>
                         Listed for
                         <b>$${(this.stallListing.price / 100).toFixed(2)}</b>
@@ -120,7 +120,7 @@ export class SelectedItemInfo extends FloatElement {
         `;
     }
 
-    renderListOnCSGOFloat(): TemplateResult<1> {
+    renderListOnCSFloat(): TemplateResult<1> {
         if (this.stallListing) {
             // Don't tell them to list it if it's already listed...
             return html``;
@@ -133,9 +133,9 @@ export class SelectedItemInfo extends FloatElement {
 
         return html`
             <div class="market-btn-container">
-                <a class="market-btn" href="https://csgofloat.com" target="_blank">
+                <a class="market-btn" href="https://csfloat.com" target="_blank">
                     <span>List on </span>
-                    <img src="https://csgofloat.com/assets/full_logo.png" height="21" style="margin-left: 5px;" />
+                    <img src="https://csfloat.com/assets/full_logo.png" height="21" style="margin-left: 5px;" />
                 </a>
             </div>
         `;

src/lib/components/market/helpers.ts

@@ -21,13 +21,13 @@ export function getMarketInspectLink(listingId: string): string | undefined {
  * Inlines stickers into a market item row HTML showing the image and wear
  *
  * @param itemNameBlock Element with `.market_listing_item_name_block`
- * @param itemInfo Item Info for the item from csgofloat API
+ * @param itemInfo Item Info for the item from csfloat API
  * @param asset Steam Asset for the item
  */
 export function inlineStickers(itemNameBlock: JQuery<Element>, itemInfo: ItemInfo, asset: rgAsset) {
     if (!itemNameBlock) return;
 
-    if (itemNameBlock.find('.csgofloat-stickers-container').length) {
+    if (itemNameBlock.find('.csfloat-stickers-container').length) {
         // Don't inline stickers if they're already inlined
         return;
     }
@@ -67,7 +67,7 @@ export function inlineStickers(itemNameBlock: JQuery<Element>, itemInfo: ItemInf
         .reduce((acc, v) => acc + v, '');
 
     itemNameBlock.prepend(`
-        <div class="csgofloat-stickers-container">
+        <div class="csfloat-stickers-container">
             ${result}
         </div>
     `);
@@ -82,6 +82,6 @@ export function inlineEasyInspect(itemImgContainer: JQuery<Element>, inspectLink
     if (!itemImgContainer || !inspectLink) return;
 
     itemImgContainer.append(`
-        <a class="csgofloat-easy-inspect" href="${inspectLink}">🔍</a>
+        <a class="csfloat-easy-inspect" href="${inspectLink}">🔍</a>
     `);
 }

src/lib/components/market/item_row_wrapper.ts

@@ -154,7 +154,7 @@ export class ItemRowWrapper extends FloatElement {
                 </div>
             `;
         } else if (this.error) {
-            return html`<div style="color: orangered">CSGOFloat ${this.error}</div>`;
+            return html`<div style="color: orangered">CSFloat ${this.error}</div>`;
         } else {
             return html`<div>Loading...</div>`;
         }

src/lib/components/market/skin_viewer.ts

@@ -97,22 +97,22 @@ export class SkinViewer extends FloatElement {
 
         return html`
             <div class="btn-container">
-                <csgofloat-steam-button
+                <csfloat-steam-button
                     .text="${this.loadingIfApplicable('3D', Showing.MODEL)}"
                     @click="${this.toggle3D}"
-                ></csgofloat-steam-button>
+                ></csfloat-steam-button>
 
-                <csgofloat-steam-button
+                <csfloat-steam-button
                     .text="${this.loadingIfApplicable('Screenshot', Showing.SCREENSHOT)}"
                     @click="${this.toggleScreenshot}"
-                ></csgofloat-steam-button>
+                ></csfloat-steam-button>
             </div>
             ${this.showing === Showing.MODEL && this.response?.modelLink
                 ? html`
                       <div>
                           <iframe
                               class="iframe-3d"
-                              src="${window.CSGOFLOAT_MODEL_FRAME_URL}?url=${this.response?.modelLink}"
+                              src="${window.CSFLOAT_MODEL_FRAME_URL}?url=${this.response?.modelLink}"
                           ></iframe>
                       </div>
                   `

src/lib/components/market/sort_listings.ts

@@ -58,16 +58,16 @@ export class SortListings extends FloatElement {
 
     protected render(): HTMLTemplateResult {
         return html`
-            <csgofloat-steam-button
+            <csfloat-steam-button
                 .text="${this.computeButtonText(SortType.FLOAT)}"
                 @click="${() => this.onClick(SortType.FLOAT)}"
-            ></csgofloat-steam-button>
+            ></csfloat-steam-button>
 
             ${this.isFadeSkin
-                ? html`<csgofloat-steam-button
+                ? html`<csfloat-steam-button
                       .text="${this.computeButtonText(SortType.FADE)}"
                       @click="${() => this.onClick(SortType.FADE)}"
-                  ></csgofloat-steam-button>`
+                  ></csfloat-steam-button>`
                 : nothing}
         `;
     }