Sketchpad.app Cloud Instance

  • Vector Rendering mode (SVG?)
  • ToolGroups
"toolMode": "svg",      // SVG-based tools (paths, shapes, precise vectors)
"toolMode": "vector",   // Vector tools but not strictly SVG (could be other formats)
"toolMode": "raster"    // Pixel/bitmap-based tools (like Photoshop)
"toolGroups": {
    brush: [ 'pen', 'pencil' ],
    shape: [ 'rectangle', 'circle', 'triangle' ],
    text: [ 'fancyText' ],
    fill: [ 'paintEditor', 'floodFill' ]
},
"toolConfigs": {
    shapeBrush: {
        name: 'Shape Brush',
        icon: 'sketch-icon-shapeBrush',
        compatibility: ['raster', 'vector'],
        settings: { ... }
    }
}

Done

  • Allow iframe embeds
  • DomainLock customization
  • Support domain wildcard in sketchHosts
  • Support EmbeddedWatermark
  • Support ExportPane
  • Support SettingsPane
  • Support WelcomeMessage

Sketchpad.app projects

  • sketchpad.app - Kitchen sink
  • cloud.sketchpad.app - Generic cloud instance
  • edu.sketchpad.app - Educational instance
  • iheart.sketchpad.app - IHeartMedia instance

SketchAPI.com endpoints

  • assets.sketchapi.com (WAS asset.sketch.io/api)
  • save.sketchapi.com (WAS share.sketchpad.app/save)
  • stun.sketchapi.com (WAS stun.sketch.io)
  • turn.sketchapi.com (WAS turn.sketch.io)

Notes

yarn build sketchpad 
  --dry-run 
  --target ../sketch-api-instances/public/ 
  --domain-lock "iheart.sketchpad.app iheart-dev.sketchpad.app 127.0.0.1:8080 localhost:8080" 
  --mixin-sketch-config '{ 
    "ui": { 
        "ExportPane": { 
            "enabled": true, 
            "components": [ 
                { "type": "DownloadPaneTrigger" }, 
                { "type": "DownloadRegion" }, 
                { "type": "QuickDownload", "formats": [ "JPEG", "PNG", "PDF", "SVG", "SKETCHPAD" ] }, 
                { "type": "PrintPaneTrigger" } 
            ] 
        }, 
        "PrimaryToolbar": { 
            "enabled": true, 
            "mirrorInRTL": true, 
            "position": "left", 
            "primaryCommands": [ 
                "select", 
                "crop", 
                "brush", 
                "shape", 
                "clipart", 
                "text", 
                "fill", 
                "eraser" 
            ], 
            "secondaryCommands": [ 
                "newDocument", 
                "openDocument", 
                "exportDocument", 
                "settings" 
            ] 
        }, 
        "SettingsPane": { 
            "enabled": true, 
            "components": [ 
                { "type": "AutoSaveToggle" }, 
                { "type": "HotkeysPanel" }, 
                { "type": "LanguageSelector" }, 
                { "type": "MeasurementUnitsSelector" }, 
                { "type": "PersistentStorageToggle" }, 
                { "type": "SnapToGuidesToggle" }, 
                { "type": "SurfacePanelTrigger" }, 
                { "type": "ThemePanel" } 
            ] 
        }, 
        "WelcomeMessage": { 
            "enabled": false 
        }, 
        "EmbeddedWatermark": { 
            "enabled": false 
        } 
    } 
}'
    --mixin-sketch-hosts '{         "sketchpad.app": {             alias: [ "*.sketchpad.app", "127.0.0.1:8080", "localhost:8080" ],             assetUrl: "https://asset.sketchpad.com/api/",             baseUrl: "/",             mediaUrl: "/media/",             pluginUrl: "/min/plugins-${pkgName}.min.js",             saveUrl: "https://save.sketchpad.com"         }
    }'

Sketch Hosts (PENDING IMPLEMENTATION)

export const SKETCH_HOSTS = {
	'sketchpad.app': {
		alias: [
			'*.sketchpad.app',
			'127.0.0.1:8080',
			'localhost:8080'
		],

		// API endpoints
		assetUrl: 'https://asset.sketch.io/api/', // FROM assetSearch
		pluginUrl: 'http://localhost:2040/?${pkgName}&returnAs=pluginLoader', // FROM apiPath
		saveUrl: 'https://share.sketchpad.app/save/', // FROM POST

		// Application URLs
		baseUrl: 'http://localhost:2040/projects/sketchpad/', // FROM HOST
		mediaUrl: 'http://localhost:2040/projects/sketchpad/media/' // FROM MEDIA
	}
}

Sketch Config (PENDING IMPLEMENTATION)

export const SKETCH_CONFIG = {
	// Document Configuration
	docSurface: 'white',
	docUnits: 'px', // CONFIGS globals.measurementUnits

	// Asset Configuration
	cropSizes: [
		{ label: 'crop-2x3', width: 2, height: 3, units: 'in', dpi: 300, type: 'paper', note: 'Wallet Size' }
	],

	// System Configuration
	fsAutosave: true, // CONFIGS globals.autosave
	fsProviders: [ 'local', 'google' ],

	// Toolbar Configuration
	FloatingToolbar: {
		commands: [
			'layers',
			'zoom',
			'history',
			'undoOrRedo'
		]
	},

	// Layer Configuration
	LayerConfigPane: {
		BlendModeSelector: { enabled: false },
		PaintIntoLayerToggle: { enabled: false }
	},
	PalettePane: { // FROM palette.tabs = {color: true, linearGradient: true, pattern: true}
		paintTypes: [ 'color', 'linearGradient', 'radiantGradient', 'pattern' ]
	}
}