[dw-free] Separate out CSS and JavaScript on manage/circle/edit
[commit: http://hg.dwscoalition.org/dw-free/rev/33c36f472705]
http://bugs.dwscoalition.org/show_bug.cgi?id=3838
Refactor out CSS and JS into their own files for easier tweaking later.
Patch by
dunvi.
Files modified:
http://bugs.dwscoalition.org/show_bug.cgi?id=3838
Refactor out CSS and JS into their own files for easier tweaking later.
Patch by
![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png)
Files modified:
- htdocs/js/circle-edit.js
- htdocs/manage/circle/edit.bml
- htdocs/stc/circle-edit.css
-------------------------------------------------------------------------------- diff -r 0ea254848bdd -r 33c36f472705 htdocs/js/circle-edit.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/htdocs/js/circle-edit.js Mon Jul 16 21:18:40 2012 -0700 @@ -0,0 +1,60 @@ +previewOn = 0; +lastFriend = 0; + +function setFriend (curfriend) +{ + lastFriend = curfriend; +} + +function togglePreview() +{ + if (previewOn==0 || winPreview.closed) { + winPreview = window.open("", "preview", "toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,copyhistory=0,width=400,height=270"); + previewOn = 1; + updatePreview(); + } else { + winPreview.close(); + previewOn = 0; + } +} + +function updatePreview () { + + if (previewOn == 0 || winPreview.closed) { return; } + + frm = document.editFriends; + + dropdown = frm["editfriend_add_"+lastFriend+"_fg"] + if (!dropdown) { + winPreview.close(); + previewOn = 0; + alert('You have not added any friends to preview'); + return; + } + fg_color = dropdown.options[dropdown.selectedIndex].value; + fg_color_text = dropdown.options[dropdown.selectedIndex].text; + + dropdown = frm["editfriend_add_"+lastFriend+"_bg"] + bg_color = dropdown.options[dropdown.selectedIndex].value; + bg_color_text = dropdown.options[dropdown.selectedIndex].text; + + user_name = frm["editfriend_add_"+lastFriend+"_user"].value; + if (user_name.length==0) { user_name = "username"; } + + d = winPreview.document; + d.open(); + d.write("<html><head><title>$ejs{'mrcolor'}</title></head><body bgcolor='#ffffff' text='#000000'>"); + d.write("<b><font face='Trebuchet MS, Arial, Helvetica' size='4' color='#000066'><i>$ejs{'viewer'}</i></font></b><hr />"); + d.write("<br /><table summary='' width='350' align='center' cellpadding='5'><tr valign='middle'>"); + d.write("<td width='80%'><b><font face='Arial, Helvetica' size='2'>"); + d.write("$ejs{'textcolor'} <font color='#000066'>" + fg_color_text); + d.write("</font></b><br /></td><td width='20%' bgcolor=" + fg_color + "> </td>"); + d.write("</tr><tr><td width='80%'><b><font face='Arial, Helvetica' size='2'>"); + d.write("$ejs{'bgcolor'} <font color='#000066'>" + bg_color_text + ""); + d.write("</font></b><br></td><td width='20%' bgcolor=" + bg_color + "> </td>"); + d.write("</tr><tr><td><br /></tr><tr><td colspan='3' bgcolor=" + bg_color + "><font color=" + fg_color + ">"); + d.write("<b>" + user_name + "</b></td></tr></table><br />"); + d.write("<hr><form><div align='center'><input type='button' value='$ejs{'btn.close'}' onClick='self.close();'></div></form>"); + d.write("</body></html>"); + d.close(); +} diff -r 0ea254848bdd -r 33c36f472705 htdocs/manage/circle/edit.bml --- a/htdocs/manage/circle/edit.bml Mon Jul 16 21:04:03 2012 -0700 +++ b/htdocs/manage/circle/edit.bml Mon Jul 16 21:18:40 2012 -0700 @@ -492,115 +492,19 @@ <=body head<= -<style type="text/css"> -.editfriends { - margin-bottom: 10px; -} -.editfriends tr:hover { - background-color: #d1ced2; -} -.editfriends tr.header:hover { - background-color: transparent; -} -.editfriends td, .editfriends th, -#addfriends td, #addfriends th { - padding: 5px; - text-align: center; - border: 1px solid #000; -} -#addfriends td td, #addfriends th th { - padding: 0; - border: 0; -} -.editfriends td { - text-align: left; - border: 1px solid #000; -} -.editfriends caption { - font-weight: bold; -} -.editfriendsframe { - text-align: center; - padding: 1em; -} -.editfriendsframe table, .editfriendsframe caption { - margin: 0 auto; -} -</style> + +<?_c CSS removed from here - saved as stc/circle-edit.css _c?> <?_code { use strict; - + + LJ::need_res( 'stc/circle-edit.css' ); + my %ejs = map { $_, LJ::ejs($ML{".$_"}) } qw(mrcolor viewer textcolor bgcolor btn.close); - return qq { -<script language="JavaScript"><!-- - -previewOn = 0; -lastFriend = 0; - -function setFriend (curfriend) -{ - lastFriend = curfriend; -} - -function togglePreview() -{ - if (previewOn==0 || winPreview.closed) { - winPreview = window.open("", "preview", "toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,copyhistory=0,width=400,height=270"); - previewOn = 1; - updatePreview(); - } else { - winPreview.close(); - previewOn = 0; - } -} - -function updatePreview () { - -if (previewOn == 0 || winPreview.closed) { return; } - -frm = document.editFriends; - -dropdown = frm["editfriend_add_"+lastFriend+"_fg"] -if (!dropdown) { - winPreview.close(); - previewOn = 0; - alert('You have not added any friends to preview'); - return; -} -fg_color = dropdown.options[dropdown.selectedIndex].value; -fg_color_text = dropdown.options[dropdown.selectedIndex].text; - -dropdown = frm["editfriend_add_"+lastFriend+"_bg"] -bg_color = dropdown.options[dropdown.selectedIndex].value; -bg_color_text = dropdown.options[dropdown.selectedIndex].text; - -user_name = frm["editfriend_add_"+lastFriend+"_user"].value; -if (user_name.length==0) { user_name = "username"; } - -d = winPreview.document; -d.open(); -d.write("<html><head><title>$ejs{'mrcolor'}</title></head><body bgcolor='#ffffff' text='#000000'>"); -d.write("<b><font face='Trebuchet MS, Arial, Helvetica' size='4' color='#000066'><i>$ejs{'viewer'}</i></font></b><hr />"); -d.write("<br /><table summary='' width='350' align='center' cellpadding='5'><tr valign='middle'>"); -d.write("<td width='80%'><b><font face='Arial, Helvetica' size='2'>"); -d.write("$ejs{'textcolor'} <font color='#000066'>" + fg_color_text); -d.write("</font></b><br /></td><td width='20%' bgcolor=" + fg_color + "> </td>"); -d.write("</tr><tr><td width='80%'><b><font face='Arial, Helvetica' size='2'>"); -d.write("$ejs{'bgcolor'} <font color='#000066'>" + bg_color_text + ""); -d.write("</font></b><br></td><td width='20%' bgcolor=" + bg_color + "> </td>"); -d.write("</tr><tr><td><br /></tr><tr><td colspan='3' bgcolor=" + bg_color + "><font color=" + fg_color + ">"); -d.write("<b>" + user_name + "</b></td></tr></table><br />"); -d.write("<hr><form><div align='center'><input type='button' value='$ejs{'btn.close'}' onClick='self.close();'></div></form>"); -d.write("</body></html>"); -d.close(); - } -// --> -</script> -}; # end qq{ } - + LJ::need_res( 'js/circle-edit.js' ); + } _code?> <=head diff -r 0ea254848bdd -r 33c36f472705 htdocs/stc/circle-edit.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/htdocs/stc/circle-edit.css Mon Jul 16 21:18:40 2012 -0700 @@ -0,0 +1,33 @@ +.editfriends { + margin-bottom: 10px; +} +.editfriends tr:hover { + background-color: #d1ced2; +} +.editfriends tr.header:hover { + background-color: transparent; +} +.editfriends td, .editfriends th, +#addfriends td, #addfriends th { + padding: 5px; + text-align: center; + border: 1px solid #000; +} +#addfriends td td, #addfriends th th { + padding: 0; + border: 0; +} +.editfriends td { + text-align: left; + border: 1px solid #000; +} +.editfriends caption { + font-weight: bold; +} +.editfriendsframe { + text-align: center; + padding: 1em; +} +.editfriendsframe table, .editfriendsframe caption { + margin: 0 auto; +} --------------------------------------------------------------------------------