Merge lp:~ahayzen/webbrowser-app/dnd-handle-design-001 into lp:webbrowser-app/staging

[Andrew Hayzen]

* Improve styling for drag handle to match design
* Add extra properties to DragHelper to allow for changing border size and handle size etc

* Improve styling for drag handle to match design
* Add extra properties to DragHelper to allow for changing border size and handle size etc

[lp:~ahayzen/webbrowser-app/dnd-handle-design-001]

1537. By Andrew Hayzen on 2016-10-27

* Merge of changes in lp:~ahayzen/webbrowser-app/dnd-tabs-001

1538. By Andrew Hayzen on 2016-11-10

* Merge of upstream

1539. By Andrew Hayzen on 2016-11-10

* Revert .pot change

1540. By Andrew Hayzen on 2016-11-10

* Merge of upstream

1541. By Andrew Hayzen on 2016-11-21

* Merge of upstream

1542. By Andrew Hayzen on 2016-11-21

* Ensure pot is same as upstream

1543. By Andrew Hayzen on 2016-11-24

* Pull of upstream

1544. By Andrew Hayzen on 2016-11-29

* Merge of upstream

[Olivier Tilloy (osomon)]

In setPreviewBorderWidth(), previewBorderWidthChanged should be emitted, not previewTopCropChanged.

In drag-helper.cpp, the include of <QtCore/QSizeF> is not needed, as it’s already included in drag-helper.h. Same for <QtGui/QColor>.

review: Needs Fixing

[lp:~ahayzen/webbrowser-app/dnd-handle-design-001]

1545. By Andrew Hayzen on 2016-11-29

* Update typo on emit for previewTopCropChanged instead of previewBorderWidthChanged
* Remove unneeded includes from drag-helper.cpp

[Andrew Hayzen (ahayzen)]

Fixed the issues, please retest :-)

[Olivier Tilloy (osomon)]

LGTM now, thanks!

review: Approve

=== modified file 'src/app/webbrowser/TabsBar.qml'
--- src/app/webbrowser/TabsBar.qml	2016-11-18 15:10:47 +0000
+++ src/app/webbrowser/TabsBar.qml	2016-11-29 15:55:52 +0000
@@ -242,7 +242,10 @@
                             // Generate tab preview for drag handle
                             DragHelper.expectedAction = Qt.IgnoreAction | Qt.CopyAction | Qt.MoveAction
                             DragHelper.mimeType = "webbrowser/tab-" + (root.incognito ? "incognito" : "public")
-                            DragHelper.previewUrl = PreviewManager.previewPathFromUrl(tab.url); 
+                            DragHelper.previewBorderWidth = units.gu(1)
+                            DragHelper.previewSize = Qt.size(units.gu(35), units.gu(22.5))
+                            DragHelper.previewTopCrop = chrome.height
+                            DragHelper.previewUrl = PreviewManager.previewPathFromUrl(tab.url)
                             DragHelper.source = tabDelegate
 
                             var dropAction = DragHelper.execDrag(tab.url);

=== modified file 'src/app/webbrowser/drag-helper.cpp'
--- src/app/webbrowser/drag-helper.cpp	2016-11-18 15:10:47 +0000
+++ src/app/webbrowser/drag-helper.cpp	2016-11-29 15:55:52 +0000
@@ -22,10 +22,10 @@
 #include <QtCore/QPoint>
 #include <QtCore/QSize>
 #include <QtCore/QString>
-#include <QtGui/QColor>
 #include <QtGui/QDrag>
 #include <QtGui/QDropEvent>
 #include <QtGui/QPainter>
+#include <QtGui/QPen>
 #include <QtGui/QPixmap>
 #include <QtQuick/QQuickItem>
 
@@ -35,9 +35,39 @@
     m_dragging(false),
     m_expected_action(Qt::IgnoreAction),
     m_mime_type(QStringLiteral("webbrowser/tab")),
