Fuse Interactive Activities

Word Cloud

Words या phrases submit करें और real-time में animated word cloud बनते देखें।

Activity type: word_cloud

Configuration

Property	Type	विवरण	Default
`maxWordsPerUser`	number	प्रत्येक participant द्वारा submit किए जा सकने वाले words/phrases की maximum संख्या।	`3`
`prompt`	string	Submissions guide करने के लिए optional prompt (जैसे, "Describe your ideal vacation in one word")।	`""`

Behavior

Participants words या short phrases type करके submit करते हैं।
प्रत्येक submission word cloud में दिखाई देती है।
Multiple participants द्वारा submit किए गए words cloud में बड़े दिखाई देते हैं।
नए words add होने पर cloud animate और rearrange होता है।
प्रत्येक participant maxWordsPerUser words तक submit कर सकता है।
यह multi-action activity है।

Aggregated State

Field	Type	विवरण
`words`	array	`text` और `count` (कितनी बार submit हुआ) के साथ words।
`totalSubmissions`	number	Word submissions की कुल संख्या।

CSS Selectors

.fuse-word-cloud, .fuse-cloud, .fuse-word, .fuse-input, .fuse-submit-btn, .fuse-hint, .fuse-status

Word Clouds icebreakers, brainstorming, और group से quick impressions gather करने के लिए विशेष रूप से effective हैं। Cloud की visual nature इसे presentations के लिए engaging बनाती है।

Hot Takes

Bold statement से agree या disagree करें। Live tug-of-war visual split दिखाता है।

Activity type: hot_takes

Configuration

Property	Type	विवरण	Default
`statement`	string	जिस statement से agree या disagree करना है।	`""`
`agreeColor`	string	"Agree" side के लिए color।	`"#27ae60"` (green)
`disagreeColor`	string	"Disagree" side के लिए color।	`"#e74c3c"` (red)
`agreeLabel`	string	Agree button के लिए custom label (जैसे, "Love it")।	`""` (default "Agree")
`disagreeLabel`	string	Disagree button के लिए custom label (जैसे, "Hate it")।	`""` (default "Disagree")

Behavior

Bold statement prominently display होता है।
दो buttons दिखाए जाते हैं: Agree और Disagree।
Participants अपना vote cast करने के लिए एक button click करते हैं।
Tug-of-war bar visualization agree और disagree के बीच live percentage split दिखाता है।
यह single-action activity है।

Aggregated State

Field	Type	विवरण
`statement`	string	Statement text।
`agreeCount`	number	Agree votes की संख्या।
`disagreeCount`	number	Disagree votes की संख्या।
`agreePercentage`	number	Agree votes का percentage (0-100)।
`disagreePercentage`	number	Disagree votes का percentage (0-100)।
`totalVotes`	number	Cast किए गए कुल votes।

CSS Selectors

.fuse-hot-takes, .fuse-statement, .fuse-tug-bar, .fuse-percentage--agree, .fuse-percentage--disagree, .fuse-vote-btn--agree, .fuse-vote-btn--disagree, .fuse-total-count

Q&A Board

Questions submit और upvote करें। AMAs, events, और classrooms के लिए perfect।

Activity type: qa_board

Configuration

Property	Type	विवरण	Default
`maxReplyDepth`	number	Questions पर replies/threads की maximum depth।	`2`

Behavior

Participants text के रूप में questions submit करते हैं।
सभी participants किसी भी question को upvote या downvote कर सकते हैं।
Questions net score (most upvoted first) के अनुसार sort होते हैं।
इससे सबसे popular questions top पर आते हैं।
यह multi-action activity है।

Aggregated State

Field	Type	विवरण
`questions`	ListItem[]	सभी submitted questions, score के अनुसार sorted।

CSS Selectors

.fuse-qa-board, .fuse-list-item, .fuse-item-text, .fuse-item-author, .fuse-score, .fuse-upvote, .fuse-downvote, .fuse-input, .fuse-submit-btn, .fuse-hint

Q&A Boards live events, webinars, और all-hands meetings के लिए ideal हैं। Upvoting mechanism सुनिश्चित करता है कि सबसे important questions top पर आएं, जिससे presenter के लिए prioritize करना आसान हो।

Predictions

