prolooks/Display.vala

   1 using Gtk;
   2 using Gdk;
   3
   4 namespace Prolooks {
   5
   6 public abstract class DisplayBase : DrawingArea {
   7
   8     public int width {
   9         set {
  10             _width = value;
  11         }
  12         get {
  13             return _width;
  14         }
  15     }
  16
  17     public int height {
  18         set {
  19             _height = value;
  20         }
  21         get {
  22             return _height;
  23         }
  24     }
  25
  26     public double inner_x {
  27         get {
  28             return 7.5;
  29         }
  30     }
  31
  32     public double inner_y {
  33         get {
  34             return 6.5;
  35         }
  36     }
  37
  38
  39     public int inner_width {
  40         get {
  41             return _width - 14;
  42         }
  43     }
  44
  45     public int inner_height {
  46         get {
  47             return _height - 13;
  48         }
  49     }
  50
  51
  52     private int _width  = 383;
  53     private int _height = 72;
  54
  55     public void outer_rim_for_display(Cairo.Context cr, double x, double y, double w, double h, double rounded_corner_radius = 5.0) {
  56         Color outside;
  57         Color inside;
  58         Color inside_left;
  59         Color inside_top;
  60         Color inside_right;
  61         Color inside_bottom;
  62
  63         outside = style.bg[Gtk.StateType.SELECTED];
  64         Color.parse("#010101", out inside);
  65         Color.parse("#525357", out inside_left);
  66         Color.parse("#444444", out inside_top);
  67         Color.parse("#ffffff", out inside_right);
  68         Color.parse("#ffffff", out inside_bottom);
  69
  70         var horiz_rim_left_x  = rounded_corner_radius - 1;
  71         var horiz_rim_right_x = w - rounded_corner_radius + 2;
  72         var top_rim_y         = 1.5;
  73         var bottom_rim_y      = h - 1.5;
  74
  75         var vert_rim_top_y     = rounded_corner_radius - 1;
  76         var vert_rim_bottom_y  = h - rounded_corner_radius + 1;
  77         var right_rim_x        = w - 0.5;
  78         var left_rim_x         = 1.5;
  79
  80         double ux=1, uy=1;
  81         cr.device_to_user (ref ux, ref uy);
  82         if (ux < uy) {
  83             ux = uy;
  84         }
  85
  86         cr.set_line_width (ux);
  87         // inside background
  88         rounded_rect (cr, 1, 1, w - 2, h - 2, rounded_corner_radius, rounded_corner_radius);
  89         set_source_from_color(cr, inside);
  90         cr.fill ();
  91
  92         // top rim
  93         cr.move_to (horiz_rim_left_x,  top_rim_y);
  94         cr.line_to (horiz_rim_right_x, top_rim_y);
  95         set_source_from_color(cr, inside_top);
  96         cr.stroke ();
  97
  98         // right rim
  99         cr.move_to (right_rim_x, vert_rim_top_y);
 100         cr.line_to (right_rim_x, vert_rim_bottom_y);
 101         set_source_from_color (cr, inside_right);
 102         cr.stroke ();
 103
 104         // bottom rim
 105         cr.move_to (horiz_rim_right_x, bottom_rim_y);
 106         cr.line_to (horiz_rim_left_x,  bottom_rim_y);
 107         set_source_from_color (cr, inside_bottom);
 108         cr.stroke();
 109
 110         // left rim
 111         cr.move_to (left_rim_x, vert_rim_bottom_y);
 112         cr.line_to (left_rim_x, vert_rim_top_y);
 113         set_source_from_color (cr, inside_left);
 114         cr.stroke();
 115     }
 116
 117
 118     public static void dot_matrix(Cairo.Context cr, double x, double y, double w, double h, Gdk.Color fg) {
 119         cr.save();
 120         set_source_from_color(cr, fg);
 121         for (double i = x + 1; i < x + w; i++) {
 122             for (double j = y + 1; j < y + h; j++) {
 123                 if (((long)i % 2) == 0 && ((long)j % 2) == 1) {
 124                     cr.move_to (i - 0.5, j);
 125                     cr.line_to (i + 0.5, j);
 126                     cr.stroke();
 127                 }
 128             }
 129         }
 130         cr.restore();
 131     }
 132
 133     public static void inner_glass_rim(Cairo.Context cr, double x, double y, double w, double h, double radius = 4.0) {
 134         Color rim_left_top1;
 135         Color rim_left_bottom1;
 136         Color rim_left_top2;
 137         Color rim_left_bottom2;
 138         Color rim_right_top;
 139         Color rim_right_bottom;
 140         Color rim_top1;
 141         Color rim_top2;
 142         Color rim_bottom;
 143
 144         Color.parse("#2a282d", out rim_left_top1);
 145         Color.parse("#2b2c2e", out rim_left_bottom1);
 146         Color.parse("#1b191c", out rim_left_top2);
 147         Color.parse("#1d181f", out rim_left_bottom2);
 148         Color.parse("#3d3b3c", out rim_right_top);
 149         Color.parse("#3a4036", out rim_right_bottom);
 150         Color.parse("#605b5f", out rim_top1);
 151         Color.parse("#2f2e33", out rim_top2);
 152         Color.parse("#3e403d", out rim_bottom);
 153
 154         Color test;
 155         Color.parse("#ff0000", out test);
 156
 157         double ARC_TO_BEZIER = 0.55228475;
 158
 159         if (radius > w - radius)
 160             radius = w / 2;
 161         if (radius > h - radius)
 162             radius = h / 2;
 163
 164         // approximate (quite close) the arc using a bezier curve
 165         var c = ARC_TO_BEZIER * radius;
 166
 167         cr.set_line_width(1.0);
 168
 169         // rim_top1
 170         cr.move_to ( x + radius, y);
 171         cr.rel_line_to ( w - 2 * radius, 0.0);
 172         set_source_from_color (cr, rim_top1);
 173         cr.stroke ();
 174
 175         // rim top2
 176         cr.move_to ( x + radius, y + 1);
 177         cr.rel_line_to ( w - 2 * radius, 0.0);
 178         set_source_from_color(cr, rim_top2);
 179         cr.stroke ();
 180
 181         // right top corner
 182         cr.move_to (x + w - radius, y);
 183         cr.rel_curve_to ( c, 0.0, radius, c, radius, radius);
 184         set_source_from_color (cr, rim_top1);
 185         cr.stroke ();
 186
 187         // rim right
 188         cr.move_to (x + w, y + radius);
 189         var dy = h - 2 * radius;
 190         cr.set_source (create_gradient(0, 0, 0, dy, rim_right_top, rim_right_bottom));
 191         cr.rel_line_to (0, dy);
 192         cr.stroke ();
 193
 194         // right bottom corner
 195         cr.move_to (x + w, y + h - radius);
 196         cr.rel_curve_to ( 0.0, c, c - radius, radius, -radius, radius);
 197         set_source_from_color (cr, rim_right_bottom);
 198         cr.stroke ();
 199
 200         // bottom line
 201         cr.move_to (x + w - radius, y + h);
 202         cr.rel_line_to (-w + 2 * radius, 0);
 203         set_source_from_color (cr, rim_bottom);
 204         cr.stroke ();
 205
 206         // bottom left corner
 207         cr.move_to (x + radius, y + h);
 208         cr.rel_curve_to ( -c, 0, -radius, -c, -radius, -radius);
 209         set_source_from_color (cr, rim_left_bottom1);
 210         cr.stroke ();
 211
 212         // rim left
 213         cr.move_to (x, y + h - radius);
 214         cr.set_source (create_gradient(0, 0, 0, y, rim_left_top1, rim_left_bottom1));
 215         cr.rel_line_to (0, -h + 2 * radius);
 216         cr.stroke ();
 217
 218         // rim left shadow
 219         cr.move_to (x + 1, y + h - radius);
 220         cr.set_source (create_gradient(0, 0, 0, y, rim_left_top2, rim_left_bottom2));
 221         cr.rel_line_to (0, -h + 2 * radius);
 222         cr.stroke ();
 223
 224         // top left corner
 225         cr.move_to (x, y + radius);
 226         cr.rel_curve_to (0.0, -c, radius - c, -radius, radius, -radius);
 227         set_source_from_color (cr, rim_top1);
 228         cr.stroke ();
 229
 230         // top left corner (adding thickness)
 231         cr.move_to (x + 1, y + radius);
 232         cr.rel_curve_to (0.0, -c, radius - c, -radius, radius, -radius + 1);
 233         set_source_from_color (cr, rim_top1);
 234         cr.stroke ();
 235
 236     }
 237
 238     public static const string text_color_default = "#9fc717";
 239
 240     public static void text (Cairo.Context cr, string text, double x, double y, double size, string color = text_color_default, Cairo.FontWeight weight = Cairo.FontWeight.NORMAL) {
 241         Color text_color;
 242         Color.parse (color, out text_color);
 243         set_source_from_color (cr, text_color);
 244         cr.select_font_face ("FreeSans", Cairo.FontSlant.NORMAL, weight);
 245         cr.set_font_size (size);
 246
 247         cr.move_to (x, y);
 248         cr.show_text (text);
 249     }
 250
 251     public static void lcd(Cairo.Context cr, double w, double h) {
 252         Color green_rim_top;
 253         Color green_rim_bottom;
 254         Color.parse ("#2c4329", out green_rim_top);
 255         Color.parse ("#101d09", out green_rim_bottom);
 256         cr.set_source (create_gradient (0.0, 0.0, 0.0, h, green_rim_top, green_rim_bottom, 1.0, 1.0));
 257         rounded_rect (cr, 0.0, 0.0, w, h);
 258         cr.stroke ();
 259
 260         cr.set_source (create_gradient (0.0, 0.0, 0.0, h, green_rim_top, green_rim_bottom, 0.5, 0.5));
 261         rounded_rect (cr, 0.0, 0.0, w, h);
 262         cr.fill ();
 263     }
 264
 265     public static void reflection(Cairo.Context cr, double w, double h) {
 266         // reflection
 267         cr.new_path ();
 268         cr.move_to (0.0, 0.0);
 269         cr.line_to (0.0, h - 3);
 270         cr.curve_to (100.0, h / 3.0, w - 100, 17, w, 15);
 271         cr.line_to (w, 0.0);
 272         cr.close_path ();
 273         cr.set_source_rgba(0.8, 0.9, 0.1, 0.06);
 274         cr.fill ();
 275     }
 276
 277     public DisplayBase () {
 278
 279         // Enable the events you wish to get notified about.
 280         // The 'expose' event is already enabled by the DrawingArea.
 281         add_events (Gdk.EventMask.BUTTON_PRESS_MASK
 282                   | Gdk.EventMask.BUTTON_RELEASE_MASK
 283                   | Gdk.EventMask.POINTER_MOTION_MASK);
 284     }
 285
 286     /* Widget is asked to draw itself */
 287     public override bool expose_event (Gdk.EventExpose event) {
 288         Color test_color;
 289         Color.parse("#ff0000", out test_color);
 290
 291         event.window.get_size(out _width, out _height);
 292
 293         // Create a Cairo context
 294         var cr = Gdk.cairo_create (this.window);
 295
 296         // Set clipping area in order to avoid unnecessary drawing
 297         cr.rectangle (event.area.x, event.area.y,
 298                       event.area.width, event.area.height);
 299         cr.clip ();
 300
 301         Color matrix_dot_color;
 302         Color.parse("#41403e", out matrix_dot_color);
 303
 304         outer_rim_for_display (cr, 0, 0, _width, _height);
 305
 306         cr.translate (4.5, 3.5);
 307         inner_glass_rim (cr, 0, 0, _width - 8, _height - 9, 2);
 308
 309         cr.translate (3.0, 3.0);
 310         dot_matrix (cr, 0, 0, inner_width, inner_height, shade_color (matrix_dot_color, 0.5));
 311
 312         lcd(cr, inner_width, inner_height);
 313
 314         draw_contents(cr, event);
 315
 316         reflection(cr, inner_width, inner_height);
 317
 318         return false;
 319     }
 320
 321     // Template method
 322     protected abstract bool draw_contents(Cairo.Context cr, Gdk.EventExpose event);
 323 }
 324
 325 } // namespace Prolooks
 326