Odstranjena docker sql baza
This commit is contained in:
pero1203
parent
a7811b5b0f
commit
c574646fbe
@ -1 +0,0 @@
|
||||
awk -F"|" "{ arr[$%1]++ } END { {OFS=\"\"} {ORS=\"\"} for( no in arr) { print \"$frequency[\'%1\'][\'\", no, \"\'] = \" ,arr[no],\";\n\" }}" %2 >> %3
|
||||
@ -1,669 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<title>Loading...</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<link href="vendor/bootstrap.min.css" rel="stylesheet" media="screen">
|
||||
<link href="vendor/prettify.css" rel="stylesheet" media="screen">
|
||||
<link href="css/style.css" rel="stylesheet" media="screen, print">
|
||||
<link href="img/favicon.ico" rel="icon" type="image/x-icon">
|
||||
<script src="vendor/polyfill.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script id="template-sidenav" type="text/x-handlebars-template">
|
||||
<nav id="scrollingNav">
|
||||
<div class="sidenav-search">
|
||||
<input class="form-control search" type="text" placeholder="{{__ "Filter..."}}">
|
||||
<span class="search-reset">x</span>
|
||||
</div>
|
||||
<ul class="sidenav nav nav-list list">
|
||||
{{#each nav}}
|
||||
{{#if title}}
|
||||
{{#if isHeader}}
|
||||
{{#if isFixed}}
|
||||
<li class="nav-fixed nav-header navbar-btn nav-list-item" data-group="{{group}}"><a href="#api-{{group}}">{{underscoreToSpace title}}</a></li>
|
||||
{{else}}
|
||||
<li class="nav-header nav-list-item" data-group="{{group}}"><a href="#api-{{group}}">{{underscoreToSpace title}}</a></li>
|
||||
{{/if}}
|
||||
{{else}}
|
||||
<li class="{{#if hidden}}hide {{/if}}" data-group="{{group}}" data-name="{{name}}" data-version="{{version}}">
|
||||
<a href="#api-{{group}}-{{name}}" class="nav-list-item">{{title}}</a>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/each}}
|
||||
</ul>
|
||||
</nav>
|
||||
</script>
|
||||
|
||||
<script id="template-project" type="text/x-handlebars-template">
|
||||
<div class="pull-left">
|
||||
<h1>{{name}}</h1>
|
||||
{{#if description}}<h2>{{{nl2br description}}}</h2>{{/if}}
|
||||
</div>
|
||||
{{#if template.withCompare}}
|
||||
<div class="pull-right">
|
||||
<div class="btn-group">
|
||||
<button id="version" class="btn btn-lg btn-default dropdown-toggle" data-toggle="dropdown">
|
||||
<strong>{{version}}</strong> <span class="caret"></span>
|
||||
</button>
|
||||
<ul id="versions" class="dropdown-menu open-left">
|
||||
<li><a id="compareAllWithPredecessor" href="#">{{__ "Compare all with predecessor"}}</a></li>
|
||||
<li class="divider"></li>
|
||||
<li class="disabled"><a href="#">{{__ "show up to version:"}}</a></li>
|
||||
{{#each versions}}
|
||||
<li class="version"><a href="#">{{this}}</a></li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
<div class="clearfix"></div>
|
||||
</script>
|
||||
|
||||
<script id="template-header" type="text/x-handlebars-template">
|
||||
{{#if content}}
|
||||
<div id="api-_">{{{content}}}</div>
|
||||
{{/if}}
|
||||
</script>
|
||||
|
||||
<script id="template-footer" type="text/x-handlebars-template">
|
||||
{{#if content}}
|
||||
<div id="api-_footer">{{{content}}}</div>
|
||||
{{/if}}
|
||||
</script>
|
||||
|
||||
<script id="template-generator" type="text/x-handlebars-template">
|
||||
{{#if template.withGenerator}}
|
||||
{{#if generator}}
|
||||
<div class="content">
|
||||
{{__ "Generated with"}} <a href="{{{generator.url}}}">{{{generator.name}}}</a> {{{generator.version}}} - {{{generator.time}}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</script>
|
||||
|
||||
<script id="template-sections" type="text/x-handlebars-template">
|
||||
<section id="api-{{group}}">
|
||||
<h1>{{underscoreToSpace title}}</h1>
|
||||
{{#if description}}
|
||||
<p>{{{nl2br description}}}</p>
|
||||
{{/if}}
|
||||
{{#each articles}}
|
||||
<div id="api-{{group}}-{{name}}">
|
||||
{{{article}}}
|
||||
</div>
|
||||
{{/each}}
|
||||
</section>
|
||||
</script>
|
||||
|
||||
<script id="template-article" type="text/x-handlebars-template">
|
||||
<article id="api-{{article.group}}-{{article.name}}-{{article.version}}" {{#if hidden}}class="hide"{{/if}} data-group="{{article.group}}" data-name="{{article.name}}" data-version="{{article.version}}">
|
||||
<div class="pull-left">
|
||||
<h1>{{article.groupTitle}}{{#if article.title}} - {{article.title}}{{/if}}</h1>
|
||||
</div>
|
||||
{{#if template.withCompare}}
|
||||
<div class="pull-right">
|
||||
<div class="btn-group">
|
||||
<button class="version btn btn-default dropdown-toggle" data-toggle="dropdown">
|
||||
<strong>{{article.version}}</strong> <span class="caret"></span>
|
||||
</button>
|
||||
<ul class="versions dropdown-menu open-left">
|
||||
<li class="disabled"><a href="#">{{__ "compare changes to:"}}</a></li>
|
||||
{{#each versions}}
|
||||
<li class="version"><a href="#">{{this}}</a></li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
<div class="clearfix"></div>
|
||||
|
||||
{{#if article.deprecated}}
|
||||
<p class="deprecated"><span>{{__ "DEPRECATED"}}</span>
|
||||
{{{markdown article.deprecated.content}}}
|
||||
</p>
|
||||
{{/if}}
|
||||
|
||||
{{#if article.description}}
|
||||
<p>{{{nl2br article.description}}}</p>
|
||||
{{/if}}
|
||||
<span class="type type__{{toLowerCase article.type}}">{{toLowerCase article.type}}</span>
|
||||
<pre class="prettyprint language-html" data-type="{{toLowerCase article.type}}"><code>{{article.url}}</code></pre>
|
||||
|
||||
{{#if article.permission}}
|
||||
<p>
|
||||
{{__ "Permission:"}}
|
||||
{{#each article.permission}}
|
||||
{{name}}
|
||||
{{#if title}}
|
||||
<button type="button" class="btn btn-info btn-xs" data-title="{{title}}" data-content="{{nl2br description}}" data-html="true" data-toggle="popover" data-placement="right" data-trigger="hover">
|
||||
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
|
||||
</button>
|
||||
{{/if}}
|
||||
{{/each}}
|
||||
</p>
|
||||
{{/if}}
|
||||
|
||||
{{#if_gt article.examples.length compare=0}}
|
||||
<ul class="nav nav-tabs nav-tabs-examples">
|
||||
{{#each article.examples}}
|
||||
<li{{#if_eq @index compare=0}} class="active"{{/if_eq}}>
|
||||
<a href="#examples-{{../id}}-{{@index}}">{{title}}</a>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
<div class="tab-content">
|
||||
{{#each article.examples}}
|
||||
<div class="tab-pane{{#if_eq @index compare=0}} active{{/if_eq}}" id="examples-{{../id}}-{{@index}}">
|
||||
<pre class="prettyprint language-{{type}}" data-type="{{type}}"><code>{{content}}</code></pre>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if_gt}}
|
||||
|
||||
{{subTemplate "article-param-block" params=article.header _hasType=_hasTypeInHeaderFields section="header"}}
|
||||
{{subTemplate "article-param-block" params=article.parameter _hasType=_hasTypeInParameterFields section="parameter"}}
|
||||
{{subTemplate "article-param-block" params=article.success _hasType=_hasTypeInSuccessFields section="success"}}
|
||||
{{subTemplate "article-param-block" params=article.error _col1="Name" _hasType=_hasTypeInErrorFields section="error"}}
|
||||
|
||||
{{subTemplate "article-sample-request" article=article id=id}}
|
||||
</article>
|
||||
</script>
|
||||
|
||||
<script id="template-article-param-block" type="text/x-handlebars-template">
|
||||
{{#if params}}
|
||||
{{#each params.fields}}
|
||||
<h2>{{__ @key}}</h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 30%">{{#if ../_col1}}{{__ ../_col1}}{{else}}{{__ "Field"}}{{/if}}</th>
|
||||
{{#if ../_hasType}}<th style="width: 10%">{{__ "Type"}}</th>{{/if}}
|
||||
<th style="width: {{#if ../_hasType}}60%{{else}}70%{{/if}}">{{__ "Description"}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{#each this}}
|
||||
<tr>
|
||||
<td class="code">{{{splitFill field "." " "}}}{{#if optional}} <span class="label label-optional">{{__ "optional"}}</span>{{/if}}</td>
|
||||
{{#if ../../_hasType}}
|
||||
<td>
|
||||
{{{type}}}
|
||||
</td>
|
||||
{{/if}}
|
||||
<td>
|
||||
{{{nl2br description}}}
|
||||
{{#if defaultValue}}<p class="default-value">{{__ "Default value:"}} <code>{{{defaultValue}}}</code></p>{{/if}}
|
||||
{{#if size}}<p class="type-size">{{__ "Size range:"}} <code>{{{size}}}</code></p>{{/if}}
|
||||
{{#if allowedValues}}<p class="type-size">{{__ "Allowed values:"}}
|
||||
{{#each allowedValues}}
|
||||
<code>{{{this}}}</code>{{#unless @last}}, {{/unless}}
|
||||
{{/each}}
|
||||
</p>
|
||||
{{/if}}
|
||||
</td>
|
||||
</tr>
|
||||
{{/each}}
|
||||
</tbody>
|
||||
</table>
|
||||
{{/each}}
|
||||
{{#if_gt params.examples.length compare=0}}
|
||||
<ul class="nav nav-tabs nav-tabs-examples">
|
||||
{{#each params.examples}}
|
||||
<li{{#if_eq @index compare=0}} class="active"{{/if_eq}}>
|
||||
<a href="#{{../section}}-examples-{{../id}}-{{@index}}">{{title}}</a>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
<div class="tab-content">
|
||||
{{#each params.examples}}
|
||||
<div class="tab-pane{{#if_eq @index compare=0}} active{{/if_eq}}" id="{{../section}}-examples-{{../id}}-{{@index}}">
|
||||
<pre class="prettyprint language-{{type}}" data-type="{{type}}"><code>{{reformat content type}}</code></pre>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if_gt}}
|
||||
{{/if}}
|
||||
</script>
|
||||
|
||||
<script id="template-article-sample-request" type="text/x-handlebars-template">
|
||||
{{#if article.sampleRequest}}
|
||||
<h2>{{__ "Send a Sample Request"}}</h2>
|
||||
<form class="form-horizontal">
|
||||
<fieldset>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label" for="{{../id}}-sample-request-url"></label>
|
||||
<div class="input-group">
|
||||
<input id="{{../id}}-sample-request-url" type="text" class="form-control sample-request-url" value="{{article.sampleRequest.0.url}}" />
|
||||
<span class="input-group-addon">{{__ "url"}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#if article.header}}
|
||||
{{#if article.header.fields}}
|
||||
<h3>{{__ "Headers"}}</h3>
|
||||
{{#each article.header.fields}}
|
||||
<h4><input type="radio" data-sample-request-header-group-id="sample-request-header-{{@index}}" name="{{../id}}-sample-request-header" value="{{@index}}" class="sample-request-header sample-request-switch" {{#if_eq @index compare=0}} checked{{/if_eq}} />{{@key}}</h4>
|
||||
<div class="{{../id}}-sample-request-header-fields{{#if_gt @index compare=0}} hide{{/if_gt}}">
|
||||
{{#each this}}
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label" for="sample-request-header-field-{{field}}">{{field}}</label>
|
||||
<div class="input-group">
|
||||
<input type="text" placeholder="{{field}}" id="sample-request-header-field-{{field}}" class="form-control sample-request-header" data-sample-request-header-name="{{field}}" data-sample-request-header-group="sample-request-header-{{@../index}}">
|
||||
<span class="input-group-addon">{{{type}}}</span>
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/each}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#if article.parameter}}
|
||||
{{#if article.parameter.fields}}
|
||||
<h3>{{__ "Parameters"}}</h3>
|
||||
{{#each article.parameter.fields}}
|
||||
<h4><input type="radio" data-sample-request-param-group-id="sample-request-param-{{@index}}" name="{{../id}}-sample-request-param" value="{{@index}}" class="sample-request-param sample-request-switch" {{#if_eq @index compare=0}} checked{{/if_eq}} />{{@key}}</h4>
|
||||
<div class="form-group {{../id}}-sample-request-param-fields{{#if_gt @index compare=0}} hide{{/if_gt}}">
|
||||
{{#each this}}
|
||||
<label class="col-md-3 control-label" for="sample-request-param-field-{{field}}">{{field}}</label>
|
||||
<div class="input-group">
|
||||
<input id="sample-request-param-field-{{field}}" type="text" placeholder="{{field}}" class="form-control sample-request-param" data-sample-request-param-name="{{field}}" data-sample-request-param-group="sample-request-param-{{@../index}}" {{#if optional}}data-sample-request-param-optional="true"{{/if}}>
|
||||
<div class="input-group-addon">{{{type}}}</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/each}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
<div class="form-group">
|
||||
<div class="controls pull-right">
|
||||
<button class="btn btn-primary sample-request-send" data-sample-request-type="{{article.type}}">{{__ "Send"}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group sample-request-response" style="display: none;">
|
||||
<h3>
|
||||
{{__ "Response"}}
|
||||
<button class="btn btn-default btn-xs pull-right sample-request-clear">X</button>
|
||||
</h3>
|
||||
<pre class="prettyprint language-json" data-type="json"><code class="sample-request-response-json"></code></pre>
|
||||
</div>
|
||||
</fieldset>
|
||||
</form>
|
||||
{{/if}}
|
||||
</script>
|
||||
|
||||
<script id="template-compare-article" type="text/x-handlebars-template">
|
||||
<article id="api-{{article.group}}-{{article.name}}-{{article.version}}" {{#if hidden}}class="hide"{{/if}} data-group="{{article.group}}" data-name="{{article.name}}" data-version="{{article.version}}" data-compare-version="{{compare.version}}">
|
||||
<div class="pull-left">
|
||||
<h1>{{underscoreToSpace article.group}} - {{{showDiff article.title compare.title}}}</h1>
|
||||
</div>
|
||||
|
||||
<div class="pull-right">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-success" disabled>
|
||||
<strong>{{article.version}}</strong> {{__ "compared to"}}
|
||||
</button>
|
||||
<button class="version btn btn-danger dropdown-toggle" data-toggle="dropdown">
|
||||
<strong>{{compare.version}}</strong> <span class="caret"></span>
|
||||
</button>
|
||||
<ul class="versions dropdown-menu open-left">
|
||||
<li class="disabled"><a href="#">{{__ "compare changes to:"}}</a></li>
|
||||
<li class="divider"></li>
|
||||
{{#each versions}}
|
||||
<li class="version"><a href="#">{{this}}</a></li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
||||
{{#if article.description}}
|
||||
<p>{{{showDiff article.description compare.description "nl2br"}}}</p>
|
||||
{{else}}
|
||||
{{#if compare.description}}
|
||||
<p>{{{showDiff "" compare.description "nl2br"}}}</p>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
<pre class="prettyprint language-html" data-type="{{toLowerCase article.type}}"><code>{{{showDiff article.url compare.url}}}</code></pre>
|
||||
|
||||
{{subTemplate "article-compare-permission" article=article compare=compare}}
|
||||
|
||||
<ul class="nav nav-tabs nav-tabs-examples">
|
||||
{{#each_compare_title article.examples compare.examples}}
|
||||
{{#if typeSame}}
|
||||
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
|
||||
<a href="#compare-examples-{{../../article.id}}-{{index}}">{{{showDiff source.title compare.title}}}</a>
|
||||
</li>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeIns}}
|
||||
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
|
||||
<a href="#compare-examples-{{../../article.id}}-{{index}}"><ins>{{{source.title}}}</ins></a>
|
||||
</li>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeDel}}
|
||||
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
|
||||
<a href="#compare-examples-{{../../article.id}}-{{index}}"><del>{{{compare.title}}}</del></a>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{/each_compare_title}}
|
||||
</ul>
|
||||
|
||||
<div class="tab-content">
|
||||
{{#each_compare_title article.examples compare.examples}}
|
||||
|
||||
{{#if typeSame}}
|
||||
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="compare-examples-{{../../article.id}}-{{index}}">
|
||||
<pre class="prettyprint language-{{source.type}}" data-type="{{source.type}}"><code>{{{showDiff source.content compare.content}}}</code></pre>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeIns}}
|
||||
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="compare-examples-{{../../article.id}}-{{index}}">
|
||||
<pre class="prettyprint language-{{source.type}}" data-type="{{source.type}}"><code>{{{source.content}}}</code></pre>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeDel}}
|
||||
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="compare-examples-{{../../article.id}}-{{index}}">
|
||||
<pre class="prettyprint language-{{source.type}}" data-type="{{compare.type}}"><code>{{{compare.content}}}</code></pre>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{/each_compare_title}}
|
||||
</div>
|
||||
|
||||
{{subTemplate "article-compare-param-block" source=article.parameter compare=compare.parameter _hasType=_hasTypeInParameterFields section="parameter"}}
|
||||
{{subTemplate "article-compare-param-block" source=article.success compare=compare.success _hasType=_hasTypeInSuccessFields section="success"}}
|
||||
{{subTemplate "article-compare-param-block" source=article.error compare=compare.error _col1="Name" _hasType=_hasTypeInErrorFields section="error"}}
|
||||
|
||||
{{subTemplate "article-sample-request" article=article id=id}}
|
||||
|
||||
</article>
|
||||
</script>
|
||||
|
||||
<script id="template-article-compare-permission" type="text/x-handlebars-template">
|
||||
<p>
|
||||
{{__ "Permission:"}}
|
||||
{{#each_compare_list_field article.permission compare.permission field="name"}}
|
||||
{{#if source}}
|
||||
{{#if typeSame}}
|
||||
{{source.name}}
|
||||
{{#if source.title}}
|
||||
<button type="button" class="btn btn-info btn-xs" data-title="{{source.title}}" data-content="{{nl2br source.description}}" data-html="true" data-toggle="popover" data-placement="right" data-trigger="hover">
|
||||
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
|
||||
</button>
|
||||
{{#unless _last}}, {{/unless}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#if typeIns}}
|
||||
<ins>{{source.name}}</ins>
|
||||
{{#if source.title}}
|
||||
<button type="button" class="btn btn-info btn-xs" data-title="{{source.title}}" data-content="{{nl2br source.description}}" data-html="true" data-toggle="popover" data-placement="right" data-trigger="hover">
|
||||
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
|
||||
</button>
|
||||
{{#unless _last}}, {{/unless}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#if typeDel}}
|
||||
<del>{{source.name}}</del>
|
||||
{{#if source.title}}
|
||||
<button type="button" class="btn btn-info btn-xs" data-title="{{source.title}}" data-content="{{nl2br source.description}}" data-html="true" data-toggle="popover" data-placement="right" data-trigger="hover">
|
||||
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
|
||||
</button>
|
||||
{{#unless _last}}, {{/unless}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#if typeSame}}
|
||||
{{compare.name}}
|
||||
{{#if compare.title}}
|
||||
<button type="button" class="btn btn-info btn-xs" data-title="{{compare.title}}" data-content="{{nl2br compare.description}}" data-html="true" data-toggle="popover" data-placement="right" data-trigger="hover">
|
||||
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
|
||||
</button>
|
||||
{{#unless _last}}, {{/unless}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#if typeIns}}
|
||||
<ins>{{compare.name}}</ins>
|
||||
{{#if compare.title}}
|
||||
<button type="button" class="btn btn-info btn-xs" data-title="{{compare.title}}" data-content="{{nl2br compare.description}}" data-html="true" data-toggle="popover" data-placement="right" data-trigger="hover">
|
||||
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
|
||||
</button>
|
||||
{{#unless _last}}, {{/unless}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#if typeDel}}
|
||||
<del>{{compare.name}}</del>
|
||||
{{#if compare.title}}
|
||||
<button type="button" class="btn btn-info btn-xs" data-title="{{compare.title}}" data-content="{{nl2br compare.description}}" data-html="true" data-toggle="popover" data-placement="right" data-trigger="hover">
|
||||
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
|
||||
</button>
|
||||
{{#unless _last}}, {{/unless}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/each_compare_list_field}}
|
||||
</p>
|
||||
</script>
|
||||
|
||||
<script id="template-article-compare-param-block" type="text/x-handlebars-template">
|
||||
{{#if source}}
|
||||
{{#each_compare_keys source.fields compare.fields}}
|
||||
{{#if typeSame}}
|
||||
<h2>{{__ source.key}}</h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 30%">{{#if ../_col1}}{{__ ../_col1}}{{else}}{{__ "Field"}}{{/if}}</th>
|
||||
{{#if ../_hasType}}<th style="width: 10%">{{__ "Type"}}</th>{{/if}}
|
||||
<th style="width: {{#if ../_hasType}}60%{{else}}70%{{/if}}">{{__ "Description"}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
{{subTemplate "article-compare-param-block-body" source=source.value compare=compare.value _hasType=../_hasType}}
|
||||
</table>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeIns}}
|
||||
<h2><ins>{{__ source.key}}</ins></h2>
|
||||
<table class="ins">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 30%">{{#if ../_col1}}{{__ ../_col1}}{{else}}{{__ "Field"}}{{/if}}</th>
|
||||
{{#if ../_hasType}}<th style="width: 10%">{{__ "Type"}}</th>{{/if}}
|
||||
<th style="width: {{#if ../_hasType}}60%{{else}}70%{{/if}}">{{__ "Description"}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
{{subTemplate "article-compare-param-block-body" source=source.value compare=source.value _hasType=../_hasType}}
|
||||
</table>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeDel}}
|
||||
<h2><del>{{__ compare.key}}</del></h2>
|
||||
<table class="del">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 30%">{{#if ../_col1}}{{__ ../_col1}}{{else}}{{__ "Field"}}{{/if}}</th>
|
||||
{{#if ../_hasType}}<th style="width: 10%">{{__ "Type"}}</th>{{/if}}
|
||||
<th style="width: {{#if ../_hasType}}60%{{else}}70%{{/if}}">{{__ "Description"}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
{{subTemplate "article-compare-param-block-body" source=compare.value compare=compare.value _hasType=../_hasType}}
|
||||
</table>
|
||||
{{/if}}
|
||||
{{/each_compare_keys}}
|
||||
|
||||
{{#if source.examples}}
|
||||
<ul class="nav nav-tabs nav-tabs-examples">
|
||||
{{#each_compare_title source.examples compare.examples}}
|
||||
{{#if typeSame}}
|
||||
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
|
||||
<a href="#{{../../section}}-compare-examples-{{../../article.id}}-{{index}}">{{{showDiff source.title compare.title}}}</a>
|
||||
</li>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeIns}}
|
||||
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
|
||||
<a href="#{{../../section}}-compare-examples-{{../../article.id}}-{{index}}"><ins>{{{source.title}}}</ins></a>
|
||||
</li>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeDel}}
|
||||
<li{{#if_eq index compare=0}} class="active"{{/if_eq}}>
|
||||
<a href="#{{../../section}}-compare-examples-{{../../article.id}}-{{index}}"><del>{{{compare.title}}}</del></a>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{/each_compare_title}}
|
||||
</ul>
|
||||
|
||||
<div class="tab-content">
|
||||
{{#each_compare_title source.examples compare.examples}}
|
||||
|
||||
{{#if typeSame}}
|
||||
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="{{../../section}}-compare-examples-{{../../article.id}}-{{index}}">
|
||||
<pre class="prettyprint language-{{source.type}}" data-type="{{source.type}}"><code>{{{showDiff source.content compare.content}}}</code></pre>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeIns}}
|
||||
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="{{../../section}}-compare-examples-{{../../article.id}}-{{index}}">
|
||||
<pre class="prettyprint language-{{source.type}}" data-type="{{source.type}}"><code>{{{source.content}}}</code></pre>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeDel}}
|
||||
<div class="tab-pane{{#if_eq index compare=0}} active{{/if_eq}}" id="{{../../section}}-compare-examples-{{../../article.id}}-{{index}}">
|
||||
<pre class="prettyprint language-{{source.type}}" data-type="{{compare.type}}"><code>{{{compare.content}}}</code></pre>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/each_compare_title}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</script>
|
||||
|
||||
<script id="template-article-compare-param-block-body" type="text/x-handlebars-template">
|
||||
<tbody>
|
||||
{{#each_compare_field source compare}}
|
||||
{{#if typeSame}}
|
||||
<tr>
|
||||
<td class="code">
|
||||
{{{splitFill source.field "." " "}}}
|
||||
{{#if source.optional}}
|
||||
{{#if compare.optional}} <span class="label label-optional">{{__ "optional"}}</span>
|
||||
{{else}} <span class="label label-optional label-ins">{{__ "optional"}}</span>
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#if compare.optional}} <span class="label label-optional label-del">{{__ "optional"}}</span>{{/if}}
|
||||
{{/if}}
|
||||
</td>
|
||||
|
||||
{{#if source.type}}
|
||||
{{#if compare.type}}
|
||||
<td>{{{showDiff source.type compare.type}}}</td>
|
||||
{{else}}
|
||||
<td>{{{source.type}}}</td>
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#if compare.type}}
|
||||
<td>{{{compare.type}}}</td>
|
||||
{{else}}
|
||||
{{#if ../../../../_hasType}}<td></td>{{/if}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
<td>
|
||||
{{{showDiff source.description compare.description "nl2br"}}}
|
||||
{{#if source.defaultValue}}<p class="default-value">{{__ "Default value:"}} <code>{{{showDiff source.defaultValue compare.defaultValue}}}</code><p>{{/if}}
|
||||
</td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeIns}}
|
||||
<tr class="ins">
|
||||
<td class="code">
|
||||
{{{splitFill source.field "." " "}}}
|
||||
{{#if source.optional}} <span class="label label-optional label-ins">{{__ "optional"}}</span>{{/if}}
|
||||
</td>
|
||||
|
||||
{{#if source.type}}
|
||||
<td>{{{source.type}}}</td>
|
||||
{{else}}
|
||||
{{{typRowTd}}}
|
||||
{{/if}}
|
||||
|
||||
<td>
|
||||
{{{nl2br source.description}}}
|
||||
{{#if source.defaultValue}}<p class="default-value">{{__ "Default value:"}} <code>{{{source.defaultValue}}}</code><p>{{/if}}
|
||||
</td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
|
||||
{{#if typeDel}}
|
||||
<tr class="del">
|
||||
<td class="code">
|
||||
{{{splitFill compare.field "." " "}}}
|
||||
{{#if compare.optional}} <span class="label label-optional label-del">{{__ "optional"}}</span>{{/if}}
|
||||
</td>
|
||||
|
||||
{{#if compare.type}}
|
||||
<td>{{{compare.type}}}</td>
|
||||
{{else}}
|
||||
{{{typRowTd}}}
|
||||
{{/if}}
|
||||
|
||||
<td>
|
||||
{{{nl2br compare.description}}}
|
||||
{{#if compare.defaultValue}}<p class="default-value">{{__ "Default value:"}} <code>{{{compare.defaultValue}}}</code><p>{{/if}}
|
||||
</td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
|
||||
{{/each_compare_field}}
|
||||
</tbody>
|
||||
</script>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div id="sidenav" class="span2"></div>
|
||||
<div id="content">
|
||||
<div id="project"></div>
|
||||
<div id="header"></div>
|
||||
<div id="sections"></div>
|
||||
<div id="footer"></div>
|
||||
<div id="generator"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="loader">
|
||||
<div class="spinner">
|
||||
<div class="spinner-container container1">
|
||||
<div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div>
|
||||
</div>
|
||||
<div class="spinner-container container2">
|
||||
<div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div>
|
||||
</div>
|
||||
<div class="spinner-container container3">
|
||||
<div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div>
|
||||
</div>
|
||||
<p>Loading...</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script data-main="main.js" src="vendor/require.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,363 +0,0 @@
|
||||
<table class="anl_tbl anl_bt anl_br tbl_clps">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck_freq_1 anl_w110"><span
|
||||
class="anl_variabla"><a href="#"
|
||||
</td>
|
||||
<td class="anl_br anl_bb anl_al anl_bck_freq_1" colspan="5"><span
|
||||
class="anl_variabla_label">Spol</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck anl_w110"><span
|
||||
class="taCenter printHide iconHide"><a href="#"><span
|
||||
class="sprites analysis_sums_gray"
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"></span></a><a
|
||||
href="#"><span
|
||||
class="sprites analysis_sums_new_gray"
|
||||
title="Dopolnjene frekvence (print, pdf, word, excel)"></span></a><a
|
||||
href="#" ><span
|
||||
class="sprites analysis_statistic_gray"
|
||||
title="Opisne statistike (print, pdf, word, excel)"></span></a><a
|
||||
href="#" ><span
|
||||
class="sprites analysis_frequencys"
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"></span></a></span></td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_variabla_line">Odgovori</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Frekvenca</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Odstotek</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Veljavni</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Kumulativa</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">1</div>
|
||||
(Moški)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">3</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">33.3%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">33.3%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">33.3%</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">2</div>
|
||||
(Ženski)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">6</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">66.7%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">66.7%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">100.0%</td>
|
||||
</tr>
|
||||
<tr class="anl_bb">
|
||||
<td class="anl_bl anl_br anl_al gray anl_ti_20 anl_bck_text_1">Veljavni<span
|
||||
class="gray" value="0"> (<span
|
||||
class="sprites plus_orange folder_plusminus"
|
||||
style="width: 12px; height: 12px"></span>)
|
||||
</span><span
|
||||
class="gray displayNone"> (<span
|
||||
class="sprites minus_orange folder_plusminus"
|
||||
style="width: 12px; height: 12px"></span>)
|
||||
</span></td>
|
||||
<td class="anl_br anl_al anl_ita red anl_bck_text_1">Skupaj</td>
|
||||
<td class="anl_ita red anl_br anl_ac anl_bck_text_1">9</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_ac anl_bck_text_1"> </td>
|
||||
</tr>
|
||||
<tr class="anl_dash_red_bb displayNone">
|
||||
<td class="anl_bl anl_al anl_br gray anl_ti_20 anl_bck_text_1">Manjkajoči</td>
|
||||
<td class="anl_br anl_ita red anl_bck_text_1">Skupaj<span
|
||||
class="printHide anl_ita anl_detail_percent"> <a
|
||||
href="#single_missing_6" > <span
|
||||
class="sprites plus_orange folder_plusminus"
|
||||
style="width: 12px; height: 12px"></span>
|
||||
</a></span><span
|
||||
class="printHide anl_ita anl_detail_percent displayNone"> <a
|
||||
href="#single_missing_6" > <span
|
||||
class="sprites minus_orange folder_plusminus"
|
||||
style="width: 12px; height: 12px"></span>
|
||||
</a></span>
|
||||
<div
|
||||
class="floatRight anl_w50 anl_dash_bl anl_dash_bt anl_ac anl_detail_percent displayNone">100.0%</div>
|
||||
<div
|
||||
class="floatRight anl_w30 anl_dash_bt anl_ac anl_detail_percent displayNone"></div>
|
||||
</td>
|
||||
<td class="anl_ac anl_br anl_detail_cnt anl_ita red anl_bck_text_1">0</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10">0.0%</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10"><span
|
||||
class=""> </span></td>
|
||||
<td class="anl_ar anl_ita red anl_bck_text_1 anl_pr10"> </td>
|
||||
</tr>
|
||||
<tr class="displayNone">
|
||||
<td
|
||||
class="anl_bl anl_ac anl_dash_bt anl_bb red anl_ita anl_bck_text_0">SKUPAJ</td>
|
||||
<td class="anl_dash_bt anl_br anl_bb anl_bck_text_0"> </td>
|
||||
<td
|
||||
class="anl_ac anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0">9</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10">100.0%</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10"> </td>
|
||||
<td class="anl_ac anl_dash_bt anl_bb anl_ita red anl_bck_text_0"> </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
<table class="anl_tbl anl_bt anl_br tbl_clps">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck_freq_1 anl_w110"><span
|
||||
class="anl_variabla"><a
|
||||
href="#">Q2</a></span></td>
|
||||
<td colspan="5" class="anl_br anl_bb anl_al anl_bck_freq_1"><span
|
||||
class="anl_variabla_label">Dohodek</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck anl_w110"><span
|
||||
class="taCenter printHide iconHide"><a
|
||||
href="#"><span
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Opisne statistike (print, pdf, word, excel)"
|
||||
class="sprites analysis_statistic_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_frequencys"></span></a></span></td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_variabla_line">Odgovori</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Frekvenca</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Odstotek</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Kumulativa</td>
|
||||
</tr>
|
||||
<tr
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">900</div></td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">1</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">11.1%</td>
|
||||
</tr>
|
||||
<tr
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">1000</div></td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">1</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">22.2%</td>
|
||||
</tr>
|
||||
<tr
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">1300</div></td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">3</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">33.3%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">55.6%</td>
|
||||
</tr>
|
||||
<tr
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">1500</div></td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">1</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">66.7%</td>
|
||||
</tr>
|
||||
<tr
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">1600</div></td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">1</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">77.8%</td>
|
||||
</tr>
|
||||
<tr
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">1700</div></td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">1</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">88.9%</td>
|
||||
</tr>
|
||||
<tr
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">2000</div></td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">1</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">100.0%</td>
|
||||
</tr>
|
||||
<tr class="anl_bb">
|
||||
<td class="anl_bl anl_br anl_al gray anl_ti_20 anl_bck_text_1">Veljavni<span
|
||||
value="0" class="gray" > (<span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites plus_orange folder_plusminus"></span>)
|
||||
</span><span class="anl_gray displayNone"
|
||||
> (<span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites minus_orange folder_plusminus"></span>)
|
||||
</span></td>
|
||||
<td class="anl_br anl_al anl_ita red anl_bck_text_1">Skupaj</td>
|
||||
<td class="anl_ita red anl_br anl_ac anl_bck_text_1">9</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_ac anl_bck_text_1"> </td>
|
||||
</tr>
|
||||
<tr class="anl_dash_red_bb displayNone" >
|
||||
<td class="anl_bl anl_al anl_br gray anl_ti_20 anl_bck_text_1">Manjkajoči</td>
|
||||
<td class="anl_br anl_ita red anl_bck_text_1">Skupaj<span
|
||||
class="printHide anl_ita anl_detail_percent"
|
||||
> <a
|
||||
href="#single_missing_7"> <span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites plus_orange folder_plusminus"></span>
|
||||
</a></span><span class="printHide anl_ita anl_detail_percent displayNone"
|
||||
> <a
|
||||
href="#single_missing_7"> <span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites minus_orange folder_plusminus"></span>
|
||||
</a></span>
|
||||
<div
|
||||
class="floatRight anl_w50 anl_dash_bl anl_dash_bt anl_ac anl_detail_percent displayNone"
|
||||
>100.0%</div>
|
||||
<div
|
||||
class="floatRight anl_w30 anl_dash_bt anl_ac anl_detail_percent displayNone"
|
||||
></div>
|
||||
</td>
|
||||
<td class="anl_ac anl_br anl_detail_cnt anl_ita red anl_bck_text_1">0</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10">0.0%</td>
|
||||
<td class="anl_ar anl_ita red anl_bck_text_1 anl_pr10"> </td>
|
||||
</tr>
|
||||
<tr class="displayNone" >
|
||||
<td
|
||||
class="anl_bl anl_ac anl_dash_bt anl_bb red anl_ita anl_bck_text_0">SKUPAJ</td>
|
||||
<td class="anl_dash_bt anl_br anl_bb anl_bck_text_0"> </td>
|
||||
<td
|
||||
class="anl_ac anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0">9</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10">100.0%</td>
|
||||
<td class="anl_ac anl_dash_bt anl_bb anl_ita red anl_bck_text_0"> </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<br>
|
||||
<table class="anl_tbl anl_bt anl_br tbl_clps">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck_freq_1 anl_w110"><span
|
||||
class="anl_variabla"><a
|
||||
href="#">Q3</a></span></td>
|
||||
<td colspan="5" class="anl_br anl_bb anl_al anl_bck_freq_1"><span
|
||||
class="anl_variabla_label">Država</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck anl_w110"><span
|
||||
class="taCenter printHide iconHide"><a
|
||||
href="#"><span
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Dopolnjene frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_new_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Opisne statistike (print, pdf, word, excel)"
|
||||
class="sprites analysis_statistic_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_frequencys"></span></a></span></td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_variabla_line">Odgovori</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Frekvenca</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Odstotek</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Veljavni</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Kumulativa</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">1</div>
|
||||
(Slovenija)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">2</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">2</div>
|
||||
(Hrvaška)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">2</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">44.4%</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">3</div>
|
||||
(Avstrija)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">2</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">66.7%</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">4</div>
|
||||
(Italija)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">1</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">77.8%</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">5</div>
|
||||
(Madžarska)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">2</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">100.0%</td>
|
||||
</tr>
|
||||
<tr class="anl_bb" >
|
||||
<td class="anl_bl anl_br anl_al gray anl_ti_20 anl_bck_text_1">Veljavni<span
|
||||
value="0" class="gray" > (<span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites plus_orange folder_plusminus"></span>)
|
||||
</span><span class="anl_gray displayNone"
|
||||
> (<span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites minus_orange folder_plusminus"></span>)
|
||||
</span></td>
|
||||
<td class="anl_br anl_al anl_ita red anl_bck_text_1">Skupaj</td>
|
||||
<td class="anl_ita red anl_br anl_ac anl_bck_text_1">9</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_ac anl_bck_text_1"> </td>
|
||||
</tr>
|
||||
<tr class="anl_dash_red_bb displayNone" >
|
||||
<td class="anl_bl anl_al anl_br gray anl_ti_20 anl_bck_text_1">Manjkajoči</td>
|
||||
<td class="anl_br anl_ita red anl_bck_text_1">Skupaj<span
|
||||
class="printHide anl_ita anl_detail_percent"
|
||||
> <a
|
||||
href="#single_missing_8"> <span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites plus_orange folder_plusminus"></span>
|
||||
</a></span><span class="printHide anl_ita anl_detail_percent displayNone"
|
||||
> <a
|
||||
href="#single_missing_8"> <span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites minus_orange folder_plusminus"></span>
|
||||
</a></span>
|
||||
<div
|
||||
class="floatRight anl_w50 anl_dash_bl anl_dash_bt anl_ac anl_detail_percent displayNone"
|
||||
>100.0%</div>
|
||||
<div
|
||||
class="floatRight anl_w30 anl_dash_bt anl_ac anl_detail_percent displayNone"
|
||||
></div>
|
||||
</td>
|
||||
<td class="anl_ac anl_br anl_detail_cnt anl_ita red anl_bck_text_1">0</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10">0.0%</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10"><span
|
||||
> </span></td>
|
||||
<td class="anl_ar anl_ita red anl_bck_text_1 anl_pr10"> </td>
|
||||
</tr>
|
||||
<tr class="displayNone" >
|
||||
<td
|
||||
class="anl_bl anl_ac anl_dash_bt anl_bb red anl_ita anl_bck_text_0">SKUPAJ</td>
|
||||
<td class="anl_dash_bt anl_br anl_bb anl_bck_text_0"> </td>
|
||||
<td
|
||||
class="anl_ac anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0">9</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10">100.0%</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10"> </td>
|
||||
<td class="anl_ac anl_dash_bt anl_bb anl_ita red anl_bck_text_0"> </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
File diff suppressed because one or more lines are too long
@ -1,330 +0,0 @@
|
||||
<!-- <br>Χ<sup>2</sup> = 4.500--><table gd2="undefined" sp2="149_0" sq2="6" gd1="undefined" sp1="153_0"
|
||||
sq1="8" style="padding: 0px; margin: 0px; margin-top: 10px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<colgroup>
|
||||
<col style="width: auto; min-width: 100px;">
|
||||
<col style="width: auto; min-width: 100px;">
|
||||
<col style="width: 12%;">
|
||||
<col style="width: 12%;">
|
||||
<col style="width: 12%;">
|
||||
<col style="width: 12%;">
|
||||
<col style="width: 12%;">
|
||||
<col style="width: 12%;">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td rowspan="2" colspan="2"> </td>
|
||||
<td colspan="6" class="anl_bt anl_bl anl_br anl_ac rsdl_bck_title ctbCll"><span
|
||||
class="anl_variabla"><a title="Predogled vprašanja" href="/">Spol (Q2)</a></span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Moški<br>
|
||||
( 1 )
|
||||
</td>
|
||||
<td colspan="3" class="anl_bt anl_bl anl_br anl_ac rsdl_bck_variable1 ctbCll">Ženska<br>
|
||||
( 2 )
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td rowspan="2" colspan="2"> </td>
|
||||
<td colspan="3" class="anl_bt anl_bl anl_ac rsdl_bck_title ctbCll"><span
|
||||
class="anl_variabla"><a title="Predogled vprašanja" href="/">Starost (Q3)</a></span>
|
||||
</td>
|
||||
<td colspan="3" class="anl_bt anl_bl anl_br anl_ac rsdl_bck_title ctbCll"><span
|
||||
class="anl_variabla"><a title="Predogled vprašanja" href="/">Starost (Q3)</a></span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">pod 20<br>
|
||||
( 1 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">20 - 40<br>
|
||||
( 2 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">nad 40<br>
|
||||
( 3 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">pod 20<br>
|
||||
( 1 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">20 - 40<br>
|
||||
( 2 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_br anl_ac rsdl_bck_variable1 ctbCll">nad 40<br>
|
||||
( 3 )
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<td rowspan="5" class="anl_bt anl_bb anl_bl anl_ac rsdl_bck_title ctbCll"><span
|
||||
class="anl_variabla"><a title="Predogled vprašanja" href="/">Država (Q1)</a></span>
|
||||
</td>
|
||||
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Slovenija<br>
|
||||
( 1 )
|
||||
</td>
|
||||
<td v2="" v1="" n2="Moški" n1="Slovenija" k2="1" k1="1"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Hrvaška" k2="1" k1="2"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Avstrija" k2="1" k1="3"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Italija" k2="1" k1="4"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell anl_br"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Hrvaška<br>
|
||||
( 2 )
|
||||
</td>
|
||||
<td v2="" v1="" n2="Moški" n1="Slovenija" k2="1" k1="1"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">4</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Hrvaška" k2="1" k1="2"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Avstrija" k2="1" k1="3"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Italija" k2="1" k1="4"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell anl_br"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Avstrija<br>
|
||||
( 3 )
|
||||
</td>
|
||||
<td v2="" v1="" n2="Moški" n1="Slovenija" k2="1" k1="1"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Hrvaška" k2="1" k1="2"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Avstrija" k2="1" k1="3"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Italija" k2="1" k1="4"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell anl_br"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">3</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Italija<br>
|
||||
( 4 )
|
||||
</td>
|
||||
<td v2="" v1="" n2="Moški" n1="Slovenija" k2="1" k1="1"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Hrvaška" k2="1" k1="2"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Avstrija" k2="1" k1="3"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Italija" k2="1" k1="4"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell anl_br"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Madžarska<br>
|
||||
( 5 )
|
||||
</td>
|
||||
<td v2="" v1="" n2="Moški" n1="Slovenija" k2="1" k1="1"
|
||||
class="ct_in_cell anl_bb"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Hrvaška" k2="1" k1="2"
|
||||
class="ct_in_cell anl_bb"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Avstrija" k2="1" k1="3"
|
||||
class="ct_in_cell anl_bb"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Italija" k2="1" k1="4"
|
||||
class="ct_in_cell anl_bb"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell anl_bb"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell anl_br anl_bb"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
File diff suppressed because one or more lines are too long
@ -1,108 +0,0 @@
|
||||
<table class="anl_tbl anl_ba">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb anl_w70">Variabla<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Vprašanje<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Veljavni<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">-1 (Ni odgovoril)<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">-2 (Preskok (if))<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">-3 (Prekinjeno)<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">-4 (Naknadno vprasanje)<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">-5 (Prazna enota)<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">-97 (Neustrezno)<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">-98 (Zavrnil)<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">-99 (Ne vem)<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Ustrezni<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Vse enote<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">NS<span></span></td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span class="anl_variabla"><a href="#">Q1</a></span></td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_bt">Spol</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">10</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">34</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">44</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">53</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0.8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">23%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">77%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span class="anl_variabla"><a href="#">Q2</a></span></td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_bt">Dohodek</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">15</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">29</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">44</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">53</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0.7</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">34%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">66%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span class="anl_variabla"><a href="#">Q3</a></span></td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_bt">Država</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">6</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">38</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">44</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">53</td>
|
||||
<td rowspan="2" class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0.9</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">14%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">86%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0%</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
File diff suppressed because one or more lines are too long
@ -1,106 +0,0 @@
|
||||
<table class="anl_tbl anl_ba">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb anl_w70"> <span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb anl_w110">Spremenljivka<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Vprašanje<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Veljavno<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Št.
|
||||
enot<span></span>
|
||||
</td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Povprečje<br>/ odstotek<span></span></td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Std.
|
||||
Odklon<span></span>
|
||||
</td>
|
||||
<td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Minimum<span></span></td>
|
||||
<td class=" anl_ac anl_bck anl_variabla_line anl_bb">Maksimum<span></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bck anl_ac anl_br anl_bt link_no_decoration"><span
|
||||
class="taCenter printHide iconHide"><a
|
||||
href="#"><span
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Dopolnjene frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_new_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Opisne statistike (print, pdf, word, excel)"
|
||||
class="sprites analysis_statistic"></span></a><a
|
||||
href="#"><span
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_frequencys_gray"></span></a></span></td>
|
||||
<td class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span
|
||||
class="anl_variabla"><a
|
||||
href="#">Q1</a></span></td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_bt">Spol</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">9</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">9</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">1.67</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0.50</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">1</td>
|
||||
<td class=" anl_bck_desc_1 anl_ac anl_bt">2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bck anl_ac anl_br anl_bt link_no_decoration"><span
|
||||
class="taCenter printHide iconHide"><a
|
||||
href="#"><span
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Opisne statistike (print, pdf, word, excel)"
|
||||
class="sprites analysis_statistic"></span></a><a
|
||||
href="#"><span
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_frequencys_gray"></span></a></span></td>
|
||||
<td class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span
|
||||
class="anl_variabla"><a
|
||||
href="#">Q2</a></span></td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_bt">Dohodek</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"> </td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"> </td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"></td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"></td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"></td>
|
||||
<td class=" anl_bck_desc_1 anl_ac anl_bt"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bck anl_ac anl_br link_no_decoration"> </td>
|
||||
<td
|
||||
class=" anl_bck_desc_2 anl_bt_dot anl_ac anl_br link_no_decoration anl_variabla_sub">Q2</td>
|
||||
<td class=" anl_bck_desc_2 anl_bt_dot anl_tin anl_br">v €</td>
|
||||
<td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">9</td>
|
||||
<td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">9</td>
|
||||
<td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">1,400.00</td>
|
||||
<td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">342.78</td>
|
||||
<td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">900</td>
|
||||
<td class=" anl_bck_desc_2 anl_bt_dot anl_ac">2000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bck anl_ac anl_br anl_bt link_no_decoration"><span
|
||||
class="taCenter printHide iconHide"><a
|
||||
href="#"><span
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Dopolnjene frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_new_gray"></span></a><a
|
||||
href="#"><span
|
||||
title="Opisne statistike (print, pdf, word, excel)"
|
||||
class="sprites analysis_statistic"></span></a><a
|
||||
href="#"><span
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_frequencys_gray"></span></a></span></td>
|
||||
<td class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span
|
||||
class="anl_variabla"><a
|
||||
href="#">Q3</a></span></td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_bt">Država</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">9</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">9</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">2.89</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">1.54</td>
|
||||
<td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">1</td>
|
||||
<td class=" anl_bck_desc_1 anl_ac anl_bt">5</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@ -1,2 +0,0 @@
|
||||
|
||||
<table class="anl_tbl anl_ba"><tbody><tr><td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb anl_w70"> <span></span></td><td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb anl_w110">Spremenljivka<span></span></td><td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Vprašanje<span></span></td><td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Veljavno<span></span></td><td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Št. enot<span></span></td><td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Povprečje<br>/ odstotek<span></span></td><td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Std. Odklon<span></span></td><td class="anl_br anl_ac anl_bck anl_variabla_line anl_bb">Minimum<span></span></td><td class=" anl_ac anl_bck anl_variabla_line anl_bb">Maksimum<span></span></td></tr><tr><td class="anl_bck anl_ac anl_br anl_bt link_no_decoration"><span class="taCenter printHide iconHide"><a href="#"><span title="Sumarne frekvence (print, pdf, word, excel)" class="sprites analysis_sums_gray"></span></a><a href="#"><span title="Dopolnjene frekvence (print, pdf, word, excel)" class="sprites analysis_sums_new_gray"></span></a><a href="#"><span title="Opisne statistike (print, pdf, word, excel)" class="sprites analysis_statistic"></span></a><a href="#"><span title="Osnovne frekvence (print, pdf, word, excel)" class="sprites analysis_frequencys_gray"></span></a></span></td><td class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span class="anl_variabla"><a href="#">Q1</a></span></td><td class=" anl_bck_desc_1 anl_br anl_bt">Spol</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">9</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">9</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">1.67</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">0.50</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">1</td><td class=" anl_bck_desc_1 anl_ac anl_bt">2</td></tr><tr><td class="anl_bck anl_ac anl_br anl_bt link_no_decoration"><span class="taCenter printHide iconHide"><a href="#"><span title="Sumarne frekvence (print, pdf, word, excel)" class="sprites analysis_sums_gray"></span></a><a href="#"><span title="Opisne statistike (print, pdf, word, excel)" class="sprites analysis_statistic"></span></a><a href="#"><span title="Osnovne frekvence (print, pdf, word, excel)" class="sprites analysis_frequencys_gray"></span></a></span></td><td class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span class="anl_variabla"><a href="#">Q2</a></span></td><td class=" anl_bck_desc_1 anl_br anl_bt">Dohodek</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"> </td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"> </td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"></td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"></td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt"></td><td class=" anl_bck_desc_1 anl_ac anl_bt"></td></tr><tr><td class="anl_bck anl_ac anl_br link_no_decoration"> </td><td class=" anl_bck_desc_2 anl_bt_dot anl_ac anl_br link_no_decoration anl_variabla_sub">Q2</td><td class=" anl_bck_desc_2 anl_bt_dot anl_tin anl_br">v €</td><td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">9</td><td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">9</td><td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">1,400.00</td><td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">342.78</td><td class=" anl_bck_desc_2 anl_bt_dot anl_br anl_ac">900</td><td class=" anl_bck_desc_2 anl_bt_dot anl_ac">2000</td></tr><tr><td class="anl_bck anl_ac anl_br anl_bt link_no_decoration"><span class="taCenter printHide iconHide"><a href="#"><span title="Sumarne frekvence (print, pdf, word, excel)" class="sprites analysis_sums_gray"></span></a><a href="#"><span title="Dopolnjene frekvence (print, pdf, word, excel)" class="sprites analysis_sums_new_gray"></span></a><a href="#"><span title="Opisne statistike (print, pdf, word, excel)" class="sprites analysis_statistic"></span></a><a href="#"><span title="Osnovne frekvence (print, pdf, word, excel)" class="sprites analysis_frequencys_gray"></span></a></span></td><td class=" anl_bck_desc_1 anl_ac anl_br anl_bt"><span class="anl_variabla"><a href="#">Q3</a></span></td><td class=" anl_bck_desc_1 anl_br anl_bt">Država</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">9</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">9</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">2.89</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">1.54</td><td class=" anl_bck_desc_1 anl_br anl_ac anl_bt">1</td><td class=" anl_bck_desc_1 anl_ac anl_bt">5</td></tr></tbody></table>
|
||||
@ -1,43 +0,0 @@
|
||||
<table style="margin-top: 10px; min-width:370px" class="anl_tbl_crosstab">
|
||||
<colgroup>
|
||||
<col style="width: auto; min-width: 30px;">
|
||||
<col style="width: auto; min-width: 30px;">
|
||||
<col style="width: auto; min-width: 30px;">
|
||||
<col style="width: auto; min-width: 30px;">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td rowspan="2" class="anl_bt anl_bl anl_ac rsdl_bck_title ctbCll"><span
|
||||
class="anl_variabla"><a
|
||||
title="Predogled vprašanja" href="/">Spol</a></span></td>
|
||||
<td colspan="2"
|
||||
class="anl_bt anl_bl anl_br anl_ac rsdl_bck_title ctbCll"><span
|
||||
class="anl_variabla"><a
|
||||
title="Predogled vprašanja" href="/">Dohodek</a></span><br>cv €</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Povprečje</td>
|
||||
<td
|
||||
class="anl_bl anl_bt anl_br anl_ac red anl_ita anl_bck_text_0 rsdl_bck_variable1 ctbCll">Št.
|
||||
enot</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Moški (
|
||||
1 )</td>
|
||||
<td v2="" v1="" n2="Moški" n1="" k2="1" k1="" class="ct_in_cell">1,500.000</td>
|
||||
<td class="anl_ac anl_bl anl_bt anl_br rsdl_bck0 crostabSuma">3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Ženski (
|
||||
2 )</td>
|
||||
<td v2="" v1="" n2="Ženski" n1="" k2="2" k1="" class="ct_in_cell">1,350.000</td>
|
||||
<td class="anl_ac anl_bl anl_bt anl_br rsdl_bck0 crostabSuma">6</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td
|
||||
class="anl_bb anl_bt anl_bl anl_ac red anl_ita anl_bck_text_0 rsdl_bck_variable1 ctbCll">Skupaj</td>
|
||||
<td class="anl_ac anl_bt anl_bl anl_br anl_bb rsdl_bck0 crostabSuma">1,400.000</td>
|
||||
<td class="anl_ac anl_bt anl_bl anl_br anl_bb rsdl_bck0 crostabSuma">9</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@ -1,2 +0,0 @@
|
||||
|
||||
<table style="margin-top: 10px; min-width:370px" class="anl_tbl_crosstab"><colgroup><col style="width: auto; min-width: 30px;"><col style="width: auto; min-width: 30px;"><col style="width: auto; min-width: 30px;"><col style="width: auto; min-width: 30px;"></colgroup><tbody><tr><td rowspan="2" class="anl_bt anl_bl anl_ac rsdl_bck_title ctbCll"><span class="anl_variabla"><a title="Predogled vprašanja" href="/">Spol</a></span></td><td colspan="2" class="anl_bt anl_bl anl_br anl_ac rsdl_bck_title ctbCll"><span class="anl_variabla"><a title="Predogled vprašanja" href="/">Dohodek</a></span><br>cv €</td></tr><tr><td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Povprečje</td><td class="anl_bl anl_bt anl_br anl_ac red anl_ita anl_bck_text_0 rsdl_bck_variable1 ctbCll">Št. enot</td></tr><tr><td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Moški ( 1 )</td><td v2="" v1="" n2="Moški" n1="" k2="1" k1="" class="ct_in_cell">1,500.000</td><td class="anl_ac anl_bl anl_bt anl_br rsdl_bck0 crostabSuma">3</td></tr><tr><td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Ženski ( 2 )</td><td v2="" v1="" n2="Ženski" n1="" k2="2" k1="" class="ct_in_cell">1,350.000</td><td class="anl_ac anl_bl anl_bt anl_br rsdl_bck0 crostabSuma">6</td></tr><tr><td class="anl_bb anl_bt anl_bl anl_ac red anl_ita anl_bck_text_0 rsdl_bck_variable1 ctbCll">Skupaj</td><td class="anl_ac anl_bt anl_bl anl_br anl_bb rsdl_bck0 crostabSuma">1,400.000</td><td class="anl_ac anl_bt anl_bl anl_br anl_bb rsdl_bck0 crostabSuma">9</td></tr></tbody></table>
|
||||
@ -1,62 +0,0 @@
|
||||
<div class="breakTableDiv" id="150_0">
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th rowspan="2"><span class="anl_variabla"><a
|
||||
title="" href="#">Spol(Q1)</a></span></th>
|
||||
<th colspan="1"><span class="anl_variabla"><a
|
||||
title="" href="#">Dohodek(Q2)</a></span></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="sub">v €(Q2)</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Moški</th>
|
||||
<td>1,500.00</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Ženski</th>
|
||||
<td>1,350.00</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<br>
|
||||
<div class="breakTableDiv" id="153_0">
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th rowspan="2"><span class="anl_variabla"><a
|
||||
title="" href="#">Spol(Q1)</a></span></th>
|
||||
<th colspan="6"><span class="anl_variabla"><a
|
||||
title="" href="#">Država(Q3)</a></span></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="sub">Slovenija(1)</th>
|
||||
<th class="sub">Hrvaška(2)</th>
|
||||
<th class="sub">Avstrija(3)</th>
|
||||
<th class="sub">Italija(4)</th>
|
||||
<th class="sub">Madžarska(5)</th>
|
||||
<th>povprečje</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Moški</th>
|
||||
<td>1</td>
|
||||
<td>0</td>
|
||||
<td>1</td>
|
||||
<td>1</td>
|
||||
<td>0</td>
|
||||
<td>2.67</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Ženski</th>
|
||||
<td>1</td>
|
||||
<td>2</td>
|
||||
<td>1</td>
|
||||
<td>0</td>
|
||||
<td>2</td>
|
||||
<td>3.00</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@ -1,2 +0,0 @@
|
||||
|
||||
<div class="breakTableDiv" id="150_0"><table><tbody><tr><th rowspan="2"><span class="anl_variabla"><a title="" href="#">Spol(Q1)</a></span></th><th colspan="1"><span class="anl_variabla"><a title="" href="#">Dohodek(Q2)</a></span></th></tr><tr><th class="sub">v €(Q2)</th></tr><tr><th>Moški</th><td>1,500.00</td></tr><tr><th>Ženski</th><td>1,350.00</td></tr></tbody></table></div><br><div class="breakTableDiv" id="153_0"><table><tbody><tr><th rowspan="2"><span class="anl_variabla"><a title="" href="#">Spol(Q1)</a></span></th><th colspan="6"><span class="anl_variabla"><a title="" href="#">Država(Q3)</a></span></th></tr><tr><th class="sub">Slovenija(1)</th><th class="sub">Hrvaška(2)</th><th class="sub">Avstrija(3)</th><th class="sub">Italija(4)</th><th class="sub">Madžarska(5)</th><th>povprečje</th></tr><tr><th>Moški</th><td>1</td><td>0</td><td>1</td><td>1</td><td>0</td><td>2.67</td></tr><tr><th>Ženski</th><td>1</td><td>2</td><td>1</td><td>0</td><td>2</td><td>3.00</td></tr></tbody></table></div>
|
||||
@ -1,303 +0,0 @@
|
||||
<table class="anl_tbl anl_bt anl_br tbl_clps">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck_freq_1 anl_w110"><span
|
||||
class="anl_variabla"><a href="#">Q1</a></span></td>
|
||||
<td colspan="5" class="anl_br anl_bb anl_al anl_bck_freq_1"><span
|
||||
class="anl_variabla_label">Spol</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck anl_w110"><span
|
||||
class="taCenter printHide iconHide"><a href="#"><span
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_gray"></span></a><a href="#"><span
|
||||
title="Dopolnjene frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_new"></span></a><a href="#"><span
|
||||
title="Opisne statistike (print, pdf, word, excel)"
|
||||
class="sprites analysis_statistic_gray"></span></a><a href="#"><span
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_frequencys_gray"></span></a></span></td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_variabla_line">Odgovori</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Frekvenca</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Odstotek</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Veljavni</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Kumulativa</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">1</div>
|
||||
(Moški)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">3</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">33.3%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">33.3%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">33.3%</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">2</div>
|
||||
(Ženski)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">6</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">66.7%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">66.7%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">100.0%</td>
|
||||
</tr>
|
||||
<tr class="anl_bb">
|
||||
<td class="anl_bl anl_br anl_al gray anl_ti_20 anl_bck_text_1">Veljavni<span
|
||||
value="0" class=" gray" > (<span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites plus_orange folder_plusminus"></span>)
|
||||
</span><span class=" gray displayNone"
|
||||
> (<span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites minus_orange folder_plusminus"></span>)
|
||||
</span></td>
|
||||
<td class="anl_br anl_al anl_ita red anl_bck_text_1">Skupaj</td>
|
||||
<td class="anl_ita red anl_br anl_ac anl_bck_text_1">9</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_ac anl_bck_text_1"> </td>
|
||||
</tr>
|
||||
<tr class="anl_dash_red_bb displayNone" >
|
||||
<td class="anl_bl anl_al anl_br gray anl_ti_20 anl_bck_text_1">Manjkajoči</td>
|
||||
<td class="anl_br anl_ita red anl_bck_text_1">Skupaj<span
|
||||
class="printHide anl_ita anl_detail_percent" > <a
|
||||
href="#single_missing_6"> <span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites plus_orange folder_plusminus"></span>
|
||||
</a></span><span class="printHide anl_ita anl_detail_percent displayNone"
|
||||
> <a
|
||||
href="#single_missing_6"> <span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites minus_orange folder_plusminus"></span>
|
||||
</a></span>
|
||||
<div
|
||||
class="floatRight anl_w50 anl_dash_bl anl_dash_bt anl_ac anl_detail_percent displayNone"
|
||||
>100.0%</div>
|
||||
<div
|
||||
class="floatRight anl_w30 anl_dash_bt anl_ac anl_detail_percent displayNone"
|
||||
></div>
|
||||
</td>
|
||||
<td class="anl_ac anl_br anl_detail_cnt anl_ita red anl_bck_text_1">0</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10">0.0%</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10"><span
|
||||
> </span></td>
|
||||
<td class="anl_ar anl_ita red anl_bck_text_1 anl_pr10"> </td>
|
||||
</tr>
|
||||
<tr class="displayNone" >
|
||||
<td
|
||||
class="anl_bl anl_ac anl_dash_bt anl_bb red anl_ita anl_bck_text_0">SKUPAJ</td>
|
||||
<td class="anl_dash_bt anl_br anl_bb anl_bck_text_0"> </td>
|
||||
<td
|
||||
class="anl_ac anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0">9</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10">100.0%</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10"> </td>
|
||||
<td class="anl_ac anl_dash_bt anl_bb anl_ita red anl_bck_text_0"> </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="6"
|
||||
style="font-size: 1px; height: 2px; line-height: 3px; border-right: 1px solid white;"
|
||||
class="cll_clps"> </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="anl_br"> </td>
|
||||
<td
|
||||
class="anl_bb anl_bt anl_br anl_p5 anl_ac anl_variabla_line anl_bck">Povprečje</td>
|
||||
<td class="anl_bb anl_bt anl_br anl_ac anl_bck">1.67</td>
|
||||
<td
|
||||
class="anl_bb anl_bt anl_br anl_p5 anl_ac anl_variabla_line anl_bck">Std.
|
||||
Odklon</td>
|
||||
<td class="anl_bb anl_bt anl_ac anl_bck">0.50</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<br />
|
||||
<table class="anl_tbl anl_bt anl_br anl_bb tbl_clps">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck_freq_1 anl_w110"><span
|
||||
class="anl_variabla"><a href="#">Q2</a></span></td>
|
||||
<td colspan="7" class="anl_br anl_bb anl_al anl_bck_freq_1"><span
|
||||
class="anl_variabla_label">Dohodek</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck"><span
|
||||
class="taCenter printHide iconHide"><a href="#"><span
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums"></span></a><a href="#"><span
|
||||
title="Opisne statistike (print, pdf, word, excel)"
|
||||
class="sprites analysis_statistic_gray"></span></a><a href="#"><span
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_frequencys_gray"></span></a></span></td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_variabla_line">Podvprašanja</td>
|
||||
<td
|
||||
class="anl_br anl_ac anl_bck anl_bb anl_w70 anl_legend anl_variabla_line">Veljavno</td>
|
||||
<td
|
||||
class="anl_br anl_ac anl_bck anl_bb anl_w70 anl_legend anl_variabla_line">Št.
|
||||
enot</td>
|
||||
<td
|
||||
class="anl_br anl_ac anl_bck anl_bb anl_w70 anl_legend anl_variabla_line">Povprečje</td>
|
||||
<td
|
||||
class="anl_br anl_ac anl_bck anl_bb anl_w70 anl_legend anl_variabla_line">Std.
|
||||
Odklon</td>
|
||||
<td
|
||||
class="anl_br anl_ac anl_bck anl_bb anl_w70 anl_legend anl_variabla_line">Minimum</td>
|
||||
<td
|
||||
class="anl_bck anl_ac anl_bb anl_w70 anl_legend anl_variabla_line">Maksimum</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td
|
||||
class="anl_bck_desc_2 anl_ac anl_bl anl_br anl_variabla_sub anl_bt_dot">Q2_1</td>
|
||||
<td class="anl_bck_desc_2 anl_al anl_br anl_bt_dot">v €</td>
|
||||
<td class="anl_bck_desc_2 anl_ac anl_br anl_bl anl_bt_dot">9</td>
|
||||
<td class="anl_bck_desc_2 anl_ac anl_br anl_bt_dot">9</td>
|
||||
<td class="anl_bck_desc_2 anl_ac anl_br anl_bt_dot">1,400.00</td>
|
||||
<td class="anl_bck_desc_2 anl_ac anl_br anl_bt_dot">342.78</td>
|
||||
<td class="anl_bck_desc_2 anl_ac anl_br anl_bt_dot">900</td>
|
||||
<td class="anl_bck_desc_2 anl_ac anl_br anl_bt_dot">2000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<br>
|
||||
<table class="anl_tbl anl_bt anl_br tbl_clps">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck_freq_1 anl_w110"><span
|
||||
class="anl_variabla"><a href="#">Q3</a></span></td>
|
||||
<td colspan="5" class="anl_br anl_bb anl_al anl_bck_freq_1"><span
|
||||
class="anl_variabla_label">Država</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_br anl_bb anl_ac anl_bck anl_w110"><span
|
||||
class="taCenter printHide iconHide"><a href="#"><span
|
||||
title="Sumarne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_gray"></span></a><a href="#"><span
|
||||
title="Dopolnjene frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_sums_new"></span></a><a href="#"><span
|
||||
title="Opisne statistike (print, pdf, word, excel)"
|
||||
class="sprites analysis_statistic_gray"></span></a><a href="#"><span
|
||||
title="Osnovne frekvence (print, pdf, word, excel)"
|
||||
class="sprites analysis_frequencys_gray"></span></a></span></td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_variabla_line">Odgovori</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Frekvenca</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Odstotek</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Veljavni</td>
|
||||
<td class="anl_br anl_bb anl_ac anl_bck anl_w70 anl_variabla_line">Kumulativa</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">1</div>
|
||||
(Slovenija)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">2</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">2</div>
|
||||
(Hrvaška)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">2</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">44.4%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">3</div>
|
||||
(Avstrija)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">2</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">66.7%</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_1"><div class="anl_user_text_more">4</div>
|
||||
(Italija)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_1">1</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_1 anl_pr10">11.1%</td>
|
||||
<td class="anl_ar anl_bck_0_1 anl_pr10">77.8%</td>
|
||||
</tr>
|
||||
<tr >
|
||||
<td class="anl_bl anl_ac anl_br gray"> </td>
|
||||
<td class="anl_br anl_bck_0_0"><div class="anl_user_text_more">5</div>
|
||||
(Madžarska)</td>
|
||||
<td class="anl_ac anl_br anl_bck_0_0">2</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_br anl_bck_0_0 anl_pr10">22.2%</td>
|
||||
<td class="anl_ar anl_bck_0_0 anl_pr10">100.0%</td>
|
||||
</tr>
|
||||
<tr class="anl_bb" >
|
||||
<td class="anl_bl anl_br anl_al gray anl_ti_20 anl_bck_text_1">Veljavni<span
|
||||
value="0" class="gray" > (<span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites plus_orange folder_plusminus"></span>)
|
||||
</span><span class="gray displayNone"
|
||||
> (<span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites minus_orange folder_plusminus"></span>)
|
||||
</span></td>
|
||||
<td class="anl_br anl_al anl_ita red anl_bck_text_1">Skupaj</td>
|
||||
<td class="anl_ita red anl_br anl_ac anl_bck_text_1">9</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_br anl_ar anl_bck_text_1 anl_pr10">100.0%</td>
|
||||
<td class="anl_ita red anl_ac anl_bck_text_1"> </td>
|
||||
</tr>
|
||||
<tr class="anl_dash_red_bb displayNone" >
|
||||
<td class="anl_bl anl_al anl_br gray anl_ti_20 anl_bck_text_1">Manjkajoči</td>
|
||||
<td class="anl_br anl_ita red anl_bck_text_1">Skupaj<span
|
||||
class="printHide anl_ita anl_detail_percent" > <a
|
||||
href="#single_missing_8"> <span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites plus_orange folder_plusminus"></span>
|
||||
</a></span><span class="printHide anl_ita anl_detail_percent displayNone"
|
||||
> <a
|
||||
href="#single_missing_8"> <span
|
||||
style="width: 12px; height: 12px"
|
||||
class="sprites minus_orange folder_plusminus"></span>
|
||||
</a></span>
|
||||
<div
|
||||
class="floatRight anl_w50 anl_dash_bl anl_dash_bt anl_ac anl_detail_percent displayNone"
|
||||
>100.0%</div>
|
||||
<div
|
||||
class="floatRight anl_w30 anl_dash_bt anl_ac anl_detail_percent displayNone"
|
||||
></div>
|
||||
</td>
|
||||
<td class="anl_ac anl_br anl_detail_cnt anl_ita red anl_bck_text_1">0</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10">0.0%</td>
|
||||
<td class="anl_ar anl_br anl_ita red anl_bck_text_1 anl_pr10"><span
|
||||
> </span></td>
|
||||
<td class="anl_ar anl_ita red anl_bck_text_1 anl_pr10"> </td>
|
||||
</tr>
|
||||
<tr class="displayNone" >
|
||||
<td
|
||||
class="anl_bl anl_ac anl_dash_bt anl_bb red anl_ita anl_bck_text_0">SKUPAJ</td>
|
||||
<td class="anl_dash_bt anl_br anl_bb anl_bck_text_0"> </td>
|
||||
<td
|
||||
class="anl_ac anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0">9</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10">100.0%</td>
|
||||
<td
|
||||
class="anl_ar anl_dash_bt anl_br anl_bb anl_ita red anl_bck_text_0 anl_pr10"> </td>
|
||||
<td class="anl_ac anl_dash_bt anl_bb anl_ita red anl_bck_text_0"> </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="6"
|
||||
style="font-size: 1px; height: 2px; line-height: 3px; border-right: 1px solid white;"
|
||||
class="cll_clps"> </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="anl_br"> </td>
|
||||
<td
|
||||
class="anl_bb anl_bt anl_br anl_p5 anl_ac anl_variabla_line anl_bck">Povprečje</td>
|
||||
<td class="anl_bb anl_bt anl_br anl_ac anl_bck">2.89</td>
|
||||
<td
|
||||
class="anl_bb anl_bt anl_br anl_p5 anl_ac anl_variabla_line anl_bck">Std.
|
||||
Odklon</td>
|
||||
<td class="anl_bb anl_bt anl_ac anl_bck">1.54</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
File diff suppressed because one or more lines are too long
@ -1,41 +0,0 @@
|
||||
<table border="0" class="ttestTable">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td rowspan="2" class="lightGreen"><span class="anl_variabla"><a
|
||||
href="#">(Q1)Spol</a></span></td>
|
||||
<td colspan="8" class="lightGreen"><span class="anl_variabla"><a
|
||||
href="#">(Q2) v €</a></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>n</th>
|
||||
<th><span class="avg">x</span></th>
|
||||
<th>s²</th>
|
||||
<th>se(<span class="avg">x</span>)
|
||||
</th>
|
||||
<th>±1,96×se(<span class="avg">x</span>)
|
||||
</th>
|
||||
<th>d</th>
|
||||
<th>se(d)</th>
|
||||
<th>t</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="lightGreen">Moški</td>
|
||||
<td>3</td>
|
||||
<td>1,500.000</td>
|
||||
<td>200.000</td>
|
||||
<td>115.470</td>
|
||||
<td>226.321</td>
|
||||
<td rowspan="2">150.000</td>
|
||||
<td rowspan="2">201.246</td>
|
||||
<td rowspan="2">0.745</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="lightGreen">Ženski</td>
|
||||
<td>6</td>
|
||||
<td>1,350.000</td>
|
||||
<td>403.733</td>
|
||||
<td>164.823</td>
|
||||
<td>323.053</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@ -1,2 +0,0 @@
|
||||
|
||||
<table border="0" class="ttestTable"><tbody><tr><td rowspan="2" class="lightGreen"><span class="anl_variabla"><a href="#">(Q1)Spol</a></span></td><td colspan="8" class="lightGreen"><span class="anl_variabla"><a href="#">(Q2) v €</a></span></td></tr><tr><th>n</th><th><span class="avg">x</span></th><th>s²</th><th>se(<span class="avg">x</span>) </th><th>±1,96×se(<span class="avg">x</span>) </th><th>d</th><th>se(d)</th><th>t</th></tr><tr><td class="lightGreen">Moški</td><td>3</td><td>1,500.000</td><td>200.000</td><td>115.470</td><td>226.321</td><td rowspan="2">150.000</td><td rowspan="2">201.246</td><td rowspan="2">0.745</td></tr><tr><td class="lightGreen">Ženski</td><td>6</td><td>1,350.000</td><td>403.733</td><td>164.823</td><td>323.053</td></tr></tbody></table>
|
||||
@ -1,209 +0,0 @@
|
||||
<!-- <br>Χ<sup>2</sup> = 4.500--><table gd2="undefined" sp2="149_0" sq2="6" gd1="undefined" sp1="153_0"
|
||||
sq1="8" style="padding: 0px; margin: 0px; margin-top: 10px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<colgroup>
|
||||
<col style="width: auto; min-width: 100px;">
|
||||
<col style="width: 20%;">
|
||||
<col style="width: 20%;">
|
||||
<col style="width: 20%;">
|
||||
<col style="width: 20%;">
|
||||
<col style="width: 20%;">
|
||||
<col style="width: auto;">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td rowspan="2" class="anl_bt anl_bl anl_ac rsdl_bck_title ctbCll"><span
|
||||
class="anl_variabla"><a
|
||||
title="Predogled vprašanja" href="/">Spol (Q1)</a></span></td>
|
||||
<td colspan="5" class="anl_bt anl_bl anl_ac rsdl_bck_title ctbCll"><span
|
||||
class="anl_variabla"><a
|
||||
title="Predogled vprašanja" href="/">Država (Q3)</a></span></td>
|
||||
<td class="anl_bl"> </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Slovenija<br>
|
||||
( 1 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Hrvaška<br>
|
||||
( 2 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Avstrija<br>
|
||||
( 3 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Italija<br>
|
||||
( 4 )
|
||||
</td>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Madžarska<br>
|
||||
( 5 )
|
||||
</td>
|
||||
<td
|
||||
class="anl_bl anl_bt anl_br anl_ac red anl_ita anl_bck_text_0 rsdl_bck_variable1 ctbCll">Skupaj</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Moški<br>
|
||||
( 1 )
|
||||
</td>
|
||||
<td v2="" v1="" n2="Moški" n1="Slovenija" k2="1" k1="1"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Hrvaška" k2="1" k1="2"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck4 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Avstrija" k2="1" k1="3"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Italija" k2="1" k1="4"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck1 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Moški" n1="Madžarska" k2="1" k1="5"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck4 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td class="anl_ac anl_bl anl_bt anl_br rsdl_bck0 anl_bb"><table
|
||||
style="padding: 0px; margin: 0px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="0" class="anl_ac ctbCll crostabSuma">3</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="anl_bt anl_bl anl_ac rsdl_bck_variable1 ctbCll">Ženski<br>
|
||||
( 2 )
|
||||
</td>
|
||||
<td v2="" v1="" n2="Ženski" n1="Slovenija" k2="2" k1="1"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Ženski" n1="Hrvaška" k2="2" k1="2"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck1 ctbCll">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Ženski" n1="Avstrija" k2="2" k1="3"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck0 ctbCll">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Ženski" n1="Italija" k2="2" k1="4"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck4 ctbCll">0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td v2="" v1="" n2="Ženski" n1="Madžarska" k2="2" k1="5"
|
||||
class="ct_in_cell"><table class="ct_in_tbl">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="anl_ac rsdl_bck1 ctbCll">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td class="anl_ac anl_bl anl_bt anl_br rsdl_bck0 anl_bb"><table
|
||||
style="padding: 0px; margin: 0px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="0" class="anl_ac ctbCll crostabSuma">6</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td
|
||||
class="anl_bb anl_bt anl_bl anl_ac red anl_ita anl_bck_text_0 rsdl_bck_variable1 ctbCll">Skupaj</td>
|
||||
<td class="anl_ac anl_bb anl_bt anl_bl rsdl_bck0"><table
|
||||
style="padding: 0px; margin: 0px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="0" class="anl_ac ctbCll crostabSuma">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td class="anl_ac anl_bb anl_bt anl_bl rsdl_bck0"><table
|
||||
style="padding: 0px; margin: 0px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="0" class="anl_ac ctbCll crostabSuma">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td class="anl_ac anl_bb anl_bt anl_bl rsdl_bck0"><table
|
||||
style="padding: 0px; margin: 0px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="0" class="anl_ac ctbCll crostabSuma">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td class="anl_ac anl_bb anl_bt anl_bl rsdl_bck0"><table
|
||||
style="padding: 0px; margin: 0px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="0" class="anl_ac ctbCll crostabSuma">1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td class="anl_ac anl_bb anl_bt anl_bl rsdl_bck0"><table
|
||||
style="padding: 0px; margin: 0px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="0" class="anl_ac ctbCll crostabSuma">2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
<td class="anl_ac anl_bt anl_bl anl_br anl_bb rsdl_bck0"><table
|
||||
style="padding: 0px; margin: 0px;"
|
||||
class="anl_tbl_crosstab fullWidth fullHeight">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="0" class="anl_ac ctbCll crostabSuma">9</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
0
admin/survey/minify/cache/.keep
vendored
0
admin/survey/minify/cache/.keep
vendored
@ -1,196 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en-us">
|
||||
|
||||
<head>
|
||||
|
||||
<!-- Meta -->
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
|
||||
<title>1KA WPN</title>
|
||||
<meta name="description" content="">
|
||||
|
||||
<!-- The compiled CSS file -->
|
||||
<link rel="stylesheet" href="admin/survey/modules/mod_WPN/frontend/css/production.css">
|
||||
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
|
||||
<!-- Web fonts -->
|
||||
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,700|Source+Serif+Pro:700" rel="stylesheet">
|
||||
|
||||
<!-- favicon.ico. Place these in the root directory. -->
|
||||
<link rel="shortcut icon" href="favicon.ico">
|
||||
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
|
||||
<link rel="manifest" href="manifest.json">
|
||||
<link rel="mask-icon" href="safari-pinned-tab.svg" color="#ffffff">
|
||||
<meta name="msapplication-TileColor" content="#da532c">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
<meta name="apple-moblile-web-app-capable" content="yes">
|
||||
<meta name="apple-moblile-web-app-status-bar-style" content="default">
|
||||
<link rel="apple-touch-startup-image" href="apple-touch-icon.png">
|
||||
<!-- iOS Splash Screen Images -->
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-640.png" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-750.png" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-1242.png" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-1125.png" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-1536.png" media="(min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-1668.png" media="(min-device-width: 834px) and (max-device-width: 834px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-2048.png" media="(min-device-width: 1024px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
<!-- Header -->
|
||||
<header class="align--center pt3">
|
||||
<div class="container--lg border--bottom pb3">
|
||||
<img class="logo mb3" src="admin/survey/modules/mod_WPN/frontend/img/1ka_logo_en.png" alt="1KA">
|
||||
<div id="notif_join_div" style="display: none;">
|
||||
<button class="mb2 btn btn--secondary" id="notif_join_button" onclick="clickButtonSubscribe();" style="font-size: 1.5em;">Join us!</button>
|
||||
<br><br>
|
||||
<div id="notification_permission_warning" style="display: none;">
|
||||
<h3 class="mb2" style="color:red">In order to use our services, you have to enable notifications</h3>
|
||||
<br><br>
|
||||
</div>
|
||||
<h1 class="mb2">Be first to know when new surveys are up!</h1>
|
||||
</div>
|
||||
<div id="notif_joined_div" style="display: none;">
|
||||
<h1 class="mb2">You are in!</h1>
|
||||
<p class="mb2">You will be among first who will get notifications when new surveys are up!</p>
|
||||
</div>
|
||||
<div id="notif_not_supported_div" style="display: none;">
|
||||
<h1 class="mb2">This browser does not support our services!</h1>
|
||||
<p class="mb2">Please update your browser or use another (latest versions of Chrome and Firefox are recommended)</p>
|
||||
</div>
|
||||
<!--<span>
|
||||
<a href="https://www.apple.com/ios/app-store/" class="link"><img class="download" src="/pwa/img/ios.png" alt="Download on the App Store"></a>
|
||||
</span>
|
||||
<span>
|
||||
<a href="https://play.google.com/store" class="link"><img class="download" src="/pwa/img/googleplay.png" alt="Download on Google Play"></a>
|
||||
</span>-->
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<!-- Feature list -->
|
||||
<div class="container pt3 mt2 text--gray align--center">
|
||||
<p class="mb3">Efficient data gathering.</p>
|
||||
<div class="grid-row">
|
||||
<div class="grid-column span-one-third mb3">
|
||||
<img class="illustration--small mb1" src="admin/survey/modules/mod_WPN/frontend/img/messaging.svg" alt="Fast messaging">
|
||||
<p>Fast messaging</p>
|
||||
</div>
|
||||
<div class="grid-column span-one-third mb3">
|
||||
<img class="illustration--small mb1" src="admin/survey/modules/mod_WPN/frontend/img/assign.svg" alt="Assign to others">
|
||||
<p>Assign to others</p>
|
||||
</div>
|
||||
<div class="grid-column span-one-third mb3">
|
||||
<img class="illustration--small mb1" src="admin/survey/modules/mod_WPN/frontend/img/connected.svg" alt="Stay connected">
|
||||
<p>Stay connected</p>
|
||||
</div>
|
||||
<!-- <div class="grid-column span-one-third mb3">
|
||||
<img class="illustration--small mb1" src="img/search.svg" alt="Powerful search">
|
||||
<p>Powerful search</p>
|
||||
</div>
|
||||
<div class="grid-column span-one-third mb3">
|
||||
<img class="illustration--small mb1" src="img/vault.svg" alt="Put in a vault">
|
||||
<p>Put in a vault</p>
|
||||
</div>-->
|
||||
<!-- <div class="grid-column span-one-third mb3">
|
||||
<img class="illustration--small mb1" src="img/mail.svg" alt="Share with others">
|
||||
<p>Share with others</p>
|
||||
</div>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Focus -->
|
||||
<div class="container--lg pt1 pb1">
|
||||
|
||||
<div class="grid-row grid-row--center">
|
||||
<div class="grid-column mt3 mb2 order-2">
|
||||
<div class="border--bottom pb2 mb2">
|
||||
<h2>Usage data</h2>
|
||||
<p>Quis istud possit, inquit, negare? Videamus animi partes, quarum est conspectus illustrior; Illa sunt similia: hebes acies est cuipiam oculorum, corpore alius senescit; Non enim, si omnia non sequebatur.</p>
|
||||
</div>
|
||||
<p class="italic text--gray mb1">Quae quo sunt excelsiores, eo dant clariora indicia naturae. Causa autem fuit huc veniendi ut quosdam hinc.</p>
|
||||
<p class="bold">Carry Andersen, COO at Stripe</p>
|
||||
</div>
|
||||
<div class="grid-column span-1"></div>
|
||||
<div class="grid-column mt3 mb2 order-1">
|
||||
<img src="admin/survey/modules/mod_WPN/frontend/img/data.svg" alt="Usage data">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid-row grid-row--center">
|
||||
<div class="grid-column mt3 mb2">
|
||||
<img src="admin/survey/modules/mod_WPN/frontend/img/security.svg" alt="Absolute security">
|
||||
</div>
|
||||
<div class="grid-column span-1"></div>
|
||||
<div class="grid-column mt3 mb2">
|
||||
<div class="border--bottom pb2 mb2">
|
||||
<h2>Absolute security</h2>
|
||||
<p>Itaque his sapiens semper vacabit. Qualis ista philosophia est, quae non interitum afferat pravitatis, sed sit contenta mediocritate vitiorum? Quid de Platone aut de Democrito loquar? Quis istud possit, inquit negare?</p>
|
||||
</div>
|
||||
<p class="italic text--gray mb1">Estne, quaeso, inquam, sitienti in bibendo voluptas? Duo Reges: constructio interrete.</p>
|
||||
<p class="bold">Josh Blenton, Product Manager at Blinkist</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Mentioned -->
|
||||
<!--<div class="container--lg pt3 pb3 mb2 align--center">
|
||||
<p class="mb2">Mentioned in</p>
|
||||
<span><img class="mentioned" src="img/mentioned.svg" alt="New York Times, TC, Product Hunt, Recode"></span>
|
||||
</div>-->
|
||||
|
||||
<!-- CTA -->
|
||||
<!--<div class="bg--dark-gray align--center pt3 pb3">
|
||||
<div class="container pt2 pb2">
|
||||
<img class="cta-image mb2" src="img/text.svg" alt="Text the app">
|
||||
<p class="h3 text--white mb1 bold">We'll text you the app</p>
|
||||
<p class="text--white mb3">Just insert your number below. Messaging rates apply.</p>
|
||||
<div class="inline-block mr1 no-mr-on-mobile" style="width:280px;max-width:100%">
|
||||
<input class="form-control" type="tel" placeholder="Phone number">
|
||||
</div>
|
||||
<button class="btn btn--secondary">Send</button>
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="pt1 pb3 align--center-on-mobile">
|
||||
<!--<div class="container">
|
||||
<div class="grid-row">
|
||||
<div class="grid-column mt2 span-half">
|
||||
<div class="mb1">
|
||||
<span>
|
||||
<a href="https://www.apple.com/ios/app-store/" class="link"><img class="download" src="img/ios.png" alt="Download on the App Store"></a>
|
||||
</span>
|
||||
<span>
|
||||
<a href="https://play.google.com/store" class="link"><img class="download" src="img/googleplay.png" alt="Download on Google Play"></a>
|
||||
</span>
|
||||
</div>
|
||||
<p class="small">Design by <a href="https://www.eatapapaya.com" class="link link--text">Papaya</a>. Illustrations from <a href="https://undraw.co/" class="link link--text">Undraw</a>.</p>
|
||||
</div>
|
||||
<div class="grid-column mt2 span-half align--right align--center-on-mobile">
|
||||
<ul class="no-bullets list--inline">
|
||||
<li class="mr1"><a href="" class="link"><img class="icon" src="img/youtube.svg" alt="YouTube"></a></li>
|
||||
<li class="mr1"><a href="" class="link"><img class="icon" src="img/twitter.svg" alt="Twitter"></a></li>
|
||||
<li><a href="" class="link"><img class="icon" src="img/facebook.svg" alt="Facebook"></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
</footer>
|
||||
|
||||
<script src="admin/survey/modules/mod_WPN/frontend/js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,360 +0,0 @@
|
||||
<!doctype html>
|
||||
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
|
||||
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
|
||||
<!--[if IE 8]> <html class="no-js lt-ie9" lang=""> <![endif]-->
|
||||
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>NCC Computer Science</title>
|
||||
<meta name="description" content="NCC Computer Science Progressive Web App">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<link rel="stylesheet" href="css/normalize.min.css">
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
<script src="js/main.js"></script>
|
||||
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<link rel="manifest" href="/manifest.json">
|
||||
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
|
||||
<meta name="msapplication-TileColor" content="#da532c">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
<meta name="apple-moblile-web-app-capable" content="yes">
|
||||
<meta name="apple-moblile-web-app-status-bar-style" content="default">
|
||||
<link rel="apple-touch-startup-image" href="/apple-touch-icon.png">
|
||||
<!-- iOS Splash Screen Images -->
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-640.png" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-750.png" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-1242.png" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-1125.png" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-1536.png" media="(min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-1668.png" media="(min-device-width: 834px) and (max-device-width: 834px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
<link rel="apple-touch-startup-image" href="apple-splash-2048.png" media="(min-device-width: 1024px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<!--[if lt IE 8]>
|
||||
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
<div class="header-container">
|
||||
<header class="wrapper clearfix">
|
||||
<span id="trigger" onClick="toggleNav()">
|
||||
<span class="triggerLine"></span>
|
||||
<span class="triggerLine"></span>
|
||||
<span class="triggerLine"></span>
|
||||
</span>
|
||||
<h1 class="title">Computer Science</h1>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#faculty" onclick="toggleNav()">Faculty</a></li>
|
||||
<li><a href="#programs" onclick="toggleNav()">Programs</a></li>
|
||||
<li><a href="#courses" onclick="toggleNav()">Courses</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
</div>
|
||||
|
||||
<div class="main-container">
|
||||
<div class="main wrapper clearfix">
|
||||
<section id="addToHomeScreen">
|
||||
<h1>Install App</h1>
|
||||
<img src="/pwa/android-chrome-192x192.png" alt="NCC CS" />
|
||||
Add our app to your home screen?<br />
|
||||
<a href="javascript:void(0)" onClick="hidePrompt()" style="text-decoration:none;">No, Thanks</a>
|
||||
<button onClick="installApp()">Yes, Please!</button>
|
||||
</section>
|
||||
<article id="top">
|
||||
<header>
|
||||
<h1>Welcome!</h1>
|
||||
<p class="subtitle">
|
||||
You've come to the right place!
|
||||
</p>
|
||||
<p>
|
||||
It’s an exciting – and lucrative – time to be a
|
||||
Computer Science major. At NCC, you’ll be grounded
|
||||
in Computer Science fundamentals and exposed to
|
||||
today’s employable technologies. Want to build
|
||||
Mobile Apps? Want to create state of the art web
|
||||
pages? Want to learn advanced topics? No worries
|
||||
– we’ve got you covered.
|
||||
</p>
|
||||
<p>
|
||||
Whether you are a transfer student looking to start
|
||||
an advanced degree or a programmer learning a new
|
||||
language or just looking to add skills to your tool
|
||||
set, NCC’s Computer Science Department has Courses
|
||||
and Programs to meet your needs.
|
||||
</p>
|
||||
|
||||
</header>
|
||||
<section id="faculty">
|
||||
<h2>Faculty</h2>
|
||||
<p>
|
||||
NCC's Computer Science faculty possess an abundance
|
||||
of real world experience coupled with twenty-first century
|
||||
teaching abilities. The result is classes that ground
|
||||
students in theory while teaching them how to implement
|
||||
the technologies needed to thrive in today's economy.
|
||||
</p>
|
||||
<div class="facultyContainer">
|
||||
<h4>
|
||||
Professor Tom Duffy, Department Chair
|
||||
</h4>
|
||||
<div class="facultyImage">
|
||||
<p>
|
||||
<img class="responsiveImg" src="img/duffy.jpg" alt="Tom Duffy" />
|
||||
</p>
|
||||
<p>
|
||||
<a href="tel:2038576892">(203) 857-6892</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="mailto:tduffy@norwalk.edu">tduffy@norwalk.edu</a>
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
|
||||
Professor Tom Duffy is the Chair of the Computer
|
||||
Science Department and the Program Coordinator
|
||||
for the Computer Science degree as well as the Web
|
||||
Developer, Relational Database, and Smartphone App
|
||||
Development certificates. He teaches courses in Web
|
||||
Development, XML, Java, and Mobile Device Programming.
|
||||
</p>
|
||||
<p>
|
||||
Tom holds a Bachelor of Science degree in Mathematics
|
||||
and Master of Arts degree in Mathematics/Computer Science
|
||||
from Western Connecticut State University. He is the
|
||||
owner of Bright Moments Software – a software company
|
||||
specializing in Web Technologies.
|
||||
</p>
|
||||
<p>
|
||||
Tom has recently published <a href="http://www.bright-moments.com/pmd" target="_blank" rel="noopener">Programming With Mobile Applications</a>, his second book. The book is available from Cengage Learning.
|
||||
</p>
|
||||
<p>
|
||||
<a href="#top">Back To Top</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
<div class="facultyContainer">
|
||||
<h4>
|
||||
Professor Patrick Cassidy
|
||||
</h4>
|
||||
<div class="facultyImage">
|
||||
<p>
|
||||
<img class="responsiveImg" src="img/cassidy.jpg" alt="Patrick Cassidy" />
|
||||
</p>
|
||||
<p>
|
||||
<a href="tel:2038577336">(203) 857-7336</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="mailto:pcassidy@norwalk.edu">pcassidy@norwalk.edu</a>
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
Professor Cassidy is the Coordinator for the Computer
|
||||
Security degree and Networking Certificate programs.
|
||||
He is also the Main Contact for NCC’s Cisco Academy.
|
||||
</p>
|
||||
<p>
|
||||
Before coming to NCC, Prof. Cassidy was a Project
|
||||
Associate for the University of Michigan working out
|
||||
of the General Motors Plant in Tarrytown, NY. He has
|
||||
also taught at Westchester Community College in both
|
||||
the Mathematics and Computer Science departments.
|
||||
</p>
|
||||
<p>
|
||||
He holds a M.S. in Computer Science from Polytechnic
|
||||
University, a B.S. in Aeronautical Science from
|
||||
Embry Riddle Aeronautical University, and an A.S.
|
||||
in Mathematics and Science from Westchester Community
|
||||
College. Prof. Cassidy is a Cisco Certified Network
|
||||
Associate (CCNA) and Cisco Certified Academy Instructor
|
||||
(CCAI). He also holds multiple ratings from the
|
||||
FAA as well as being a Certified Flight
|
||||
Instructor – Instrument (CFII).
|
||||
</p>
|
||||
<p>
|
||||
<a href="#top">Back To Top</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="facultyContainer">
|
||||
<h4>
|
||||
Professor Kerry Cramer
|
||||
</h4>
|
||||
<div class="facultyImage">
|
||||
<p>
|
||||
<img class="responsiveImg" src="img/cramer.jpg" alt="Kerry Cramer" />
|
||||
</p>
|
||||
<p>
|
||||
<a href="tel:2038573332">(203) 857-3332</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="mailto:kcramer@norwalk.edu">kcramer@norwalk.edu</a>
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
Professor Kerry V. Cramer is an information technology
|
||||
professional with 30 years experience in computer
|
||||
programming, information technologies, and IT project
|
||||
management. Mr. Cramer has been an adjunct professor at
|
||||
Manhattanville College, and University of New Haven
|
||||
teaching several courses in the Computer Science
|
||||
curriculum as well as substitute teaching K-12 at
|
||||
schools in the Danbury, CT area.
|
||||
</p>
|
||||
<p>Professor Cramer’s strengths
|
||||
include strong project management disciplines,
|
||||
technical, supervisory and team management skills in
|
||||
Internet, Lotus Notes, and legacy application development
|
||||
and maintenance environments as well as extensive college
|
||||
and professional recruiting experience.
|
||||
</p>
|
||||
<p>
|
||||
<a href="#top">Back To Top</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="facultyContainer">
|
||||
<h4>
|
||||
Professor Charles Gabor
|
||||
</h4>
|
||||
<div class="facultyImage">
|
||||
<p>
|
||||
<img class="responsiveImg" src="img/gabor.jpg" alt="Charles Gabor" />
|
||||
</p>
|
||||
<p>
|
||||
<a href="tel:2038577315">(203) 857-7315</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="mailto:cgabor@norwalk.edu">cgabor@norwalk.edu</a>
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
Professor Gabor teaches Database Development and Java courses.
|
||||
Before joining the NCC faculty he was a Lieutenant/Senior
|
||||
Military Instructor at the United States Naval Academy.
|
||||
Prior to that he was a Software Engineer at Pitney Bowes Inc.
|
||||
</p>
|
||||
<p>
|
||||
Professor Gabor holds a graduate certificate in Computer
|
||||
Science from Purdue University, a M.S. degree from
|
||||
the University of New Haven and a B.S degree in
|
||||
Applied Science from Charter Oak State College.
|
||||
He is a member of the Honor Society in Computer Science,
|
||||
Upsilon Pi Epsilon and a retired Commander in the U.S. Navy.
|
||||
</p>
|
||||
<p>
|
||||
<a href="#top">Back To Top</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<section id="programs">
|
||||
<h2>Programs</h2>
|
||||
<p>
|
||||
Our programs serve both traditional first-time students
|
||||
as well as professionals currently working in the field.
|
||||
The curriculum is flexible enough to meet the needs of
|
||||
students who wish to transfer to a baccalaureate
|
||||
institution and students preparing for immediate
|
||||
entry into the workplace.
|
||||
</p>
|
||||
<p class="subtitle">
|
||||
Degree Programs
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://norwalk.edu/academics/cs/computer-science-program-a-s/" target="_blank" rel="noopener">AS Computer Science</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://norwalk.edu/academics/cs/computer-security-program-a-s/" target="_blank" rel="noopener">AS Computer Security</a>
|
||||
</p>
|
||||
<p class="subtitle">
|
||||
Certificate Programs
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://norwalk.edu/academics/cs/relational-database-development-certificate-program/" target="_blank" rel="noopener">Relational Database Development</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://norwalk.edu/academics/cs/smartphone-app-development-certificate-program/" target="_blank" rel="noopener">Smartphone App Development</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://norwalk.edu/academics/cs/web-developer-certificate-program/" target="_blank" rel="noopener">Web Developer</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="#top">Back To Top</a>
|
||||
</p>
|
||||
</section>
|
||||
<section id="courses">
|
||||
<h2>Courses</h2>
|
||||
<p>
|
||||
Computer Science courses at NCC not only prepare students to
|
||||
transfer into a baccalaureate institution. They also serve
|
||||
those students who wish to enter the workforce directly.
|
||||
All our courses expose students to the course's underlying CS
|
||||
theory as well as teach students how to implement those
|
||||
theories. The result is students who are prepared for
|
||||
whatever they choose to do next.
|
||||
</p>
|
||||
<p>
|
||||
<a href="http://catalog.norwalk.edu/content.php?filter%5B27%5D=CSC&filter%5B29%5D=&filter%5Bcourse_type%5D=-1&filter%5Bkeyword%5D=&filter%5B32%5D=1&filter%5Bcpage%5D=1&cur_cat_oid=3&expand=&navoid=136&search_database=Filter#acalog_template_course_filter" target="_blank" rel="noopener">Computer Science (CSC)</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="http://catalog.norwalk.edu/content.php?filter%5B27%5D=CST&filter%5B29%5D=&filter%5Bcourse_type%5D=-1&filter%5Bkeyword%5D=&filter%5B32%5D=1&filter%5Bcpage%5D=1&cur_cat_oid=3&expand=&navoid=136&search_database=Filter#acalog_template_course_filter" target="_blank" rel="noopener">Computer Technology (CST)</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="http://catalog.norwalk.edu/content.php?filter%5B27%5D=CSA&filter%5B29%5D=&filter%5Bcourse_type%5D=-1&filter%5Bkeyword%5D=&filter%5B32%5D=1&filter%5Bcpage%5D=1&cur_cat_oid=3&expand=&navoid=136&search_database=Filter#acalog_template_course_filter" target="_blank" rel="noopener">Computer Applications (CSA)</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="#top">Back To Top</a>
|
||||
</p>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
<aside id="info">
|
||||
<h3><metadata></h3>
|
||||
<h4>
|
||||
<a href="https://insights.stackoverflow.com/survey/2018/#technology" target="_blank" rel="noopener">Most popular lang</a>
|
||||
</h4>
|
||||
<h4>
|
||||
<a href="https://www.indeed.com/jobtrends/techsoftware-category-trends" target="_blank" rel="noopener">Job Trends</a>
|
||||
</h4>
|
||||
<h4>
|
||||
<a href="https://www.naceweb.org/job-market/compensation/the-top-paid-majors-for-the-class-of-2018/" target="_blank" rel="noopener">Top Paid Majors</a>
|
||||
</h4>
|
||||
<h4>
|
||||
<a href="https://youtu.be/nKIu9yen5nc" target="_blank" rel="noopener">Get Coding!</a>
|
||||
</h4>
|
||||
<h3></metadata></h3>
|
||||
</aside>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-container">
|
||||
<footer class="wrapper">
|
||||
<p class="footerLinks">
|
||||
<a href="#top">Top</a><br/>
|
||||
<a href="#faculty">Faculty</a><br/>
|
||||
<a href="#programs">Programs</a><br/>
|
||||
<a href="#courses">Courses</a>
|
||||
</p>
|
||||
<p>
|
||||
© 2017 Norwalk Community College <br/>188 Richards Avenue <br/>Norwalk, CT 06854 <br/>203-857-7000
|
||||
</p>
|
||||
</footer>
|
||||
</div>
|
||||
<div id="instructions">
|
||||
<button onClick="hideInstructions()">X</button>
|
||||
<p>
|
||||
<img src="apple-touch-icon.png" alt="icon" />
|
||||
</p>
|
||||
<p>
|
||||
Install our app on your Home Screen for Quick Access
|
||||
</p>
|
||||
<p>
|
||||
Tap <img src="img/share.png" alt="share" /> then <img src="img/aths.png" alt="Add To Home Screen" />
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,104 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en-us">
|
||||
|
||||
<head>
|
||||
|
||||
<!-- Meta -->
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
|
||||
<title>Carta</title>
|
||||
<meta name="description" content="">
|
||||
|
||||
<!-- The compiled CSS file -->
|
||||
<link rel="stylesheet" href="css/production.css">
|
||||
|
||||
<!-- Web fonts -->
|
||||
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,700|Source+Serif+Pro:700" rel="stylesheet">
|
||||
|
||||
<!-- favicon.ico. Place these in the root directory. -->
|
||||
<link rel="shortcut icon" href="favicon.ico">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
<div class="container pt3 pb3">
|
||||
|
||||
<!-- Colors -->
|
||||
<section class="pb4 align--center">
|
||||
<h2 class="text--gray pb1 border--bottom">Colors</h2>
|
||||
<div class="pt1 pb1 text--white bg--primary-color">Primary brand color</div>
|
||||
<div class="pt1 pb1 text--white bg--secondary-color">Secondary brand color</div>
|
||||
<div class="pt1 pb1 text--white bg--tertiary-color">Brand accent color</div>
|
||||
<div class="pt1 pb1 text--white bg--darkest-gray">Darkest gray</div>
|
||||
<div class="pt1 pb1 text--white bg--dark-gray">Dark gray</div>
|
||||
<div class="pt1 pb1 text--white bg--gray">Gray</div>
|
||||
<div class="pt1 pb1 text--white bg--light-gray">Light gray</div>
|
||||
<div class="pt1 pb1 bg--lightest-gray">Lightest gray</div>
|
||||
</section>
|
||||
|
||||
<!-- Type -->
|
||||
<section class="pb4 reading-font">
|
||||
<h2 class="text--gray pb1 border--bottom">Type</h2>
|
||||
<h1>A new take on health care for small businesses.</h1>
|
||||
<h2>Heading 2</h2>
|
||||
<h3>Heading 3</h3>
|
||||
<h4>Heading 4</h4>
|
||||
<h5>Heading 5</h5>
|
||||
<h6>Heading 6</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, semper suscipit, posuere a, pede.</p>
|
||||
<p>Sed adipiscing ornare risus. Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem. Suspendisse commodo ullamcorper magna. Ut aliquam sollicitudin leo.</p>
|
||||
<blockquote class="blockquote">This is a blockquote. Suspendisse commodo ullamcorper magna.</blockquote>
|
||||
<p>Lorem <sup>superscript</sup> dolor <sub>subscript</sub> amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. <cite>cite</cite>. Donec sed tellus eget sapien fringilla nonummy. <acronym title="National Basketball Association">NBA</acronym> Morbi imperdiet augue quis tellus. Suspendisse quam sem, <abbr title="Avenue">AVE</abbr> consequat at, commodo vitae, feugiat in nunc.</p>
|
||||
<p>Morbi in sem quis dui <a class="link" href="#">placerat ornare</a>. Pellentesque odio nisi, euismod in <a class="link" href="#">pharetra</a> a, ultricies in, diam. Sed arcu. Cras consequat.</p>
|
||||
<ul class="list--indented">
|
||||
<li>Aliquam tincidunt mauris eu risus.</li>
|
||||
<li>Vestibulum auctor dapibus neque.</li>
|
||||
<li>Nunc dignissim risus id metus.</li>
|
||||
<li>Vivamus vestibulum nulla nec ante.</li>
|
||||
</ul>
|
||||
<p>Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</p>
|
||||
<ol class="list--indented m0">
|
||||
<li>Integer vitae libero ac risus egestas placerat.</li>
|
||||
<li>Praesent placerat risus quis eros.</li>
|
||||
<li>Ut aliquam sollicitudin leo.</li>
|
||||
<li>Donec quis dui at dolor tempor interdum.</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Forms -->
|
||||
<section class="pb4">
|
||||
<h2 class="text--gray pb1 border--bottom">Forms</h2>
|
||||
<form class="form">
|
||||
<input class="form-control mb1" placeholder="Name">
|
||||
<input class="form-control mb1" type="email" placeholder="Email Address">
|
||||
<input class="form-control mb1" type="subject" placeholder="Subject">
|
||||
<div class="select mb1">
|
||||
<select>
|
||||
<option selected="selected">Open this select</option>
|
||||
<option>One</option>
|
||||
<option>Two</option>
|
||||
<option>Three</option>
|
||||
</select>
|
||||
</div>
|
||||
<textarea class="form-control mb1" placeholder="Message"></textarea>
|
||||
<button class="btn btn--default">Default</button>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
<!-- Buttons -->
|
||||
<section class="pb4">
|
||||
<h2 class="text--gray pb1 border--bottom">Buttons</h2>
|
||||
<a class="btn btn--default" href="">Medium Default</a>
|
||||
<a class="btn btn--outline" href="">Medium Outline</a>
|
||||
<a class="btn btn--default btn--sm" href="">Small Default</a>
|
||||
</section>
|
||||
|
||||
</div> <!-- End container -->
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,13 +0,0 @@
|
||||
<script>
|
||||
|
||||
// Prevent from DOM clobbering.
|
||||
if ( typeof window.opener._cke_htmlToLoad == 'string' ) {
|
||||
var doc = document;
|
||||
doc.open();
|
||||
doc.write( window.opener._cke_htmlToLoad );
|
||||
doc.close();
|
||||
|
||||
delete window.opener._cke_htmlToLoad;
|
||||
}
|
||||
|
||||
</script>
|
||||
@ -1,107 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>TableResize Plugin dev sample</title>
|
||||
<script src="../../../ckeditor.js"></script>
|
||||
<link rel="stylesheet" href="../../../samples/sample.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
TableResize Plugin - dev sample
|
||||
</h1>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10">
|
||||
<table style="width: 500px;" border="1">
|
||||
<caption>
|
||||
A sample table</caption>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
Column 1</td>
|
||||
<td>
|
||||
Column 2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
You can resize a table column.</td>
|
||||
<td>
|
||||
Hover your mouse over its border.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
Watch the cursor change.</td>
|
||||
<td>
|
||||
Now click and drag to resize.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</textarea>
|
||||
|
||||
<div id="inline" contenteditable="true">
|
||||
<table style="width: 500px;" border="1">
|
||||
<caption>
|
||||
A sample table</caption>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
Column 1</td>
|
||||
<td>
|
||||
Column 2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
You can resize a table column.</td>
|
||||
<td>
|
||||
Hover your mouse over its border.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
Watch the cursor change.</td>
|
||||
<td>
|
||||
Now click and drag to resize.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<table style="width: 500px;" border="1">
|
||||
<caption>
|
||||
A sample table</caption>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
Column 1</td>
|
||||
<td>
|
||||
Column 2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
You can resize a table column.</td>
|
||||
<td>
|
||||
Hover your mouse over its border.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
Watch the cursor change.</td>
|
||||
<td>
|
||||
Now click and drag to resize.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<script>
|
||||
CKEDITOR.disableAutoInline = true;
|
||||
|
||||
CKEDITOR.replace( 'editor1', {
|
||||
extraPlugins: 'tableresize'
|
||||
} );
|
||||
|
||||
CKEDITOR.inline( 'inline', {
|
||||
extraPlugins: 'tableresize'
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,66 +0,0 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<script type="text/javascript">
|
||||
|
||||
function gup( name )
|
||||
{
|
||||
name = name.replace( /[\[]/, '\\\[' ).replace( /[\]]/, '\\\]' ) ;
|
||||
var regexS = '[\\?&]' + name + '=([^&#]*)' ;
|
||||
var regex = new RegExp( regexS ) ;
|
||||
var results = regex.exec( window.location.href ) ;
|
||||
|
||||
if ( results )
|
||||
return results[ 1 ] ;
|
||||
else
|
||||
return '' ;
|
||||
}
|
||||
|
||||
var interval;
|
||||
|
||||
function sendData2Master()
|
||||
{
|
||||
var destination = window.parent.parent ;
|
||||
try
|
||||
{
|
||||
if ( destination.XDTMaster )
|
||||
{
|
||||
var t = destination.XDTMaster.read( [ gup( 'cmd' ), gup( 'data' ) ] ) ;
|
||||
window.clearInterval( interval ) ;
|
||||
}
|
||||
}
|
||||
catch (e) {}
|
||||
}
|
||||
|
||||
function OnMessage (event) {
|
||||
var message = event.data;
|
||||
var destination = window.parent.parent;
|
||||
destination.XDTMaster.read( [ 'end', message, 'fpm' ] ) ;
|
||||
}
|
||||
|
||||
function listenPostMessage() {
|
||||
if (window.addEventListener) { // all browsers except IE before version 9
|
||||
window.addEventListener ("message", OnMessage, false);
|
||||
}else {
|
||||
if (window.attachEvent) { // IE before version 9
|
||||
window.attachEvent("onmessage", OnMessage);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onLoad()
|
||||
{
|
||||
interval = window.setInterval( sendData2Master, 100 );
|
||||
listenPostMessage();
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body onload="onLoad()"><p></p></body>
|
||||
</html>
|
||||
@ -1,52 +0,0 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<script type="text/javascript">
|
||||
|
||||
function doLoadScript( url )
|
||||
{
|
||||
if ( !url )
|
||||
return false ;
|
||||
|
||||
var s = document.createElement( "script" ) ;
|
||||
s.type = "text/javascript" ;
|
||||
s.src = url ;
|
||||
document.getElementsByTagName( "head" )[ 0 ].appendChild( s ) ;
|
||||
|
||||
return true ;
|
||||
}
|
||||
|
||||
var opener;
|
||||
function tryLoad()
|
||||
{
|
||||
opener = window.parent;
|
||||
|
||||
// get access to global parameters
|
||||
var oParams = window.opener.oldFramesetPageParams;
|
||||
|
||||
// make frameset rows string prepare
|
||||
var sFramesetRows = ( parseInt( oParams.firstframeh, 10 ) || '30') + ",*," + ( parseInt( oParams.thirdframeh, 10 ) || '150' ) + ',0' ;
|
||||
document.getElementById( 'itFrameset' ).rows = sFramesetRows ;
|
||||
|
||||
// dynamic including init frames and crossdomain transport code
|
||||
// from config sproxy_js_frameset url
|
||||
var addScriptUrl = oParams.sproxy_js_frameset ;
|
||||
doLoadScript( addScriptUrl ) ;
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<frameset id="itFrameset" onload="tryLoad();" border="0" rows="30,*,*,0">
|
||||
<frame scrolling="no" framespacing="0" frameborder="0" noresize="noresize" marginheight="0" marginwidth="2" src="" name="navbar"></frame>
|
||||
<frame scrolling="auto" framespacing="0" frameborder="0" noresize="noresize" marginheight="0" marginwidth="0" src="" name="mid"></frame>
|
||||
<frame scrolling="no" framespacing="0" frameborder="0" noresize="noresize" marginheight="1" marginwidth="1" src="" name="bot"></frame>
|
||||
<frame scrolling="no" framespacing="0" frameborder="0" noresize="noresize" marginheight="1" marginwidth="1" src="" name="spellsuggestall"></frame>
|
||||
</frameset>
|
||||
</html>
|
||||
@ -1,7 +0,0 @@
|
||||
<div id="preview">
|
||||
<div id="text">
|
||||
<h2>Lorem ipsum dolor</h2>
|
||||
<p>Sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud <a href="#">exercitation ullamco</a> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
</div>
|
||||
<div id="img"></div>
|
||||
</div>
|
||||
@ -1 +0,0 @@
|
||||
<h1>SimpleTest HTML</h1>
|
||||
@ -1 +0,0 @@
|
||||
Miaou
|
||||
@ -1,66 +0,0 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<script type="text/javascript">
|
||||
|
||||
function gup( name )
|
||||
{
|
||||
name = name.replace( /[\[]/, '\\\[' ).replace( /[\]]/, '\\\]' ) ;
|
||||
var regexS = '[\\?&]' + name + '=([^&#]*)' ;
|
||||
var regex = new RegExp( regexS ) ;
|
||||
var results = regex.exec( window.location.href ) ;
|
||||
|
||||
if ( results )
|
||||
return results[ 1 ] ;
|
||||
else
|
||||
return '' ;
|
||||
}
|
||||
|
||||
var interval;
|
||||
|
||||
function sendData2Master()
|
||||
{
|
||||
var destination = window.parent.parent ;
|
||||
try
|
||||
{
|
||||
if ( destination.XDTMaster )
|
||||
{
|
||||
var t = destination.XDTMaster.read( [ gup( 'cmd' ), gup( 'data' ) ] ) ;
|
||||
window.clearInterval( interval ) ;
|
||||
}
|
||||
}
|
||||
catch (e) {}
|
||||
}
|
||||
|
||||
function OnMessage (event) {
|
||||
var message = event.data;
|
||||
var destination = window.parent.parent;
|
||||
destination.XDTMaster.read( [ 'end', message, 'fpm' ] ) ;
|
||||
}
|
||||
|
||||
function listenPostMessage() {
|
||||
if (window.addEventListener) { // all browsers except IE before version 9
|
||||
window.addEventListener ("message", OnMessage, false);
|
||||
}else {
|
||||
if (window.attachEvent) { // IE before version 9
|
||||
window.attachEvent("onmessage", OnMessage);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onLoad()
|
||||
{
|
||||
interval = window.setInterval( sendData2Master, 100 );
|
||||
listenPostMessage();
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body onload="onLoad()"><p></p></body>
|
||||
</html>
|
||||
@ -1,52 +0,0 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<script type="text/javascript">
|
||||
|
||||
function doLoadScript( url )
|
||||
{
|
||||
if ( !url )
|
||||
return false ;
|
||||
|
||||
var s = document.createElement( "script" ) ;
|
||||
s.type = "text/javascript" ;
|
||||
s.src = url ;
|
||||
document.getElementsByTagName( "head" )[ 0 ].appendChild( s ) ;
|
||||
|
||||
return true ;
|
||||
}
|
||||
|
||||
var opener;
|
||||
function tryLoad()
|
||||
{
|
||||
opener = window.parent;
|
||||
|
||||
// get access to global parameters
|
||||
var oParams = window.opener.oldFramesetPageParams;
|
||||
|
||||
// make frameset rows string prepare
|
||||
var sFramesetRows = ( parseInt( oParams.firstframeh, 10 ) || '30') + ",*," + ( parseInt( oParams.thirdframeh, 10 ) || '150' ) + ',0' ;
|
||||
document.getElementById( 'itFrameset' ).rows = sFramesetRows ;
|
||||
|
||||
// dynamic including init frames and crossdomain transport code
|
||||
// from config sproxy_js_frameset url
|
||||
var addScriptUrl = oParams.sproxy_js_frameset ;
|
||||
doLoadScript( addScriptUrl ) ;
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<frameset id="itFrameset" onload="tryLoad();" border="0" rows="30,*,*,0">
|
||||
<frame scrolling="no" framespacing="0" frameborder="0" noresize="noresize" marginheight="0" marginwidth="2" src="" name="navbar"></frame>
|
||||
<frame scrolling="auto" framespacing="0" frameborder="0" noresize="noresize" marginheight="0" marginwidth="0" src="" name="mid"></frame>
|
||||
<frame scrolling="no" framespacing="0" frameborder="0" noresize="noresize" marginheight="1" marginwidth="1" src="" name="bot"></frame>
|
||||
<frame scrolling="no" framespacing="0" frameborder="0" noresize="noresize" marginheight="1" marginwidth="1" src="" name="spellsuggestall"></frame>
|
||||
</frameset>
|
||||
</html>
|
||||
@ -1,128 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CKEditor Sample</title>
|
||||
<script src="../ckeditor.js"></script>
|
||||
<script src="js/sample.js"></script>
|
||||
<link rel="stylesheet" href="css/samples.css">
|
||||
<link rel="stylesheet" href="toolbarconfigurator/lib/codemirror/neo.css">
|
||||
</head>
|
||||
<body id="main">
|
||||
|
||||
<nav class="navigation-a">
|
||||
<div class="grid-container">
|
||||
<ul class="navigation-a-left grid-width-70">
|
||||
<li><a href="http://ckeditor.com">Project Homepage</a></li>
|
||||
<li><a href="http://dev.ckeditor.com/">I found a bug</a></li>
|
||||
<li><a href="http://github.com/ckeditor/ckeditor-dev" class="icon-pos-right icon-navigation-a-github">Fork CKEditor on GitHub</a></li>
|
||||
</ul>
|
||||
<ul class="navigation-a-right grid-width-30">
|
||||
<li><a href="http://ckeditor.com/blog-list">CKEditor Blog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<header class="header-a">
|
||||
<div class="grid-container">
|
||||
<h1 class="header-a-logo grid-width-30">
|
||||
<a href="index.html"><img src="img/logo.png" alt="CKEditor Sample"></a>
|
||||
</h1>
|
||||
|
||||
<nav class="navigation-b grid-width-70">
|
||||
<ul>
|
||||
<li><a href="index.html" class="button-a button-a-background">Start</a></li>
|
||||
<li><a href="toolbarconfigurator/index.html" class="button-a">Toolbar configurator <span class="balloon-a balloon-a-nw">Edit your toolbar now!</span></a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div class="adjoined-top">
|
||||
<div class="grid-container">
|
||||
<div class="content grid-width-100">
|
||||
<h1>Congratulations!</h1>
|
||||
<p>
|
||||
If you can see CKEditor below, it means that the installation succeeded.
|
||||
You can now try out your new editor version, see its features, and when you are ready to move on, check some of the <a href="#sample-customize">most useful resources</a> recommended below.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="adjoined-bottom">
|
||||
<div class="grid-container">
|
||||
<div class="grid-width-100">
|
||||
<div id="editor">
|
||||
<h1>Hello world!</h1>
|
||||
<p>I'm an instance of <a href="http://ckeditor.com">CKEditor</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid-container">
|
||||
<div class="content grid-width-100">
|
||||
<section id="sample-customize">
|
||||
<h2>Customize Your Editor</h2>
|
||||
<p>Modular build and <a href="http://docs.ckeditor.com/#!/guide/dev_configuration">numerous configuration options</a> give you nearly endless possibilities to customize CKEditor. Replace the content of your <code><a href="../config.js">config.js</a></code> file with the following code and refresh this page (<strong>remember to clear the browser cache</strong>)!</p>
|
||||
<pre class="cm-s-neo CodeMirror"><code><span style="padding-right: 0.1px;"><span class="cm-variable">CKEDITOR</span>.<span class="cm-property">editorConfig</span> <span class="cm-operator">=</span> <span class="cm-keyword">function</span>( <span class="cm-def">config</span> ) {</span>
|
||||
<span style="padding-right: 0.1px;"><span class="cm-tab"> </span><span class="cm-variable-2">config</span>.<span class="cm-property">language</span> <span class="cm-operator">=</span> <span class="cm-string">'es'</span>;</span>
|
||||
<span style="padding-right: 0.1px;"><span class="cm-tab"> </span><span class="cm-variable-2">config</span>.<span class="cm-property">uiColor</span> <span class="cm-operator">=</span> <span class="cm-string">'#F7B42C'</span>;</span>
|
||||
<span style="padding-right: 0.1px;"><span class="cm-tab"> </span><span class="cm-variable-2">config</span>.<span class="cm-property">height</span> <span class="cm-operator">=</span> <span class="cm-number">300</span>;</span>
|
||||
<span style="padding-right: 0.1px;"><span class="cm-tab"> </span><span class="cm-variable-2">config</span>.<span class="cm-property">toolbarCanCollapse</span> <span class="cm-operator">=</span> <span class="cm-atom">true</span>;</span>
|
||||
<span style="padding-right: 0.1px;">};</span></code></pre>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Toolbar Configuration</h2>
|
||||
<p>If you want to reorder toolbar buttons or remove some of them, check <a href="toolbarconfigurator/index.html">this handy tool</a>!</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>More Samples!</h2>
|
||||
<p>Visit the <a href="http://sdk.ckeditor.com">CKEditor SDK</a> for a huge collection of samples showcasing editor features, with source code readily available to copy and use in your own implementation.</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Developer's Guide</h2>
|
||||
<p>The most important resource for all developers working with CKEditor, integrating it with their websites and applications, and customizing to their needs. You can start from here:</p>
|
||||
<ul>
|
||||
<li><a href="http://docs.ckeditor.com/#!/guide/dev_installation">Getting Started</a> – Explains most crucial editor concepts and practices as well as the installation process and integration with your website.</li>
|
||||
<li><a href="http://docs.ckeditor.com/#!/guide/dev_advanced_installation">Advanced Installation Concepts</a> – Describes how to upgrade, install additional components (plugins, skins), or create a custom build.</li>
|
||||
</ul>
|
||||
<p>When you have the basics sorted out, feel free to browse some more advanced sections like:</p>
|
||||
<ul>
|
||||
<li><a href="http://docs.ckeditor.com/#!/guide/dev_features">Functionality Overview</a> – Descriptions and samples of various editor features.</li>
|
||||
<li><a href="http://docs.ckeditor.com/#!/guide/plugin_sdk_intro">Plugin SDK</a>, <a href="http://docs.ckeditor.com/#!/guide/widget_sdk_intro">Widget SDK</a>, and <a href="http://docs.ckeditor.com/#!/guide/skin_sdk_intro">Skin SDK</a> – Useful when you want to create your own editor components.</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>CKEditor JavaScript API</h2>
|
||||
<p>CKEditor boasts a rich <a href="http://docs.ckeditor.com/#!/api">JavaScript API</a> that you can use to adjust the editor to your needs and integrate it with your website or application.</p>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer class="footer-a grid-container">
|
||||
<div class="grid-container">
|
||||
<p class="grid-width-100">
|
||||
CKEditor – The text editor for the Internet – <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p class="grid-width-100" id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> – Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
<script>
|
||||
initSample();
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,85 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Ajax — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link rel="stylesheet" href="sample.css">
|
||||
<script>
|
||||
|
||||
var editor, html = '';
|
||||
|
||||
function createEditor() {
|
||||
if ( editor )
|
||||
return;
|
||||
|
||||
// Create a new editor inside the <div id="editor">, setting its value to html
|
||||
var config = {};
|
||||
editor = CKEDITOR.appendTo( 'editor', config, html );
|
||||
}
|
||||
|
||||
function removeEditor() {
|
||||
if ( !editor )
|
||||
return;
|
||||
|
||||
// Retrieve the editor contents. In an Ajax application, this data would be
|
||||
// sent to the server or used in any other way.
|
||||
document.getElementById( 'editorcontents' ).innerHTML = html = editor.getData();
|
||||
document.getElementById( 'contents' ).style.display = '';
|
||||
|
||||
// Destroy the editor.
|
||||
editor.destroy();
|
||||
editor = null;
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » Create and Destroy Editor Instances for Ajax Applications
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/saveajax.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to create and destroy CKEditor instances on the fly. After the removal of CKEditor the content created inside the editing
|
||||
area will be displayed in a <code><div></code> element.
|
||||
</p>
|
||||
<p>
|
||||
For details of how to create this setup check the source code of this sample page
|
||||
for JavaScript code responsible for the creation and destruction of a CKEditor instance.
|
||||
</p>
|
||||
</div>
|
||||
<p>Click the buttons to create and remove a CKEditor instance.</p>
|
||||
<p>
|
||||
<input onclick="createEditor();" type="button" value="Create Editor">
|
||||
<input onclick="removeEditor();" type="button" value="Remove Editor">
|
||||
</p>
|
||||
<!-- This div will hold the editor. -->
|
||||
<div id="editor">
|
||||
</div>
|
||||
<div id="contents" style="display: none">
|
||||
<p>
|
||||
Edited Contents:
|
||||
</p>
|
||||
<!-- This div will be used to display the editor contents. -->
|
||||
<div id="editorcontents">
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,210 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>API Usage — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link href="sample.css" rel="stylesheet">
|
||||
<script>
|
||||
|
||||
// The instanceReady event is fired, when an instance of CKEditor has finished
|
||||
// its initialization.
|
||||
CKEDITOR.on( 'instanceReady', function( ev ) {
|
||||
// Show the editor name and description in the browser status bar.
|
||||
document.getElementById( 'eMessage' ).innerHTML = 'Instance <code>' + ev.editor.name + '<\/code> loaded.';
|
||||
|
||||
// Show this sample buttons.
|
||||
document.getElementById( 'eButtons' ).style.display = 'block';
|
||||
});
|
||||
|
||||
function InsertHTML() {
|
||||
// Get the editor instance that we want to interact with.
|
||||
var editor = CKEDITOR.instances.editor1;
|
||||
var value = document.getElementById( 'htmlArea' ).value;
|
||||
|
||||
// Check the active editing mode.
|
||||
if ( editor.mode == 'wysiwyg' )
|
||||
{
|
||||
// Insert HTML code.
|
||||
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertHtml
|
||||
editor.insertHtml( value );
|
||||
}
|
||||
else
|
||||
alert( 'You must be in WYSIWYG mode!' );
|
||||
}
|
||||
|
||||
function InsertText() {
|
||||
// Get the editor instance that we want to interact with.
|
||||
var editor = CKEDITOR.instances.editor1;
|
||||
var value = document.getElementById( 'txtArea' ).value;
|
||||
|
||||
// Check the active editing mode.
|
||||
if ( editor.mode == 'wysiwyg' )
|
||||
{
|
||||
// Insert as plain text.
|
||||
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertText
|
||||
editor.insertText( value );
|
||||
}
|
||||
else
|
||||
alert( 'You must be in WYSIWYG mode!' );
|
||||
}
|
||||
|
||||
function SetContents() {
|
||||
// Get the editor instance that we want to interact with.
|
||||
var editor = CKEDITOR.instances.editor1;
|
||||
var value = document.getElementById( 'htmlArea' ).value;
|
||||
|
||||
// Set editor contents (replace current contents).
|
||||
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-setData
|
||||
editor.setData( value );
|
||||
}
|
||||
|
||||
function GetContents() {
|
||||
// Get the editor instance that you want to interact with.
|
||||
var editor = CKEDITOR.instances.editor1;
|
||||
|
||||
// Get editor contents
|
||||
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-getData
|
||||
alert( editor.getData() );
|
||||
}
|
||||
|
||||
function ExecuteCommand( commandName ) {
|
||||
// Get the editor instance that we want to interact with.
|
||||
var editor = CKEDITOR.instances.editor1;
|
||||
|
||||
// Check the active editing mode.
|
||||
if ( editor.mode == 'wysiwyg' )
|
||||
{
|
||||
// Execute the command.
|
||||
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-execCommand
|
||||
editor.execCommand( commandName );
|
||||
}
|
||||
else
|
||||
alert( 'You must be in WYSIWYG mode!' );
|
||||
}
|
||||
|
||||
function CheckDirty() {
|
||||
// Get the editor instance that we want to interact with.
|
||||
var editor = CKEDITOR.instances.editor1;
|
||||
// Checks whether the current editor contents present changes when compared
|
||||
// to the contents loaded into the editor at startup
|
||||
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-checkDirty
|
||||
alert( editor.checkDirty() );
|
||||
}
|
||||
|
||||
function ResetDirty() {
|
||||
// Get the editor instance that we want to interact with.
|
||||
var editor = CKEDITOR.instances.editor1;
|
||||
// Resets the "dirty state" of the editor (see CheckDirty())
|
||||
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-resetDirty
|
||||
editor.resetDirty();
|
||||
alert( 'The "IsDirty" status has been reset' );
|
||||
}
|
||||
|
||||
function Focus() {
|
||||
CKEDITOR.instances.editor1.focus();
|
||||
}
|
||||
|
||||
function onFocus() {
|
||||
document.getElementById( 'eMessage' ).innerHTML = '<b>' + this.name + ' is focused </b>';
|
||||
}
|
||||
|
||||
function onBlur() {
|
||||
document.getElementById( 'eMessage' ).innerHTML = this.name + ' lost focus';
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » Using CKEditor JavaScript API
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/api.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to use the
|
||||
<a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.editor">CKEditor JavaScript API</a>
|
||||
to interact with the editor at runtime.
|
||||
</p>
|
||||
<p>
|
||||
For details on how to create this setup check the source code of this sample page.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<form action="../../../samples/sample_posteddata.php" method="post">
|
||||
<textarea cols="100" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
|
||||
<script>
|
||||
// Replace the <textarea id="editor1"> with an CKEditor instance.
|
||||
CKEDITOR.replace( 'editor1', {
|
||||
on: {
|
||||
focus: onFocus,
|
||||
blur: onBlur,
|
||||
|
||||
// Check for availability of corresponding plugins.
|
||||
pluginsLoaded: function( evt ) {
|
||||
var doc = CKEDITOR.document, ed = evt.editor;
|
||||
if ( !ed.getCommand( 'bold' ) )
|
||||
doc.getById( 'exec-bold' ).hide();
|
||||
if ( !ed.getCommand( 'link' ) )
|
||||
doc.getById( 'exec-link' ).hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<p id="eMessage">
|
||||
</p>
|
||||
|
||||
<div id="eButtons" style="display: none">
|
||||
<input id="exec-bold" onclick="ExecuteCommand('bold');" type="button" value="Execute "bold" Command">
|
||||
<input id="exec-link" onclick="ExecuteCommand('link');" type="button" value="Execute "link" Command">
|
||||
<input onclick="Focus();" type="button" value="Focus">
|
||||
<br><br>
|
||||
<input onclick="InsertHTML();" type="button" value="Insert HTML">
|
||||
<input onclick="SetContents();" type="button" value="Set Editor Contents">
|
||||
<input onclick="GetContents();" type="button" value="Get Editor Contents (HTML)">
|
||||
<br>
|
||||
<textarea cols="100" id="htmlArea" rows="3"><h2>Test</h2><p>This is some <a href="/Test1.html">sample</a> HTML code.</p></textarea>
|
||||
<br>
|
||||
<br>
|
||||
<input onclick="InsertText();" type="button" value="Insert Text">
|
||||
<br>
|
||||
<textarea cols="100" id="txtArea" rows="3"> First line with some leading whitespaces.
|
||||
|
||||
Second line of text preceded by two line breaks.</textarea>
|
||||
<br>
|
||||
<br>
|
||||
<input onclick="CheckDirty();" type="button" value="checkDirty()">
|
||||
<input onclick="ResetDirty();" type="button" value="resetDirty()">
|
||||
</div>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,59 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Append To Page Element Using JavaScript Code — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link rel="stylesheet" href="sample.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » Append To Page Element Using JavaScript Code
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out the <a href="http://sdk.ckeditor.com/">brand new samples in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div id="section1">
|
||||
<div class="description">
|
||||
<p>
|
||||
The <code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR-method-appendTo">CKEDITOR.appendTo()</a></code> method serves to to place editors inside existing DOM elements. Unlike <code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR-method-replace">CKEDITOR.replace()</a></code>,
|
||||
a target container to be replaced is no longer necessary. A new editor
|
||||
instance is inserted directly wherever it is desired.
|
||||
</p>
|
||||
<pre class="samples">CKEDITOR.appendTo( '<em>container_id</em>',
|
||||
{ /* Configuration options to be used. */ }
|
||||
'Editor content to be used.'
|
||||
);</pre>
|
||||
</div>
|
||||
<script>
|
||||
|
||||
// This call can be placed at any point after the
|
||||
// DOM element to append CKEditor to or inside the <head><script>
|
||||
// in a window.onload event handler.
|
||||
|
||||
// Append a CKEditor instance using the default configuration and the
|
||||
// provided content to the <div> element of ID "section1".
|
||||
CKEDITOR.appendTo( 'section1',
|
||||
null,
|
||||
'<p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p>'
|
||||
);
|
||||
|
||||
</script>
|
||||
</div>
|
||||
<br>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
@ -1,190 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Using API to Customize Dialog Windows — CKEditor Sample</title>
|
||||
<script src="../../../ckeditor.js"></script>
|
||||
<link rel="stylesheet" href="../../../samples/old/sample.css">
|
||||
<meta name="ckeditor-sample-name" content="Using the JavaScript API to customize dialog windows">
|
||||
<meta name="ckeditor-sample-group" content="Advanced Samples">
|
||||
<meta name="ckeditor-sample-description" content="Using the dialog windows API to customize dialog windows without changing the original editor code.">
|
||||
<style>
|
||||
|
||||
.cke_button__mybutton_icon
|
||||
{
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.cke_button__mybutton_label
|
||||
{
|
||||
display: inline !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
<script>
|
||||
|
||||
CKEDITOR.on( 'instanceCreated', function( ev ){
|
||||
var editor = ev.editor;
|
||||
|
||||
// Listen for the "pluginsLoaded" event, so we are sure that the
|
||||
// "dialog" plugin has been loaded and we are able to do our
|
||||
// customizations.
|
||||
editor.on( 'pluginsLoaded', function() {
|
||||
|
||||
// If our custom dialog has not been registered, do that now.
|
||||
if ( !CKEDITOR.dialog.exists( 'myDialog' ) ) {
|
||||
// We need to do the following trick to find out the dialog
|
||||
// definition file URL path. In the real world, you would simply
|
||||
// point to an absolute path directly, like "/mydir/mydialog.js".
|
||||
var href = document.location.href.split( '/' );
|
||||
href.pop();
|
||||
href.push( 'assets/my_dialog.js' );
|
||||
href = href.join( '/' );
|
||||
|
||||
// Finally, register the dialog.
|
||||
CKEDITOR.dialog.add( 'myDialog', href );
|
||||
}
|
||||
|
||||
// Register the command used to open the dialog.
|
||||
editor.addCommand( 'myDialogCmd', new CKEDITOR.dialogCommand( 'myDialog' ) );
|
||||
|
||||
// Add the a custom toolbar buttons, which fires the above
|
||||
// command..
|
||||
editor.ui.add( 'MyButton', CKEDITOR.UI_BUTTON, {
|
||||
label: 'My Dialog',
|
||||
command: 'myDialogCmd'
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// When opening a dialog, its "definition" is created for it, for
|
||||
// each editor instance. The "dialogDefinition" event is then
|
||||
// fired. We should use this event to make customizations to the
|
||||
// definition of existing dialogs.
|
||||
CKEDITOR.on( 'dialogDefinition', function( ev ) {
|
||||
// Take the dialog name and its definition from the event data.
|
||||
var dialogName = ev.data.name;
|
||||
var dialogDefinition = ev.data.definition;
|
||||
|
||||
// Check if the definition is from the dialog we're
|
||||
// interested on (the "Link" dialog).
|
||||
if ( dialogName == 'myDialog' && ev.editor.name == 'editor2' ) {
|
||||
// Get a reference to the "Link Info" tab.
|
||||
var infoTab = dialogDefinition.getContents( 'tab1' );
|
||||
|
||||
// Add a new text field to the "tab1" tab page.
|
||||
infoTab.add( {
|
||||
type: 'text',
|
||||
label: 'My Custom Field',
|
||||
id: 'customField',
|
||||
'default': 'Sample!',
|
||||
validate: function() {
|
||||
if ( ( /\d/ ).test( this.getValue() ) )
|
||||
return 'My Custom Field must not contain digits';
|
||||
}
|
||||
});
|
||||
|
||||
// Remove the "select1" field from the "tab1" tab.
|
||||
infoTab.remove( 'select1' );
|
||||
|
||||
// Set the default value for "input1" field.
|
||||
var input1 = infoTab.get( 'input1' );
|
||||
input1[ 'default' ] = 'www.example.com';
|
||||
|
||||
// Remove the "tab2" tab page.
|
||||
dialogDefinition.removeContents( 'tab2' );
|
||||
|
||||
// Add a new tab to the "Link" dialog.
|
||||
dialogDefinition.addContents( {
|
||||
id: 'customTab',
|
||||
label: 'My Tab',
|
||||
accessKey: 'M',
|
||||
elements: [
|
||||
{
|
||||
id: 'myField1',
|
||||
type: 'text',
|
||||
label: 'My Text Field'
|
||||
},
|
||||
{
|
||||
id: 'myField2',
|
||||
type: 'text',
|
||||
label: 'Another Text Field'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
// Provide the focus handler to start initial focus in "customField" field.
|
||||
dialogDefinition.onFocus = function() {
|
||||
var urlField = this.getContentElement( 'tab1', 'customField' );
|
||||
urlField.select();
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
var config = {
|
||||
extraPlugins: 'dialog',
|
||||
toolbar: [ [ 'MyButton' ] ]
|
||||
};
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="../../../samples/old/index.html">CKEditor Samples</a> » Using CKEditor Dialog API
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out the <a href="http://sdk.ckeditor.com/">brand new samples in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to use the
|
||||
<a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.dialog">CKEditor Dialog API</a>
|
||||
to customize CKEditor dialog windows without changing the original editor code.
|
||||
The following customizations are being done in the example below:
|
||||
</p>
|
||||
<p>
|
||||
For details on how to create this setup check the source code of this sample page.
|
||||
</p>
|
||||
</div>
|
||||
<p>A custom dialog is added to the editors using the <code>pluginsLoaded</code> event, from an external <a target="_blank" href="assets/my_dialog.js">dialog definition file</a>:</p>
|
||||
<ol>
|
||||
<li><strong>Creating a custom dialog window</strong> – "My Dialog" dialog window opened with the "My Dialog" toolbar button.</li>
|
||||
<li><strong>Creating a custom button</strong> – Add button to open the dialog with "My Dialog" toolbar button.</li>
|
||||
</ol>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<script>
|
||||
// Replace the <textarea id="editor1"> with an CKEditor instance.
|
||||
CKEDITOR.replace( 'editor1', config );
|
||||
</script>
|
||||
<p>The below editor modify the dialog definition of the above added dialog using the <code>dialogDefinition</code> event:</p>
|
||||
<ol>
|
||||
<li><strong>Adding dialog tab</strong> – Add new tab "My Tab" to dialog window.</li>
|
||||
<li><strong>Removing a dialog window tab</strong> – Remove "Second Tab" page from the dialog window.</li>
|
||||
<li><strong>Adding dialog window fields</strong> – Add "My Custom Field" to the dialog window.</li>
|
||||
<li><strong>Removing dialog window field</strong> – Remove "Select Field" selection field from the dialog window.</li>
|
||||
<li><strong>Setting default values for dialog window fields</strong> – Set default value of "Text Field" text field. </li>
|
||||
<li><strong>Setup initial focus for dialog window</strong> – Put initial focus on "My Custom Field" text field. </li>
|
||||
</ol>
|
||||
<textarea cols="80" id="editor2" name="editor2" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<script>
|
||||
|
||||
// Replace the <textarea id="editor1"> with an CKEditor instance.
|
||||
CKEDITOR.replace( 'editor2', config );
|
||||
|
||||
</script>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,144 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Replace DIV — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link href="sample.css" rel="stylesheet">
|
||||
<style>
|
||||
|
||||
div.editable
|
||||
{
|
||||
border: solid 2px transparent;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
div.editable:hover
|
||||
{
|
||||
border-color: black;
|
||||
}
|
||||
|
||||
</style>
|
||||
<script>
|
||||
|
||||
// Uncomment the following code to test the "Timeout Loading Method".
|
||||
// CKEDITOR.loadFullCoreTimeout = 5;
|
||||
|
||||
window.onload = function() {
|
||||
// Listen to the double click event.
|
||||
if ( window.addEventListener )
|
||||
document.body.addEventListener( 'dblclick', onDoubleClick, false );
|
||||
else if ( window.attachEvent )
|
||||
document.body.attachEvent( 'ondblclick', onDoubleClick );
|
||||
|
||||
};
|
||||
|
||||
function onDoubleClick( ev ) {
|
||||
// Get the element which fired the event. This is not necessarily the
|
||||
// element to which the event has been attached.
|
||||
var element = ev.target || ev.srcElement;
|
||||
|
||||
// Find out the div that holds this element.
|
||||
var name;
|
||||
|
||||
do {
|
||||
element = element.parentNode;
|
||||
}
|
||||
while ( element && ( name = element.nodeName.toLowerCase() ) &&
|
||||
( name != 'div' || element.className.indexOf( 'editable' ) == -1 ) && name != 'body' );
|
||||
|
||||
if ( name == 'div' && element.className.indexOf( 'editable' ) != -1 )
|
||||
replaceDiv( element );
|
||||
}
|
||||
|
||||
var editor;
|
||||
|
||||
function replaceDiv( div ) {
|
||||
if ( editor )
|
||||
editor.destroy();
|
||||
|
||||
editor = CKEDITOR.replace( div );
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » Replace DIV with CKEditor on the Fly
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out the <a href="http://sdk.ckeditor.com/">brand new samples in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to automatically replace <code><div></code> elements
|
||||
with a CKEditor instance on the fly, following user's doubleclick. The content
|
||||
that was previously placed inside the <code><div></code> element will now
|
||||
be moved into CKEditor editing area.
|
||||
</p>
|
||||
<p>
|
||||
For details on how to create this setup check the source code of this sample page.
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
Double-click any of the following <code><div></code> elements to transform them into
|
||||
editor instances.
|
||||
</p>
|
||||
<div class="editable">
|
||||
<h3>
|
||||
Part 1
|
||||
</h3>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras et ipsum quis mi
|
||||
semper accumsan. Integer pretium dui id massa. Suspendisse in nisl sit amet urna
|
||||
rutrum imperdiet. Nulla eu tellus. Donec ante nisi, ullamcorper quis, fringilla
|
||||
nec, sagittis eleifend, pede. Nulla commodo interdum massa. Donec id metus. Fusce
|
||||
eu ipsum. Suspendisse auctor. Phasellus fermentum porttitor risus.
|
||||
</p>
|
||||
</div>
|
||||
<div class="editable">
|
||||
<h3>
|
||||
Part 2
|
||||
</h3>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras et ipsum quis mi
|
||||
semper accumsan. Integer pretium dui id massa. Suspendisse in nisl sit amet urna
|
||||
rutrum imperdiet. Nulla eu tellus. Donec ante nisi, ullamcorper quis, fringilla
|
||||
nec, sagittis eleifend, pede. Nulla commodo interdum massa. Donec id metus. Fusce
|
||||
eu ipsum. Suspendisse auctor. Phasellus fermentum porttitor risus.
|
||||
</p>
|
||||
<p>
|
||||
Donec velit. Mauris massa. Vestibulum non nulla. Nam suscipit arcu nec elit. Phasellus
|
||||
sollicitudin iaculis ante. Ut non mauris et sapien tincidunt adipiscing. Vestibulum
|
||||
vitae leo. Suspendisse nec mi tristique nulla laoreet vulputate.
|
||||
</p>
|
||||
</div>
|
||||
<div class="editable">
|
||||
<h3>
|
||||
Part 3
|
||||
</h3>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras et ipsum quis mi
|
||||
semper accumsan. Integer pretium dui id massa. Suspendisse in nisl sit amet urna
|
||||
rutrum imperdiet. Nulla eu tellus. Donec ante nisi, ullamcorper quis, fringilla
|
||||
nec, sagittis eleifend, pede. Nulla commodo interdum massa. Donec id metus. Fusce
|
||||
eu ipsum. Suspendisse auctor. Phasellus fermentum porttitor risus.
|
||||
</p>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,106 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>ENTER Key Configuration — CKEditor Sample</title>
|
||||
<script src="../../../ckeditor.js"></script>
|
||||
<link href="../../../samples/old/sample.css" rel="stylesheet">
|
||||
<meta name="ckeditor-sample-name" content="Using the "Enter" key in CKEditor">
|
||||
<meta name="ckeditor-sample-group" content="Advanced Samples">
|
||||
<meta name="ckeditor-sample-description" content="Configuring the behavior of <em>Enter</em> and <em>Shift+Enter</em> keys.">
|
||||
<script>
|
||||
|
||||
var editor;
|
||||
|
||||
function changeEnter() {
|
||||
// If we already have an editor, let's destroy it first.
|
||||
if ( editor )
|
||||
editor.destroy( true );
|
||||
|
||||
// Create the editor again, with the appropriate settings.
|
||||
editor = CKEDITOR.replace( 'editor1', {
|
||||
extraPlugins: 'enterkey',
|
||||
enterMode: Number( document.getElementById( 'xEnter' ).value ),
|
||||
shiftEnterMode: Number( document.getElementById( 'xShiftEnter' ).value )
|
||||
});
|
||||
}
|
||||
|
||||
window.onload = changeEnter;
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="../../../samples/old/index.html">CKEditor Samples</a> » ENTER Key Configuration
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/enterkey.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to configure the <em>Enter</em> and <em>Shift+Enter</em> keys
|
||||
to perform actions specified in the
|
||||
<a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-enterMode"><code>enterMode</code></a>
|
||||
and <a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-shiftEnterMode"><code>shiftEnterMode</code></a>
|
||||
parameters, respectively.
|
||||
You can choose from the following options:
|
||||
</p>
|
||||
<ul class="samples">
|
||||
<li><strong><code>ENTER_P</code></strong> – new <code><p></code> paragraphs are created;</li>
|
||||
<li><strong><code>ENTER_BR</code></strong> – lines are broken with <code><br></code> elements;</li>
|
||||
<li><strong><code>ENTER_DIV</code></strong> – new <code><div></code> blocks are created.</li>
|
||||
</ul>
|
||||
<p>
|
||||
The sample code below shows how to configure CKEditor to create a <code><div></code> block when <em>Enter</em> key is pressed.
|
||||
</p>
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( '<em>textarea_id</em>', {
|
||||
<strong>enterMode: CKEDITOR.ENTER_DIV</strong>
|
||||
});</pre>
|
||||
<p>
|
||||
Note that <code><em>textarea_id</em></code> in the code above is the <code>id</code> attribute of
|
||||
the <code><textarea></code> element to be replaced.
|
||||
</p>
|
||||
</div>
|
||||
<div style="float: left; margin-right: 20px">
|
||||
When <em>Enter</em> is pressed:<br>
|
||||
<select id="xEnter" onchange="changeEnter();">
|
||||
<option selected="selected" value="1">Create a new <P> (recommended)</option>
|
||||
<option value="3">Create a new <DIV></option>
|
||||
<option value="2">Break the line with a <BR></option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="float: left">
|
||||
When <em>Shift+Enter</em> is pressed:<br>
|
||||
<select id="xShiftEnter" onchange="changeEnter();">
|
||||
<option value="1">Create a new <P></option>
|
||||
<option value="3">Create a new <DIV></option>
|
||||
<option selected="selected" value="2">Break the line with a <BR> (recommended)</option>
|
||||
</select>
|
||||
</div>
|
||||
<br style="clear: both">
|
||||
<form action="../../../samples/sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<br>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10">This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</textarea>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit">
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,283 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Output for Flash — CKEditor Sample</title>
|
||||
<script src="../../../ckeditor.js"></script>
|
||||
<script src="../../../samples/old/sample.js"></script>
|
||||
<script src="assets/outputforflash/swfobject.js"></script>
|
||||
<link href="../../../samples/old/sample.css" rel="stylesheet">
|
||||
<meta name="ckeditor-sample-required-plugins" content="sourcearea">
|
||||
<meta name="ckeditor-sample-name" content="Output for Flash">
|
||||
<meta name="ckeditor-sample-group" content="Advanced Samples">
|
||||
<meta name="ckeditor-sample-description" content="Configuring CKEditor to produce HTML code that can be used with Adobe Flash.">
|
||||
<style>
|
||||
|
||||
.alert
|
||||
{
|
||||
background: #ffa84c;
|
||||
padding: 10px 15px;
|
||||
font-weight: bold;
|
||||
display: block;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="../../../samples/old/index.html">CKEditor Samples</a> » Producing Flash Compliant HTML Output
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out the <a href="http://sdk.ckeditor.com/">brand new samples in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to configure CKEditor to output
|
||||
HTML code that can be used with
|
||||
<a class="samples" href="http://www.adobe.com/livedocs/flash/9.0/main/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00000922.html">
|
||||
Adobe Flash</a>.
|
||||
The code will contain a subset of standard HTML elements like <code><b></code>,
|
||||
<code><i></code>, and <code><p></code> as well as HTML attributes.
|
||||
</p>
|
||||
<p>
|
||||
To add a CKEditor instance outputting Flash compliant HTML code, load the editor using a standard
|
||||
JavaScript call, and define CKEditor features to use HTML elements and attributes.
|
||||
</p>
|
||||
<p>
|
||||
For details on how to create this setup check the source code of this sample page.
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
To see how it works, create some content in the editing area of CKEditor on the left
|
||||
and send it to the Flash object on the right side of the page by using the
|
||||
<strong>Send to Flash</strong> button.
|
||||
</p>
|
||||
<table style="width: 100%; border-spacing: 0; border-collapse:collapse;">
|
||||
<tr>
|
||||
<td style="width: 100%">
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p><b><font size="18" style="font-size:18px;">Flash and HTML</font></b></p><p>&nbsp;</p><p>It is possible to have <a href="http://ckeditor.com">CKEditor</a> creating content that will be later loaded inside <b>Flash</b> objects and animations.</p><p>&nbsp;</p><p>Flash has a few limitations when dealing with HTML:</p><p>&nbsp;</p><ul><li>It has limited support on tags.</li><li>There is no margin between block elements, like paragraphs.</li></ul></textarea>
|
||||
<script>
|
||||
|
||||
if ( document.location.protocol == 'file:' )
|
||||
alert( 'Warning: This samples does not work when loaded from local filesystem' +
|
||||
'due to security restrictions implemented in Flash.' +
|
||||
'\n\nPlease load the sample from a web server instead.' );
|
||||
|
||||
var editor = CKEDITOR.replace( 'editor1', {
|
||||
/*
|
||||
* Ensure that htmlwriter plugin, which is required for this sample, is loaded.
|
||||
*/
|
||||
extraPlugins: 'htmlwriter',
|
||||
|
||||
height: 290,
|
||||
width: '100%',
|
||||
toolbar: [
|
||||
[ 'Source', '-', 'Bold', 'Italic', 'Underline', '-', 'BulletedList', '-', 'Link', 'Unlink' ],
|
||||
[ 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ],
|
||||
'/',
|
||||
[ 'Font', 'FontSize' ],
|
||||
[ 'TextColor', '-', 'About' ]
|
||||
],
|
||||
|
||||
/*
|
||||
* Style sheet for the contents
|
||||
*/
|
||||
contentsCss: 'body {color:#000; background-color#FFF; font-family: Arial; font-size:80%;} p, ol, ul {margin-top: 0px; margin-bottom: 0px;}',
|
||||
|
||||
/*
|
||||
* Quirks doctype
|
||||
*/
|
||||
docType: '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">',
|
||||
|
||||
/*
|
||||
* Core styles.
|
||||
*/
|
||||
coreStyles_bold: { element: 'b' },
|
||||
coreStyles_italic: { element: 'i' },
|
||||
coreStyles_underline: { element: 'u' },
|
||||
|
||||
/*
|
||||
* Font face.
|
||||
*/
|
||||
|
||||
// Define the way font elements will be applied to the document. The "font"
|
||||
// element will be used.
|
||||
font_style: {
|
||||
element: 'font',
|
||||
attributes: { 'face': '#(family)' }
|
||||
},
|
||||
|
||||
/*
|
||||
* Font sizes.
|
||||
*/
|
||||
|
||||
// The CSS part of the font sizes isn't used by Flash, it is there to get the
|
||||
// font rendered correctly in CKEditor.
|
||||
fontSize_sizes: '8px/8;9px/9;10px/10;11px/11;12px/12;14px/14;16px/16;18px/18;20px/20;22px/22;24px/24;26px/26;28px/28;36px/36;48px/48;72px/72',
|
||||
fontSize_style: {
|
||||
element: 'font',
|
||||
attributes: { 'size': '#(size)' },
|
||||
styles: { 'font-size': '#(size)px' }
|
||||
} ,
|
||||
|
||||
/*
|
||||
* Font colors.
|
||||
*/
|
||||
colorButton_enableMore: true,
|
||||
|
||||
colorButton_foreStyle: {
|
||||
element: 'font',
|
||||
attributes: { 'color': '#(color)' }
|
||||
},
|
||||
|
||||
colorButton_backStyle: {
|
||||
element: 'font',
|
||||
styles: { 'background-color': '#(color)' }
|
||||
},
|
||||
|
||||
on: { 'instanceReady': configureFlashOutput }
|
||||
});
|
||||
|
||||
/*
|
||||
* Adjust the behavior of the dataProcessor to match the
|
||||
* requirements of Flash
|
||||
*/
|
||||
function configureFlashOutput( ev ) {
|
||||
var editor = ev.editor,
|
||||
dataProcessor = editor.dataProcessor,
|
||||
htmlFilter = dataProcessor && dataProcessor.htmlFilter;
|
||||
|
||||
// Out self closing tags the HTML4 way, like <br>.
|
||||
dataProcessor.writer.selfClosingEnd = '>';
|
||||
|
||||
// Make output formatting match Flash expectations
|
||||
var dtd = CKEDITOR.dtd;
|
||||
for ( var e in CKEDITOR.tools.extend( {}, dtd.$nonBodyContent, dtd.$block, dtd.$listItem, dtd.$tableContent ) ) {
|
||||
dataProcessor.writer.setRules( e, {
|
||||
indent: false,
|
||||
breakBeforeOpen: false,
|
||||
breakAfterOpen: false,
|
||||
breakBeforeClose: false,
|
||||
breakAfterClose: false
|
||||
});
|
||||
}
|
||||
dataProcessor.writer.setRules( 'br', {
|
||||
indent: false,
|
||||
breakBeforeOpen: false,
|
||||
breakAfterOpen: false,
|
||||
breakBeforeClose: false,
|
||||
breakAfterClose: false
|
||||
});
|
||||
|
||||
// Output properties as attributes, not styles.
|
||||
htmlFilter.addRules( {
|
||||
elements: {
|
||||
$: function( element ) {
|
||||
var style, match, width, height, align;
|
||||
|
||||
// Output dimensions of images as width and height
|
||||
if ( element.name == 'img' ) {
|
||||
style = element.attributes.style;
|
||||
|
||||
if ( style ) {
|
||||
// Get the width from the style.
|
||||
match = ( /(?:^|\s)width\s*:\s*(\d+)px/i ).exec( style );
|
||||
width = match && match[1];
|
||||
|
||||
// Get the height from the style.
|
||||
match = ( /(?:^|\s)height\s*:\s*(\d+)px/i ).exec( style );
|
||||
height = match && match[1];
|
||||
|
||||
if ( width ) {
|
||||
element.attributes.style = element.attributes.style.replace( /(?:^|\s)width\s*:\s*(\d+)px;?/i , '' );
|
||||
element.attributes.width = width;
|
||||
}
|
||||
|
||||
if ( height ) {
|
||||
element.attributes.style = element.attributes.style.replace( /(?:^|\s)height\s*:\s*(\d+)px;?/i , '' );
|
||||
element.attributes.height = height;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Output alignment of paragraphs using align
|
||||
if ( element.name == 'p' ) {
|
||||
style = element.attributes.style;
|
||||
|
||||
if ( style ) {
|
||||
// Get the align from the style.
|
||||
match = ( /(?:^|\s)text-align\s*:\s*(\w*);?/i ).exec( style );
|
||||
align = match && match[1];
|
||||
|
||||
if ( align ) {
|
||||
element.attributes.style = element.attributes.style.replace( /(?:^|\s)text-align\s*:\s*(\w*);?/i , '' );
|
||||
element.attributes.align = align;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if ( element.attributes.style === '' )
|
||||
delete element.attributes.style;
|
||||
|
||||
return element;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function sendToFlash() {
|
||||
var html = CKEDITOR.instances.editor1.getData() ;
|
||||
|
||||
// Quick fix for link color.
|
||||
html = html.replace( /<a /g, '<font color="#0000FF"><u><a ' )
|
||||
html = html.replace( /<\/a>/g, '</a></u></font>' )
|
||||
|
||||
var flash = document.getElementById( 'ckFlashContainer' ) ;
|
||||
flash.setData( html ) ;
|
||||
}
|
||||
|
||||
CKEDITOR.domReady( function() {
|
||||
if ( !swfobject.hasFlashPlayerVersion( '8' ) ) {
|
||||
CKEDITOR.dom.element.createFromHtml( '<span class="alert">' +
|
||||
'At least Adobe Flash Player 8 is required to run this sample. ' +
|
||||
'You can download it from <a href="http://get.adobe.com/flashplayer">Adobe\'s website</a>.' +
|
||||
'</span>' ).insertBefore( editor.element );
|
||||
}
|
||||
|
||||
swfobject.embedSWF(
|
||||
'assets/outputforflash/outputforflash.swf',
|
||||
'ckFlashContainer',
|
||||
'550',
|
||||
'400',
|
||||
'8',
|
||||
{ wmode: 'transparent' }
|
||||
);
|
||||
});
|
||||
|
||||
</script>
|
||||
<p>
|
||||
<input type="button" value="Send to Flash" onclick="sendToFlash();">
|
||||
</p>
|
||||
</td>
|
||||
<td style="vertical-align: top; padding-left: 20px">
|
||||
<div id="ckFlashContainer"></div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,224 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>HTML Compliant Output — CKEditor Sample</title>
|
||||
<script src="../../../ckeditor.js"></script>
|
||||
<script src="../../../samples/old/sample.js"></script>
|
||||
<link href="../../../samples/old/sample.css" rel="stylesheet">
|
||||
<meta name="ckeditor-sample-required-plugins" content="sourcearea">
|
||||
<meta name="ckeditor-sample-name" content="Output HTML">
|
||||
<meta name="ckeditor-sample-group" content="Advanced Samples">
|
||||
<meta name="ckeditor-sample-description" content="Configuring CKEditor to produce legacy HTML 4 code.">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="../../../samples/old/index.html">CKEditor Samples</a> » Producing HTML Compliant Output
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out the <a href="http://sdk.ckeditor.com/">brand new samples in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to configure CKEditor to output valid
|
||||
<a class="samples" href="http://www.w3.org/TR/html401/">HTML 4.01</a> code.
|
||||
Traditional HTML elements like <code><b></code>,
|
||||
<code><i></code>, and <code><font></code> are used in place of
|
||||
<code><strong></code>, <code><em></code>, and CSS styles.
|
||||
</p>
|
||||
<p>
|
||||
To add a CKEditor instance outputting legacy HTML 4.01 code, load the editor using a standard
|
||||
JavaScript call, and define CKEditor features to use the HTML compliant elements and attributes.
|
||||
</p>
|
||||
<p>
|
||||
A snippet of the configuration code can be seen below; check the source of this page for
|
||||
full definition:
|
||||
</p>
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( '<em>textarea_id</em>', {
|
||||
coreStyles_bold: { element: 'b' },
|
||||
coreStyles_italic: { element: 'i' },
|
||||
|
||||
fontSize_style: {
|
||||
element: 'font',
|
||||
attributes: { 'size': '#(size)' }
|
||||
}
|
||||
|
||||
...
|
||||
});</pre>
|
||||
</div>
|
||||
<form action="../../../samples/sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<label for="editor1">
|
||||
Editor 1:
|
||||
</label>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <b>sample text</b>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<script>
|
||||
|
||||
CKEDITOR.replace( 'editor1', {
|
||||
/*
|
||||
* Ensure that htmlwriter plugin, which is required for this sample, is loaded.
|
||||
*/
|
||||
extraPlugins: 'htmlwriter',
|
||||
|
||||
/*
|
||||
* Style sheet for the contents
|
||||
*/
|
||||
contentsCss: 'body {color:#000; background-color#:FFF;}',
|
||||
|
||||
/*
|
||||
* Simple HTML5 doctype
|
||||
*/
|
||||
docType: '<!DOCTYPE HTML>',
|
||||
|
||||
/*
|
||||
* Allowed content rules which beside limiting allowed HTML
|
||||
* will also take care of transforming styles to attributes
|
||||
* (currently only for img - see transformation rules defined below).
|
||||
*
|
||||
* Read more: http://docs.ckeditor.com/#!/guide/dev_advanced_content_filter
|
||||
*/
|
||||
allowedContent:
|
||||
'h1 h2 h3 p pre[align]; ' +
|
||||
'blockquote code kbd samp var del ins cite q b i u strike ul ol li hr table tbody tr td th caption; ' +
|
||||
'img[!src,alt,align,width,height]; font[!face]; font[!family]; font[!color]; font[!size]; font{!background-color}; a[!href]; a[!name]',
|
||||
|
||||
/*
|
||||
* Core styles.
|
||||
*/
|
||||
coreStyles_bold: { element: 'b' },
|
||||
coreStyles_italic: { element: 'i' },
|
||||
coreStyles_underline: { element: 'u' },
|
||||
coreStyles_strike: { element: 'strike' },
|
||||
|
||||
/*
|
||||
* Font face.
|
||||
*/
|
||||
|
||||
// Define the way font elements will be applied to the document.
|
||||
// The "font" element will be used.
|
||||
font_style: {
|
||||
element: 'font',
|
||||
attributes: { 'face': '#(family)' }
|
||||
},
|
||||
|
||||
/*
|
||||
* Font sizes.
|
||||
*/
|
||||
fontSize_sizes: 'xx-small/1;x-small/2;small/3;medium/4;large/5;x-large/6;xx-large/7',
|
||||
fontSize_style: {
|
||||
element: 'font',
|
||||
attributes: { 'size': '#(size)' }
|
||||
},
|
||||
|
||||
/*
|
||||
* Font colors.
|
||||
*/
|
||||
|
||||
colorButton_foreStyle: {
|
||||
element: 'font',
|
||||
attributes: { 'color': '#(color)' }
|
||||
},
|
||||
|
||||
colorButton_backStyle: {
|
||||
element: 'font',
|
||||
styles: { 'background-color': '#(color)' }
|
||||
},
|
||||
|
||||
/*
|
||||
* Styles combo.
|
||||
*/
|
||||
stylesSet: [
|
||||
{ name: 'Computer Code', element: 'code' },
|
||||
{ name: 'Keyboard Phrase', element: 'kbd' },
|
||||
{ name: 'Sample Text', element: 'samp' },
|
||||
{ name: 'Variable', element: 'var' },
|
||||
{ name: 'Deleted Text', element: 'del' },
|
||||
{ name: 'Inserted Text', element: 'ins' },
|
||||
{ name: 'Cited Work', element: 'cite' },
|
||||
{ name: 'Inline Quotation', element: 'q' }
|
||||
],
|
||||
|
||||
on: {
|
||||
pluginsLoaded: configureTransformations,
|
||||
loaded: configureHtmlWriter
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
* Add missing content transformations.
|
||||
*/
|
||||
function configureTransformations( evt ) {
|
||||
var editor = evt.editor;
|
||||
|
||||
editor.dataProcessor.htmlFilter.addRules( {
|
||||
attributes: {
|
||||
style: function( value, element ) {
|
||||
// Return #RGB for background and border colors
|
||||
return CKEDITOR.tools.convertRgbToHex( value );
|
||||
}
|
||||
}
|
||||
} );
|
||||
|
||||
// Default automatic content transformations do not yet take care of
|
||||
// align attributes on blocks, so we need to add our own transformation rules.
|
||||
function alignToAttribute( element ) {
|
||||
if ( element.styles[ 'text-align' ] ) {
|
||||
element.attributes.align = element.styles[ 'text-align' ];
|
||||
delete element.styles[ 'text-align' ];
|
||||
}
|
||||
}
|
||||
editor.filter.addTransformations( [
|
||||
[ { element: 'p', right: alignToAttribute } ],
|
||||
[ { element: 'h1', right: alignToAttribute } ],
|
||||
[ { element: 'h2', right: alignToAttribute } ],
|
||||
[ { element: 'h3', right: alignToAttribute } ],
|
||||
[ { element: 'pre', right: alignToAttribute } ]
|
||||
] );
|
||||
}
|
||||
|
||||
/*
|
||||
* Adjust the behavior of htmlWriter to make it output HTML like FCKeditor.
|
||||
*/
|
||||
function configureHtmlWriter( evt ) {
|
||||
var editor = evt.editor,
|
||||
dataProcessor = editor.dataProcessor;
|
||||
|
||||
// Out self closing tags the HTML4 way, like <br>.
|
||||
dataProcessor.writer.selfClosingEnd = '>';
|
||||
|
||||
// Make output formatting behave similar to FCKeditor.
|
||||
var dtd = CKEDITOR.dtd;
|
||||
for ( var e in CKEDITOR.tools.extend( {}, dtd.$nonBodyContent, dtd.$block, dtd.$listItem, dtd.$tableContent ) ) {
|
||||
dataProcessor.writer.setRules( e, {
|
||||
indent: true,
|
||||
breakBeforeOpen: true,
|
||||
breakAfterOpen: false,
|
||||
breakBeforeClose: !dtd[ e ][ '#' ],
|
||||
breakAfterClose: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit">
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,131 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CKEditor Samples</title>
|
||||
<link rel="stylesheet" href="sample.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
CKEditor Samples
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
These samples are not maintained anymore. Check out the <a href="http://sdk.ckeditor.com/">brand new samples in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="twoColumns">
|
||||
<div class="twoColumnsLeft">
|
||||
<h2 class="samples">
|
||||
Basic Samples
|
||||
</h2>
|
||||
<dl class="samples">
|
||||
<dt><a class="samples" href="replacebyclass.html">Replace textarea elements by class name</a></dt>
|
||||
<dd>Automatic replacement of all textarea elements of a given class with a CKEditor instance.</dd>
|
||||
|
||||
<dt><a class="samples" href="replacebycode.html">Replace textarea elements by code</a></dt>
|
||||
<dd>Replacement of textarea elements with CKEditor instances by using a JavaScript call.</dd>
|
||||
|
||||
<dt><a class="samples" href="jquery.html">Create editors with jQuery</a></dt>
|
||||
<dd>Creating standard and inline CKEditor instances with jQuery adapter.</dd>
|
||||
</dl>
|
||||
|
||||
<h2 class="samples">
|
||||
Basic Customization
|
||||
</h2>
|
||||
<dl class="samples">
|
||||
<dt><a class="samples" href="uicolor.html">User Interface color</a></dt>
|
||||
<dd>Changing CKEditor User Interface color and adding a toolbar button that lets the user set the UI color.</dd>
|
||||
|
||||
<dt><a class="samples" href="uilanguages.html">User Interface languages</a></dt>
|
||||
<dd>Changing CKEditor User Interface language and adding a drop-down list that lets the user choose the UI language.</dd>
|
||||
</dl>
|
||||
|
||||
|
||||
<h2 class="samples">Plugins</h2>
|
||||
<dl class="samples">
|
||||
<dt><a class="samples" href="magicline/magicline.html">Magicline plugin</a></dt>
|
||||
<dd>Using the Magicline plugin to access difficult focus spaces.</dd>
|
||||
|
||||
<dt><a class="samples" href="wysiwygarea/fullpage.html">Full page support</a></dt>
|
||||
<dd>CKEditor inserted with a JavaScript call and used to edit the whole page from <html> to </html>.</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="twoColumnsRight">
|
||||
<h2 class="samples">
|
||||
Inline Editing
|
||||
</h2>
|
||||
<dl class="samples">
|
||||
<dt><a class="samples" href="inlineall.html">Massive inline editor creation</a></dt>
|
||||
<dd>Turn all elements with <code>contentEditable = true</code> attribute into inline editors.</dd>
|
||||
|
||||
<dt><a class="samples" href="inlinebycode.html">Convert element into an inline editor by code</a></dt>
|
||||
<dd>Conversion of DOM elements into inline CKEditor instances by using a JavaScript call.</dd>
|
||||
|
||||
<dt><a class="samples" href="inlinetextarea.html">Replace textarea with inline editor</a> <span class="new">New!</span></dt>
|
||||
<dd>A form with a textarea that is replaced by an inline editor at runtime.</dd>
|
||||
|
||||
|
||||
</dl>
|
||||
|
||||
<h2 class="samples">
|
||||
Advanced Samples
|
||||
</h2>
|
||||
<dl class="samples">
|
||||
<dt><a class="samples" href="datafiltering.html">Data filtering and features activation</a> <span class="new">New!</span></dt>
|
||||
<dd>Data filtering and automatic features activation basing on configuration.</dd>
|
||||
|
||||
<dt><a class="samples" href="divreplace.html">Replace DIV elements on the fly</a></dt>
|
||||
<dd>Transforming a <code>div</code> element into an instance of CKEditor with a mouse click.</dd>
|
||||
|
||||
<dt><a class="samples" href="appendto.html">Append editor instances</a></dt>
|
||||
<dd>Appending editor instances to existing DOM elements.</dd>
|
||||
|
||||
<dt><a class="samples" href="ajax.html">Create and destroy editor instances for Ajax applications</a></dt>
|
||||
<dd>Creating and destroying CKEditor instances on the fly and saving the contents entered into the editor window.</dd>
|
||||
|
||||
<dt><a class="samples" href="api.html">Basic usage of the API</a></dt>
|
||||
<dd>Using the CKEditor JavaScript API to interact with the editor at runtime.</dd>
|
||||
|
||||
<dt><a class="samples" href="xhtmlstyle.html">XHTML-compliant style</a></dt>
|
||||
<dd>Configuring CKEditor to produce XHTML 1.1 compliant attributes and styles.</dd>
|
||||
|
||||
<dt><a class="samples" href="readonly.html">Read-only mode</a></dt>
|
||||
<dd>Using the readOnly API to block introducing changes to the editor contents.</dd>
|
||||
|
||||
<dt><a class="samples" href="tabindex.html">"Tab" key-based navigation</a></dt>
|
||||
<dd>Navigating among editor instances with tab key.</dd>
|
||||
|
||||
|
||||
|
||||
<dt><a class="samples" href="dialog/dialog.html">Using the JavaScript API to customize dialog windows</a></dt>
|
||||
<dd>Using the dialog windows API to customize dialog windows without changing the original editor code.</dd>
|
||||
|
||||
<dt><a class="samples" href="enterkey/enterkey.html">Using the "Enter" key in CKEditor</a></dt>
|
||||
<dd>Configuring the behavior of <em>Enter</em> and <em>Shift+Enter</em> keys.</dd>
|
||||
|
||||
<dt><a class="samples" href="htmlwriter/outputforflash.html">Output for Flash</a></dt>
|
||||
<dd>Configuring CKEditor to produce HTML code that can be used with Adobe Flash.</dd>
|
||||
|
||||
<dt><a class="samples" href="htmlwriter/outputhtml.html">Output HTML</a></dt>
|
||||
<dd>Configuring CKEditor to produce legacy HTML 4 code.</dd>
|
||||
|
||||
<dt><a class="samples" href="toolbar/toolbar.html">Toolbar Configurations</a></dt>
|
||||
<dd>Configuring CKEditor to display full or custom toolbar layout.</dd>
|
||||
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,314 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Massive inline editing — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<script>
|
||||
|
||||
// This code is generally not necessary, but it is here to demonstrate
|
||||
// how to customize specific editor instances on the fly. This fits well
|
||||
// this demo because we have editable elements (like headers) that
|
||||
// require less features.
|
||||
|
||||
// The "instanceCreated" event is fired for every editor instance created.
|
||||
CKEDITOR.on( 'instanceCreated', function( event ) {
|
||||
var editor = event.editor,
|
||||
element = editor.element;
|
||||
|
||||
// Customize editors for headers and tag list.
|
||||
// These editors don't need features like smileys, templates, iframes etc.
|
||||
if ( element.is( 'h1', 'h2', 'h3' ) || element.getAttribute( 'id' ) == 'taglist' ) {
|
||||
// Customize the editor configurations on "configLoaded" event,
|
||||
// which is fired after the configuration file loading and
|
||||
// execution. This makes it possible to change the
|
||||
// configurations before the editor initialization takes place.
|
||||
editor.on( 'configLoaded', function() {
|
||||
|
||||
// Remove unnecessary plugins to make the editor simpler.
|
||||
editor.config.removePlugins = 'colorbutton,find,flash,font,' +
|
||||
'forms,iframe,image,newpage,removeformat,' +
|
||||
'smiley,specialchar,stylescombo,templates';
|
||||
|
||||
// Rearrange the layout of the toolbar.
|
||||
editor.config.toolbarGroups = [
|
||||
{ name: 'editing', groups: [ 'basicstyles', 'links' ] },
|
||||
{ name: 'undo' },
|
||||
{ name: 'clipboard', groups: [ 'selection', 'clipboard' ] },
|
||||
{ name: 'about' }
|
||||
];
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
<link href="sample.css" rel="stylesheet">
|
||||
<style>
|
||||
|
||||
/* The following styles are just to make the page look nice. */
|
||||
|
||||
/* Workaround to show Arial Black in Firefox. */
|
||||
@font-face
|
||||
{
|
||||
font-family: 'arial-black';
|
||||
src: local('Arial Black');
|
||||
}
|
||||
|
||||
*[contenteditable="true"]
|
||||
{
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#container
|
||||
{
|
||||
width: 960px;
|
||||
margin: 30px auto 0;
|
||||
}
|
||||
|
||||
#header
|
||||
{
|
||||
overflow: hidden;
|
||||
padding: 0 0 30px;
|
||||
border-bottom: 5px solid #05B2D2;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#headerLeft,
|
||||
#headerRight
|
||||
{
|
||||
width: 49%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#headerLeft
|
||||
{
|
||||
float: left;
|
||||
padding: 10px 1px 1px;
|
||||
}
|
||||
|
||||
#headerLeft h2,
|
||||
#headerLeft h3
|
||||
{
|
||||
text-align: right;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#headerLeft h2
|
||||
{
|
||||
font-family: "Arial Black",arial-black;
|
||||
font-size: 4.6em;
|
||||
line-height: 1.1;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#headerLeft h3
|
||||
{
|
||||
font-size: 2.3em;
|
||||
line-height: 1.1;
|
||||
margin: .2em 0 0;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#headerRight
|
||||
{
|
||||
float: right;
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
#headerRight p
|
||||
{
|
||||
line-height: 1.8;
|
||||
text-align: justify;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#headerRight p + p
|
||||
{
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
#headerRight > div
|
||||
{
|
||||
padding: 20px;
|
||||
margin: 0 0 0 30px;
|
||||
font-size: 1.4em;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#columns
|
||||
{
|
||||
color: #333;
|
||||
overflow: hidden;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
#columns > div
|
||||
{
|
||||
float: left;
|
||||
width: 33.3%;
|
||||
}
|
||||
|
||||
#columns #column1 > div
|
||||
{
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
#columns #column3 > div
|
||||
{
|
||||
margin-right: 1px;
|
||||
}
|
||||
|
||||
#columns > div > div
|
||||
{
|
||||
margin: 0px 10px;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
#columns blockquote
|
||||
{
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
#tagLine
|
||||
{
|
||||
border-top: 5px solid #05B2D2;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
#taglist {
|
||||
display: inline-block;
|
||||
margin-left: 20px;
|
||||
font-weight: bold;
|
||||
margin: 0 0 0 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<h1 class="samples"><a href="index.html">CKEditor Samples</a> » Massive inline editing</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/inline.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>This sample page demonstrates the inline editing feature - CKEditor instances will be created automatically from page elements with <strong>contentEditable</strong> attribute set to value <strong>true</strong>:</p>
|
||||
<pre class="samples"><div <strong>contenteditable="true</strong>" > ... </div></pre>
|
||||
<p>Click inside of any element below to start editing.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="container">
|
||||
<div id="header">
|
||||
<div id="headerLeft">
|
||||
<h2 id="sampleTitle" contenteditable="true">
|
||||
CKEditor<br> Goes Inline!
|
||||
</h2>
|
||||
<h3 contenteditable="true">
|
||||
Lorem ipsum dolor sit amet dolor duis blandit vestibulum faucibus a, tortor.
|
||||
</h3>
|
||||
</div>
|
||||
<div id="headerRight">
|
||||
<div contenteditable="true">
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies.
|
||||
</p>
|
||||
<p>
|
||||
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna. Vestibulum dapibus, mauris nec malesuada fames ac.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="columns">
|
||||
<div id="column1">
|
||||
<div contenteditable="true">
|
||||
<h3>
|
||||
Fusce vitae porttitor
|
||||
</h3>
|
||||
<p>
|
||||
<strong>
|
||||
Lorem ipsum dolor sit amet dolor. Duis blandit vestibulum faucibus a, tortor.
|
||||
</strong>
|
||||
</p>
|
||||
<p>
|
||||
Proin nunc justo felis mollis tincidunt, risus risus pede, posuere cubilia Curae, Nullam euismod, enim. Etiam nibh ultricies dolor ac dignissim erat volutpat. Vivamus fermentum <a href="http://ckeditor.com/">nisl nulla sem in</a> metus. Maecenas wisi. Donec nec erat volutpat.
|
||||
</p>
|
||||
<blockquote>
|
||||
<p>
|
||||
Fusce vitae porttitor a, euismod convallis nisl, blandit risus tortor, pretium.
|
||||
Vehicula vitae, imperdiet vel, ornare enim vel sodales rutrum
|
||||
</p>
|
||||
</blockquote>
|
||||
<blockquote>
|
||||
<p>
|
||||
Libero nunc, rhoncus ante ipsum non ipsum. Nunc eleifend pede turpis id sollicitudin fringilla. Phasellus ultrices, velit ac arcu.
|
||||
</p>
|
||||
</blockquote>
|
||||
<p>Pellentesque nunc. Donec suscipit erat. Pellentesque habitant morbi tristique ullamcorper.</p>
|
||||
<p><s>Mauris mattis feugiat lectus nec mauris. Nullam vitae ante.</s></p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="column2">
|
||||
<div contenteditable="true">
|
||||
<h3>
|
||||
Integer condimentum sit amet
|
||||
</h3>
|
||||
<p>
|
||||
<strong>Aenean nonummy a, mattis varius. Cras aliquet.</strong>
|
||||
Praesent <a href="http://ckeditor.com/">magna non mattis ac, rhoncus nunc</a>, rhoncus eget, cursus pulvinar mollis.</p>
|
||||
<p>Proin id nibh. Sed eu libero posuere sed, lectus. Phasellus dui gravida gravida feugiat mattis ac, felis.</p>
|
||||
<p>Integer condimentum sit amet, tempor elit odio, a dolor non ante at sapien. Sed ac lectus. Nulla ligula quis eleifend mi, id leo velit pede cursus arcu id nulla ac lectus. Phasellus vestibulum. Nunc viverra enim quis diam.</p>
|
||||
</div>
|
||||
<div contenteditable="true">
|
||||
<h3>
|
||||
Praesent wisi accumsan sit amet nibh
|
||||
</h3>
|
||||
<p>Donec ullamcorper, risus tortor, pretium porttitor. Morbi quam quis lectus non leo.</p>
|
||||
<p style="margin-left: 40px; ">Integer faucibus scelerisque. Proin faucibus at, aliquet vulputate, odio at eros. Fusce <a href="http://ckeditor.com/">gravida, erat vitae augue</a>. Fusce urna fringilla gravida.</p>
|
||||
<p>In hac habitasse platea dictumst. Praesent wisi accumsan sit amet nibh. Maecenas orci luctus a, lacinia quam sem, posuere commodo, odio condimentum tempor, pede semper risus. Suspendisse pede. In hac habitasse platea dictumst. Nam sed laoreet sit amet erat. Integer.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="column3">
|
||||
<div contenteditable="true">
|
||||
<p>
|
||||
<img src="assets/inlineall/logo.png" alt="CKEditor logo" style="float:left">
|
||||
</p>
|
||||
<p>Quisque justo neque, mattis sed, fermentum ultrices <strong>posuere cubilia Curae</strong>, Vestibulum elit metus, quis placerat ut, lectus. Ut sagittis, nunc libero, egestas consequat lobortis velit rutrum ut, faucibus turpis. Fusce porttitor, nulla quis turpis. Nullam laoreet vel, consectetuer tellus suscipit ultricies, hendrerit wisi. Donec odio nec velit ac nunc sit amet, accumsan cursus aliquet. Vestibulum ante sit amet sagittis mi.</p>
|
||||
<h3>
|
||||
Nullam laoreet vel consectetuer tellus suscipit
|
||||
</h3>
|
||||
<ul>
|
||||
<li>Ut sagittis, nunc libero, egestas consequat lobortis velit rutrum ut, faucibus turpis.</li>
|
||||
<li>Fusce porttitor, nulla quis turpis. Nullam laoreet vel, consectetuer tellus suscipit ultricies, hendrerit wisi.</li>
|
||||
<li>Mauris eget tellus. Donec non felis. Nam eget dolor. Vestibulum enim. Donec.</li>
|
||||
</ul>
|
||||
<p>Quisque justo neque, mattis sed, <a href="http://ckeditor.com/">fermentum ultrices posuere cubilia</a> Curae, Vestibulum elit metus, quis placerat ut, lectus.</p>
|
||||
<p>Nullam laoreet vel, consectetuer tellus suscipit ultricies, hendrerit wisi. Ut sagittis, nunc libero, egestas consequat lobortis velit rutrum ut, faucibus turpis. Fusce porttitor, nulla quis turpis.</p>
|
||||
<p>Donec odio nec velit ac nunc sit amet, accumsan cursus aliquet. Vestibulum ante sit amet sagittis mi. Sed in nonummy faucibus turpis. Mauris eget tellus. Donec non felis. Nam eget dolor. Vestibulum enim. Donec.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tagLine">
|
||||
Tags of this article:
|
||||
<p id="taglist" contenteditable="true">
|
||||
inline, editing, floating, CKEditor
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">
|
||||
http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a>
|
||||
- Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,124 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Inline Editing by Code — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link href="sample.css" rel="stylesheet">
|
||||
<style>
|
||||
|
||||
#editable
|
||||
{
|
||||
padding: 10px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » Inline Editing by Code
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/inline.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to create an inline editor instance of CKEditor. It is created
|
||||
with a JavaScript call using the following code:
|
||||
</p>
|
||||
<pre class="samples">
|
||||
// This property tells CKEditor to not activate every element with contenteditable=true element.
|
||||
CKEDITOR.disableAutoInline = true;
|
||||
|
||||
var editor = CKEDITOR.inline( document.getElementById( 'editable' ) );
|
||||
</pre>
|
||||
<p>
|
||||
Note that <code>editable</code> in the code above is the <code>id</code>
|
||||
attribute of the <code><div></code> element to be converted into an inline instance.
|
||||
</p>
|
||||
</div>
|
||||
<div id="editable" contenteditable="true">
|
||||
<h1><img alt="Saturn V carrying Apollo 11" class="right" src="assets/sample.jpg" /> Apollo 11</h1>
|
||||
|
||||
<p><b>Apollo 11</b> was the spaceflight that landed the first humans, Americans <a href="http://en.wikipedia.org/wiki/Neil_Armstrong" title="Neil Armstrong">Neil Armstrong</a> and <a href="http://en.wikipedia.org/wiki/Buzz_Aldrin" title="Buzz Aldrin">Buzz Aldrin</a>, on the Moon on July 20, 1969, at 20:18 UTC. Armstrong became the first to step onto the lunar surface 6 hours later on July 21 at 02:56 UTC.</p>
|
||||
|
||||
<p>Armstrong spent about <s>three and a half</s> two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5 kg) of lunar material for return to Earth. A third member of the mission, <a href="http://en.wikipedia.org/wiki/Michael_Collins_(astronaut)" title="Michael Collins (astronaut)">Michael Collins</a>, piloted the <a href="http://en.wikipedia.org/wiki/Apollo_Command/Service_Module" title="Apollo Command/Service Module">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.</p>
|
||||
|
||||
<h2>Broadcasting and <em>quotes</em> <a id="quotes" name="quotes"></a></h2>
|
||||
|
||||
<p>Broadcast on live TV to a world-wide audience, Armstrong stepped onto the lunar surface and described the event as:</p>
|
||||
|
||||
<blockquote>
|
||||
<p>One small step for [a] man, one giant leap for mankind.</p>
|
||||
</blockquote>
|
||||
|
||||
<p>Apollo 11 effectively ended the <a href="http://en.wikipedia.org/wiki/Space_Race" title="Space Race">Space Race</a> and fulfilled a national goal proposed in 1961 by the late U.S. President <a href="http://en.wikipedia.org/wiki/John_F._Kennedy" title="John F. Kennedy">John F. Kennedy</a> in a speech before the United States Congress:</p>
|
||||
|
||||
<blockquote>
|
||||
<p>[...] before this decade is out, of landing a man on the Moon and returning him safely to the Earth.</p>
|
||||
</blockquote>
|
||||
|
||||
<h2>Technical details <a id="tech-details" name="tech-details"></a></h2>
|
||||
|
||||
<table align="right" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse;margin:10px 0 10px 15px;">
|
||||
<caption><strong>Mission crew</strong></caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Position</th>
|
||||
<th scope="col">Astronaut</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Commander</td>
|
||||
<td>Neil A. Armstrong</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Command Module Pilot</td>
|
||||
<td>Michael Collins</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Lunar Module Pilot</td>
|
||||
<td>Edwin "Buzz" E. Aldrin, Jr.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<p>Launched by a <strong>Saturn V</strong> rocket from <a href="http://en.wikipedia.org/wiki/Kennedy_Space_Center" title="Kennedy Space Center">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="http://en.wikipedia.org/wiki/NASA" title="NASA">NASA</a>'s Apollo program. The Apollo spacecraft had three parts:</p>
|
||||
|
||||
<ol>
|
||||
<li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li>
|
||||
<li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li>
|
||||
<li><strong>Lunar Module</strong> for landing on the Moon.</li>
|
||||
</ol>
|
||||
|
||||
<p>After being sent to the Moon by the Saturn V's upper stage, the astronauts separated the spacecraft from it and travelled for three days until they entered into lunar orbit. Armstrong and Aldrin then moved into the Lunar Module and landed in the <a href="http://en.wikipedia.org/wiki/Mare_Tranquillitatis" title="Mare Tranquillitatis">Sea of Tranquility</a>. They stayed a total of about 21 and a half hours on the lunar surface. After lifting off in the upper part of the Lunar Module and rejoining Collins in the Command Module, they returned to Earth and landed in the <a href="http://en.wikipedia.org/wiki/Pacific_Ocean" title="Pacific Ocean">Pacific Ocean</a> on July 24.</p>
|
||||
|
||||
<hr />
|
||||
<p style="text-align: right;"><small>Source: <a href="http://en.wikipedia.org/wiki/Apollo_11">Wikipedia.org</a></small></p>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// We need to turn off the automatic editor creation first.
|
||||
CKEDITOR.disableAutoInline = true;
|
||||
|
||||
var editor = CKEDITOR.inline( 'editable' );
|
||||
</script>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p contenteditable="true">
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">
|
||||
http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a>
|
||||
- Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,113 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Replace Textarea with Inline Editor — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link href="sample.css" rel="stylesheet">
|
||||
<style>
|
||||
|
||||
/* Style the CKEditor element to look like a textfield */
|
||||
.cke_textarea_inline
|
||||
{
|
||||
padding: 10px;
|
||||
height: 200px;
|
||||
overflow: auto;
|
||||
|
||||
border: 1px solid gray;
|
||||
-webkit-appearance: textfield;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » Replace Textarea with Inline Editor
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/inline.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
You can also create an inline editor from a <code>textarea</code>
|
||||
element. In this case the <code>textarea</code> will be replaced
|
||||
by a <code>div</code> element with inline editing enabled.
|
||||
</p>
|
||||
<pre class="samples">
|
||||
// "article-body" is the name of a textarea element.
|
||||
var editor = CKEDITOR.inline( 'article-body' );
|
||||
</pre>
|
||||
</div>
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<h2>This is a sample form with some fields</h2>
|
||||
<p>
|
||||
Title:<br>
|
||||
<input type="text" name="title" value="Sample Form"></p>
|
||||
<p>
|
||||
Article Body (Textarea converted to CKEditor):<br>
|
||||
<textarea name="article-body" style="height: 200px">
|
||||
<h2>Technical details <a id="tech-details" name="tech-details"></a></h2>
|
||||
|
||||
<table align="right" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse;margin:10px 0 10px 15px;">
|
||||
<caption><strong>Mission crew</strong></caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Position</th>
|
||||
<th scope="col">Astronaut</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Commander</td>
|
||||
<td>Neil A. Armstrong</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Command Module Pilot</td>
|
||||
<td>Michael Collins</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Lunar Module Pilot</td>
|
||||
<td>Edwin "Buzz" E. Aldrin, Jr.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<p>Launched by a <strong>Saturn V</strong> rocket from <a href="http://en.wikipedia.org/wiki/Kennedy_Space_Center" title="Kennedy Space Center">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="http://en.wikipedia.org/wiki/NASA" title="NASA">NASA</a>'s Apollo program. The Apollo spacecraft had three parts:</p>
|
||||
|
||||
<ol>
|
||||
<li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li>
|
||||
<li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li>
|
||||
<li><strong>Lunar Module</strong> for landing on the Moon.</li>
|
||||
</ol>
|
||||
|
||||
<p>After being sent to the Moon by the Saturn V's upper stage, the astronauts separated the spacecraft from it and travelled for three days until they entered into lunar orbit. Armstrong and Aldrin then moved into the Lunar Module and landed in the <a href="http://en.wikipedia.org/wiki/Mare_Tranquillitatis" title="Mare Tranquillitatis">Sea of Tranquility</a>. They stayed a total of about 21 and a half hours on the lunar surface. After lifting off in the upper part of the Lunar Module and rejoining Collins in the Command Module, they returned to Earth and landed in the <a href="http://en.wikipedia.org/wiki/Pacific_Ocean" title="Pacific Ocean">Pacific Ocean</a> on July 24.</p>
|
||||
|
||||
<hr />
|
||||
<p style="text-align: right;"><small>Source: <a href="http://en.wikipedia.org/wiki/Apollo_11">Wikipedia.org</a></small></p>
|
||||
</textarea>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit">
|
||||
</p>
|
||||
</form>
|
||||
|
||||
<script>
|
||||
CKEDITOR.inline( 'article-body' );
|
||||
</script>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">
|
||||
http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a>
|
||||
- Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,103 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery Adapter — CKEditor Sample</title>
|
||||
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<script src="../../adapters/jquery.js"></script>
|
||||
<link href="sample.css" rel="stylesheet">
|
||||
<style>
|
||||
|
||||
#editable
|
||||
{
|
||||
padding: 10px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
</style>
|
||||
<script>
|
||||
|
||||
CKEDITOR.disableAutoInline = true;
|
||||
|
||||
$( document ).ready( function() {
|
||||
$( '#editor1' ).ckeditor(); // Use CKEDITOR.replace() if element is <textarea>.
|
||||
$( '#editable' ).ckeditor(); // Use CKEDITOR.inline().
|
||||
} );
|
||||
|
||||
function setValue() {
|
||||
$( '#editor1' ).val( $( 'input#val' ).val() );
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html" id="a-test">CKEditor Samples</a> » Create Editors with jQuery
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out the <a href="http://sdk.ckeditor.com/">brand new samples in CKEditor SDK</a>.
|
||||
</div>
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to use the <a href="http://docs.ckeditor.com/#!/guide/dev_jquery">jQuery adapter</a>.
|
||||
Note that you have to include both CKEditor and jQuery scripts before including the adapter.
|
||||
</p>
|
||||
|
||||
<pre class="samples">
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
||||
<script src="/ckedit../../ckeditor.js"></script>
|
||||
<script src="/ckeditor/adapters/jquery.js"></script>
|
||||
</pre>
|
||||
|
||||
<p>Then you can replace HTML elements with a CKEditor instance using the <code>ckeditor()</code> method.</p>
|
||||
|
||||
<pre class="samples">
|
||||
$( document ).ready( function() {
|
||||
$( 'textarea#editor1' ).ckeditor();
|
||||
} );
|
||||
</pre>
|
||||
</div>
|
||||
|
||||
<h2 class="samples">Inline Example</h2>
|
||||
|
||||
<div id="editable" contenteditable="true">
|
||||
<p><img alt="Saturn V carrying Apollo 11" class="right" src="assets/sample.jpg"/><b>Apollo 11</b> was the spaceflight that landed the first humans, Americans <a href="http://en.wikipedia.org/wiki/Neil_Armstrong" title="Neil Armstrong">Neil Armstrong</a> and <a href="http://en.wikipedia.org/wiki/Buzz_Aldrin" title="Buzz Aldrin">Buzz Aldrin</a>, on the Moon on July 20, 1969, at 20:18 UTC. Armstrong became the first to step onto the lunar surface 6 hours later on July 21 at 02:56 UTC.</p>
|
||||
<p>Armstrong spent about <s>three and a half</s> two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5 kg) of lunar material for return to Earth. A third member of the mission, <a href="http://en.wikipedia.org/wiki/Michael_Collins_(astronaut)" title="Michael Collins (astronaut)">Michael Collins</a>, piloted the <a href="http://en.wikipedia.org/wiki/Apollo_Command/Service_Module" title="Apollo Command/Service Module">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.
|
||||
<p>Broadcast on live TV to a world-wide audience, Armstrong stepped onto the lunar surface and described the event as:</p>
|
||||
<blockquote><p>One small step for [a] man, one giant leap for mankind.</p></blockquote> <p>Apollo 11 effectively ended the <a href="http://en.wikipedia.org/wiki/Space_Race" title="Space Race">Space Race</a> and fulfilled a national goal proposed in 1961 by the late U.S. President <a href="http://en.wikipedia.org/wiki/John_F._Kennedy" title="John F. Kennedy">John F. Kennedy</a> in a speech before the United States Congress:</p> <blockquote><p>[...] before this decade is out, of landing a man on the Moon and returning him safely to the Earth.</p></blockquote>
|
||||
</div>
|
||||
|
||||
<br style="clear: both">
|
||||
|
||||
<h2 class="samples">Classic (iframe-based) Example</h2>
|
||||
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10">
|
||||
<h2>Technical details <a id="tech-details" name="tech-details"></a></h2> <table align="right" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse;margin:10px 0 10px 15px;"> <caption><strong>Mission crew</strong></caption> <thead> <tr> <th scope="col">Position</th> <th scope="col">Astronaut</th> </tr> </thead> <tbody> <tr> <td>Commander</td> <td>Neil A. Armstrong</td> </tr> <tr> <td>Command Module Pilot</td> <td>Michael Collins</td> </tr> <tr> <td>Lunar Module Pilot</td> <td>Edwin &quot;Buzz&quot; E. Aldrin, Jr.</td> </tr> </tbody> </table> <p>Launched by a <strong>Saturn V</strong> rocket from <a href="http://en.wikipedia.org/wiki/Kennedy_Space_Center" title="Kennedy Space Center">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="http://en.wikipedia.org/wiki/NASA" title="NASA">NASA</a>&#39;s Apollo program. The Apollo spacecraft had three parts:</p> <ol> <li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li> <li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li> <li><strong>Lunar Module</strong> for landing on the Moon.</li> </ol> <p>After being sent to the Moon by the Saturn V&#39;s upper stage, the astronauts separated the spacecraft from it and travelled for three days until they entered into lunar orbit. Armstrong and Aldrin then moved into the Lunar Module and landed in the <a href="http://en.wikipedia.org/wiki/Mare_Tranquillitatis" title="Mare Tranquillitatis">Sea of Tranquility</a>. They stayed a total of about 21 and a half hours on the lunar surface. After lifting off in the upper part of the Lunar Module and rejoining Collins in the Command Module, they returned to Earth and landed in the <a href="http://en.wikipedia.org/wiki/Pacific_Ocean" title="Pacific Ocean">Pacific Ocean</a> on July 24.</p> <hr/> <p style="text-align: right;"><small>Source: <a href="http://en.wikipedia.org/wiki/Apollo_11">Wikipedia.org</a></small></p>
|
||||
</textarea>
|
||||
|
||||
<p style="overflow: hidden">
|
||||
<input style="float: left" type="submit" value="Submit">
|
||||
<span style="float: right">
|
||||
<input type="text" id="val" value="I'm using jQuery val()!" size="30">
|
||||
<input onclick="setValue();" type="button" value="Set value">
|
||||
</span>
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,209 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Using Magicline plugin — CKEditor Sample</title>
|
||||
<script src="../../../ckeditor.js"></script>
|
||||
<link rel="stylesheet" href="../../../samples/old/sample.css">
|
||||
<meta name="ckeditor-sample-name" content="Magicline plugin">
|
||||
<meta name="ckeditor-sample-group" content="Plugins">
|
||||
<meta name="ckeditor-sample-description" content="Using the Magicline plugin to access difficult focus spaces.">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="../../../samples/old/index.html">CKEditor Samples</a> » Using Magicline plugin
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/magicline.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows the advantages of <strong>Magicline</strong> plugin
|
||||
which is to enhance the editing process. Thanks to this plugin,
|
||||
a number of difficult focus spaces which are inaccessible due to
|
||||
browser issues can now be focused.
|
||||
</p>
|
||||
<p>
|
||||
<strong>Magicline</strong> plugin shows a red line with a handler
|
||||
which, when clicked, inserts a paragraph and allows typing. To see this,
|
||||
focus an editor and move your mouse above the focus space you want
|
||||
to access. The plugin is enabled by default so no additional
|
||||
configuration is necessary.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<label for="editor1">
|
||||
Editor 1:
|
||||
</label>
|
||||
<div class="description">
|
||||
<p>
|
||||
This editor uses a default <strong>Magicline</strong> setup.
|
||||
</p>
|
||||
</div>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10">
|
||||
<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; ">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>This table</td>
|
||||
<td>is the</td>
|
||||
<td>very first</td>
|
||||
<td>element of the document.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>We are still</td>
|
||||
<td>able to acces</td>
|
||||
<td>the space before it.</td>
|
||||
<td>
|
||||
<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; ">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>This table is inside of a cell of another table.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>We can type&nbsp;either before or after it though.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<p>Two succesive horizontal lines (<tt>HR</tt> tags). We can access the space in between:</p>
|
||||
|
||||
<hr />
|
||||
<hr />
|
||||
<ol>
|
||||
<li>This numbered list...</li>
|
||||
<li>...is a neighbour of a horizontal line...</li>
|
||||
<li>...and another list.</li>
|
||||
</ol>
|
||||
|
||||
<ul>
|
||||
<li>We can type between the lists...</li>
|
||||
<li>...thanks to <strong>Magicline</strong>.</li>
|
||||
</ul>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet dui. Morbi vel turpis. Nullam et leo. Etiam rutrum, urna tellus dui vel tincidunt mattis egestas, justo fringilla vel, massa. Phasellus.</p>
|
||||
|
||||
<p>Quisque iaculis, dui lectus varius vitae, tortor. Proin lacus. Pellentesque ac lacus. Aenean nonummy commodo nec, pede. Etiam blandit risus elit.</p>
|
||||
|
||||
<p>Ut pretium. Vestibulum rutrum in, adipiscing elit. Sed in quam in purus sem vitae pede. Pellentesque bibendum, urna sem vel risus. Vivamus posuere metus. Aliquam gravida iaculis nisl. Nam enim. Aliquam erat ac lacus tellus ac felis.</p>
|
||||
|
||||
<div style="border: 2px dashed green; background: #ddd; text-align: center;">
|
||||
<p>This text is wrapped in a&nbsp;<tt>DIV</tt>&nbsp;element. We can type after this element though.</p>
|
||||
</div>
|
||||
</textarea>
|
||||
<script>
|
||||
|
||||
// This call can be placed at any point after the
|
||||
// <textarea>, or inside a <head><script> in a
|
||||
// window.onload event handler.
|
||||
|
||||
CKEDITOR.replace( 'editor1', {
|
||||
extraPlugins: 'magicline', // Ensure that magicline plugin, which is required for this sample, is loaded.
|
||||
allowedContent: true // Switch off the ACF, so very complex content created to
|
||||
// show magicline's power isn't filtered.
|
||||
} );
|
||||
|
||||
</script>
|
||||
</div>
|
||||
<br>
|
||||
<div>
|
||||
<label for="editor2">
|
||||
Editor 2:
|
||||
</label>
|
||||
<div class="description">
|
||||
<p>
|
||||
This editor is using a blue line.
|
||||
</p>
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( 'editor2', {
|
||||
magicline_color: 'blue'
|
||||
});</pre>
|
||||
</div>
|
||||
<textarea cols="80" id="editor2" name="editor2" rows="10">
|
||||
<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; ">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>This table</td>
|
||||
<td>is the</td>
|
||||
<td>very first</td>
|
||||
<td>element of the document.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>We are still</td>
|
||||
<td>able to acces</td>
|
||||
<td>the space before it.</td>
|
||||
<td>
|
||||
<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; ">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>This table is inside of a cell of another table.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>We can type&nbsp;either before or after it though.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<p>Two succesive horizontal lines (<tt>HR</tt> tags). We can access the space in between:</p>
|
||||
|
||||
<hr />
|
||||
<hr />
|
||||
<ol>
|
||||
<li>This numbered list...</li>
|
||||
<li>...is a neighbour of a horizontal line...</li>
|
||||
<li>...and another list.</li>
|
||||
</ol>
|
||||
|
||||
<ul>
|
||||
<li>We can type between the lists...</li>
|
||||
<li>...thanks to <strong>Magicline</strong>.</li>
|
||||
</ul>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet dui. Morbi vel turpis. Nullam et leo. Etiam rutrum, urna tellus dui vel tincidunt mattis egestas, justo fringilla vel, massa. Phasellus.</p>
|
||||
|
||||
<p>Quisque iaculis, dui lectus varius vitae, tortor. Proin lacus. Pellentesque ac lacus. Aenean nonummy commodo nec, pede. Etiam blandit risus elit.</p>
|
||||
|
||||
<p>Ut pretium. Vestibulum rutrum in, adipiscing elit. Sed in quam in purus sem vitae pede. Pellentesque bibendum, urna sem vel risus. Vivamus posuere metus. Aliquam gravida iaculis nisl. Nam enim. Aliquam erat ac lacus tellus ac felis.</p>
|
||||
|
||||
<div style="border: 2px dashed green; background: #ddd; text-align: center;">
|
||||
<p>This text is wrapped in a&nbsp;<tt>DIV</tt>&nbsp;element. We can type after this element though.</p>
|
||||
</div>
|
||||
</textarea>
|
||||
<script>
|
||||
|
||||
// This call can be placed at any point after the
|
||||
// <textarea>, or inside a <head><script> in a
|
||||
// window.onload event handler.
|
||||
|
||||
CKEDITOR.replace( 'editor2', {
|
||||
extraPlugins: 'magicline', // Ensure that magicline plugin, which is required for this sample, is loaded.
|
||||
magicline_color: 'blue', // Blue line
|
||||
allowedContent: true // Switch off the ACF, so very complex content created to
|
||||
// show magicline's power isn't filtered.
|
||||
});
|
||||
|
||||
</script>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,76 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Using the CKEditor Read-Only API — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link rel="stylesheet" href="sample.css">
|
||||
<script>
|
||||
|
||||
var editor;
|
||||
|
||||
// The instanceReady event is fired, when an instance of CKEditor has finished
|
||||
// its initialization.
|
||||
CKEDITOR.on( 'instanceReady', function( ev ) {
|
||||
editor = ev.editor;
|
||||
|
||||
// Show this "on" button.
|
||||
document.getElementById( 'readOnlyOn' ).style.display = '';
|
||||
|
||||
// Event fired when the readOnly property changes.
|
||||
editor.on( 'readOnly', function() {
|
||||
document.getElementById( 'readOnlyOn' ).style.display = this.readOnly ? 'none' : '';
|
||||
document.getElementById( 'readOnlyOff' ).style.display = this.readOnly ? '' : 'none';
|
||||
});
|
||||
});
|
||||
|
||||
function toggleReadOnly( isReadOnly ) {
|
||||
// Change the read-only state of the editor.
|
||||
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-setReadOnly
|
||||
editor.setReadOnly( isReadOnly );
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » Using the CKEditor Read-Only API
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/readonly.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to use the
|
||||
<code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-setReadOnly">setReadOnly</a></code>
|
||||
API to put editor into the read-only state that makes it impossible for users to change the editor contents.
|
||||
</p>
|
||||
<p>
|
||||
For details on how to create this setup check the source code of this sample page.
|
||||
</p>
|
||||
</div>
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<textarea class="ckeditor" id="editor1" name="editor1" cols="100" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
</p>
|
||||
<p>
|
||||
<input id="readOnlyOn" onclick="toggleReadOnly();" type="button" value="Make it read-only" style="display:none">
|
||||
<input id="readOnlyOff" onclick="toggleReadOnly( false );" type="button" value="Make it editable again" style="display:none">
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,78 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>TAB Key-Based Navigation — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link href="sample.css" rel="stylesheet">
|
||||
<style>
|
||||
|
||||
.cke_focused,
|
||||
.cke_editable.cke_focused
|
||||
{
|
||||
outline: 3px dotted blue !important;
|
||||
*border: 3px dotted blue !important; /* For IE7 */
|
||||
}
|
||||
|
||||
</style>
|
||||
<script>
|
||||
|
||||
CKEDITOR.on( 'instanceReady', function( evt ) {
|
||||
var editor = evt.editor;
|
||||
editor.setData( 'This editor has it\'s tabIndex set to <strong>' + editor.tabIndex + '</strong>' );
|
||||
|
||||
// Apply focus class name.
|
||||
editor.on( 'focus', function() {
|
||||
editor.container.addClass( 'cke_focused' );
|
||||
});
|
||||
editor.on( 'blur', function() {
|
||||
editor.container.removeClass( 'cke_focused' );
|
||||
});
|
||||
|
||||
// Put startup focus on the first editor in tab order.
|
||||
if ( editor.tabIndex == 1 )
|
||||
editor.focus();
|
||||
});
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » TAB Key-Based Navigation
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/tabindex.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how tab key navigation among editor instances is
|
||||
affected by the <code>tabIndex</code> attribute from
|
||||
the original page element. Use TAB key to move between the editors.
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
<textarea class="ckeditor" cols="80" id="editor4" rows="10" tabindex="1"></textarea>
|
||||
</p>
|
||||
<div class="ckeditor" contenteditable="true" id="editor1" tabindex="4"></div>
|
||||
<p>
|
||||
<textarea class="ckeditor" cols="80" id="editor2" rows="10" tabindex="2"></textarea>
|
||||
</p>
|
||||
<p>
|
||||
<textarea class="ckeditor" cols="80" id="editor3" rows="10" tabindex="3"></textarea>
|
||||
</p>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,235 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Toolbar Configuration — CKEditor Sample</title>
|
||||
<meta name="ckeditor-sample-name" content="Toolbar Configurations">
|
||||
<meta name="ckeditor-sample-group" content="Advanced Samples">
|
||||
<meta name="ckeditor-sample-description" content="Configuring CKEditor to display full or custom toolbar layout.">
|
||||
<script src="../../../ckeditor.js"></script>
|
||||
<link href="../../../samples/old/sample.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="../../../samples/old/index.html">CKEditor Samples</a> » Toolbar Configuration
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out the <a href="../../../samples/toolbarconfigurator/index.html#basic">brand new CKEditor Toolbar Configurator</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample page demonstrates editor with loaded <a href="#fullToolbar">full toolbar</a> (all registered buttons) and, if
|
||||
current editor's configuration modifies default settings, also editor with <a href="#currentToolbar">modified toolbar</a>.
|
||||
</p>
|
||||
|
||||
<p>Since CKEditor 4 there are two ways to configure toolbar buttons.</p>
|
||||
|
||||
<h2 class="samples">By <a href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-toolbar">config.toolbar</a></h2>
|
||||
|
||||
<p>
|
||||
You can explicitly define which buttons are displayed in which groups and in which order.
|
||||
This is the more precise setting, but less flexible. If newly added plugin adds its
|
||||
own button you'll have to add it manually to your <code>config.toolbar</code> setting as well.
|
||||
</p>
|
||||
|
||||
<p>To add a CKEditor instance with custom toolbar setting, insert the following JavaScript call to your code:</p>
|
||||
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( <em>'textarea_id'</em>, {
|
||||
<strong>toolbar:</strong> [
|
||||
{ name: 'document', items: [ 'Source', '-', 'NewPage', 'Preview', '-', 'Templates' ] }, // Defines toolbar group with name (used to create voice label) and items in 3 subgroups.
|
||||
[ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ], // Defines toolbar group without name.
|
||||
'/', // Line break - next group will be placed in new line.
|
||||
{ name: 'basicstyles', items: [ 'Bold', 'Italic' ] }
|
||||
]
|
||||
});</pre>
|
||||
|
||||
<h2 class="samples">By <a href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-toolbarGroups">config.toolbarGroups</a></h2>
|
||||
|
||||
<p>
|
||||
You can define which groups of buttons (like e.g. <code>basicstyles</code>, <code>clipboard</code>
|
||||
and <code>forms</code>) are displayed and in which order. Registered buttons are associated
|
||||
with toolbar groups by <code>toolbar</code> property in their definition.
|
||||
This setting's advantage is that you don't have to modify toolbar configuration
|
||||
when adding/removing plugins which register their own buttons.
|
||||
</p>
|
||||
|
||||
<p>To add a CKEditor instance with custom toolbar groups setting, insert the following JavaScript call to your code:</p>
|
||||
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( <em>'textarea_id'</em>, {
|
||||
<strong>toolbarGroups:</strong> [
|
||||
{ name: 'document', groups: [ 'mode', 'document' ] }, // Displays document group with its two subgroups.
|
||||
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ] }, // Group's name will be used to create voice label.
|
||||
'/', // Line break - next group will be placed in new line.
|
||||
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
|
||||
{ name: 'links' }
|
||||
]
|
||||
|
||||
// NOTE: Remember to leave 'toolbar' property with the default value (null).
|
||||
});</pre>
|
||||
</div>
|
||||
|
||||
<div id="currentToolbar" style="display: none">
|
||||
<h2 class="samples">Current toolbar configuration</h2>
|
||||
<p>Below you can see editor with current toolbar definition.</p>
|
||||
<textarea cols="80" id="editorCurrent" name="editorCurrent" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<pre id="editorCurrentCfg" class="samples"></pre>
|
||||
</div>
|
||||
|
||||
<div id="fullToolbar">
|
||||
<h2 class="samples">Full toolbar configuration</h2>
|
||||
<p>Below you can see editor with full toolbar, generated automatically by the editor.</p>
|
||||
<p>
|
||||
<strong>Note</strong>: To create editor instance with full toolbar you don't have to set anything.
|
||||
Just leave <code>toolbar</code> and <code>toolbarGroups</code> with the default, <code>null</code> values.
|
||||
</p>
|
||||
<textarea cols="80" id="editorFull" name="editorFull" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<pre id="editorFullCfg" class="samples"></pre>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
var buttonsNames;
|
||||
|
||||
CKEDITOR.config.extraPlugins = 'toolbar';
|
||||
|
||||
CKEDITOR.on( 'instanceReady', function( evt ) {
|
||||
var editor = evt.editor,
|
||||
editorCurrent = editor.name == 'editorCurrent',
|
||||
defaultToolbar = !( editor.config.toolbar || editor.config.toolbarGroups || editor.config.removeButtons ),
|
||||
pre = CKEDITOR.document.getById( editor.name + 'Cfg' ),
|
||||
output = '';
|
||||
|
||||
if ( editorCurrent ) {
|
||||
// If default toolbar configuration has been modified, show "current toolbar" section.
|
||||
if ( !defaultToolbar )
|
||||
CKEDITOR.document.getById( 'currentToolbar' ).show();
|
||||
else
|
||||
return;
|
||||
}
|
||||
|
||||
if ( !buttonsNames )
|
||||
buttonsNames = createButtonsNamesHash( editor.ui.items );
|
||||
|
||||
// Toolbar isn't set explicitly, so it was created automatically from toolbarGroups.
|
||||
if ( !editor.config.toolbar ) {
|
||||
output +=
|
||||
'// Toolbar configuration generated automatically by the editor based on config.toolbarGroups.\n' +
|
||||
dumpToolbarConfiguration( editor ) +
|
||||
'\n\n' +
|
||||
'// Toolbar groups configuration.\n' +
|
||||
dumpToolbarConfiguration( editor, true )
|
||||
}
|
||||
// Toolbar groups doesn't count in this case - print only toolbar.
|
||||
else {
|
||||
output += '// Toolbar configuration.\n' +
|
||||
dumpToolbarConfiguration( editor );
|
||||
}
|
||||
|
||||
// Recreate to avoid old IE from loosing whitespaces on filling <pre> content.
|
||||
var preOutput = pre.getOuterHtml().replace( /(?=<\/)/, output );
|
||||
CKEDITOR.dom.element.createFromHtml( preOutput ).replace( pre );
|
||||
} );
|
||||
|
||||
CKEDITOR.replace( 'editorCurrent', { height: 100 } );
|
||||
CKEDITOR.replace( 'editorFull', {
|
||||
// Reset toolbar settings, so full toolbar will be generated automatically.
|
||||
toolbar: null,
|
||||
toolbarGroups: null,
|
||||
removeButtons: null,
|
||||
height: 100
|
||||
} );
|
||||
|
||||
function dumpToolbarConfiguration( editor, printGroups ) {
|
||||
var output = [],
|
||||
toolbar = editor.toolbar;
|
||||
|
||||
for ( var i = 0; i < toolbar.length; ++i ) {
|
||||
var group = dumpToolbarGroup( toolbar[ i ], printGroups );
|
||||
if ( group )
|
||||
output.push( group );
|
||||
}
|
||||
|
||||
return 'config.toolbar' + ( printGroups ? 'Groups' : '' ) + ' = [\n\t' + output.join( ',\n\t' ) + '\n];';
|
||||
}
|
||||
|
||||
function dumpToolbarGroup( group, printGroups ) {
|
||||
var output = [];
|
||||
|
||||
if ( typeof group == 'string' )
|
||||
return '\'' + group + '\'';
|
||||
if ( CKEDITOR.tools.isArray( group ) )
|
||||
return dumpToolbarItems( group );
|
||||
// Skip group when printing entire toolbar configuration and there are no items in this group.
|
||||
if ( !printGroups && !group.items )
|
||||
return;
|
||||
|
||||
if ( group.name )
|
||||
output.push( 'name: \'' + group.name + '\'' );
|
||||
|
||||
if ( group.groups )
|
||||
output.push( 'groups: ' + dumpToolbarItems( group.groups ) );
|
||||
|
||||
if ( !printGroups )
|
||||
output.push( 'items: ' + dumpToolbarItems( group.items ) );
|
||||
|
||||
return '{ ' + output.join( ', ' ) + ' }';
|
||||
}
|
||||
|
||||
function dumpToolbarItems( items ) {
|
||||
if ( typeof items == 'string' )
|
||||
return '\'' + items + '\'';
|
||||
|
||||
var names = [],
|
||||
i, item;
|
||||
|
||||
for ( var i = 0; i < items.length; ++i ) {
|
||||
item = items[ i ];
|
||||
if ( typeof item == 'string' )
|
||||
names.push( item );
|
||||
else {
|
||||
if ( item.type == CKEDITOR.UI_SEPARATOR )
|
||||
names.push( '-' );
|
||||
else
|
||||
names.push( buttonsNames[ item.name ] );
|
||||
}
|
||||
}
|
||||
|
||||
return '[ \'' + names.join( '\', \'' ) + '\' ]';
|
||||
}
|
||||
|
||||
// Creates { 'lowercased': 'LowerCased' } buttons names hash.
|
||||
function createButtonsNamesHash( items ) {
|
||||
var hash = {},
|
||||
name;
|
||||
|
||||
for ( name in items ) {
|
||||
hash[ items[ name ].name ] = name;
|
||||
}
|
||||
|
||||
return hash;
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,72 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>UI Color Picker — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<link rel="stylesheet" href="sample.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » UI Color
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/uicolor.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to automatically replace <code><textarea></code> elements
|
||||
with a CKEditor instance with an option to change the color of its user interface.<br>
|
||||
<strong>Note:</strong>The UI skin color feature depends on the CKEditor skin
|
||||
compatibility. The Moono and Kama skins are examples of skins that work with it.
|
||||
</p>
|
||||
</div>
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
This editor instance has a UI color value defined in configuration to change the skin color,
|
||||
To specify the color of the user interface, set the <code>uiColor</code> property:
|
||||
</p>
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( '<em>textarea_id</em>', {
|
||||
<strong>uiColor: '#14B8C4'</strong>
|
||||
});</pre>
|
||||
<p>
|
||||
Note that <code><em>textarea_id</em></code> in the code above is the <code>id</code> attribute of
|
||||
the <code><textarea></code> element to be replaced.
|
||||
</p>
|
||||
<p>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<script>
|
||||
|
||||
// Replace the <textarea id="editor"> with an CKEditor
|
||||
// instance, using default configurations.
|
||||
CKEDITOR.replace( 'editor1', {
|
||||
uiColor: '#14B8C4',
|
||||
toolbar: [
|
||||
[ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
|
||||
[ 'FontSize', 'TextColor', 'BGColor' ]
|
||||
]
|
||||
});
|
||||
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit">
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,122 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>User Interface Globalization — CKEditor Sample</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<script src="assets/uilanguages/languages.js"></script>
|
||||
<link rel="stylesheet" href="sample.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » User Interface Languages
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/uilanguages.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to automatically replace <code><textarea></code> elements
|
||||
with a CKEditor instance with an option to change the language of its user interface.
|
||||
</p>
|
||||
<p>
|
||||
It pulls the language list from CKEditor <code>_languages.js</code> file that contains the list of supported languages and creates
|
||||
a drop-down list that lets the user change the UI language.
|
||||
</p>
|
||||
<p>
|
||||
By default, CKEditor automatically localizes the editor to the language of the user.
|
||||
The UI language can be controlled with two configuration options:
|
||||
<code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-language">language</a></code> and
|
||||
<code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-defaultLanguage">
|
||||
defaultLanguage</a></code>. The <code>defaultLanguage</code> setting specifies the
|
||||
default CKEditor language to be used when a localization suitable for user's settings is not available.
|
||||
</p>
|
||||
<p>
|
||||
To specify the user interface language that will be used no matter what language is
|
||||
specified in user's browser or operating system, set the <code>language</code> property:
|
||||
</p>
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( '<em>textarea_id</em>', {
|
||||
// Load the German interface.
|
||||
<strong>language: 'de'</strong>
|
||||
});</pre>
|
||||
<p>
|
||||
Note that <code><em>textarea_id</em></code> in the code above is the <code>id</code> attribute of
|
||||
the <code><textarea></code> element to be replaced.
|
||||
</p>
|
||||
</div>
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
Available languages (<span id="count"> </span> languages!):<br>
|
||||
<script>
|
||||
|
||||
document.write( '<select disabled="disabled" id="languages" onchange="createEditor( this.value );">' );
|
||||
|
||||
// Get the language list from the _languages.js file.
|
||||
for ( var i = 0 ; i < window.CKEDITOR_LANGS.length ; i++ ) {
|
||||
document.write(
|
||||
'<option value="' + window.CKEDITOR_LANGS[i].code + '">' +
|
||||
window.CKEDITOR_LANGS[i].name +
|
||||
'</option>' );
|
||||
}
|
||||
|
||||
document.write( '</select>' );
|
||||
|
||||
</script>
|
||||
<br>
|
||||
<span style="color: #888888">
|
||||
(You may see strange characters if your system does not support the selected language)
|
||||
</span>
|
||||
</p>
|
||||
<p>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<script>
|
||||
|
||||
// Set the number of languages.
|
||||
document.getElementById( 'count' ).innerHTML = window.CKEDITOR_LANGS.length;
|
||||
|
||||
var editor;
|
||||
|
||||
function createEditor( languageCode ) {
|
||||
if ( editor )
|
||||
editor.destroy();
|
||||
|
||||
// Replace the <textarea id="editor"> with an CKEditor
|
||||
// instance, using default configurations.
|
||||
editor = CKEDITOR.replace( 'editor1', {
|
||||
language: languageCode,
|
||||
|
||||
on: {
|
||||
instanceReady: function() {
|
||||
// Wait for the editor to be ready to set
|
||||
// the language combo.
|
||||
var languages = document.getElementById( 'languages' );
|
||||
languages.value = this.langCode;
|
||||
languages.disabled = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// At page startup, load the default language:
|
||||
createEditor( '' );
|
||||
|
||||
</script>
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
@ -1,234 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>XHTML Compliant Output — CKEditor Sample</title>
|
||||
<meta name="ckeditor-sample-required-plugins" content="sourcearea">
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<script src="sample.js"></script>
|
||||
<link href="sample.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="index.html">CKEditor Samples</a> » Producing XHTML Compliant Output
|
||||
</h1>
|
||||
<div class="warning deprecated">
|
||||
This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/basicstyles.html">brand new version in CKEditor SDK</a>.
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to configure CKEditor to output valid
|
||||
<a class="samples" href="http://www.w3.org/TR/xhtml11/">XHTML 1.1</a> code.
|
||||
Deprecated elements (<code><font></code>, <code><u></code>) or attributes
|
||||
(<code>size</code>, <code>face</code>) will be replaced with XHTML compliant code.
|
||||
</p>
|
||||
<p>
|
||||
To add a CKEditor instance outputting valid XHTML code, load the editor using a standard
|
||||
JavaScript call and define CKEditor features to use the XHTML compliant elements and styles.
|
||||
</p>
|
||||
<p>
|
||||
A snippet of the configuration code can be seen below; check the source of this page for
|
||||
full definition:
|
||||
</p>
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( '<em>textarea_id</em>', {
|
||||
contentsCss: 'assets/outputxhtml.css',
|
||||
|
||||
coreStyles_bold: {
|
||||
element: 'span',
|
||||
attributes: { 'class': 'Bold' }
|
||||
},
|
||||
coreStyles_italic: {
|
||||
element: 'span',
|
||||
attributes: { 'class': 'Italic' }
|
||||
},
|
||||
|
||||
...
|
||||
});</pre>
|
||||
</div>
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<label for="editor1">
|
||||
Editor 1:
|
||||
</label>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <span class="Bold">sample text</span>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<script>
|
||||
|
||||
CKEDITOR.replace( 'editor1', {
|
||||
/*
|
||||
* Style sheet for the contents
|
||||
*/
|
||||
contentsCss: 'assets/outputxhtml/outputxhtml.css',
|
||||
|
||||
/*
|
||||
* Special allowed content rules for spans used by
|
||||
* font face, size, and color buttons.
|
||||
*
|
||||
* Note: all rules have been written separately so
|
||||
* it was possible to specify required classes.
|
||||
*/
|
||||
extraAllowedContent: 'span(!FontColor1);span(!FontColor2);span(!FontColor3);' +
|
||||
'span(!FontColor1BG);span(!FontColor2BG);span(!FontColor3BG);' +
|
||||
'span(!FontComic);span(!FontCourier);span(!FontTimes);' +
|
||||
'span(!FontSmaller);span(!FontLarger);span(!FontSmall);span(!FontBig);span(!FontDouble)',
|
||||
|
||||
/*
|
||||
* Core styles.
|
||||
*/
|
||||
coreStyles_bold: {
|
||||
element: 'span',
|
||||
attributes: { 'class': 'Bold' }
|
||||
},
|
||||
coreStyles_italic: {
|
||||
element: 'span',
|
||||
attributes: { 'class': 'Italic' }
|
||||
},
|
||||
coreStyles_underline: {
|
||||
element: 'span',
|
||||
attributes: { 'class': 'Underline' }
|
||||
},
|
||||
coreStyles_strike: {
|
||||
element: 'span',
|
||||
attributes: { 'class': 'StrikeThrough' },
|
||||
overrides: 'strike'
|
||||
},
|
||||
coreStyles_subscript: {
|
||||
element: 'span',
|
||||
attributes: { 'class': 'Subscript' },
|
||||
overrides: 'sub'
|
||||
},
|
||||
coreStyles_superscript: {
|
||||
element: 'span',
|
||||
attributes: { 'class': 'Superscript' },
|
||||
overrides: 'sup'
|
||||
},
|
||||
|
||||
/*
|
||||
* Font face.
|
||||
*/
|
||||
|
||||
// List of fonts available in the toolbar combo. Each font definition is
|
||||
// separated by a semi-colon (;). We are using class names here, so each font
|
||||
// is defined by {Combo Label}/{Class Name}.
|
||||
font_names: 'Comic Sans MS/FontComic;Courier New/FontCourier;Times New Roman/FontTimes',
|
||||
|
||||
// Define the way font elements will be applied to the document. The "span"
|
||||
// element will be used. When a font is selected, the font name defined in the
|
||||
// above list is passed to this definition with the name "Font", being it
|
||||
// injected in the "class" attribute.
|
||||
// We must also instruct the editor to replace span elements that are used to
|
||||
// set the font (Overrides).
|
||||
font_style: {
|
||||
element: 'span',
|
||||
attributes: { 'class': '#(family)' },
|
||||
overrides: [
|
||||
{
|
||||
element: 'span',
|
||||
attributes: {
|
||||
'class': /^Font(?:Comic|Courier|Times)$/
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
/*
|
||||
* Font sizes.
|
||||
*/
|
||||
fontSize_sizes: 'Smaller/FontSmaller;Larger/FontLarger;8pt/FontSmall;14pt/FontBig;Double Size/FontDouble',
|
||||
fontSize_style: {
|
||||
element: 'span',
|
||||
attributes: { 'class': '#(size)' },
|
||||
overrides: [
|
||||
{
|
||||
element: 'span',
|
||||
attributes: {
|
||||
'class': /^Font(?:Smaller|Larger|Small|Big|Double)$/
|
||||
}
|
||||
}
|
||||
]
|
||||
} ,
|
||||
|
||||
/*
|
||||
* Font colors.
|
||||
*/
|
||||
colorButton_enableMore: false,
|
||||
|
||||
colorButton_colors: 'FontColor1/FF9900,FontColor2/0066CC,FontColor3/F00',
|
||||
colorButton_foreStyle: {
|
||||
element: 'span',
|
||||
attributes: { 'class': '#(color)' },
|
||||
overrides: [
|
||||
{
|
||||
element: 'span',
|
||||
attributes: {
|
||||
'class': /^FontColor(?:1|2|3)$/
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
colorButton_backStyle: {
|
||||
element: 'span',
|
||||
attributes: { 'class': '#(color)BG' },
|
||||
overrides: [
|
||||
{
|
||||
element: 'span',
|
||||
attributes: {
|
||||
'class': /^FontColor(?:1|2|3)BG$/
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
/*
|
||||
* Indentation.
|
||||
*/
|
||||
indentClasses: [ 'Indent1', 'Indent2', 'Indent3' ],
|
||||
|
||||
/*
|
||||
* Paragraph justification.
|
||||
*/
|
||||
justifyClasses: [ 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyFull' ],
|
||||
|
||||
/*
|
||||
* Styles combo.
|
||||
*/
|
||||
stylesSet: [
|
||||
{ name: 'Strong Emphasis', element: 'strong' },
|
||||
{ name: 'Emphasis', element: 'em' },
|
||||
|
||||
{ name: 'Computer Code', element: 'code' },
|
||||
{ name: 'Keyboard Phrase', element: 'kbd' },
|
||||
{ name: 'Sample Text', element: 'samp' },
|
||||
{ name: 'Variable', element: 'var' },
|
||||
|
||||
{ name: 'Deleted Text', element: 'del' },
|
||||
{ name: 'Inserted Text', element: 'ins' },
|
||||
|
||||
{ name: 'Cited Work', element: 'cite' },
|
||||
{ name: 'Inline Quotation', element: 'q' }
|
||||
]
|
||||
});
|
||||
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit">
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,446 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.md or http://ckeditor.com/license
|
||||
-->
|
||||
<!--[if IE 8]><html class="ie8"><![endif]-->
|
||||
<!--[if gt IE 8]><html><![endif]-->
|
||||
<!--[if !IE]><!--><html><!--<![endif]-->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Toolbar Configurator</title>
|
||||
<script src="../../ckeditor.js"></script>
|
||||
<script>
|
||||
if ( CKEDITOR.env.ie && CKEDITOR.env.version < 9 )
|
||||
CKEDITOR.tools.enableHtml5Elements( document );
|
||||
</script>
|
||||
<link rel="stylesheet" href="lib/codemirror/codemirror.css">
|
||||
<link rel="stylesheet" href="lib/codemirror/show-hint.css">
|
||||
<link rel="stylesheet" href="lib/codemirror/neo.css">
|
||||
<link rel="stylesheet" href="css/fontello.css">
|
||||
<link rel="stylesheet" href="../css/samples.css">
|
||||
</head>
|
||||
<body id="toolbar">
|
||||
|
||||
<nav class="navigation-a">
|
||||
<div class="grid-container">
|
||||
<ul class="navigation-a-left grid-width-70">
|
||||
<li><a href="http://ckeditor.com">Project Homepage</a></li>
|
||||
<li><a href="http://dev.ckeditor.com/">I found a bug</a></li>
|
||||
<li><a href="http://github.com/ckeditor/ckeditor-dev" class="icon-pos-right icon-navigation-a-github">Fork CKEditor on GitHub</a></li>
|
||||
</ul>
|
||||
<ul class="navigation-a-right grid-width-30">
|
||||
<li><a href="http://ckeditor.com/blog-list">CKEditor Blog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<header class="header-a">
|
||||
<div class="grid-container">
|
||||
<h1 class="header-a-logo grid-width-30">
|
||||
<a href="../index.html"><img src="../img/logo.png" alt="CKEditor Logo"></a>
|
||||
</h1>
|
||||
<nav class="navigation-b grid-width-70">
|
||||
<ul>
|
||||
<li><a href="../index.html" class="button-a">Start</a></li>
|
||||
<li><a href="index.html" class="button-a button-a-background">Toolbar configurator</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div class="adjoined-top">
|
||||
<div class="grid-container">
|
||||
<div class="content grid-width-100">
|
||||
<div class="grid-container-nested">
|
||||
<h1 class="grid-width-60">
|
||||
Toolbar Configurator
|
||||
<a href="#help-content" type="button" title="Configurator help" id="help" class="button-a button-a-background button-a-no-text icon-pos-left icon-question-mark">Help</a>
|
||||
</h1>
|
||||
|
||||
<div class="grid-width-40 grid-switch-magic">
|
||||
<div class="switch">
|
||||
<span class="balloon-a balloon-a-se">Select configurator type</span>
|
||||
<input type="radio" name="radio" data-num="1" id="radio-basic" />
|
||||
<input type="radio" name="radio" data-num="2" id="radio-advanced" />
|
||||
<label data-for="1" for="radio-basic">Basic</label>
|
||||
<span class="switch-inner">
|
||||
<span class="handler"></span>
|
||||
</span>
|
||||
<label data-for="2" for="radio-advanced">Advanced</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="adjoined-bottom">
|
||||
<div class="grid-container">
|
||||
<div class="grid-width-100">
|
||||
<div class="editors-container">
|
||||
<div id="editor-basic"></div>
|
||||
<div id="editor-advanced"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid-container configurator">
|
||||
<div class="content grid-width-100">
|
||||
<div class="configurator">
|
||||
<div>
|
||||
<div id="toolbarModifierWrapper"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="help-content">
|
||||
<div class="grid-container">
|
||||
<div class="grid-width-100">
|
||||
<h2>What Am I Doing Here?</h2>
|
||||
|
||||
<div class="grid-container grid-container-nested">
|
||||
<div class="basic">
|
||||
<div class="grid-width-50">
|
||||
<p>Arrange <a href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-toolbarGroups">toolbar groups</a>, toggle <a href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-removeButtons">button visibility</a> according to your needs and get your toolbar configuration.</p>
|
||||
<p>You can replace the content of the <a href="../../config.js"><code>config.js</code></a> file with the generated configuration. If you already set some configuration options you will need to merge both configurations.</p>
|
||||
</div>
|
||||
<div class="grid-width-50">
|
||||
<p>Read more about different ways of <a href="http://docs.ckeditor.com/#!/guide/dev_configuration">setting configuration</a> and do not forget about <strong>clearing browser cache</strong>.</p>
|
||||
<p>Arranging toolbar groups is the recommended way of configuring the toolbar, but if you need more freedom you can use the <a href="#advanced">advanced configurator</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="advanced" style="display: none;">
|
||||
<div class="grid-width-50">
|
||||
<p>With this code editor you can edit your <a href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-toolbar">toolbar configuration</a> live.</p>
|
||||
<p>You can replace the content of the <a href="../../config.js"><code>config.js</code></a> file with the generated configuration. If you already set some configuration options you will need to merge both configurations.</p>
|
||||
</div>
|
||||
<div class="grid-width-50">
|
||||
<p>Read more about different ways of <a href="http://docs.ckeditor.com/#!/guide/dev_configuration">setting configuration</a> and do not forget about <strong>clearing browser cache</strong>.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="grid-container grid-container-nested">
|
||||
<button type="button" class="help-content-close grid-width-100 button-a button-a-background">Got it. Let's play!</button>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer class="footer-a grid-container">
|
||||
<p class="grid-width-100">
|
||||
CKEditor – The text editor for the Internet – <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p class="grid-width-100" id="copy">
|
||||
Copyright © 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> – Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</footer>
|
||||
|
||||
<script src="lib/codemirror/codemirror.js"></script>
|
||||
<script src="lib/codemirror/javascript.js"></script>
|
||||
<script src="lib/codemirror/show-hint.js"></script>
|
||||
|
||||
<script src="js/fulltoolbareditor.js"></script>
|
||||
<script src="js/abstracttoolbarmodifier.js"></script>
|
||||
<script src="js/toolbarmodifier.js"></script>
|
||||
<script src="js/toolbartextmodifier.js"></script>
|
||||
<script src="../js/sf.js"></script>
|
||||
|
||||
<script>
|
||||
( function() {
|
||||
'use strict';
|
||||
|
||||
var mode = ( window.location.hash.substr( 1 ) === 'advanced' ) ? 'advanced' : 'basic',
|
||||
configuratorSection = CKEDITOR.document.findOne( 'main > .grid-container.configurator' ),
|
||||
basicInstruction = CKEDITOR.document.findOne( '#help-content .basic' ),
|
||||
advancedInstruction = CKEDITOR.document.findOne( '#help-content .advanced' ),
|
||||
|
||||
// Configurator mode switcher.
|
||||
modeSwitchBasic = CKEDITOR.document.getById( 'radio-basic' ),
|
||||
modeSwitchAdvanced = CKEDITOR.document.getById( 'radio-advanced' );
|
||||
|
||||
// Initial setup
|
||||
function updateSwitcher() {
|
||||
if ( mode === 'advanced' ) {
|
||||
modeSwitchAdvanced.$.checked = true;
|
||||
} else {
|
||||
modeSwitchBasic.$.checked = true;
|
||||
}
|
||||
}
|
||||
|
||||
updateSwitcher();
|
||||
|
||||
CKEDITOR.document.getWindow().on( 'hashchange', function( e ) {
|
||||
var hash = window.location.hash.substr( 1 );
|
||||
if ( !( hash === 'advanced' || hash === 'basic' ) ) {
|
||||
return;
|
||||
}
|
||||
mode = hash;
|
||||
onToolbarsDone( mode );
|
||||
} );
|
||||
|
||||
CKEDITOR.document.getWindow().on( 'resize', function() {
|
||||
updateToolbar( ( mode === 'basic' ? toolbarModifier : toolbarTextModifier )[ 'editorInstance' ] );
|
||||
} );
|
||||
|
||||
function onRefresh( modifier ) {
|
||||
modifier = modifier || this;
|
||||
|
||||
if ( mode === 'basic' && modifier instanceof ToolbarConfigurator.ToolbarTextModifier ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// CodeMirror container becomes visible, so we need to refresh and to avoid rendering problems.
|
||||
if ( mode === 'advanced' && modifier instanceof ToolbarConfigurator.ToolbarTextModifier ) {
|
||||
modifier.codeContainer.refresh();
|
||||
}
|
||||
|
||||
updateToolbar( modifier.editorInstance );
|
||||
}
|
||||
|
||||
function updateToolbar( editor ) {
|
||||
var editorContainer = editor.container;
|
||||
|
||||
// Not always editor is loaded.
|
||||
if ( !editorContainer ) {
|
||||
return;
|
||||
}
|
||||
|
||||
var displayStyle = editorContainer.getStyle( 'display' );
|
||||
|
||||
editorContainer.setStyle( 'display', 'block' );
|
||||
|
||||
var newHeight = editorContainer.getSize( 'height' );
|
||||
|
||||
var newMarginTop = parseInt( editorContainer.getComputedStyle( 'margin-top' ), 10 );
|
||||
newMarginTop = ( isNaN( newMarginTop ) ? 0 : Number( newMarginTop ) );
|
||||
|
||||
var newMarginBottom = parseInt( editorContainer.getComputedStyle( 'margin-bottom' ), 10 );
|
||||
newMarginBottom = ( isNaN( newMarginBottom ) ? 0 : Number( newMarginBottom ) );
|
||||
|
||||
var result = newHeight + newMarginTop + newMarginBottom;
|
||||
|
||||
editorContainer.setStyle( 'display', displayStyle );
|
||||
|
||||
editor.container.getAscendant( 'div' ).setStyle( 'height', result + 'px' );
|
||||
}
|
||||
|
||||
var toolbarModifier = new ToolbarConfigurator.ToolbarModifier( 'editor-basic' );
|
||||
|
||||
var done = 0;
|
||||
toolbarModifier.init( onToolbarInit );
|
||||
toolbarModifier.onRefresh = onRefresh;
|
||||
|
||||
CKEDITOR.document.getById( 'toolbarModifierWrapper' ).append( toolbarModifier.mainContainer );
|
||||
|
||||
var toolbarTextModifier = new ToolbarConfigurator.ToolbarTextModifier( 'editor-advanced' );
|
||||
toolbarTextModifier.init( onToolbarInit );
|
||||
toolbarTextModifier.onRefresh = onRefresh;
|
||||
|
||||
function onToolbarInit() {
|
||||
if ( ++done === 2 ) {
|
||||
onToolbarsDone();
|
||||
|
||||
positionSticky.watch( CKEDITOR.document.findOne( '.toolbar' ), function() {
|
||||
return mode === 'advanced';
|
||||
} );
|
||||
}
|
||||
}
|
||||
|
||||
function onToolbarsDone() {
|
||||
if ( mode === 'basic' ) {
|
||||
toggleModeBasic( false );
|
||||
} else {
|
||||
toggleModeAdvanced( false );
|
||||
}
|
||||
|
||||
updateSwitcher();
|
||||
|
||||
setTimeout( function() {
|
||||
CKEDITOR.document.findOne( '.editors-container' ).addClass( 'active' );
|
||||
CKEDITOR.document.findOne( '#toolbarModifierWrapper' ).addClass( 'active' );
|
||||
}, 200 );
|
||||
}
|
||||
|
||||
CKEDITOR.document.getById( 'toolbarModifierWrapper' ).append( toolbarTextModifier.mainContainer );
|
||||
|
||||
function toogleModeSwitch( onElement, offElement, onModifier, offModifier ) {
|
||||
onElement.addClass( 'fancy-button-active' );
|
||||
offElement.removeClass( 'fancy-button-active' );
|
||||
|
||||
onModifier.showUI();
|
||||
offModifier.hideUI();
|
||||
}
|
||||
|
||||
function toggleModeBasic( callOnRefresh ) {
|
||||
callOnRefresh = ( callOnRefresh !== false );
|
||||
mode = 'basic';
|
||||
window.location.hash = '#basic';
|
||||
toogleModeSwitch( modeSwitchBasic, modeSwitchAdvanced, toolbarModifier, toolbarTextModifier );
|
||||
|
||||
configuratorSection.removeClass( 'freed-width' );
|
||||
basicInstruction.show();
|
||||
advancedInstruction.hide();
|
||||
|
||||
callOnRefresh && onRefresh( toolbarModifier );
|
||||
}
|
||||
|
||||
function toggleModeAdvanced( callOnRefresh ) {
|
||||
callOnRefresh = ( callOnRefresh !== false );
|
||||
mode = 'advanced';
|
||||
window.location.hash = '#advanced';
|
||||
toogleModeSwitch( modeSwitchAdvanced, modeSwitchBasic, toolbarTextModifier, toolbarModifier );
|
||||
|
||||
configuratorSection.addClass( 'freed-width' );
|
||||
advancedInstruction.show();
|
||||
basicInstruction.hide();
|
||||
|
||||
callOnRefresh && onRefresh( toolbarTextModifier );
|
||||
}
|
||||
|
||||
modeSwitchBasic.on( 'click', toggleModeBasic );
|
||||
modeSwitchAdvanced.on( 'click', toggleModeAdvanced );
|
||||
|
||||
//
|
||||
// Position:sticky for the toolbar.
|
||||
//
|
||||
|
||||
// Will make elements behave like they were styled with position:sticky.
|
||||
var positionSticky = {
|
||||
// Store object: {
|
||||
// element: CKEDITOR.dom.element, // Element which will float.
|
||||
// placeholder: CKEDITOR.dom.element, // Placeholder which is place to prevent page bounce.
|
||||
// isFixed: boolean // Whether element float now.
|
||||
// }
|
||||
watched: [],
|
||||
|
||||
active: [],
|
||||
|
||||
staticContainer: null,
|
||||
|
||||
init: function() {
|
||||
var element = CKEDITOR.dom.element.createFromHtml(
|
||||
'<div class="staticContainer">' +
|
||||
'<div class="grid-container" >' +
|
||||
'<div class="grid-width-100">' +
|
||||
'<div class="inner"></div>' +
|
||||
'</div>' +
|
||||
'</div>' +
|
||||
'</div>' );
|
||||
|
||||
this.staticContainer = element.findOne( '.inner' );
|
||||
|
||||
CKEDITOR.document.getBody().append( element );
|
||||
},
|
||||
|
||||
watch: function( element, preventFunc ) {
|
||||
this.watched.push( {
|
||||
element: element,
|
||||
placeholder: new CKEDITOR.dom.element( 'div' ),
|
||||
isFixed: false,
|
||||
preventFunc: preventFunc
|
||||
} );
|
||||
},
|
||||
|
||||
checkAll: function() {
|
||||
for ( var i = 0; i < this.watched.length; i++ ) {
|
||||
this.check( this.watched[ i ] );
|
||||
}
|
||||
},
|
||||
|
||||
check: function( element ) {
|
||||
var isFixed = element.isFixed;
|
||||
var shouldBeFixed = this.shouldBeFixed( element );
|
||||
|
||||
// Nothing to be done.
|
||||
if ( isFixed === shouldBeFixed ) {
|
||||
return;
|
||||
}
|
||||
|
||||
var placeholder = element.placeholder;
|
||||
|
||||
if ( isFixed ) {
|
||||
// Unfixing.
|
||||
|
||||
element.element.insertBefore( placeholder );
|
||||
placeholder.remove();
|
||||
|
||||
element.element.removeStyle( 'margin' );
|
||||
|
||||
this.active.splice( CKEDITOR.tools.indexOf( this.active, element ), 1 );
|
||||
|
||||
} else {
|
||||
// Fixing.
|
||||
placeholder.setStyle( 'width', element.element.getSize( 'width' ) + 'px' );
|
||||
placeholder.setStyle( 'height', element.element.getSize( 'height' ) + 'px' );
|
||||
placeholder.setStyle( 'margin-bottom', element.element.getComputedStyle( 'margin-bottom' ) );
|
||||
placeholder.setStyle( 'display', element.element.getComputedStyle( 'display' ) );
|
||||
placeholder.insertAfter( element.element );
|
||||
|
||||
this.staticContainer.append( element.element );
|
||||
|
||||
this.active.push( element );
|
||||
}
|
||||
|
||||
element.isFixed = !element.isFixed;
|
||||
},
|
||||
|
||||
shouldBeFixed: function( element ) {
|
||||
if ( element.preventFunc && element.preventFunc() ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// If element is already fixed we are checking it's placeholder.
|
||||
var related = ( element.isFixed ? element.placeholder : element.element ),
|
||||
clientRect = related.$.getBoundingClientRect(),
|
||||
staticHeight = this.staticContainer.getSize('height' ),
|
||||
elemHeight = element.element.getSize( 'height' );
|
||||
|
||||
if ( element.isFixed ) {
|
||||
return ( clientRect.top + elemHeight < staticHeight );
|
||||
} else {
|
||||
return ( clientRect.top < staticHeight );
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
positionSticky.init();
|
||||
|
||||
CKEDITOR.document.getWindow().on( 'scroll',
|
||||
new CKEDITOR.tools.eventsBuffer( 100, positionSticky.checkAll, positionSticky ).input
|
||||
);
|
||||
|
||||
// Make the toolbar sticky.
|
||||
positionSticky.watch( CKEDITOR.document.findOne( '.editors-container' ) );
|
||||
|
||||
// Help button and help-content.
|
||||
( function() {
|
||||
var helpButton = CKEDITOR.document.getById( 'help' ),
|
||||
helpContent = CKEDITOR.document.getById( 'help-content' );
|
||||
|
||||
// Don't show help button on IE8 because it's unsupported by Pico Modal.
|
||||
if ( CKEDITOR.env.ie && CKEDITOR.env.version == 8 ) {
|
||||
helpButton.hide();
|
||||
} else {
|
||||
// Display help modal when the button is clicked.
|
||||
helpButton.on( 'click', function( evt ) {
|
||||
SF.modal( {
|
||||
// Clone modal content from DOM.
|
||||
content: helpContent.getHtml(),
|
||||
|
||||
afterCreate: function( modal ) {
|
||||
// Enable modal content button to close the modal.
|
||||
new CKEDITOR.dom.element( modal.modalElem() ).findOne( '.help-content-close' ).once( 'click', modal.close );
|
||||
}
|
||||
} ).show();
|
||||
} );
|
||||
}
|
||||
} )();
|
||||
} )();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1 +0,0 @@
|
||||
<html><body bgcolor="#FFFFFF"></body></html>
|
||||
@ -1,103 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title>UI Color Picker — CKEditor Sample</title>
|
||||
<meta charset="utf-8">
|
||||
<script src="../../../ckeditor.js"></script>
|
||||
<link rel="stylesheet" href="../../../samples/sample.css">
|
||||
<meta name="ckeditor-sample-name" content="UIColor plugin">
|
||||
<meta name="ckeditor-sample-group" content="Plugins">
|
||||
<meta name="ckeditor-sample-description" content="Using the UIColor plugin to pick up skin color.">
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="samples">
|
||||
<a href="../../../samples/index.html">CKEditor Samples</a> » UI Color Plugin
|
||||
</h1>
|
||||
<div class="description">
|
||||
<p>
|
||||
This sample shows how to use the UI Color picker toolbar button to preview the skin color of the editor.
|
||||
<strong>Note:</strong>The UI skin color feature depends on the CKEditor skin
|
||||
compatibility. The Moono and Kama skins are examples of skins that work with it.
|
||||
</p>
|
||||
</div>
|
||||
<form action="../../../samples/sample_posteddata.php" method="post">
|
||||
<div id="ui-color-plugin">
|
||||
<p>
|
||||
If the <strong>uicolor</strong> plugin along with the dedicated <strong>UIColor</strong>
|
||||
toolbar button is added to CKEditor, the user will also be able to pick the color of the
|
||||
UI from the color palette available in the <strong>UI Color Picker</strong> dialog window.
|
||||
</p>
|
||||
<p>
|
||||
To insert a CKEditor instance with the <strong>uicolor</strong> plugin enabled,
|
||||
use the following JavaScript call:
|
||||
</p>
|
||||
<pre class="samples">
|
||||
CKEDITOR.replace( '<em>textarea_id</em>', {
|
||||
<strong>extraPlugins: 'uicolor',</strong>
|
||||
toolbar: [ [ 'Bold', 'Italic' ], [ <strong>'UIColor'</strong> ] ]
|
||||
});</pre>
|
||||
<h2>Used in themed instance</h2>
|
||||
<p>
|
||||
Click the <strong>UI Color Picker</strong> toolbar button to open up a color picker dialog.
|
||||
</p>
|
||||
<p>
|
||||
<textarea cols="80" id="editor1" name="editor2" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
|
||||
<script>
|
||||
|
||||
// Replace the <textarea id="editor"> with an CKEditor
|
||||
// instance, using default configurations.
|
||||
CKEDITOR.replace( 'editor1', {
|
||||
extraPlugins: 'uicolor',
|
||||
toolbar: [
|
||||
[ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
|
||||
[ 'FontSize', 'TextColor', 'BGColor' ],
|
||||
[ 'UIColor' ]
|
||||
]
|
||||
});
|
||||
|
||||
</script>
|
||||
</p>
|
||||
<h2>Used in inline instance</h2>
|
||||
<p>
|
||||
Click the below editable region to display floating toolbar, then click <strong>UI Color Picker</strong> button.
|
||||
</p>
|
||||
<div id="editor2" contenteditable="true">
|
||||
<p>This is some <strong>sample text</strong>. You are using <a data-cke-saved-href="http://ckeditor.com/" href="http://ckeditor.com/">CKEditor</a>.</p>
|
||||
</div>
|
||||
<script>
|
||||
|
||||
// Disable automatic creation of inline instances.
|
||||
CKEDITOR.disableAutoInline = true;
|
||||
|
||||
// Replace the <div id="editor3"> with an inline CKEditor instance.
|
||||
CKEDITOR.inline( 'editor2', {
|
||||
extraPlugins: 'uicolor',
|
||||
toolbar: [
|
||||
[ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
|
||||
[ 'FontSize', 'TextColor', 'BGColor' ],
|
||||
[ 'UIColor' ]
|
||||
]
|
||||
});
|
||||
|
||||
</script>
|
||||
</div>
|
||||
<p>
|
||||
<input type="submit" value="Submit">
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr>
|
||||
<p>
|
||||
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2012, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
|
||||
Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,17 +0,0 @@
|
||||
<div id="node-16" class="node">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="content clear-block">
|
||||
<p>We can use access plugins to determine access to a page or visibility of the panes in a page. Basically, we just determine access based on configuration settings and the various contexts that are available to us.</p>
|
||||
<p>The arbitrary example in plugins/access/arg_length.inc determines access based on the length of the simplecontext argument. You can configure whether access should be granted if the simplecontext argument is greater or less than some number.</p>
|
||||
</div>
|
||||
|
||||
<div class="clear-block">
|
||||
<div class="meta">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -1,20 +0,0 @@
|
||||
<div id="node-12" class="node">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="content clear-block">
|
||||
<p>Contexts are fundamental to CTools, and they almost always start with an argument to a panels page, so we'll start there too.</p>
|
||||
<p>We first need to process an argument.</p>
|
||||
<p>We're going to work with a "Simplecontext" context type and argument, and then with a content type that displays it. So we'll start by with the Simplecontext argument plugin in plugins/arguments/simplecontext_arg.inc.</p>
|
||||
<p>Note that the name of the file (simplecontext_arg.inc) is built from the machine name of our plugin (simplecontext_arg). And note also that the primary function that we use to provide our argument (ctools_plugin_example_simplecontext_arg_ctools_arguments()) is also built from the machine name. This magic is most of the naming magic that you have to know.</p>
|
||||
<p>You can browse plugins/arguments/simplecontext_arg.inc and see the little that it does.</p>
|
||||
</div>
|
||||
|
||||
<div class="clear-block">
|
||||
<div class="meta">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -1,19 +0,0 @@
|
||||
<div id="node-10" class="node">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="content clear-block">
|
||||
<p>This demonstration module is intended for developers to look at and play with. CTools plugins are not terribly difficult to do, but it can be hard to sort through the various arguments and required functions. The idea here is that you should have a starting point for most anything you want to do. Just work through the example, and then start experimenting with changing it.</p>
|
||||
<p>There are two parts to this demo: </p>
|
||||
<p>First, there is a sample panel provided that uses all the various plugins. It's at <a href="/ctools_plugin_example/12345">ctools_example/12345</a>. You can edit the panel and configure all the panes on it.</p>
|
||||
<p>Second, the code is there for you to experiment with and change as you see fit. Sometimes starting with simple code and working with it can take you places that it's hard to go when you're looking at more complex examples.</p>
|
||||
</div>
|
||||
|
||||
<div class="clear-block">
|
||||
<div class="meta">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -1,17 +0,0 @@
|
||||
<div id="node-14" class="node">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="content clear-block">
|
||||
<p>Now we get to the heart of the matter: Building a content type plugin. A content type plugin uses the contexts available to it to display something. plugins/content_types/simplecontext_content_type.inc does this work for us.</p>
|
||||
<p>Note that our content type also has an edit form which can be used to configure its behavior. This settings form is accessed through the panels interface, and it's up to you what the settings mean to the code and the generation of content in the display rendering.</p>
|
||||
</div>
|
||||
|
||||
<div class="clear-block">
|
||||
<div class="meta">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -1,21 +0,0 @@
|
||||
<div id="node-13" class="node">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="content clear-block">
|
||||
<p>Now that we have a plugin for a simplecontext argument, we can create a plugin for a simplecontext context. </p>
|
||||
<p>Normally, a context would take an argument which is a key like a node ID (nid) and retrieve a more complex object from a database or whatever. In our example, we'll artificially transform the argument into an arbitrary "context" data object. </p>
|
||||
<p>plugins/contexts/simplecontext.inc implements our context.</p>
|
||||
<p>Note that there are actually two ways to create a context. The normal one, which we've been referring to, is to create a context from an argument. However, it is also possible to configure a context in a panel using the panels interface. This is quite inflexible, but might be useful for configuring single page. However, it means that we have a settings form for exactly that purpose. Our context would have to know how to create itself from a settings form as well as from an argument. Simplecontext can do that.</p>
|
||||
<p>A context plugin can also provide keywords that expose parts of its context using keywords like masterkeyword:dataitem. The node plugin for ctools has node:nid and node:title, for example. The simplecontext plugin here provides the simplest of keywords.</p>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="clear-block">
|
||||
<div class="meta">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -1,20 +0,0 @@
|
||||
<div id="node-11" class="node">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="content clear-block">
|
||||
<p>Your module must provide a few things so that your plugins can be found.</p>
|
||||
<p>First, you need to implement hook_ctools_plugin_directory(). Here we're telling CTools that our plugins will be found in the module's directory in the plugins/<plugintype> directory. Context plugins will be in ctools_plugin_example/plugins/contexts, Content-type plugins will be in ctools_plugin_example/plugins/content_types.</p>
|
||||
<p><div class="codeblock"><code><span style="color: #000000"><span style="color: #0000BB"><?php<br /></span><span style="color: #007700">function </span><span style="color: #0000BB">ctools_plugin_example_ctools_plugin_directory</span><span style="color: #007700">(</span><span style="color: #0000BB">$module</span><span style="color: #007700">, </span><span style="color: #0000BB">$plugin</span><span style="color: #007700">) {<br /> if (</span><span style="color: #0000BB">$module </span><span style="color: #007700">== </span><span style="color: #DD0000">'ctools' </span><span style="color: #007700">&& !empty(</span><span style="color: #0000BB">$plugin</span><span style="color: #007700">)) {<br /> return </span><span style="color: #DD0000">"plugins/$plugin"</span><span style="color: #007700">;<br /> }<br />}<br /></span><span style="color: #0000BB">?></span></span></code></div></p>
|
||||
<p>Second, if you module wants to provide default panels pages, you can implement hook_ctools_plugin_api(). CTools will then pick up your panels pages in the file named <modulename>.pages_default.inc.</p>
|
||||
<p><div class="codeblock"><code><span style="color: #000000"><span style="color: #0000BB"><?php<br /></span><span style="color: #007700">function </span><span style="color: #0000BB">ctools_plugin_example_ctools_plugin_api</span><span style="color: #007700">(</span><span style="color: #0000BB">$module</span><span style="color: #007700">, </span><span style="color: #0000BB">$api</span><span style="color: #007700">) {<br /> if (</span><span style="color: #0000BB">$module </span><span style="color: #007700">== </span><span style="color: #DD0000">'panels_mini' </span><span style="color: #007700">&& </span><span style="color: #0000BB">$api </span><span style="color: #007700">== </span><span style="color: #DD0000">'panels_default'</span><span style="color: #007700">) {<br /> return array(</span><span style="color: #DD0000">'version' </span><span style="color: #007700">=> </span><span style="color: #0000BB">1</span><span style="color: #007700">);<br /> }<br /> if (</span><span style="color: #0000BB">$module </span><span style="color: #007700">== </span><span style="color: #DD0000">'page_manager' </span><span style="color: #007700">&& </span><span style="color: #0000BB">$api </span><span style="color: #007700">== </span><span style="color: #DD0000">'pages_default'</span><span style="color: #007700">) {<br /> return array(</span><span style="color: #DD0000">'version' </span><span style="color: #007700">=> </span><span style="color: #0000BB">1</span><span style="color: #007700">);<br /> }<br />}<br /></span><span style="color: #0000BB">?></span></span></code></div></p>
|
||||
</div>
|
||||
|
||||
<div class="clear-block">
|
||||
<div class="meta">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -1,18 +0,0 @@
|
||||
<div id="node-15" class="node">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="content clear-block">
|
||||
<p>Often a single data type can lead us to other data types. For example, a node has a user (the author) and the user has data associated with it.</p>
|
||||
<p>A relationship plugin allows this kind of data to be accessed. </p>
|
||||
<p>An example relationship plugin is provided in plugins/relationships/relcontext_from_simplecontext.inc. It looks at a simplecontext (which we got from an argument) and builds an (artificial) "relcontext" from that.</p>
|
||||
</div>
|
||||
|
||||
<div class="clear-block">
|
||||
<div class="meta">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -1,29 +0,0 @@
|
||||
<p>The Chaos Tool Suite is a series of tools for developers to make code that I've found to be very useful to Views and Panels more readily available. Certain methods of doing things, particularly with AJAX, exportable objects and a plugin system, are proving to be ideas that are useful outside of just Views and Panels. This module does not offer much directly to the end user, but instead, creates a library for other modules to use. If you are an end user and some module asked you to install the CTools suite, then this is far as you really need to go. If you're a developer and are interested in these tools, read on!</p>
|
||||
|
||||
<h2>Tools provided by CTools</h2>
|
||||
|
||||
<dl>
|
||||
<dt><a href="&topic:ctools/plugins&">Plugins</a></dt>
|
||||
<dd>The plugins tool allows a module to allow <b>other</b> modules (and themes!) to provide plugins which provide some kind of functionality or some kind of task. For example, in Panels there are several types of plugins: Content types (which are like blocks), layouts (which are page layouts) and styles (which can be used to style a panel). Each plugin is represented by a .inc file, and the functionality they offer can differ wildly.</dd>
|
||||
|
||||
<dt><a href="&topic:ctools/context&">Context</a></dt>
|
||||
<dd>Context is the idea that the objects that are used in page generation have more value than simply creating a single piece of output. Instead, contexts can be used to create multiple pieces of content that can all be put onto the page. Additionally, contexts can be used to derive other contexts via relationships, such as determining the node author and displaying data about the new context.</dd>
|
||||
|
||||
<dt><a href="&topic:ctools/ajax&">AJAX Tools</a></dt>
|
||||
<dd>AJAX (also known as AHAH) is a method of allowing the browser and the server to communicate without requiring a page refresh. It can be used to create complicated interactive forms, but it is somewhat difficult to integrate into Drupal's Form API. These tools make it easier to accomplish this goal. In addition, CTools provides a few other javascript helpers, such as a modal dialog, a collapsible div, a simple dropdown and dependent checkboxes.</dd>
|
||||
|
||||
<dt><a href="&topic:ctools/css&">CSS scrubbing and caching</a></dt>
|
||||
<dd>Drupal comes with a fantastic array of tools to ensure HTML is safe to output but does not contain any similar tools for CSS. CTools provides a small tool to sanitize CSS, so user-input CSS code can still be safely used. It also provides a method for caching CSS for better performance.</dd>
|
||||
|
||||
<dt><a href="&topic:ctools/export&">Exportable objects</a></dt>
|
||||
<dd>Views and Panels both use objects that can either be in code or in the database, and the objects can be exported into a piece of PHP code, so they can be moved from site to site or out of the database entirely. This library abstracts that functionality, so other modules can use this same concept for their data.</dd>
|
||||
|
||||
<dt><a href="&topic:ctools/form&">Form tools</a></dt>
|
||||
<dd>Drupal 6's FAPI really improved over Drupal 5, and made a lot of things possible. Still, it missed a few items that were needed to make form wizards and truly dynamic AJAX forms possible. CTools includes a replacement for drupal_get_form() that has a few more options and allows the caller to examine the $form_state once the form has completed.</dd>
|
||||
|
||||
<dt><a href="&topic:ctools/wizard&">Form wizards</a></dt>
|
||||
<dd>Finally! An easy way to have form wizards, which is any 'form' that is actually a string of forms that build up to a final conclusion. The form wizard supports a single entry point, the ability to choose whether or not the user can go forward/back/up on the form and easy callbacks to handle the difficult job of dealing with data in between forms.</dd>
|
||||
|
||||
<dt><a href="&topic:ctools/object-cache&">Temporary object cache</a></dt>
|
||||
<dd>For normal forms, all of the data needed for an object is stored in the form so that the browser handles a lot of the work. For multi-step and ajax forms, however, this is impractical, and letting the browser store data can be insecure. The object cache provides a non-volatile location to store temporary data while the form is being worked on. This is much safer than the standard Drupal caching mechanism, which is volatile, meaning it can be cleared at any time and any system using it must be capable of recreating the data that was there. This system also allows for object locking, since any object which has an item in the cache from another person can be assumed to be 'locked for editing'.</dd>
|
||||
</dl>
|
||||
@ -1 +0,0 @@
|
||||
<p>To be written.</p>
|
||||
@ -1,12 +0,0 @@
|
||||
<p>Access plugins allow context based access control to pages.</p>
|
||||
<pre> 'title' => Title of the plugin
|
||||
'description' => Description of the plugin
|
||||
'callback' => callback to see if there is access is available. params: $conf, $contexts, $account
|
||||
'required context' => zero or more required contexts for this access plugin
|
||||
'default' => an array of defaults or a callback giving defaults
|
||||
'settings form' => settings form. params: &$form, &$form_state, $conf
|
||||
settings form validate
|
||||
settings form submit
|
||||
</pre>
|
||||
|
||||
<p><strong>Warning:</strong> your settings array will be stored <strong>in the meny system</strong> to reduce loads, so be <strong>trim</strong>.</p>
|
||||
@ -1,14 +0,0 @@
|
||||
<p>Arguments create a context from external input, which is assumed to be a string as though it came from a URL element.</p>
|
||||
|
||||
<pre>'title' => title
|
||||
'description' => Description
|
||||
'keyword' => Default keyword for the context
|
||||
'context' => Callback to create the context. Params: $arg = NULL, $conf = NULL, $empty = FALSE
|
||||
'default' => either an array of default settings or a string which is a callback or null to not use.
|
||||
'settings form' => params: $form, $form_state, $conf -- gets the whole form. Should put anything it wants to keep automatically in $form['settings']
|
||||
'settings form validate' => params: $form, $form_state
|
||||
'settings form submit' => params: $form, $form_state
|
||||
'criteria form' => params: $form, &$form_state, $conf, $argument, $id -- gets the whole argument. It should only put form widgets in $form[$id]. $conf may not be properly initialized so always guard against this due to arguments being changed and handlers not being updated to match.
|
||||
+ submit + validate
|
||||
'criteria select' => returns true if the selected criteria matches the context. params: $context, $conf
|
||||
</pre>
|
||||
@ -1,157 +0,0 @@
|
||||
<p>The CTools pluggable content system provides various pieces of content as discrete bits of data that can be added to other applications, such as Panels or Dashboard via the UI. Whatever the content is added to stores the configuration for that individual piece of content, and provides this to the content.</p>
|
||||
|
||||
<p>Each content type plugin will be contained in a .inc file, with subsidiary files, if necessary, in or near the same directory. Each content type consists of some information and one or more subtypes, which all use the same renderer. Subtypes are considered to be instances of the type. For example, the 'views' content type would have each view in the system as a subtype. Many content types will have exactly one subtype.</p>
|
||||
|
||||
<p>Because the content and forms can be provided via ajax, the plugin also provides a list of CSS and JavaScript information that should be available on whatever page the content or forms may be AJAXed onto.</p>
|
||||
|
||||
<p>For the purposes of selecting content from the UI, each content subtype will have the following information:</p>
|
||||
|
||||
<ul>
|
||||
<li>A title</li>
|
||||
<li>A short description</li>
|
||||
<li>A category [Do we want to add hierarchy categories? Do we want category to be more than just a string?]</li>
|
||||
<li>An icon [do we want multiple icons? This becomes a hefty requirement]</li>
|
||||
</ul>
|
||||
|
||||
<p>Each piece of content provides one or more configuration forms, if necessary, and the system that includes the content will handle the data storage. These forms can be provided in sequence as wizards or as extra forms that can be accessed through advanced administration.</p>
|
||||
|
||||
<p>The plugin for a content type should contain:</p>
|
||||
|
||||
<dl>
|
||||
<dt>title</dt>
|
||||
<dd>For use on the content permissions screen.</dd>
|
||||
<dt>content types</dt>
|
||||
<dd>Either an array of content type definitions, or a callback that will return content type definitions. This callback will get the plugin definition as an argument.</dd>
|
||||
|
||||
<dt>content type</dt>
|
||||
<dd>[Optional] Provide a single content type definition. This is only necessary if content types might be intensive.</dd>
|
||||
|
||||
<dt>render callback</dt>
|
||||
<dd>The callback to render the content. Parameters:
|
||||
<dl>
|
||||
<dt>$subtype</dt>
|
||||
<dd>The name of the subtype being rendered. NOT the loaded subtype data.</dd>
|
||||
|
||||
<dt>$conf</dt>
|
||||
<dd>The stored configuration for the content.</dd>
|
||||
|
||||
<dt>$args</dt>
|
||||
<dd>Any arguments passed.</dd>
|
||||
|
||||
<dt>$context</dt>
|
||||
<dd>An array of contexts requested by the required contexts and assigned by the configuration step.</dd>
|
||||
|
||||
<dt>$incoming_content</dt>
|
||||
<dd>Any 'incoming content' if this is a wrapper.</dd>
|
||||
</dl>
|
||||
</dd>
|
||||
|
||||
<dt>admin title</dt>
|
||||
<dd>A callback to provide the administrative title. If it is not a function, then it will be counted as a string to use as the admin title.</dd>
|
||||
|
||||
<dt>admin info</dt>
|
||||
<dd>A callback to provide administrative information about the content, to be displayed when manipulating the content. It should contain a summary of configuration.</dd>
|
||||
|
||||
<dt>edit form</dt>
|
||||
<dd>Either a single form ID or an array of forms *keyed* by form ID with the value to be used as the title of the form. %title me be used as a placeholder for the administrative title if necessary.
|
||||
Example:
|
||||
<pre>array(
|
||||
'ctools_example_content_form_second' => t('Configure first form'),
|
||||
'ctools_example_content_form_first' => t('Configure second form'),
|
||||
),
|
||||
</pre>
|
||||
The first form will always have required configuration added to it. These forms are normal FAPI forms, but you do not need to provide buttons, these will be added by the form wizard.
|
||||
</dd>
|
||||
|
||||
<dt>add form</dt>
|
||||
<dd>[Optional] If different from the edit forms, provide them here in the same manner. Also may be set to FALSE to not have an add form.</dd>
|
||||
|
||||
<dt>css</dt>
|
||||
<dd>A file or array of CSS files that are necessary for the content.</dd>
|
||||
|
||||
<dt>js</dt>
|
||||
<dd>A file or array of javascript files that are necessary for the content to be displayed.</dd>
|
||||
|
||||
<dt>admin css</dt>
|
||||
<dd>A file or array of CSS files that are necessary for the forms.</dd>
|
||||
|
||||
<dt>admin js</dt>
|
||||
<dd>A file or array of JavaScript files that are necessary for the forms.</dd>
|
||||
|
||||
<dt>extra forms</dt>
|
||||
<dd>An array of form information to handle extra administrative forms.</dd>
|
||||
|
||||
<dt>no title override</dt>
|
||||
<dd>Set to TRUE if the title cannot be overridden.</dd>
|
||||
|
||||
<dt>single</dt>
|
||||
<dd>Set to TRUE if this content provides exactly one subtype.</dd>
|
||||
|
||||
<dt>render last</dt>
|
||||
<dd>Set to true if for some reason this content needs to render after other content. This is primarily used for forms to ensure that render order is correct.</dd>
|
||||
</dl>
|
||||
|
||||
<p>TODO: many of the above callbacks can be assumed based upon patterns: modulename + '_' + name + '_' + function. i.e, render, admin_title, admin_info, etc.</p>
|
||||
|
||||
<p>TODO: Some kind of simple access control to easily filter out content.</p>
|
||||
|
||||
<p>The subtype definition should contain:</p>
|
||||
|
||||
<dl>
|
||||
<dt>title</dt>
|
||||
<dd>The title of the subtype.</dd>
|
||||
|
||||
<dt>icon</dt>
|
||||
<dd>The icon to display for the subtype.</dd>
|
||||
|
||||
<dt>path</dt>
|
||||
<dd>The path for the icon if it is not in the same directory as the plugin.</dd>
|
||||
|
||||
<dt>description</dt>
|
||||
<dd>The short description of the subtype, to be used when selecting it in the UI.</dd>
|
||||
|
||||
<dt>category</dt>
|
||||
<dd>Either a text string for the category, or an array of the text string followed by the category weight.</dd>
|
||||
|
||||
<dt>required context [Optional]</dt>
|
||||
|
||||
<dd>Either a ctools_context_required or ctools_context_optional or array of contexts for this content. If omitted, no contexts are used.</dd>
|
||||
|
||||
<dt>create content access [Optional]</dt>
|
||||
|
||||
<dd>An optional callback to determine if a user can access this subtype. The callback will receive two arguments, the type and subtype.</dd>
|
||||
</dl>
|
||||
|
||||
<h2>Rendered content</h2>
|
||||
|
||||
<p>Rendered content is a little more than just HTML.</p>
|
||||
|
||||
<dl>
|
||||
<dt>title</dt>
|
||||
<dd>The safe to render title of the content.</dd>
|
||||
|
||||
<dt>content</dt>
|
||||
<dd>The safe to render HTML content.</dd>
|
||||
|
||||
<dt>links</dt>
|
||||
<dd>An array of links associated with the content suitable for theme('links').</dd>
|
||||
|
||||
<dt>more</dt>
|
||||
<dd>An optional 'more' link (destination only)</dd>
|
||||
|
||||
<dt>admin_links</dt>
|
||||
<dd>Administrative links associated with the content, suitable for theme('links').</dd>
|
||||
|
||||
<dt>feeds</dt>
|
||||
<dd>An array of feed icons or links associated with the content. Each member of the array is rendered HTML.</dd>
|
||||
|
||||
<dt>type</dt>
|
||||
<dd>The content type.</dd>
|
||||
|
||||
<dt>subtype</dt>
|
||||
<dd>The content subtype. These two may be used together as module-delta for block style rendering.</dd>
|
||||
</dl>
|
||||
|
||||
<h2>Todo: example</h2>
|
||||
|
||||
<p>Todo after implementations are updated to new version.</p>
|
||||
@ -1,13 +0,0 @@
|
||||
<p>Context plugin data:</p>
|
||||
|
||||
<pre>
|
||||
'title' => Visible title
|
||||
'description' => Description of context
|
||||
'context' => Callback to create a context. Params: $empty, $data = NULL, $conf = FALSE
|
||||
'settings form' => Callback to show a context setting form. Params: ($conf, $external = FALSE)
|
||||
'settings form validate' => params: ($form, &$form_values, &$form_state)
|
||||
'settings form submit' => params: 'ctools_context_node_settings_form_submit',
|
||||
'keyword' => The default keyword to use.
|
||||
'context name' => The unique identifier for this context for use by required context checks.
|
||||
'no ui' => if TRUE this context cannot be selected.
|
||||
</pre>
|
||||
@ -1,13 +0,0 @@
|
||||
<p>Relationship plugin data:</p>
|
||||
|
||||
<pre>
|
||||
'title' => The title to display.
|
||||
'description' => Description to display.
|
||||
'keyword' => Default keyword for the context created by this relationship.
|
||||
'required context' => One or more ctools_context_required/optional objects
|
||||
describing the context input.
|
||||
new panels_required_context(t('Node'), 'node'),
|
||||
'context' => The callback to create the context. Params: ($context = NULL, $conf)
|
||||
'settings form' => Settings form. Params: $conf
|
||||
'settings form validate' => Validate.
|
||||
</pre>
|
||||
@ -1 +0,0 @@
|
||||
<p>To be written.</p>
|
||||
@ -1 +0,0 @@
|
||||
<p>To be written.</p>
|
||||
@ -1 +0,0 @@
|
||||
<p>To be written.</p>
|
||||
@ -1 +0,0 @@
|
||||
<p>To be written.</p>
|
||||
@ -1,85 +0,0 @@
|
||||
<p>Most user interfaces for exportables are very similar, so CTools includes a tool to provide the framework for the most common UI. This tool is a plugin of the 'export_ui' type. In order to create a UI for your exportable object with this tool, you first need to ensure that your module supports the plugin:</p>
|
||||
|
||||
<pre>
|
||||
function HOOK_ctools_plugin_directory($module, $plugin) {
|
||||
if ($module == 'ctools' && $plugin == 'export_ui') {
|
||||
return 'plugins/' . $plugin;
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>Then, you need to create a plugin .inc file describing your UI. Most of the UI runs with sane but simple defaults, so for the very simplest UI you don't need to do very much. This is a very simple example plugin for the 'example' export type:</p>
|
||||
|
||||
<pre>
|
||||
$plugin = array(
|
||||
// The name of the table as found in the schema in hook_install. This
|
||||
// must be an exportable type with the 'export' section defined.
|
||||
'schema' => 'example',
|
||||
|
||||
// The access permission to use. If not provided it will default to
|
||||
// 'administer site configuration'
|
||||
'access' => 'administer example',
|
||||
|
||||
// You can actually define large chunks of the menu system here. Nothing
|
||||
// is required here. If you leave out the values, the prefix will default
|
||||
// to admin/structure and the item will default to the plugin name.
|
||||
'menu' => array(
|
||||
'menu prefix' => 'admin/structure',
|
||||
'menu item' => 'example',
|
||||
// Title of the top level menu. Note this should not be translated,
|
||||
// as the menu system will translate it.
|
||||
'menu title' => 'Example',
|
||||
// Description of the top level menu, which is usually needed for
|
||||
// menu items in an administration list. Will be translated
|
||||
// by the menu system.
|
||||
'menu description' => 'Administer site example objects.',
|
||||
),
|
||||
|
||||
// These are required to provide proper strings for referring to the
|
||||
// actual type of exportable. "proper" means it will appear at the
|
||||
// beginning of a sentence.
|
||||
'title singular' => t('example'),
|
||||
'title singular proper' => t('Example'),
|
||||
'title plural' => t('examples'),
|
||||
'title plural proper' => t('Examples'),
|
||||
|
||||
// This will provide you with a form for editing the properties on your
|
||||
// exportable, with validate and submit handler.
|
||||
//
|
||||
// The item being edited will be in $form_state['item'].
|
||||
//
|
||||
// The submit handler is only responsible for moving data from
|
||||
// $form_state['values'] to $form_state['item'].
|
||||
//
|
||||
// All callbacks will accept &$form and &$form_state as arguments.
|
||||
'form' => array(
|
||||
'settings' => 'example_ctools_export_ui_form',
|
||||
'validate' => 'example_ctools_export_ui_form_validate',
|
||||
'submit' => 'example_ctools_export_ui_form_submit',
|
||||
),
|
||||
|
||||
);
|
||||
</pre>
|
||||
|
||||
<p>For a more complete list of what you can set in your plugin, please see ctools_export_ui_defaults() in includes/export-ui.inc to see what the defaults are.</p>
|
||||
|
||||
<h2>More advanced UIs</h2>
|
||||
|
||||
<p>The bulk of this UI is built on an class called ctools_export_ui, which is itself stored in ctools/plugins/export_ui as the default plugin. Many UIs will have more complex needs than the defaults provide. Using OO and overriding methods can allow an implementation to use the basics and still provide more where it is needed. To utilize this, first add a 'handler' directive to your plugin .inc file:</p>
|
||||
|
||||
<pre>
|
||||
'handler' => array(
|
||||
'class' => 'ctools_export_ui_example',
|
||||
'parent' => 'ctools_export_ui',
|
||||
),
|
||||
</pre>
|
||||
|
||||
Then create your class in ctools_export_ui_example.class.php in your plugins directory:
|
||||
|
||||
<pre>
|
||||
class ctools_export_ui_example extends ctools_export_ui {
|
||||
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>You can override any method found in the class (see the source file for details). In particular, there are several list methods that are good candidates for overriding if you need to provide richer data for listing, sorting or filtering. If you need multi-step add/edit forms, you can override edit_page(), add_page(), clone_page(), and import_page() to put your wizard in place of the basic editing system. For an example of how to use multi-step wizards, see the import_page() method.</p>
|
||||
@ -1,294 +0,0 @@
|
||||
<p>Exportable objects are objects that can live either in the database or in code, or in both. If they live in both, then the object in code is considered to be "overridden", meaning that the version in code is ignored in favor of the version in the database.</p>
|
||||
|
||||
<p>The main benefit to this is that you can move objects that are intended to be structure or feature-related into code, thus removing them entirely from the database. This is a very important part of the deployment path, since in an ideal world, the database is primarily user generated content, whereas site structure and site features should be in code. However, many many features in Drupal rely on objects being in the database and provide UIs to create them.</p>
|
||||
|
||||
<p>Using this system, you can give your objects dual life. They can be created in the UI, exported into code and put in revision control. Views and Panels both use this system heavily. Plus, any object that properly implements this system can be utilized by the Features module to be used as part of a bundle of objects that can be turned into feature modules.</p>
|
||||
|
||||
<p>Typically, exportable objects have two identifiers. One identifier is a simple serial used for database identification. It is a primary key in the database and can be used locally. It also has a name which is an easy way to uniquely identify it. This makes it much less likely that importing and exporting these objects across systems will have collisions. They still can, of course, but with good name selection, these problems can be worked around.</p>
|
||||
|
||||
<h2>Making your objects exportable</h2>
|
||||
|
||||
<p>To make your objects exportable, you do have to do a medium amount of work.</p>
|
||||
|
||||
<ol>
|
||||
<li>Create a chunk of code in your object's schema definition in the .install file to introduce the object to CTools' export system.</li>
|
||||
<li>Create a load function for your object that utilizes ctools_export_load_object().</li>
|
||||
<li>Create a save function for your object that utilizes drupal_write_record() or any method you desire.</li>
|
||||
<li>Create an import and export mechanism from the UI.</li>
|
||||
</ol>
|
||||
|
||||
<h2>The export section of the schema file</h2>
|
||||
|
||||
<p>Exportable objects are created by adding definition to the schema in an 'export' section. For example:</p>
|
||||
|
||||
<pre>
|
||||
function mymodule_schema() {
|
||||
$schema['mymodule_myobj'] = array(
|
||||
'description' => t('Table storing myobj definitions.'),
|
||||
'export' => array(
|
||||
'key' => 'name',
|
||||
'key name' => 'Name',
|
||||
'primary key' => 'oid',
|
||||
'identifier' => 'myobj', // Exports will be as $myobj
|
||||
'default hook' => 'default_mymodule_myobj', // Function hook name.
|
||||
'api' => array(
|
||||
'owner' => 'mymodule',
|
||||
'api' => 'default_mymodule_myobjs', // Base name for api include files.
|
||||
'minimum_version' => 1,
|
||||
'current_version' => 1,
|
||||
),
|
||||
// If the key is stored in a table that is joined in, specify it:
|
||||
'key in table' => 'my_join_table',
|
||||
|
||||
),
|
||||
|
||||
// If your object's data is split up across multiple tables, you can
|
||||
// specify additional tables to join. This is very useful when working
|
||||
// with modules like exportables.module that has a special table for
|
||||
// translating keys to local database IDs.
|
||||
//
|
||||
// The joined table must have its own schema definition.
|
||||
//
|
||||
// If using joins, you should implement a 'delete callback' (see below)
|
||||
// to ensure that deletes happen properly. export.inc does not do this
|
||||
// automatically!
|
||||
'join' => array(
|
||||
'exportables' => array(
|
||||
// The following parameters will be used in this way:
|
||||
// SELECT ... FROM {mymodule_myobj} t__0 INNER JOIN {my_join_table} t__1 ON t__0.id = t__1.id AND extras
|
||||
'table' => 'my_join_table',
|
||||
'left_key' => 'format',
|
||||
'right_key' => 'id',
|
||||
// Optionally you can define a callback to add custom conditions or
|
||||
// alter the query as necessary. The callback function takes 3 args:
|
||||
//
|
||||
// myjoincallback(&$query, $schema, $join_schema);
|
||||
//
|
||||
// where $query is the database query object, $schema is the schema for
|
||||
// the export base table and $join_schema is the schema for the current
|
||||
// join table.
|
||||
'callback' => 'myjoincallback',
|
||||
|
||||
// You must specify which fields will be loaded. These fields must
|
||||
// exist in the schema definition of the joined table.
|
||||
'load' => array(
|
||||
'machine',
|
||||
),
|
||||
|
||||
// And finally you can define other tables to perform INNER JOINS
|
||||
//'other_joins' => array(
|
||||
// 'table' => ...
|
||||
//),
|
||||
),
|
||||
)
|
||||
'fields' => array(
|
||||
'name' => array(
|
||||
'type' => 'varchar',
|
||||
'length' => '255',
|
||||
'description' => 'Unique ID for this object. Used to identify it programmatically.',
|
||||
),
|
||||
'oid' => array(
|
||||
'type' => 'serial',
|
||||
'unsigned' => TRUE,
|
||||
'not null' => TRUE,
|
||||
'description' => 'Primary ID field for the table. Not used for anything except internal lookups.',
|
||||
'no export' => TRUE, // Do not export database-only keys.
|
||||
),
|
||||
// ......
|
||||
'primary key' => array('oid'),
|
||||
'unique keys' => array(
|
||||
'name' => array('name'),
|
||||
),
|
||||
);
|
||||
return $schema;
|
||||
}
|
||||
</pre>
|
||||
|
||||
<dl>
|
||||
<dt>key</dt>
|
||||
<dd>This is the primary key of the exportable object and should be a string as names are more portable across systems. It is possible to use numbers here, but be aware that export collisions are very likely. Defaults to 'name'.</dd>
|
||||
|
||||
<dt>key name</dt>
|
||||
<dd>Human readable title of the export key. Defaults to 'Name'. Because the schema is cached, do not translate this. It must instead be translated when used.</dd>
|
||||
|
||||
<dt>primary key</dt>
|
||||
<dd>A single field within the table that is to be used as the main identifier to discern whether or not the object has been written. As the schema definition's primary key value will be used by default, it is not usually necessary to define this.</dd>
|
||||
|
||||
<dt>object</dt>
|
||||
<dd>The class the object should be created as, if 'object factory' is not set. If this is not set either, defaults as stdClass.</dd>
|
||||
|
||||
<dt>object factory</dt>
|
||||
<dd>Function used to create the object. The function receives the schema and the loaded data as a parameters: your_factory_function($schema, $data). If this is set, 'object' has no effect since you can use your function to create whatever class you wish.</dd>
|
||||
|
||||
<dt>admin_title</dt>
|
||||
<dd>A convenience field that may contain the field which represents the human readable administrative title for use in export UI. If a field "admin_title" exists, it will automatically be used.</dd>
|
||||
|
||||
<dt>admin_description</dt>
|
||||
<dd>A convenience field that may contain the field which represents the human readable administrative title for use in export UI. If a field "admin_title" exists, it will automatically be used.</dd>
|
||||
|
||||
<dt>can disable</dt>
|
||||
<dd>Control whether or not the exportable objects can be disabled. All this does is cause the 'disabled' field on the object to always be set appropriately, and a variable is kept to record the state. Changes made to this state must be handled by the owner of the object. Defaults to TRUE.</dd>
|
||||
|
||||
<dt>status</dt>
|
||||
<dd>Exportable objects can be enabled or disabled, and this status is stored in a variable. This defines what variable that is. Defaults to: 'default_' . $table.</dd>
|
||||
|
||||
<dt>default hook</dt>
|
||||
<dd>What hook to invoke to find exportable objects that are currently defined. These will all be gathered into a giant array. Defaults to 'default_' . $table.</dd>
|
||||
|
||||
<dt>cache defaults</dt>
|
||||
<dd>If true, default objects will be cached so that the processing of the hook does not need to be called often. Defaults to FALSE. Recommended if you will potentially have a lot of objects in code. Not recommended if code will be the exception.</dd>
|
||||
|
||||
<dt>default cache bin</dt>
|
||||
<dd>If default object caching is enabled, what cache bin to use. This defaults to the basic "cache". It is highly recommended that you use a different cache bin if possible.</dd>
|
||||
|
||||
<dt>identifier</dt>
|
||||
<dd>When exporting the object, the identifier is the variable that the exported object will be placed in. Defaults to $table.</dd>
|
||||
|
||||
<dt>bulk export</dt>
|
||||
<dd>Declares whether or not the exportable will be available for bulk exporting.</dd>
|
||||
|
||||
<dt>export type string</dt>
|
||||
<dd>The export type string (Local, Overridden, Database) is normally stored as $item->type. Since type is a very common keyword, it's possible to specify what key to actually use. </dd>
|
||||
|
||||
<dt>list callback</dt>
|
||||
<dd>Bulk export callback to provide a list of exportable objects to be chosen for bulk exporting. Defaults to $module . '_' . $table . '_list' if the function exists. If it is not, a default listing function will be provided that will make a best effort to list the titles. See ctools_export_default_list().</dd>
|
||||
|
||||
<dt>to hook code callback</dt>
|
||||
<dd>Function used to generate an export for the bulk export process. This is only necessary if the export is more complicated than simply listing the fields. Defaults to $module . '_' . $table . '_to_hook_code'.</dd>
|
||||
|
||||
<dt>boolean</dt>
|
||||
<dd>Explicitly indicate if a table field contains a boolean or not. The Schema API does not model the
|
||||
difference between a tinyint and a boolean type. Boolean values are stored in tinyint fields. This may cause mismatch errors when exporting a non-boolean value from a tinyint field. Add this to a tinyint field if it contains boolean data and can be exported. Defaults to TRUE.
|
||||
|
||||
<dt>create callback</dt>
|
||||
<dd>CRUD callback to use to create a new exportable item in memory. If not provided, the default function will be used. The single argument is a boolean used to determine if defaults should be set on the object. This object will not be written to the database by this callback.</dd>
|
||||
|
||||
<dt>load callback</dt>
|
||||
<dd>CRUD callback to use to load a single item. If not provided, the default load function will be used. The callback will accept a single argument which should be an identifier of the export key.</dd>
|
||||
|
||||
<dt>load multiple callback</dt>
|
||||
<dd>CRUD callback to use to load multiple items. If not provided, the default multiple load function will be used. The callback will accept an array which should be the identifiers of the export key.</dd>
|
||||
|
||||
<dt>load all callback</dt>
|
||||
<dd>CRUD callback to use to load all items, usually for administrative purposes. If not provided, the default load function will be used. The callback will accept a single argument to determine if the load cache should be reset or not.</dd>
|
||||
|
||||
<dt>save callback</dt>
|
||||
<dd>CRUD callback to use to save a single item. If not provided, the default save function will be used. The callback will accept a single argument which should be the complete exportable object to save.</dd>
|
||||
|
||||
<dt>delete callback</dt>
|
||||
<dd>CRUD callback to use to delete a single item. If not provided, the default delete function will be used. The callback will accept a single argument which can be *either* the object or just the export key to delete. The callback MUST be able to accept either.</dd>
|
||||
|
||||
<dt>export callback</dt>
|
||||
<dd>CRUD callback to use for exporting. If not provided, the default export function will be used. The callback will accept two arguments, the first is the item to export, the second is the indent to place on the export, if any.</dd>
|
||||
|
||||
<dt>import callback</dt>
|
||||
<dd>CRUD callback to use for importing. If not provided, the default export function will be used. This function will accept the code as a single argument and, if the code evaluates, return an object represented by that code. In the case of failure, this will return a string with human readable errors.</dd>
|
||||
|
||||
<dt>status callback</dt>
|
||||
<dd>CRUD callback to use for updating the status of an object. If the status is TRUE the object will be disabled. If the status is FALSE the object will be enabled.</dd>
|
||||
|
||||
<dt>api</dt>
|
||||
<dd>The 'api' key can optionally contain some information for the plugin API definition. This means that the imports can be tied to an API name which is used to have automatic inclusion of files, and can be used to prevent dangerous objects from older versions from being loaded, causing a loss of functionality rather than site crashes or security loopholes.
|
||||
|
||||
<p>If not present, no additional files will be loaded and the default hook will always be a simple hook that must be either part of the .module file or loaded during normal operations.</p>
|
||||
|
||||
<p>api supports these subkeys:</p>
|
||||
|
||||
<dl>
|
||||
<dt>owner</dt>
|
||||
<dd>The module that owns the API. Typically this is the name of the module that owns the schema. This will be one of the two keys used by hook_ctools_plugin_api() to determine version compatibility. Note that the name of this hook can be tailored via the use of hook_ctools_plugin_api_hook_name(). See ctools_plugin_api_get_hook() for details.</dd>
|
||||
<dt>api</dt>
|
||||
<dd>This is the name of the API, and will be the second parameter to the above mentioned hook. It will also be used as part of the name of the file that the hook containing default objects will be in, which comes in the form of MODULENAME.API.inc.</dd>
|
||||
<dt>minimum_version</dt>
|
||||
<dd>The minimum version supported. Any module reporting an API less than this will not have its default objects used. This should be updated only when API changes can cause older objects to crash or otherwise break badly.</dd>
|
||||
<dt>current_version</dt>
|
||||
<dd>The current version of the API. Any module reporting a required API higher than this will not have its default objects used.</dd>
|
||||
</dl>
|
||||
</dd>
|
||||
|
||||
</dl>
|
||||
<p>In addition, each field can contain the following:</p>
|
||||
<dl>
|
||||
<dt>no export</dt>
|
||||
<dd>Set to TRUE to prevent that field from being exported.</dd>
|
||||
|
||||
<dt>export callback</dt>
|
||||
<dd>A function to override the export behavior. It will receive ($myobject, $field, $value, $indent) as arguments. By default, fields are exported through ctools_var_export().</dd>
|
||||
</dl>
|
||||
|
||||
<h2>Reserved keys on exportable objects</h2>
|
||||
|
||||
<p>Exportable objects have several reserved keys that are used by the CTools export API. Each key can be found at <code>$myobj->{$key}</code> on an object loaded through <code>ctools_export_load_object()</code>. Implementing modules should not use these keys as they will be overwritten by the CTools export API.</p>
|
||||
<dl>
|
||||
<dt>api_version</dt>
|
||||
<dd>The API version that this object implements.</dd>
|
||||
|
||||
<dt>disabled</dt>
|
||||
<dd>A boolean for whether the object is disabled.</dd>
|
||||
|
||||
<dt>export_module</dt>
|
||||
<dd>For objects that live in code, the module which provides the default object.</dd>
|
||||
|
||||
<dt>export_type</dt>
|
||||
<dd>A bitmask representation of an object current storage. You can use this bitmask in combination with the <code>EXPORT_IN_CODE</code> and <code>EXPORT_IN_DATABASE</code> constants to test for an object's storage in your code.
|
||||
</dd>
|
||||
|
||||
<dt>in_code_only</dt>
|
||||
<dd>A boolean for whether the object lives only in code.</dd>
|
||||
|
||||
<dt>table</dt>
|
||||
<dd>The schema API table that this object belongs to.</dd>
|
||||
|
||||
<dt>type</dt>
|
||||
<dd>A string representing the storage type of this object. Can be one of the following:
|
||||
<ul>
|
||||
<li><em>Normal</em> is an object that lives only in the database.</li>
|
||||
<li><em>Overridden</em> is an object that lives in the database and is overriding the exported configuration of a corresponding object in code.</li>
|
||||
<li><em>Default</em> is an object that lives only in code.</li>
|
||||
</ul>
|
||||
<i>Note: This key can be changed by setting 'export type string' to something else, to try and prevent "type" from conflicting.</i>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<h2>The load callback</h2>
|
||||
<p>Calling ctools_export_crud_load($table, $name) will invoke your load callback, calling ctools_export_crud_load_multiple($table, $names) will invoke your load multiple callback, and calling ctools_export_crud_load_all($table, $reset) will invoke your load all callback. The default handlers should be sufficient for most uses.</p>
|
||||
|
||||
<p>Typically, there will be three load functions. A 'single' load, to load just one object, a 'multiple' load to load multiple objects, and an 'all' load, to load all of the objects for use in administrating the objects or utilizing the objects when you need all of them. Using ctools_export_load_object() you can easily do both, as well as quite a bit in between. This example duplicates the default functionality for loading one myobj.</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Implements 'load callback' for myobj exportables.
|
||||
*/
|
||||
function mymodule_myobj_load($name) {
|
||||
ctools_include('export');
|
||||
$result = ctools_export_load_object('mymodule_myobjs', 'names', array($name));
|
||||
if (isset($result[$name])) {
|
||||
return $result[$name];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Implements 'load multiple callback' for myobj exportables.
|
||||
*/
|
||||
function mymodule_myobj_load_multiple(array $names) {
|
||||
ctools_include('export')
|
||||
$results = ctools_export_load_object('mymodule_myobjs', 'names', $names);
|
||||
return array_filter($results);
|
||||
}
|
||||
</pre>
|
||||
|
||||
<h2>The save callback</h2>
|
||||
Calling ctools_export_crud_save($table, $object) will invoke your save callback. The default handlers should be sufficient for most uses. For the default save mechanism to work, you <b>must</b> define a 'primary key' in the 'export' section of your schema. The following example duplicates the default functionality for the myobj.
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Save a single myobj.
|
||||
*/
|
||||
function mymodule_myobj_save(&$myobj) {
|
||||
$update = (isset($myobj->oid) && is_numeric($myobj->oid)) ? array('oid') : array();
|
||||
return drupal_write_record('myobj', $myobj, $update);
|
||||
}
|
||||
</pre>
|
||||
|
||||
<h2>Default hooks for your exports</h2>
|
||||
<p>All exportables come with a 'default' hook, which can be used to put your exportable into code. The easiest way to actually use this hook is to set up your exportable for bulk exporting, enable the bulk export module and export an object.</p>
|
||||
@ -1 +0,0 @@
|
||||
<p>To be written.</p>
|
||||
@ -1,215 +0,0 @@
|
||||
<p>CTools provides a simple modal that can be used as a popup to place forms. It differs from the normal modal frameworks in that it does not do its work via an iframe. This is both an advantage and a disadvantage. The iframe simply renders normal pages in a sub-browser and they can do their thing. That makes it much easier to put arbitrary pages and forms in a modal. However, the iframe is not very good at actually communicating changes to the main page, so you cannot open the modal, have it do some work, and then modify the page. </p>
|
||||
|
||||
<h2>Invoking the modal</h2>
|
||||
|
||||
<p>The basic form of the modal can be set up just by including the javascript and adding the proper class to a link or form that will open the modal. To include the proper javascript, simply include the library and call the add_js function:</p>
|
||||
|
||||
<code>ctools_include('modal');
|
||||
ctools_modal_add_js();
|
||||
</code>
|
||||
|
||||
<p>You can have links and buttons bound to use the modal by adding the class ctools-use-modal. For convenience, there is a helper function to try and do this, though it's not great at doing all links so using this is optional:</p>
|
||||
|
||||
<code>/**
|
||||
* Render an image as a button link. This will automatically apply an AJAX class
|
||||
* to the link and add the appropriate javascript to make this happen.
|
||||
*
|
||||
* @param $image
|
||||
* The path to an image to use that will be sent to theme('image') for rendering.
|
||||
* @param $dest
|
||||
* The destination of the link.
|
||||
* @param $alt
|
||||
* The alt text of the link.
|
||||
* @param $class
|
||||
* Any class to apply to the link. @todo this should be a options array.
|
||||
*/
|
||||
function ctools_modal_image_button($image, $dest, $alt, $class = '') {
|
||||
return ctools_ajax_text_button(theme('image', array('path' => $image), $dest, $alt, $class, 'ctools-use-modal');
|
||||
}
|
||||
|
||||
/**
|
||||
* Render text as a link. This will automatically apply an AJAX class
|
||||
* to the link and add the appropriate javascript to make this happen.
|
||||
*
|
||||
* Note: 'html' => true so be sure any text is vetted! Chances are these kinds of buttons will
|
||||
* not use user input so this is a very minor concern.
|
||||
*
|
||||
* @param $text
|
||||
* The text to display as the link.
|
||||
* @param $dest
|
||||
* The destination of the link.
|
||||
* @param $alt
|
||||
* The alt text of the link.
|
||||
* @param $class
|
||||
* Any class to apply to the link. @todo this should be a options array.
|
||||
*/
|
||||
function ctools_modal_text_button($text, $dest, $alt, $class = '') {
|
||||
return ctools_ajax_text_button($text, $dest, $alt, $class, 'ctools-use-modal');
|
||||
}
|
||||
</code>
|
||||
|
||||
<p>Like with all CTools' AJAX functionality, the href of the link will be the destination, with any appearance of /nojs/ converted to /ajax/.</p>
|
||||
|
||||
<p>For submit buttons, however, the URL may be found a different, slightly more complex way. If you do not wish to simply submit the form to the modal, you can create a URL using hidden form fields. The ID of the item is taken and -url is appended to it to derive a class name. Then, all form elements that contain that class name are founded and their values put together to form a URL.</p>
|
||||
|
||||
<p>For example, let's say you have an 'add' button, and it has a select form item that tells your system what widget it is adding. If the id of the add button is edit-add, you would place a hidden input with the base of your URL in the form and give it a class of 'edit-add-url'. You would then add 'edit-add-url' as a class to the select widget allowing you to convert this value to the form without posting. If no URL is found, the action of the form will be used and the entire form posted to it.</p>
|
||||
|
||||
<h2>Customizing the modal</h2>
|
||||
|
||||
<p>If you do not wish to use the default modal, the modal can be customized by creating an array of data to define a customized modal. To do this, you add an array of info to the javascript settings to define the customizations for the modal and add an additional class to your modal link or button to tell it which modal to use.</p>
|
||||
|
||||
<p>First, you need to create a settings array. You can do this most easily with a bit of PHP:</p>
|
||||
|
||||
<pre>drupal_add_js(array(
|
||||
'my-modal-style' => array(
|
||||
'modalSize' => array(
|
||||
'type' => 'fixed',
|
||||
'width' => 250,
|
||||
'height' => 250,
|
||||
),
|
||||
),
|
||||
), 'setting');
|
||||
</pre>
|
||||
|
||||
<p>The key to the array above (in this case, my-modal-style) is the identifier to your modal theme. You can have multiple modal themes on a page, so be sure to use an ID that will not collide with some other module's use. Using your module or theme as a prefix is a good idea.</p>
|
||||
|
||||
<p>Then, when adding the ctools-use-modal class to your link or button, also add the following class: ctools-modal-ID (in the example case, that would be ctools-modal-my-modal-style).</p>
|
||||
|
||||
<p>modalSize can be 'fixed' or 'scale'. If fixed it will be a raw pixel value; if 'scale' it will be a percentage of the screen.</p>
|
||||
|
||||
<p>You can set:</p>
|
||||
<ul>
|
||||
<li> <strong>modalSize</strong>: an array of data to control the sizing of the modal. It can contain:
|
||||
<ul>
|
||||
<li> <strong>type</strong>: Either <em>fixed</em> or <em>scale</em>. If fixed, the modal will always be a fixed size. If <em>scale</em> the modal will scale to a percentage of the browser window. <em>Default: scale</em>.
|
||||
<li> <strong>width</strong>: If <em>fixed</em> the width in pixels. If <em>scale</em> the percentage of the screen expressed as a number less than zero. (For 80 percent, use .8, for example). <em>Default: .8</em></li>
|
||||
<li> <strong>height</strong>: If <em>fixed</em> the height in pixels. If <em>scale</em> the percentage of the screen expressed as a number less than zero. (For 80 percent, use .8, for example). <em>Default: .8</em></li>
|
||||
<li> <strong>addWidth</strong>: Any additional width to add to the modal in pixels. Only useful if the type is scale. <em>Default: 0</em></li>
|
||||
<li> <strong>addHeight</strong>: Any additional height to add to the modal in pixels. Only useful if the type is scale. <em>Default: 0</em></li>
|
||||
<li> <strong>contentRight</strong>: The number of pixels to remove from the content inside the modal to make room for scroll bar and decorations. <em>Default: 25</em></li>
|
||||
<li> <strong>contentBottom</strong>: The number of pixels to remove from the content inside the modal to make room for scroll bar and decorations. <em>Default: 45</em></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li> <strong>modalTheme</strong>: The Drupal javascript themable function which controls how the modal will be rendered. This function must be in the <em>Drupal.theme.prototype</em> namespace. If you set this value, you must include a corresponding function in a javascript file and use drupal_add_js() to add that file. <em>Default: CToolsModalDialog</em>
|
||||
<pre>
|
||||
Drupal.theme.prototype.CToolsModalDialog = function () {
|
||||
var html = ''
|
||||
html += ' <div id="ctools-modal">'
|
||||
html += ' <div class="ctools-modal-content">' // panels-modal-content
|
||||
html += ' <div class="modal-header">';
|
||||
html += ' <a class="close" href="#">';
|
||||
html += Drupal.CTools.Modal.currentSettings.closeText + Drupal.CTools.Modal.currentSettings.closeImage;
|
||||
html += ' </a>';
|
||||
html += ' <span id="modal-title" class="modal-title"> </span>';
|
||||
html += ' </div>';
|
||||
html += ' <div id="modal-content" class="modal-content">';
|
||||
html += ' </div>';
|
||||
html += ' </div>';
|
||||
html += ' </div>';
|
||||
|
||||
return html;
|
||||
}
|
||||
</pre></li>
|
||||
<li> <strong>throbberTheme</strong>: The Drupal javascript themable function which controls how the modal throbber will be rendered. This function must be in the <em>Drupal.theme.prototype</em> namespace. If you set this value, you must include a corresponding function in a javascript file and use drupal_add_js() to add that file. <em>Default: CToolsModalThrobber</em>
|
||||
<pre>
|
||||
Drupal.theme.prototype.CToolsModalThrobber = function () {
|
||||
var html = '';
|
||||
html += ' <div id="modal-throbber">';
|
||||
html += ' <div class="modal-throbber-wrapper">';
|
||||
html += Drupal.CTools.Modal.currentSettings.throbber;
|
||||
html += ' </div>';
|
||||
html += ' </div>';
|
||||
|
||||
return html;
|
||||
};
|
||||
</pre>
|
||||
</li>
|
||||
<li> <strong>modalOptions</strong>: The options object that's sent to Drupal.CTools.Modal.modalContent. Can contain any CSS settings that will be applied to the modal backdrop, in particular settings such as <strong>opacity</strong> and <strong>background</strong>. <em>Default: array('opacity' => .55, 'background' => '#fff');</em></li>
|
||||
<li> <strong>animation</strong>: Controls how the modal is animated when it is first drawn. Either <strong>show</strong>, <strong>fadeIn</strong> or <strong>slideDown</strong>. <em>Default: show</em></li>
|
||||
<li> <strong>animationSpeed</strong>: The speed of the animation, expressed either as a word jQuery understands (slow, medium or fast) or a number of milliseconds for the animation to run. <em>Defaults: fast</em></li>
|
||||
<li><strong>closeText</strong>: The text to display for the close button. Be sure to wrap this in t() for translatability. <em>Default: t('Close window')</em></li>
|
||||
<li><strong>closeImage</strong>: The image to use for the close button of the modal. <em>Default: theme('image', array('path' => ctools_image_path('icon-close-window.png'), 'alt' => t('Close window'), 'title' => t('Close window')))</em></li>
|
||||
<li><strong>loadingText</strong>: The text to display for the modal title during loading, along with the throbber. Be sure to wrap this in t() for translatability. <em>Default: t('Close window')</em></li>
|
||||
<li><strong>throbber</strong>: The HTML to display for the throbber image. You can use this instead of CToolsModalThrobber theme if you just want to change the image but not the throbber HTML. <em>Default: theme('image', array('path' => ctools_image_path('throbber.gif'), 'alt' => t('Loading...'), 'title' => t('Loading')))</em></li>
|
||||
</ul>
|
||||
|
||||
<h2>Rendering within the modal</h2>
|
||||
<p>To render your data inside the modal, you need to provide a page callback in your module that responds more or less like a normal page.</p>
|
||||
|
||||
<p>In order to handle degradability, it's nice to allow your page to work both inside and outside of the modal so that users whose javascript is turned off can still use your page. There are two ways to accomplish this. First, you can embed 'nojs' as a portion of the URL and then watch to see if that turns into 'ajax' when the link is clicked. Second, if you do not wish to modify the URLs, you can check $_POST['js'] or $_POST['ctools_js'] to see if that flag was set. The URL method is the most flexible because it is easy to send the two links along completely different paths if necessary, and it is also much easier to manually test your module's output by manually visiting the nojs URL. It's actually quite difficult to do this if you have to set $_POST['js'] to test.</p>
|
||||
|
||||
<p>In your hook_menu, you can use the a CTools' AJAX convenience loader to help:</p>
|
||||
|
||||
<pre>
|
||||
$items['ctools_ajax_sample/%ctools_js/login'] = array(
|
||||
'title' => 'Login',
|
||||
'page callback' => 'ctools_ajax_sample_login',
|
||||
'page arguments' => array(1),
|
||||
'access callback' => TRUE,
|
||||
'type' => MENU_CALLBACK,
|
||||
);
|
||||
</pre>
|
||||
|
||||
<p>The first argument to the page callback will be the result of ctools_js_load() which will return TRUE if 'ajax' was the string, and FALSE if anything else (i.e, nojs) is the string. Which means you can then declare your function like this:</p>
|
||||
|
||||
<pre>
|
||||
function ctools_ajax_sample_login($js) {
|
||||
if ($js) {
|
||||
// react with the modal
|
||||
}
|
||||
else {
|
||||
// react without the modal
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>If your modal does not include a form, rendering the output you wish to give the user is just a matter of calling the modal renderer with your data:</p>
|
||||
|
||||
<pre>
|
||||
function ctools_ajax_hello_world($js) {
|
||||
$title = t('Greetings');
|
||||
$output = '<p>' . t('Hello world') . '</p>';
|
||||
if ($js) {
|
||||
ctools_modal_render($title, $output);
|
||||
}
|
||||
else {
|
||||
drupal_set_title($title);
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>If you need to do more than just render your modal, you can use a CTools $commands array. See the function ctools_modal_render() for more information on what you need to do here.</p>
|
||||
|
||||
<p>If you are displaying a form -- and the vast majority of modals display forms -- then you need to do just slightly more. Fortunately there is the ctools_modal_form_wrapper() function:</p>
|
||||
|
||||
<pre>
|
||||
ctools_include('modal');
|
||||
ctools_include('ajax');
|
||||
$form_state = array(
|
||||
'title' => t('Title of my form'),
|
||||
'ajax' => $js,
|
||||
);
|
||||
$output = ctools_modal_form_wrapper('my_form', $form_state);
|
||||
// There are some possible states after calling the form wrapper:
|
||||
// 1) We are not using $js and the form has been executed.
|
||||
// 2) We are using $js and the form was successfully submitted and
|
||||
// we need to dismiss the modal.
|
||||
// Most other states are handled automatically unless you set flags in
|
||||
// $form_state to avoid handling them, so we only deal with those two
|
||||
// states.
|
||||
if ($form_state['executed'] && $js) {
|
||||
$commands = array();
|
||||
$commands[] = ctools_modal_command_dismiss(t('Login Success'));
|
||||
// In typical usage you will do something else here, such as update a
|
||||
// div with HTML or redirect the page based upon the results of the modal
|
||||
// form.
|
||||
print ajax_render($commands);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Otherwise, just return the output.
|
||||
return $output;
|
||||
</pre>
|
||||
|
||||
<p>You can also use CTools' form wizard inside the modal. You do not need to do much special beyond setting $form_state['modal'] = TRUE in the wizard form; it already knows how to handle the rest.</p>
|
||||
@ -1,132 +0,0 @@
|
||||
<p>The CTools Object Cache is a specialized cache for storing data that is non-volatile. This differs from the standard Drupal cache mechanism, which is volatile, meaning that the data can be cleared at any time and it is expected that any cached data can easily be reconstructed. In contrast, data stored in this cache is not expected to be reconstructable. It is primarily used for storing user input which is retrieved in stages, allowing for more complex user interface interactions.</p>
|
||||
|
||||
<p>The object cache consists of 3 normal functions for cache maintenance, and 2 additional functions to facilitate locking.</p>
|
||||
|
||||
<p>To use any of these functions, you must first use ctools_include:</p>
|
||||
|
||||
<pre>
|
||||
ctools_include('object-cache');
|
||||
</pre>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Get an object from the non-volatile ctools cache.
|
||||
*
|
||||
* This function caches in memory as well, so that multiple calls to this
|
||||
* will not result in multiple database reads.
|
||||
*
|
||||
* @param $obj
|
||||
* A 128 character or less string to define what kind of object is being
|
||||
* stored; primarily this is used to prevent collisions.
|
||||
* @param $name
|
||||
* The name of the object being stored.
|
||||
* @param $skip_cache
|
||||
* Skip the memory cache, meaning this must be read from the db again.
|
||||
*
|
||||
* @return
|
||||
* The data that was cached.
|
||||
*/
|
||||
function ctools_object_cache_get($obj, $name, $skip_cache = FALSE) {
|
||||
</pre>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Store an object in the non-volatile ctools cache.
|
||||
*
|
||||
* @param $obj
|
||||
* A 128 character or less string to define what kind of object is being
|
||||
* stored; primarily this is used to prevent collisions.
|
||||
* @param $name
|
||||
* The name of the object being stored.
|
||||
* @param $cache
|
||||
* The object to be cached. This will be serialized prior to writing.
|
||||
*/
|
||||
function ctools_object_cache_set($obj, $name, $cache) {
|
||||
</pre>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Remove an object from the non-volatile ctools cache
|
||||
*
|
||||
* @param $obj
|
||||
* A 128 character or less string to define what kind of object is being
|
||||
* stored; primarily this is used to prevent collisions.
|
||||
* @param $name
|
||||
* The name of the object being removed.
|
||||
*/
|
||||
function ctools_object_cache_clear($obj, $name) {
|
||||
</pre>
|
||||
|
||||
<p>To facilitate locking, which is the ability to prohibit updates by other users while one user has an object cached, this system provides two functions:</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Determine if another user has a given object cached.
|
||||
*
|
||||
* This is very useful for 'locking' objects so that only one user can
|
||||
* modify them.
|
||||
*
|
||||
* @param $obj
|
||||
* A 128 character or less string to define what kind of object is being
|
||||
* stored; primarily this is used to prevent collisions.
|
||||
* @param $name
|
||||
* The name of the object being removed.
|
||||
*
|
||||
* @return
|
||||
* An object containing the UID and updated date if found; NULL if not.
|
||||
*/
|
||||
function ctools_object_cache_test($obj, $name) {
|
||||
</pre>
|
||||
|
||||
<p>The object returned by ctools_object_cache_test can be directly used to determine whether a user should be allowed to cache their own version of an object.</p>
|
||||
|
||||
<p>To allow the concept of breaking a lock, that is, clearing another users changes:</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Remove an object from the non-volatile ctools cache for all session IDs.
|
||||
*
|
||||
* This is useful for clearing a lock.
|
||||
*
|
||||
* @param $obj
|
||||
* A 128 character or less string to define what kind of object is being
|
||||
* stored; primarily this is used to prevent collisions.
|
||||
* @param $name
|
||||
* The name of the object being removed.
|
||||
*/
|
||||
function ctools_object_cache_clear_all($obj, $name) {
|
||||
</pre>
|
||||
|
||||
<p>Typical best practice is to use wrapper functions such as these:</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Get the cached changes to a given task handler.
|
||||
*/
|
||||
function delegator_page_get_page_cache($name) {
|
||||
ctools_include('object-cache');
|
||||
$cache = ctools_object_cache_get('delegator_page', $name);
|
||||
if (!$cache) {
|
||||
$cache = delegator_page_load($name);
|
||||
$cache->locked = ctools_object_cache_test('delegator_page', $name);
|
||||
}
|
||||
|
||||
return $cache;
|
||||
}
|
||||
|
||||
/**
|
||||
* Store changes to a task handler in the object cache.
|
||||
*/
|
||||
function delegator_page_set_page_cache($name, $page) {
|
||||
ctools_include('object-cache');
|
||||
$cache = ctools_object_cache_set('delegator_page', $name, $page);
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove an item from the object cache.
|
||||
*/
|
||||
function delegator_page_clear_page_cache($name) {
|
||||
ctools_include('object-cache');
|
||||
ctools_object_cache_clear('delegator_page', $name);
|
||||
}
|
||||
</pre>
|
||||
@ -1,55 +0,0 @@
|
||||
<p>APIs are a form of plugins that are tightly associated with a module. Instead of a module providing any number of plugins, each module provides only one file for an API and this file can contain hooks that the module should invoke.</p>
|
||||
|
||||
<p>Modules support this API by implementing hook_ctools_plugin_api($module, $api). If they support the API, they return a packet of data:</p>
|
||||
|
||||
<pre>
|
||||
function mymodule_ctools_plugin_api($module, $api) {
|
||||
if ($module == 'some module' && $api = 'some api') {
|
||||
return array(
|
||||
'version' => The minimum API version this system supports. If this API version is incompatible then the .inc file will not be loaded.
|
||||
'path' => Where to find the file. Optional; if not specified it will be the module's directory.
|
||||
'file' => an alternative version of the filename. If not specified it will be $module.$api.inc
|
||||
);
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>This implementation must be in the .module file.</p>
|
||||
|
||||
<p>Modules utilizing this can invole ctools_plugin_api_include() in order to ensure all modules that support the API will have their files loaded as necessary. It's usually easiest to create a small helper function like this:</p>
|
||||
|
||||
<pre>
|
||||
define('MYMODULE_MINIMUM_VERSION', 1);
|
||||
define('MYMODULE_VERSION', 1);
|
||||
|
||||
function mymodule_include_api() {
|
||||
ctools_include('plugins');
|
||||
return ctools_plugin_api_include('mymodule', 'myapi', MYMODULE_MINIMUM_VERSION, MYMODULE_VERSION);
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>Using a define will ensure your use of version numbers is consistent and easy to update when you make API changes. You can then use the usual module_invoke type commands:</p>
|
||||
|
||||
<pre>
|
||||
mymodule_include_api();
|
||||
module_invoke('myhook', $data);
|
||||
</pre>
|
||||
|
||||
<p>If you need to pass references, this construct is standard:</p>
|
||||
|
||||
<pre>
|
||||
foreach (mymodule_include_api() as $module => $info) {
|
||||
$function = $module . '_hookname';
|
||||
// Just because they implement the API and include a file does not guarantee they implemented
|
||||
// a hook function!
|
||||
if (!function_exists($function)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
// Typically array_merge() is used below if data is returned.
|
||||
$result = $function($data1, $data2, $data3);
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>TODO: There needs to be a way to check API version without including anything, as a module may simply
|
||||
provide normal plugins and versioning could still matter.</p>
|
||||
@ -1,204 +0,0 @@
|
||||
There are two primary pieces to using plugins. The first is getting the data, and the second is using the data.
|
||||
|
||||
<h2>Defining a plugin</h2>
|
||||
To define that you offer a plugin that modules can implement, you first must implement hook_ctools_plugin_type() to tell the plugin system about your plugin.
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Implements hook_ctools_plugin_type() to inform CTools about the layout plugin.
|
||||
*/
|
||||
function panels_ctools_plugin_type() {
|
||||
$plugins['layouts'] = array(
|
||||
'load themes' => TRUE,
|
||||
);
|
||||
|
||||
return $plugins;
|
||||
}
|
||||
</pre>
|
||||
|
||||
The following information can be specified for each plugin type:
|
||||
<dl>
|
||||
<dt>cache</dt>
|
||||
<dd><em>Defaults to:</em> <strong>FALSE</strong></dd>
|
||||
<dd>If set to TRUE, the results of ctools_get_plugins will be cached in the 'cache' table (by default), thus preventing .inc files from being loaded. ctools_get_plugins looking for a specific plugin will always load the appropriate .inc file.</dd>
|
||||
<dt>cache table</dt>
|
||||
<dd><em>Defaults to:</em> <strong>'cache'</strong></dd>
|
||||
<dd>If 'cache' is TRUE, then this value specifies the cache table where the cached plugin information will be stored.</dd>
|
||||
<dt>classes</dt>
|
||||
<dd><em>Defaults to:</em> <strong>array()</strong></dd>
|
||||
<dd>An array of <em>class identifiers</em>(i.e. plugin array keys) which a plugin of this type uses to provide classes to the CTools autoloader. For example, if <strong>classes</strong> is set to array('class'), then CTools will search each <strong>$plugin['class']</strong> for a class to autoload. Depending of the plugin structure, a <em>class identifier</em> may be either:
|
||||
<dl>
|
||||
<dt>- a file name:</dt>
|
||||
<dd>the file which holds the class with the name structure as: <em>[filename].[class].php</em></dd>
|
||||
<dd>in this case the class name can be different than the <em>class identifier</em></dd>
|
||||
<dt>- the class name:</dt>
|
||||
<dd>if the class is in the same file as the $plugin</dd>
|
||||
<dd>the plugin <em>.inc</em> file can have a different name than the <em>class identifier</em></dd>
|
||||
</dl>
|
||||
<dd>
|
||||
<dt>defaults</dt>
|
||||
<dd><em>Defaults to:</em> <strong>array()</strong></dd>
|
||||
<dd>An array of defaults that should be added to each plugin; this can be used to ensure that every plugin has the basic data necessary. These defaults will not ovewrite data supplied by the plugin. This could also be a function name, in which case the callback will be used to provide defaults. NOTE, however, that the callback-based approach is deprecated as it is redundant with the 'process' callback, and as such will be removed in later versions. Consequently, you should only use the array form for maximum cross-version compatibility.</dd>
|
||||
<dt>load themes</dt>
|
||||
<dd><em>Defaults to:</em> <strong>FALSE</strong></dd>
|
||||
<dd>If set to TRUE, then plugins of this type can be supplied by themes as well as modules. If this is the case, all themes that are currently enabled will provide a plugin: NOTE: Due to a slight UI bug in Drupal, it is possible for the default theme to be active but not enabled. If this is the case, that theme will NOT provide plugins, so if you are using this feature, be sure to document that issue. Also, themes set via $custom_theme do not necessarily need to be enabled, but the system has no way of knowing what those themes are, so the enabled flag is the only true method of identifying which themes can provide layouts.</dd>
|
||||
<dt>hook</dt>
|
||||
<dd><em>Defaults to:</em> (dynamic value)</dd>
|
||||
<dd>The name of the hook used to collect data for this plugin. Normally this is <strong>$module . '_' . $type</strong> -- but this can be changed here. If you change this, you MUST be sure to document this for your plugin implementors as it will change the format of the specially named hook.
|
||||
<dt>process</dt>
|
||||
<dd><em>Defaults to:</em> <strong>''</strong></dd>
|
||||
<dd>An optional function callback to use for processing a plugin. This can be used to provide automated settings that must be calculated per-plugin instance (i.e., it is not enough to simply append an array via 'defaults'). The parameters on this callback are: <strong>callback(&$plugin, $info)</strong> where $plugin is a reference to the plugin as processed and $info is the fully processed result of hook_ctools_plugin_api_info().
|
||||
<dt>extension</dt>
|
||||
<dd><em>Defaults to:</em> <strong>'inc'</strong></dd>
|
||||
<dd>Can be used to change the extension on files containing plugins of this type. By default the extension will be "inc", though it will default to "info" if "info files" is set to true. Do not include the dot in the extension if changing it, that will be added automatically.</dd>
|
||||
<dt>info file</dt>
|
||||
<dd><em>Defaults to:</em> <strong>FALSE</strong></dd>
|
||||
<dd>If set to TRUE, then the plugin will look for a .info file instead of a .inc. Internally, this will look exactly the same, though obviously a .info file cannot contain functions. This can be good for styles that may not need to contain code.</dd>
|
||||
<dt>use hooks</dt>
|
||||
<dd><em>Defaults to:</em> <strong>TRUE</strong>*</dd>
|
||||
<dd>Use to enable support for plugin definition hooks instead of plugin definition files. NOTE: using a central plugin definition hook is less optimal for the plugins system, and as such this will default to FALSE in later versions.</dd>
|
||||
<dt>child plugins</dt>
|
||||
<dd><em>Defaults to:</em> <strong>FALSE</strong></dd>
|
||||
<dd>If set to TRUE, the plugin type can automatically have 'child plugins' meaning each plugin can actually provide multiple plugins. This is mostly used for plugins that store some of their information in the database, such as views, blocks or exportable custom versions of plugins.</dd>
|
||||
<dd>To implement, each plugin can have a 'get child' and 'get children' callback. Both of these should be implemented for performance reasons, since it is best to avoid getting all children if necessary, but if 'get child' is not implemented, it will fall back to 'get children' if it has to.</dd>
|
||||
<dd>Child plugins should be named parent:child, with the : being the separator, so that it knows which parent plugin to ask for the child. The 'get children' method should at least return the parent plugin as part of the list, unless it wants the parent plugin itself to not be a choosable option, which is not unheard of. </dd>
|
||||
<dd>'get children' arguments are ($plugin, $parent) and 'get child' arguments are ($plugin, $parent, $child).
|
||||
</dl>
|
||||
|
||||
In addition, there is a 'module' and 'type' settings; these are for internal use of the plugin system and you should not change these.
|
||||
<h2>Getting the data</h2>
|
||||
To create a plugin, a module only has to execute ctools_get_plugins with the right data:
|
||||
|
||||
<pre>
|
||||
ctools_include('plugins');
|
||||
ctools_get_plugins($module, $type, [$id])
|
||||
</pre>
|
||||
|
||||
In the above example, $module should be your module's name and $type is the type of the plugin. It is typically best practice to provide some kind of wrapper function to make this easier. For example, Panels provides the following functions to implement the 'content_types' plugin:
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Fetch metadata on a specific content_type plugin.
|
||||
*
|
||||
* @param $content type
|
||||
* Name of a panel content type.
|
||||
*
|
||||
* @return
|
||||
* An array with information about the requested panel content type.
|
||||
*/
|
||||
function panels_get_content_type($content_type) {
|
||||
ctools_include('context');
|
||||
ctools_include('plugins');
|
||||
return ctools_get_plugins('panels', 'content_types', $content_type);
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetch metadata for all content_type plugins.
|
||||
*
|
||||
* @return
|
||||
* An array of arrays with information about all available panel content types.
|
||||
*/
|
||||
function panels_get_content_types() {
|
||||
ctools_include('context');
|
||||
ctools_include('plugins');
|
||||
return ctools_get_plugins('panels', 'content_types');
|
||||
}
|
||||
</pre>
|
||||
|
||||
<h2>Using the data</h2>
|
||||
|
||||
Each plugin returns a packet of data, which is added to with a few defaults. Each plugin is guaranteed to always have the following data:
|
||||
<dl>
|
||||
<dt>name</dt>
|
||||
<dd>The name of the plugin. This is also the key in the array, of the full list of plugins, and is placed here since that is not always available.</dd>
|
||||
<dt>module</dt>
|
||||
<dd>The module that supplied the plugin.</dd>
|
||||
<dt>file</dt>
|
||||
<dd>The actual file containing the plugin.</dd>
|
||||
<dt>path</dt>
|
||||
<dd>The path to the file containing the plugin. This is useful for using secondary files, such as templates, css files, images, etc, that may come with a plugin.</dd>
|
||||
</dl>
|
||||
|
||||
<p>Any of the above items can be overridden by the plugin itself, though the most likely one to be modified is the 'path'.</p>
|
||||
|
||||
<p>The most likely data (beyond simple printable data) for a plugin to provide is a callback. The plugin system provides a pair of functions to make it easy and consistent for these callbacks to be used. The first is ctools_plugin_get_function, which requires the full $plugin object.</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Get a function from a plugin, if it exists. If the plugin is not already
|
||||
* loaded, try ctools_plugin_load_function() instead.
|
||||
*
|
||||
* @param $plugin
|
||||
* The loaded plugin type.
|
||||
* @param $callback_name
|
||||
* The identifier of the function. For example, 'settings form'.
|
||||
*
|
||||
* @return
|
||||
* The actual name of the function to call, or NULL if the function
|
||||
* does not exist.
|
||||
*/
|
||||
function ctools_plugin_get_function($plugin, $callback_name)
|
||||
</pre>
|
||||
|
||||
<p>The second does not require the full $plugin object, and will load it:</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Load a plugin and get a function name from it, returning success only
|
||||
* if the function exists.
|
||||
*
|
||||
* @param $module
|
||||
* The module that owns the plugin type.
|
||||
* @param $type
|
||||
* The type of plugin.
|
||||
* @param $id
|
||||
* The id of the specific plugin to load.
|
||||
* @param $callback_name
|
||||
* The identifier of the function. For example, 'settings form'.
|
||||
*
|
||||
* @return
|
||||
* The actual name of the function to call, or NULL if the function
|
||||
* does not exist.
|
||||
*/
|
||||
function ctools_plugin_load_function($module, $type, $id, $callback_name) {
|
||||
</pre>
|
||||
|
||||
<p>Both of these functions will ensure any needed files are included. In fact, it allows each callback to specify alternative include files. The plugin implementation could include code like this:</p>
|
||||
|
||||
<pre>
|
||||
'callback_name' => 'actual_name_of_function_here',
|
||||
</pre>
|
||||
|
||||
<p>Or like this:</p>
|
||||
<pre>
|
||||
'callback_name' => array(
|
||||
'file' => 'filename',
|
||||
'path' => 'filepath', // optional, will use plugin path if absent
|
||||
'function' => 'actual_name_of_function_here',
|
||||
),
|
||||
</pre>
|
||||
|
||||
<p>An example, for 'plugin_example' type</p>
|
||||
|
||||
<pre>
|
||||
$plugin = array(
|
||||
'name' => 'my_plugin',
|
||||
'module' => 'my_module',
|
||||
'example_callback' => array(
|
||||
'file' => 'my_plugin.extrafile.inc',
|
||||
'function' => 'my_module_my_plugin_example_callback',
|
||||
),
|
||||
);
|
||||
</pre>
|
||||
|
||||
<p>To utilize this callback on this plugin:</p>
|
||||
|
||||
<pre>
|
||||
if ($function = ctools_plugin_get_function($plugin, 'example_callback')) {
|
||||
$function($arg1, $arg2, $etc);
|
||||
}
|
||||
</pre>
|
||||
|
||||
<h2>Document your plugins!</h2>
|
||||
|
||||
<p>Since the data provided by your plugin tends to be specific to your plugin type, you really need to document what the data returned in the hook in the .inc file will be or nobody will figure it out. Use advanced help and document it there. If every system that utilizes plugins does this, then plugin implementors will quickly learn to expect the documentation to be in the advanced help.</p>
|
||||
@ -1,62 +0,0 @@
|
||||
<p>There are two parts to implementing a plugin: telling the system where it is, and implementing one or more .inc files that contain the plugin data.</p>
|
||||
|
||||
<h2>Telling the system where your plugins live</h2>
|
||||
<h3>How a module implements plugins</h3>
|
||||
<p>To implement any plugins at all, you must implement a single function for all plugins: <strong>hook_ctools_plugin_directory</strong>. Every time a module loads plugins, this hook will be called to see which modules implement those plugins and in what directory those plugins will live.</p>
|
||||
|
||||
<pre>
|
||||
function hook_ctools_plugin_directory($module, $plugin) {
|
||||
if ($module == 'panels' && $plugin == 'content_types') {
|
||||
return 'plugins/content_types';
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>The directory returned should be relative to your module. Another common usage is to simply return that you implement all plugins owned by a given module (or modules):</p>
|
||||
|
||||
<pre>
|
||||
function hook_ctools_plugin_directory($module, $plugin) {
|
||||
if ($module == 'panels') {
|
||||
return 'plugins/' . $plugin;
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>Typically, it is recommended that all plugins be placed into the 'plugins' directory for clarity and maintainability. Inside the directory, any number of subdirectories can be used. For plugins that require extra files, such as templates, css, javascript or image files, this is highly recommended:</p>
|
||||
<pre>
|
||||
mymodule.module
|
||||
mymodule.info
|
||||
plugins/
|
||||
content_types/
|
||||
my_content_type.inc
|
||||
layouts/
|
||||
my_layout.inc
|
||||
my_layout.css
|
||||
my_layout.tpl.php
|
||||
my_layout_image.png
|
||||
</pre>
|
||||
|
||||
<h3>How a theme implements plugins</h3>
|
||||
<p>Themes can implement plugins if the plugin owner specified that it's possible in its hook_ctools_plugin_type() call. If so, it is generally exactly the same as modules, except for one important difference: themes don't get hook_ctools_plugin_directory(). Instead, themes add a line to their .info file:</p>
|
||||
|
||||
<pre>
|
||||
plugins[module][type] = directory
|
||||
</pre>
|
||||
|
||||
<h2>How to structure the .inc file</h2>
|
||||
|
||||
<p>The top of the .inc file should contain an array that defines the plugin. This array is simply defined in the global namespace of the file and does not need a function. Note that previous versions of this plugin system required a specially named function. While this function will still work, its use is now discouraged, as it is annoying to name properly.</p>
|
||||
|
||||
<p>This array should look something like this:</p>
|
||||
|
||||
<pre>
|
||||
$plugin = array(
|
||||
'key' => 'value',
|
||||
);
|
||||
</pre>
|
||||
|
||||
<p>Several values will be filled in for you automatically, but you can override them if necessary. They include 'name', 'path', 'file' and 'module'. Additionally, the plugin owner can provide other defaults as well.</p>
|
||||
|
||||
<p>There are no required keys by the plugin system itself. The only requirements in the $plugin array will be defined by the plugin type.</p>
|
||||
|
||||
<p>After this array, if your plugin needs functions, they can be declared. Different plugin types have different needs here, so exactly what else will be needed will change from type to type.</p>
|
||||
@ -1,5 +0,0 @@
|
||||
<p>The plugins tool allows a module to allow <b>other</b> modules (and themes!) to provide plugins which provide some kind of functionality or some kind of task. For example, in Panels there are several types of plugins: Content types (which are like blocks), layouts (which are page layouts) and styles (which can be used to style a panel). Each plugin is represented by a .inc file, and the functionality they offer can differ wildly.</p>
|
||||
|
||||
<p>A module which uses plugins can implement a hook describing the plugin (which is not necessary, as defaults will be filled in) and then calls a ctools function which loads either all the known plugins (used for listing/choosing) or a specific plugin (used when it's known which plugin is needed). From the perspective of the plugin system, a plugin is a packet of data, usually some printable info and a list of callbacks. It is up to the module implementing plugins to determine what that info means and what the callbacks do.</p>
|
||||
|
||||
<p>A module which implements plugins must first implement the <strong>hook_ctools_plugin_directory</strong> function, which simply tells the system which plugins are supported and what directory to look in. Each plugin will then be in a separate .inc file in the directory supplied. The .inc file will contain a specially named hook which returns the data necessary to implement the plugin.</p>
|
||||
@ -1,311 +0,0 @@
|
||||
<p>Form wizards, or multi-step forms, are a process by which the user goes through or can use an arbitrary number of different forms to create a single object or perform a single task. Traditionally the multi-step form is difficult in Drupal because there is no easy place to put data in between forms. No longer! The form wizard tool allows a single entry point to easily set up a wizard of multiple forms, provide callbacks to handle data storage and updates between forms and when forms are completed. This tool pairs well with the <a href="&topic:ctools/object-cache&">object cache</a> tool for storage.</p>
|
||||
|
||||
<h2>The form info array</h2>
|
||||
<p>The wizard starts with an array of data that describes all of the forms available to the wizard and sets options for how the wizard will present and control the flow. Here is an example of the $form_info array as used in the delegator module:</p>
|
||||
|
||||
<pre>
|
||||
$form_info = array(
|
||||
'id' => 'delegator_page',
|
||||
'path' => "admin/structure/pages/edit/$page_name/%step",
|
||||
'show trail' => TRUE,
|
||||
'show back' => TRUE,
|
||||
'show return' => FALSE,
|
||||
'next callback' => 'delegator_page_add_subtask_next',
|
||||
'finish callback' => 'delegator_page_add_subtask_finish',
|
||||
'return callback' => 'delegator_page_add_subtask_finish',
|
||||
'cancel callback' => 'delegator_page_add_subtask_cancel',
|
||||
'order' => array(
|
||||
'basic' => t('Basic settings'),
|
||||
'argument' => t('Argument settings'),
|
||||
'access' => t('Access control'),
|
||||
'menu' => t('Menu settings'),
|
||||
'multiple' => t('Task handlers'),
|
||||
),
|
||||
'forms' => array(
|
||||
'basic' => array(
|
||||
'form id' => 'delegator_page_form_basic'
|
||||
),
|
||||
'access' => array(
|
||||
'form id' => 'delegator_page_form_access'
|
||||
),
|
||||
'menu' => array(
|
||||
'form id' => 'delegator_page_form_menu'
|
||||
),
|
||||
'argument' => array(
|
||||
'form id' => 'delegator_page_form_argument'
|
||||
),
|
||||
'multiple' => array(
|
||||
'form id' => 'delegator_page_argument_form_multiple'
|
||||
),
|
||||
),
|
||||
);
|
||||
</pre>
|
||||
|
||||
<p>The above array starts with an <strong>id</strong> which is used to identify the wizard in various places and a <strong>path</strong> which is needed to redirect to the next step between forms. It then creates some <strong>settings</strong> which control which pieces are displayed. In this case, it displays a form trail and a 'back' button, but not the 'return' button. Then there are the <strong>wizard callbacks</strong> which allow the wizard to act appropriately when forms are submitted. Finally it contains a <strong>list of forms</strong> and their <strong>order</strong> so that it knows which forms to use and what order to use them by default. Note that the keys in the order and list of forms match; that key is called the <strong>step</strong> and is used to identify each individual step of the wizard.</p>
|
||||
|
||||
<p>Here is a full list of every item that can be in the form info array:</p>
|
||||
|
||||
<dl>
|
||||
<dt>id</dt>
|
||||
<dd>An id for wizard. This is used like a hook to automatically name <strong>callbacks</strong>, as well as a form step's form building function. It is also used in trail theming.</dd>
|
||||
|
||||
<dt>path</dt>
|
||||
<dd>The path to use when redirecting between forms. <strong>%step</strong> will be replaced with the key for the form.</dd>
|
||||
|
||||
<dt>return path</dt>
|
||||
<dd>When a form is complete, this is the path to go to. This is required if the 'return' button is shown and not using AJAX. It is also used for the 'Finish' button. If it is not present and needed, the cancel path will also be checked.</dd>
|
||||
|
||||
<dt>cancel path</dt>
|
||||
<dd>When a form is canceled, this is the path to go to. This is required if the 'cancel' is shown and not using AJAX.</dd>
|
||||
|
||||
<dt>show trail</dt>
|
||||
<dd>If set to TRUE, the form trail will be shown like a breadcrumb at the top of each form. Defaults to FALSE.</dd>
|
||||
|
||||
<dt>show back</dt>
|
||||
<dd>If set to TRUE, show a back button on each form. Defaults to FALSE.</dd>
|
||||
|
||||
<dt>show return</dt>
|
||||
<dd>If set to TRUE, show a return button. Defaults to FALSE.</dd>
|
||||
|
||||
<dt>show cancel</dt>
|
||||
<dd>If set to TRUE, show a cancel button. Defaults to FALSE.</dd>
|
||||
|
||||
<dt>back text</dt>
|
||||
<dd>Set the text of the 'back' button. Defaults to t('Back').</dd>
|
||||
|
||||
<dt>next text</dt>
|
||||
<dd>Set the text of the 'next' button. Defaults to t('Continue').</dd>
|
||||
|
||||
<dt>return text</dt>
|
||||
<dd>Set the text of the 'return' button. Defaults to t('Update and return').</dd>
|
||||
|
||||
<dt>finish text</dt>
|
||||
<dd>Set the text of the 'finish' button. Defaults to t('Finish').</dd>
|
||||
|
||||
<dt>cancel text</dt>
|
||||
<dd>Set the text of the 'cancel' button. Defaults to t('Cancel').</dd>
|
||||
|
||||
<dt>ajax</dt>
|
||||
<dd>Turn on AJAX capabilities, using CTools' ajax.inc. Defaults to FALSE.</dd>
|
||||
|
||||
<dt>modal</dt>
|
||||
<dd>Put the wizard in the modal tool. The modal must already be open and called from an ajax button for this to work, which is easily accomplished using functions provided by the modal tool.</dd>
|
||||
|
||||
<dt>ajax render</dt>
|
||||
<dd>A callback to display the rendered form via ajax. This is not required if using the modal tool, but is required otherwise since ajax by itself does not know how to render the results. Params: &$form_state, $output.</dd>
|
||||
|
||||
<dt>finish callback</dt>
|
||||
<dd>The function to call when a form is complete and the finish button has been clicked. This function should finalize all data. Params: &$form_state.
|
||||
Defaults to $form_info['id']._finish if function exists.
|
||||
</dd>
|
||||
|
||||
<dt>cancel callback</dt>
|
||||
<dd>The function to call when a form is canceled by the user. This function should clean up any data that is cached. Params: &$form_state.
|
||||
Defaults to $form_info['id']._cancel if function exists.</dd>
|
||||
|
||||
<dt>return callback</dt>
|
||||
<dd>The function to call when a form is complete and the return button has been clicked. This is often the same as the finish callback. Params: &$form_state.
|
||||
Defaults to $form_info['id']._return if function exists.</dd>
|
||||
|
||||
<dt>next callback</dt>
|
||||
<dd>The function to call when the next button has been clicked. This function should take the submitted data and cache it for later use by the finish callback. Params: &$form_state.
|
||||
Defaults to $form_info['id']._next if function exists.</dd>
|
||||
|
||||
<dt>order</dt>
|
||||
<dd>An optional array of forms, keyed by the step, which represents the default order the forms will be displayed in. If not set, the forms array will control the order. Note that submit callbacks can override the order so that branching logic can be used.</dd>
|
||||
|
||||
<dt>forms</dt>
|
||||
<dd>An array of form info arrays, keyed by step, describing every form available to the wizard. If order array isn't set, the wizard will use this to set the default order. Each array contains:
|
||||
<dl>
|
||||
<dt>form id</dt>
|
||||
<dd>
|
||||
The id of the form, as used in the Drupal form system. This is also the name of the function that represents the form builder.
|
||||
Defaults to $form_info['id']._.$step._form.
|
||||
</dd>
|
||||
|
||||
<dt>include</dt>
|
||||
<dd>The name of a file to include which contains the code for this form. This makes it easy to include the form wizard in another file or set of files. This must be the full path of the file, so be sure to use drupal_get_path() when setting this. This can also be an array of files if multiple files need to be included.</dd>
|
||||
|
||||
<dt>title</dt>
|
||||
<dd>The title of the form, to be optionally set via drupal_get_title. This is required when using the modal if $form_state['title'] is not set.</dd>
|
||||
</dl>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<h2>Invoking the form wizard</h2>
|
||||
<p>Your module should create a page callback via hook_menu, and this callback should contain an argument for the step. The path that leads to this page callback should be the same as the 'path' set in the $form_info array.</p>
|
||||
|
||||
<p>The page callback should set up the $form_info, and figure out what the default step should be if no step is provided (note that the wizard does not do this for you; you MUST specify a step). Then invoke the form wizard:</p>
|
||||
|
||||
<pre>
|
||||
$form_state = array();
|
||||
ctools_include('wizard');
|
||||
$output = ctools_wizard_multistep_form($form_info, $step, $form_state);
|
||||
</pre>
|
||||
|
||||
<p>If using AJAX or the modal, This part is actually done! If not, you have one more small step:</p>
|
||||
|
||||
<pre>
|
||||
return $output;
|
||||
</pre>
|
||||
|
||||
<h2>Forms and their callbacks</h2>
|
||||
<p>Each form within the wizard is a complete, independent form using Drupal's Form API system. It has a form builder callback as well as submit and validate callbacks and can be form altered. The primary difference between these forms and a normal Drupal form is that the submit handler should not save any data. Instead, it should make any changes to a cached object (usually placed on the $form_state) and only the _finish or _return handler should actually save any real data.</p>
|
||||
|
||||
<p>How you handle this is completely up to you. The recommended best practice is to use the CTools Object cache, and a good way to do this is to write a couple of wrapper functions around the cache that look like these example functions:</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Get the cached changes to a given task handler.
|
||||
*/
|
||||
function delegator_page_get_page_cache($name) {
|
||||
ctools_include('object-cache');
|
||||
$cache = ctools_object_cache_get('delegator_page', $name);
|
||||
if (!$cache) {
|
||||
$cache = delegator_page_load($name);
|
||||
$cache->locked = ctools_object_cache_test('delegator_page', $name);
|
||||
}
|
||||
|
||||
return $cache;
|
||||
}
|
||||
|
||||
/**
|
||||
* Store changes to a task handler in the object cache.
|
||||
*/
|
||||
function delegator_page_set_page_cache($name, $page) {
|
||||
ctools_include('object-cache');
|
||||
$cache = ctools_object_cache_set('delegator_page', $name, $page);
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove an item from the object cache.
|
||||
*/
|
||||
function delegator_page_clear_page_cache($name) {
|
||||
ctools_include('object-cache');
|
||||
ctools_object_cache_clear('delegator_page', $name);
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>Using these wrappers, when performing a get_cache operation, it defaults to loading the real object. It then checks to see if another user has this object cached using the ctools_object_cache_test() function, which automatically sets a lock (which can be used to prevent writes later on).</p>
|
||||
|
||||
<p>With this set up, the _next, _finish and _cancel callbacks are quite simple:</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Callback generated when the add page process is finished.
|
||||
*/
|
||||
function delegator_page_add_subtask_finish(&$form_state) {
|
||||
$page = &$form_state['page'];
|
||||
|
||||
// Create a real object from the cache
|
||||
delegator_page_save($page);
|
||||
|
||||
// Clear the cache
|
||||
delegator_page_clear_page_cache($form_state['cache name']);
|
||||
}
|
||||
|
||||
/**
|
||||
* Callback generated when the 'next' button is clicked.
|
||||
*
|
||||
* All we do here is store the cache.
|
||||
*/
|
||||
function delegator_page_add_subtask_next(&$form_state) {
|
||||
// Update the cache with changes.
|
||||
delegator_page_set_page_cache($form_state['cache name'], $form_state['page']);
|
||||
}
|
||||
|
||||
/**
|
||||
* Callback generated when the 'cancel' button is clicked.
|
||||
*
|
||||
* All we do here is clear the cache.
|
||||
*/
|
||||
function delegator_page_add_subtask_cancel(&$form_state) {
|
||||
// Update the cache with changes.
|
||||
delegator_page_clear_page_cache($form_state['cache name']);
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>All that's needed to tie this together is to understand how the changes made it into the cache in the first place. This happened in the various form _submit handlers, which made changes to $form_state['page'] based upon the values set in the form:</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Store the values from the basic settings form.
|
||||
*/
|
||||
function delegator_page_form_basic_submit($form, &$form_state) {
|
||||
if (!isset($form_state['page']->pid) && empty($form_state['page']->import)) {
|
||||
$form_state['page']->name = $form_state['values']['name'];
|
||||
}
|
||||
|
||||
$form_state['page']->admin_title = $form_state['values']['admin_title'];
|
||||
$form_state['page']->path = $form_state['values']['path'];
|
||||
|
||||
return $form;
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>No database operations were made during this _submit, and that's a very important distinction about this system.</p>
|
||||
|
||||
<h3>Proper handling of back button</h3>
|
||||
<p>When using <strong>'show back' => TRUE</strong> the cached data should be assigned to the <em>#default_value</em> form property. Otherwise when the user goes back to the previous step the forms default values instead of his (cached) input is used.</p>
|
||||
|
||||
<pre>
|
||||
/**
|
||||
* Form builder function for wizard.
|
||||
*/
|
||||
function wizardid_step2_form($form, &$form_state) {
|
||||
$form_state['my data'] = my_module_get_cache($form_state['cache name']);
|
||||
$form['example'] = array(
|
||||
'#type' => 'radios',
|
||||
'#title' => t('Title'),
|
||||
'#default_value' => $form_state['my data']->example ? $form_state['my data']->example : default,
|
||||
'#options' => array(
|
||||
'default' => t('Default'),
|
||||
'setting1' => t('Setting1'),
|
||||
),
|
||||
);
|
||||
|
||||
return $form;
|
||||
}
|
||||
|
||||
/**
|
||||
* Submit handler to prepare needed values for storing in cache.
|
||||
*/
|
||||
function wizardid_step2_form_submit($form, &$form_state) {
|
||||
$form_state['my data']->example = $form_state['values']['example'];
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>The data is stored in the <em>my data</em> object on submitting. If the user goes back to this step the cached <em>my data</em> is used as the default form value. The function <em>my_module_get_cache()</em> is like the cache functions explained above.</p>
|
||||
|
||||
<h2>Required fields, cancel and back buttons</h2>
|
||||
<p>If you have required fields in your forms, the back and cancel buttons will not work as expected since validation of the form will fail. You can add the following code to the top of your form validation to avoid this problem:</p>
|
||||
<pre>
|
||||
/**
|
||||
* Validation handler for step2 form
|
||||
*/
|
||||
function wizardid_step2_form_validate(&$form, &$form_state) {
|
||||
// if the clicked button is anything but the normal flow
|
||||
if ($form_state['clicked_button']['#next'] != $form_state['next']) {
|
||||
drupal_get_messages('error');
|
||||
form_set_error(NULL, '', TRUE);
|
||||
return;
|
||||
}
|
||||
// you form validation goes here
|
||||
// ...
|
||||
}
|
||||
</pre>
|
||||
|
||||
<h2>Wizard for anonymous users</h2>
|
||||
<p>If you are creating a wizard which is be used by anonymous users, you might run into some issues with drupal's caching for anonymous users. You can circumvent this by using hook_init and telling drupal to not cache your wizard pages:</p>
|
||||
<pre>
|
||||
/**
|
||||
* Implementation of hook init
|
||||
*/
|
||||
function mymodule_init() {
|
||||
// if the path leads to the wizard
|
||||
if (drupal_match_path($_GET['q'], 'path/to/your/wizard/*')) {
|
||||
// set cache to false
|
||||
$GLOBALS['conf']['cache'] = FALSE;
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
@ -1,11 +0,0 @@
|
||||
The Page Manager module creates and manages pages in your Drupal site. Pages are defined as items that have a path and provide output to the user. It is a complete round trip from getting user input to providing user output.
|
||||
|
||||
There are two types of pages that the Page Manager currently supports:
|
||||
<dl>
|
||||
<dt>Custom pages</dt>
|
||||
<dd>Custom pages are defined completely by the administrator. Their path, access control and visible menu characteristics are completely arbitrary.</dd>
|
||||
<dt>System pages</dt>
|
||||
<dd>System pages are defined by Drupal and Drupal modules. They primarily override pre-existing pages to provide different functionality. They often do not allow such features as access control in favor of what already exists, and they will usually 'fall back' to default Drupal behavior.
|
||||
</dl>
|
||||
|
||||
Both types of pages figure out what to show the user by using <strong>Variants</strong>. Variants are output handlers, and every page should have at least one. Most pages will simply have only one. Pages with multiple variants will choose one and only one Variant to display content to the user and will use the <strong>Selection Rules</strong> to figure out which Variant to display.
|
||||
@ -1,43 +0,0 @@
|
||||
task handler definition:
|
||||
title -- visible title of the task handler.
|
||||
description -- description of the task handler.
|
||||
task type -- The type of the task this handler can service.
|
||||
render -- callback of the function to render the handler. The arguments to this callback are specific to the task type.
|
||||
admin title -- callback to render the admin title as this handler is listed.
|
||||
params: $handler, $task, $subtask_id
|
||||
admin summary -- callback to render what's in the collapsible info as the handler is listed. Optional.
|
||||
params: $handler, $task, $subtask_id
|
||||
default conf -- either an array() of default conf data or a callback that returns an array.
|
||||
params: $handler, $task, $subtask_id
|
||||
save -- callback to call just prior to the task handler being saved so it can adjust its data.
|
||||
params: &$handler, $update (as drupal_write_record would receive)
|
||||
export -- callback to call just prior to the task being exported. It should return text to append to the export if necessary.
|
||||
params: &$handler, $indent
|
||||
|
||||
forms => array(
|
||||
'id' => array(
|
||||
'form' => form callback (receives $form, $form_state)
|
||||
'submit' => submit callback
|
||||
'validate' => validate callback
|
||||
'include' => an optional file to include to get functionality for this form. Must include full path.
|
||||
'no return' => hide the 'return' button, meaning that the form requires extra steps if submitted
|
||||
'alternate next' => an alternate next form. Used for hidden edit forms that don't have tabs.
|
||||
'no blocks' => if TRUE, use Drupal's mechanism to not render blocks for this form.
|
||||
)
|
||||
)
|
||||
),
|
||||
|
||||
'add forms' => array(
|
||||
'form1', => t('form title'),
|
||||
'form2', => t('form title'),
|
||||
// ...etc.../
|
||||
),
|
||||
'edit forms' => array(
|
||||
'id' => t('tab name'),
|
||||
'id2' => t('tab name'),
|
||||
),
|
||||
|
||||
If a form name is blank it is a 'hidden' form -- it has no tab but can still be reached.
|
||||
|
||||
|
||||
Notes: Because #required validation cannot be skipped when clicking cancel, please don't use it.
|
||||
@ -1,2 +0,0 @@
|
||||
|
||||
defines a task type, grouping tasks together and providing a common UI for them.
|
||||
@ -1,38 +0,0 @@
|
||||
task definition:
|
||||
title -- visible title of the task.
|
||||
description -- description of the task.
|
||||
hook menu -- function to delegate from hook_menu. Params: &$items, $task
|
||||
hook menu alter -- function to delegate from hook_menu_alter. Params: &$items, $task
|
||||
hook theme -- function to delegate from hook_theme. Params: &$items, $task
|
||||
|
||||
admin name -- if set an admin menu will appear in the delegator UI
|
||||
admin description -- to describe the admin menu
|
||||
|
||||
admin access callback -- if set, the callback to use to determine administrative
|
||||
access to this task. Defaults to user_access. Note that this is required even
|
||||
if delegator isn't handling administration, since this gets used to on handler
|
||||
edit forms.
|
||||
admin access arguments -- If set, the arguments to use to determine administrative
|
||||
access to this task. Defaults to array('administer delegator');
|
||||
|
||||
type -- The type of the task, used to determine which handlers can service it.
|
||||
|
||||
subtasks -- can be TRUE in which case it supports subtasks with the default
|
||||
configuration or a string (array?) with callbacks to fetch subtask data.
|
||||
subtask callback -- A callback which returns just one subtask. Param: $task, $subtask_id
|
||||
subtasks callback -- A callback which returns an array of all subtasks.
|
||||
This MUST return an array, even if it's empty.Param: $task
|
||||
|
||||
default handlers -- If the task contains any default handlers, they can be included here.
|
||||
|
||||
task names must not contain a - as that is used to separate the task name from the subtask ID.
|
||||
|
||||
subtasks implement data very similar to their parent task. In particular, they
|
||||
implement the following items exactly like their task:
|
||||
hook menu
|
||||
hook menu alter
|
||||
description
|
||||
admin name
|
||||
admin description
|
||||
admin access callback
|
||||
admin access arguments
|
||||
@ -1,2 +0,0 @@
|
||||
|
||||
Please visit <a href="http://drupal.org/node/528072">http://drupal.org/node/528072</a> to help provide this documentation page.
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user