diff --git a/buildpage.js b/buildpage.js index ad072d0b..024a8080 100644 --- a/buildpage.js +++ b/buildpage.js @@ -12,11 +12,11 @@ cpr('./demos', './site/demos', function(err, files) { if (err) return console.log(err) }) -fs.readFile('./newReadme.md', function(err, file) { +fs.readFile('new-readme.md', function(err, file) { if (err) return console.log(err) var name = "index" var content = file.toString() - var html = marked(content) + var html = changeExtensions(marked(content)) applyTemplate(html, name) }) @@ -29,13 +29,20 @@ glob("docs/*.md", function (err, files) { var name = file.split('.md')[0] var filePath = "./docs/" var content = fs.readFileSync(filePath + file).toString() - var html = marked(content) + var html = changeExtensions(marked(content)) applyTemplate(html, name) }) }) function applyTemplate(html, name) { var content = {content: html} + if (name === "index") { + content.rootstyle = "" + content.rootdoc = "docs" + } else { + content.rootstyle = ".." + content.rootdoc = "" + } var file = "template.hbs" var rawTemplate = fs.readFileSync(file).toString() var template = hbs.compile(rawTemplate) @@ -45,7 +52,7 @@ function applyTemplate(html, name) { function writeFile(page, name) { if (name === "index") { - fs.writeFileSync('./site/' + name + '.html' , page) + return fs.writeFileSync('./site/' + name + '.html' , page) } mkdirp('./site/docs', function (err) { if (err) return console.error(err) @@ -53,3 +60,12 @@ function writeFile(page, name) { }) } +function changeExtensions(html, name) { + if (name === "index") { + html = html.replace('/\./\.\/', '') + } + var re = /.md$/ + var newHtml = html.replace(/\.md/g, '.html') + return newHtml +} + diff --git a/docs/sheetsee-charts.md b/docs/sheetsee-charts.md index 0957d2e3..7db5ee3a 100644 --- a/docs/sheetsee-charts.md +++ b/docs/sheetsee-charts.md @@ -1,14 +1,14 @@ -# sheetsee-charts +# Sheetsee-charts -Sheetsee provides three d3 chart options to use with your spreadsheet data: a bar chart, line chart and pie graph. You can also plug in your own custom d3 chart to sheetsee, read about that [here](custom-charts.md). +Sheetsee provides three d3 chart options to use with your spreadsheet data: a bar chart, line chart and pie graph. See a [demo](demos/demo-chart.html). You can also plug in your own custom d3 chart to sheetsee, read about that [here](custom-charts.md). ## Make a Chart -Sheetsee.js comes with a d3.js bar, pie and line chart. Each requires your data be an _array of objects_, formatted to contain "label" and "units" keys. See the section above on Your Data to learn about formatting. +Sheetsee.js comes with a d3.js bar, pie and line chart. Each requires your data be an _array of objects_, with objects containing "label" and "units" key/value pairs. See the section above on Your Data to learn about formatting. -You'll have to experiement with the charts to find the correct size your `
` will need to be to hold the chart with your data in it nicely. +Experiment with the charts to find the correct size your `
` will need to be to hold the chart with your data in it nicely. -You can also make your own d3 chart in a separate .js file, link to that and pass your data on to it. I'd love to see people building some other charts that will work with Sheetsee. +You can also make your own d3 chart in a separate .js file, link to that and pass your data on to it. Information [here](docs/custom-charts.md) on using your own chart. ### Bar Chart @@ -21,7 +21,7 @@ To create a bar chart you'll need to add a placeholder `
` in your HTML with In your CSS, give it dimensions. ```CSS -#barChart {height: 400px; max-width: 600px; background: #F8CDCD;} +barChart {height: 400px; max-width: 600px; background: #F8CDCD;} ``` In a `