Implement reordering of boxes - SL #2842

Signed-off-by: Jorge Alberto Gómez López <gomezlopez.jorge96@gmail.com>
Reviewed-by: Gonzalo Odiard <gonzalo@laptop.org>

3 files changed, 247 insertions, 0 deletions

diff --git a/historietaactivity.py b/historietaactivity.py
index 16b334f..3df015c 100644
--- a/historietaactivity.py
+++ b/historietaactivity.py
@@ -21,6 +21,7 @@ from toolbar import TextToolbar
 from toolbar import GlobesManager
 
 from slideview import SlideView
+from reorderwindow import ReorderView
 
 import time
 from sugar3.datastore import datastore
@@ -85,6 +86,13 @@ class HistorietaActivity(activity.Activity):
         slideview_btn.connect('clicked', self._switch_view_mode, text_button)
         toolbar_box.toolbar.insert(text_button, -1)
 
+        reorder_img_btn = ToolButton('thumbs-view')
+        reorder_img_btn.set_icon_name('thumbs-view')
+        reorder_img_btn.set_tooltip(_('Change image order'))
+        reorder_img_btn.connect('clicked', self.__image_order_cb)
+        toolbar_box.toolbar.insert(reorder_img_btn, -1)
+        reorder_img_btn.show()
+
         separator = Gtk.SeparatorToolItem()
         separator.props.draw = False
         separator.set_expand(True)
@@ -265,6 +273,10 @@ class HistorietaActivity(activity.Activity):
         self._show_journal_alert(_('Success'),
                                  _('A image was created in the Journal'))
 
