add jett theme to the core

pull/483/merge
nightwing 2017-12-24 21:15:17 +04:00
rodzic 882e4b7d16
commit ba35d11ac3
22 zmienionych plików z 5173 dodań i 117 usunięć

Wyświetl plik

@ -511,6 +511,8 @@ module.exports = function(options) {
},
"plugins/c9.ide.theme.flat/flat-light",
"plugins/c9.ide.theme.flat/flat-dark",
"plugins/c9.ide.theme.jett/plugin",
{
packagePath: "plugins/c9.ide.layout.classic/preload",
themePrefix: options.themePrefix,

Wyświetl plik

@ -100,6 +100,7 @@ define(function(require, exports, module) {
var currentTheme;
var skin = settings.get("user/general/@skin");
var defaultThemes = {
"jett-dark": "plugins/c9.ide.theme.jett/ace.themes/jett",
"light": "ace/theme/cloud9_day",
"light-gray": "ace/theme/cloud9_day",
"flat-light": "ace/theme/cloud9_day",
@ -562,7 +563,7 @@ define(function(require, exports, module) {
var style = currentTheme && (currentTheme.isDark ? "dark" : "light");
if (e.force == false && e.theme.indexOf(style) != -1)
return;
if (e.type != "ace")
if (e.type != "ace" && defaultThemes[e.theme])
handle.setTheme(defaultThemes[e.theme]);
}, handle);
@ -1285,22 +1286,29 @@ define(function(require, exports, module) {
}
}), index == -1 ? undefined : index || themeCounter++, plugin || handle);
}
function addTheme(css, plugin) {
var theme = { cssText: css };
var firstLine = css.split("\n", 1)[0].replace(/\/\*|\*\//g, "").trim();
firstLine.split(";").forEach(function(n) {
if (!n) return;
var info = n.split(":");
theme[info[0].trim()] = info[1].trim();
});
theme.isDark = theme.isDark == "true";
function addTheme(theme, plugin) {
if (typeof theme == "string") {
var css = theme;
theme = { cssText: css };
var firstLine = css.split("\n", 1)[0].replace(/\/\*|\*\//g, "").trim();
firstLine.split(";").forEach(function(n) {
if (!n) return;
var info = n.split(":");
theme[info[0].trim()] = info[1].trim();
});
theme.isDark = theme.isDark == "true";
theme.id = "custom_themes/" + theme.name;
theme.customCss = css;
}
theme.id = "custom_themes/" + theme.name;
theme.customCss = css;
define.undef(theme.id);
define(theme.id, [], theme);
if (theme.cssText)
define(theme.id, [], theme);
themes[theme.id] = theme;
if (!theme.name)
theme.name = theme.caption;
themes[theme.caption || theme.id] = theme.id;
addThemeMenu(theme.name, theme.id, null, plugin);

Wyświetl plik

@ -1,7 +1,7 @@
define(function(require, exports, module) {
main.consumes = [
"PreferencePanel", "ace", "ui", "configure", "settings",
"preferences.experimental"
"preferences.experimental", "layout"
];
main.provides = ["preferences.themes"];
return main;
@ -10,6 +10,7 @@ define(function(require, exports, module) {
var PreferencePanel = imports.PreferencePanel;
var ui = imports.ui;
var ace = imports.ace;
var layout = imports.layout;
var configure = imports.configure;
var settings = imports.settings;
var experimental = imports["preferences.experimental"];
@ -29,24 +30,47 @@ define(function(require, exports, module) {
// var emit = plugin.getEmitter();
var intro;
var themeContainers = {};
var themes = [];
var loaded = false;
function load() {
if (loaded) return false;
loaded = true;
function update() {
if (!drawn) return;
var list = getThemes();
plugin.form.update([{
id: "syntax",
items: list
}]);
}
ace.on("addTheme", update);
ace.on("removeTheme", update);
layout.addTheme({
group: "classic",
color: "#252525;",
name: "dark",
});
layout.addTheme({
group: "classic",
color: "#3f3f3f;",
name: "dark-gray",
});
layout.addTheme({
group: "classic",
color: "#aaa;",
name: "light-gray",
hidden: !options.lightClassic,
});
layout.addTheme({
group: "classic",
color: "#dcdbdb;",
name: "light",
hidden: !options.lightClassic,
});
layout.addTheme({
group: "flat",
color: "#252525;",
name: "flat-dark",
hidden: !FLATDARK
});
layout.addTheme({
group: "flat",
color: "#dcdbdb;",
name: "flat-light",
});
}
var drawn;
@ -55,24 +79,7 @@ define(function(require, exports, module) {
drawn = true;
var list = getThemes();
var rb1, rb2, rb3, rb4, rb5, rb6;
var flatThemes = [];
rb6 = new ui.radiobutton({
group: "theme-color",
class: "themepicker",
style: "background:#252525;",
value: "flat-dark"
});
rb5 = new ui.radiobutton({
group: "theme-color",
class: "themepicker",
style: "background:#dcdbdb;",
value: "flat-light"
});
if (FLATDARK) flatThemes.push(rb6);
flatThemes.push(rb5);
plugin.form.add([
{
@ -99,9 +106,7 @@ define(function(require, exports, module) {
caption: "Flat Theme:",
style: "padding-top:5px"
}),
new ui.bar({
childNodes: flatThemes
})
themeContainers.flat = new ui.bar({})
]
})
},
@ -119,34 +124,7 @@ define(function(require, exports, module) {
caption: "Classic Theme:",
style: "padding-top:5px"
}),
new ui.bar({
childNodes: [
rb1 = new ui.radiobutton({
group: "theme-color",
class: "themepicker",
style: "background:#252525;",
value: "dark"
}),
rb2 = new ui.radiobutton({
group: "theme-color",
class: "themepicker",
style: "background:#3f3f3f;",
value: "dark-gray"
}),
// rb3 = new ui.radiobutton({
// group: "theme-color",
// class: "themepicker",
// style: "background:#aaa;",
// value: "light-gray"
// }),
// rb4 = new ui.radiobutton({
// group: "theme-color",
// class: "themepicker",
// style: "background:#dcdbdb;",
// value: "light"
// })
]
})
themeContainers.classic = new ui.bar({})
]
})
},
@ -164,21 +142,19 @@ define(function(require, exports, module) {
},
], plugin);
var change = function(e) {
settings.set("user/general/@skin", e.value);
};
var setTheme = function(e) {
[rb1, rb2, rb5, rb6].some(function(rb) {
if (rb.value == e.value) {
rb.select();
return true;
}
});
};
settings.on("user/general/@skin", setTheme);
setTheme({ value: settings.get("user/general/@skin") });
rb1.$group.on("afterchange", change);
function update() {
if (!drawn) return;
var list = getThemes();
plugin.form.update([{
id: "syntax",
items: list
}]);
}
ace.on("addTheme", update, plugin);
ace.on("removeTheme", update, plugin);
ui.buildDom([
["h1", null, "Themes"],
@ -188,10 +164,35 @@ define(function(require, exports, module) {
],
["p", { class: "hint" }, "Set all the colors free!"]
], intro.$int);
themeContainers.group = new apf.group();
layout.on("themeAdded", drawThemeSwatches);
drawThemeSwatches();
var change = function(e) {
settings.set("user/general/@skin", e.value);
};
var setTheme = function(e) {
[].concat(
themeContainers.flat.childNodes,
themeContainers.classic.childNodes
).some(function(rb) {
if (rb.value == e.value) {
rb.select();
return true;
}
});
};
settings.on("user/general/@skin", setTheme, plugin);
setTheme({ value: settings.get("user/general/@skin") });
themeContainers.group.on("afterchange", change);
}
/***** Methods *****/
function getThemes() {
var list = [];
var themes = ace.themes;
@ -207,6 +208,31 @@ define(function(require, exports, module) {
return list;
}
function drawThemeSwatches() {
var themes = layout.listThemes();
themeContainers.classic.childNodes.forEach(function(n) {
n.remove();
});
themeContainers.flat.childNodes.forEach(function(n) {
n.remove();
});
themes.forEach(function(theme) {
if (theme.hidden) return;
var container = theme.group == "flat" ? themeContainers.flat : themeContainers.classic;
container.appendChild(
new ui.radiobutton({
group: themeContainers.group,
class: "themepicker",
style: "background:" + theme.color,
value: theme.name,
tooltip: theme.name,
})
);
});
}
/***** Lifecycle *****/
plugin.on("load", function() {
@ -218,6 +244,8 @@ define(function(require, exports, module) {
plugin.on("unload", function() {
loaded = false;
drawn = false;
intro = null;
themeContainers = {};
});
/***** Register and define API *****/

Wyświetl plik

@ -320,6 +320,9 @@ define(function(require, exports, module) {
var html = document.createElement("p");
html.id = "ot_chat_" + msg.id;
html.userId = msg.userId;
if (msg.userId == workspace.myUserId)
html.className = "you";
var borderEl = document.createElement("span");
html.appendChild(borderEl);

Wyświetl plik

@ -196,9 +196,9 @@ define(function(require, module, exports) {
settings.on("read", function(e) {
// Defaults
settings.setDefaults("user/tabs", [
["show", "true"],
["title", "false"],
["asterisk", "false"]
["show", true],
["title", false],
["asterisk", false]
]);
settings.setDefaults("state/tabs", []);
@ -248,7 +248,7 @@ define(function(require, module, exports) {
settings.on("user/tabs/@asterisk", function(value) {
containers.forEach(function(container) {
if (value)
if (ui.isTrue(value))
ui.setStyleClass(container, "asterisk");
else
ui.setStyleClass(container, "", ["asterisk"]);

Wyświetl plik

@ -126,14 +126,18 @@ define(function(require, exports, module) {
emit("draw");
}
var allowedThemes = {
"dark": 1,
"dark-gray": 1,
"light-gray": 1,
"light": 1,
"flat-light": 1,
"flat-dark": 1
};
var allowedThemes = {};
function addTheme(data) {
allowedThemes[data.name] = data;
emit("themeAdded", data);
}
function listThemes() {
return Object.keys(allowedThemes).map(function(key) {
return allowedThemes[key];
});
}
function setImageResolution(value) {
if (window.matchMedia) {
@ -159,20 +163,22 @@ define(function(require, exports, module) {
theme = sTheme;
if (ui.packedThemes) {
preload.getTheme(theme, function(err, theme) {
preload.getTheme(theme, function(err, themeCss) {
if (err)
return;
if (sTheme !== theme)
return;
// Remove Current Theme
if (removeTheme)
removeTheme();
var url = options.staticPrefix.replace(/c9.ide.layout.classic\/?$/, "");
theme = theme.replace(/(url\(["']?)\/static\/plugins\//g, function(_, x) {
themeCss = themeCss.replace(/(url\(["']?)\/static\/plugins\//g, function(_, x) {
return x + url;
});
theme = setImageResolution(theme);
themeCss = setImageResolution(themeCss);
// Load the theme css
ui.insertCss(theme, false, {
ui.insertCss(themeCss, false, {
addOther: function(remove) { removeTheme = remove; }
});
changeTheme();
@ -596,7 +602,8 @@ define(function(require, exports, module) {
get hasTheme() {
return !ui.packedThemes || !!removeTheme
},
addTheme: addTheme,
listThemes: listThemes,
/**
* Returns an AMLElement that can server as a parent.
* @param {Plugin} plugin The plugin for which to find the parent.

Wyświetl plik

@ -33,11 +33,8 @@ define(function(require, exports, module) {
["skin", options.defaultTheme || "flat-dark"]
]);
if (!packed || options.loadTheme) return callback();
try {
var theme = settings.get("user/general/@skin");
return getTheme(theme, callback);
} catch (e) {}
async.forEach(Object.keys(themes), getTheme, callback);
var theme = settings.get("user/general/@skin");
return getTheme(theme, callback);
}
function getTheme(name, callback) {

Wyświetl plik

@ -0,0 +1,9 @@
MIT License
Copyright (c) 2018 Michael Jett
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Wyświetl plik

@ -0,0 +1,73 @@
# Cloud9 Jett Theme
### A flat theme for C9 IDE
Give your Cloud9 instance a modern look!
<img src="screenshot.png" alt="screenshot" width="100%">
## Features
- Animations!
- Retina ready!
- Modern fonts!
- Updated filetype icons!
## Compatibility
- Tested with C9 _v3.1.1022_
- Latest version of Chrome, Safari, Firefox
## Installation
1. Git clone or download this repo into `c9sdk/plugins/c9.ide.theme.jett`
2. Open `c9sdk/configs/client-default.js`. Before `return plugins;` add the following:
```js
{
packagePath: "plugins/c9.ide.theme.jett/plugin",
staticPrefix: staticPrefix + "/plugins/c9.ide.theme.jett"
}
```
> **Note**: This plugin styles collaborative features and has a hard set dependancy on `--collab` being enabled.
3. Open `c9sdk/configs/standalone.js`. Add the following somewhere in the config:
```js
{
packagePath: "./c9.ide.theme.jett/build-theme",
pathRoot: __dirname
}
```
4. Run cloud9 in `--collab` mode.
```
node server.js -p 8081 -a : --collab
```
5. Upon launching your Cloud9 instance you should have a new color option in _Preferences > Themes > Flat Theme_. This will allow you switch this theme on/off.
### Minification
If you want to run cloud9 with minification turned on ( `--packed` mode ), you'll need to rebuild assets.
```
scripts/makestandalone.sh --compress
```
### Customize CSS
This is a little manual at the moment.
1. Delete the current compilation. (`rm build/compile_jett.css`)
2. Restart cloud9. The server-side plugin will detect the missing asset and rebuild it.
## License
- MIT
## Contributing
Please submit a pull request through github.
## Author
- GitHub: https://github.com/jumbojett/

Wyświetl plik

@ -0,0 +1,158 @@
.ace-jett .ace_gutter {
background: #1C1D21;
color: #686b78
}
.ace-jett .ace_print-margin {
width: 0px;
}
.ace-jett {
background-color: #1C1D21;
color: #cbcdd2
}
.ace-jett .ace_cursor {
color: #cbcdd2
}
.ace-jett .ace_marker-layer .ace_selection {
background: #2f3137
}
.ace-jett.ace_multiselect .ace_selection.ace_start {
box-shadow: 0 0 3px 0px #1C1D21;
border-radius: 2px
}
.ace-jett .ace_marker-layer .ace_step {
background: #212227
}
.ace-jett .ace_marker-layer .ace_bracket {
margin: -1px 0 0 -1px;
border: 1px solid #65737e
}
.ace-jett .ace_marker-layer .ace_active-line {
background: #212227
}
.ace-jett .ace_gutter-active-line {
background-color: #212227;
}
.ace-jett .ace_marker-layer .ace_selected-word {
border: 1px solid #4f5b66
}
.ace-jett .ace_fold {
background-color: #8fa1b3;
border-color: #cbcdd2
}
.ace-jett .ace_keyword {
color: #78bd65
}
.ace-jett .ace_keyword.ace_operator {
color: #eb3d54
}
.ace-jett .ace_keyword.ace_other.ace_unit {
color: #ef7c2a
}
.ace-jett .ace_constant {
color: #ef7c2a
}
.ace-jett .ace_constant.ace_numeric {
color: #ef7c2a
}
.ace-jett .ace_constant.ace_character.ace_escape {
color: #ef7c2a
}
.ace-jett .ace_support.ace_function {
color: #eb3d54
}
.ace-jett .ace_support.ace_class {
color: #ffcb6b
}
.ace-jett .ace_support.ace_type {
color: #cbcdd2
}
.ace-jett .ace_storage {
color: #78bd65
}
.ace-jett .ace_invalid.ace_illegal {
color: #1C1D21;
background-color: #bf616a
}
.ace-jett .ace_string {
color: #4fb4d8
}
.ace-jett .ace_string.ace_regexp {
color: #80CBC4
}
.ace-jett .ace_comment {
color: #686b78
}
.ace-jett .ace_variable {
color: #e5cd52
}
.ace-jett .ace_meta.ace_tag {
color: #eb3d54
}
.ace-jett .ace_meta.ace_selector {
color: #78bd65
}
.ace-jett .ace_entity.ace_other.ace_attribute-name {
color: #FFCB6B
}
.ace-jett .ace_entity.ace_name.ace_function {
color: #e5cd52
}
.ace-jett .ace_entity.ace_name.ace_tag {
color: #ff5370
}
.ace-jett .ace_markup.ace_list {
color: rgba(255, 83, 112, 1.0)
}
.ace-jett .ace_indent-guide {
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAAXNSR0IArs4c6QAAAAlwSFlzAAALEwAACxMBAJqcGAAABCJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IlhNUCBDb3JlIDUuNC4wIj4KICAgPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICAgICAgPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIKICAgICAgICAgICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iCiAgICAgICAgICAgIHhtbG5zOmV4aWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vZXhpZi8xLjAvIgogICAgICAgICAgICB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iCiAgICAgICAgICAgIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyI+CiAgICAgICAgIDx0aWZmOlJlc29sdXRpb25Vbml0PjI8L3RpZmY6UmVzb2x1dGlvblVuaXQ+CiAgICAgICAgIDx0aWZmOkNvbXByZXNzaW9uPjU8L3RpZmY6Q29tcHJlc3Npb24+CiAgICAgICAgIDx0aWZmOlhSZXNvbHV0aW9uPjcyPC90aWZmOlhSZXNvbHV0aW9uPgogICAgICAgICA8dGlmZjpPcmllbnRhdGlvbj4xPC90aWZmOk9yaWVudGF0aW9uPgogICAgICAgICA8dGlmZjpZUmVzb2x1dGlvbj43MjwvdGlmZjpZUmVzb2x1dGlvbj4KICAgICAgICAgPGV4aWY6UGl4ZWxYRGltZW5zaW9uPjE8L2V4aWY6UGl4ZWxYRGltZW5zaW9uPgogICAgICAgICA8ZXhpZjpDb2xvclNwYWNlPjE8L2V4aWY6Q29sb3JTcGFjZT4KICAgICAgICAgPGV4aWY6UGl4ZWxZRGltZW5zaW9uPjI8L2V4aWY6UGl4ZWxZRGltZW5zaW9uPgogICAgICAgICA8ZGM6c3ViamVjdD4KICAgICAgICAgICAgPHJkZjpCYWcvPgogICAgICAgICA8L2RjOnN1YmplY3Q+CiAgICAgICAgIDx4bXA6TW9kaWZ5RGF0ZT4yMDE2LTAyLTE3VDAwOjAyOjgwPC94bXA6TW9kaWZ5RGF0ZT4KICAgICAgICAgPHhtcDpDcmVhdG9yVG9vbD5QaXhlbG1hdG9yIDMuNC4yPC94bXA6Q3JlYXRvclRvb2w+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgoedQbwAAAAEklEQVQIHWMwsXGrZ2JgZGgAAAkvAbkhTCViAAAAAElFTkSuQmCC) right repeat-y
}
.ace-jett .ace_diff,
.ace-jett .ace_diff.insert,
.ace-jett .ace_diff.delete {
border-color: #4f5b66 !important;
background-color: rgba(79, 91, 102, 0.5) !important;
}
.ace-jett .ace_diff-connector {
stroke: #4f5b66;
fill: rgba(79, 91, 102, 0.6);
}
.ace_diff-gutter.ace-jett {
background-color: #1C1D21 !important;
border-right: 1px solid #464e5e !important;
}

Wyświetl plik

@ -0,0 +1,39 @@
/* ***** BEGIN LICENSE BLOCK *****
* Distributed under the BSD license:
*
* Copyright (c) 2010, Ajax.org B.V.
* All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions are met:
* * Redistributions of source code must retain the above copyright
* notice, this list of conditions and the following disclaimer.
* * Redistributions in binary form must reproduce the above copyright
* notice, this list of conditions and the following disclaimer in the
* documentation and/or other materials provided with the distribution.
* * Neither the name of Ajax.org B.V. nor the
* names of its contributors may be used to endorse or promote products
* derived from this software without specific prior written permission.
*
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
* ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
* WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
* DISCLAIMED. IN NO EVENT SHALL AJAX.ORG B.V. BE LIABLE FOR ANY
* DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
* (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
* LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
* ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
* SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*
* ***** END LICENSE BLOCK ***** */
define(function(require, exports, module) {
exports.isDark = true;
exports.cssClass = "ace-jett";
exports.cssText = require("text!./jett.css");
var dom = require("ace/lib/dom");
dom.importCssString(exports.cssText, exports.cssClass);
});

Plik binarny nie jest wyświetlany.

Plik binarny nie jest wyświetlany.

Plik binarny nie jest wyświetlany.

Wyświetl plik

@ -0,0 +1,21 @@
{
"name": "",
"description": "",
"version": "0.0.1",
"author": "",
"contributors": [
{
"name": "",
"email": ""
}
],
"repository": {
"type": "git",
"url": ""
},
"plugins": {
"build-theme": {}
},
"categories": ["miscellaneous"],
"licenses": []
}

Wyświetl plik

@ -0,0 +1,276 @@
define(function(require, exports, module) {
main.consumes = [
"Plugin", "layout", "app",
"util", "tabManager", "ace",
];
main.provides = ["theme.jett"];
return main;
/**
* Client-side plugin for jett theme
* @method main
* @param {} options
* @param {} imports
* @param {} register
* @return
*/
function main(options, imports, register) {
var Plugin = imports.Plugin;
var layout = imports.layout;
var tabs = imports.tabManager;
var ace = imports.ace;
var services = imports.app.services;
var escapeHTML = require("ace/lib/lang").escapeHTML;
/***** Initialization *****/
var plugin = new Plugin("Ajax.org", main.consumes);
var emit = plugin.getEmitter();
var themeEnabled = false;
/**
* Called when plugin is loaded
* @method load
* @return
*/
function load() {
ace.addTheme({
caption: "Jett",
id: "plugins/c9.ide.theme.jett/ace.themes/jett"
}, plugin);
layout.addTheme({
group: "flat",
color: "rgb(41, 58, 86)",
name: "jett-dark",
defaults: {
output: {
backgroundColor: "#2b303b",
foregroundColor: "#767B85",
selectionColor: "#343d46",
},
}
});
layout.on("themeChange", function(e) {
if (e.theme == "jett-dark")
enableJett(true);
else if (themeEnabled)
enableJett(false);
});
layout.on("themeDefaults", function(e) {
});
}
/**
* Toggle the jett theme on/off
* @str an identifiable attribute
* @method enableJett
* @param {} enabled If true then jett theme is on
* @return
*/
function enableJett(enabled) {
// Update settings
themeEnabled = enabled;
// If the jett theme is enabled set some defaults and theme specific prefs
if (enabled) {
// Anytime the user switches tabs or themes make sure we have the correct tab colors
ace.on("themeChange", styleTabs, plugin);
tabs.on("focusSync", styleTabs, plugin);
// Set file icon when the tabs are drawn
tabs.on("tabCreate", onTabCreate, plugin);
enableFileIcons();
}
else {
ace.off("themeChange", styleTabs, plugin);
tabs.off("focusSync", styleTabs, plugin);
tabs.off("tabCreate", onTabCreate, plugin);
}
styleTabs();
// Refresh file icons
var tree = services.tree && services.tree.tree;
tree && tree.resize(true);
}
function onTabCreate(e) {
if (themeEnabled && e.tab.title && e.tab.path) {
setTabIcon(e.tab);
}
}
function enableFileIcons() {
if (enableFileIcons.called)
return;
enableFileIcons.called = true;
/**
* Add file icons to the file search results
*/
var navigate = services.navigate;
navigate && navigate.once("draw", function() {
var dp = navigate.tree.provider;
override(dp, 'renderRow', function(original) {
return function(row, html, config) {
// If jett is not enabled then return
if (!themeEnabled) {
return original.apply(this, arguments);
}
var path = dp.visibleItems[row];
var isSelected = dp.isSelected(row);
var filename = path.substr(path.lastIndexOf("/") + 1);
var icon = getIconClass(filename);
html.push("<div class='item " + (isSelected ? "selected " : "")
+ dp.getClassName(row) + "' style='height:" + dp.innerRowHeight + "px'><span class='filetree-icon " + icon + "'>"
+ dp.replaceStrong(filename) + "</span><small class='path'>" + dp.replaceStrong(path) + "</small></div>");
};
});
});
/*
* Customize file icons on the file tree
*/
var tree = services.tree;
tree.once("draw", function(e) {
override(tree.tree.model, 'getIconHTML', function(original) {
return function(node) {
// If jett is not enabled then return
if (!themeEnabled) {
return original.apply(this, arguments);
}
var icon = node.isFolder ? "folder" : getIconClass(node.label);
if (node.status === "loading") icon = "loading";
return "<span class='filetree-icon " + icon + "'></span>";
};
});
});
}
/**
* Helper function to help us extend current cloud9 events
* @method override
* @param {} object
* @param {} methodName
* @param {} callback
* @return
*/
function override(object, methodName, callback) {
object[methodName] = callback(object[methodName]);
}
/**
* Reusable function to get the CSS class of a file type
* @method getIconClass
* @param {} filename
* @return icon
*/
function getIconClass(filename) {
if (!filename) return '';
// Remove the path if it's a directory string
filename = filename.split("/").pop();
// Get the file.extention
var icon = filename.split(".").pop().toLowerCase();
filename = filename.toLowerCase();
if (filename == "package.json") icon = "npm";
if (filename == "composer.json") icon = "composer";
if (filename == "bower.json") icon = "bower";
if (filename == "gulpfile.js") icon = "gulp";
if (filename == "gruntfile.js") icon = "grunt";
return icon;
}
/***** Methods *****/
/**
* Active tabs with ACE editor get the same color as the current ACE theme
* @method styleTab
* @param {} e
* @return
*/
function styleTabs(e) {
var panes = tabs.getPanes();
panes.forEach(function(pane) {
// Add a file icon to the tab if jett is enabled
pane.getTabs().forEach(function(tab) {
setTabIcon(tab);
if (themeEnabled && tab.isActive()) {
if (ace.theme && ace.theme.bg && ace.theme.fg) {
// Color tabs based on their tab.aml.type
var colorHash = {
"editor::ace": ace.theme.bg,
"editor::terminal": "#000",
"editor::output": "#000",
"editor::preferences": "#25272C",
"editor::immediate": "#1C1D21"
};
tab.aml.$button.style.backgroundColor = (colorHash[tab.aml.type] || "iherit");
tab.aml.$button.style.color = ace.theme.fg;
}
}
else {
tab.aml.$button.style.backgroundColor = '';
tab.aml.$button.style.color = '';
}
});
});
}
/**
* Tabs get file icons!
* @method setTabIcon
* @param {} tab
* @return
*/
function setTabIcon(tab) {
if (!tab.path) return;
var iconHTML = (themeEnabled ? '<span class="filetree-icon '
+ getIconClass(tab.path)
+ '"></span>' : "")
+ escapeHTML(tab.title);
tab.aml.$button.querySelector(".sessiontab_title").innerHTML = iconHTML;
}
/***** Lifecycle *****/
plugin.on("load", function() {
load();
});
plugin.on("unload", function() {
enableJett(false);
themeEnabled = false;
});
/***** Register and define API *****/
/**
*
**/
plugin.freezePublicAPI({
});
register(null, {
"theme.jett": plugin
});
}
});

Plik binarny nie jest wyświetlany.

Po

Szerokość:  |  Wysokość:  |  Rozmiar: 116 KiB

Wyświetl plik

@ -1482,6 +1482,7 @@ apf.splitter.templates = {
}
apf.plane.setCursor(_self.type == "vertical" ? "ew-resize" : "ns-resize");
_self.$ext.classList.add("hover");
_self.$setStyleClass(this, _self.$baseCSSname + "Moving");
@ -1490,6 +1491,7 @@ apf.splitter.templates = {
if (!e) e = event;
_self.$setStyleClass(_self.$ext, "", [_self.$baseCSSname + "Moving"]);
_self.$ext.classList.remove("hover");
update(e, true);

Wyświetl plik

@ -132,9 +132,15 @@ function main(options, imports, register) {
compileLess: true,
lessLibs: [
"plugins/c9.ide.layout.classic/less/lesshat.less",
"plugins/c9.ide.layout.classic/themes/default-" + color + ".less",
"plugins/c9.ide.layout.classic/themes/" + color + ".less"
],
].concat(
color == "jett-dark" ? [
"plugins/c9.ide.theme.jett/less/overrides.less",
"plugins/c9.ide.theme.jett/less/variables.less"
] : [
"plugins/c9.ide.layout.classic/themes/default-" + color + ".less",
"plugins/c9.ide.layout.classic/themes/" + color + ".less"
]
),
staticPrefix: "plugins/c9.ide.layout.classic",
lessLibCacheKey: color,
basepath: pathConfig.root,

Wyświetl plik

@ -247,7 +247,7 @@ function checkImages(css, opts, cache) {
var file;
var count = 0;
var missingCount = 0;
css = css.replace(/(url\(['"]?)(?:\/static\/)?([^"')]+)|@file (\S+)/g, function(_, prefix, imagePath, fileId) {
css = css.replace(/(url\(['"]?)(?!https?:)(?:\/static\/)?([^"')]+)|@file (\S+)/g, function(_, prefix, imagePath, fileId) {
if (fileId) {
file = fileId;
return _;