Add very basic minimal hopscotch API

This commit is contained in:
Tim Perry
2015-12-02 18:25:59 +01:00
parent 715df76441
commit c27b57a846
2 changed files with 100 additions and 0 deletions

View File

@@ -0,0 +1,55 @@
/// <reference path="hopscotch.d.ts" />
var tourDefinition = {
id: 'intro-tour',
steps: [
{
target: '.popupTarget',
placement: 'bottom',
title: 'A tour step',
content: 'A tour message'
},
{
target: [".aSelector"],
placement: 'bottom',
yOffset: 10,
width: 400,
xOffset: -420,
arrowOffset: 380
},
{
target: '.domainPatterns form',
placement: 'right',
title: 'A question?',
content: "Hello!",
onShow: function () { }
},
{
target: '.home-button',
placement: 'left',
title: "Let's get started",
content: "Content",
multipage: true,
nextOnTargetClick: true,
showNextButton: false
},
{
target: '.buttons',
placement: 'top',
title: 'Another title',
content: "A message",
showNextButton: false,
nextOnTargetClick: true,
onShow: function () { }
}
],
skipIfNoElement: false,
onClose: function () { },
onEnd: function () { }
};
hopscotch.startTour(tourDefinition);

45
hopscotch/hopscotch.d.ts vendored Normal file
View File

@@ -0,0 +1,45 @@
// Type definitions for Hopscotch v0.2.5
// Project: http://linkedin.github.io/hopscotch/
// Definitions by: Tim Perry <https://github.com/pimterry>
// Definitions: https://github.com/borisyankov/DefinitelyTyped
interface TourDefinition {
id: string;
steps: StepDefinition[];
skipIfNoElement: boolean;
onEnd: () => void;
onClose: () => void;
}
interface StepDefinition {
placement: string;
target: string | HTMLElement | Array<string | HTMLElement>
title?: string;
content?: string;
xOffset?: number;
yOffset?: number;
arrowOffset?: number;
height?: number;
width?: number;
multipage?: boolean;
showNextButton?: boolean;
nextOnTargetClick?: boolean;
onShow?: () => void;
}
interface HopscotchStatic {
startTour(tour: TourDefinition, stepNum?: number): void;
}
declare var hopscotch: HopscotchStatic;
declare module "hopscotch" {
export = hopscotch;
}