From 9dcdc51145293a4a6adb50074c7e3d24626b9f7a Mon Sep 17 00:00:00 2001
From: Faneva <faneva.rakotoarivony@polymtl.ca>
Date: Sat, 12 Feb 2022 11:38:29 -0500
Subject: [PATCH] Import bootsrap

---
 .env                               |  3 +-
 assets/app.js                      | 34 ++-----------------
 assets/calendar.js                 | 54 ++++++++++++++++++++++++++++++
 package.json                       |  1 +
 templates/calendar/index.html.twig | 20 ++++-------
 webpack.config.js                  |  1 +
 yarn.lock                          |  5 +++
 7 files changed, 72 insertions(+), 46 deletions(-)
 create mode 100644 assets/calendar.js

diff --git a/.env b/.env
index bc79793b..f2dc173e 100644
--- a/.env
+++ b/.env
@@ -28,5 +28,6 @@ APP_SECRET=5dcb73a4ed29995c5229b7d9cca8b2c6
 #
 # DATABASE_URL="sqlite:///%kernel.project_dir%/var/data.db"
 # DATABASE_URL="mysql://db_user:db_password@127.0.0.1:3306/db_name?serverVersion=5.7"
-DATABASE_URL="postgresql://symfony:ChangeMe@database:5432/app?serverVersion=13&charset=utf8"
+DATABASE_URL="sqlite:///%kernel.project_dir%/var/app.db"
+DATABASE_URL="postgresql://symfony:ChangeMe@127.0.0.1:5432/app?serverVersion=13&charset=utf8"
 ###< doctrine/doctrine-bundle ###
diff --git a/assets/app.js b/assets/app.js
index ad65a839..08362c34 100644
--- a/assets/app.js
+++ b/assets/app.js
@@ -12,37 +12,7 @@ import './styles/app.css';
 import './bootstrap';
 
 import 'tui-calendar';
+import 'bootstrap';
 
 var Calendar = require('tui-calendar'); /* CommonJS */
-require("tui-calendar/dist/tui-calendar.css");
-
-// If you use the default popups, use this.
-require("tui-date-picker/dist/tui-date-picker.css");
-require("tui-time-picker/dist/tui-time-picker.css");
-
-var calendar = new Calendar('#calendar', {
-    defaultView: 'week',
-    taskView: true,
-  });
-
-calendar.createSchedules([
-    {
-        id: '1',
-        calendarId: '1',
-        title: 'my schedule',
-        category: 'time',
-        dueDateClass: '',
-        start: '2022-02-10T22:30:00+09:00',
-        end: '2022-02-11T02:30:00+09:00'
-    },
-    {
-        id: '2',
-        calendarId: '1',
-        title: 'second schedule',
-        category: 'time',
-        dueDateClass: '',
-        start: '2022-02-11T17:30:00+09:00',
-        end: '2022-02-12T17:31:00+09:00',
-        isReadOnly: true    // schedule is read-only
-    }
-]);
\ No newline at end of file
+require("tui-calendar/dist/tui-calendar.css");
\ No newline at end of file
diff --git a/assets/calendar.js b/assets/calendar.js
new file mode 100644
index 00000000..c1d43fcc
--- /dev/null
+++ b/assets/calendar.js
@@ -0,0 +1,54 @@
+/*
+* Welcome to your app's main JavaScript file!
+*
+* We recommend including the built version of this JavaScript file
+* (and its CSS file) in your base layout (base.html.twig).
+*/
+
+// any CSS you import will output into a single css file (app.css in this case)
+import './styles/app.css';
+
+// start the Stimulus application
+import './bootstrap';
+
+import 'tui-calendar';
+
+var Calendar = require('tui-calendar'); /* CommonJS */
+require("tui-calendar/dist/tui-calendar.css");
+
+// If you use the default popups, use this.
+require("tui-date-picker/dist/tui-date-picker.css");
+require("tui-time-picker/dist/tui-time-picker.css");
+
+var calendar = new Calendar('#calendar', {
+  defaultView: 'week',
+  taskView: true,
+});
+
+prevBtn.addEventListener("click", e => {
+  calendar.prev();
+});
+nextBtn.addEventListener("click", e => {
+  calendar.next();
+});
+calendar.createSchedules([
+    {
+        id: '1',
+        calendarId: '1',
+        title: 'my schedule',
+        category: 'time',
+        dueDateClass: '',
+        start: '2022-02-10T22:30:00+09:00',
+        end: '2022-02-11T02:30:00+09:00'
+    },
+    {
+        id: '2',
+        calendarId: '1',
+        title: 'second schedule',
+        category: 'time',
+        dueDateClass: '',
+        start: '2022-02-11T17:30:00+09:00',
+        end: '2022-02-12T17:31:00+09:00',
+        isReadOnly: true    // schedule is read-only
+    }
+]);
diff --git a/package.json b/package.json
index a496a90b..7575d1b4 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
         "build": "encore production --progress"
     },
     "dependencies": {
+        "bootstrap": "^5.1.3",
         "tui-calendar": "^1.15.2"
     }
 }
