Code Monkey home page Code Monkey logo

jsc64's Introduction

jsc64

jsc64 is a Commodore 64 emulator written in JavaScript by Tim de Koning. It's a port of the FC64, the Commodore 64 emulator written in Actionscript by Darron Schall and Claus Wahlers. More information about the Actionscript version can be found here.

This emulator is meant as a 'proof of concept' and uses the HTML5 Canvas-element to render the Commodore 64 screen layout. This means it will work on all modern browsers, being the lastest version of Firefox, Google Chrome and Safari. Rendering on Internet Explorer should be possible with some minor fixes in the 'Renderer class', but I'm afraid performance will be appalling.

The canvas rendering nor the javascript engine isn't as efficient as the Flashplayer so please be patient ;-) or bring a big computer. Like the fc64-version, joystick controls are mapped to the numpad of your keyboard. The space bar can be used as the fire button. Comments are appreciated, please contact me via Twitter.

How do i use this?

Download the package from github and upload it into a folder on your web server Include jQuery 1.12.4+, the classes (still need a nice auto-loading mechanism...) and the plug-in in your source like

<script type="text/javascript" src="js/jquery/jquery-1.12.4.min.js"></script> <script type="text/javascript" src="js/jquery.jsc64classes.js"></script> <script type="text/javascript" src="js/jquery.jsc64.js"></script>

Fix the configuration set up in jquery.jsc64classes.js. Make sure JSC64_BASEPATH is set to folder on your web server containing the plug-in files. Use Jquery to target something as your c64 container, like

<script type="text/javascript">

$(document).ready(function() {
  var jsc64 = $('#container').jsc64();
});

</script>

Once booted, load a .prg file in your c64 with some javascript, like:

<script type="text/javascript">
  $('#container').loadPrg(pathToPrgFile)
</script>

This can also be done automatically after booting by adding some event listeners to the jsc64 instance. This option will be documented shortly. Optionally scale your c64 using CSS. Just set a height and width to canvas elements in the c64 container, like

  #container canvas{ width: 806px; height: 568px; }

Jquery plug-in documentation

For ease of use, the C64 emulator can be loaded and used as a Jquery plug-in. The following options are available

$(selector).jsc64([event listener])

This will make a jsc64 of the selected block-level elements. If an event listener is passed as a parameter, this object will be used to listen to keystrokes. this may come in handy when working with more than one instance, and for example different inputs should control different jsc64 instances.

$(selector).loadPrg(pathToPrgFile);

this method can be called upon an instantiated jsc64 instance and will load the assigned rom into the jsc64 instance. Please keep the browsers cross-domain policy in mind.

Source

This program is free software, released under the terms of the GNU General Public License as published by the Free Software Foundation version 2

jsc64's People

Contributors

gregors avatar herbg3 avatar manthrax avatar reggino avatar

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.