ソースを参照

Merge branch 'snippet-adapter'

Docs: Introduced first two samples in the docs. Improved 'gulp docs' options.
Piotrek Koszuliński 8 年 前
コミット
eb9f0ca982

+ 3 - 0
docs/_snippets/samples/classic-editor.html

@@ -0,0 +1,3 @@
+<div id="snippet-classic-editor">
+	<p>This is <a href="https://ckeditor5.github.io">CKEditor&nbsp;5</a>.</p>
+</div>

+ 24 - 0
docs/_snippets/samples/classic-editor.js

@@ -0,0 +1,24 @@
+/**
+ * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* globals console, window, document */
+
+import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
+
+import ArticlePreset from '@ckeditor/ckeditor5-presets/src/article';
+
+ClassicEditor.create( document.querySelector( '#snippet-classic-editor' ), {
+	plugins: [ ArticlePreset ],
+	toolbar: [ 'headings', 'bold', 'italic', 'link', 'unlink', 'bulletedList', 'numberedList', 'blockQuote', 'undo', 'redo' ],
+	image: {
+		toolbar: [ 'imageStyleFull', 'imageStyleSide', '|', 'imageTextAlternative' ]
+	}
+} )
+.then( editor => {
+	window.editor = editor;
+} )
+.catch( err => {
+	console.error( err.stack );
+} );

+ 3 - 0
docs/_snippets/samples/inline-editor.html

@@ -0,0 +1,3 @@
+<div id="snippet-inline-editor">
+	<p>This is <a href="https://ckeditor5.github.io">CKEditor&nbsp;5</a>.</p>
+</div>

+ 24 - 0
docs/_snippets/samples/inline-editor.js

@@ -0,0 +1,24 @@
+/**
+ * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* globals console, window, document */
+
+import InlineEditor from '@ckeditor/ckeditor5-editor-inline/src/inlineeditor';
+
+import ArticlePreset from '@ckeditor/ckeditor5-presets/src/article';
+
+InlineEditor.create( document.querySelector( '#snippet-inline-editor' ), {
+	plugins: [ ArticlePreset ],
+	toolbar: [ 'headings', 'bold', 'italic', 'link', 'unlink', 'bulletedList', 'numberedList', 'blockQuote', 'undo', 'redo' ],
+	image: {
+		toolbar: [ 'imageStyleFull', 'imageStyleSide', '|', 'imageTextAlternative' ]
+	}
+} )
+.then( editor => {
+	window.editor = editor;
+} )
+.catch( err => {
+	console.error( err.stack );
+} );

+ 1 - 1
docs/builds/guides/development/custom-builds.md

