Code cleanup.

Author: GetToSet

FanOfAscii.xcodeproj/project.pbxproj

@@ -10,7 +10,6 @@
 		<string>02-HowImagesComposed.playgroundpage</string>
 		<string>03-GrayscaleHistogramEqualization.playgroundpage</string>
 		<string>04-Asciification.playgroundpage</string>
-		<string>05-MoreToPlay.playgroundpage</string>
 	</array>
 </dict>
 </plist>

FanOfAscii/Chapters/01-FanOfAscii.playgroundchapter/Manifest.plist

@@ -28,7 +28,7 @@ Here is a **character map** built with font “Fira Code”, by arranging charac
 */
 //#-editable-code
 
-let characterMap = "MWNXK0Okxdolc:;,'...   "
+let characterMapStr = "MWNXK0Okxdolc:;,'...   "
 
 //#-end-editable-code
 /*:
@@ -49,20 +49,20 @@ smooth result.
 //#-editable-code
 
 // The aspect ratio of characters in the font “Fira Code”
-let ratio = 1.70667
+let characterAspectRatio = 0.5860
 
-func calculateCharacterRows(rawImage: RawImage, charactersPerRow: Int) -> Int {
-    let scaledHeight = Double(rawImage.format.height) * Double(charactersPerRow) / Double(rawImage.format.width)
-    return Int((scaledHeight / ratio).rounded())
-}
+var charactersPerRow = 80
+var rowCount: Int!
 
-let charactersPerRow = 80
-let characterRows = 0
+func calculateRowCount(imageFormat: ImageFormat, charactersPerRow: Int) -> Int {
+    let scaledHeight = Double(charactersPerRow) / imageFormat.aspectRatio
+    return Int((scaledHeight * characterAspectRatio).rounded())
+}
 
 func scaleImageForAsciification(rawImage: RawImage) -> RawImage? {
-    characterRows = calculateCharacterRows(rawImage: rawImage, charactersPerRow: charactersPerRow)
+    rowCount = calculateRowCount(imageFormat: rawImage.format, charactersPerRow: charactersPerRow)
     // Scale the image to match the dimension of resulting ASCII art.
-    return rawImage.scaled(width: charactersPerRow, height: characterRows)
+    return rawImage.scaled(width: charactersPerRow, height: rowCount)
 }
 
 //#-end-editable-code
@@ -72,41 +72,40 @@ func scaleImageForAsciification(rawImage: RawImage) -> RawImage? {
 ### 🔨Mapping Pixels with Characters
 
 * Experiment:
-    * In this experiment, we'll build another filter to turn an image into grayscaled version, with consideration.
-    * Try to read and complete the following code snippet. When you finish, run your code and tap the *Switch to
-    Grayscale* button below the image to see whether it works.
+    * Following code snippet generates an ASCII art by mapping pixels to characters according to their brightness level.
+    * Run this code and tap the *ASCIIfy* button to see experience the magic, Feel free to tune all these parameters.
 */
 //#-editable-code
 
 func applyAsciification(rawImage: RawImage) -> UIImage? {
-    let brightnessLevels = Double(characterMap.count)
+    let characterMap: [Character] = Array(characterMapStr)
+    let maxMappedBrightness = Double(characterMap.count - 1)
     var asciificationResult: String = ""
-    for y in 0..<characterRows {
+
+    for y in 0..<rowCount {
         for x in 0..<charactersPerRow {
             if var pixel = rawImage.pixelAt(x: x, y: y) {
-                let mappedBrightnessValue = pixel.brightness / 255.0 * (brightnessLevels - 1)
-                asciificationResult.append(Array(characterMap)[Int(mappedBrightnessValue.rounded())])
+                let mappedBrightnessValue = pixel.brightness / 255.0 * maxMappedBrightness
+                asciificationResult.append(characterMap[Int(mappedBrightnessValue.rounded())])
             }
         }
         asciificationResult += "\n"
     }
-    return RawImage.renderAsciifiedImage(
+
+    return AsciiArtRenderer.renderAsciifiedImage(
             asciificationResult,
-            font: FiraCode.bold.rawValue,
-            size: 14,
-            charactersInRow: charactersPerRow,
-            rows: characterRows,
-            characterRatio: ratio)
+            fontName: FontResourceProvider.FiraCode.bold.rawValue,
+            size: 14.0,
+            foreground: UIColor.black,
+            background: UIColor.white,
+            charactersPerRow: charactersPerRow,
+            rows: rowCount,
+            characterAspectRatio: characterAspectRatio)
 }
 
 //#-end-editable-code
-/*:
-* Note:
-    In this code snippet, we transform the image by multiplying it with a custom filter matrix. If you're not familiar
-    with limier algebra, the following figure will explain how this transform matrix works.
-*/
-////#-hidden-code
-FiraCode.registerFont()
+//#-hidden-code
+FontResourceProvider.FiraCode.register()
 
 let remoteView = remoteViewAsLiveViewProxy()
 let eventListener = EventListener(proxy: remoteView) { message in
@@ -131,4 +130,4 @@ let eventListener = EventListener(proxy: remoteView) { message in
         break
     }
 }
-////#-end-hidden-code
+//#-end-hidden-code

FanOfAscii/Chapters/01-FanOfAscii.playgroundchapter/Pages/04-Asciification.playgroundpage/main.swift

@@ -0,0 +1,48 @@
+//
+// Copyright © 2020 Bunny Wong
+// Created by Bunny Wong on 2020/2/20.
+//
+
+import UIKit
+
+public class AsciiArtRenderer {
+
+    public static func renderAsciifiedImage(_ string: String,
+                                            fontName: String,
+                                            size: CGFloat,
+                                            foreground: UIColor,
+                                            background: UIColor,
+                                            charactersPerRow: Int,
+                                            rows: Int,
+                                            characterAspectRatio: Double) -> UIImage {
+        let characterWidth = size * CGFloat(characterAspectRatio)
+        let characterHeight = size
+        let drawingRect = CGRect(
+                origin: CGPoint(x: 0, y: 0),
+                size: CGSize(width: characterWidth * CGFloat(charactersPerRow), height: characterHeight * CGFloat(rows)))
+
+        let renderer = UIGraphicsImageRenderer(size: drawingRect.size)
+        let img = renderer.image { ctx in
+            background.setFill()
+            ctx.fill(drawingRect)
+
+            let paragraphStyle = NSMutableParagraphStyle()
+            paragraphStyle.alignment = .left
+            paragraphStyle.lineSpacing = 0.0
+            paragraphStyle.maximumLineHeight = size
+            paragraphStyle.lineBreakMode = .byClipping
+            let attrs = [
+                NSAttributedString.Key.font: UIFont(name: fontName, size: size)!,
+                NSAttributedString.Key.foregroundColor: foreground,
+                NSAttributedString.Key.paragraphStyle: paragraphStyle
+            ]
+            string.draw(
+                    with: drawingRect,
+                    options: .usesLineFragmentOrigin,
+                    attributes: attrs,
+                    context: nil)
+        }
+        return img
+    }
+
+}

FanOfAscii/Chapters/01-FanOfAscii.playgroundchapter/Pages/05-MoreToPlay.playgroundpage/LiveView.swift

@@ -0,0 +1,49 @@
+//
+// Copyright © 2020 Bunny Wong
+// Created by Bunny Wong on 2020/2/20.
+//
+
+import Foundation
+import CoreText
+
+public protocol Font {
+
+    static var resourceName: String { get }
+    static var resourceExtension: String { get }
+
+    static func register()
+
+}
+
+public extension Font {
+
+    static func register() {
+        guard let fontURL = Bundle.main.url(forResource: resourceName, withExtension: resourceExtension) else {
+            return
+        }
+        CTFontManagerRegisterFontsForURL(fontURL as CFURL, CTFontManagerScope.process, nil)
+    }
+
+}
+
+public class FontResourceProvider {
+
+    public enum FiraCode: String, Font {
+
+        case light = "FiraCode-Light"
+        case retina = "FiraCode-Light_Retina"
+        case bold = "FiraCode-Light_Bold"
+        case medium = "FiraCode-Light_Medium"
+        case regular = "FiraCode-Light_Regular"
+
+        public static var resourceName: String {
+            return "FiraCode-VF"
+        }
+        public static var resourceExtension: String {
+            return "ttf"
+        }
+
+    }
+
+}
+

FanOfAscii/Chapters/01-FanOfAscii.playgroundchapter/Pages/05-MoreToPlay.playgroundpage/Manifest.plist

@@ -11,7 +11,6 @@ public enum LiveViewIdentifier: String {
     case howImagesComposed
     case grayscaleHistogramEqualization
     case asciification
-    case moreToPlay
 }
 
 public func instantiateLiveView(identifier: LiveViewIdentifier) -> PlaygroundLiveViewable {

FanOfAscii/Chapters/01-FanOfAscii.playgroundchapter/Pages/05-MoreToPlay.playgroundpage/main.swift

@@ -5,7 +5,6 @@
 
 import UIKit
 import Accelerate
-import CoreText
 
 public struct Pixel {
 
@@ -34,6 +33,10 @@ public class ImageFormat {
         return width * height
     }()
 
+    public lazy var aspectRatio: Double = {
+        return Double(width) / Double(height)
+    }()
+
     public init(cgImage: CGImage) {
         self.width = cgImage.width
         self.height = cgImage.height
@@ -102,35 +105,6 @@ public class RawImage {
         return context.makeImage()
     }
 
-    public static func renderAsciifiedImage(_ string: String, font: String, size: CGFloat, charactersInRow: Int, rows: Int, characterRatio: Double) -> UIImage {
-        let characterWidth = size / CGFloat(characterRatio)
-        let characterHeight = size
-        let drawingRect = CGRect(
-                origin: CGPoint(x: 0, y: 0),
-                size: CGSize(width: characterWidth * CGFloat(charactersInRow), height: characterHeight * CGFloat(rows)))
-        let renderer = UIGraphicsImageRenderer(size: drawingRect.size)
-        let img = renderer.image { ctx in
-            UIColor.white.setFill()
-            ctx.fill(drawingRect)
-
-            let paragraphStyle = NSMutableParagraphStyle()
-            paragraphStyle.alignment = .left
-            paragraphStyle.lineSpacing = 0.0
-            paragraphStyle.maximumLineHeight = size
-            paragraphStyle.lineBreakMode = .byClipping
-            let attrs = [
-                NSAttributedString.Key.font: UIFont(name: font, size: size)!,
-                NSAttributedString.Key.paragraphStyle: paragraphStyle
-            ]
-            string.draw(
-                    with: drawingRect,
-                    options: .usesLineFragmentOrigin,
-                    attributes: attrs,
-                    context: nil)
-        }
-        return img
-    }
-
     public func pixelAt(x: Int, y: Int) -> Pixel? {
         if x < 0 || x > format.width || y < 0 || y > format.height {
             return nil

FanOfAscii/Modules/BookAPI.playgroundmodule/Sources/Core/AsciiArtRenderer.swift

@@ -5,6 +5,6 @@
 
 import Foundation
 
-class IntroductionLiveViewController {
+class IntroductionLiveViewController: BaseViewController {
 
 }

FanOfAscii/Modules/BookAPI.playgroundmodule/Sources/Core/FireCode.swift

@@ -9,10 +9,10 @@
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
     <scenes>
-        <!--View Controller-->
+        <!--Base View Controller-->
         <scene sceneID="Jtu-W4-dxd">
             <objects>
-                <viewController storyboardIdentifier="introduction" id="CJm-3e-I7M" sceneMemberID="viewController">
+                <viewController storyboardIdentifier="introduction" id="CJm-3e-I7M" customClass="BaseViewController" customModule="BookCore" sceneMemberID="viewController">
                     <view key="view" contentMode="scaleToFill" id="GcL-rA-cmv">
                         <rect key="frame" x="0.0" y="0.0" width="810" height="1080"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
@@ -292,33 +292,6 @@
             </objects>
             <point key="canvasLocation" x="196" y="787"/>
         </scene>
-        <!--View Controller-->
-        <scene sceneID="Qnk-Qq-r88">
-            <objects>
-                <viewController storyboardIdentifier="moreToPlay" id="aAC-EE-NIM" sceneMemberID="viewController">
-                    <view key="view" contentMode="scaleToFill" id="GuK-2t-njf">
-                        <rect key="frame" x="0.0" y="0.0" width="810" height="1080"/>
-                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-                        <subviews>
-                            <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="More to play" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Nhd-e9-pZD">
-                                <rect key="frame" x="357.5" y="529.5" width="95" height="21"/>
-                                <fontDescription key="fontDescription" type="system" pointSize="17"/>
-                                <nil key="textColor"/>
-                                <nil key="highlightedColor"/>
-                            </label>
-                        </subviews>
-                        <color key="backgroundColor" systemColor="systemBackgroundColor" cocoaTouchSystemColor="whiteColor"/>
-                        <constraints>
-                            <constraint firstItem="Nhd-e9-pZD" firstAttribute="centerX" secondItem="GuK-2t-njf" secondAttribute="centerX" id="4YR-1c-NPl"/>
-                            <constraint firstItem="Nhd-e9-pZD" firstAttribute="centerY" secondItem="GuK-2t-njf" secondAttribute="centerY" id="Jts-vt-iz8"/>
-                        </constraints>
-                        <viewLayoutGuide key="safeArea" id="gRl-fP-bh6"/>
-                    </view>
-                </viewController>
-                <placeholder placeholderIdentifier="IBFirstResponder" id="mN9-db-Rho" userLabel="First Responder" customClass="UIResponder" sceneMemberID="firstResponder"/>
-            </objects>
-            <point key="canvasLocation" x="587" y="788"/>
-        </scene>
         <!--imagePickerViewController-->
         <scene sceneID="NPE-OX-idZ">
             <objects>