[gnome-sound-recorder] pause recording functionality

[Bilal Elmoussaoui <bilelmoussaoui src gnome org>]

commit 911f925b499df6a6fbe6417d7edfbabc80b20215
Author: Kavan Mevada <kavanmevada gmail com>
Date:   Thu Jun 4 16:25:09 2020 +0530

    pause recording functionality

 data/ui/window.ui | 104 ++++++++++++++++++++++++++++++++++++++++++++++--------
 src/mainWindow.js |  20 +++++++++--
 2 files changed, 107 insertions(+), 17 deletions(-)
---
diff --git a/data/ui/window.ui b/data/ui/window.ui
index 30c32c5..c218479 100644
--- a/data/ui/window.ui
+++ b/data/ui/window.ui
@@ -31,7 +31,7 @@
                 <property name="receives_default">False</property>
                 <property name="valign">center</property>
                 <property name="always_show_image">True</property>
-                <signal name="clicked" handler="onRecordStart" swapped="no"/>
+                <signal name="clicked" handler="onRecorderStart" swapped="no"/>
                 <child>
                   <object class="GtkBox">
                     <property name="visible">True</property>
@@ -155,27 +155,103 @@
                 <property name="margin_bottom">24</property>
                 <property name="orientation">vertical</property>
                 <child>
-                  <object class="GtkButton" id="recordStopButton">
+                  <object class="GtkBox">
                     <property name="visible">True</property>
-                    <property name="can_focus">True</property>
-                    <property name="receives_default">True</property>
+                    <property name="can_focus">False</property>
                     <property name="halign">center</property>
-                    <property name="valign">end</property>
+                    <property name="valign">center</property>
                     <property name="margin_top">8</property>
-                    <signal name="clicked" handler="onRecordStop" swapped="no"/>
+                    <property name="spacing">18</property>
+                    <property name="width_request">150</property>
                     <child>
-                      <object class="GtkImage">
+                      <object class="GtkStack" id="playbackStack">
                         <property name="visible">True</property>
                         <property name="can_focus">False</property>
-                        <property name="icon_name">media-playback-stop-symbolic</property>
-                        <property name="icon_size">3</property>
+                        <property name="halign">start</property>
+                        <property name="valign">center</property>
+                        <child>
+                          <object class="GtkButton" id="playButton">
+                            <property name="name">playButton</property>
+                            <property name="visible">True</property>
+                            <property name="can_focus">True</property>
+                            <property name="receives_default">True</property>
+                            <property name="halign">center</property>
+                            <property name="always_show_image">True</property>
+                            <signal name="clicked" handler="onRecorderResume" swapped="no"/>
+                            <child>
+                              <object class="GtkImage" id="playIcon">
+                                <property name="visible">True</property>
+                                <property name="can_focus">False</property>
+                                <property name="icon_name">media-playback-start-symbolic</property>
+                              </object>
+                            </child>
+                            <style>
+                              <class name="pill-button"/>
+                            </style>
+                          </object>
+                          <packing>
+                            <property name="name">recorder-start</property>
+                          </packing>
+                        </child>
+                        <child>
+                          <object class="GtkButton" id="pauseButton">
+                            <property name="visible">True</property>
+                            <property name="can_focus">True</property>
+                            <property name="receives_default">True</property>
+                            <property name="halign">center</property>
+                            <property name="always_show_image">True</property>
+                            <signal name="clicked" handler="onRecorderPause" swapped="no"/>
+                            <child>
+                              <object class="GtkImage" id="pauseIcon">
+                                <property name="visible">True</property>
+                                <property name="can_focus">False</property>
+                                <property name="icon_name">media-playback-pause-symbolic</property>
+                              </object>
+                            </child>
+                            <style>
+                              <class name="pill-button"/>
+                            </style>
+                          </object>
+                          <packing>
+                            <property name="name">recorder-pause</property>
+                            <property name="position">1</property>
+                          </packing>
+                        </child>
                       </object>
+                      <packing>
+                        <property name="expand">False</property>
+                        <property name="fill">True</property>
+                        <property name="position">0</property>
+                      </packing>
+                    </child>
+                    <child>
+                      <object class="GtkButton">
+                        <property name="visible">True</property>
+                        <property name="can_focus">True</property>
+                        <property name="receives_default">True</property>
+                        <property name="halign">center</property>
+                        <property name="valign">center</property>
+                        <signal name="clicked" handler="onRecorderStop" swapped="no"/>
+                        <child>
+                          <object class="GtkImage">
+                            <property name="visible">True</property>
+                            <property name="can_focus">False</property>
+                            <property name="icon_name">media-playback-stop-symbolic</property>
+                            <property name="icon_size">3</property>
+                          </object>
+                        </child>
+                        <style>
+                          <class name="pill-button"/>
+                          <class name="destructive-action"/>
+                          <class name="large-button"/>
+                        </style>
+                      </object>
+                      <packing>
+                        <property name="expand">False</property>
+                        <property name="fill">True</property>
+                        <property name="position">1</property>
+                      </packing>
                     </child>
-                    <style>
-                      <class name="pill-button"/>
-                      <class name="destructive-action"/>
-                      <class name="large-button"/>
-                    </style>
                   </object>
                   <packing>
                     <property name="expand">False</property>
diff --git a/src/mainWindow.js b/src/mainWindow.js
index 23281da..5dcf389 100644
--- a/src/mainWindow.js
+++ b/src/mainWindow.js
@@ -18,6 +18,7 @@
 *
 */
 
+const Gst = imports.gi.Gst;
 const GObject = imports.gi.GObject;
 const Handy = imports.gi.Handy;
 
@@ -31,7 +32,7 @@ const WaveForm = imports.waveform.WaveForm;
 
 var MainWindow = GObject.registerClass({
     Template: 'resource:///org/gnome/SoundRecorder/ui/window.ui',
-    InternalChildren: ['recordTimeLabel', 'mainStack', 'recordGrid', 'listBox', 'emptyIcon'],
+    InternalChildren: ['recordTimeLabel', 'mainStack', 'recordGrid', 'listBox', 'emptyIcon', 
'playbackStack'],
 }, class MainWindow extends Handy.ApplicationWindow {
 
     _init(params) {
@@ -82,17 +83,30 @@ var MainWindow = GObject.registerClass({
         this.show();
     }
 
-    onRecordStart() {
+    onRecorderPause() {
+        this._recorder.state = Gst.State.PAUSED;
+        this._playbackStack.set_visible_child_name('recorder-start');
+    }
+
+    onRecorderResume() {
+        this._recorder.state = Gst.State.PLAYING;
+        this._playbackStack.set_visible_child_name('recorder-pause');
+    }
+
+    onRecorderStart() {
         this.player.stop();
         this._mainStack.set_visible_child_name('recorderView');
         this._recorder.start();
+
+        this._playbackStack.set_visible_child_name('recorder-pause');
     }
 
-    onRecordStop() {
+    onRecorderStop() {
         const recording = this._recorder.stop();
         this._recordingList.insert(0, recording);
 
         this.waveform.endDrawing();
+        this._playbackStack.set_visible_child_name('recorder-start');
     }
 
     _refreshView() {