[{"_1":2,"_178":-5,"_179":-5},"loaderData",{"_3":4,"_58":59,"_177":-5},"root",{"_5":6,"_19":-5,"_20":-5,"_21":22,"_39":-5,"_40":-5,"_41":-5,"_42":43,"_54":55,"_56":57},"env",{"_7":8,"_9":10,"_11":12,"_13":14,"_15":16,"_17":18},"SUPABASE_URL","https://hello.websim.com","SUPABASE_KEY","eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im9jamVmZ2NqamlxeWt3YWR2dnJkIiwicm9sZSI6ImFub24iLCJpYXQiOjE3MTE4MzI5OTMsImV4cCI6MjAyNzQwODk5M30.vsreOYwk8pKsr8NFlzpIzWAiD-vXj6ijv_Bhn1vYtHs","POSTHOG_KEY","phc_VHMOlrdxAbgSZHeF0SdSf07LZLRLAg5pZuTHkJGn050","POSTHOG_API_HOST","https://e.wbsm.ai","POSTHOG_UI_HOST","https://app.posthog.com","GOOGLE_OAUTH_CLIENT_ID","891181648870-i708rj1bgjol84hie20shfr4u4ecf3o7.apps.googleusercontent.com","authUser","user","snapshotData",{"_23":-5,"_24":-5,"_25":-5,"_26":-5,"_27":-5,"_28":-5,"_29":-5,"_30":-5,"_31":-5,"_32":-5,"_33":-5,"_34":-5,"_35":-5,"_36":-5,"_37":-5,"_38":-5},"lastProjectId","sidebarTab","homepageTab","pinSidebar","settingsOpen","maximized","assetsExpanded","focusedAssetFilename","authError","authErrorCode","authErrorDescription","sidebarWidth","videoMuted","videoVolume","navigationContext","hasSeenFeedOnboarding","plan","balances","rewards","origins",{"_44":45,"_46":47,"_48":49,"_50":51,"_52":53},"origin","https://websim.com","apiOrigin","https://api.websim.com","contentOrigin","https://{PROJECT_ID}.c.websim.com","appDomainOrigin","https://{SUBDOMAIN}.on.websim.com","generationOrigin","https://generation.websim.com/rivet","isMobile",false,"theme","auto","slug",{"_60":61,"_62":63,"_120":121,"_137":138,"_163":164,"_165":-5,"_166":167},"version","1","project",{"_64":62,"_65":66,"_67":68,"_69":70,"_82":83,"_84":85,"_86":87,"_88":89,"_90":91,"_92":-5,"_93":94,"_95":91,"_96":-5,"_97":55,"_98":99,"_58":109,"_110":111,"_112":55,"_113":-5,"_114":-5,"_115":-5,"_116":117,"_118":-5,"_119":-5},"_type","id","_5qf7u6y_0ft0wgm5sb_","created_at","2024-09-21T00:36:24.290Z","created_by",{"_64":20,"_65":71,"_72":73,"_67":74,"_75":76,"_77":78,"_79":80,"_81":55},"9d81be8a-78f9-43f0-8bfc-f4f08ef8c782","username","p0p","2024-07-15T04:13:13.495Z","avatar_url","https://cdn.discordapp.com/avatars/1051282294293414031/fdadb84183d93743515f52254ccb55c0.png","discord_username","picturesonpictures","discord_id","1051282294293414031","is_admin","updated_at","2024-09-21T00:36:24.292Z","title","WebSim.ai - Interactive Web Simulation Creator","comments_mode","open","visibility","public","current_version",1,"last_posted_version","parent_id","4zvv4gz0k7cw6urvisoo","parent_version","deleted_at","posted","stats",{"_100":101,"_102":66,"_103":104,"_105":106,"_107":108},"~type","project_stats","project_id","views",42,"likes",2,"comments",0,"websim-ai-interactive-web-simulation-creator-3","auto_set_current",true,"enable_chat","description","generated_description","from_template","domains",[],"thumbnail","video","project_revision",{"_64":120,"_65":122,"_60":91,"_67":83,"_123":-5,"_93":-5,"_124":-5,"_125":-5,"_69":126,"_127":128,"_102":66,"_82":83,"_96":-5,"_98":129,"_131":55,"_132":133,"_134":-5,"_135":-5,"_136":-5},"01921202-2864-7a3a-bd37-2ba457340f6e","visited_at","parent_revision_version","parent_revision_project_id",{"_64":20,"_65":71,"_72":73,"_67":74,"_75":76,"_77":78,"_79":80,"_81":55},"meta",{"_60":61},{"_130":108},"multiplayer_count","draft","site_id","ZzCQroogQtJiCbkbr","chat_session_id","chat_session_run_index","current_screenshot_url","site",{"_64":137,"_65":133,"_93":139,"_67":140,"_141":142,"_143":144,"_145":146,"_84":85,"_149":150,"_151":152,"_157":-5,"_158":159,"_160":161,"_96":-5,"_162":-5},"5dPeNM5dCXWslJfGw","2024-07-24T00:23:22.345Z","state","done","model","sonnet","lore",{"_60":91,"_147":148},"attachments",[],"owner",{"_64":20,"_65":71,"_72":73,"_67":74,"_75":76,"_77":78,"_79":80,"_81":55},"prompt",{"_153":154,"_155":156},"type","plaintext","text","HTML:\n

Describe Your Simulation

\n \n \n Upload HTML\n \n

\n \n

Generated Code

Generating simulation...

\n \n \n

\n\n

Code Explanation

Explanation will appear here after code generation.

\nCSS:\n.container {\n display: flex;\n flex-wrap: wrap;\n gap: 2rem;\n}\n\n.panel {\n background: #fff;\n padding: 2rem;\n border-radius: 10px;\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n flex: 1;\n min-width: 300px;\n}\n\n#code-explanation {\n background: #f9f9f9;\n border: 1px solid #e0e0e0;\n border-radius: 5px;\n padding: 1rem;\n min-height: 200px;\n overflow: auto;\n}\nJavaScript:\ndocument.getElementById('generate-btn').addEventListener('click', async () => {\n const input = document.getElementById('simulation-input').value;\n const output = document.getElementById('simulation-output');\n const preview = document.getElementById('live-preview');\n const explanation = document.getElementById('code-explanation');\n\n output.innerHTML = 'Generating simulation...';\n preview.innerHTML = 'Preparing preview...';\n explanation.innerHTML = 'Preparing explanation...';\n\n try {\n const response = await fetch('https://websim.ai/api/generate', {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json',\n },\n body: JSON.stringify({ prompt: input }),\n });\n\n if (!response.ok) {\n throw new Error('Network response was not ok');\n }\n\n const data = await response.json();\n \n output.innerHTML = `\n

HTML:

${escapeHtml(data.html)}

CSS:

${escapeHtml(data.css)}

JavaScript:

${escapeHtml(data.js)}

\n `;\n\n preview.innerHTML = data.html;\n const style = document.createElement('style');\n style.textContent = data.css;\n preview.appendChild(style);\n const script = document.createElement('script');\n script.textContent = data.js;\n preview.appendChild(script);\n\n explanation.innerHTML = data.explanation || 'No explanation provided.';\n } catch (error) {\n console.error('Error:', error);\n output.innerHTML = 'An error occurred while generating the simulation.';\n preview.innerHTML = 'Unable to display preview due to an error.';\n explanation.innerHTML = 'Unable to provide explanation due to an error.';\n }\n});","url","link_url","/p/_5qf7u6y_0ft0wgm5sb_","versioned_link_url","/p/_5qf7u6y_0ft0wgm5sb_/1","yapping","cursor","eyJpZCI6Il81cWY3dTZ5XzBmdDB3Z201c2JfIn0","token","included",[168],{"_64":169,"_102":66,"_170":-5,"_171":55,"_172":55,"_173":55,"_174":111,"_175":111,"_176":111},"project_permissions","user_id","can_edit","can_delete","can_edit_members","can_view","can_list","can_participate","routes/browser/layout","actionData","errors"]