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.

Sign up for GitHub

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

Jump to bottom

Made some initial changes to test new styles #522

Merged
merged 7 commits into from Nov 20, 2015
Merged

Made some initial changes to test new styles #522

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
88b2dc2
Made some initial changes to test new styles
halindrome Nov 12, 2015
0ab38fb
Changed wrapper on toc back to section
halindrome Nov 12, 2015
56a64e9
Fixed the logo background.
halindrome Nov 12, 2015
98290f1
Ensured aria role for toc is added to nav
halindrome Nov 13, 2015
fa05da5
Added TOC link at bottom of document
halindrome Nov 13, 2015
71acd2a
Set additional class on webidl containers
halindrome Nov 13, 2015
c280e33
Addressed some comments
halindrome Nov 17, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
14 changes: 10 additions & 4 deletions js/core/examples.js
View file
Open in desktop
Expand Up @@ -9,14 +9,17 @@
define(
["text!core/css/examples.css", "text!core/css/examples-webspecs.css"],
function (css, cssKraken) {
var makeTitle = function ($el, num, report) {
var makeTitle = function (conf, $el, num, report) {
var txt = (num > 0) ? " " + num : ""
, $tit = $("<div class='example-title'><span>Example" + txt + "</span></div>");
report.title = $el.attr("title");
if (report.title) {
$tit.append($el[0].ownerDocument.createTextNode(": " + report.title));
$tit.append($("<span style='text-transform: none'>: " + report.title + "</span>"));
$el.removeAttr("title");
}
if (conf.useExperimentalStyles) {
$tit.addClass("marker") ;
}
return $tit;
};

Expand All @@ -35,7 +38,7 @@ define(
;
if ($ex.is("aside")) {
num++;
var $tit = makeTitle($ex, num, report);
var $tit = makeTitle(conf, $ex, num, report);
$ex.prepend($tit);
msg.pub("example", report);
}
Expand All @@ -55,9 +58,12 @@ define(
}
report.content = lines.join("\n");
$ex.html(lines.join("\n"));
if (conf.useExperimentalStyles) {
$ex.removeClass("example illegal-example");
}
// wrap
var $div = $("<div class='example'></div>")
, $tit = makeTitle($ex, inAside ? 0 : num, report)
, $tit = makeTitle(conf, $ex, inAside ? 0 : num, report)
;
$div.append($tit);
$div.append($ex.clone());
Expand Down
9 changes: 7 additions & 2 deletions js/core/issues-notes.js
View file
Open in desktop
Expand Up @@ -86,17 +86,22 @@ define(
$a.attr("href", "#" + id).text("Issue " + report.number);

if (report.title) {
$li.append(doc.createTextNode(": " + report.title));
$li.append($("<span style='text-transform: none'>: " + report.title + "</span>"));
}
$issueList.append($li);
}
}
$tit.find("span").text(text);

if (report.title) {
$tit.append(doc.createTextNode(": " + report.title));
$tit.append($("<span style='text-transform: none'>: " + report.title + "</span>"));
$inno.removeAttr("title");
}

if (conf.useExperimentalStyles) {
$tit.addClass("marker") ;
}

$div.append($tit);
$inno.replaceWith($div);
var body = $inno.removeClass(report.type).removeAttr("data-number");
Expand Down
11 changes: 9 additions & 2 deletions js/core/structure.js
View file
Open in desktop
Expand Up @@ -97,13 +97,20 @@ define(
if (!conf.noTOC) {
var $ul = makeTOCAtLevel($("body", doc), doc, [0], 1, conf);
if (!$ul) return;
var $sec = $("<section id='toc'/>").append("<h2 class='introductory'>" + conf.l10n.toc + "</h2>")
.append($ul)
var w = conf.useExperimentalStyles ? "nav" : "section";
var $sec = $("<" + w + " id='toc'/>")
.append("<h2 class='introductory'>" + conf.l10n.toc + "</h2>")
.append($ul)
, $ref = $("#toc", doc), replace = false;
if ($ref.length) replace = true;
if (!$ref.length) $ref = $("#sotd", doc);
if (!$ref.length) $ref = $("#abstract", doc);
replace ? $ref.replaceWith($sec) : $ref.after($sec);

if (conf.useExperimentalStyles) {
var $link = $("<p role='navigation' id='back-to-top'><a href='#toc'><abbr title='Back to Top'>&uarr;</abbr></p>");
$("body").append($link);;
}
}

// Update all anchors with empty content that reference a section ID
Expand Down
6 changes: 3 additions & 3 deletions js/core/webidl-contiguous.js
View file
Open in desktop
Expand Up @@ -309,8 +309,8 @@ define(
}

// Takes the result of WebIDL2.parse(), an array of definitions.
function makeMarkup (parse, msg) {
var attr = { "class": "idl" };
function makeMarkup (conf, parse, msg) {
var attr = { "class": ( conf.useExperimentalStyles ? "def idl" : "idl" ) };
var $pre = $("<pre></pre>").attr(attr);
$pre.html(parse.filter(function(defn) { return !typeIsWhitespace(defn.type); })
.map(function(defn) { return writeDefinition(defn, -1, msg); })
Expand Down Expand Up @@ -768,7 +768,7 @@ define(
return;
}
linkDefinitions(parse, conf.definitionMap, "", msg);
var $df = makeMarkup(parse, msg);
var $df = makeMarkup(conf, parse, msg);
$df.attr({id: this.id});
$df.find('.idlAttribute,.idlCallback,.idlConst,.idlDictionary,.idlEnum,.idlException,.idlField,.idlInterface,.idlMember,.idlMethod,.idlSerializer,.idlTypedef')
.each(function() {
Expand Down
6 changes: 1 addition & 5 deletions js/w3c/aria.js
View file
Open in desktop
Expand Up @@ -15,12 +15,8 @@ define(
$('div.head', doc).attr('id', 'respecHeader') ;
if (!conf.noTOC) {
// ensure toc is labelled
var toc = $('section#toc', doc)
.find("ul:first");
var toc = conf.useExperimentalStyles ? $('nav#toc', doc) : $('section#toc', doc);
toc.attr('role', 'navigation') ;
if (!toc.attr("id")) {
toc.attr('id', 'respecContents') ;
}
}
// mark issues and notes with heading
var noteCount = 0 ; var issueCount = 0 ; var ednoteCount = 0;
Expand Down
7 changes: 7 additions & 0 deletions js/w3c/headers.js
View file
Open in desktop
Expand Up @@ -535,6 +535,13 @@ define(
msg.pub("error", "ReSpec does not support automated SotD generation for TAG findings, " +
"please specify one using a <code><section></code> element with ID=sotd.");
}
// experimental style info
var hasViewportMeta = doc.head.querySelector("meta[name=viewport]") ? true : false;
if (conf.useExperimentalStyles && !hasViewportMeta) {
$("html>head").prepend($('<meta name="viewport" content="width=device-width, initial-scale=1, width = content-width, initial-scale = 1.0, shrink-to-fit=no">'));
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can't remember exactly, but adding this after the fact might not actually work on mobile.
Also, should probably check if:

var hasViewportMeta = doc.head.querySelector("meta[name=viewport]") ? true : false;
if (conf.useExperimentalStyles && !hasViewportMeta) { ...}

Before adding another on - as having two might result in strangeness.

}



msg.pub("end", "w3c/headers");
cb();
Expand Down
3 changes: 3 additions & 0 deletions js/w3c/style.js
View file
Open in desktop
Expand Up @@ -40,6 +40,9 @@ define(
.appendTo($("head"))
;
}
else if (conf.useExperimentalStyles) {
css = "http://fantasai.inkedblade.net/style/design/w3c-restyle/2016/W3C-" + statStyle;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

D'oh. Can't believe I didn't see this :(

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Well - that's where the stylesheets are. Should we have done something
else?

On Wed, Nov 25, 2015 at 7:55 PM, Marcos Caceres notifications@github.com
wrote:

In js/w3c/style.js
#522 (comment):

@@ -40,6 +40,9 @@ define(
.appendTo($("head"))
;
}

  •            else if (conf.useExperimentalStyles) {

  •                css = "http://fantasai.inkedblade.net/style/design/w3c-restyle/2016/W3C-" + statStyle;

D'oh. Can't believe I didn't see this :(

—
Reply to this email directly or view it on GitHub
https://github.com/w3c/respec/pull/522/files#r45938038.

Shane McCarron
halindrome@gmail.com

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

On 27 Nov 2015, at 3:14 AM, Shane McCarron notifications@github.com wrote:

In js/w3c/style.js:

@@ -40,6 +40,9 @@ define(
.appendTo($("head"))
;
}

  •            else if (conf.useExperimentalStyles) {

  •                css = "http://fantasai.inkedblade.net/style/design/w3c-restyle/2016/W3C-" + statStyle;
    Well - that's where the stylesheets are. Should we have done something else?

Yeah, we should have stopped and complained that http is unacceptable in 2015. We should make that a rule going forward.

The project is hosted on Github, so we could ask @fantasai to just serve it from gh-pages (it probably already is, but too lazy to check from my phone:))

…
—
Reply to this email directly or view it on GitHub.

}
else {
css += "www.w3.org/StyleSheets/TR/W3C-" + statStyle;
}
Expand Down
4 changes: 2 additions & 2 deletions js/w3c/templates/cgbg-headers.html
View file
Open in desktop
@@ -1,6 +1,6 @@
<div class='head'>
<p>
<a href='http://www.w3.org/'><img width='72' height='48' src='https://www.w3.org/Icons/w3c_home' alt='W3C'></a>
<a class='logo' href='http://www.w3.org/'><img width='72' height='48' src='https://www.w3.org/Icons/w3c_home' alt='W3C'></a>
</p>
<h1 class='title p-name' id='title'{{#if doRDFa}} property='dc:title'{{/if}}>{{title}}</h1>
{{#if subtitle}}
Expand Down Expand Up @@ -108,5 +108,5 @@ <h2>{{longStatus}} <time {{#if doRDFa}}property="dc:issued"{{/if}}class='dt-publ
A human-readable <a href="http://www.w3.org/community/about/agreements/cla-deed/">summary</a> is available.
{{/if}}
</p>
<hr>
<hr title="Separator for header">
</div>
4 changes: 2 additions & 2 deletions js/w3c/templates/headers.html
View file
Open in desktop
Expand Up @@ -4,7 +4,7 @@
{{showLogos logos}}
{{else}}
{{#if prependW3C}}
<a href='http://www.w3.org/'><img width='72' height='48' src='https://www.w3.org/Icons/w3c_home' alt='W3C'></a>
<a class='logo' href='http://www.w3.org/'><img width='72' height='48' src='https://www.w3.org/Icons/w3c_home' alt='W3C'></a>
{{#if isMemberSubmission}}
<a href="http://www.w3.org/Submission/"> <img height="48" width="211" alt="W3C Member Submission" src="http://www.w3.org/Icons/member_subm" /></a>
{{/if}}
Expand Down Expand Up @@ -172,5 +172,5 @@ <h2>{{#if prependW3C}}W3C {{/if}}{{textStatus}} <time {{#if doRDFa}}property="dc
</p>
{{/if}}
{{/if}}
<hr>
<hr title="Separator for header">
</div>
2 changes: 1 addition & 1 deletion tests/spec/core/structure-spec.js
View file
Open in desktop
Expand Up @@ -26,7 +26,7 @@ describe("Core - Structure", function () {
expect($toc.find("h2").text()).toEqual("Table of Contents");
expect($toc.find("h2 span").attr('resource')).toEqual('xhv:heading');
expect($toc.find("h2 span").attr('property')).toEqual('xhv:role');
expect($toc.find("ul:first").attr('role')).toEqual('navigation');
expect($toc.attr('role')).toEqual('navigation');
expect($toc.find("> ul > li").length).toEqual(3);
expect($toc.find("li").length).toEqual(15);
expect($toc.find("> ul > li a").first().text()).toEqual("1. ONE");
Expand Down