GithubHelp home page GithubHelp logo

joshlory / scratch-storage Goto Github PK

View Code? Open in Web Editor NEW

This project forked from scratchfoundation/scratch-storage

0.0 2.0 0.0 51 KB

Load and store project and asset files for Scratch 3.0

License: BSD 3-Clause "New" or "Revised" License

JavaScript 100.00%

scratch-storage's Introduction

scratch-storage

Scratch Storage is a library for loading and storing project and asset files for Scratch 3.0

Build Status Coverage Status Greenkeeper badge

Installation

This requires you to have Node.js installed.

In your own Node.js environment/application:

npm install https://github.com/LLK/scratch-storage.git

If you want to edit/play yourself (requires Git):

git clone https://github.com/LLK/scratch-storage.git
cd scratch-storage
npm install

Using scratch-storage

From HTML

<script src="scratch-storage/dist/web/scratch-storage.js"></script>
<script>
    var storage = new Scratch.Storage();
    // continue to "Storage API Quick Start" section below
</script>

From Node.js / Webpack

var storage = require('scratch-storage');
// continue to "Storage API Quick Start" section below

Storage API Quick Start

Once you have an instance of scratch-storage, add some web sources. For each source you'll need to provide a function to generate a URL for a supported type of asset:

/**
 * @param {Asset} asset - calculate a URL for this asset.
 * @returns {string} a URL to download a project asset (PNG, WAV, etc.)
 */
var getAssetUrl = function (asset) {
    var assetUrlParts = [
        'https://assets.example.com/path/to/assets/',
        asset.assetId,
        '.',
        asset.dataFormat,
        '/get/'
    ];
    return assetUrlParts.join('');
};

Then, let the storage module know about your source:

storage.addWebSource(
    [AssetType.ImageVector, AssetType.ImageBitmap, AssetType.Sound],
    getAssetUrl);

If you're using ES6 you may be able to simplify all of the above quite a bit:

storage.addWebSource(
    [AssetType.ImageVector, AssetType.ImageBitmap, AssetType.Sound],
    asset => `https://assets.example.com/path/to/assets/${asset.assetId}.${asset.dataFormat}/get/`);

Once the storage module is aware of the sources you need, you can start loading assets:

storage.load(AssetType.Sound, soundId).then(function (soundAsset) {
    // `soundAsset` is an `Asset` object. File contents are stored in `soundAsset.data`.
});

If you'd like to use scratch-storage with scratch-vm you must "attach" the storage module to the VM:

vm.attachStorage(storage);

Testing

To run all tests:

npm test

To show test coverage:

npm run coverage

Donate

We provide Scratch free of charge, and want to keep it that way! Please consider making a donation to support our continued engineering, design, community, and resource development efforts. Donations of any size are appreciated. Thank you!

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.