Predictions बनाएं और crowd consensus देखें। बाद में optionally results reveal करें।

Activity type: predictions

Configuration

Property	Type	विवरण	Default
`question`	string	Prediction question (जैसे, "Who will win the championship?")।	`""`
`predefinedOptions`	array	`id` और `label` के साथ optional predefined options। Provide होने पर, participants इनमें से चुनते हैं।	`[]`
`allowCustom`	boolean	Participants predefined options के अलावा या बजाय custom predictions दर्ज कर सकते हैं या नहीं।	`true`

Behavior

Prediction question display होता है।
यदि predefined options provided हैं, participants उनमें से select करते हैं।
यदि allowCustom true है, participants अपनी prediction type कर सकते हैं।
Submit करने के बाद, participants aggregated results देखते हैं।
Predictions value के अनुसार group होती हैं, सबसे popular पहले दिखाई देती है।
यह single-action activity है।

Aggregated State

Field	Type	विवरण
`predictions`	array	`value`, `count`, और `percentage` के साथ unique predictions।
`totalPredictions`	number	Submit की गई predictions की कुल संख्या।

CSS Selectors

.fuse-predictions, .fuse-option, .fuse-option-label, .fuse-option-percentage, .fuse-input, .fuse-submit-btn, .fuse-hint, .fuse-consensus

Tier List

Items को S, A, B, C, D, F tiers में drag करें और community average rankings देखें।

Activity type: tier_list

Configuration

Property	Type	विवरण	Default
`items`	array	Tiers में rank किए जाने वाले items।	`[]`
`tiers`	string[]	Tier labels (best से worst तक)।	`["S", "A", "B", "C", "D", "F"]`

Item Object

Field	Type	विवरण
`id`	string	Unique identifier।
`label`	string	Item के लिए display text।
`imageUrl`	string	Item के लिए optional image URL।
`mediaUrl`	string	Optional media URL।
`mediaType`	string	Media type: `image`, `video`, `icon`, या `qrcode`।
`iconName`	string	React-icons icon name (जब mediaType `icon` हो)।
`iconColor`	string	Icon color (जब mediaType `icon` हो)।
`qrCodeUrl`	string	QR code URL (जब mediaType `qrcode` हो)।

Behavior

Items "unranked" pool में display होते हैं।
Participants items को अपने चुने हुए tier में drag करते हैं।
सभी items place होने पर, ranking submit होती है।
Submission के बाद, participants प्रत्येक item के लिए community average tier देखते हैं।
यह single-action activity है।

Aggregated State

Field	Type	विवरण
`items`	array	`id`, `label`, `imageUrl`, `avgTier` (community average), और `tierCounts` (कितनों ने किस tier में रखा) के साथ items।
`tiers`	string[]	Tier labels।
`totalParticipants`	number	Tier rankings submit करने वाले कुल participants।

CSS Selectors

.fuse-tier-list, .fuse-tier-row, .fuse-tier-label, .fuse-tier-item, .fuse-tier-badge, .fuse-consensus

Tier Lists rich media items support करती हैं। आप rank किए जा रहे items के लिए images, icons, या QR codes भी उपयोग कर सकते हैं, जिससे product comparisons, character rankings, या किसी भी categorization exercise के लिए ये visually engaging बनती हैं।

Caption This

Image के लिए funny captions submit करें और best ones को upvote करें। Comedy gold।

Activity type: caption_this

Configuration

Property	Type	विवरण	Default
`mediaUrl`	string	Caption करने के लिए media का URL।	`""`
`mediaType`	string	Media का type: `image`, `video`, `icon`, या `qrcode`।	`"image"`
`imageUrl`	string	Backward compatibility के लिए legacy field (इसके बजाय `mediaUrl` उपयोग करें)।	None
`iconName`	string	React-icons icon name (जब mediaType `icon` हो)।	`""`
`iconColor`	string	Icon color।	`""`
`qrCodeUrl`	string	QR code URL (जब mediaType `qrcode` हो)।	`""`

Behavior

Image (या अन्य media) prominently display होता है।
Participants captions type करके submit करते हैं।
सभी participants captions को upvote या downvote कर सकते हैं।
Captions net score के अनुसार sort होते हैं, best ones surface होते हैं।
यह multi-action activity है।

