Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow class name compilation on the basis of character styles (applied in Illustrator) #66

Open
wants to merge 12 commits into
base: master
Choose a base branch
from
68 changes: 45 additions & 23 deletions ai2html.js
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,8 @@ var nytBaseSettings = {
scoop_asset_id: {defaultValue: "", includeInSettingsBlock: true, includeInConfigFile: true, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""},
scoop_username: {defaultValue: "", includeInSettingsBlock: true, includeInConfigFile: true, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""},
scoop_slug: {defaultValue: "", includeInSettingsBlock: true, includeInConfigFile: true, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""},
scoop_external_edit_key: {defaultValue: "", includeInSettingsBlock: true, includeInConfigFile: true, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""}
scoop_external_edit_key: {defaultValue: "", includeInSettingsBlock: true, includeInConfigFile: true, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""},
characterstyles_to_classnames: { defaultValue: "no", includeInSettingsBlock: false, includeInConfigFile: false, useQuoteMarksInConfigFile: false, inputType: "yesNo", possibleValues: "", notes: "Set this to “yes” if you want character styles applied in Illustrator to become paragraph class names." }
};

var defaultBaseSettings = {
Expand Down Expand Up @@ -156,7 +157,8 @@ var defaultBaseSettings = {
scoop_asset_id: {defaultValue: "", includeInSettingsBlock: false, includeInConfigFile: false, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""},
scoop_username: {defaultValue: "", includeInSettingsBlock: false, includeInConfigFile: false, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""},
scoop_slug: {defaultValue: "", includeInSettingsBlock: false, includeInConfigFile: false, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""},
scoop_external_edit_key: {defaultValue: "", includeInSettingsBlock: false, includeInConfigFile: false, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""}
scoop_external_edit_key: {defaultValue: "", includeInSettingsBlock: false, includeInConfigFile: false, useQuoteMarksInConfigFile: false, inputType: "text", possibleValues: "", notes: ""},
characterstyles_to_classnames: { defaultValue: "no", includeInSettingsBlock: false, includeInConfigFile: false, useQuoteMarksInConfigFile: false, inputType: "yesNo", possibleValues: "", notes: "Set this to “yes” if you want character styles applied in Illustrator to become paragraph class names." }
};

// End of settings blocks copied from Google Spreadsheet.
Expand Down Expand Up @@ -1775,10 +1777,15 @@ function convertAiColor(color, opacity) {
function getCharStyle(c) {
var o = convertAiColor(c.fillColor);
var caps = String(c.capitalization);
o.aifont = c.textFont.name;
o.size = Math.round(c.size);
o.capitalization = caps == 'FontCapsOption.NORMALCAPS' ? '' : caps;
o.tracking = c.tracking
if (docSettings.characterstyles_to_classnames == 'yes') {
var firstCharStyleName = c.characterStyles.length > 0 ? c.characterStyles[0].name : '';
o.classNames = firstCharStyleName && firstCharStyleName != '[Normal Character Style]' ? firstCharStyleName : '';
} else {
o.aifont = c.textFont.name;
o.capitalization = caps == 'FontCapsOption.NORMALCAPS' ? '' : caps;
o.tracking = c.tracking
}
return o;
}

Expand Down Expand Up @@ -1894,31 +1901,40 @@ function cleanHtmlTags(str) {
}

function generateParagraphHtml(pData, baseStyle, pStyles, cStyles) {
var html, diff, classname, range, text;
var html, range;
if (pData.text.length === 0) { // empty pg
// TODO: Calculate the height of empty paragraphs and generate
// CSS to preserve this height (not supported by Illustrator API)
return '<p>&nbsp;</p>';
}
diff = objectSubtract(pData.cssStyle, baseStyle);
// Give the pg a class, if it has a different style than the base pg class
if (diff) {
classname = getTextStyleClass(diff, pStyles, 'pstyle');
html = '<p class="' + classname + '">';
} else {
html = '<p>';
}
for (var j=0; j<pData.ranges.length; j++) {
range = pData.ranges[j];
range.text = cleanHtmlTags(range.text);
diff = objectSubtract(range.cssStyle, pData.cssStyle);
if (diff) {
classname = getTextStyleClass(diff, cStyles, 'cstyle');
html += '<span class="' + classname + '">';
if (docSettings.characterstyles_to_classnames == 'yes') {
html = '<p style="text-align: ' + pData.cssStyle['text-align'] + '">';
for (var j = 0; j < pData.ranges.length; j++) {
range = pData.ranges[j];
html += '<span class="' + range.aiStyle.classNames + '">' + cleanText(range.text) + '</span>';
}
html += cleanText(range.text);
} else {
var diff, classname;
diff = objectSubtract(pData.cssStyle, baseStyle);
// Give the pg a class, if it has a different style than the base pg class
if (diff) {
html += '</span>';
classname = getTextStyleClass(diff, pStyles, 'pstyle');
html = '<p class="' + classname + '">';
} else {
html = '<p>';
}
for (var j=0; j<pData.ranges.length; j++) {
range = pData.ranges[j];
range.text = cleanHtmlTags(range.text);
diff = objectSubtract(range.cssStyle, pData.cssStyle);
if (diff) {
classname = getTextStyleClass(diff, cStyles, 'cstyle');
html += '<span class="' + classname + '">';
}
html += cleanText(range.text);
if (diff) {
html += '</span>';
}
}
}
html += '</p>';
Expand Down Expand Up @@ -2127,6 +2143,12 @@ function getBlendMode(obj) {
// convert an object containing parsed AI text styles to an object containing CSS style properties
function convertAiTextStyle(aiStyle) {
var cssStyle = {};
if (docSettings.characterstyles_to_classnames == 'yes') {
if (aiStyle.justification && (tmp = getJustificationCss(aiStyle.justification))) {
cssStyle["text-align"] = tmp;
}
return cssStyle;
}
var fontInfo, tmp;
if (aiStyle.aifont) {
fontInfo = findFontInfo(aiStyle.aifont);
Expand Down