git.maemo.org Git - lichviet/blob - qml/DatePicker/component/DateReel.qml

   1 import QtQuick 1.1
   2
   3 import "../../LichViet/main.js" as Script
   4
   5 Item {
   6     id: container
   7
   8     // Year item dimensions
   9     property int yearWidth: (width-2*spacing)*0.4
  10     property int yearHeight: height
  11     // Month item dimensions
  12     property int monthWidth: (width-2*spacing)*0.3
  13     property int monthHeight: height
  14     // Day item dimensions
  15     property int dayWidth: (width-2*spacing)*0.3
  16     property int dayHeight: height
  17     // Font properties
  18     property string fontName: 'Helvetica'
  19     property int fontSize: 22
  20     property color fontColor: "#666666"
  21     // Spacing between items
  22     property int spacing: 8
  23
  24     property Component itemBackground: Component {
  25         BorderImage {
  26             border { top: 8; bottom: 8; left: 8; right: 8 }
  27             source:  theme_manager.theme.datepicker.button
  28         }
  29     }
  30     property Component itemBackgroundPressed: Component {
  31         BorderImage {
  32             border { top: 8; bottom: 8; left: 8; right: 8 }
  33             source: theme_manager.theme.datepicker.button_pressed
  34         }
  35     }
  36
  37     width: 240
  38     height:  90
  39
  40     Component.onCompleted: {
  41     }
  42
  43     Component {
  44         id: dayDelegate
  45         Button {
  46             width: container.dayWidth
  47             height: container.dayHeight
  48             text: number
  49             fontColor: container.fontColor
  50             fontName: container.fontName
  51             fontSize: container.fontSize
  52             bg: itemBackground
  53             bgPressed: itemBackgroundPressed
  54              opacity: (index+1 < days.start || index+1 > days.end) ? 0.5 : 1.0
  55         }
  56     }
  57
  58     Component {
  59         id: monthDelegate
  60         Button {
  61             width: container.monthWidth
  62             height: container.monthHeight
  63             text: number
  64             fontColor: container.fontColor
  65             fontName: container.fontName
  66             fontSize: container.fontSize
  67             bg: itemBackground
  68             bgPressed: itemBackgroundPressed
  69
  70         }
  71     }
  72
  73     Component {
  74         id: yearDelegate
  75         Button {
  76             width: container.yearWidth
  77             height: container.yearHeight
  78             text: number
  79             fontColor: container.fontColor
  80             fontName: container.fontName
  81             fontSize: container.fontSize
  82             bg: itemBackground
  83             bgPressed: itemBackgroundPressed
  84         }
  85     }
  86
  87
  88     Row {
  89         id: reels
  90         spacing: container.spacing
  91
  92         Reel {
  93             id: day
  94             width: container.dayWidth
  95             height: container.dayHeight
  96             model: days
  97             delegate:  dayDelegate
  98             autoClose: false
  99
 100             function mouseoff(){
 101                 if (day.index+1 < days.start) day.index = days.start-1;
 102                 else if (day.index+1 > days.end ) day.index = days.end-1;
 103
 104
 105                 datePicker.mDay = day.index + 1;
 106                 datePicker.mMonth = month.index + 1;
 107                 datePicker.mYear = year.index + 1900;
 108             }
 109         }
 110
 111         Reel {
 112             id: month
 113             width: container.monthWidth
 114             height: container.monthHeight
 115             model: months
 116             delegate: monthDelegate
 117             autoClose: false
 118
 119             function mouseoff(){
 120                 days.reset()
 121                 datePicker.mDay = day.index + 1;
 122                 datePicker.mMonth = month.index + 1;
 123                 datePicker.mYear = year.index + 1900;
 124             }
 125         }
 126
 127         Reel {
 128             id: year
 129             width: container.yearWidth
 130             height: container.yearHeight
 131             model: years
 132             delegate: yearDelegate
 133             autoClose: false
 134
 135             function mouseoff(){
 136                  days.reset()
 137                 datePicker.mDay = day.index + 1;
 138                 datePicker.mMonth = month.index + 1;
 139                 datePicker.mYear = year.index + 1900;
 140             }
 141         }
 142
 143     }
 144
 145
 146     ListModel {
 147         id: days
 148
 149         property int start: 1
 150         property int end: 31
 151
 152         Component.onCompleted: {
 153             appends()
 154             day.index = Script.curDay - 1
 155             end = Script.calDaysX(month.index+1,year.index+1900);
 156         }
 157
 158         function reset(){
 159             var howmanydays =  Script.calDaysX(month.index+1,year.index+1900);
 160             end = howmanydays;
 161
 162             if (day.index+1 < days.start) day.index = days.start-1;
 163             else if (day.index+1 > days.end ) day.index = days.end-1;
 164         }
 165
 166         function appends(){
 167             for(var j=1;j<=31;j++){
 168                 if (j<=9)
 169                    append({number:"0"+j})
 170                 else
 171                    append({number:j})
 172             }
 173         }
 174
 175         function change(){
 176            day.index = Script.curDay-1;
 177         }
 178     }
 179
 180     ListModel{
 181         id: months
 182         Component.onCompleted: {
 183             for(var j=1;j<=12;j++){
 184                 if (j<=9)
 185                    append({number:"0"+j})
 186                 else
 187                    append({number:j})
 188             }
 189             month.index = Script.curMonth - 1
 190         }
 191
 192         function change(){
 193              month.index = Script.curMonth - 1;
 194         }
 195     }
 196
 197     ListModel{
 198         id: years
 199         Component.onCompleted: {
 200             for(var i=1900;i<2099;i++){
 201                 append({number:i})
 202             }
 203             year.index = Script.curYear - 1900
 204         }
 205
 206         function change(){
 207               year.index = Script.curYear - 1900
 208         }
 209     }
 210
 211     function day_reset(){
 212          datePicker.mDay = Script.curDay
 213         days.change()
 214     }
 215
 216     function month_reset(){
 217                  datePicker.mMonth = Script.curMonth
 218         months.change()
 219     }
 220
 221     function year_reset(){
 222         datePicker.mYear = Script.curYear
 223         years.change()
 224     }
 225
 226
 227 }