V6 Document Data Extractor
In your V6 document export ZIP archive, the entry /public/config.js
contains an embedded data structure that represents your prototype or board. For the purposes of the standalone experience, this data is packaged as a JavaScript file. To extract this data structure into a more consumable format, upload your config.js
below. A new JSON file will be generated and returned.
Prototype Type Definition
// All dates are exported as UTC milliseconds.
interface Config {
authenticatedUserID: number;
prototype: Prototype;
prototypeSettings: PrototypeSettings;
device: Device;
company: Company;
memberships: Membership[];
screens: Screen[];
screenStatuses: ScreenStatus[];
screenSettings: ScreenSettings;
screenPlaceholders: ScreenPlaceholder[];
hotspots: Hotspot[];
hotspotSettings: HotspotSettings;
dividers: Divider[];
conversations: Conversation[];
backgrounds: Background[];
tags: Tag[];
users: User[];
publicDirectory: string;
}
interface Prototype {
id: number;
userID: number;
companyID: number;
name: string;
createdAt: number;
exportedAt: number;
isMobile: boolean;
mobileDeviceID: number;
sortTypeID: number; // PrototypeSettings.sortTypes;
}
interface PrototypeSettings {
sortTypes: {
manual: 1;
alphabetical: 2;
};
}
interface Device {
id: number;
name: string;
isMobile: boolean;
width: number;
height: number;
}
interface Company {
id: number;
name: string;
}
interface Membership {
id: number;
userID: number;
startedAt: number;
lastAccessedAt: number;
role: {
id: number;
name: string;
};
}
interface Screen {
id: number;
userID: number;
name: string;
clientFilename: string;
serverFilename: string;
imageVersion: number;
screenTypeID: number;
screenGroupID: number;
sort: number;
naturalWidth: number;
naturalHeight: number;
displayScale: number;
deviceScale: number;
width: number;
height: number;
fixedHeaderHeight: number;
fixedFooterHeight: number;
alignment:
| "left"
| "right"
| "center"
;
zoomScrollBehavior: number; // ScreenSettings.zoomScrollBehaviors;
backgroundColor: string;
backgroundImageID: number;
backgroundImagePosition:
| "center"
| "50% 0 no-repeat"
| "tile"
| "repeat"
| "tile-horizontally"
| "0 0 repeat-x"
| "fixed"
;
backgroundAutostretch: boolean;
backgroundFrame: boolean;
imageVersion: number;
workflowStatusID: number;
createdAt: number;
updatedAt: number;
}
interface ScreenStatus {
id: number;
name: string;
color: string; // #{6-digit hex}
}
interface ScreenSettings {
zoomScrollBehaviors: {
normal: 1;
disableHorizontalScrolling: 2;
shrinkToViewport: 3;
};
}
interface ScreenPlaceholder {
id: number;
userID: number;
name: string;
items: ScreenPlaceholderItem[];
filename: string;
filenameKey: string;
createdAt: number;
updatedAt: number;
}
type ScreenPlaceholderItem =
| ScreenPlaceholderItemWithLabel
| ScreenPlaceholderItemWithoutLabel
;
interface ScreenPlaceholderItemWithLabel {
type: "field";
data: {
label: string;
value: string;
};
}
interface ScreenPlaceholderItemWithoutLabel {
type:
| "block"
| "button"
| "checkbox"
| "rule"
| "text"
| "title"
;
data: {
value: string;
};
}
interface Hotspot {
id: string; // "{screenID}:{id}";
screenID: number;
targetScreenID: number;
targetTypeID: number; //HotspotSettings.targetType;
eventTypeID: number; //HotspotSettings.eventTypes;
templateID: number;
metadata:
| HotspotMetadataForScreen
| HotspotMetadataForOverlay
| HotspotMetadataForPositionOnScreen
| HotspotMetadataForExternalUrl
| HotspotMetadataForLastScreenVisited
;
x: number;
y: number;
width: number;
height: number;
isScrollTo: boolean;
isBottomAligned: boolean;
}
interface HotspotMetadataForScreen {
redirectAfter?: number;
}
interface HotspotMetadataForOverlay {
stayOnScreen: boolean;
overlay: {
positionID: number; // HotspotSettings.overlayPositions;
transitionID: number; // HotspotSettings.transitionTypes;
bgOpacity: number;
positionOffset: {
x: number;
y: number;
};
reverseTransitionOnClose: boolean;
closeOnOutsideClick: boolean;
isFixedPosition: boolean;
};
}
interface HotspotMetadataForPositionOnScreen {
scrollOffset: number;
isSmoothScroll: boolean;
}
interface HotspotMetadataForExternalUrl {
url: string;
isOpenInNewWindow: boolean;
}
interface HotspotMetadataForLastScreenVisited {
stayOnScreen: boolean;
}
interface HotspotSettings {
targetTypes: {
screen: 1;
lastScreenVisited: 2;
previousScreenInSort: 3;
nextScreenInSort: 4;
externalUrl: 5;
positionOnScreen: 6;
screenOverlay: 7;
};
eventTypes: {
click: 1;
doubleTap: 2;
pressHold: 3;
swipeRight: 4;
swipeLeft: 5;
swipeUp: 6;
swipeDown: 7;
hover: 8;
autoRedirect: 9;
};
transitionTypes: {
none: 1;
pushRight: 2;
pushLeft: 3;
slideUp: 4;
slideDown: 5;
flipRight: 6;
flipLeft: 7;
dissolve: 8;
flow: 9;
pop: 10;
slideRight: 11;
slideLeft: 12;
slideFade: 13;
};
overlayPositions: {
custom: 1;
centered: 2;
topLeft: 5;
topCenter: 3;
topRight: 4;
bottomLeft: 8;
bottomCenter: 6;
bottomRight: 7;
};
overlayTransitionTypes: {
fadeInScale: 1;
slideInRight: 2;
slideInBottom: 3;
fadeIn: 4;
fall: 5;
sideFall: 6;
stickyUp: 7;
flipHorizontal: 8;
flipVertical: 9;
sign: 10;
superScaled: 11;
instant: 12;
rotateInBottom: 13;
rotateInLeft: 14;
rotateInTop: 15;
rotateInRight: 16;
slideInTop: 17;
slideInLeft: 18;
};
}
interface Divider {
id: number;
name: string;
sort: number;
}
interface Conversation {
id: number;
screenID: number;
label: string;
x: number;
y: number;
type:
| "tourpoint"
| "private"
| "note"
| "comment"
;
isComplete: boolean;
createdAt: number;
comments: Comment[];
}
interface Comment {
id: number;
userID: number;
comment: string;
createdAt: number;
}
interface Background {
id: number;
clientFilename: string;
serverFilename: string;
imageVersion: number;
createdAt: number;
width: number;
height: number;
}
interface Tag {
id: number;
name: string;
description: string;
color: string; // 6-digit hex.
userID: number;
}
interface User {
id: number;
name: string;
email: string;
}
Board Type Definition
// All dates are exported as UTC milliseconds.
interface Config {
authenticatedUserID: number;
board: Board;
boardSettings: BoardSettings;
company: Company;
memberships: Membership[];
headerImage: HeaderImage;
items: Item[];
groups: Group[];
comments: Comment[];
users: User[];
}
interface Board {
id: number;
userID: number;
companyID: number;
name: string;
description: string;
layoutTypeID: number;
createdAt: number;
exportedAt: number;
}
interface BoardSettings {
layoutTypes: {
masonry: 1;
meticulous: 2;
grid: 3;
};
itemTypes: {
image: 1;
note: 2;
colorSwatch: 3;
font: 4;
document: 5;
media: 6;
sourceFile: 7;
generic: 8;
}
}
interface Company {
id: number;
name: string;
}
interface Membership {
id: number;
userID: number;
lastAccessedAt:
| number
| ""
;
role: {
id: number;
name: string;
}
}
interface HeaderImage {
clientFilename: string;
serverFilename: string;
imageVersion: number;
imageOffset: number;
imageBlur: number;
imageNoise: number;
imageTint: number;
imageSize: number;
}
interface Item {
id: number;
userID: number;
groupID: number;
itemTypeID: number;
name: string;
description: string;
columns: number;
sort: number;
metadata:
| ItemMetadataForColor
| ItemMetadataForDocument
| ItemMetadataForFont
| ItemMetadataForGeneric
| ItemMetadataForImage
| ItemMetadataForMedia
| ItemMetadataForNote
| ItemMetadataForSourceFile
;
createdAt: number;
updatedAt: number;
}
interface ItemMetadataForColor {
color: string;
}
interface ItemMetadataForDocument {
clientFilename: string;
serverFilename: string;
fileVersion: number;
}
interface ItemMetadataForFont {
fontFace: string;
clientFilename: string;
serverFilename: string;
fileVersion: number;
}
interface ItemMetadataForGeneric {
clientFilename: string;
serverFilename: string;
fileVersion: number;
}
interface ItemMetadataForImage {
displayScale: number;
naturalWidth: number;
naturalHeight: number;
width: number;
height: number;
imageColors?: string[];
clientFilename: string;
serverFilename: string;
fileVersion: number;
}
interface ItemMetadataForMedia {
clientFilename: string;
serverFilename: string;
fileVersion: number;
}
interface ItemMetadataForNote {
noteHtml: string;
}
interface ItemMetadataForSourceFile {
clientFilename: string;
serverFilename: string;
fileVersion: number;
}
interface Group {
id: number;
sort: number;
name: string;
description: string;
}
interface Comment {
id: number;
userID: number;
itemID: number;
comment: string;
hasAnnotation: boolean;
annotationLabel: string;
x: number;
y: number;
createdAt: number;
updatedAt: number;
}
interface User {
id: number;
name: string;
email: string;
}