[bknr-cvs] hans changed trunk/

BKNR Commits bknr at bknr.net
Sat Aug 2 22:32:42 UTC 2008


Revision: 3723
Author: hans
URL: http://bknr.net/trac/changeset/3723

Make news work better.
Add news article display (not yet finished).
Fix action box show/hide animation.

U   trunk/bknr/web/src/web/handlers.lisp
U   trunk/projects/quickhoney/src/handlers.lisp
U   trunk/projects/quickhoney/src/imageproc.lisp
U   trunk/projects/quickhoney/website/static/javascript.js
U   trunk/projects/quickhoney/website/static/styles.css
U   trunk/projects/quickhoney/website/templates/index.xml

Modified: trunk/bknr/web/src/web/handlers.lisp
===================================================================
--- trunk/bknr/web/src/web/handlers.lisp	2008-08-01 15:43:33 UTC (rev 3722)
+++ trunk/bknr/web/src/web/handlers.lisp	2008-08-02 22:32:42 UTC (rev 3723)
@@ -3,7 +3,6 @@
 (enable-interpol-syntax)
 
 (defvar *bknr-debug* nil)
-(defvar *website* nil)
 
 (defvar *website-modules* (make-hash-table :test #'equal))
 

Modified: trunk/projects/quickhoney/src/handlers.lisp
===================================================================
--- trunk/projects/quickhoney/src/handlers.lisp	2008-08-01 15:43:33 UTC (rev 3722)
+++ trunk/projects/quickhoney/src/handlers.lisp	2008-08-02 22:32:42 UTC (rev 3723)
@@ -444,10 +444,13 @@
     (encode-object-element "date" (format-date-time (blob-timestamp image) :vms-style t :show-time nil))
     (encode-object-element "name" (store-image-name image)))
   (:method ((image quickhoney-image))
-    (let ((vectorp (member :vector (store-image-keywords image))))
-      (encode-object-element "category" (if vectorp "vector" "pixel"))
-      (encode-object-element "subcategory" "unknown")))
+    (encode-object-element "type" "upload")
+    (with-object-element ("keywords")
+      (with-json-array ()
+        (dolist (keyword (store-image-keywords image))
+          (encode-array-element (string-downcase (symbol-name keyword)))))))
   (:method ((item quickhoney-news-item))
+    (encode-object-element "type" "news")
     (encode-object-element "title" (quickhoney-news-item-title item))
     (encode-object-element "text" (quickhoney-news-item-text item))))
 

Modified: trunk/projects/quickhoney/src/imageproc.lisp
===================================================================
--- trunk/projects/quickhoney/src/imageproc.lisp	2008-08-01 15:43:33 UTC (rev 3722)
+++ trunk/projects/quickhoney/src/imageproc.lisp	2008-08-02 22:32:42 UTC (rev 3723)
@@ -30,25 +30,27 @@
     (nreverse coords)))
 
 (defun corner-image (&key (image *default-image*)
-                     (radius (/ (max (image-width image) (image-height image)) 40)))
+                          (radius (/ (max (image-width image) (image-height image)) 40))
+                          corner-color)
   (with-default-image (image)
-    (setf (save-alpha-p) t)
-    (let ((transparent-color (if (true-color-p) #x7f000000
+    (unless corner-color
+      (setf (save-alpha-p) t
+            corner-color (if (true-color-p) #x7f000000
                                  (or (transparent-color)
                                      (allocate-color 255 255 255 :alpha 127)
-                                     (error "can't allocate transparent color for button")))))
-      (setf (transparent-color) transparent-color)
-      (let ((coords (corner-cutout-coords (image-width) (image-height) radius)))
-        (destructuring-bind (x-tx y-tx) (car coords)
-          (do-rows (y)
-            (do-pixels-in-row (x)
-              (when (and (eql x x-tx)
-                         (eql y y-tx))
-                (setf (raw-pixel) transparent-color)
-                (when (cdr coords)
-                  (setf coords (cdr coords)
-                        x-tx (caar coords)
-                        y-tx (cadar coords)))))))))))
+                                     (error "can't allocate transparent color for button")))
+            (transparent-color) corner-color))
+    (let ((coords (corner-cutout-coords (image-width) (image-height) radius)))
+      (destructuring-bind (x-tx y-tx) (car coords)
+        (do-rows (y)
+          (do-pixels-in-row (x)
+            (when (and (eql x x-tx)
+                       (eql y y-tx))
+              (setf (raw-pixel) corner-color)
+              (when (cdr coords)
+                (setf coords (cdr coords)
+                      x-tx (caar coords)
+                      y-tx (cadar coords))))))))))
 
 (define-imageproc-handler cutout-button (input-image &optional keyword (background-color "ffffff") (button-size "208") (radius "8"))
   (declare (ignore background-color))
@@ -87,4 +89,24 @@
 		  (round (/ (- (image-height input-image) height) 2))
 		  0 0
 		  width height)
