SageMathCell is an open-source, scalable, and easy-to-use web interface to Sage, a comprehensive open-source math software system. Additionally, SageMathCell can be used to embed Sage computations into any webpage.
Include the following HTML at the top of the webpage
(optionally replacing sagecell.sagemath.org with the name
of your server). The second line makes it so that any element with a
class of sage will turn into a Sage cell.
<script src="https://sagecell.sagemath.org/static/embedded_sagecell.js"></script>
<script>sagecell.makeSagecell({"inputLocation": ".sage"});</script>
If you are embedding into a webpage with lots of styling (like a blog, or a deck.js presentation), there might be conflicts between the page styling and the styles for the Sage cell. If you notice that the Sage cell is not looking normal, you might also include the following code after the above in order to fix the Sage cell styles.
<link rel="stylesheet" type="text/css" href="https://sagecell.sagemath.org/static/sagecell_embed.css">
<script> tags so that it is not
treated as HTML.
<div class="sage"> <script type="text/x-sage">1+2</script> </div>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>SageMathCell</title>
<script src="https://sagecell.sagemath.org/static/embedded_sagecell.js"></script>
<script>
// Make the div with id 'mycell' a Sage cell
sagecell.makeSagecell({inputLocation: '#mycell',
template: sagecell.templates.minimal,
evalButtonText: 'Activate'});
// Make *any* div with class 'compute' a Sage cell
sagecell.makeSagecell({inputLocation: 'div.compute',
evalButtonText: 'Evaluate'});
</script>
</head>
<body>
<h1>Embedded Sage Cells</h1>
<h2>Factorial</h2>
Click the “Activate” button below to calculate factorials.
<div id="mycell"><script type="text/x-sage">
@interact
def _(a=(1, 10)):
print(factorial(a))
</script>
</div>
<h2>Your own computations</h2>
Type your own Sage computation below and click “Evaluate”.
<div class="compute"><script type="text/x-sage">plot(sin(x), (x, 0, 2*pi))</script></div>
<div class="compute"><script type="text/x-sage">
@interact
def f(n=(0,10)):
print(2^n)
</script></div>
</body>
</html>
In January 2011 at Sage Days 27, William Stein and Jason Grout implemented a proof-of-concept “Single Cell” server designed to be a web interface for a single Sage computation. Ira Hanson soon joined the project and Jason and Ira continued building a prototype. Many helpful design discussions with Robert Bradshaw, Fernando Perez, Min Ragan-Kelly, and Brian Granger at Sage Days 29 pushed the design further. Alex Kramer joined the project in May 2011, and Jason, Ira, and Alex (the “Drake Sage Group”) worked full-time at Drake University (thanks to the UTMOST NSF funding and a Drake internal grant) to design and implement the first version of SageMathCell in the summer of 2011. Ira Hanson worked with Michael Gage, Jason Aubrey, Davide Cervone, and John Travis from WeBWorK at Sage Days 31 to allow Sage cells to be embedded in WeBWorK problems and other external pages. In July 2011, the SageMathCell developers announced the release of an open beta for SageMathCell Version 1 on a public server for testing.
Version 1 of SageMathCell reimplemented much of the IPython 0.12 messaging protocol in a custom layer on top of Sage (since IPython was not yet mature enough to be included in Sage). Jason, Ira, and Alex continued maintaining and improving this codebase throughout the 2011–2012 academic year. The Android and iOS apps, which relied on SageMathCell, were built by Ivan Andrus and Volker Braun. People started incorporating Sage cells into their curricular materials, and momentum was gathering. Alex and Jason attended Sage Days 35.5 to help in these and other efforts.
By the spring of 2012, the IPython codebase had matured enough to be included in Sage and serve as a base for SageMathCell. Steven Johnson joined Jason, Ira, and Alex to work full-time (under NSF funding) during the summer of 2012 to go back to the drawing board and redesign and reimplement SageMathCell to take advantage of insights gained during the first year. Byron Varberg also joined the Drake Sage Group to implement the Sage Interact website. SageMathCell Version 2 went beta in July 2012.
In the summer and fall of 2012, David Smith started transitioning the MAA Calculus book to use Sage interacts for all interactive activities, which was tested at Hood College during the 2012–2013 academic year. Jason, Ira, and Alex continued maintaining and improving SageMathCell codebase during the academic year as well.
In the summer of 2014, Andrey Novoseltsev picked up maintenance and continued further development of SageMathCell.
This material is based upon work supported by the National Science Foundation under Grant No. DUE-1022574. Any opinions, findings and conclusions or recomendations expressed in this material are those of the author(s) and do not necessarily reflect the views of the National Science Foundation (NSF).