Skip to content

Commit 95af125

Browse files
RubaXaRubaXa
committed
* site
1 parent ff4244e commit 95af125

File tree

3 files changed

+108
-137
lines changed

3 files changed

+108
-137
lines changed

‎examples/watermark.html

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
// Settings
2525
var FileAPI = {
2626
html5: !!1
27-
, debug: !!0 // debug mode
27+
, debug: !0 // debug mode
2828
, staticPath: '../dist/'
2929
};
3030
</script>
@@ -129,7 +129,7 @@ <h4>Preview <span id="preview-processing" class="anim" style="display: none">(pr
129129
</div>
130130

131131
<div class="col" style="position: absolute; right: 10px;">
132-
<h4>Server response <span id="uploading" class="anim" style="display: none">(uploading&hellip;)</span></h4>
132+
<h4>Server response <span id="uploading" class="anim" style="display: none"></span></h4>
133133
<div id="server"></div>
134134
</div>
135135
<br clear="all"/>
@@ -181,7 +181,7 @@ <h4>EXIF</h4>
181181

182182
// Upload
183183
FileAPI.upload({
184-
url: '//www.rubaxa.org/FileAPI/server/ctrl.php'
184+
url: '//rubaxa.org/FileAPI/server/ctrl.php'
185185
, files: elms.file
186186
, imageTransform: {
187187
width: elms.width.value|0
@@ -190,6 +190,12 @@ <h4>EXIF</h4>
190190
, type: type // Output type
191191
, overlay: overlay // Add watermark
192192
}
193+
, upload: function (){
194+
document.getElementById('uploading').innerHTML = '(uploading&hellip;)';
195+
}
196+
, progress: function (evt){
197+
document.getElementById('uploading').innerHTML = (evt.loaded/evt.total * 100).toFixed(2) +'%';
198+
}
193199
, complete: function (err, xhr){
194200
if( err ){
195201
alert('Oops, server error.');

‎index.html

Lines changed: 96 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!doctype html>
2-
<html xmlns:x="http://xtpl.ru/">
2+
<html>
33
<head>
44
<meta charset="utf-8"/>
55
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
@@ -21,8 +21,8 @@
2121

2222
<script x-ctrl="main" type="text/xtpl-xml">
2323
<div id="sidebar" class="sidebar">
24-
<div>
25-
<div class="menu">
24+
<div class="menu">
25+
<div>
2626
<ul x:if="ctx.lang == 'ru'">
2727
<li><a href="https://github.com/mailru/FileAPI">Репозиторий на GitHub</a></li>
2828
<li><a href="http://rubaxa.github.io/jquery.fileapi/">jQuery Plugin</a></li>
@@ -33,7 +33,9 @@
3333
<li><a href="./examples/caman.html">Пример #5: CamanJS</a></li>
3434
<li><a href="#en/{{ctx.relpath}}">English version</a></li>
3535
</ul>
36+
</div>
3637

38+
<div>
3739
<ul x:if="ctx.lang != 'ru'">
3840
<li><a href="https://github.com/mailru/FileAPI">GitHub repository</a></li>
3941
<li><a href="http://rubaxa.github.io/jquery.fileapi/">jQuery Plugin</a></li>
@@ -45,7 +47,9 @@
4547
<li><a href="#ru/{{ctx.relpath}}">Русская версия</a></li>
4648
</ul>
4749
</div>
50+
</div>
4851

52+
<div>
4953
<div class="menu" x:repeat="item in ctx.api">
5054
<a href="#{{ctx.lang}}/{{item.label}}" class="menu__name">{{item['class']}}</a>
5155
<ul>
@@ -59,8 +63,9 @@
5963
</li>
6064
</ul>
6165
</div>
62-
<div style="height: 5px;"></div>
6366
</div>
67+
68+
<div style="height: 5px;"></div>
6469
</div>
6570

6671
<div>
@@ -70,81 +75,92 @@
7075
<div class="content">
7176
<div class="logo"></div>
7277

73-
<div x:repeat="item in ctx.api">
74-
<a name="{{ctx.lang}}/{{item.label}}"></a>
78+
<div>
79+
<div x:repeat="item in ctx.api">
80+
<a name="{{ctx.lang}}/{{item.label}}"></a>
7581

76-
<h3>{{item['class']}}</h3>
82+
<h3>{{item['class']}}</h3>
7783

78-
<div style="margin-bottom: 30px;">
79-
<div>
80-
{*item.descr[ctx.lang] | markdown*}
81-
</div>
82-
<br/>
83-
84-
<div style="margin-left: 20px;">
85-
<div x:repeat="prop in item.props">
86-
<a name="{{ctx.lang}}/{{prop.label}}"></a>
87-
<h4 class="fn" data-anchor="prop">
88-
<x:value>prop.name</x:value>
89-
<x:if test="prop.type != -1">
90-
<x:text value=": "/>
91-
<span class="type">{{prop.type}}</span>
92-
</x:if>
93-
</h4>
94-
95-
<div class="descr">
96-
{*prop.descr[ctx.lang] | markdown*}
97-
</div>
84+
<div style="margin-bottom: 30px;">
85+
<div>{*item.descr[ctx.lang] | markdown*}</div>
86+
<br/>
9887

99-
<div x:if="prop.code" x:highlight="prop.code.source[ctx.lang]"></div>
100-
<div x:if="prop.code" style="height: 20px;"></div>
101-
</div>
88+
<div style="margin-left: 20px;">
89+
<div>
90+
<div x:repeat="prop in item.props">
91+
<a name="{{ctx.lang}}/{{prop.label}}"></a>
10292

103-
<div x:repeat="fn in item.fn">
104-
<div x:repeat="variant in fn.variants">
105-
<a name="{{ctx.lang}}/{{fn.label}}"></a>
106-
107-
<h4 data-anchor="fn" class="fn">
108-
<span class="fn__name">{{fn.name}}</span>
109-
<span class="fn__args">
110-
<span>( </span>
111-
<span x:repeat="(idx, arg) in variant.args">
112-
<x:if test="arg.optional">
113-
<span class="fn__arg__optional">
114-
<span>[</span>
115-
<span x:if="idx">, </span>
116-
<span>{{arg.name}}:</span>
117-
<span class="type">{{arg.type}}</span>
118-
<span>]</span>
119-
</span>
120-
</x:if>
121-
122-
<x:if test="!arg.optional">
123-
<span x:if="idx">, </span>
124-
<span>{{arg.name}}:</span>
125-
<span class="type">{{arg.type}}</span>
126-
</x:if>
127-
</span>
128-
<span> ):</span>
129-
</span>
130-
<span class="type">{{fn.returns}}</span>
131-
</h4>
132-
133-
<div class="descr">
134-
{*variant.descr[ctx.lang] | markdown*}
135-
</div>
93+
<h4 class="fn" data-anchor="prop">
94+
<span><x:value>prop.name</x:value></span>
95+
<x:if test="prop.type != -1">
96+
<x:text value=": "/>
97+
<span class="type">{{prop.type}}</span>
98+
</x:if>
99+
</h4>
136100

137-
<ul>
138-
<li x:repeat="arg in variant.args">
139-
<b>{{arg.name}}</b>
140-
<span> — </span>
141-
<span>{{fn.args[arg.name][ctx.lang]}}</span>
142-
</li>
143-
</ul>
101+
<div class="descr">{*prop.descr[ctx.lang] | markdown*}</div>
144102

145-
<div x:if="fn.code" x:highlight="fn.code.source[ctx.lang]"></div>
103+
<div x:if="prop.code" x:highlight="prop.code.source[ctx.lang]"></div>
104+
<div x:if="prop.code" style="height: 20px;"></div>
105+
</div>
106+
</div>
146107

147-
<div style="height: 20px;"></div>
108+
<div>
109+
<div x:repeat="fn in item.fn">
110+
<div x:repeat="variant in fn.variants">
111+
<a name="{{ctx.lang}}/{{fn.label}}"></a>
112+
113+
<h4 data-anchor="fn" class="fn">
114+
<span class="fn__name">{{fn.name}}</span>
115+
<span class="fn__args">
116+
<span>( </span>
117+
<span>
118+
<span x:repeat="(idx, arg) in variant.args">
119+
<span>
120+
<x:if test="arg.optional">
121+
<span class="fn__arg__optional">
122+
<span>[</span>
123+
<span x:if="idx">, </span>
124+
<span>{{arg.name}}:</span>
125+
<span class="type">{{arg.type}}</span>
126+
<span>]</span>
127+
</span>
128+
</x:if>
129+
</span>
130+
131+
<span>
132+
<x:if test="!arg.optional">
133+
<span x:if="idx">, </span>
134+
<span>{{arg.name}}:</span>
135+
<span class="type">{{arg.type}}</span>
136+
</x:if>
137+
</span>
138+
</span>
139+
</span>
140+
<span> ):</span>
141+
</span>
142+
<span class="type">{{fn.returns}}</span>
143+
</h4>
144+
145+
<div class="descr">
146+
{*variant.descr[ctx.lang] | markdown*}
147+
</div>
148+
149+
<ul>
150+
<li x:repeat="arg in variant.args">
151+
<b>{{arg.name}}</b>
152+
<span> — </span>
153+
<span>{{fn.args[arg.name][ctx.lang]}}</span>
154+
</li>
155+
</ul>
156+
157+
<div>
158+
<div x:if="fn.code" x:highlight="fn.code.source[ctx.lang]"></div>
159+
</div>
160+
161+
<div style="height: 20px;"></div>
162+
</div>
163+
</div>
148164
</div>
149165
</div>
150166
</div>
@@ -211,20 +227,22 @@ <h4 data-anchor="fn" class="fn">
211227
};
212228

213229

214-
$(window).bind('hashchange', function (){
230+
$(window).bind('hashchange', function (evt, force){
215231
var href = location.toString().split('#').pop();
216232
var lang = (href.match(_rlang) || [,ctx.lang])[1];
217233

218234
ctx.lang = lang;
219235
ctx.relpath = href.replace(/^.+\//, '');
220236

221-
ctx.$apply(_updScroll);
222-
}).trigger('hashchange');
223-
224-
237+
if( !force ){
238+
ctx.$apply(_updScroll);
239+
}
240+
}).trigger('hashchange', true);
241+
//
242+
//
225243
$.getJSON('./statics/docs.json?ver='+FileAPI.version, function (json){
226244
ctx.api = json;
227-
ctx.$apply(_updScroll);
245+
ctx.$apply();
228246
});
229247

230248
window.ctx = ctx;

0 commit comments

Comments
 (0)