欧卡2中文社区

 找回密码
 立即注册

QQ登录

只需一步,快速开始

需要三步,才能开始

只需两步,慢速开始

玩欧卡就用莱仕达V10方向盘欧卡2入门方向盘选莱仕达V9莱仕达折叠便携游戏方向盘支架欢迎地图Mod入驻
查看: 5050|回复: 3
收起左侧

html5rocks pandoc模板

[复制链接]
oppo 发表于 2015-5-21 17:37 | 显示全部楼层 |阅读模式
[tex=code]<!DOCTYPE html>
<!--
  Copyright 2011 Google Inc.

  Licensed under the Apache License, Version 2.0 (the "License");
  you may not use this file except in compliance with the License.
  You may obtain a copy of the License at

     http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.

  Original slides: Marcin Wichary (mwichary@google.com)
  Modifications: Chrome DevRel Team (chrome-devrel@googlegroups.com)
                 Alex Russell (slightlyoff@chromium.org)
                 Brad Neuberg
-->

<!-- GB: modifications for s9 template pack:

  o removed offline manifest
  o removed disclaimer; it's just a prototype anyway
  o removed google analytics script code
  o removed google maps script code
  o removed all slides

  o in js/utils.js changed line 541pp queryAll('.transitionSlide')

     - looks for h1 (not h2) and doesn't include img (icon)

  o in styles/commons.css commented out rules for li and bullets

   li {
    list-style: none;
    padding: 10px 0;
   }
   .bullets {
  font-size: 40px;
  }
  .bullets li::before {
    content: '· ';
  }
-->

<html$if(lang)$ lang="$lang$"$endif$>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1" />
$for(author-meta)$
<meta name="author" content="$author-meta$" />
$endfor$
$if(date-meta)$
<meta name="dcterms.date" content="$date-meta$" />
$endif$
<title>$if(title-prefix)$$title-prefix$ - $endif$$pagetitle$</title>
    <link href="http://fonts.googleapis.com/css?family=Droid+Sans|Droid+Sans+Mono" rel="stylesheet" type="text/css" />
    <link id="prettify-link" href="$html5rocks-url$/src/prettify/prettify.css" rel="stylesheet" disabled />
    <link href="$html5rocks-url$/styles/fonts.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="$html5rocks-url$/styles/presentation.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="$html5rocks-url$/styles/common.css" rel="stylesheet" type="text/css" media="screen" />
    <link class="theme" href="$html5rocks-url$/styles/default.css" rel="stylesheet" type="text/css" media="screen" />
    <link class="theme" href="$html5rocks-url$/styles/moon.css" rel="stylesheet" type="text/css" media="screen" />
    <link class="theme" href="$html5rocks-url$/styles/sand.css" rel="stylesheet" type="text/css" media="screen"/>
    <link class="theme" href="$html5rocks-url$/styles/sea_wave.css" rel="stylesheet" type="text/css" media="screen"/>
   
<style type="text/css">code{white-space: pre;}</style>
$if(highlighting-css)$
<style type="text/css">
$highlighting-css$
</style>
$endif$

$if(math)$
    $math$
$endif$
$for(header-includes)$
    $header-includes$
$endfor$

  </head>
  <body>
    <div id="flex-container">
    <nav id="helpers">
      <button title="Previous slide" id="nav-prev" class="nav-prev">&#8701;</button>
      <button title="Jump to a random slide" id="slide-no">5</button>
      <button title="Next slide" id="nav-next" class="nav-next">&#8702;</button>
      <menu>
        <button type="checkbox" data-command="toc" title="Table of Contents" class="toc">TOC</button>
        <!-- <button type="checkbox" data-command="resources" title="View Related Resources">☆</button> -->
        <button type="checkbox" data-command="notes" title="View Slide Notes">&#9999;</button>
        <button type="checkbox" data-command="source" title="View slide source">&#8635;</button>
        <button type="checkbox" data-command="help" title="View Help">?</button>
      </menu>
    </nav>
    <div class="slides">
      <div id="presentation-counter">Loading...</div>
        <div class="slide" id="landing-slide">
          <section class="middle">
            <p>This presentation is an HTML5 website</p>
            <p>Press <span id="left-init-key" class="key">→</span> key to advance.</p>
          </section>
          <aside class="note">
            <section>
              Welcome! (This field is for speaker notes and commentary.)
            </section>
          </aside>
        </div>

        <div class="slide" id="controls-slide">
          <header>Slides controls</header>
          <section>
            <ul>
              <li><span class="key">←</span> and <span class="key">→</span> to move around.</li>
              <li><span class="key">Ctrl/Command</span> and <span class="key">+</span> or <span class="key">-</span> to zoom in and out if slides don’t fit.</li>
              <li><span class="key">S</span> to view page source.</li>
              <li><span class="key">T</span> to change the theme.</li>
              <li><span class="key">H</span> to toggle syntax highlight.</li>
              <li><span class="key">N</span> to toggle speaker notes.</li>
              <li><span class="key">3</span> to toggle 3D effect.</li>
              <li><span class="key">0</span> to toggle help.</li>
            </ul>
          </section>
        </div>

        <div class="slide" id="title-slide">
          <section class="middle">
            <hgroup>
     
     $if(title)$
              <h1>
                $title$
              </h1>
      $endif$
     $if(subtitle)$
              <h2>
                $subtitle$
              </h2>
      $endif$
            </hgroup>
          </section>
        </div>

        <div class="slide" id="table-of-contents">
          <header><h1>Table of Contents</h1></header>
          <section>
            <ul id="toc-list">
     $toc$
            </ul>
          </section>
        </div>


