Closes #382, Make font sizes configurable/changeable

Add font size support in external windows

Windows can use the font size pref by including a line like the following in their init script:

Zotero.setFontSize(rootElement);

rootElement should be a XUL element that surrounds all content (but not a <window> or <dialog> or anything that doesn't have a 'style' property)

Windows with treeviews also need to include zotero.css:

<?xml-stylesheet href="chrome://zotero/skin/zotero.css" type="text/css"?>


Utilities should also do this for any GUIs they create.
This commit is contained in:
Dan Stillman 2007-02-12 09:21:08 +00:00
parent d9b4b121b8
commit 00ff46d068
19 changed files with 153 additions and 93 deletions

View file

@ -41,6 +41,8 @@
<script src="selectItemsDialog.js"/>
<script src="addCitationDialog.js"/>
<vbox id="zotero-select-items-container" flex="1">
<hbox flex="1">
<vbox flex="1">
<hbox align="center" pack="end">
@ -137,4 +139,6 @@
</hbox>
</vbox>
</hbox>
</vbox>
</dialog>

View file

@ -13,6 +13,10 @@ var ZoteroAdvancedSearch = new function() {
function onLoad() {
_searchBox = document.getElementById('zotero-search-box');
// Set font size from pref
var sbc = document.getElementById('zotero-search-box-container');
Zotero.setFontSize(sbc);
var io = window.arguments[0];
_searchBox.search = io.dataIn.search;
}

View file

@ -24,6 +24,8 @@
<script src="chrome://global/content/nsDragAndDrop.js"/>
<script src="chrome://global/content/nsTransferable.js"/>
<vbox id="zotero-search-box-container" flex="1">
<hbox>
<zoterosearch id="zotero-search-box" oncommand="ZoteroAdvancedSearch.search()" flex="1"/>
</hbox>
@ -52,6 +54,8 @@
<treechildren alternatingbackground="true"/>
</tree>
</vbox>
<keyset>
<key id="key_close" key="W" modifiers="accel" oncommand="window.close()"/>
</keyset>

View file

@ -39,6 +39,11 @@ var Zotero_File_Interface_Bibliography = new function() {
* loading
*/
function init() {
// Set font size from pref
// Affects bibliography.xul and integrationDocPrefs.xul
var sbc = document.getElementById('zotero-bibliography-container');
Zotero.setFontSize(sbc);
_io = window.arguments[0];
if(_io.wrappedJSObject){
_io = _io.wrappedJSObject;

View file

@ -7,24 +7,25 @@
id="zotero-bibliography"
onload="Zotero_File_Interface_Bibliography.init()">
<script src="include.js"/>
<script src="bibliography.js"/>
<hbox>
<label value="&zotero.bibliography.style.label;" control="style-menu"/>
<menulist id="style-menu">
<menupopup id="style-popup">
</menupopup>
</menulist>
</hbox>
<groupbox>
<caption label="&zotero.bibliography.output.label;"/>
<radiogroup id="output-radio">
<radio id="save-as-rtf" label="&zotero.bibliography.saveAsRTF.label;"/>
<radio id="save-as-html" label="&zotero.bibliography.saveAsHTML.label;"/>
<radio id="copy-to-clipboard" label="&zotero.bibliography.copyToClipboard.label;"/>
<radio id="print" label="&zotero.bibliography.print.label;"/>
</radiogroup>
</groupbox>
<script src="include.js"/>
<script src="bibliography.js"/>
<vbox id="zotero-bibliography-container">
<hbox>
<label value="&zotero.bibliography.style.label;" control="style-menu"/>
<menulist id="style-menu">
<menupopup id="style-popup">
</menupopup>
</menulist>
</hbox>
<groupbox>
<caption label="&zotero.bibliography.output.label;"/>
<radiogroup id="output-radio">
<radio id="save-as-rtf" label="&zotero.bibliography.saveAsRTF.label;"/>
<radio id="save-as-html" label="&zotero.bibliography.saveAsHTML.label;"/>
<radio id="copy-to-clipboard" label="&zotero.bibliography.copyToClipboard.label;"/>
<radio id="print" label="&zotero.bibliography.print.label;"/>
</radiogroup>
</groupbox>
</vbox>
</dialog>

View file

@ -38,6 +38,10 @@ var Zotero_File_Interface_Export = new function() {
* add options to export
*/
function init() {
// Set font size from pref
var sbc = document.getElementById('zotero-export-options-container');
Zotero.setFontSize(sbc);
var addedOptions = new Object();
var translators = window.arguments[0].translators;

View file

@ -7,17 +7,19 @@
ondialogcancel="Zotero_File_Interface_Export.cancel()"
id="zotero-export-options"
onload="Zotero_File_Interface_Export.init()">
<script src="include.js"/>
<script src="exportOptions.js"/>
<hbox>
<label value="&zotero.exportOptions.format.label;" control="format-menu"/>
<menulist id="format-menu" oncommand="Zotero_File_Interface_Export.updateOptions()">
<menupopup id="format-popup">
</menupopup>
</menulist>
</hbox>
<groupbox id="translator-options">
<caption label="&zotero.exportOptions.translatorOptions.label;"/>
</groupbox>
<script src="include.js"/>
<script src="exportOptions.js"/>
<vbox id="zotero-export-options-container" flex="1">
<hbox>
<label value="&zotero.exportOptions.format.label;" control="format-menu"/>
<menulist id="format-menu" oncommand="Zotero_File_Interface_Export.updateOptions()">
<menupopup id="format-popup"/>
</menulist>
</hbox>
<groupbox id="translator-options">
<caption label="&zotero.exportOptions.translatorOptions.label;"/>
</groupbox>
</vbox>
</dialog>

View file

@ -41,6 +41,10 @@ var Zotero_Ingester_Interface_SelectItems = function() {}
* loading
*/
Zotero_Ingester_Interface_SelectItems.init = function() {
// Set font size from pref
var sbc = document.getElementById('zotero-select-items-container');
Zotero.setFontSize(sbc);
this.io = window.arguments[0];
var listbox = document.getElementById("zotero-selectitems-links");

View file

@ -12,12 +12,16 @@
<script src="../include.js"/>
<script src="selectitems.js"/>
<caption label="&zotero.selectitems.intro.label;" id="zotero-selectitems-intro"/>
<box flex="1">
<listbox id="zotero-selectitems-links" flex="1" context="zoteroSelectContext"></listbox>
</box>
<hbox>
<button label="Select All" oncommand="Zotero_Ingester_Interface_SelectItems.selectAll()"/>
<button label="Deselect All" oncommand="Zotero_Ingester_Interface_SelectItems.selectAll(true)"/>
</hbox>
<vbox id="zotero-select-items-container" flex="1">
<caption label="&zotero.selectitems.intro.label;" id="zotero-selectitems-intro"/>
<box flex="1">
<listbox id="zotero-selectitems-links" flex="1" context="zoteroSelectContext"></listbox>
</box>
<hbox>
<button label="Select All" oncommand="Zotero_Ingester_Interface_SelectItems.selectAll()"/>
<button label="Deselect All" oncommand="Zotero_Ingester_Interface_SelectItems.selectAll(true)"/>
</hbox>
</vbox>
</dialog>

View file

@ -7,14 +7,13 @@
id="zotero-bibliography"
onload="Zotero_File_Interface_Bibliography.init()">
<script src="include.js"/>
<script src="bibliography.js"/>
<hbox>
<label value="&zotero.bibliography.style.label;" control="style-menu"/>
<menulist id="style-menu">
<menupopup id="style-popup">
</menupopup>
</menulist>
</hbox>
<script src="include.js"/>
<script src="bibliography.js"/>
<hbox id="zotero-bibliography-container">
<label value="&zotero.bibliography.style.label;" control="style-menu"/>
<menulist id="style-menu">
<menupopup id="style-popup"/>
</menulist>
</hbox>
</dialog>

View file

@ -28,6 +28,9 @@ function onLoad()
noteEditor = document.getElementById('note-editor');
noteEditor.focus();
// Set font size from pref
Zotero.setFontSize(noteEditor);
var params = new Array();
var b = document.location.href.substr(document.location.href.indexOf('?')+1).split('&');
for(var i = 0; i < b.length; i++)

View file

@ -116,19 +116,7 @@ var ZoteroPane = new function()
document.getElementById('zotero-tb-fullscreen').setAttribute('zoterotop','true');
}
// Font size
document.getElementById('zotero-pane').style.fontSize = Zotero.Prefs.get('fontSize') + 'em';
var size = Zotero.Prefs.get('fontSize');
if (size <= 1) {
size = 'small';
}
else if (size <= 1.25) {
size = 'medium';
}
else {
size = 'large';
}
document.getElementById('zotero-pane').setAttribute('fontSize', size);
Zotero.setFontSize(document.getElementById('zotero-pane'))
//Initialize collections view
this.collectionsView = new Zotero.CollectionTreeView();
@ -171,6 +159,7 @@ var ZoteroPane = new function()
Zotero.Keys.windowInit(document);
}
/*
* Called when the window closes
*/

View file

@ -4,6 +4,10 @@ var io;
function doLoad()
{
// Set font size from pref
var sbc = document.getElementById('zotero-search-box-container');
Zotero.setFontSize(sbc);
io = window.arguments[0];
document.getElementById('search-box').search = io.dataIn.search;

View file

@ -19,9 +19,11 @@
<script src="include.js"/>
<script src="searchDialog.js"/>
<hbox align="center">
<label value="&zotero.search.name;"/>
<textbox id="search-name" flex="1"/>
</hbox>
<zoterosearch id="search-box" flex="1"/>
<vbox id="zotero-search-box-container" flex="1">
<hbox align="center">
<label value="&zotero.search.name;"/>
<textbox id="search-name" flex="1"/>
</hbox>
<zoterosearch id="search-box" flex="1"/>
</vbox>
</dialog>

View file

@ -31,11 +31,15 @@ var io;
*/
function doLoad()
{
// Set font size from pref
var sbc = document.getElementById('zotero-select-items-container');
Zotero.setFontSize(sbc);
io = window.arguments[0];
collectionsView = new Zotero.CollectionTreeView();
document.getElementById('zotero-collections-tree').view = collectionsView;
// move to center of screen
window.sizeToContent();
window.moveTo(

View file

@ -40,6 +40,8 @@
<script src="include.js"/>
<script src="selectItemsDialog.js"/>
<vbox id="zotero-select-items-container" flex="1">
<hbox align="center" pack="end">
<label value="&zotero.toolbar.search.label;" control="zotero-tb-search"/>
<textbox id="zotero-tb-search" type="timed" timeout="250" oncommand="onSearch()" dir="reverse" onkeypress="if(event.keyCode == event.DOM_VK_ESCAPE) { this.value = ''; this.doCommand('cmd_zotero_search'); return false; }">
@ -88,4 +90,6 @@
<treechildren/>
</tree>
</hbox>
</vbox>
</dialog>

View file

@ -49,6 +49,7 @@ var Zotero = new function(){
this.varDump = varDump;
this.safeDebug = safeDebug;
this.getString = getString;
this.setFontSize = setFontSize;
this.flattenArguments = flattenArguments;
this.getAncestorByTagName = getAncestorByTagName;
this.join = join;
@ -319,6 +320,27 @@ var Zotero = new function(){
}
/*
* Sets font size based on prefs -- intended for use on root element
* (zotero-pane, note window, etc.)
*/
function setFontSize(rootElement) {
var size = Zotero.Prefs.get('fontSize');
rootElement.style.fontSize = size + 'em';
if (size <= 1) {
size = 'small';
}
else if (size <= 1.25) {
size = 'medium';
}
else {
size = 'large';
}
// Custom attribute -- allows for additional customizations in zotero.css
rootElement.setAttribute('zoteroFontSize', size);
}
/*
* Flattens mixed arrays/values in a passed _arguments_ object and returns
* an array of values -- allows for functions to accept both arrays of

View file

@ -1,26 +1,3 @@
/* Font sizes */
#zotero-pane[fontSize=medium] #zotero-tb-search, #zotero-pane[fontSize=large] #zotero-tb-search,
#zotero-pane[fontSize=medium] zoterotagselector textbox, #zotero-pane[fontSize=large] zoterotagselector textbox
{
font-size: 1em !important;
}
#zotero-pane[fontSize=medium] treechildren::-moz-tree-row
{
height: 1.5em;
}
#zotero-pane[fontSize=large] treechildren::-moz-tree-row
{
height: 1.5em;
}
#zotero-pane[fontSize=large] .treecol-text
{
margin:0;
padding:0;
}
#zotero-status-bar-icon
{
width: 55px;

View file

@ -1,3 +1,27 @@
/* Font sizes */
*[zoteroFontSize=medium] #zotero-tb-search, *[zoteroFontSize=large] #zotero-tb-search,
*[zoteroFontSize=medium] zoterotagselector textbox, *[zoteroFontSize=large] zoterotagselector textbox
{
font-size: 1em !important;
}
*[zoteroFontSize=medium] treechildren::-moz-tree-row
{
height: 1.5em;
}
*[zoteroFontSize=large] treechildren::-moz-tree-row
{
height: 1.5em;
}
*[zoteroFontSize=large] .treecol-text
{
margin:0;
padding:0;
}
#zotero-toolbar-button
{
list-style-image: url('chrome://zotero/skin/zotero-z-24px.png');