@ -11,20 +11,20 @@ import "." as NeroshopComponents
/ / G r i d s h o u l d h a v e t w o m o d e s : P a g i n a t i o n m o d e a n d I n f i n i t e s c r o l l m o d e
/ / c a t a l o g v i e w ( G r i d )
Grid {
id: catalog _g rid
id: catalog G rid
rows: 2
columns: 3
spacing: 5 / / r o w S p a c i n g : 5 ; c o l u m n S p a c i n g : 5
/ / f l o w : G r i d . T o p T o B o t t o m
function getBox ( index ) { / / o r g e t _ i t e m ( i n d e x ) ?
return catalog _grid_r epeater. itemAt ( index ) ;
return catalog GridR epeater. itemAt ( index ) ;
}
function getBoxCount ( ) {
return catalog _grid_r epeater. count ; / / c o u n t i s r e a l l y j u s t t h e n u m b e r o f i t e m s i n t h e m o d e l : O
return catalog GridR epeater. count ; / / c o u n t i s r e a l l y j u s t t h e n u m b e r o f i t e m s i n t h e m o d e l : O
}
Repeater { / / o w n s a l l i t e m s i t i n s t a n t i a t e s
id: catalog _grid_r epeater
id: catalog GridR epeater
model: ( rows * columns ) / /fruitModel / / rows and columns already set so this is useless ( I think )
/ / p r o d u c t b o x ( G r i d B o x )
delegate: Rectangle { / / d e l e g a t e s h a v e a r e a d o n l y " i n d e x " p r o p e r t y t h a t i n d i c a t e s t h e i n d e x o f t h e d e l e g a t e w i t h i n t h e r e p e a t e r
@ -32,15 +32,15 @@ import "." as NeroshopComponents
visible: true
width: 220
height: 220
color: ( NeroshopComponents . Style . darkTheme ) ? "#2e2e2e" /*"#121212"*/ : "#a0a0a0" / / # a 0 a 0 a 0 = 1 6 0 , 1 6 0 , 1 6
color: ( NeroshopComponents . Style . darkTheme ) ? "#2e2e2e" /*"#121212"*/ : "#a0a0a0" / /"#ffffff"/ / # a0a0a0 = 160 , 160 , 16
/ / b o r d e r . c o l o r : " w h i t e "
/ / b o r d e r . w i d t h : 1
radius: 5
Image {
id: verified _purchase_i con
id: verified PurchaseI con
source: "file:///" + neroshopResourcesDir + "/paid.png" / / n e r o s h o p R e s o u r c e D i r + " / p a i d . p n g "
visible: true/ /false / / only show this icon if item has been purchased previousl y
visible: false / / o n l y s h o w t h i s i c o n i f i t e m h a s b e e n p u r c h a s e d p r e v i o u s l y
anchors.left: parent . left
anchors.leftMargin: 10
anchors.top: parent . top
@ -48,45 +48,35 @@ import "." as NeroshopComponents
height: 24 ; width: 24 / / h a s n o e f f e c t s i n c e i m a g e i s s c a l e d
fillMode: Image . PreserveAspectFit ; / / t h e i m a g e i s s c a l e d u n i f o r m l y t o f i t b u t t o n w i t h o u t c r o p p i n g
mipmap: true
MouseArea {
id: verified _purchase_icon_mouse_a rea
id: verified PurchaseIconMouseA rea
anchors.fill: parent
hoverEnabled: true
/ / a c c e p t e d B u t t o n s : Q t . L e f t B u t t o n / / f o r h e a r t _ i c o n O N L Y
onEntered: {
console . log ( "Mouse is over paid icon" )
/ / s h o w t o o l t i p - t o d o : s h o w t o o l t i p w h i l e m o u s e i s h o v e r e d o v e r
/ / / / i f ( h a s _ p u r c h a s e d ) {
console . log ( "Icon pos (" + catalog_grid_repeater . itemAt ( index ) . children [ 0 ] . x + ", " + catalog_grid_repeater . itemAt ( index ) . children [ 0 ] . y + ")" )
console . log ( "Hint pos (" + hint . x + ", " + hint . y + ")" )
console . log ( "Grid pos (" + catalog_grid . x + ", " + catalog_grid . y + ")" )
console . log ( "Grid Parent pos (" + parent . x + ", " + parent . y + ")" )
/ / h i n t . x = c a t a l o g _ g r i d _ r e p e a t e r . i t e m A t ( i n d e x ) . c h i l d r e n [ 0 ] . x / / h i n t . a n c h o r s . l e f t = c a t a l o g _ g r i d _ r e p e a t e r . i t e m A t ( i n d e x ) . l e f t / / c a t a l o g _ g r i d _ r e p e a t e r . i t e m A t ( 0 ) . h o r i z o n t a l C e n t e r / / . l e f t / / p a r e n t . x + ( ( p a r e n t . w i d t h - t h i s . w i d t h ) / 2 )
/ / h i n t . y = c a t a l o g _ g r i d _ r e p e a t e r . i t e m A t ( i n d e x ) . c h i l d r e n [ 0 ] . y
/ / h i n t . x = c a t a l o g _ g r i d . x + c a t a l o g _ g r i d _ r e p e a t e r . i t e m A t ( i n d e x ) . c h i l d r e n [ 0 ] . x / / + c a t a l o g _ g r i d _ r e p e a t e r . i t e m A t ( i n d e x ) . c h i l d r e n [ 0 ] . w i d t h
/ / h i n t . y = c a t a l o g _ g r i d . y + c a t a l o g _ g r i d _ r e p e a t e r . i t e m A t ( i n d e x ) . c h i l d r e n [ 0 ] . y
/*NeroshopComponents.Hint*/ hint . show ( "You've previously purchased this item" , - 1 ) / / ( ! i s _ f a v o r i t e d ) ? " A d d t o f a v o r i t e s " : " R e m o v e f r o m f a v o r i t e s "
/ / / / i f ( h a s _ p u r c h a s e d ) { / / i f i t e m h a s b e e n p u r c h a s e d p r e v i o u s l y t h e n t h i s i c o n w i l l b e v i s i b l e , s o n o n e e d f o r t h i s
let boxPositionInWindow = mapToItem ( mainWindow . contentItem , verifiedPurchaseIconMouseArea . x , verifiedPurchaseIconMouseArea . y )
let box = catalogGridRepeater . itemAt ( index ) . children [ 0 ]
catalogHint . x = boxPositionInWindow . x + ( box . width - catalogHint . width ) / 2
catalogHint . y = boxPositionInWindow . y + box . height + 5
catalogHint . show ( "You've previously purchased this item" , 3000 ) / / h i d e a f t e r 3 s e c o n d s
/ / / / }
}
onExited: {
hint . hide ( )
}
/ / o n C l i c k e d : { / / f o r h e a r t _ i c o n C o l o r O v e r l a y O N L Y
/ / i f ( ! i s _ f a v o r i t e d ) h e a r t _ i c o n . c o l o r = " # 8 0 8 0 8 0 "
/ / e l s e h e a r t _ i c o n . c o l o r = " # e 0 5 d 5 d "
/ / }
catalogHint . hide ( )
}
}
}
ColorOverlay {
anchors.fill: verified _purchase_i con
source: verified _purchase_i con
color: "#808080" / /#808080 = 128, 128, 128/ / # 1 e509b = active color / / ( h a s _ p u r c h a s e d ) ? c o l o r : " # 1 e 5 0 9 b " : " # 8 0 8 0 8 0 "
visible: verified _purchase_i con. visible
anchors.fill: verifiedPurchaseIcon
source: verified PurchaseI con
color: ( NeroshopComponents . Style . darkTheme ) ? "#6699cc" : "#1e509b" / /"#336699"/ / / / a c t i v e C o l o r
visible: verified PurchaseI con. visible
}
Image {
id: heart _i con
id: heart I con
source: "file:///" + neroshopResourcesDir + "/heart.png" / / n e r o s h o p R e s o u r c e D i r + " / h e a r t . p n g "
visible: true
anchors.right: parent . right
@ -95,36 +85,62 @@ import "." as NeroshopComponents
anchors.topMargin: 10
height: 24 ; width: 24 / / h a s n o e f f e c t s i n c e i m a g e i s s c a l e d
fillMode: Image . PreserveAspectFit ; / / t h e i m a g e i s s c a l e d u n i f o r m l y t o f i t b u t t o n w i t h o u t c r o p p i n g
fillMode: Image . PreserveAspectFit ; / / t h e i m a g e i s s c a l e d u n i f o r m l y t o f i t b u t t o n w i t h o u t c r o p p i n g
mipmap: true
MouseArea {
id: heartIconMouseArea
anchors.fill: parent
hoverEnabled: true
acceptedButtons: Qt . LeftButton
onEntered: {
let boxPositionInWindow = mapToItem ( mainWindow . contentItem , heartIconMouseArea . x , heartIconMouseArea . y )
let box = catalogGridRepeater . itemAt ( index ) . children [ 0 ]
catalogHint . x = boxPositionInWindow . x + ( box . width - catalogHint . width ) / 2
catalogHint . y = boxPositionInWindow . y + box . height + 5
catalogHint . show ( "Add to favorites" , 3000 ) / / / / ( ! i s _ f a v o r i t e d ) ? c a t a l o g H i n t . s h o w ( " A d d t o f a v o r i t e s " , - 1 ) : c a t a l o g H i n t . s h o w ( " R e m o v e f r o m f a v o r i t e s " )
}
onExited: {
catalogHint . hide ( )
}
onClicked: {
/ * i f ( ! i s _ f a v o r i t e d ) h e a r t I c o n O v e r l a y . c o l o r = " # 8 0 8 0 8 0 "
else heartIconOverlay . color = "#e05d5d" * /
heartIconOverlay . color = "#e05d5d"
}
}
}
ColorOverlay {
anchors.fill: heart_icon
source: heart_icon
color: "#808080" / /#808080 = 128, 128, 128/ / # e05d5d = active color / / ( i s _ f a v o r i t e d ) ? c o l o r : " # e 0 5 d 5 d " : " # 8 0 8 0 8 0 "
visible: heart_icon . visible
id: heartIconOverlay
anchors.fill: heartIcon
source: heartIcon
color: ( NeroshopComponents . Style . darkTheme ) ? "#ffffff" : NeroshopComponents . Style . disabledColor / /#e05d5d = active color / / / / ( i s _ f a v o r i t e d ) ? c o l o r : " # e 0 5 d 5 d " : " # 8 0 8 0 8 0 "
visible: heartIcon . visible
}
Image {
id: product_image
id: product I mage
source: "file:///" + neroshopResourcesDir + "/image_gallery.png" / / n e r o s h o p R e s o u r c e D i r + " / i m a g e _ g a l l e r y . p n g "
anchors.centerIn: parent
width: 128
height: 128
fillMode: Image . Stretch
fillMode: Image . Stretch
/ / m i p m a p : t r u e
}
/ * C o l o r O v e r l a y {
anchors.fill: product_image
source: product_image
color: "#808080" / / # 8 0 8 0 8 0 = 1 2 8 , 1 2 8 , 1 2 8
} * /
anchors.fill: productImage
source: productImage
color: ( NeroshopComponents . Style . darkTheme ) ? "#ffffff" : NeroshopComponents . Style . disabledColor
visible: productImage . visible
} * /
Label {
id: product _name_l abel
id: product NameL abel
text: "" / / n a m e
anchors.left: parent . left
anchors.leftMargin: 10
anchors.top: product _i mage. bottom
anchors.top: product I mage. bottom
anchors.topMargin: 10
}
} / / C a t a l o g V i e w B o x ( g r i d b o x )
