Савинцев Егор 🚶 (savintsev_egor) wrote in changelog,
Савинцев Егор 🚶
savintsev_egor
changelog

[livejournal] r21198: LJSUP-10691: Image placeholders in comme...

Committer: esavintcev
LJSUP-10691: Image placeholders in comments
U   trunk/bin/upgrading/en.dat
U   trunk/cgi-bin/cleanhtml.pl
U   trunk/cgi-bin/weblib.pl
U   trunk/htdocs/stc/lj_base.css
Modified: trunk/bin/upgrading/en.dat
===================================================================
--- trunk/bin/upgrading/en.dat	2012-02-15 14:17:45 UTC (rev 21197)
+++ trunk/bin/upgrading/en.dat	2012-02-16 12:55:12 UTC (rev 21198)
@@ -3554,6 +3554,14 @@
 
 lynx.nav.update=Update Journal
 
+mediaplaceholder.link=Link
+
+mediaplaceholder.loading=Loading...
+
+mediaplaceholder.viewimage=View image
+
+mediaplaceholder.viewvideo=Video here
+
 ml_filter_by_poster|staleness=1
 ml_filter_by_poster=Filter community by poster
 

Modified: trunk/cgi-bin/cleanhtml.pl
===================================================================
--- trunk/cgi-bin/cleanhtml.pl	2012-02-15 14:17:45 UTC (rev 21197)
+++ trunk/cgi-bin/cleanhtml.pl	2012-02-16 12:55:12 UTC (rev 21198)
@@ -1149,9 +1149,14 @@
                     }
 
                     if ($img_bad) {
-                        $newdata .= qq~<a class="ljimgplaceholder" extern_href="$href_b_link" href="~ .
+                        $newdata .= qq~<a class="b-mediaplaceholder b-mediaplaceholder-photo" extern_href="$href_b_link" href="~ .
                             LJ::ehtml($hash->{'src'}) . '">' .
-                            LJ::img('placeholder') . '</a>';
+                            '<span class="b-mediaplaceholder-inner">' .
+                            '<i class="b-mediaplaceholder-pic"></i>' .
+                            '<span class="b-mediaplaceholder-label b-mediaplaceholder-view">' . LJ::Lang::ml("mediaplaceholder.viewimage") . '</span>'.
+                            '<span class="b-mediaplaceholder-label b-mediaplaceholder-loading">' . LJ::Lang::ml("mediaplaceholder.loading") . '</span>'.
+                            '</span>' .
+                            '</a>';
                         $alt_output = 1;
                         $opencount{"img"}++;
                     }

Modified: trunk/cgi-bin/weblib.pl
===================================================================
--- trunk/cgi-bin/weblib.pl	2012-02-15 14:17:45 UTC (rev 21197)
+++ trunk/cgi-bin/weblib.pl	2012-02-16 12:55:12 UTC (rev 21198)
@@ -2037,11 +2037,13 @@
     $height -= 2;
 
     return qq {
-            <span class="LJ_Placeholder_Container" style="width: ${width}px; height: ${height}px;">
-                <a href="$link" onclick="return LiveJournal.placeholderClick(this, '$placeholder_html')">
-                    <img src="$img" class="LJ_Placeholder" title="Click to show embedded content" alt="" />
-                </a>
-            </span>
+            <a class="b-mediaplaceholder b-mediaplaceholder-video" href="$link" onclick="return LiveJournal.placeholderClick(this, '$placeholder_html')">
+                <span class="b-mediaplaceholder-inner">
+                    <i class="b-mediaplaceholder-pic"></i>
+                    <span class="b-mediaplaceholder-label b-mediaplaceholder-view">} . LJ::Lang::ml("mediaplaceholder.viewvideo") . qq{</span>
+                    <span class="b-mediaplaceholder-label b-mediaplaceholder-loading">} . LJ::Lang::ml("mediaplaceholder.loading") . qq{</span>
+                </span>
+            </a>
         };
 }
 

Modified: trunk/htdocs/stc/lj_base.css
===================================================================
--- trunk/htdocs/stc/lj_base.css	2012-02-15 14:17:45 UTC (rev 21197)
+++ trunk/htdocs/stc/lj_base.css	2012-02-16 12:55:12 UTC (rev 21198)
@@ -3732,6 +3732,8 @@
 	font-size: 9px;
 	}
 
+
+
 /* LinkBar */
 .b-linkbar {
 	display: inline-block;
@@ -3760,3 +3762,89 @@
 		.b-linkbar .b-controls {
 			font: 10px/1 Arial,sans-serif;
 			}
+
+
+
+/* Image & Video Placeholder */
+BODY .b-mediaplaceholder:link,
+BODY .b-mediaplaceholder:visited,
+BODY .b-mediaplaceholder:hover,
+BODY .b-mediaplaceholder:active,
+BODY .b-mediaplaceholder:focus {
+	position: relative;
+	top: auto;
+	left: auto;
+	display: inline-block;
+	width: auto;
+	height: 22px;
+	min-width: 100px;
+	margin: 0;
+	padding: 10px 10px 0 30px;
+	background: rgb(0,0,0);
+	background: rgba(0,0,0,0.35);
+	-moz-border-radius: 5px;
+	border-radius: 5px;
+	border: 1px solid rgb(255,255,255) !important;
+	border: 1px solid rgba(255,255,255,0.3) !important;
+	font: 12px/1 Arial,sans-serif;
+	text-align: left;
+	text-decoration: none !important;
+	text-shadow: none;
+	color: #FFF !important;
+	cursor: pointer;
+	}
+	.b-mediaplaceholder-inner {
+		position: relative;
+		top: auto;
+		left: auto;
+		display: inline-block;
+		width: auto;
+		height: auto;
+		margin: 0;
+		padding: 0 0 0 20px;
+		}
+		.b-mediaplaceholder-pic {
+			overflow: hidden;
+			position: absolute;
+			top: 0;
+			left: 0;
+			display: block;
+			margin: 0;
+			padding: 0;
+			background: url(/img/mediaplaceholder.png?v=1) no-repeat 0 0;
+			font: 0/0 serif;
+			}
+		.b-mediaplaceholder-photo .b-mediaplaceholder-pic {
+			width: 13px;
+			height: 11px;
+			background-position: 0 -29px;
+			}
+		.b-mediaplaceholder-video .b-mediaplaceholder-pic {
+			width: 12px;
+			height: 13px;
+			background-position: 0 -16px;
+			}
+		.b-mediaplaceholder-processing .b-mediaplaceholder-pic {
+			top: 50%;
+			width: 11px;
+			height: 3px;
+			margin-top: -2px;
+			background: url(/img/preloader-s.gif?v=1) no-repeat 0 0;
+			}
+		.b-mediaplaceholder-label {
+			display: none;
+			position: static;
+			top: auto;
+			left: auto;
+			width: auto;
+			height: auto;
+			margin: 0;
+			padding: 0;
+			}
+		.b-mediaplaceholder .b-mediaplaceholder-view,
+		.b-mediaplaceholder-processing .b-mediaplaceholder-loading {
+			display: inline;
+			}
+		.b-mediaplaceholder-processing .b-mediaplaceholder-view {
+			display: none;
+			}

Tags: css, dat, esavintcev, livejournal, pl, savintsev_egor
Subscribe
  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    default userpic

    Your reply will be screened

    Your IP address will be recorded 

  • 0 comments