@@ -72,7 +72,7 @@ This will install the package and add it to `package.json`. You can also edit `p
 	Due to a non-deterministic way how npm installs packages, it is recommended to run `rm -rf node_modules && npm install` when in doubt. This will prevent some packages from getting installed more than once in `node_modules/` (which might lead to broken builds).
 
 	You can also give [Yarn](https://yarnpkg.com/lang/en/) a try.
-<side-box>
+</side-box>
 
 ### Updating build configuration
 

docs/tutorials/advanced-tutorials/advanced.md → docs/framework/tutorials/advanced-tutorials/advanced.md


docs/tutorials/how-to/how-to-artcle.md → docs/framework/tutorials/how-to/how-to-artcle.md


docs/tutorials/index.md → docs/framework/tutorials/index.md


docs/tutorials/step-by-step/step-by-step-article.md → docs/framework/tutorials/step-by-step/step-by-step-article.md


+ 9 - 0
docs/samples/builds/classic-editor.md

@@ -0,0 +1,9 @@
+---
+title: Classic editor sample
+category: samples-builds
+order: 10
+---
+
+Classic editor sample.
+
+{@snippet samples/classic-editor}

+ 9 - 0
docs/samples/builds/inline-editor.md

@@ -0,0 +1,9 @@
+---
+title: Inline editor sample
+category: samples-builds
+order: 10
+---
+
+Inline editor sample.
+
+{@snippet samples/inline-editor}

+ 7 - 0
docs/samples/index.md

@@ -0,0 +1,7 @@
+---
+title: Samples
+category: samples
+order: 10
+---
+
+Samples's starting page.

+ 16 - 0
docs/umberto.json

@@ -3,6 +3,10 @@
 	"slug": "ckeditor5",
 	"hexo-config": "docs/hexo-custom-config.json",
 	"path": "docs",
+	"scripts": {
+		"snippet-adapter": "../scripts/docs/snippet-adapter/snippetadapter",
+		"import-path": "../scripts/docs/getrealimportpath"
+	},
 	"groups": [
 		{
 			"name": "API",
@@ -96,6 +100,18 @@
 					]
 				}
 			]
+		},
+		{
+			"name": "Samples",
+			"id": "samples",
+			"slug": "samples",
+			"categories": [
+				{
+					"name": "Builds",
+					"id": "samples-builds",
+					"slug": "builds"
+				}
+			]
 		}
 	],
 	"items": [

+ 22 - 5
gulpfile.js

@@ -38,12 +38,28 @@ function getTestOptions() {
 // Documentation. -------------------------------------------------------------
 
 gulp.task( 'docs', () => {
-	if ( process.argv[ 3 ] == '--no-api' ) {
-		return runUmberto();
+	const skipLiveSnippets = process.argv.includes( '--skip-snippets' );
+	const skipApi = process.argv.includes( '--skip-api' );
+
+	if ( skipApi ) {
+		const fs = require( 'fs' );
+		const apiJsonPath = './docs/api/output.json';
+
+		if ( fs.existsSync( apiJsonPath ) ) {
+			fs.unlinkSync( apiJsonPath );
+		}
+
+		return runUmberto( {
+			skipLiveSnippets
+		} );
 	}
 
 	return buildApiDocs()
-		.then( runUmberto );
+		.then( () => {
+			return runUmberto( {
+				skipLiveSnippets
+			} );
+		} );
 } );
 
 gulp.task( 'docs:api', buildApiDocs );
@@ -64,13 +80,14 @@ function buildApiDocs() {
 		} );
 }
 
-function runUmberto() {
+function runUmberto( options ) {
 	assertIsInstalled( 'umberto' );
 	const umberto = require( 'umberto' );
 
 	return umberto.buildSingleProject( {
 		configDir: 'docs',
-		clean: true
+		clean: true,
+		skipLiveSnippets: options.skipLiveSnippets
 	} );
 }
 

+ 10 - 0
scripts/docs/getrealimportpath.js

@@ -0,0 +1,10 @@
+/**
+ * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* eslint-env node */
+
+module.exports = function getRealImportPath( modulePath ) {
+	return modulePath.replace( /^([^/]+)\//, '@ckeditor/ckeditor5-$1/src/' );
+};

+ 20 - 0
scripts/docs/snippet-adapter/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "docs-adapter",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "babili-webpack-plugin": "^0.1.2",
+    "css-loader": "^0.28.4",
+    "node-sass": "^4.5.3",
+    "raw-loader": "^0.5.1",
+    "sass-loader": "^6.0.6",
+    "style-loader": "^0.18.2",
+    "webpack": "^3.0.0"
+  }
+}

+ 97 - 0
scripts/docs/snippet-adapter/snippetadapter.js

@@ -0,0 +1,97 @@
+/**
+ * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* eslint-env node */
+
+const path = require( 'path' );
+const fs = require( 'fs' );
+const webpack = require( 'webpack' );
+const { bundler } = require( '@ckeditor/ckeditor5-dev-utils' );
+
+// const BabiliPlugin = require( 'babili-webpack-plugin' );
+
+module.exports = function snippetAdapter( data ) {
+	const webpackConfig = getWebpackConfig( {
+		entry: data.snippetSource.js,
+		outputPath: path.join( data.outputPath, data.snippetPath )
+	} );
+
+	return runWebpack( webpackConfig )
+		.then( () => {
+			return {
+				html: generateSnippetHtml( {
+					htmlPath: data.snippetSource.html,
+					scriptPath: path.join( data.relativeOutputPath, data.snippetPath, 'snippet.js' )
+				} )
+			};
+		} );
+};
+
+function getWebpackConfig( config ) {
+	return {
+		devtool: 'source-map',
+
+		entry: config.entry,
+
+		output: {
+			path: config.outputPath,
+			filename: 'snippet.js'
+		},
+
+		plugins: [
+			// new BabiliPlugin( null, {
+			// 	comments: false
+			// } ),
+			new webpack.BannerPlugin( {
+				banner: bundler.getLicenseBanner(),
+				raw: true
+			} )
+		],
+
+		module: {
+			rules: [
+				{
+					test: /\.svg$/,
+					use: [ 'raw-loader' ]
+				},
+				{
+					test: /\.scss$/,
+					use: [
+						'style-loader',
+						{
+							loader: 'css-loader',
+							options: {
+								minimize: true
+							}
+						},
+						'sass-loader'
+					]
+				}
+			]
+		}
+	};
+}
+
+function runWebpack( webpackConfig ) {
+	return new Promise( ( resolve, reject ) => {
+		webpack( webpackConfig, ( err, stats ) => {
+			if ( err ) {
+				reject( err );
+			} else if ( stats.hasErrors() ) {
+				reject( new Error( stats.toString() ) );
+			} else {
+				resolve();
+			}
+		} );
+	} );
+}
+
+function generateSnippetHtml( data ) {
+	let html = fs.readFileSync( data.htmlPath );
+
+	html += `<script src="${ data.scriptPath }"></script>`;
+
+	return html;
+}

+ 4 - 0
scripts/install-optional-dependencies.sh

@@ -14,3 +14,7 @@
 set -e
 
 npm i @ckeditor/ckeditor5-dev-env umberto
+
+cd scripts/docs/snippet-adapter
+npm i
+cd ../..