Start a topic widget

@Gabolino @Blastoise186 I’m no developer so this was not super easy for me but thanks for the challenge, thats how you improve!

There is a way to do this as I understood the question at least:

• HTML Widget on homepage for example with a first steps of start a question (Title and question content)
• Submitting the form takes you to the new topic page with the content input on previous form exists in the new page
• To create the question the user needs to add the missing required fields such as the category (This could be made default or based on the page the widget is inserted in).

All you need is a simple form for the HTML part, to insert wherever you want it in front end:

<div style="padding:25px 20px;border-radius:10px;"> 
 <h2>Ask Your Question</h2>
 <form action="/topic/new?cQW"> 
 <input type="hidden" name="cQW" value="true" />
<br /> 
 <textarea id="cQWTitle" rows="1" cols="50" style="padding-left:10px;resize:none;" placeholder="Title"></textarea><br /> 
 <textarea id="cQWQuestion" rows="4" cols="50" style="padding-left:10px;" placeholder="Question"></textarea>
 <br /><br />
 <button id="cQWButton" onclick="cQWFunction()" class="btn btn--primary">Create Question</button>
</form> 
</div>

And then a not as simple (at least for me) Javascript code to put in the Third Party scripts:

<!-- Custom Question Widget Function -->
<script> 
  <!-- Define Function for onClick -->
  function cQWFunction() {
        console.log("Start!");
    <!-- Define the variable with content of the form -->
    var cQWTitleValue = document.getElementById("cQWTitle").value;
    sessionStorage.setItem("sessionTitle", cQWTitleValue);
    var cQWQuestionValue = document.getElementById("cQWQuestion").value;
    sessionStorage.setItem("sessionQuestion", cQWQuestionValue);
  };


  <!-- Have the New Topic Page use the values -->
  if (inSidedData.page.url.includes("/topic/new?cQW=true")) {
  setTimeout(function(){
    <!-- Title field -->
  	var newTopicTitle = document.getElementById("topic_title");
    var cQWTitleValue = sessionStorage.getItem("sessionTitle");
  	newTopicTitle.setAttribute("value", cQWTitleValue);
    <!-- Question Field inside the text editor iFrame-->
    var editorFrame = document.getElementsByClassName("cke_wysiwyg_frame cke_reset");
    var newTopicQuestion = editorFrame[0].contentWindow.document.getElementsByClassName("post__content--new-editor");
    var cQWQuestionValue = sessionStorage.getItem("sessionQuestion");
    newTopicQuestion[0].setAttribute("class", "post__content--new-editor post__content post__content--openingPost cke_editable cke_editable_themed cke_contents_ltr cke_show_borders");
    newTopicQuestion[0].innerHTML = "";
    var newP = document.createElement("p");
    newP.innerHTML = cQWQuestionValue;
    newTopicQuestion[0].appendChild(newP)
  }, 1000); 
  };
</script> 

Downsides: Based on the way I chose to implement the solution.

• The automatic search that occurs when typing in the new title does not take place (There might be a way to make that happen, I did not check).

Improvements: That can be made with a few tweaks if needed.

• Adding a preselected category as part of the HTML form OR based on where the HTMNL form is inserted. (Sidebar of a given category could set the question to that category by default).
• Adding multiple buttons to pre-select the type Question, Conversation or even Idea OR again based on the page the HTML form is inserted in the code could pre-select the proper type of new topic. 
  (I’ve posted about the use of Javascript to have a New Topic link that defaults to Conversation instead of Question type, which can be used for this: )

Hope this helps!