+
{#if isCanClose}
{/if}
{title}
{#if contentTemplate}{#inc @(contentTemplate)}{#else}{content}{/if}
@@ -17,7 +17,7 @@
{title}
{#inc @(footerTemplate)}
{#else}
{#if okButton}
-
+
{/if}
{#if cancelButton && isCanClose}
ok时是否关闭弹窗
* @param {number} [options.data.minHeight] => 内容区域最小高度
* @param {number} [options.data.maxHeight] => 内容区域最大高度，超出则显示滚动条
+ * @param {string} [options.data.el] => 设置对话框要插入的父级元素，默认为document.body
+ * @param {boolean} [options.data.draggable=false] => 是否可以拖拽对话框
*/
const KLModal = Component.extend({
name: 'kl-modal',
@@ -48,9 +50,10 @@ const KLModal = Component.extend({
init() {
this.supr();
-
- // 如果不是内嵌组件，则嵌入到document.body中
- if (this.$root === this) this.$inject(document.body);
+ // 如果不是内嵌组件，则嵌入到data.el或document.body中
+ if (this.$root === this) {
+ this.$inject(this.data.el || document.body);
+ }
},
/**
* @method KLModal#close(result) 关闭对话框
diff --git a/src/js/components/notice/KLModal/index.mcss b/src/js/components/notice/KLModal/index.mcss
index 36dcbb15..8ac837a1 100644
--- a/src/js/components/notice/KLModal/index.mcss
+++ b/src/js/components/notice/KLModal/index.mcss
@@ -31,7 +31,7 @@
// - Mask the background page
background: rgba(0, 0, 0, 0.6);
- &:before {
+ &:after {
content: '';
display: inline-block;
vertical-align: middle;
diff --git a/src/js/components/notice/KLModal/index.md b/src/js/components/notice/KLModal/index.md
index bad8699e..8423e747 100644
--- a/src/js/components/notice/KLModal/index.md
+++ b/src/js/components/notice/KLModal/index.md
@@ -30,6 +30,33 @@ var component = new NEKUI.Component({
```
+
+### 配置要嵌入的父级元素
+
+设置modal嵌入的父级元素，默认为document.body
+
+
+
+```xml
+
+```
+
+```javascript
+var component = new NEKUI.Component({
+ template: template,
+ show: function() {
+ // 打开一个Modal，inject到#main元素里
+ var modal = new NEKUI.KLModal({
+ data: {
+ content: 'Modal内容',
+ el: '#main'
+ }
+ });
+ }
+});
+```
+
+
### 配置信息title
@@ -95,7 +122,7 @@ var component = new NEKUI.Component({
show: function() {
var modal = new NEKUI.KLModal({
data: {
-
+
name: 'Rabbit',
contentTemplate: ''
}
@@ -121,7 +148,7 @@ var component = new NEKUI.Component({
show: function() {
var modal = new NEKUI.KLModal({
data: {
-
+
name: 'Rabbit',
content: '自定义footer',
footerTemplate: ''
@@ -148,7 +175,7 @@ var component = new NEKUI.Component({
show: function(okDisabled) {
var modal = new NEKUI.KLModal({
data: {
-
+
okDisabled: okDisabled,
content: 'okDisabled设置为' + okDisabled,
}
@@ -174,7 +201,7 @@ var component = new NEKUI.Component({
show: function(cancelDisabled) {
var modal = new NEKUI.KLModal({
data: {
-
+
cancelDisabled: cancelDisabled,
cancelButton: true,
content: 'cancelDisabled设置为' + cancelDisabled,
@@ -203,7 +230,7 @@ var component = new NEKUI.Component({
show: function(hasFooter) {
var modal = new NEKUI.KLModal({
data: {
-
+
hasFooter: hasFooter,
content: 'hasFooter设置为' + hasFooter,
}
@@ -233,7 +260,7 @@ var component = new NEKUI.Component({
show: function(isCanClose) {
var modal = new NEKUI.KLModal({
data: {
-
+
isCanClose: isCanClose,
content: 'isCanClose设置为' + isCanClose,
}
@@ -263,7 +290,7 @@ var component = new NEKUI.Component({
show: function(okButton) {
var modal = new NEKUI.KLModal({
data: {
-
+
okButton: okButton,
content: '设置okButton的值',
}
@@ -290,7 +317,7 @@ var component = new NEKUI.Component({
show: function(cancelButton) {
var modal = new NEKUI.KLModal({
data: {
-
+
cancelButton: cancelButton,
content: '设置cancelButton'
}
@@ -324,7 +351,7 @@ var component = new NEKUI.Component({
show: function() {
var modal = new NEKUI.KLModal({
data: {
-
+
cancelButton: true,
content: '设置自定义样式',
class: 'u-modal-red',
@@ -352,7 +379,7 @@ var component = new NEKUI.Component({
show: function(noClose) {
var modal = new NEKUI.KLModal({
data: {
-
+
noClose: noClose,
content: '设置noClose:' + noClose,
}
@@ -430,6 +457,31 @@ var component = new NEKUI.Component({
```
+
+### 配置信息draggable
+设置Modal可拖拽，默认不可拖拽。
+
+
+
+```xml
+
+```
+
+```javascript
+var component = new NEKUI.Component({
+ template: template,
+ show: function() {
+ var modal = new NEKUI.KLModal({
+ data: {
+ content: 'Modal可拖拽',
+ draggable: true
+ }
+ });
+ }
+});
+```
+
+
### 实例方法cancel
通过实例调用，执行该实例对象的`cancel`事件
@@ -453,11 +505,11 @@ var component = new NEKUI.Component({
var modal = new NEKUI.KLModal({
data: data
});
-
+
modal.$on('cancel', function(){
console.log('监听cancel事件');
});
-
+
setTimeout(function(){
modal.cancel();
}, 3000);
@@ -535,11 +587,11 @@ var component = new NEKUI.Component({
var modal = new NEKUI.KLModal({
data: data
});
-
+
modal.$on('ok', function(){
console.log('监听ok事件');
});
-
+
setTimeout(function(){
modal.ok();
}, 3000);
@@ -584,11 +636,11 @@ var component = new NEKUI.Component({
template: template,
show: function(content, title, okButton, cancelButton) {
var modal = NEKUI.KLModal.confirm(content, title, okButton, cancelButton);
-
+
modal.$on('ok', function(){
console.log('监听ok事件');
});
-
+
modal.$on('cancel', function(){
console.log('监听cancel事件');
});
@@ -622,9 +674,9 @@ var component = new NEKUI.Component({
var component = new NEKUI.Component({
template: template,
show: function(content, title, okButton) {
-
+
var modal = NEKUI.KLModal.alert(content, title, okButton);
-
+
modal.$on('ok', function(){
console.log('监听ok事件');
});
diff --git a/src/js/components/widget/KLDraggable/dragdrop.js b/src/js/components/widget/KLDraggable/dragdrop.js
new file mode 100644
index 00000000..f44ab5e2
--- /dev/null
+++ b/src/js/components/widget/KLDraggable/dragdrop.js
@@ -0,0 +1,17 @@
+const dragdrop = {
+ dragging: false,
+ data: null,
+ proxy: null,
+ screenX: 0,
+ screenY: 0,
+ clientX: 0,
+ clientY: 0,
+ pageX: 0,
+ pageY: 0,
+ movementX: 0,
+ movementY: 0,
+ droppable: null,
+ droppables: [],
+};
+
+module.exports = dragdrop;
diff --git a/src/js/components/widget/KLDraggable/index.js b/src/js/components/widget/KLDraggable/index.js
new file mode 100644
index 00000000..aa385cc8
--- /dev/null
+++ b/src/js/components/widget/KLDraggable/index.js
@@ -0,0 +1,298 @@
+/**
+ * ------------------------------------------------------------
+ * @file KLDraggable 拖拽
+ * @author sensen(rainforest92@126.com)
+ * ------------------------------------------------------------
+ */
+
+const Component = require('../../../ui-base/component');
+const _ = require('../../../ui-base/_');
+const dragdrop = require('./dragdrop.js');
+
+/**
+ * @class KLDraggable
+ * @extend Component
+ * @param {object} [options.data] = 绑定属性
+ * @param {object} [options.data.data] => 拖拽时需要传递的数据
+ * @param {string/Dragable.Proxy/Element/function} [options.data.proxy] @=> 拖拽代理，即拖拽时显示的元素。默认值为`clone`，拖拽时拖起自身的一个拷贝；当值为`self`，拖拽时直接拖起自身。也可以用``自定义代理，或直接传入一个元素或函数。其他值表示不使用拖拽代理。
+ * @param {string} [options.data.direction=all] => 拖拽代理可以移动的方向，`all`为任意方向，`horizontal`为水平方向，`vertical`为垂直方向
+ * @param {boolean} [options.data.disabled=false] => 是否禁用
+ * @param {string} [options.data.class=z-draggable] => 可拖拽时（即disabled=false）给元素附加此class
+ * @param {string} [options.data.dragClass=z-drag] => 拖拽该元素时给元素附加此class
+ */
+const KLDraggable = Component.extend({
+ name: 'kl-draggable',
+ template: '{#inc this.$body}',
+ config() {
+ _.extend(this.data, {
+ data: null,
+ proxy: 'clone',
+ direction: 'all',
+ class: 'z-draggable',
+ dragClass: 'z-drag',
+ });
+ this.supr();
+
+ this._onMouseDown = this._onMouseDown.bind(this);
+ this._onBodyMouseMove = this._onBodyMouseMove.bind(this);
+ this._onBodyMouseUp = this._onBodyMouseUp.bind(this);
+ this.cancel = this.cancel.bind(this);
+ },
+ init() {
+ const inner = _.dom.element(this);
+ _.dom.on(inner, 'mousedown', this._onMouseDown);
+ this.supr();
+
+ this.$watch('disabled', (newValue) => {
+ if (newValue) {
+ _.dom.delClass(inner, this.data.class);
+ } else {
+ _.dom.addClass(inner, this.data.class);
+ }
+ });
+ },
+ _getProxy() {
+ if (typeof this.data.proxy === 'function') {
+ return this.data.proxy();
+ } else if (this.data.proxy instanceof window.Element) {
+ return this.data.proxy;
+ } else if (this.data.proxy instanceof KLDraggable.Proxy) {
+ const proxy = _.dom.element(this.data.proxy);
+ const dimension = _.dom.getDimension(_.dom.element(this));
+ this._initProxy(proxy, dimension);
+ document.body.appendChild(proxy);
+ return proxy;
+ } else if (this.data.proxy === 'clone') {
+ const self = _.dom.element(this);
+ const dimension = _.dom.getDimension(self);
+ const proxy = self.cloneNode(true);
+ this._initProxy(proxy, dimension);
+ self.parentElement.appendChild(proxy);
+ return proxy;
+ } else if (this.data.proxy === 'self') {
+ const proxy = _.dom.element(this);
+ const dimension = _.dom.getDimension(proxy);
+ this._initProxy(proxy, dimension);
+ return proxy;
+ }
+ },
+ _initProxy(proxy, dimension) {
+ proxy.style.left = `${dimension.left}px`;
+ proxy.style.top = `${dimension.top}px`;
+ proxy.style.zIndex = '2000';
+ proxy.style.position = 'fixed';
+ proxy.style.display = '';
+ },
+ _onMouseDown($event) {
+ if (this.data.disabled) {
+ return;
+ }
+ $event.preventDefault();
+ _.dom.on(document, 'mousemove', this._onBodyMouseMove);
+ _.dom.on(document, 'mouseup', this._onBodyMouseUp);
+ },
+ _onBodyMouseMove($event) {
+ const e = $event.event;
+ $event.preventDefault();
+ if (dragdrop.dragging === false) {
+ _.extend(dragdrop, {
+ dragging: true,
+ data: this.data.data,
+ proxy: this._getProxy(),
+ screenX: e.screenX,
+ screenY: e.screenY,
+ clientX: e.clientX,
+ clientY: e.clientY,
+ pageX: e.pageX,
+ pageY: e.pageY,
+ movementX: 0,
+ movementY: 0,
+ droppable: undefined,
+ }, true);
+
+ this._dragStart();
+ } else {
+ _.extend(dragdrop, {
+ screenX: e.screenX,
+ screenY: e.screenY,
+ clientX: e.clientX,
+ clientY: e.clientY,
+ pageX: e.pageX,
+ pageY: e.pageY,
+ movementX: e.screenX - dragdrop.screenX,
+ movementY: e.screenY - dragdrop.screenY,
+ }, true);
+
+ if (dragdrop.proxy) {
+ if (this.data.direction === 'all' || this.data.direction === 'horizontal') {
+ dragdrop.proxy.style.left = `${dragdrop.proxy.offsetLeft + dragdrop.movementX}px`;
+ }
+ if (this.data.direction === 'all' || this.data.direction === 'vertical') {
+ dragdrop.proxy.style.top = `${dragdrop.proxy.offsetTop + dragdrop.movementY}px`;
+ }
+ }
+
+ this._drag();
+ if (!dragdrop.dragging) {
+ return;
+ }
+
+ // Drop
+ let pointElement = null;
+ if (dragdrop.proxy) {
+ dragdrop.proxy.style.display = 'none';
+ pointElement = document.elementFromPoint(e.clientX, e.clientY);
+ dragdrop.proxy.style.display = '';
+ } else {
+ pointElement = document.elementFromPoint(e.clientX, e.clientY);
+ }
+
+ const pointDroppable = dragdrop.droppables.find((droppable) => { // eslint-disable-line array-callback-return
+ let element = pointElement;
+ const target = _.dom.element(droppable);
+ while (element) {
+ if (element === target) {
+ return true;
+ }
+ element = element.parentElement;
+ }
+ });
+
+ if (dragdrop.droppable !== pointDroppable) {
+ dragdrop.droppable && dragdrop.droppable._dragLeave(this);
+ if (!dragdrop.dragging) {
+ return;
+ }
+ pointDroppable && pointDroppable._dragEnter(this);
+ if (!dragdrop.dragging) {
+ return;
+ }
+ dragdrop.droppable = pointDroppable;
+ } else {
+ pointDroppable && pointDroppable._dragOver(this);
+ }
+ }
+ },
+ _onBodyMouseUp($event) {
+ $event.preventDefault();
+
+ dragdrop.droppable && dragdrop.droppable._drop(this);
+ this.cancel();
+ },
+ cancel() {
+ this._dragEnd();
+
+ _.extend(dragdrop, {
+ dragging: false,
+ data: null,
+ proxy: null,
+ screenX: 0,
+ screenY: 0,
+ clientX: 0,
+ clientY: 0,
+ pageX: 0,
+ pageY: 0,
+ movementX: 0,
+ movementY: 0,
+ droppable: undefined,
+ }, true);
+
+ _.dom.off(document, 'mousemove', this._onBodyMouseMove);
+ _.dom.off(document, 'mouseup', this._onBodyMouseUp);
+ },
+ _dragStart() {
+ if (dragdrop.proxy) {
+ _.dom.addClass(dragdrop.proxy, this.data.dragClass);
+ }
+
+ /**
+ * @event KLDraggable#dragstart 拖拽开始时触发
+ * @property {object} sender 事件发送对象，为当前draggable
+ * @property {object} origin 拖拽源，为当前draggable
+ * @property {object} source 拖拽起始元素
+ * @property {object} proxy 拖拽代理元素
+ * @property {object} data 拖拽时需要传递的数据
+ * @property {number} screenX 鼠标指针相对于屏幕的水平位置
+ * @property {number} screenY 鼠标指针相对于屏幕的垂直位置
+ * @property {number} clientX 鼠标指针相对于浏览器的水平位置
+ * @property {number} clientY 鼠标指针相对于浏览器的垂直位置
+ * @property {number} pageX 鼠标指针相对于页面的水平位置
+ * @property {number} pageY 鼠标指针相对于页面的垂直位置
+ * @property {number} movementX 鼠标指针水平位置相对于上次操作的偏移量
+ * @property {number} movementY 鼠标指针垂直位置相对于上次操作的偏移量
+ * @property {function} cancel 取消拖拽操作
+ */
+ this.$emit('dragstart', _.extend({
+ sender: this,
+ origin: this,
+ source: _.dom.element(this),
+ proxy: dragdrop.proxy,
+ cancel: this.cancel,
+ }, dragdrop));
+ },
+ _drag() {
+ /**
+ * @event KLDraggable#drag 正在拖拽时触发
+ * @property {object} sender 事件发送对象，为当前draggable
+ * @property {object} origin 拖拽源，为当前draggable
+ * @property {object} source 拖拽起始元素
+ * @property {object} proxy 拖拽代理元素
+ * @property {object} data 拖拽时需要传递的数据
+ * @property {number} screenX 鼠标指针相对于屏幕的水平位置
+ * @property {number} screenY 鼠标指针相对于屏幕的垂直位置
+ * @property {number} clientX 鼠标指针相对于浏览器的水平位置
+ * @property {number} clientY 鼠标指针相对于浏览器的垂直位置
+ * @property {number} pageX 鼠标指针相对于页面的水平位置
+ * @property {number} pageY 鼠标指针相对于页面的垂直位置
+ * @property {number} movementX 鼠标指针水平位置相对于上次操作的偏移量
+ * @property {number} movementY 鼠标指针垂直位置相对于上次操作的偏移量
+ * @property {function} cancel 取消拖拽操作
+ */
+ this.$emit('drag', _.extend({
+ sender: this,
+ origin: this,
+ source: _.dom.element(this),
+ proxy: dragdrop.proxy,
+ cancel: this.cancel,
+ }, dragdrop));
+ },
+ /**
+ * @private
+ */
+ _dragEnd() {
+ /**
+ * @event KLDraggable#dragend 拖拽结束时触发
+ * @property {object} sender 事件发送对象，为当前draggable
+ * @property {object} origin 拖拽源，为当前draggable
+ * @property {object} source 拖拽起始元素
+ * @property {object} proxy 拖拽代理元素
+ */
+ this.$emit('dragend', {
+ sender: this,
+ origin: this,
+ source: _.dom.element(this),
+ proxy: dragdrop.proxy,
+ });
+
+ if (dragdrop.proxy) {
+ if (this.data.proxy instanceof KLDraggable.Proxy || this.data.proxy === 'clone') {
+ dragdrop.proxy.parentElement.removeChild(dragdrop.proxy);
+ }
+ _.dom.delClass(dragdrop.proxy, this.data.dragClass);
+ }
+ },
+});
+
+KLDraggable.Proxy = Component.extend({
+ name: 'kl-draggable-proxy',
+ template: '{#inc this.$body}',
+ init() {
+ if (this.$outer instanceof KLDraggable) {
+ _.dom.element(this).style.display = 'none';
+ this.$outer.data.proxy = this;
+ }
+ },
+ // node: _.noop
+});
+
+module.exports = KLDraggable;
diff --git a/src/js/components/widget/KLDraggable/index.md b/src/js/components/widget/KLDraggable/index.md
new file mode 100644
index 00000000..87df0f87
--- /dev/null
+++ b/src/js/components/widget/KLDraggable/index.md
@@ -0,0 +1,40 @@
+---
+title: 拖拽
+---
+
+
+### 基本形式
+
+
+
+```xml
+
+```
+
+
+
+### 移动自身
+
+
+
+```xml
+
+
+
+```
+
+
+
+### 修改代理
+
+
+
+```xml
+
+
+
+
+
+
+```
+
\ No newline at end of file
diff --git a/src/js/components/widget/KLImagePreview/index.js b/src/js/components/widget/KLImagePreview/index.js
index 2e12b427..f5fc8429 100644
--- a/src/js/components/widget/KLImagePreview/index.js
+++ b/src/js/components/widget/KLImagePreview/index.js
@@ -15,6 +15,7 @@ const tpl = require('./index.html');
* name: 图片文件名称
* src: 图片文件的路径
* @param {number} [options.data.cur-index=0] => 必选，当前图片文件的索引, 默认第一项为当前项
+ * @param {string} [options.data.el] => 设置对话框要插入的父级元素，默认为document.body
*/
const KLImagePreview = Component.extend({
@@ -77,8 +78,10 @@ const KLImagePreview = Component.extend({
init(data) {
this.supr(data);
- // 如果不是内嵌组件，则嵌入到document.body中
- if (this.$root === this) this.$inject(document.body);
+ // 如果不是内嵌组件，则嵌入到data.el或document.body中
+ if (this.$root === this) {
+ this.$inject(data.el || document.body);
+ }
},
onClose() {
this.destroy();
diff --git a/src/js/components/widget/KLImagePreview/index.md b/src/js/components/widget/KLImagePreview/index.md
index e31d7c61..64d46262 100644
--- a/src/js/components/widget/KLImagePreview/index.md
+++ b/src/js/components/widget/KLImagePreview/index.md
@@ -33,3 +33,36 @@ var component = new NEKUI.Component({
});
```
+
+
+### 配置要嵌入的父级元素
+
+
+
+```xml
+
+```
+
+```javascript
+var component = new NEKUI.Component({
+ template: template,
+ onPreviewClick: function() {
+ const imageList = [{
+ name: 'Kaola.jpeg',
+ src: 'http://haitao.nos.netease.com/9b73692b3a6b46d2be1de7d3be893834.jpg'
+ }, {
+ name: 'Music.jpg',
+ src: 'http://haitao.nos.netease.com/7dfd9aa492694493be0fc1458d558536.jpg'
+ }];
+
+ new NEKUI.KLImagePreview({
+ data: {
+ imageList: imageList,
+ curIndex: 0,
+ el: '#main'
+ }
+ });
+ }
+});
+```
+
diff --git a/src/js/components/widget/KLLoading/index.js b/src/js/components/widget/KLLoading/index.js
index 7c02367b..4648a761 100644
--- a/src/js/components/widget/KLLoading/index.js
+++ b/src/js/components/widget/KLLoading/index.js
@@ -14,6 +14,7 @@ const _ = require('../../../ui-base/_');
* @param {boolean} [options.data.disabled=false] => 是否禁用, 禁用后调用show和hide则无效
* @param {boolean} [options.data.visible=false] => 是否显示
* @param {string} [options.data.class] => 补充class
+ * @param {string} [options.data.el] => 设置对话框要嵌入的父级元素，默认为document.body
*/
const KLLoading = Component.extend({
name: 'kl-loading',
@@ -27,8 +28,11 @@ const KLLoading = Component.extend({
},
init() {
this.supr();
- // 证明不是内嵌组件
- if (this.$root === this) this.$inject(document.body);
+
+ // 如果不是内嵌组件，则嵌入到data.el或document.body中
+ if (this.$root === this) {
+ this.$inject(this.data.el || document.body);
+ }
},
/**
* @method KLLoading#show() 显示组件
diff --git a/src/js/components/widget/KLLoading/index.md b/src/js/components/widget/KLLoading/index.md
index aa91c470..5685a4e2 100644
--- a/src/js/components/widget/KLLoading/index.md
+++ b/src/js/components/widget/KLLoading/index.md
@@ -8,7 +8,7 @@ title: 加载
```xml
-
+
```
@@ -49,3 +49,32 @@ var component = new NEKUI.Component({
});
```
+
+
+### 指定嵌入的父级元素
+
+
+
+```xml
+
+```
+
+```javascript
+var component = new NEKUI.Component({
+ template: template,
+ config: function(data) {
+ },
+ show: function() {
+ var loading = new NEKUI.KLLoading({
+ data: {
+ visible: true,
+ el: '#main'
+ }
+ });
+ setTimeout(function() {
+ loading.destroy();
+ }, 2000);
+ }
+});
+```
+
diff --git a/src/js/index.js b/src/js/index.js
index 420401db..de19775b 100644
--- a/src/js/index.js
+++ b/src/js/index.js
@@ -52,6 +52,7 @@ const Components = {
KLIcon: require('./components/widget/KLIcon'),
KLImagePreview: require('./components/widget/KLImagePreview'),
KLLocaleProvider: require('./components/widget/KLLocaleProvider'),
+ KLDraggable: require('./components/widget/KLDraggable'),
// Layout
KLTable: require('./components/layout/KLTable'),
diff --git a/src/mcss/base/effect.mcss b/src/mcss/base/effect.mcss
index d4bc9e1b..f1cf02c8 100644
--- a/src/mcss/base/effect.mcss
+++ b/src/mcss/base/effect.mcss
@@ -360,10 +360,11 @@ $pulse();
to { opacity: 0; }
}
.zoomOut { animation-name: zoomOut; }
-.modal_zoomOut .modal_dialog { animation-name: zoomOut; }
+.modal_zoomOut .modal_dialog { animation-name: zoomOut; $animation-duration: 0.3s; }
@keyframes zoomIn {
from { opacity: 0; transform: scale3d(.3, .3, .3); }
50% { opacity: 1; }
}
-.zoomIn { animation-name: zoomIn; }
\ No newline at end of file
+.zoomIn { animation-name: zoomIn; }
+.modal_zoomIn .modal_dialog { animation-name: zoomIn; $animation-duration: 0.3s; }
\ No newline at end of file