prolooks/Display.vala

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