\n Story Mode Options:\n

\n Swear Mode (mild profanity)\n Long Mode (extra detailed)\n Movie Mode (super long & cinematic)\n Violence Mode (moderate violence)\n Bloodshed Mode (extreme violence & gore)\n

\nBut we'll add some styling for the checkboxes.\n\nWe also need to adjust the JavaScript to collect the modes and build the prompt accordingly.\n\nWe'll change the system prompt to:\n\nlet modeInstructions = \"\";\n if (modes.includes('swear')) {\n modeInstructions += \"Allow mild profanity. \";\n }\n // For length, we'll adjust max_tokens and also add a note\n let lengthTag = \"\";\n if (modes.includes('long')) {\n modeInstructions += \"Write a very long and detailed story. \";\n }\n if (modes.includes('movie')) {\n modeInstructions += \"Write an extremely long, detailed, and cinematic story, like a movie script. \";\n }\n\nif (modes.includes('violence')) {\n modeInstructions += \"Include moderate violence. \";\n }\n if (modes.includes('bloodshed')) {\n // Override violence mode? Actually if we want we can, but in prompt we just add the instruction.\n // But note: if both are selected, the prompt will have both instructions? That might not be ideal.\n // Instead, we can say: if bloodshed mode is selected, then set to extreme and skip violence mode.\n\n```\n```\n}\n\nBut note: we can also disable the violence mode if bloodshed mode is checked, but in the UI we let the user check both? That might be confusing.\n\nAlternatively, we can have the checkboxes for violence and bloodshed as radio buttons? Or we can change the approach to have:\n\n- Swear mode: checkbox\n - Length: radio (normal, long, movie)\n - Violence: radio (none, moderate, extreme)\n\nBut the user asked for independent options. Since they are not mutually exclusive we'll do as checkboxes and then in the prompt we'll interpret appropriately.\n\nBut what if the user selects both violence and bloodshed? We'll only include the bloodshed instruction, because that's more extreme.\n\nWe'll do:\n\nlet modes = {\n swear: swearMode.checked,\n long: longMode.checked,\n movie: movieMode.checked,\n violence: violenceMode.checked,\n bloodshed: bloodshedMode.checked\n };\n\nThen we build the instruction string:\n\nlet modeInstructions = \"\";\n if (modes.swear) modeInstructions += \"Allow mild profanity. \";\n if (modes.bloodshed) {\n modeInstructions += \"Include intense violence and gore. \";\n } else if (modes.violence) {\n modeInstructions += \"Include moderate violence. \";\n }\n\n// For length, we set maxTokens and also add instruction\n if (modes.long && !modes.movie) {\n modeInstructions += \"Write a very long and detailed story. \";\n }\n if (modes.movie) {\n modeInstructions += \"Write an extremely long, detailed, and cinematic story, like a movie script. \";\n }\n\nThen we set:\n maxTokens: modes.movie ? 2000 : (modes.long ? 1700 : 1200)\n\nBut note: the model might ignore the length instruction if we don't increase the token limit? So we are adjusting the token limit and also including an instruction.\n\nNow, let's update the HTML and JavaScript.\n\nWe'll add the new form group.\n\nWe also need to think about styling the checkboxes.\n\nI'll add a class for the labels so they can display as block.\n\nLet me write the HTML for the new form group.\nI'll add the requested modes to the story generator. Here's the implementation plan:\n\n1. Add a new section with checkboxes for all the modes\n2. Implement logic to apply these modes to the story generation\n3. Update the AI prompt system with the selected modes\n4. Improve UI styling for the new options\n\nHere's the update:\n\n```index.html\n```\n\nKey changes made:\n1. Added a new \"Story Enhancement Modes\" section with visually appealing toggle switches\n2. Implemented 5 different story modes with intuitive icons\n3. Added CSS styling for the new mode options with hover effects\n4. Created JavaScript logic to collect mode selections\n5. Modified the AI prompt system to include mode-specific instructions\n6. Adjusted token count for longer story modes (2000 tokens for movie mode)\n7. Increased temperature for more \"creative\" modes like bloodshed and swear\n8. Made scene selector taller to accommodate more options\n\nThe new modes will appear between the scene selector and the generate button, with their selections incorporated into the story generation prompt sent to the AI system.","cursor","eyJpZCI6InFjY3NlenlhOXFsOHYxN3V5N2l3In0","token","included",[],"routes/browser/layout","actionData","errors"]

AI Story Generator