+    m_preview_border_width(8),
+    m_preview_size(QSizeF(200, 150)),
+    m_preview_top_crop(0),
     m_preview_url(""),
     m_source(Q_NULLPTR)
 {
+
+}
+
+QPixmap DragHelper::drawPixmapWithBorder(QPixmap pixmap, int borderWidth, QColor color)
+{
+    // Create a transparent pixmap to draw to
+    QPixmap output(pixmap.width() + borderWidth * 2, pixmap.height() + borderWidth * 2);
+    output.fill(QColor(0, 0, 0, 0));
+
+    // Draw the pixmap with space around the edge for a border
+    QPainter borderPainter(&output);
+    borderPainter.setRenderHint(QPainter::Antialiasing);
+    borderPainter.drawPixmap(borderWidth, borderWidth, pixmap);
+
+    // Define a pen to use for the border
+    QPen borderPen;
+    borderPen.setColor(color);
+    borderPen.setJoinStyle(Qt::MiterJoin);
+    borderPen.setStyle(Qt::SolidLine);
+    borderPen.setWidth(borderWidth);
+
+    // Set the pen and draw the border
+    borderPainter.setPen(borderPen);
+    borderPainter.drawRect(borderWidth / 2, borderWidth / 2,
+                           output.width() - borderWidth, output.height() - borderWidth);
+
+    return output;
 }
 
 Qt::DropAction DragHelper::execDrag(QString tabId)
@@ -48,8 +78,29 @@
     QMimeData *mimeData = new QMimeData;
     mimeData->setData(mimeType(), tabId.toLatin1());
 
-    // Build a pixmap for the drag handle
-    QSize pixmapSize(200, 150);
+    // Get a bordered pixmap of the previewUrl
+    QSize size = previewSize().toSize();
+
+    QPixmap pixmap = drawPixmapWithBorder(getPreviewUrlAsPixmap(size.width(), size.height()),
+        previewBorderWidth(), QColor(205, 205, 205, 255 * 0.6));  // #cdcdcd
+
+    // Setup the drag and then execute it
+    drag->setHotSpot(QPoint(size.width() * 0.1, size.height() * 0.1));
+    drag->setMimeData(mimeData);
+    drag->setPixmap(pixmap);
+
+    setDragging(true);
+
+    Qt::DropAction action = drag->exec(expectedAction());
+
+    setDragging(false);
+
+    return action;
+}
+
+QPixmap DragHelper::getPreviewUrlAsPixmap(int width, int height)
+{
+    QSize pixmapSize(width, height);
     QPixmap pixmap(previewUrl());
 
     if (pixmap.isNull()) {
@@ -59,23 +110,14 @@
         painter.eraseRect(0, 0, pixmapSize.width(), pixmapSize.height());
         painter.fillRect(0, 0, pixmapSize.width(), pixmapSize.height(), QColor(255, 255, 255, 255));
     } else {
+        // Crop transparent part off the top of the image
+        pixmap = pixmap.copy(0, previewTopCrop(), pixmap.width(), pixmap.height() - previewTopCrop());
+
         // Scale image to fit the expected size
         pixmap = pixmap.scaled(pixmapSize, Qt::KeepAspectRatio, Qt::SmoothTransformation);
     }
 
-    // Setup the drag and then execute it
-    drag->setHotSpot(QPoint(0, 0));
-    drag->setMimeData(mimeData);
-    drag->setPixmap(pixmap);
-
-
-    setDragging(true);
-
-    Qt::DropAction action = drag->exec(expectedAction());
-
-    setDragging(false);
-
-    return action;
+    return pixmap;
 }
 
 void DragHelper::setActive(bool active)
@@ -114,6 +156,33 @@
     }
 }
 