$if(toc)$
        <div class="slide transitionSlide" id="$idprefix$TOC">
          <!--<header></header>-->
          <section>
       $toc$
          </section>
        </div>
$endif$

$body$


        <div id="speaker-note" class="invisible" style="display: none;"></div>
        <aside id="help" class="sidebar invisible" style="display: none;">
          <table>
            <caption>Help</caption>
            <tbody>
              <tr>
                <th>Move Around</th>
                <td>← →</td>
              </tr>
              <tr>
                <th>Source File</th>
                <td>s</td>
              </tr>
              <tr>
                <th>Change Theme</th>
                <td>t</td>
              </tr>
              <tr>
                <th>Syntax Highlight</th>
                <td>h</td>
              </tr>
              <tr>
                <th>Speaker Notes</th>
                <td>n</td>
              </tr>
              <tr>
                <th>Toggle 3D</th>
                <td>3</td>
              </tr>
              <tr>
                <th>Help</th>
                <td>0</td>
              </tr>
            </tbody>
          </table>
        </aside>

    </div> <!-- slides -->
    </div>
   
    <!--[if lt IE 9]>
    <script
      src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js">
    </script>
    <script>CFInstall.check({ mode: "overlay" });</script>
    <![endif]-->

    <script src="$html5rocks-url$/src/prettify/prettify.js" onload="prettyPrint();" defer></script>
    <script src="$html5rocks-url$/js/utils.js"></script>
  </body>
</html>[/tex]
 楼主| oppo 发表于 2015-5-21 17:38 | 显示全部楼层
转换脚本
[tex=code]
#!/bin/bash
tmpfile=tmp.md
rm -f $tmpfile
cp test.md $tmpfile
i=0
for id in `grep -nE "^## " $tmpfile |tr -s ' ' '-'`
do
        line=`echo "$id" |awk -F ":" '{print $1}'`
        title=`echo "$id" |sed 's/##-/## /g' |awk '{print $2}' |tr -d '!'`
        header=`echo "$title" |tr -s '-' ' '`
        if [ $i -eq 0 ];then
                sed -i "$line s/.*/<div class=\"slide\" id=\"$title\"><header><h1>$header<\/h1><\/header><section>/" $tmpfile
        else
                sed -i "$line s/.*/<\/section><\/div><div class=\"slide\" id=\"$title\"><header><h1>$header<\/h1><\/header><section>/" $tmpfile
        fi
        ((i++))
done
grep -E "^# "
echo "</section></div>" >>$tmpfile

for id in `grep -nE "^# " $tmpfile |tr -s ' ' '-'`
do
        line=`echo "$id" |awk -F ":" '{print $1}'`
        title=`echo "$id" |sed 's/#-/# /g' |awk '{print $2}' |tr -d '!'`
        header=`echo "$title" |tr -s '-' ' '`
        sed -i "$line s/.*/<\/section><\/div><div class=\"slide\" id=\"$title\"><section class=\"middle\"><hgroup><h1>$header<\/h1><\/hgroup><\/section><\/div>/" $tmpfile
done
sed -i "s/# .*/"
pandoc -s $tmpfile -o html5rocks.html --template="template/html5.html" -V html5rocks-url="template/html5rocks"
[/tex]
 楼主| oppo 发表于 2015-5-23 16:22 | 显示全部楼层
fdd
回复 打印

使用道具 举报

 楼主| oppo 发表于 2015-5-23 16:28 | 显示全部楼层
本帖最后由 oppo 于 2015-5-23 16:55 编辑
dddd

联系我们|手机版|欧卡2中国 ( 湘ICP备11020288号-1 )

GMT+8, 2024-7-15 23:39 , Processed in 0.034053 second(s), 8 queries , Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表