mbk-lab
/
wide
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

dialog 引入，替换 alert， prompt， confirm

This commit is contained in:
Van 2014-09-22 17:44:34 +08:00
parent 12fe2d6ab6
commit 64c6e8231a
10 changed files with 715 additions and 191 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
data/user_workspaces/admin/src/mytest/1.json Normal file
View File

0
data/user_workspaces/admin/src/mytest/q Normal file
View File

7
i18n/zh_CN.json
View File

@ -1,5 +1,7 @@
{
"wide": "Wide",
"isDelete": "是否删除",
"cancel": "取消",
"file": "文件",
"login": "登录",
"username": "用户名",
@ -14,6 +16,7 @@
"about": "关于",
"start_page": "起始页",
"create_file": "创建文件",
"create": "创建",
"create_dir": "创建目录",
"delete": "删除",
"save": "保存",
@ -28,5 +31,7 @@
"full_screen": "全屏",
"unread_notification": "未读通知",
"notification_2": "没有检查到 gocode，这将会导致 [自动完成] 失效",
"notification_3": "没有检查到 ide_stub，这将会导致 [跳转到声明]、[查找使用] 失效"
"notification_3": "没有检查到 ide_stub，这将会导致 [跳转到声明]、[查找使用] 失效",
"goto_line": "跳转到行",
"goto": "跳转"
}

19
static/css/base.css
View File

@ -236,24 +236,33 @@ ul {
/* start bottom-window-group */
.bottom-window-group .tabs {
background-color: #CAD3E3;
border-top: 1px solid #8E97A7;
border-bottom: 1px solid #8E97A7;
background-color: #E6E6E6;
border-top: 1px solid #A4A4A4;
border-bottom: 1px solid #9D9D9D;
}
.bottom-window-group .tabs > div {
cursor: pointer;
background-color: #DDD;
color: #8B8B8B;
border-right-color: #ADADAD;
}
.bottom-window-group .tabs > div.current {
background-color: #9F9F9F;
color: #FFF;
}
.bottom-window-group .tabs-panel {
height: 133px;
}
.bottom-window-group textarea {
.bottom-window-group textarea.output {
border-width: 0;
background-color: #FFF;
color: #555555;
height: 130px;
width: 100%;
height: 132px;
}
.bottom-window-group .notification,

84
static/css/dialog.css Normal file
View File

@ -0,0 +1,84 @@
/**
* dialig style
*
* @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
* @version 0.0.0.6, Jun 3, 2012
*/
.dialog-background {
height: 100%;
left: 0;
opacity: .3;
position: absolute;
top: 0;
width: 100%;
filter: alpha(opacity=30);
display: none;
background-color: #000000;
}
.dialog-panel {
position: absolute;
z-index: 100;
display: none;
-moz-user-select: none;
user-select: none;
}
.dialog-title {
float: left;
line-height: 22px;
margin-left: 3px;
color: #000;
}
.dialog-header-bg {
height: 23px;
background-color: #CCD5E5;
cursor: move;
width: 100%;
border: 1px solid #9B9B9B;
border-top-color: #8E97A7;
border-bottom-color: #8891A1;
}
.dialog-close-icon {
background-position: -15px 0;
cursor: pointer;
float: right;
height: 18px;
margin: 5px 3px 0 0;
width: 18px;
}
.dialog-close-icon:hover {
background-position: -15px -18px;
}
.dialog-main {
border: 1px solid #9B9B9B;
border-top-width: 0px;
background-color: #F0F0F0;
}
.dialog-main > div {
width: 100%;
}
.dialog-footer {
padding: 10px;
text-align: right;
}
#dialogRemoveConfirm,
#dialogNewFilePrompt,
#dialogNewDirPrompt,
#dialogGoLinePrompt {
padding: 10px 20px 0;
}
#dialogNewFilePrompt > input,
#dialogNewDirPrompt > input,
#dialogGoLinePrompt > input {
width: 100%;
}

350
static/js/dialog.js Normal file
View File

