README.md

@@ -33,4 +33,11 @@ This project is licensed under the MIT License. See the `LICENSE` file for more
 - animate.css - A cross-browser library of CSS animations. [animate.css GitHub](https://github.com/animate-css/animate.css)
 - NeutralinoJS - The lightweight and portable framework used to build this application. [NeutralinoJS GitHub](https://github.com/neutralinojs/neutralinojs)
 - Bootstrap icons - Used for the icons in the application. [Bootstrap icons GitHub](https://github.com/twbs/icons)
-- DALL-E3 by OpenAI - Used for generating all visible images/graphics. [DALL-E3 GitHub](https://github.com/openai/DALL-E)
+- DALL-E3 by OpenAI - Used for generating all visible images/graphics. [DALL-E3 GitHub](https://github.com/openai/DALL-E)
+
+### Dev notes
+
+Init dev env
+1. run `neu update`
+2. run `neu build`
+3. run `neu run`

src/views/home/home.html

@@ -34,6 +34,17 @@
             </div>
             <!-- Add more apps here as needed -->
         </div>
+        <div class="row">
+            <div class="col-lg-4 col-md-6 mb-4">
+                <div class="card app-card shadow-sm animate__animated animate__fadeIn" id="home-btn-sl">
+                    <img src="/icons/lineconv.webp" alt="App 1" class="card-img-top">
+                    <div class="card-body">
+                        <h5 class="card-title">Multiline to single line</h5>
+                        <p class="card-text">Convert multiline text to singleline</p>
+                    </div>
+                </div>
+            </div>
+        </div>
         <div class="row justify-content-center">
             <div class="col-auto">
                 <button type="button" class="btn btn-light mt-5" id="exit-btn">Exit App</button>

src/views/home/home.js

@@ -16,6 +16,10 @@ function init(){
         console.log("About button clicked");
         loadView("about");
     });
+    $("#home-btn-sl").click(function(){
+        console.log("Singleline converter button clicked");
+        loadView("slconv");
+    });
     $("#exit-btn").click(function(){
         console.log("Quit button clicked");
         quit();

src/views/slconv/slconv.html

@@ -0,0 +1,33 @@
+<div class="container-fluid h-100">
+  <div class="row h-100">
+    <div class="col-md-12">
+      <div class="position-relative">
+        <button type="button" class="btn btn-light back-button top-0 start-0 m-3" onclick="loadView('home')">
+          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-left" viewBox="0 0 16 16">
+            <path fill-rule="evenodd" d="M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8"/>
+          </svg>
+          Back
+        </button>
+      </div>
+      <section class="py-5">
+        <div class="container text-center">
+          <h1 class="display-4"><strong>Singleline Converter</strong></h1>
+          <p class="lead mb-3">Enter your text, convert, done</p>
+
+          <h2>Input:</h2>
+          <textarea class="form-control w-100" rows="10" id="input-textarea"></textarea>
+          <button type="button" class="btn btn-success mt-5" id="slconv-btn-convert">
+            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-cpu" viewBox="0 0 16 16">
+              <path d="M5 0a.5.5 0 0 1 .5.5V2h1V.5a.5.5 0 0 1 1 0V2h1V.5a.5.5 0 0 1 1 0V2h1V.5a.5.5 0 0 1 1 0V2A2.5 2.5 0 0 1 14 4.5h1.5a.5.5 0 0 1 0 1H14v1h1.5a.5.5 0 0 1 0 1H14v1h1.5a.5.5 0 0 1 0 1H14v1h1.5a.5.5 0 0 1 0 1H14a2.5 2.5 0 0 1-2.5 2.5v1.5a.5.5 0 0 1-1 0V14h-1v1.5a.5.5 0 0 1-1 0V14h-1v1.5a.5.5 0 0 1-1 0V14h-1v1.5a.5.5 0 0 1-1 0V14A2.5 2.5 0 0 1 2 11.5H.5a.5.5 0 0 1 0-1H2v-1H.5a.5.5 0 0 1 0-1H2v-1H.5a.5.5 0 0 1 0-1H2v-1H.5a.5.5 0 0 1 0-1H2A2.5 2.5 0 0 1 4.5 2V.5A.5.5 0 0 1 5 0m-.5 3A1.5 1.5 0 0 0 3 4.5v7A1.5 1.5 0 0 0 4.5 13h7a1.5 1.5 0 0 0 1.5-1.5v-7A1.5 1.5 0 0 0 11.5 3zM5 6.5A1.5 1.5 0 0 1 6.5 5h3A1.5 1.5 0 0 1 11 6.5v3A1.5 1.5 0 0 1 9.5 11h-3A1.5 1.5 0 0 1 5 9.5zM6.5 6a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5z"/>
+            </svg>
+            Convert my input
+          </button>
+          <div class="visually-hidden" id="output-container-div">
+            <h2 class="mt-5">Output:</h2>
+            <textarea class="form-control w-100" rows="10" id="output-textarea"></textarea>
+          </div>
+        </div>
+      </section>
+    </div>
+  </div>
+</div>

src/views/slconv/slconv.js

@@ -0,0 +1,20 @@
+(function () {
+    $(document).ready(function () {
+        console.log("Initialization of slconv.js finished.");
+        $("#slconv-btn-convert").click(function () {
+            console.log("Convert button clicked");
+            convert();
+        });
+    });
+
+    async function convert() {
+        console.log("Converting...");
+        const inputText = $("#input-textarea").val();
+        console.log(inputText)
+        const outputText = inputText.replace(/\n/g, ' ');
+        console.log(outputText);
+        $("#output-textarea").val(outputText);
+        $("#output-container-div").removeClass("visually-hidden");
+        await Neutralino.clipboard.writeText(outputText);
+    }
+})();