+    def __image_order_cb(self, button):
+        reorderwin = ReorderView(self)
+        reorderwin.show_all()
+
     def _save_as_pdf(self, widget):
 
         file_name = os.path.join(self.get_activity_root(), 'instance',
@@ -396,6 +408,8 @@ else:
 SCREEN_WIDTH = Gdk.Screen.width() - scrollbar_width - 5
 BOX_HEIGHT = 450
 
+THUMB_SIZE = activity.PREVIEW_SIZE
+
 
 class Page(Gtk.VBox):
 
@@ -499,6 +513,7 @@ class ComicBox(Gtk.EventBox):
         self.image = None
         self.image_saved = False
         self.title_globe = None
+        self.thumbnail = None
 
         self.width = (int)(SCREEN_WIDTH - DEF_SPACING) / 2
         self.height = BOX_HEIGHT
@@ -664,6 +679,19 @@ class ComicBox(Gtk.EventBox):
         # Por ultimo dibujamos los globos
         self.draw_globos(ctx)
 
+    def get_thumbnail(self):
+        if self.thumbnail is None:
+            instance_path = os.path.join(activity.get_activity_root(),
+                                         'instance')
+            if (not self.image_name.startswith(instance_path)):
+                self.thumbnail = GdkPixbuf.Pixbuf.new_from_file_at_size(
+                    os.path.join(instance_path, self.image_name),
+                    THUMB_SIZE[0], THUMB_SIZE[1])
+            else:
+                self.thumbnail = GdkPixbuf.Pixbuf.new_from_file_at_size(
+                    self.image_name, THUMB_SIZE[0], THUMB_SIZE[1])
+        return self.thumbnail
+
     def draw_globos(self, context):
         if len(self.globos) > 0:
             for g in self.globos:
diff --git a/icons/thumbs-view.svg b/icons/thumbs-view.svg
new file mode 100644
index 0000000..2086c70
--- /dev/null
+++ b/icons/thumbs-view.svg
@@ -0,0 +1,115 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   version="1.1"
+   width="55"
+   height="54.695999"
+   viewBox="0 0 55 54.696"
+   id="svg3000"
+   xml:space="preserve"><metadata
+     id="metadata3021"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+     id="defs3019">
+	
+
+		
+	
+			
+			
+			
+			
+			
+		
+	
+	
+	
+
+  
+  
+
+  
+   
+   
+   
+   
+
+	
+
+		
+		
+		
+		
+		
+		
+		
+		
+		
+	</defs><rect
+     width="55"
+     height="55"
+     x="-4.2962074e-07"
+     y="-0.30399999"
+     id="rect3005"
+     style="fill:#282828;fill-opacity:1;stroke:none" /><g
+     transform="translate(-1.1206348,-0.06663089)"
+     id="g3918"><rect
+       width="20"
+       height="14"
+       x="7.5592799"
+       y="20.414629"
+       id="rect3791-6"
+       style="fill:#606060;fill-opacity:1;stroke:none" /><rect
+       width="20"
+       height="14"
+       x="29.68199"
+       y="36.089016"
+       id="rect3791-6-8"
+       style="fill:#c0c0c0;fill-opacity:1;stroke:none" /><rect
+       width="20"
+       height="14"
+       x="7.5592799"
+       y="36.089016"
+       id="rect3791-6-4"
+       style="fill:#606060;fill-opacity:1;stroke:none" /><rect
+       width="20"
+       height="14"
+       x="29.68199"
+       y="20.414629"
+       id="rect3791-6-41"
+       style="fill:#606060;fill-opacity:1;stroke:none" /><rect
+       width="20"
+       height="14"
+       x="29.68199"
+       y="4.7402458"
+       id="rect3791-6-9"
+       style="fill:#606060;fill-opacity:1;stroke:none" /><rect
+       width="20"
+       height="14"
+       x="7.5592799"
+       y="4.7402458"
+       id="rect3791-6-6"
+       style="fill:#c0c0c0;fill-opacity:1;stroke:none" /></g><g
+     transform="translate(1.745311,0.5838585)"
+     id="g3827"
+     style="stroke:#ffffff;stroke-opacity:1"><polyline
+       id="polyline4774"
+       points="51.562,15.306 41.17,16.188 42.053,5.794"
+       style="fill:none;stroke:#ffffff;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1"
+       transform="matrix(0.75663262,0.74365257,-0.75663262,0.74365257,-0.33007478,-30.718962)" /><path
+       d="m 22.404268,11.955483 15.981904,0.08932 0.108035,27.867953"
+       id="path4776"
+       style="fill:none;stroke:#ffffff;stroke-width:3.99642467;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" /><polyline
+       id="polyline4774-6"
+       points="51.562,15.306 41.17,16.188 42.053,5.794"
+       style="fill:none;stroke:#ffffff;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1"
+       transform="matrix(-0.75663262,-0.74365257,0.75663262,-0.74365257,51.839353,84.247245)" /><path
+       d="M 29.10511,41.572799 13.123206,41.483479 13.015171,13.615526"
+       id="path4776-0"
+       style="fill:none;stroke:#ffffff;stroke-width:3.99642467;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" /></g></svg>
\ No newline at end of file
diff --git a/reorderwindow.py b/reorderwindow.py
new file mode 100644
index 0000000..7a50ebf
--- /dev/null
+++ b/reorderwindow.py
@@ -0,0 +1,104 @@
+from gettext import gettext as _
+
+from gi.repository import Gtk
+from gi.repository import Gdk
+from gi.repository import GObject
+from gi.repository.GdkPixbuf import Pixbuf
+
+from sugar3.graphics import style
+from sugar3.graphics.toolbutton import ToolButton
+
+
+class ReorderView(Gtk.Window):
+    def __init__(self, activity):
+        GObject.GObject.__init__(self)
+        self.set_border_width(style.LINE_WIDTH)
+        self.set_position(Gtk.WindowPosition.CENTER_ALWAYS)
+        self.set_decorated(False)
+        self.set_resizable(False)
+        width = Gdk.Screen.width() - style.GRID_CELL_SIZE * 2
+        height = Gdk.Screen.height() - style.GRID_CELL_SIZE * 2
+        self.set_size_request(width, height)
+        self.set_default_size(width, height)
+
+        self.toolbar = Gtk.Toolbar()
+
+        icon = ToolButton('thumbs-view')
+        self.toolbar.insert(icon, -1)
+
+        label = Gtk.Label()
+        title = _('Drag the images to reorder')
+        label.set_markup('<b>%s</b>' % title)
+        label.set_alignment(0, 0.5)
+        tool_item = Gtk.ToolItem()
+        tool_item.set_expand(True)
+        tool_item.add(label)
+        tool_item.show_all()
+        self.toolbar.insert(tool_item, -1)
+
+        self.stop = ToolButton(icon_name='dialog-cancel')
+        self.stop.set_tooltip(_('Cancel'))
+        self.stop.connect('clicked', self.__stop_clicked_cb)
+        self.toolbar.insert(self.stop, -1)
+        self.stop.show()
+
+        self.confirm = ToolButton(icon_name='dialog-ok')
+        self.confirm.set_tooltip(_('Done'))
+        self.confirm.connect('clicked', self.__ok_clicked_cb)
+        self.toolbar.insert(self.confirm, -1)
+        self.confirm.show()
+
+        self.scrollwin = ReorderObjects(activity)
+        self.vbox = Gtk.VBox()
+        self.vbox.pack_start(self.toolbar, False, False, 0)
+        self.vbox.pack_start(self.scrollwin, True, True, 0)
+        self.add(self.vbox)
+        self.scrollwin.show()
+
+    def __stop_clicked_cb(self, button):
+        self.destroy()
+
+    def __ok_clicked_cb(self, button):
+        self.scrollwin.reorder_comicboxs()
+        self.scrollwin.display_comicboxs()
+        self.destroy()
+
+
+class ReorderObjects(Gtk.ScrolledWindow):
+    def __init__(self, activity):
+        GObject.GObject.__init__(self)
+        self.set_policy(Gtk.PolicyType.NEVER, Gtk.PolicyType.ALWAYS)
+        self.activity = activity
+        self.comicboxes = self.activity.page.boxs
+
+        self.liststore = Gtk.ListStore(Pixbuf)
+        self.iconview = Gtk.IconView.new()
+        #self.iconview.set_columns(2)
+        self.iconview.set_property('item-width', 200)
+        self.iconview.set_model(self.liststore)
+        self.iconview.set_pixbuf_column(0)
+        self.iconview.set_reorderable(True)
+
+        for comicbox in self.comicboxes[1:]:
+            self.liststore.append([comicbox.get_thumbnail()])
+
+        self.add(self.iconview)
+
+    def reorder_comicboxs(self):
+        sorted_list = []
+        for row in self.liststore:
+            for comicbox in self.comicboxes[1:]:
+                if row[0] is comicbox.thumbnail:
+                    self.activity.page.table.remove(comicbox)
+                    sorted_list.append(comicbox)
+                    break
+        sorted_list.insert(0, self.comicboxes[0])
+        self.comicboxes = sorted_list
+        self.activity.page.boxs = self.comicboxes
+
+    def display_comicboxs(self):
+        for i in range(0, len(self.comicboxes[1:])):
+            reng = int(i / 2)
+            column = i - (reng * 2)
+            self.activity.page.table.attach(
+                self.comicboxes[i+1], column, column + 1, reng, reng + 1)