@ -0,0 +1,350 @@
/*
* Copyright (C) 2011, Liyuan Li
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
(function($) {
$.fn.extend({
dialog: {
version: "0.0.1.7",
author: "lly219@gmail.com"
}
});
var dpuuid = new Date().getTime();
var PROP_NAME = 'dialog';
var Dialog = function() {
this._defaults = {
"styleClass": {
"background": "dialog-background",
"panel": "dialog-panel",
"main": "dialog-main",
"footer": "dialog-footer",
"headerMiddle": "dialog-header-middle",
"headerBg": "dialog-header-bg",
"closeIcon": "dialog-close-icon",
"closeIconHover": "dialog-close-icon-hover",
"title": "dialog-title"
}
}
};
$.extend(Dialog.prototype, {
_attach: function(target, settings) {
if (!target.id) {
this.uuid++;
target.id = 'dp' + this.uuid;
}
var inst = this._newInst($(target));
inst.settings = $.extend({}, settings || {});
$.data(target, PROP_NAME, inst);
this._init(target);
},
/* Create a new instance object. */
_newInst: function(target) {
// escape jQuery meta chars
var id = target[0].id.replace(/([^A-Za-z0-9_])/g, '\\\\$1');
return {
id: id
};
},
_getInst: function(target) {
try {
return $.data(target, PROP_NAME);
} catch (err) {
throw 'Missing instance data for this dialog';
}
},
_destroyDialog: function(target) {
var inst = $.dialog._getInst(target);
var id = inst.id;
$.removeData(target, PROP_NAME);
$(target).prependTo("#" + id + "Wrap").unwrap();
$(target).removeAttr("style");
var styleClass = this._getDefaults($.dialog._defaults, inst.settings, "styleClass");
$("." + styleClass.background).remove();
$("#" + id + "Dialog").remove();
},
_init: function(target) {
var inst = this._getInst(target);
var id = inst.id,
settings = inst.settings;
var windowH = $(window).height(),
windowW = $(window).width();
var styleClass = this._getDefaults($.dialog._defaults, settings, "styleClass"),
dialogH = settings.height ? settings.height : parseInt(windowH * 0.6),
dialogW = settings.width ? settings.width : parseInt(windowW * 0.6);
// get settings or default value.
settings.title = settings.title ? settings.title : "";
settings.okText = settings.okText ? settings.okText : "Ok";
settings.cancelText = settings.cancelText ? settings.cancelText : "Cancel";
// build HTML.
var footerHTML = "",
headerHTML = "<div class='"
+ styleClass.headerBg + "'><div class='"
+ styleClass.title + "'>"
+ settings.title + "</div><a href='javascript:void(0);' class='"
+ styleClass.closeIcon + "'></a></div>";
// Sets footerHTML.
if (!settings.hideFooter) {
footerHTML = "<button>" + settings.okText +
"</button><button>"
+ settings.cancelText + "</button>";
}
var dialogHTML = "<div id='" + id + "Dialog' class='" + styleClass.panel
+ "' style='width: " + dialogW + "px;' onselectstart='return false;'>" + headerHTML
+ "<div class='" + styleClass.main + "'><div style='overflow: auto; height: "
+ dialogH + "px;'></div><div class='" + styleClass.footer + "'>"
+ footerHTML + "</div></div>";
var bgHTML = "";
if (settings.modal && $("." + styleClass.background).length === 0) {
var bgHeight = windowH < document.documentElement.scrollHeight
? document.documentElement.scrollHeight : windowH;
bgHTML = "<div style='height:" + bgHeight
+ "px;' class='" + styleClass.background + "'></div>";
}
// Package dialog.
$("#" + id).wrap("<div id='" + id + "Wrap'></div>");
var cloneObj = $(target).clone(true);
$(target).remove();
$('body').append(bgHTML + dialogHTML);
$($("#" + id + "Dialog ." + styleClass.main + " div").get(0)).append(cloneObj);
$(cloneObj).show();
// Sets position.
var top = "", left = "",
$dialog = $("#" + id + "Dialog");
if (settings.position) {
top = settings.position.top;
left = settings.position.left;
} else {
top = parseInt((windowH - dialogH) / 2);
left = parseInt((windowW - dialogW) / 2);
}
$dialog.css({
"top": top + "px",
"left": left + "px"
});
// Bind event.
$("#" + id + "Dialog ." + styleClass.closeIcon).bind("click", function() {
$.dialog._close(id, settings);
});
var $buttons = $("#" + id + "Dialog ." + styleClass.footer + " button");
$($buttons.get(1)).bind("click", function() {
$.dialog._close(id, settings);
});
$($buttons.get(0)).bind("click", function() {
if (settings.ok === undefined || settings.ok()) {
$.dialog._close(id, settings);
}
});
this._bindMove(id, styleClass.headerBg, dialogH, dialogW);
// esc exit
$(window).keyup(function(event) {
if (event.keyCode === 27) {
$.dialog._close(id, settings);
}
});
},
_bindMove: function(id, className) {
$("#" + id + "Dialog ." + className).mousedown(function(event) {
var _document = document;
if (!event) {
event = window.event;
}
var dialog = document.getElementById(id + "Dialog");
var x = event.clientX - parseInt(dialog.style.left),
y = event.clientY - parseInt(dialog.style.top);
_document.ondragstart = "return false;";
_document.onselectstart = "return false;";
_document.onselect = "document.selection.empty();";
if (this.setCapture) {
this.setCapture();
} else if (window.captureEvents) {
window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
}
_document.onmousemove = function(event) {
if (!event) {
event = window.event;
}
var positionX = event.clientX - x,
positionY = event.clientY - y;
if (positionX < 0) {
positionX = 0;
}
if (positionX > $(window).width() - $(dialog).width()) {
positionX = $(window).width() - $(dialog).width();
}
if (positionY < 0) {
positionY = 0;
}
if (positionY > $(window).height() - $(dialog).height()) {
positionY = $(window).height() - $(dialog).height();
}
dialog.style.left = positionX + "px";
dialog.style.top = positionY + "px";
};
_document.onmouseup = function() {
if (this.releaseCapture) {
this.releaseCapture();
} else if (window.captureEvents) {
window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
}
_document.onmousemove = null;
_document.onmouseup = null;
_document.ondragstart = null;
_document.onselectstart = null;
_document.onselect = null;
}
});
},
_close: function(id, settings) {
if ($("#" + id + "Dialog").css("display") === "none") {
return;
}
if (settings.close === undefined || settings.close()) {
$("#" + id + "Dialog").hide();
if (settings.modal) {
var styleClass = this._getDefaults($.dialog._defaults, settings, "styleClass");
$("." + styleClass.background).hide();
}
}
},
_closeDialog: function(target) {
var inst = this._getInst(target);
var id = inst.id,
settings = inst.settings;
$.dialog._close(id, settings);
},
_openDialog: function(target) {
var inst = this._getInst(target);
var id = inst.id,
settings = inst.settings;
$("#" + id + "Dialog").show();
if (settings.modal) {
var styleClass = this._getDefaults($.dialog._defaults, settings, "styleClass");
$("." + styleClass.background).show();
}
$("#" + id + "Dialog .dialog-footer button:eq(0)").focus();
if (typeof settings.afterOpen === "function") {
settings.afterOpen();
}
},
_updateDialog: function(target, data) {
var inst = this._getInst(target);
var id = inst.id,
settings = inst.settings;
var styleClass = this._getDefaults($.dialog._defaults, settings, "styleClass");
$.extend(settings, data);
var $dialog = $("#" + id + "Dialog");
if (data.position) {
$dialog.css({
"top": data.position.top,
"left": data.position.left
})
}
if (data.width) {
$dialog.width(data.width + 26);
$dialog.find("." + styleClass.main + " div")[0].style.width = data.width + "px";
$dialog.find("." + styleClass.headerBg).width(data.width + 18);
}
if (data.height) {
$dialog.find("." + styleClass.main + " div")[0].style.height = data.height + "px";
}
if (data.title) {
$dialog.find("." + styleClass.title).html(data.title);
}
if (data.modal !== undefined) {
if (data.modal) {
$("." + styleClass.background).show();
} else {
$("." + styleClass.background).hide();
}
}
if (data.hideFooter !== undefined) {
if (data.hideFooter) {
$dialog.find("." + styleClass.footer).hide();
} else {
$dialog.find("." + styleClass.footer).show();
}
}
},
_getDefaults: function(defaults, settings, key) {
if (key === "styleClass") {
if (settings.theme === "default" || settings.theme === undefined) {
return defaults.styleClass;
}
settings.styleClass = {};
for (var styleName in defaults[key]) {
settings.styleClass[styleName] = settings.theme + "-" + defaults.styleClass[styleName];
}
} else if (key === "height" || key === "width") {
if (settings[key] === null || settings[key] === undefined) {
return "auto";
} else {
return settings[key] + "px";
}
} else {
if (settings[key] === null || settings[key] === undefined) {
return defaults[key];
}
}
return settings[key];
}
});
$.fn.dialog = function(options) {
var otherArgs = Array.prototype.slice.call(arguments);
if (typeof options === 'string') {
otherArgs.shift();
return $.dialog['_' + options + 'Dialog'].apply($.dialog, [this[0]].concat(otherArgs));
}
return this.each(function() {
$.dialog._attach(this, options);
});
};
$.dialog = new Dialog();
// Add another global to avoid noConflict issues with inline event handlers
window['DP_jQuery_' + dpuuid] = $;
})(jQuery);

