Code Monkey home page Code Monkey logo

playgroundbook's Introduction

CircleCI

playgroundbook

A series of tools for Swift Playground and Playground books based on Apple's documentation.

It's a work in progress (see issues) but you can use it now.

Installation

> [sudo] gem install playgroundbook

Usage

To lint an existing playground book:

> playgroundbook lint MyPlaygroundbook.playgroundbook

To generate a playground book:

> playgroundbook render book.yaml

The yml file should be in the following format:

name: Testing book
identifier: com.ashfurrow.example
resources: assets # Optional
cover: cover.jpeg # Optional
deployment_target: ios10.0 # Optional
imports: # Optional, defaults to UIKit
 - UIKit
 - CoreGraphics
chapters:
  - name: Chapter 1
    edge_to_edge_live_view: false # defaults to true
    live_view_mode: "VisibleByDefault" # defaults to "HiddenByDefault"
  - name: Chapter 2
  - etc...
glossary:
  term: definition

Note that you can't use tabs when indenting in the .yaml file. Everything needs to have spaces in order to work properly. Otherwise you will end up with parse errors.

Each chapter needs to have a corresponding playground; so Chapter 1 requires there be a Chapter 1.playground playground. Your directory should look like this:

Once you've created a playground for each chapter, it's time to add pages to your playgrounds. You can do this in Xcode.

Note that the order of the pages is determined by the ordering of the filesystem, which is lexicographical. You also can't have any periods in your pages.

Then run the render command in the directory containing the yaml file.

playgroundbook render book.yaml

The playgrounds can reference (not copy) resources from an optionally specified directory. import frameworks are specified in the yaml file and are added to every page of the book. You can specify a cover image file name that's stored in the resources directory (it should be 400x300 pixels). Finally, you can supply a glossary, a dictionary of term/definition pairs. This lets you link to terms in markdown. For example:

... [term](glossary://term) ...

Only the link to the term must be URL encoded. For example, the term "reuse identifier" would be defined in the yaml as reuse identifier but linked to as glossary://reuse%20identifier.

Each page in a chapter's .playground will be a separate page in the .playgroundbook and it's Source. The contents of the Source and Resource folders for each chapter and each page are copied.

Limitations of Book Rendering

Playground books support a rich set of awesome features to make learning how to code really easy, and this tool only scratches the surface. Read over the Playground Book reference to see all the available options. If you have suggestions, please open an issue ๐Ÿ‘

Creating a Playground from markdown

Maybe you want to do something for a website, or a git repo first, and then generate your Playground? Well in those cases your source of truth is the markdown document. For that case, we have playgroundbook wrapper.

For example, you might have a folder that looks like:

> tree Beginners/Lesson\ One

Beginners/Lesson\ One
โ”œโ”€โ”€ README.md
โ”œโ”€โ”€ README_ZH.md
โ””โ”€โ”€ img
    โ”œโ”€โ”€ emptyplayground.png
    โ”œโ”€โ”€ multipleresults.png
    โ”œโ”€โ”€ newplayground.png
    โ”œโ”€โ”€ results.png
    โ”œโ”€โ”€ tentimes.png
    โ””โ”€โ”€ welcome.png

You can run:

playgroundbook wrapper "Beginners/Lesson\ One/README.md" "Lesson One"

And it will switch out swift codeblocks into the playground. You have to use triple backticks with swift ```swift. No space between them. You should avoid using backtick blocks for anything other than Swift code, if you need to show examples, use Markdown's indentation rules with four spaces.

> tree Beginners/Lesson\ One

Beginners/Lesson\ One
โ”œโ”€โ”€ Lesson\ One.playground
โ”‚ย ย  โ”œโ”€โ”€ Contents.swift
โ”‚ย ย  โ”œโ”€โ”€ Resources
โ”‚ย ย  โ”‚ย ย  โ””โ”€โ”€ img
โ”‚ย ย  โ”‚ย ย      โ”œโ”€โ”€ emptyplayground.png
โ”‚ย ย  โ”‚ย ย      โ”œโ”€โ”€ newplayground.png
โ”‚ย ย  โ”‚ย ย      โ”œโ”€โ”€ results.png
โ”‚ย ย  โ”‚ย ย      โ””โ”€โ”€ welcome.png
โ”‚ย ย  โ”œโ”€โ”€ contents.xcplayground
โ”‚ย ย  โ””โ”€โ”€ timeline.xctimeline
โ”œโ”€โ”€ README.md
...

You might notice that a subset of images, have moved well, they're the only one being used in the README.md. Slick huh?

Contributing

Hey! Like this tool? Awesome! We could actually really use your help!

Open source isn't just writing code. We could use your help with any of the following:

  • Finding (and reporting!) bugs.
  • New feature suggestions.
  • Answering questions on issues.
  • Reviewing pull requests.
  • Helping to manage issue priorities.
  • Fixing bugs/new features.

If any of that sounds cool to you, send a pull request! After a few contributions, we'll add you as an admin to the repo so you can merge pull requests and help steer the ship ๐Ÿšข You can read more details about that in our contributor guidelines.

Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by [its terms](Code of Conduct.md).

License

MIT, except for the starter.playgroundbook in the unit tests, which is licensed by Apple.

playgroundbook's People

Contributors

ashfurrow avatar boland25 avatar dionlarson avatar orta avatar pietbrauer avatar rgov avatar rhysforyou avatar seanlabastille avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

playgroundbook's Issues

[wrapper] Split into pages on ---

You could have a multi-page book ( warning, the UX for those is bad you have to mention that you need open the sidebar to change page ) which gets separated by markdowns's page break notation ---

screen shot 2016-09-12 at 08 06 11

Support LiveView.swift

In the sample code provided by Apple called TalkingToTheLiveView, for each page there is a LiveView.swift file that contains few lines of code

import PlaygroundSupport
let page = PlaygroundPage.current
page.liveView = FaceViewController()

Those files are located besides Contents.swift inside each .playgroundpage folder.

live

I find them very useful if the reader shouldn't be able to mess with most of the code of the Live View, but instead just interact with it through the PlaygroundSupport Module.

I don't have specific tests but probably the LiveView.swift file won't be recompiled each time the editor is updated, to achieve optimal performances.

No autocomplete in Playgrounds Book

Hi all,
Once I get the file & folder structure for a .playgroundbook, I import necessary classes and put them in the sources folder. Then, on the individual Contents.swift files for each page, I try to reference the class and initialize it, add it to the live view, etc. Not only am I unable to get any autocomplete whatsoever, it does not show any suggestions for regular UIKit and Foundation stuff, like trying to create a new variable for a view, string, etc. Even when writing in the Class file from my other project that I copied over, it compiles/shows autocomplete in the separate playground, and once put in the .playgroundbook Project, nothing.

I'm thinking that it doesn't compile anything in Xcode, and will only actually compile once you load it onto the iPad, however, it doesn't seem practical to write all my code in a separate project so that I can get completition when writing.

I will get a project uploaded shortly.

Complete Playground Page Manifest implementation

Playground pages can be modified with various arguments (Source]:

Argument Type Description Required
Hints Array of dictionaries An array of static hints and optional spoilers. See Hints Key.
LiveViewEdgeToEdge Boolean Sets the live view to extend past the margin in the area used for live views. See LiveViewEdgeToEdge Key. โœ“
LiveViewMode String Sets the live view to show even when it is not running. See LiveViewMode Key. โœ“
Name String The name displayed in the user interface. See Name Key. โœ“
PlaygroundLoggingMode String Controls the display of results in playground pages. See PlaygroundLoggingMode Key.
PosterReference String An image shown before the live view runs. See PosterReference Key.

Currently we support LiveViewEdgeToEdge, LiveViewMode and Name.

The manifest.plist is written in lib/playgroundbook/page_writer.rb and can easily be extended with the missing parameters described above.

This can be a good first step for someone who is looking to contribute.

Make Page manifest customisable through YAML

As discussed in #36 I am proposing a new layout for the chapters sections of the YAML:

Before:

chapters:
  - "Chapter 1"
  - "Chapter 2"

After:_

chapters:
  - name: "Chapter 1"
     EdgeToEdgeLiveView: true
  - name: "Chapter 2"
     EdgeToEdgeLiveView: false

A proposed implementation can be viewed in #42

Failed to open and parse playground chapter.

For some reason I am not able to render the book.yaml file

Output

Rendering book.yaml...
Failed to open and parse playground chapter.
/Library/Ruby/Gems/2.0.0/gems/playgroundbook-1.1.0/lib/renderer/playgroundbook_renderer.rb:68:in `block in render': Missing valid playground for Chapter 1. (RuntimeError)
	from /Library/Ruby/Gems/2.0.0/gems/playgroundbook-1.1.0/lib/renderer/playgroundbook_renderer.rb:46:in `map'
	from /Library/Ruby/Gems/2.0.0/gems/playgroundbook-1.1.0/lib/renderer/playgroundbook_renderer.rb:46:in `render'
	from /Library/Ruby/Gems/2.0.0/gems/playgroundbook-1.1.0/bin/playgroundbook:17:in `<top (required)>'
	from /usr/local/bin/playgroundbook:22:in `load'
	from /usr/local/bin/playgroundbook:22:in `<main>'

Note: I wasn't able to install playgroundbook as described in the readme. When I tried to run

sudo gem install playgroundbook

I got this error

ERROR:  While executing gem ... (Errno::EPERM)
    Operation not permitted - /usr/bin/playgroundbook

So I had to install it like this

sudo gem install -n /usr/local/bin playgroundbook

Output

Successfully installed playgroundbook-1.1.0
Parsing documentation for playgroundbook-1.1.0
1 gem installed

Strip newlines/whitespace from code

Code blocks like this come out with extra whitespace around them:

//// Page whatever

doSomething()

/*:
 Text
*/

Is translated to:

doSomething()

With extra newlines at the bottom.

A PR fixing this issue should strip whitespace from the beginning/end of a page's code.

Add cutscene implementation

Currently there is no implementation for cutscenes, but it seems it should be easy to add it (Reference).

Cutscenes are located between one or more .playgroundpages and can illustrate the things discussed in the following pages.

Their Manifest.plist file is simple:

Key Type Description Required
CutsceneReference String The file path for the main page of a cutscene. See CutsceneReference Key. โœ“
Name String The name displayed in the user interface. See Name Key. โœ“

And the folder structure is as follows:

โ””โ”€โ”€ Intro.cutscenepage
    โ”œโ”€โ”€ Manifest.plist
    โ””โ”€โ”€ Resources
        โ””โ”€โ”€ hello.html

Ignore missing 'Contents.swift' file in cutscene pages

I was just running through Apple's example playgrounds, and their Learn to Code book fails due to its use of cutscene pages. We probably want to add a specific linter for cutscene pages in the future, but for now it'd be best to avoid throwing errors whenever the linter encounters them.

Differentiate between fatal failures and warnings

Things like missing Name values in a manifest shouldn't stop the rest of the book from being linted. Things like a missing /Pages directory are fatal, since the linter cannot continue if it's missing.

Idea: transition the project

From playground-book-lint to just playground-book that has a lint command, and a generate command that creates a playground book from maybe like a yml file and playgrounds in the current directory. Idea via @orta.

Support for Glossary

Glossaries are a really cool feature, and I think this tool needs to support them. They're easy enough to use, just a plist that's a literal dictionary, but they have this "First Use" thing that gets tricky. Here's an amended example from one of Apple's books:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>Terms</key>
    <dict>
        <key>while loop</key>
        <dict>
            <key>Definition</key>
            <string>A block of code that runs for as long as a given condition is true. When the condition changes to false, the loop stops running. 
</string>
            <key>FirstUse</key>
            <dict>
                <key>PageReference</key>
                <string>While%20Loops/Introduction</string>
                <key>Title</key>
                <string>While Loops</string>
            </dict>
        </dict>
    </dict>
</dict>
</plist>

I haven't figured out what the PageReference or Title are for yet. Help would be appreciated.

Rubocop

The code here is a bit messy, Rubocop can clean it up.

Add support for cover image

Took a look at the Learn to Code playground book. Their main manifest includes a ImageReference key that maps to a file name in their Resources directory, and it's used as the cover image for the book in the app. This tool should support that.

Using 3rd party libraries in a Playground Book

I mentioned this last night on Twitter and I'm happy to work on it. I just want a bit of advice on how you think the best way to approach it would be. I was thinking integration with cocoapods.

Thoughts?

Loss of granularity of per-page options

It seems that in the book.yaml file I set options (such as having an edge-to-edge live view) on a chapter. But these options are actually properties of an individual page, not of a chapter. There is a loss of granularity here.

Reconsider default options

edge_to_edge_live_view defaults to false but I always set it to true. live_view_mode defaults to HiddenByDefault but I always end up setting it to VisibleByDefault. I think I'd like to change these to be the new defaults, since they're the common case. @playgroundbooks/contributors any thoughts?

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.