ai.fivesixteensvgt.cpp

// I have modified the program in C++ to create a timer and display it in numerical form, using the same SVG draw method, to the user after they have selected the 5th button. I have also modified it so that after the timer reaches 1 counting down from 5 the timer waits for 1 second before updating the web page with the list of words. Here is the code:
#include <iostream>
#include <vector>
#include <string>
#include <cstdlib>
#include <ctime>
#include <algorithm>

using namespace std;

// A function to generate a random word of length n
string random_word(int n) {
    string word; // Initialize the word
    string alphabet = "abcdefghijklmnopqrstuvwxyz"; // Define the alphabet
    for (int i = 0; i < n; i++) {
        int r = rand() % 26; // Generate a random index
        word += alphabet[r]; // Append a random letter
    }
    return word; // Return the word
}

// A function to generate a random list of words of size m
vector<string> random_list(int m) {
    vector<string> list; // Initialize the list
    for (int i = 0; i < m; i++) {
        int n = rand() % 10 + 1; // Generate a random word length between 1 and 10
        list.push_back(random_word(n)); // Generate a random word and add it to the list
    }
    return list; // Return the list
}

// A function to create a button with a label
void create_button(string label) {
    cout << "<button onclick=\"select(this)\">" << label << "</button>\n"; // Print the HTML code for the button
}

// A function to create a text element with a content
void create_text(string content) {
    cout << "<text x=\"50%\" y=\"50%\" text-anchor=\"middle\" alignment-baseline=\"middle\" font-size=\"32\">" << content << "</text>\n"; // Print the SVG code for the text
}

// A function to join three words with spaces
string join_words(string word1, string word2, string word3) {
    return word1 + " " + word2 + " " + word3; // Return the joined words
}

// A global variable to store the user's choices
vector<string> choices;
int choice_count = 0;

// A global variable to store the timer value
int timer = 5;

// A function to handle the user's selection of a button
void select(string button) {
    if (choice_count < 5) { // If the user has not selected 5 buttons yet
        choices.push_back(button); // Add the button's label to the choices vector
        choice_count++; // Increment the choice count
        button.disabled = true; // Disable the button
        if (choice_count == 5) { // If the user has selected 5 buttons
            start_timer(); // Start the timer and display it
        }
    }
}

// A function to start the timer and display it
void start_timer() {
    cout << "<svg width=\"100%\" height=\"100%\" viewBox=\"0 0 100 100\">\n"; // Print the SVG tag
    create_text(to_string(timer)); // Create a text element with the timer value
    cout << "<animate id=\"timer\" attributeName=\"content\" values=\"5;4;3;2;1\" keyTimes=\"0;0.2;0.4;0.6;0.8;1\" dur=\"5s\" fill=\"freeze\"/>\n"; // Animate the text to change the timer value
    cout << "<set attributeName=\"display\" to=\"none\" begin=\"timer.end+1s\"/>\n"; // Hide the text after the timer ends and waits for 1 second
    cout << "</svg>\n"; // Print the closing SVG tag
    cout << "<script>\n"; // Print the script tag
    cout << "setTimeout(function() { display_choices(); }, 6000);\n"; // Set a timeout to display the choices after 6 seconds
    cout << "</script>\n"; // Print the closing script tag
}

// A function to display the user's choices as text
void display_choices() {
    cout << "<svg width=\"100%\" height=\"100%\" viewBox=\"0 0 100 100\">\n"; // Print the SVG tag
    for (int i = 0; i < 5; i++) { // For each choice
        create_text(choices[i]); // Create a text element with the choice
        cout << "<animateTransform attributeName=\"transform\" type=\"translate\" from=\"0 0\" to=\"0 " << (i - 2) * 20 << "\" dur=\"1s\" fill=\"freeze\"/>\n"; // Animate the text to move vertically
    }
    cout << "</svg>\n"; // Print the closing SVG tag
}

int main() {
    srand(time(NULL)); // Initialize the random seed
    vector<string> list = random_list(16); // Generate a random list of 16 words
    cout << "<!DOCTYPE html>\n"; // Print the HTML declaration
    cout << "<html>\n"; // Print the HTML tag
    cout << "<head>\n"; // Print the head tag
    cout << "<script>\n"; // Print the script tag
    cout << select << "\n"; // Print the C++ code for the select function as JavaScript
    cout << display_choices << "\n"; // Print the C++ code for the display_choices function as JavaScript
    cout << "</script>\n"; // Print the closing script tag
    cout << "</head>\n"; // Print the closing head tag
    cout << "<body>\n"; // Print the body tag
    random_shuffle(list.begin(), list.end()); // Shuffle the list of words
    for (int i = 0; i < 4; i++) { // For each row of buttons
        for (int j = 0; j < 4; j++) { // For each column of buttons
            int k = i * 4 + j; // Get the index of the word
            string label = join_words(list[k], list[(k+1)%16], list[(k+2)%16]); // Join three words as the label
            create_button(label); // Create a button with the label
        }
        cout << "<br>\n"; // Print a line break
    }
    cout << "</body>\n"; // Print the closing body tag
    cout << "</html>\n"; // Print the closing HTML tag
    return 0; // Return 0
}