-      thumbnail-image)))
\ No newline at end of file
+      thumbnail-image)))
+
+(defparameter +news-image-width+ 428
+  "Width of news images")
+(defparameter +news-image-corner-radius+ 8
+  "Corner radius for news images")
+
+(define-imageproc-handler news-article-cutout (input-image)
+  (let* ((image-height (floor (* +news-image-width+
+                                 (/ (image-height input-image) (image-width input-image)))))
+         (output-image (create-image +news-image-width+ image-height t)))
+    (copy-image input-image output-image
+                0 0
+                0 0
+                +news-image-width+ image-height
+                :resize t :resample t
+                :dest-width +news-image-width+ :dest-height image-height)
+    (corner-image :image output-image
+                  :radius +news-image-corner-radius+
+                  :corner-color (allocate-color 255 255 255 :image output-image))
+    output-image))
\ No newline at end of file

Modified: trunk/projects/quickhoney/website/static/javascript.js
===================================================================
--- trunk/projects/quickhoney/website/static/javascript.js	2008-08-01 15:43:33 UTC (rev 3722)
+++ trunk/projects/quickhoney/website/static/javascript.js	2008-08-02 22:32:42 UTC (rev 3723)
@@ -1,5 +1,9 @@
 // -*- Java -*-
 
+/* configuration */
+
+var max_news_items = 50;        /* maximum number of news items to display */
+
 /* directory definitions */
 
 var directory_button = [];