4
static/js/editor.js
View File

@ -122,9 +122,7 @@ var editors = {
};
CodeMirror.commands.gotoLine = function (cm) {
var line = prompt("Go To Line: ", "0");
cm.setCursor(CodeMirror.Pos(line - 1, 0));
$("#dialogGoLinePrompt").dialog("open");
};
CodeMirror.commands.doNothing = function (cm) {

157
static/js/tree.js
View File

@ -1,6 +1,6 @@
var tree = {
// 递归获取当前节点展开中的最后一个节点
getCurrentNodeLastNode: function (node) {
getCurrentNodeLastNode: function(node) {
var returnNode = node.children[node.children.length - 1];
if (returnNode.open) {
return tree.getCurrentNodeLastNode(returnNode);
@ -9,7 +9,7 @@ var tree = {
}
},
// 按照树展现获取下一个节点
getNextShowNode: function (node) {
getNextShowNode: function(node) {
if (node.level !== 0) {
if (node.getParentNode().getNextNode()) {
return node.getParentNode().getNextNode();
@ -20,7 +20,7 @@ var tree = {
return node.getNextNode();
}
},
isBottomNode: function (node) {
isBottomNode: function(node) {
if (node.open) {
return false;
}
@ -39,7 +39,7 @@ var tree = {
}
}
},
getTIdByPath: function (path) {
getTIdByPath: function(path) {
var nodes = tree.fileTree.transformToArray(tree.fileTree.getNodes());
for (var i = 0, ii = nodes.length; i < ii; i++) {
if (nodes[i].path === path) {
@ -50,7 +50,7 @@ var tree = {
return undefined;
},
fileTree: undefined,
_isParents: function (tId, parentTId) {
_isParents: function(tId, parentTId) {
var node = tree.fileTree.getNodeByTId(tId);
if (!node || !node.parentTId) {
return false;
@ -62,143 +62,20 @@ var tree = {
}
}
},
newFile: function () {
newFile: function() {
$("#dirRMenu").hide();
var name = prompt("Name", "");
if (!name) {
return false;
}
var request = newWideRequest();
request.path = wide.curNode.path + '\\' + name;
request.fileType = "f";
$.ajax({
type: 'POST',
url: '/file/new',
data: JSON.stringify(request),
dataType: "json",
success: function (data) {
if (!data.succ) {
return false;
}
var suffix = name.split(".")[1],
iconSkin = "ico-ztree-other ";
switch (suffix) {
case "html", "htm":
iconSkin = "ico-ztree-html ";
break;
case "go":
iconSkin = "ico-ztree-go ";
break;
case "css":
iconSkin = "ico-ztree-css ";
break;
case "txt":
iconSkin = "ico-ztree-text ";
break;
case "sql":
iconSkin = "ico-ztree-sql ";
break;
case "properties":
iconSkin = "ico-ztree-pro ";
break;
case "md":
iconSkin = "ico-ztree-md ";
break;
case "js", "json":
iconSkin = "ico-ztree-js ";
break;
case "xml":
iconSkin = "ico-ztree-xml ";
break;
case "jpg", "jpeg", "bmp", "gif", "png", "svg", "ico":
iconSkin = "ico-ztree-img ";
break;
}
tree.fileTree.addNodes(wide.curNode, [{
"name": name,
"iconSkin": iconSkin,
"path": request.path,
"mode": data.mode
}]);
}
});
$("#dialogNewFilePrompt").dialog("open");
},
newDir: function () {
newDir: function() {
$("#dirRMenu").hide();
var name = prompt("Name", "");
if (!name) {
return false;
}
var request = newWideRequest();
request.path = wide.curNode.path + '\\' + name;
request.fileType = "d";
$.ajax({
type: 'POST',
url: '/file/new',
data: JSON.stringify(request),
dataType: "json",
success: function (data) {
if (!data.succ) {
return false;
}
tree.fileTree.addNodes(wide.curNode, [{
"name": name,
"iconSkin": "ico-ztree-dir ",
"path": request.path
}]);
}
});
$("#dialogNewDirPrompt").dialog("open");
},
removeIt: function () {
removeIt: function() {
$("#dirRMenu").hide();
$("#fileRMenu").hide();
if (!confirm("Remove it?")) {
return;
}
var request = newWideRequest();
request.path = wide.curNode.path;
$.ajax({
type: 'POST',
url: '/file/remove',
data: JSON.stringify(request),
dataType: "json",
success: function (data) {
if (!data.succ) {
return false;
}
tree.fileTree.removeNode(wide.curNode);
if ("ico-ztree-dir " !== wide.curNode.iconSkin) {
// 是文件的话，查看 editor 中是否被打开，如打开则移除
for (var i = 0, ii = editors.data.length; i < ii; i++) {
if (editors.data[i].id === wide.curNode.tId) {
$(".edit-header .tabs > div[data-index=" + wide.curNode.tId + "]").find(".ico-close").click();
break;
}
}
} else {
for (var i = 0, ii = editors.data.length; i < ii; i++) {
if (tree._isParents(editors.data[i].id, wide.curNode.tId)) {
$(".edit-header .tabs > div[data-index=" + editors.data[i].id + "]").find(".ico-close").click();
i--;
ii--;
}
}
}
}
});
$("#dialogRemoveConfirm").dialog("open");
},
init: function () {
init: function() {
var request = newWideRequest();
$.ajax({
@ -206,7 +83,7 @@ var tree = {
url: '/files',
data: JSON.stringify(request),
dataType: "json",
success: function (data) {
success: function(data) {
if (data.succ) {
var dirRMenu = $("#dirRMenu");
var fileRMenu = $("#fileRMenu");
@ -215,7 +92,7 @@ var tree = {
selectedMulti: false
},
callback: {
onRightClick: function (event, treeId, treeNode) {
onRightClick: function(event, treeId, treeNode) {
if (treeNode) {
wide.curNode = treeNode;
if ("ico-ztree-dir " !== treeNode.iconSkin) { // 如果右击了文件
@ -235,7 +112,7 @@ var tree = {
}
}
},
onClick: function (event, treeId, treeNode, clickFlag) {
onClick: function(event, treeId, treeNode, clickFlag) {
tree._onClick(treeNode);
}
}
@ -245,7 +122,7 @@ var tree = {
}
});
},
_onClick: function (treeNode) {
_onClick: function(treeNode) {
if (wide.curNode) {
for (var i = 0, ii = editors.data.length; i < ii; i++) {
// 该节点文件已经打开
@ -270,7 +147,7 @@ var tree = {
url: '/file',
data: JSON.stringify(request),
dataType: "json",
success: function (data) {
success: function(data) {
if (!data.succ) {
alert(data.msg);

247
static/js/wide.js
View File

@ -1,9 +1,9 @@
var outputWS = new WebSocket(config.channel.output + '/output/ws?sid=' + config.wideSessionId);
outputWS.onopen = function () {
outputWS.onopen = function() {
console.log('[output onopen] connected');
};
outputWS.onmessage = function (e) {
outputWS.onmessage = function(e) {
console.log('[output onmessage]' + e.data);
var data = JSON.parse(e.data);
@ -20,10 +20,10 @@ outputWS.onmessage = function (e) {
url: '/run',
data: JSON.stringify(request),
dataType: "json",
beforeSend: function (data) {
beforeSend: function(data) {
$('.bottom-window-group .output').text('');
},
success: function (data) {
success: function(data) {
}
});
@ -54,11 +54,11 @@ outputWS.onmessage = function (e) {
$('.bottom-window-group .output').text($('.bottom-window-group .output').text() + data.output);
}
};
outputWS.onclose = function (e) {
outputWS.onclose = function(e) {
console.log('[output onclose] disconnected (' + e.code + ')');
delete outputWS;
};
outputWS.onerror = function (e) {
outputWS.onerror = function(e) {
console.log('[output onerror] ' + e);
};
@ -66,26 +66,201 @@ var wide = {
curNode: undefined,
curEditor: undefined,
bottomWindowTab: undefined,
_initLayout: function () {
_initDialog: function() {
$("#dialogRemoveConfirm").dialog({
"height": 26,
"width": 260,
"title": config.label.delete,
"okText": config.label.delete,
"cancelText": config.label.cancel,
"afterOpen": function() {
$("#dialogRemoveConfirm > b").html('"' + wide.curNode.name + '"');
},
"ok": function() {
var request = newWideRequest();
request.path = wide.curNode.path;
$.ajax({
type: 'POST',
url: '/file/remove',
data: JSON.stringify(request),
dataType: "json",
success: function(data) {
if (!data.succ) {
return false;
}
$("#dialogRemoveConfirm").dialog("close");
tree.fileTree.removeNode(wide.curNode);
if ("ico-ztree-dir " !== wide.curNode.iconSkin) {
// 是文件的话，查看 editor 中是否被打开，如打开则移除
for (var i = 0, ii = editors.data.length; i < ii; i++) {
if (editors.data[i].id === wide.curNode.tId) {
$(".edit-header .tabs > div[data-index=" + wide.curNode.tId + "]").find(".ico-close").click();
break;
}
}
} else {
for (var i = 0, ii = editors.data.length; i < ii; i++) {
if (tree._isParents(editors.data[i].id, wide.curNode.tId)) {
$(".edit-header .tabs > div[data-index=" + editors.data[i].id + "]").find(".ico-close").click();
i--;
ii--;
}
}
}
}
});
}
});
$("#dialogNewFilePrompt").dialog({
"height": 32,
"width": 260,
"title": config.label.create_file,
"okText": config.label.create,
"cancelText": config.label.cancel,
"afterOpen": function() {
$("#dialogNewFilePrompt > input").val('').focus();
},
"ok": function() {
var request = newWideRequest(),
name = $("#dialogNewFilePrompt > input").val()
request.path = wide.curNode.path + '\\' + name;
request.fileType = "f";
$.ajax({
type: 'POST',
url: '/file/new',
data: JSON.stringify(request),
dataType: "json",
success: function(data) {
if (!data.succ) {
return false;
}
$("#dialogNewFilePrompt").dialog("close");
var suffix = name.split(".")[1],
iconSkin = "ico-ztree-other ";
switch (suffix) {
case "html", "htm":
iconSkin = "ico-ztree-html ";
break;
case "go":
iconSkin = "ico-ztree-go ";
break;
case "css":
iconSkin = "ico-ztree-css ";
break;
case "txt":
iconSkin = "ico-ztree-text ";
break;
case "sql":
iconSkin = "ico-ztree-sql ";
break;
case "properties":
iconSkin = "ico-ztree-pro ";
break;
case "md":
iconSkin = "ico-ztree-md ";
break;
case "js", "json":
iconSkin = "ico-ztree-js ";
break;
case "xml":
iconSkin = "ico-ztree-xml ";
break;
case "jpg", "jpeg", "bmp", "gif", "png", "svg", "ico":
iconSkin = "ico-ztree-img ";
break;
}
tree.fileTree.addNodes(wide.curNode, [{
"name": name,
"iconSkin": iconSkin,
"path": request.path,
"mode": data.mode
}]);
}
});
}
});
$("#dialogNewDirPrompt").dialog({
"height": 32,
"width": 260,
"title": config.label.create_dir,
"okText": config.label.create,
"cancelText": config.label.cancel,
"afterOpen": function() {
$("#dialogNewDirPrompt > input").val('').focus();
},
"ok": function() {
var name = $("#dialogNewDirPrompt > input").val(),
request = newWideRequest();
request.path = wide.curNode.path + '\\' + name;
request.fileType = "d";
$.ajax({
type: 'POST',
url: '/file/new',
data: JSON.stringify(request),
dataType: "json",
success: function(data) {
if (!data.succ) {
return false;
}
$("#dialogNewDirPrompt").dialog("close");
tree.fileTree.addNodes(wide.curNode, [{
"name": name,
"iconSkin": "ico-ztree-dir ",
"path": request.path
}]);
}
});
}
});
$("#dialogGoLinePrompt").dialog({
"height": 32,
"width": 260,
"title": config.label.goto_line,
"okText": config.label.goto,
"cancelText": config.label.cancel,
"afterOpen": function() {
$("#dialogGoLinePrompt > input").val('').focus();
},
"ok": function() {
var line = parseInt($("#dialogGoLinePrompt > input").val());
$("#dialogGoLinePrompt").dialog("close");
wide.curEditor.setCursor(CodeMirror.Pos(line - 1, 0));
wide.curEditor.focus();
}
});
},
_initLayout: function() {
var mainH = $(window).height() - $(".menu").height() - $(".footer").height() - 2;
$(".content, .ztree").height(mainH);
$(".edit-panel").height(mainH - $(".bottom-window-group").height());
},
_initBottomWindowGroup: function () {
_initBottomWindowGroup: function() {
this.bottomWindowTab = new Tabs({
id: ".bottom-window-group",
clickAfter: function (id) {
clickAfter: function(id) {
this._$tabsPanel.find("." + id).focus();
}
});
},
init: function () {
init: function() {
this._initLayout();
this._initBottomWindowGroup();
$("body").bind("mousedown", function (event) {
$("body").bind("mousedown", function(event) {
if (!(event.target.id === "dirRMenu" || $(event.target).closest("#dirRMenu").length > 0)) {
$("#dirRMenu").hide();
}
@ -101,8 +276,9 @@ var wide = {
}
});
this._initDialog();
},
_save: function () {
_save: function() {
var request = newWideRequest();
request.file = $(".edit-header .current span:eq(0)").attr("title");
request.code = wide.curEditor.getValue();
@ -112,29 +288,32 @@ var wide = {
url: '/file/save',
data: JSON.stringify(request),
dataType: "json",
success: function (data) {
success: function(data) {
}
});
},
saveFile: function () {
saveFile: function() {
// 格式化后会对文件进行保存
this.fmt();
},
saveAllFiles: function () {
// TODO: save all files
console.log("TODO: ssave all files");
saveAllFiles: function() {
// TODO: save all open files
for (var i = 0, ii = editors.data.length; i < ii; i++) {
}
console.log("TODO: save all files");
},
closeFile: function () {
closeFile: function() {
// TODO: close file
},
closeAllFiles: function () {
closeAllFiles: function() {
// TODO: close all files
},
exit: function () {
exit: function() {
// TODO: exit
},
// 构建 & 运行.
run: function () {
run: function() {
var request = newWideRequest();
request.file = $(".edit-header .current span:eq(0)").attr("title");
request.code = wide.curEditor.getValue();
@ -146,14 +325,14 @@ var wide = {
url: '/build',
data: JSON.stringify(request),
dataType: "json",
beforeSend: function (data) {
beforeSend: function(data) {
$('.bottom-window-group .output').text('');
},
success: function (data) {
success: function(data) {
}
});
},
goget: function () {
goget: function() {
var request = newWideRequest();
request.file = $(".edit-header .current span:eq(0)").attr("title");
@ -162,14 +341,14 @@ var wide = {
url: '/go/get',
data: JSON.stringify(request),
dataType: "json",
beforeSend: function (data) {
beforeSend: function(data) {
$('.bottom-window-group .output').text('');
},
success: function (data) {
success: function(data) {
}
});
},
goinstall: function () {
goinstall: function() {
var request = newWideRequest();
request.file = $(".edit-header .current span:eq(0)").attr("title");
request.code = wide.curEditor.getValue();
@ -179,16 +358,16 @@ var wide = {
url: '/go/install',
data: JSON.stringify(request),
dataType: "json",
beforeSend: function (data) {
beforeSend: function(data) {
$('.bottom-window-group .output').text('');
},
success: function (data) {
success: function(data) {
}
});
},
fmt: function () {
fmt: function() {
var path = $(".edit-header .current span:eq(0)").attr("title");
var mode = wide.curNode.mode;
var mode = wide.curEditor.getOption("mode");
var request = newWideRequest();
request.file = path;
@ -203,7 +382,7 @@ var wide = {
url: '/go/fmt',
data: JSON.stringify(request),
dataType: "json",
success: function (data) {
success: function(data) {
if (data.succ) {
wide.curEditor.setValue(data.code);
}
@ -217,7 +396,7 @@ var wide = {
url: '/html/fmt',
data: JSON.stringify(request),
dataType: "json",
success: function (data) {
success: function(data) {
if (data.succ) {
wide.curEditor.setValue(data.code);
}
@ -246,7 +425,7 @@ var wide = {
}
};
$(document).ready(function () {
$(document).ready(function() {
wide.init();
tree.init();
menu.init();

38
view/index.html
View File

@ -12,6 +12,7 @@
<link rel="stylesheet" href="{{.conf.StaticServer}}/static/js/lib/ztree/zTreeStyle.css">
<link rel="stylesheet" href="{{.conf.StaticServer}}/static/css/dialog.css?{{.conf.StaticResourceVersion}}">
<link rel="stylesheet" href="{{.conf.StaticServer}}/static/css/base.css?{{.conf.StaticResourceVersion}}">
<link rel="stylesheet" href="{{.conf.StaticServer}}/static/css/side.css?{{.conf.StaticResourceVersion}}">
</head>
@ -166,22 +167,42 @@
<span class="notification-count" title="{{.i18n.unread_notification}}">Notification!</span>
</div>
<script type="text/javascript">
<div id="dialogRemoveConfirm">
{{.i18n.isDelete}} <b></b>?
</div>
<div id="dialogNewFilePrompt">
<input/>
</div>
<div id="dialogNewDirPrompt">
<input/>
</div>
<div id="dialogGoLinePrompt">
<input/>
</div>
<script>
var config = {
channel: {
editor: {{.conf.EditorChannel}},
shell: {{.conf.ShellChannel}},
output: {{.conf.OutputChannel}},
session: {{.conf.SessionChannel}}
"label": {
"delete": "{{.i18n.delete}}",
"cancel": "{{.i18n.cancel}}",
"goto_line": "{{.i18n.goto_line}}",
"goto": "{{.i18n.goto}}",
"create": "{{.i18n.create}}",
"create_file": "{{.i18n.create_file}}",
"create_dir": "{{.i18n.create_dir}}",
},
wideSessionId: {{.session.Id}}
"channel": {
"editor": '{{.conf.EditorChannel}}',
"shell": '{{.conf.ShellChannel}}',
"output": '{{.conf.OutputChannel}}',
"session": '{{.conf.SessionChannel}}'
},
"wideSessionId": '{{.session.Id}}'
};
// 发往 Wide 的所有 AJAX 请求需要使用该函数创建请求参数.
function newWideRequest() {
var ret = {
sid: config.wideSessionId
}
return ret;
}
@ -222,6 +243,7 @@
<script type="text/javascript" src="{{.conf.StaticServer}}/static/js/lint/json-lint.js?{{.conf.StaticResourceVersion}}"></script>
<script type="text/javascript" src="{{.conf.StaticServer}}/static/js/lint/go-lint.js?{{.conf.StaticResourceVersion}}"></script>
<script type="text/javascript" src="{{.conf.StaticServer}}/static/js/tabs.js?{{.conf.StaticResourceVersion}}"></script>
<script type="text/javascript" src="{{.conf.StaticServer}}/static/js/dialog.js?{{.conf.StaticResourceVersion}}"></script>
<script type="text/javascript" src="{{.conf.StaticServer}}/static/js/editor.js?{{.conf.StaticResourceVersion}}"></script>
<script type="text/javascript" src="{{.conf.StaticServer}}/static/js/notification.js?{{.conf.StaticResourceVersion}}"></script>
<script type="text/javascript" src="{{.conf.StaticServer}}/static/js/tree.js?{{.conf.StaticResourceVersion}}"></script>