Aggregated State

Standard ListAggregatedState उपयोग करता है:

Field	Type	विवरण
`items`	ListItem[]	Score के अनुसार sorted submitted captions।
`totalItems`	number	Submit की गई captions की कुल संख्या।

CSS Selectors

.fuse-caption-this, .fuse-list-item, .fuse-item-text, .fuse-item-author, .fuse-score, .fuse-upvote, .fuse-downvote, .fuse-input, .fuse-submit-btn

Bracket

Tournament-style bracket जहां crowd प्रत्येक matchup पर vote करता है और champion crown होता है।

Activity type: bracket

Configuration

Property	Type	विवरण	Default
`participants`	array	Bracket participants का array। प्रत्येक में `id` और `label` है।	`[]`

Behavior

Participants tournament bracket format में matchups में pair होते हैं।
प्रत्येक matchup के लिए, सभी participants अपने preferred option के लिए vote करते हैं।
Round की voting complete होने पर, winners अगले round में advance करते हैं।
Bracket multiple rounds के through progress करता है जब तक champion crown नहीं होता।
यह multi-round activity है: participants प्रत्येक round में voting जारी रखते हैं।
Bracket participant count के आधार पर rounds की संख्या स्वचालित रूप से determine करता है।

Aggregated State

Field	Type	विवरण
`matchups`	BracketMatchup[]	सभी rounds के सभी matchups।
`currentRound`	number	Current active round।
`totalRounds`	number	Tournament में कुल rounds।

Matchup Object

Field	Type	विवरण
`id`	string	Unique matchup identifier।
`optionA`	object	`id`, `label`, और `votes` के साथ first option।
`optionB`	object	`id`, `label`, और `votes` के साथ second option।
`round`	number	यह matchup किस round का है।
`winner`	string	Winning option का ID (round complete होने के बाद set)।

CSS Selectors

.fuse-bracket, .fuse-matchup, .fuse-matchup-entry, .fuse-matchup-label, .fuse-matchup-votes, .fuse-round-label, .fuse-champion

Proper tournament bracket के लिए, participants की संख्या ideally 2 की power होनी चाहिए (4, 8, 16, 32)। यदि संख्या 2 की power नहीं है, तो कुछ participants को first round में "bye" मिल सकता है।

Map Pins

Map पर अपना location pin करें और real-time में देखें बाकी सब कहां से हैं।

Activity type: map_pins

Configuration

Property	Type	विवरण	Default
`mapCenter`	object	Map का initial center `lat` और `lng` के साथ।	`{ lat: 40, lng: -95 }` (center of US)
`mapZoom`	number	Map का initial zoom level।	`3`
`prompt`	string	Optional prompt (जैसे, "Pin where you're from!" या "Pin your favorite vacation spot")।	`""`

Behavior

Interactive map display होता है।
Participants map पर click करके अपने desired location पर pin place करते हैं।
सभी pins सभी participants के लिए real-time में दिखाई देते हैं।
Hover पर प्रत्येक pin participant का display name दिखाता है।
यह single-action activity है।

Aggregated State

Field	Type	विवरण
`pins`	array	`participantId`, `displayName`, `lat`, और `lng` के साथ सभी pins।
`totalPins`	number	Place किए गए pins की कुल संख्या।

CSS Selectors

.fuse-map-pins, .fuse-hint, .fuse-status

Map Pins distributed teams, conference audiences, या किसी भी scenario के लिए excellent हैं जहां आप अपने group का geographic distribution visualize करना चाहते हैं। Initial center और zoom किसी भी region पर focus करने के लिए adjust किया जा सकता है।

Activity Indicator Styles

सभी interactive activities activity indicators support करती हैं -- floating notifications जो participants interact करने पर दिखाई देती हैं। आप Fuse settings में style configure कर सकते हैं:

Style	विवरण
`pill`	Side से slide in होने वाली pill-shaped notification।
`float_up`	ऊपर float करके fade out होने वाली notification।
`spark`	Interaction point पर spark/flash effect।
`none`	Activity indicators पूरी तरह disable करें।

Activity indicators को .fuse-activity-indicator CSS selector और --fc-indicator-bg, --fc-indicator-text, और --fc-font-indicator CSS variables के माध्यम से style किया जा सकता है।