@@ -223,7 +227,8 @@
     var year = this.href.match(/#news\/(\d+)/)[1];
     map(function (element) {
             if (element.href) {
-                ((element.href.match(/#news\/(\d+)/)[1] == year) ? addElementClass : removeElementClass)(element, 'active');
+                ((element.href.match(/#news\/(\d+)/)[1] == year) ? addElementClass : removeElementClass)
+                    (element, 'active');
             }
         }, this.parentNode.childNodes);
     return true;
@@ -236,22 +241,62 @@
     return true;
 }
 
+function intersection(a, b)
+{
+    var result = [];
+    map(function (value) {
+            if (findValue(b, value) != -1) {
+                result.push(value);
+            }
+        }, a);
+    return result;
+}
+
+function make_upload_item(item)
+{
+    item.category = (findValue(item.keywords, 'pixel') == -1) ? 'vector' : 'pixel';
+    item.subcategory = intersection(item.keywords, directory_button[item.category])[0];
+    var color = (item.category == 'pixel') ? 'ff00ff' : '00ccff';
+    var image_link = '/index#' + item.category + '/' + item.subcategory + '/' + item.name;
+    return DIV({ 'class': 'newsentry autonews news_' + item.category },
+               A({ href: image_link },
+                 IMG({ src: "/image/" + item.name + '/cutout-button,,' + color + ',98,4'})),
+               DIV(null,
+                   H1(null, item.name),
+                   item.date, ' by ', item.owner, ' | ',
+                   A({ href: image_link }, 'permalink'),
+                   BR(),
+                   item.description));
+}
+
+function make_news_item(item)
+{
+    return DIV({ 'class': 'newsentry' },
+               IMG({ src: "/image/" + item.name + '/news-article-cutout'}),
+               DIV(null,
+                   H1(null, item.title),
+                   item.date, ' by ', item.owner, ' | ',
+                   A({ href: '#' }, 'permalink'),
+                   BR(),
+                   item.text));
+}
+
 function load_news(data)
 {
-    log('load news: ' + data.items.length);
-    replaceChildNodes('newsentries',
-                      map(function (item) {
-                              var color = (item.category == 'pixel') ? 'ff00ff' : '00ccff';
-                              return [ DIV({ 'class': 'newsentry autonews news_' + item.category },
-                                         IMG({ src: "/image/" + item.name + '/cutout-button,,' + color + ',98,4'}),
-                                         DIV(null,
-                                             H1(null, item.name),
-                                             item.date, ' by ', item.owner, ' | ',
-                                             A({ href: '/index#' + item.category + '/' + item.subcategory + '/' + item.image_name }, 'permalink'),
-                                             BR(),
-                                             item.description)),
-                                       DIV({ 'class': 'news_sep' }) ];
-                          }, data.items));
+    try {
+        if (data.items.length > max_news_items) {
+            data.items.length = max_news_items;
+        }
+        replaceChildNodes('newsentries',
+                          map(function (item) {
+                                  return [ ((item.type == 'upload') ? make_upload_item : make_news_item)(item),
+                                           DIV({ 'class': 'news_sep' }) ];
+                              }, data.items));
+        $('archive-navigation').style.visibility = 'inherit';
+    }
+    catch (e) {
+        log('error displaying news: ' + e);
+    }
 }
 
 function load_news_archive(data)
@@ -261,7 +306,6 @@
             alert('no archive data found');
         }
         var currentYear;
-        var active = true;
         replaceChildNodes('archive-navigation',
                           SPAN({ 'class': 'title' }, 'Archive'), BR(),
                           map(function (entry) {
@@ -269,15 +313,12 @@
                                   var month = entry[1];
                                   var result = [];
                                   if (year != currentYear) {
-                                      if (currentYear) {
-                                          active = false;
-                                      }
                                       currentYear = year;
                                       var link = A({ href: '#news/' + year, 'class': 'year' }, year, BR());
                                       link.onclick = select_archive_year;
                                       result.push(link);
                                   }
-                                  var link = A({ href: '#news/' + year + '/' + month, 'class': 'month ' + (active ? ' active' : '')},
+                                  var link = A({ href: '#news/' + year + '/' + month, 'class': 'month '},
                                                month_names[month - 1], BR());
                                   link.onclick = select_archive_month;
                                   result.push(link);
@@ -460,6 +501,8 @@
 	       '30be01',
 	       function() {
 		   footer_hide();
+                   replaceChildNodes('newsentries');
+                   $('archive-navigation').style.visibility = 'hidden';
                    loadJSONDoc('/json-news-archive/quickhoney').addCallbacks(load_news_archive, alert);
                    loadJSONDoc('/json-news/quickhoney').addCallbacks(load_news, alert);
 	       });
@@ -529,6 +572,8 @@
     $('menu').className = pagename;
     document.body.className = pagename;
 
+    overlay_remove();
+
     // Update globals
     current_directory = pagename;
     current_subdirectory = null;
@@ -826,6 +871,7 @@
     var current_page_index = position_to_page(query_position);
 
     make_pages_navbar();
+    overlay_remove();
 
     var page = query_result_pages[current_page_index];
     var thumbnail_html = '';
@@ -885,6 +931,7 @@
     debug('display_image index ' + index);
 
     footer_hide();
+    overlay_remove();
     display_path();
     make_images_navbar();
     make_image_action_buttons();
@@ -998,7 +1045,7 @@
                   { method: 'POST',
                     headers: {"Content-Type":"application/x-www-form-urlencoded"},
                     sendContent: queryString({ from: $('hey_from').value, text: $('hey_text').value }) })
-        .addCallback(hide_overlay);
+        .addCallback(overlay_remove);
     make_overlay('send-comment', 'Sending your comment', 300);
     return false;
 }
@@ -1146,8 +1193,9 @@
     document.location.href = document.location.href.replace(/\/image-browse.*/, "index#");
 }
 
-function hide_overlay()
+function overlay_remove()
 {
+    replaceChildNodes('overlay');
     $('overlay').style.visibility = 'hidden';
     return false;
 }
@@ -1168,7 +1216,7 @@
                                   id: 'close', width: 13, height: 13}));
     overlay.style.width = width + 'px';
     $('close').style.left = (width - 23) + 'px';
-    $('close').onclick = hide_overlay;
+    $('close').onclick = overlay_remove;
     var elements = [];
     for (var i = 3; i < arguments.length; i++) {
         elements.push(arguments[i]);
@@ -1368,13 +1416,15 @@
         appendChildNodes('image_action_buttons', IMG({ id: 'buy-top', src: recolored_image_path('buy-top'), width: 90, height: 1}));
     }
     appendChildNodes('image_action_buttons', IMG({ id: 'buy-right-line', src: recolored_image_path('buy-right-line'), width: 1, height: height}));
-    var animator = new YAHOO.util.Anim('image_action_buttons', {}, .3,
+    var animator = new YAHOO.util.Anim('image_action_buttons', {}, 0.3,
                                        YAHOO.util.Easing.easeBoth);
     $('image_action_buttons').onmouseover = function () {
+        animator.stop();
         animator.attributes = { width: { to: 127 }, left: { to: 518 } };
         animator.animate();
     }
     $('image_action_buttons').onmouseout = function () {
+        animator.stop();
         animator.attributes = { width: { to: 60 }, left: { to: 584 } };
         animator.animate();
     }

Modified: trunk/projects/quickhoney/website/static/styles.css
===================================================================
--- trunk/projects/quickhoney/website/static/styles.css	2008-08-01 15:43:33 UTC (rev 3722)
+++ trunk/projects/quickhoney/website/static/styles.css	2008-08-02 22:32:42 UTC (rev 3723)
@@ -431,10 +431,17 @@
 
 .newsentry {
 	width: 428px;
-	height: 108px;
 	position: relative;
 }
 
+.autonews {
+	height: 108px;
+}
+
+.autonews img {
+	padding: 0px;
+}
+
 .newsentry img {
 	position: absolute;
 	top: 5px; left: 5px;
@@ -632,4 +639,4 @@
 .archive span.title, .archive a.year { font-size: 1.5em; }
 .archive a.month.active { display: block; }
 .archive a.month { display: none; }
-.archive { padding-left: 1em; }
\ No newline at end of file
+.archive { padding-left: 1em; }

Modified: trunk/projects/quickhoney/website/templates/index.xml
===================================================================
--- trunk/projects/quickhoney/website/templates/index.xml	2008-08-01 15:43:33 UTC (rev 3722)
+++ trunk/projects/quickhoney/website/templates/index.xml	2008-08-02 22:32:42 UTC (rev 3723)
@@ -134,23 +134,6 @@
           <tbody>
             <tr>
               <td valign="top" id="newsentries">
-                <div class="newsentry news_vector autonews">
-                  <img src="/image/TSG_Platforms_web/cutout-button,,00ccff,98,4"/>
-                  <div>
-                    <h1>Jan and Ella</h1>
-                    March 8th, 2008 by Peter | <a href="foo">permalink</a><br/>
-                    description
-                  </div>
-                </div>
-                <div class="news_sep"> </div>
-                <br/>
-                <div class="newsentry news_pixel autonews">
-                  <img src="/image/TSG_Platforms_web/cutout-button,,00ccff,98,4"/>
-                  <div>
-                    March 8th, 2008 by Peter | <a href="foo">permalink</a><br/>
-                    description
-                  </div>
-                </div>
               </td>
               <td class="archive" id="archive-navigation" valign="top">
               </td>




More information about the Bknr-cvs mailing list