Want to make creations as awesome as this one?

Transcript

Instructions

Template

Tutorial

Examples

Wheel of optionsLive version allows to add the options on the spot

Soad

Reuse

Soad Live

Soad

Soad Live

Soad

Soad Live

  • yellow
  • black

  • 1
  • 20
  • 300
  • 4000
  • 50000
  • 600000

  • 30
  • serif
  • red
  • 30
  • gauche
  • avec
  • 300
  • 1

  • red
  • blue
  • green

  • Abdel
  • Béatrice
  • Catherine
  • Didier
  • Estelle
  • Fred
  • Greg
  • Hervé
  • Isabelle
  • Jacques
  • Kevin

  • 40
  • Jim Nightshade
  • #333333
  • 40
  • gauche
  • avec
  • 820
  • 1

The Jim Nightshade font used on the wheel is has to be used in a previous page.

Hervé

Fred

Didier

Kevin

Estelle

Catherine

Isabelle

Greg

Abdel

Jacques

Béatrice

Exemple with links

  • #FF99CC
  • #FFCC99
  • #CCFFCC
  • #CCFFFF
  • #99CCFF
  • #CC99FF
  • #00CCFF
  • #00FF00
  • #FFFF00
  • #FF9900
  • #99FF00

  • Abdel
  • Béatrice
  • Catherine
  • Didier
  • Estelle
  • Fred
  • Greg
  • Hervé
  • Isabelle
  • Jacques
  • Kevin

  • 40
  • Jim Nightshade
  • #333333
  • 40
  • gauche
  • sans
  • 720
  • 4

The Jim Nightshade font used on the wheel is has to be used in a previous page.

Catherine

Fred

Isabelle

Hervé

Abdel

Estelle

Kevin

Jacques

Béatrice

Didier

Greg

In this example the button is grouped with the wheel.

Page for Abdel

Page forBéatrice

Page forCatherine

Page for Didier

Page for Estelle

Page for Fred

Page for Greg

Page for Hervé

Page for Isabelle

Page for Jacques

Page for Kevin

Your wheel will apprea in this resizable element.

In this group, consisting of a scripted element and a list of bullet points, you can enter the colours to be given to your individual wheel segments. If there are more segments than colours, the colours will be used several times.

This group, consisting of a scripted element and a list bullet point, contains the various parameters needed to create your custom wheel. (More details on the next page)

This group, consisting of a scripted element and and a list bullet point contains the elements that will appear on the wheel (in the same order)

This button element must be grouped with something (image/genially shaped/text area/etc). The group will start the rotation of the wheel when clicked.

This element contains the script necessary for the operation of the extension and must be left on the page. It also serves as a debugger in case of a problem and will be invisible.

Element to be grouped with an object to be displayed at each run (numbers in the item list order)

Font size to be used for the "words" on the wheel

Font name to be used for the "words" on the wheel (remember to use it on a previous page)

Font colour of the "words" on the wheel, size #123456 / red, green... / rgb(0,255,255)

Determine the right/left position of words on the wheel "words": 0-100

gauche = Left/ droite =Right ==> determines "words" alignment. Right is not compatible with Firefox and Internet Explorer

avec=with, sans=without ==> use "sans" to avoid "words" to be chose twice. It will reset after all words have been chosen.

speed of the wheel in degrees per second

How many rounds will the wheel do before a word is chosen.

Check the result on different browsers

  • #FF99CC
  • #FFCC99
  • red

Soad

  • Abdel
  • Béatrice
  • Catherine

  • 40
  • Arial
  • #333333
  • 20
  • gauche
  • sans
  • 720
  • 4

  • black
  • yellow

  • 20
  • serif
  • lime
  • 30
  • gauche
  • avec
  • 200
  • 1

Same list from previous page is being re-used

  • #FF99CC
  • #FFCC99
  • #CCFFCC
  • #CCFFFF
  • #99CCFF
  • #CC99FF
  • #00CCFF
  • #00FF00
  • #FFFF00
  • #FF9900
  • #99FF00

  • 40
  • Jim Nightshade
  • #333333
  • 30
  • gauche
  • sans
  • 720
  • 4

New list

These items are all the same as in the standard Soad.

Text box that lets you enter text straight into the wheel

Needs to be grouped with start button to spin wheel

You need to use ONE of the two on your page: use yellow to keep the same list from page to page, use orange to start with an empty/different text box each time.

Try out the result on different devices

Soad Live

  • #FF99CC
  • #FFCC99
  • red

Soad Live

  • 30
  • Arial
  • #333333
  • 30
  • gauche
  • sans
  • 720
  • 4