BinBashBanana / webretro

RetroArch in your browser
https://binbashbanana.github.io/webretro/
MIT License
239 stars 342 forks source link

Offline Use #71

Open Talkingtom442 opened 1 year ago

Talkingtom442 commented 1 year ago

Is there a way that I can use this emulator offline? I am currently on an iPad and I added it to my home screen, but if I use it offline, then it breaks.

BinBashBanana commented 1 year ago

Offline support is planned for a future update, either v6.6 or v6.7. The workload has become so large that I am probably (95%) splitting the next planned features into 2 updates.

nenge123 commented 1 year ago

Offline support is planned for a future update, either v6.6 or v6.7. The workload has become so large that I am probably (95%) splitting the next planned features into 2 updates.

in ios very easy to make!

manifest

<html manifest="hello.manifest">
CACHE MANIFEST
# 
1.html
NETWORK:
*   
FALLBACK:

or web worker (best)

if (location.origin != '127.0.0.1') {
    if (isSaveSupported) {
        // Register Service Worker
        if ('serviceWorker' in navigator) {
            navigator.serviceWorker.register('/sw.js').then(function (reg) {
                console.log('Registration succeeded. Scope is ' + reg.scope);
            }).catch(function (error) {
                console.log('Registration failed with ' + error);
            });
            navigator.serviceWorker.addEventListener('message', event => {
                if (event.data.msg) {

                }
            });
        }
    }
}

sw.js


var CACHE_NAME = 'v10';

var urlsToCache = [
    '/index.html',
    '/index.js',
];

self.addEventListener('install', function (event) {
    postMsg({msg:'Updating...'});
    var urlsAddVersion = urlsToCache.map(function (url) {
        return url + '?ver=' + CACHE_NAME
    });
    // Perform install steps
    event.waitUntil(
        caches.open(CACHE_NAME)
            .then(function (cache) {
                console.log('Opened cache');
                return cache.addAll(urlsAddVersion);
            }).then(() => {
                console.log('Cache downloaded')
                self.skipWaiting()
            })
    );
});

self.addEventListener('fetch', function (event) {
    event.respondWith(
        caches.match(event.request, {
            ignoreSearch: true
        }).then(function (response) {
            // Cache hit - return response
            if (response) {
                return response;
            }
            console.log('cache miss', event.request.url)
            return fetch(event.request);
        })
    );
});

self.addEventListener('activate', function (event) {
    console.log('activated, remove unused cache...')
    var cacheAllowlist = [CACHE_NAME];
    event.waitUntil(
        caches.keys().then(function (cacheNames) {
            return Promise.all(
                cacheNames.map(function (cacheName) {
                    if (cacheAllowlist.indexOf(cacheName) === -1) {
                        console.log(cacheName)
                        return caches.delete(cacheName);
                    }
                })
            );
        })
    );
    postMsg({msg:'Updated!'})
});

function postMsg(obj) {
    clients.matchAll({ includeUncontrolled: true, type: 'window' }).then((arr) => {
        for (client of arr) {
            client.postMessage(obj);
        }
    })
}