+void DragHelper::setPreviewBorderWidth(int previewBorderWidth)
+{
+    if (m_preview_border_width != previewBorderWidth) {
+        m_preview_border_width = previewBorderWidth;
+
+        Q_EMIT previewBorderWidthChanged();
+    }
+}
+
+void DragHelper::setPreviewSize(QSizeF previewSize)
+{
+    if (m_preview_size != previewSize) {
+        m_preview_size = previewSize;
+
+        Q_EMIT previewSizeChanged();
+    }
+}
+
+void DragHelper::setPreviewTopCrop(int previewTopCrop)
+{
+    if (m_preview_top_crop != previewTopCrop) {
+        m_preview_top_crop = previewTopCrop;
+
+        Q_EMIT previewTopCropChanged();
+    }
+}
+
 void DragHelper::setPreviewUrl(QString previewUrl)
 {
     if (m_preview_url != previewUrl) {

=== modified file 'src/app/webbrowser/drag-helper.h'
--- src/app/webbrowser/drag-helper.h	2016-11-18 16:26:35 +0000
+++ src/app/webbrowser/drag-helper.h	2016-11-29 15:55:52 +0000
@@ -19,8 +19,10 @@
 #ifndef __DRAGHELPER_H__
 #define __DRAGHELPER_H__
 
+#include <QtCore/QSizeF>
 #include <QtCore/QObject>
 #include <QtCore/QString>
+#include <QtGui/QColor>
 #include <QtGui/QMouseEvent>
 
 class QQuickItem;
@@ -33,6 +35,9 @@
     Q_PROPERTY(bool dragging READ dragging NOTIFY draggingChanged)
     Q_PROPERTY(Qt::DropAction expectedAction READ expectedAction WRITE setExpectedAction NOTIFY expectedActionChanged)
     Q_PROPERTY(QString mimeType READ mimeType WRITE setMimeType NOTIFY mimeTypeChanged)
+    Q_PROPERTY(int previewBorderWidth READ previewBorderWidth WRITE setPreviewBorderWidth NOTIFY previewBorderWidthChanged)
+    Q_PROPERTY(QSizeF previewSize READ previewSize WRITE setPreviewSize NOTIFY previewSizeChanged)
+    Q_PROPERTY(int previewTopCrop READ previewTopCrop WRITE setPreviewTopCrop NOTIFY previewTopCropChanged)
     Q_PROPERTY(QString previewUrl READ previewUrl WRITE setPreviewUrl NOTIFY previewUrlChanged)
     Q_PROPERTY(QQuickItem* source READ source WRITE setSource NOTIFY sourceChanged)
 public:
@@ -41,6 +46,9 @@
     bool dragging() { return m_dragging; }
     Qt::DropAction expectedAction() { return m_expected_action; }
     QString mimeType() { return m_mime_type; }
+    int previewBorderWidth() { return m_preview_border_width; }
+    QSizeF previewSize() { return m_preview_size; }
+    int previewTopCrop() { return m_preview_top_crop; }
     QString previewUrl() { return m_preview_url; }
     QQuickItem *source() { return m_source; }
 signals:
@@ -48,6 +56,9 @@
     void draggingChanged();
     void expectedActionChanged();
     void mimeTypeChanged();
+    void previewBorderWidthChanged();
+    void previewSizeChanged();
+    void previewTopCropChanged();
     void previewUrlChanged();
     void sourceChanged();
 public slots:
@@ -55,15 +66,23 @@
     void setActive(bool active);
     void setExpectedAction(Qt::DropAction expectedAction);
     void setMimeType(QString mimeType);
+    void setPreviewBorderWidth(int previewBorderWidth);
+    void setPreviewSize(QSizeF previewSize);
+    void setPreviewTopCrop(int previewTopCrop);
     void setPreviewUrl(QString previewUrl);
     void setSource(QQuickItem *source);
 private:
+    QPixmap drawPixmapWithBorder(QPixmap pixmap, int borderWidth, QColor color);
+    QPixmap getPreviewUrlAsPixmap(int width, int height);
     void setDragging(bool dragging);
 
     bool m_active;
     bool m_dragging;
     Qt::DropAction m_expected_action;
     QString m_mime_type;
+    int m_preview_border_width;
+    QSizeF m_preview_size;
+    int m_preview_top_crop;
     QString m_preview_url;
     QQuickItem *m_source;
 };