diff --git a/templates/calendar/index.html.twig b/templates/calendar/index.html.twig
index a365b110..de3a6ab5 100644
--- a/templates/calendar/index.html.twig
+++ b/templates/calendar/index.html.twig
@@ -2,6 +2,10 @@
 
 {% block title %}Hello CalendarController!{% endblock %}
 
+{% block javascripts %}
+{{ parent() }}
+{{ encore_entry_script_tags('calendar') }}
+{% endblock %}
 {% block body %}
 <style>
     .example-wrapper { margin: 1em auto; max-width: 800px; width: 95%; font: 18px/1.5 sans-serif; }
@@ -15,23 +19,13 @@
     <ul>
         <li>Your controller at <code><a href="{{ '/home/fanevark/step/calendrier/src/Controller/CalendarController.php'|file_link(0) }}">src/Controller/CalendarController.php</a></code></li>
         <li>Your template at <code><a href="{{ '/home/fanevark/step/calendrier/templates/calendar/index.html.twig'|file_link(0) }}">templates/calendar/index.html.twig</a></code></li>
-    </ul>
+    </ul>   
 </div>
 
 <body>
     <div id="calendar" style"height: 800px;"></div>
-      <div id="menu">
-      <span id="menu-navi">
-        <button type="button" class="btn btn-default btn-sm move-today" data-action="move-today">Today</button>
-        <button type="button" class="btn btn-default btn-sm move-day" data-action="move-prev">
-          <i class="calendar-icon ic-arrow-line-left" data-action="move-prev">Prev</i>
-        </button>
-        <button type="button" class="btn btn-default btn-sm move-day" data-action="move-next">
-          <i class="calendar-icon ic-arrow-line-right" data-action="move-next">Nxt</i>
-        </button>
-      </span>
-      <span id="renderRange" class="render-range"></span>
-    </div>
+    <button id="prevBtn">Prev</button>
+    <button id="nextBtn">Next</button>
 </body>
 
 
diff --git a/webpack.config.js b/webpack.config.js
index 056b04aa..cd849687 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -21,6 +21,7 @@ Encore
      * and one CSS file (e.g. app.css) if your JavaScript imports CSS.
      */
     .addEntry('app', './assets/app.js')
+    .addEntry('calendar', './assets/calendar.js')
 
     // enables the Symfony UX Stimulus bridge (used in assets/bootstrap.js)
     .enableStimulusBridge('./assets/controllers.json')
diff --git a/yarn.lock b/yarn.lock
index b6f9d354..f999f8df 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1607,6 +1607,11 @@ boolbase@^1.0.0:
   resolved "https://registry.yarnpkg.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
   integrity sha1-aN/1++YMUes3cl6p4+0xDcwed24=
 
+bootstrap@^5.1.3:
+  version "5.1.3"
+  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-5.1.3.tgz#ba081b0c130f810fa70900acbc1c6d3c28fa8f34"
+  integrity sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==
+
 brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
-- 
GitLab